fonde_ui library

Desktop-first Flutter UI component library.

Import this library to access all fonde_ui components and theme utilities.

Classes

FondeAccessibilityConfig
A class representing accessibility settings.
FondeAccessibilityController
Controls FondeAccessibilityConfig.
FondeActionButtonColors
Class defining action button colors For overlay action buttons (e.g., ellipsis menu button in stack grid)
FondeApp
The root widget for a fonde_ui application.
FondeBaseColors
Class defining base colors Basic color definitions used throughout the application
FondeBodyText
Body (content area)
FondeBorderRadius
App specific BorderRadius using squircle parameters.
FondeBorderRadiusValues
Constant class for border radii that conform to design guidelines. Allows only specified values to enforce a consistent design.
FondeBorderSide
App specific BorderSide presets.
FondeButton
Common Button for App app
FondeButtonColors
Class defining button colors
FondeButtonGroup
A component that groups and displays buttons.
FondeButtonGroupItem
An item for use within a FondeButtonGroup.
FondeCaptionText
Caption (content area)
FondeCheckbox
Common Checkbox for Fonde UI.
FondeCircularProgressIndicator
Circular progress indicator with accessibility support.
FondeCodeBlockText
Code block body
FondeCodeInlineText
Inline code
FondeCollapsedSidebarLayout
Layout when the sidebar is hidden.
FondeColorPicker
A desktop-style color picker widget.
FondeColorScheme
Class representing app-specific color configuration
FondeColorScope
Standard color definitions provided by the color scope.
FondeConfirmationDialog
Confirmation dialog
FondeContainer
A container widget with app-specific padding.
FondeContextMenu
A generic context menu widget based on MenuAnchor.
FondeContextMenuButton
A context menu with an icon button as the trigger.
FondeContextMenuDivider
A divider for use in a FondeContextMenu items list.
FondeContextMenuItem
A context menu item.
FondeDatePicker
A date picker widget backed by table_calendar.
FondeDialog
Common Dialog for App app
FondeDialogColors
Class defining dialog colors
FondeDivider
App common Divider
FondeDraggable<T extends Object>
A desktop-first draggable widget.
FondeDragTarget<T extends Object>
A desktop-first drag target.
FondeDropdownColors
Class defining dropdown colors
FondeDropdownMenu<T>
Common DropdownMenu for App app
FondeEntityLabelMetaText
Metadata label
FondeEntityLabelPrimaryText
Primary label (graph node)
FondeEntityLabelSecondaryText
Secondary label (graph edge)
FondeExpansionTile
ExpansionTile with App application standard styles applied.
FondeExternalPageControllerPagination
PageController integrated version for external navigation.
FondeExternalPagination
Pagination arrows for external navigation.
FondeEyeDropper
Provides eyedropper (color sampling) functionality within the Flutter window.
FondeEyeDropperButton
A button that activates the eyedropper. Requires FondeEyeDropper to be present in the widget tree (e.g. via FondeApp(enableEyeDropper: true)).
FondeEyeDropperState
FondeFloatingPanelScope
InheritedWidget that marks a floating panel scope.
FondeFontConfig
A class representing font settings.
FondeFormItemColumn
Form item component (vertical layout). Arranges labels and controls vertically.
FondeFormItemRow
Form item component (horizontal layout). Arranges labels and controls in a single row.
FondeFormList
Form list component.
FondeGestureDetector
A custom gesture detector that distinguishes between single and double taps without the delay inherent in the default GestureDetector when both are used.
FondeHeading1Text
Shortcut widgets for text elements.
FondeHeading2Text
Medium heading (content area)
FondeHeading3Text
Small heading (content area)
FondeIcon
Icon widget compliant with App design system.
FondeIconButton
App common IconButton
FondeIconLabelButton
A button that displays an icon and a label with optional trailing widget.
FondeIcons
Centralized management class for icons used throughout the App application.
FondeIconTheme
Defines the set of icons used throughout Fonde UI components.
FondeIconThemeController
Controls the active FondeIconTheme.
FondeInputColors
Class defining input field colors
FondeInteractiveColors
Class consolidating interactive element colors
FondeLaunchBar
Launch bar
FondeLaunchBarColors
Class defining launch bar colors
FondeLaunchBarItem
Launch bar item
FondeLaunchBarWrapper
Wrapper widget for the launch bar.
FondeLinearProgressIndicator
Linear progress indicator with accessibility support.
FondeListColors
Class defining list colors
FondeListTile
A list tile that handles selection state and applies appropriate theme colors.
FondeLocalizationConfig
Global localization configuration for fonde_ui.
FondeMainContentArea
A widget that displays the main content area of the application.
FondeMainToolbar
A title bar placed within the main content area.
FondeMasterDetailLayout
A layout widget that implements the master-detail pattern.
FondeNavigationBadge
A badge element to be displayed on a navigation item.
FondeNavigationController
Controls navigation item selection and group expansion.
FondeNavigationControllerScope
Wraps a subtree so descendants can access FondeNavigationController.
FondeNavigationDivider
Divider between navigation items.
FondeNavigationStateData
Navigation state data.
FondeNotification
A single notification entry managed by FondeNotificationOverlay.
FondeNotificationController
Controller that manages the notification queue.
FondeNotificationControllerScope
Scope that provides FondeNotificationController to the widget tree.
FondeNotificationOverlay
Wraps a widget tree with a notification overlay anchored to a screen edge.
FondeNumberField
Numeric input field with increment/decrement buttons.
FondeOutlineItem
An outline item with standard App application styling.
FondeOutlineView<T>
An outline view with standard App application styling.
FondeOverflowMenu
Menu that contains features that cannot be displayed due to screen size.
FondeOverflowMenuDivider
A divider in an overflow menu.
FondeOverflowMenuEntry
Base class for overflow menu entries.
FondeOverflowMenuItem
An item in an overflow menu.
FondePadding
A padding widget that conforms to the 4px grid system. Used as a replacement for the standard Padding widget to prevent grid system violations.
FondePageControllerPagination
Pagination using a page controller (dots only).
FondePageIndicator
App-specific page indicator.
FondePagination
A simple pagination component with only page dots.
FondePanel
App general-purpose panel component
FondePanelColors
Class defining panel colors
FondePhysicalModel
A physical model widget providing unified shadow specifications for App applications
FondePhysicalModelVariants
Predefined variants of FondePhysicalModel
FondePlatformMenus
Utility class for building platform menu bar items.
FondePopover
Common Popover for App app
FondePopoverColors
Class defining popover colors
FondePopoverConfig
Capsule providing default configuration for FondePopover
FondePopupMenu<T>
A popup menu compliant with the App design system.
FondePopupMenuDivider
A class representing a divider in a popup menu.
FondePopupMenuDividerEntry<T>
FondePopupMenuEntry<T>
An entry in a popup menu (item or divider).
FondePopupMenuItem<T>
A class representing an item in a popup menu.
FondePopupMenuItemEntry<T>
FondePrimarySide
The primary side area composing the launch bar and sidebar pane.
FondePrimarySidebarController
Controls the visibility of the primary sidebar.
FondePrimarySidebarToolbar
Title bar for the primary sidebar.
FondeQuickInputColors
Class defining quick input colors
FondeRadioButton<T>
Common RadioButton for App app.
FondeRangeSlider
A range slider variant that allows selecting a range of values.
FondeRectangleBorder
App common Figma-style squircle border widget.
FondeScaffold
The top-level scaffold layout of a fonde_ui application.
FondeScrollView
FondeSearchController
Controls the current search query.
FondeSearchControllerScope
Wraps a subtree so descendants can access FondeSearchController.
FondeSearchField
A platform-adaptive search field widget with suggestions support.
FondeSecondarySidebarController
Controls the visibility of the secondary sidebar.
FondeSecondarySidebarToolbar
Title bar for the secondary sidebar.
FondeSecondarySidebarWidthController
Controls the width of the secondary sidebar.
FondeSection
A section container with a title and description.
FondeSegmentedButton<T extends Object>
A themed segmented button that automatically applies colors from FondeColorConfig.
FondeSelectionDecorator
Decorator for managing selection state.
FondeSelectionState<T>
Helper class for managing selection state.
FondeShortcutBinding
A keyboard shortcut binding for use with FondeShortcutScope.
FondeShortcutRegistry
A registry that collects all FondeShortcutBindings from a FondeShortcutScope subtree for display purposes (e.g. command palette, keyboard shortcut overlay).
FondeShortcutScope
Scope-aware keyboard shortcut manager for desktop applications.
FondeSidebar
A general-purpose widget that represents the application's sidebar.
FondeSideBarColors
Class defining sidebar colors
FondeSidebarControllerScope
Wraps a subtree with sidebar controller scopes.
FondeSidebarList
A container for navigation items.
FondeSidebarListGroup
A collapsible group of navigation items.
FondeSidebarListHeader
A header element that represents a section.
FondeSidebarListItem
A widget that displays a single navigation item.
FondeSidebarPane
A pane that combines a toolbar and sidebar content.
FondeSidebarWidthController
Controls the width of the primary sidebar.
FondeSlider
A theme-aware slider widget.
FondeSmallText
Supplementary text (content area)
FondeSnackBar
App-specific wrapper for ScaffoldMessenger + SnackBar.
FondeSpacing
A spacing widget that enforces the 4px grid system. Used as a replacement for SizedBox, it displays a warning or error for values that do not conform to the grid system.
FondeSpacingValues
Constants for spacing values conforming to the 4px grid system.
FondeSplitButton
App app common SplitButton
FondeSplitButtonAction
Action item for FondeSplitButton
FondeSplitPane
A resizable split pane for use inside content areas.
FondeStatefulColors
Class defining state-based colors
FondeStatusBar
A status bar widget displayed at the bottom of the screen.
FondeStatusBarColors
Class defining status bar colors
FondeStatusBarDivider
A vertical divider for use inside FondeStatusBar.
FondeStatusBarItem
A single item in the status bar (icon + optional label).
FondeStatusColors
Class defining status display colors
FondeSwitch
A toggle switch widget for Fonde UI.
FondeTab
Individual tab definition.
FondeTabBar
App-style tab bar. Wraps Flutter's TabBar to provide app-specific accessibility and styling.
FondeTabContent
Definition of tab content.
FondeTabItem
Definition class for a tab item. Used in icon-based tab navigation.
FondeTabLazyContent
A widget that provides lazy loading of content.
FondeTableBodyText
Table body
FondeTableColumn<T>
Column definition for FondeTableView.
FondeTableFooterText
Table footer
FondeTableHeaderText
Table header
FondeTableView<T>
A desktop-optimized table view component.
FondeTabView
App app-specific tab view widget. Used in combination with FondeTabBar to provide a tab-switchable view.
FondeTagsField
Label tag editing field
FondeTagView
A tag view widget for displaying entity labels or tags.
FondeText
A text widget that automatically applies typography styles based on the app theme.
FondeTextField
App-specific text field
FondeTextStyleBuilder
A utility class that builds a TextStyle from an FondeTextVariant.
FondeThemeColorController
Controls the active accent color (FondeThemeColorType).
FondeThemeColorDefinition
Definition of theme colors.
FondeThemeColorScheme
Theme color scheme.
FondeThemeController
Controls the active FondeThemeData.
FondeThemeData
A class representing theme settings.
FondeThemeManager
Internal widget used by FondeApp to own and rebuild FondeThemeScope whenever any controller changes.
FondeThemePresets
Collection of theme presets.
FondeThemeScope
Holds the resolved theme state and propagates it down the widget tree.
FondeToast
A toast widget displayed briefly at a specified position.
FondeToolbar
Data-driven toolbar backed by FondeToolbarController.
FondeToolbarColors
Class defining toolbar colors
FondeToolbarController
Controls toolbar item selection and enabled state.
FondeToolbarControllerScope
Wraps a subtree so descendants can access FondeToolbarController.
FondeToolbarGroup
Item group for the toolbar.
FondeToolbarItem
Toolbar item widget.
FondeTooltip
A rich-content tooltip that supports keybinding display, multi-line content, and structured title + body layout.
FondeTypographyConfig
A class representing typography settings.
FondeUiAreaColors
Class consolidating UI area colors
FondeUiBodyText
Body text (UI component)
FondeUiCaptionText
Caption (UI component)
FondeUiHeading1Text
Large heading (UI component)
FondeUiHeading2Text
Medium heading (UI component)
FondeUiHeading3Text
Small heading (UI component)
FondeUILocalizations
Callers can lookup localized strings with an instance of FondeUILocalizations returned by FondeUILocalizations.of(context).
FondeUiSmallText
Small text (UI component)
FondeVerticalDivider
Vertical FondeDivider
LucideIcons
SquircleBorder
A ShapeBorder that draws a squircle (smooth rounded rectangle).
SquircleBorderRadius
A BorderRadius-compatible class that carries squircle parameters.

Enums

FondeCheckboxFillStyle
Fill style of FondeCheckbox.
FondeCheckboxShape
Shape of FondeCheckbox.
FondeDialogImportance
Enum representing dialog importance
FondeDragFeedbackStyle
Desktop-appropriate drag feedback style.
FondeDropdownMenuAlignment
Horizontal alignment of FondeDropdownMenu
FondeDropdownMenuPosition
Vertical position of FondeDropdownMenu
FondeExpansionIconPosition
Enum to specify the icon position of ExpansionTile.
FondeIconButtonShape
Shape of the icon button
FondeIconColor
FondeIconSize
Icon size presets.
FondeNotificationType
Defines the type/severity of a notification.
FondePaginationDirection
Enum representing pagination direction.
FondePopoverAnimation
Animation type for FondePopover
FondeSidebarListItemStyle
The visual style of navigation items.
FondeSidebarStyle
The visual style of the sidebar.
FondeSnackBarType
Enum defining snack bar types.
FondeSwitchStyle
Visual style of FondeSwitch.
FondeTabBarPosition
Position of the tab bar.
FondeTableColumnStyle
Controls the column separator style in FondeTableView.
FondeTableRowDragStyle
Controls what is shown as the drag overlay during row reordering.
FondeTableRowReorderIndicator
Controls the visual indicator shown at the drop position during row reordering.
FondeTableSortDirection
Sort direction for FondeTableView.
FondeTextVariant
The available text variants for FondeText.
FondeThemeColorType
Defines the types of theme colors.
FondeToastType
Enum defining toast types.
StartingDayOfWeek
Days of the week that the calendar can start with.

Extensions

FondeColorExtensions on Color
Extension methods for the Color class.
FondeIconFactories on FondeIcon
FondeThemeContext on BuildContext
Convenience accessors on BuildContext for fonde_ui theme data.

Constants

fondeDefaultIconTheme → const FondeIconTheme
Default icon theme based on LucideIcons.

Functions

lookupFondeUILocalizations(Locale locale) FondeUILocalizations
showFondeColorPickerDialog({required BuildContext context, Color initialColor = Colors.blue, bool showAlpha = false, List<Color>? palette, bool showEyeDropper = false}) Future<Color?>
Shows a FondeColorPicker in a dialog using showFondeDialog.
showFondeConfirmationDialog(BuildContext context, {required String message, required List<String> warningItems, VoidCallback? onConfirm, VoidCallback? onCancel, String confirmLabel = 'Execute', String cancelLabel = 'Cancel', bool isDestructive = false}) Future<bool?>
Helper function to show confirmation dialog
showFondeDatePickerDialog({required BuildContext context, required DateTime firstDate, required DateTime lastDate, DateTime? initialDate, DateTime? selectedDate, dynamic locale, StartingDayOfWeek startingDayOfWeek = StartingDayOfWeek.monday, bool enabledDayPredicate(DateTime)?, List<Object?> eventLoader(DateTime)?}) Future<DateTime?>
Shows a FondeDatePicker inside a showFondeDialog-style dialog.
showFondeDialog<T>({required BuildContext context, String? title, String? subtitle, Widget? child, WidgetBuilder? builder, Widget? footer, double? width, double? height, double? heightRatio, double? maxWidth, double? maxHeight, double? minWidth, double? minHeight, EdgeInsetsGeometry? padding = const EdgeInsets.all(FondeSpacingValues.xl), double? headerBottomSpacing, double? dividerHorizontalPadding, double elevation = 8.0, double? cornerRadius, double? cornerSmoothing, Color? backgroundColor, bool barrierDismissible = true, Color? barrierColor, String? barrierLabel, bool useSafeArea = true, bool useRootNavigator = true, RouteSettings? routeSettings, Offset? anchorPoint, TraversalEdgeBehavior? traversalEdgeBehavior, bool noDarkBackground = false, bool showCloseButton = false, VoidCallback? onClose, FondeDialogImportance importance = FondeDialogImportance.standard, bool showDivider = true}) Future<T?>
Function to show FondeDialog

Typedefs

FondeMasterItemBuilder = Widget Function(BuildContext context, String itemId, bool isSelected, VoidCallback onSelect)
Signature for building master items