A Flutter design-system foundation for GeniusLink/Super packages, providing Material 3 theme generation, responsive tokens and layout primitives, reusable section/card surfaces, app bars, tiles, feedback components, toasts, dialogs, utilities, and shared clean-architecture contracts.
The package is designed for light/dark themes, LTR/RTL layouts, mobile/tablet/desktop form factors, and consistent visual behavior across the wider Super toolkit.
Features
- Complete Material 3
ThemeDatageneration withSuperMaterialThemeData. - Ten swappable
SuperPalettecolor ramps plus semantic colors. - Dynamic
SuperTokensData, responsive typography, spacing, sizing, and metrics. - Theme extensions for app bars, cards, sections, section titles, footers, and interaction states.
- Responsive 4/8/12-column layout primitives and breakpoint providers.
ChromeScaffoldfor scroll-aware app bars, FABs, bottom navigation, sheets, and footer buttons.- Two section-card/title styles, two widget-based section headers, section footers, and accent cards.
- Buttons, icon buttons, status pills, field shells, list/grid tiles, sliders, app bars, and sliver app bars.
- Reusable confirmation and field views/dialogs.
SuperSnackBarand host-basedSuperToastfeedback systems.- Example-page/documentation widgets for package showcase apps.
- Number/currency/byte formatting, keyboard direction helpers, failures, typedefs, and use-case contracts.
Requirements
- Dart:
>=3.8.0 <4.0.0 - Flutter:
>=3.32.0 - Material 3 compatible Flutter SDK.
Installation
Add the package to pubspec.yaml:
dependencies:
super_core: ^3.7.0
Import the public barrel:
import 'package:super_core/super_core.dart';
The public barrel is the recommended import for application and package consumers.
Quick start
Create one SuperTextTheme and pass it to both the regular and primary typography slots. Pick a palette, device mode, and optional token overrides.
import 'package:flutter/material.dart';
import 'package:super_core/super_core.dart';
void main() {
runApp(const App());
}
class App extends StatelessWidget {
const App({super.key});
@override
Widget build(BuildContext context) {
final typography = SuperTextTheme();
return MaterialApp(
theme: SuperMaterialThemeData.light(
palette: SuperPalette.bluePalette,
mode: SuperDeviceMode.mobile,
textTheme: typography,
primaryTextTheme: typography,
),
darkTheme: SuperMaterialThemeData.dark(
palette: SuperPalette.bluePalette,
mode: SuperDeviceMode.mobile,
textTheme: typography,
primaryTextTheme: typography,
),
builder: (context, child) => SuperToastHost(
child: child ?? const SizedBox.shrink(),
),
home: const HomeScreen(),
);
}
}
For responsive applications, resolve the mode from width before rebuilding the app theme:
final mode = SuperDeviceMode.forWidth(MediaQuery.sizeOf(context).width);
Theme system
Palettes and Material themes
SuperPalette ships with bluePalette, purplePalette, greenPalette, goldenPalette, tealPalette, rosePalette, indigoPalette, slatePalette, grayPalette, and monochromePalette.
final typography = SuperTextTheme();
final theme = SuperMaterialThemeData.light(
palette: SuperPalette.greenPalette,
mode: SuperDeviceMode.desktop,
tokens: const SuperTokensData(
markerWidth: 5,
durBase: Duration(milliseconds: 180),
),
textTheme: typography,
primaryTextTheme: typography,
);
Palette shades can also be queried directly:
final primary = SuperPalette.bluePalette.primary;
final shade700 = SuperPalette.bluePalette.shade(700);
Ambient Super theme, spacing, sizing, and metrics
Use the SuperContextX extension for the most common theme reads:
Widget build(BuildContext context) {
final SuperThemeData superTheme = context.superTheme;
final textTheme = context.superTextTheme;
final SuperSpacing spacing = superTheme.spacing;
final SuperSizing sizing = superTheme.sizing;
return Padding(
padding: EdgeInsets.all(spacing.space4),
child: Text(
'Dashboard',
style: textTheme.titleLg.copyWith(color: superTheme.fg1),
),
);
}
The underlying responsive primitives are also available directly:
const responsiveGutter = SuperResponsive<double>(
mobile: 16,
tablet: 24,
desktop: 32,
);
final gutter = responsiveGutter.resolve(SuperDeviceMode.tablet);
final metrics = SuperMetrics.desktop;
final spacing = SuperSpacing.desktop;
final sizing = metrics.sizing;
Semantic colors
Use SuperSemanticColors when UI state should express intent rather than a raw palette shade.
final semantic = SuperSemanticColors.of(context);
final SuperSemanticColor success =
semantic.byIntent(SuperSemanticIntent.success);
Container(
color: success.subtle,
child: Text(
'Posted',
style: TextStyle(color: success.onSubtle),
),
);
SuperSemanticColor is the resolved solid/subtle/border bundle for one intent.
Color helpers
SuperColorX adds common color operations to Flutter Color values.
final brand = SuperColorX.fromHex('#4A7CFF');
final hover = brand.lighten(0.06);
final selectedFill = brand.tintOver(Colors.white, 0.08);
final foreground = brand.bestForegroundFrom(
const [Colors.black, Colors.white],
);
Theme extensions
SuperMaterialThemeData installs Super-specific defaults, and you can override extension values explicitly.
final typography = SuperTextTheme();
final theme = SuperMaterialThemeData.light(
textTheme: typography,
primaryTextTheme: typography,
extensions: const <ThemeExtension<dynamic>>[
SuperSectionHeaderThemeData(
markerWidth: 4,
iconChipSize: 32,
),
SuperSectionTitleThemeData(
title1Style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w700,
),
title2Style: TextStyle(
fontSize: 17,
fontWeight: FontWeight.w800,
),
markerWidth: 5,
contentGap: 10,
),
SuperSectionFooterThemeData(
showDivider: true,
),
SuperSectionThemeData(
radius: 12,
dividerAfterHeader: true,
),
],
);
SuperSectionTitleThemeData controls the string-based SuperSectionTitle1 and SuperSectionTitle2 treatments used by the numbered section cards. Null fields keep each widget's built-in behavior.
App-bar theme
SuperAppBarTheme extends Material app-bar styling with subtitle position and responsive action limits.
final typography = SuperTextTheme();
final theme = SuperMaterialThemeData.light(
textTheme: typography,
primaryTextTheme: typography,
appBarTheme: const SuperAppBarTheme(
subtitlePosition: SubtitlePosition.below,
maxMobileActions: 2,
maxTabletActions: 4,
maxDesktopActions: 5,
),
);
Card and interactive-state themes
final cardTheme = SuperCardTheme.of(context);
final states = SuperInteractiveStateThemeData.of(context);
final hoverOpacity = states.opacity(WidgetState.hovered);
Use SuperCardTheme for card/section expansion defaults and SuperInteractiveStateThemeData for consistent hover, focus, pressed, selected, dragged, and disabled overlays.
Markers and tokens
SuperMarker expresses section intent. Resolve it from the active token bundle instead of hard-coding marker colors.
final tokens = context.superTheme.tokens;
final markerColor = tokens.markerColor(SuperMarker.ledger);
Responsive layout
Breakpoints
SuperBreakpoint uses 4 columns on mobile, 8 on tablet, and 12 on desktop/large. SuperBreakpointProvider can override the breakpoint for a subtree such as a dialog or preview.
SuperBreakpointProvider(
defaultWidth: 760,
child: Builder(
builder: (context) {
final breakpoint = SuperBreakpoint.of(context);
final columns = SuperBreakpoints.resolve<int>(
context,
mobile: 1,
tablet: 2,
desktop: 3,
large: 4,
);
return Text('$breakpoint / $columns columns');
},
),
);
Grid
SuperGridScope chooses whether a grid uses a provider, global screen width, or its own current width.
SuperGrid(
scope: SuperGridScope.current,
children: [
SuperGridCell(
mobile: 4,
tablet: 4,
desktop: 6,
child: const AccountSummaryCard(),
),
SuperGridCell(
mobile: 4,
tablet: 4,
desktop: 6,
child: const RevenueChart(),
),
],
);
Page frame
SuperScaffold is a responsive content-frame widget; it is not a replacement for Flutter's Scaffold.
Scaffold(
body: SuperScaffold(
maxWidth: 1440,
child: Column(
children: const [
Text('Dashboard'),
],
),
),
);
Scroll-aware scaffold chrome
Use ChromeScaffold when application chrome should hide while content scrolls down and return when it scrolls up.
ChromeScaffold(
hideAppBarWhenScroll: true,
hideFloatingActionButtonWhenScroll: true,
appBar: SuperAppBar(
title: const Text('Transactions'),
),
body: ListView.builder(
itemCount: 100,
itemBuilder: (context, index) => ListTile(
title: Text('Transaction $index'),
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {},
child: const Icon(Icons.add),
),
);
Section surfaces
Section cards and title treatments
SuperSectionCard1 is compact and marker-led. SuperSectionCard2 uses the style-2 rail/icon treatment and is collapsible by default.
Column(
children: [
SuperSectionCard1(
title: 'Customer profile',
subtitle: 'Identity information',
icon: Icons.person_outline,
accentColor: Theme.of(context).colorScheme.primary,
child: const Text('Customer details'),
),
SuperSectionCard2(
title: 'Ledger summary',
subtitle: 'Current period',
icon: Icons.account_balance_wallet_outlined,
footerBrand: 'GENIUSLINK ERP',
footerActions: [
SuperFooterLink('Details', onTap: () {}),
],
child: const Text('Ledger content'),
),
],
);
The title widgets can also be used independently:
const SuperSectionTitle1(
title: 'Identity',
subtitle: 'Primary record information',
icon: Icons.badge_outlined,
);
const SuperSectionTitle2(
title: 'Financials',
subtitle: 'Posted balances',
icon: Icons.account_balance_outlined,
);
Widget-based section headers
Use SuperSectionHeader1 and SuperSectionHeader2 when the title/subtitle/icon must be arbitrary widgets rather than strings.
SuperSectionHeader1(
title: const Text('Open invoices'),
subtitle: const Text('Updated today'),
icon: const Icon(Icons.receipt_long_outlined),
trailing: const StatusPill('LIVE', tone: PillTone.success),
onTap: () {},
);
SuperSectionHeader2(
title: const Text('Inventory'),
subtitle: const Text('Warehouse A'),
icon: const Icon(Icons.inventory_2_outlined),
trailing: const Icon(Icons.chevron_right),
);
Section footer
SuperSectionFooter(
brand: 'GENIUSLINK ERP • OPERATIONAL',
actions: [
SuperFooterLink('Help', onTap: () {}),
SuperFooterLink('Open', emphasized: true, onTap: () {}),
],
);
Accent section card
AccentSectionCard(
title: 'Payment summary',
icon: Icons.receipt_long_outlined,
accentColor: context.superTheme.tokens.success,
trailing: const StatusPill('PAID', tone: PillTone.success),
child: const Text('SAR 5,240.00'),
);
Basic widgets
Buttons
Wrap(
spacing: 12,
children: [
SuperButton(
label: 'Save',
icon: const Icon(Icons.save_outlined),
onPressed: () {},
),
SuperButton(
label: 'Cancel',
variant: SuperButtonVariant.secondary,
onPressed: () {},
),
SuperIconButton(
icon: Icons.delete_outline,
danger: true,
tooltip: 'Delete',
onPressed: () {},
),
],
);
Status pills and hairlines
Column(
children: const [
StatusPill('ACTIVE', tone: PillTone.success),
SizedBox(height: 8),
Hairline(),
],
);
Field shell
FieldShell adds design-system label, hint, required state, error text, disabled state, and density around arbitrary form content.
FieldShell(
label: 'Account name',
required: true,
hint: 'Displayed on reports',
density: FieldDensity.comfortable,
child: const TextField(),
);
App bars
SuperAppBar
SuperAppBar mirrors Material AppBar while adding a subtitle and responsive action overflow.
Scaffold(
appBar: SuperAppBar(
title: const Text('Create store'),
subtitle: const Text('Stores & Products • Stores'),
subtitlePosition: SubtitlePosition.above,
actions: [
IconButton(onPressed: () {}, icon: const Icon(Icons.search)),
IconButton(onPressed: () {}, icon: const Icon(Icons.refresh)),
IconButton(onPressed: () {}, icon: const Icon(Icons.more_horiz)),
],
),
body: const SizedBox(),
);
SuperSliverAppBar
CustomScrollView(
slivers: [
SuperSliverAppBar(
pinned: true,
expandedHeight: 180,
title: const Text('Journal'),
subtitle: const Text('Banking • Transfers'),
flexibleSpace: const FlexibleSpaceBar(
background: ColoredBox(color: Colors.black12),
),
),
const SliverToBoxAdapter(child: SizedBox(height: 800)),
],
);
Tiles
Shared tile state and marker helpers
SuperTileDensity, SuperTileMetrics, and SuperTileVisualState are the shared layout/state primitives behind list and grid tiles. SuperTileMarker and SuperTileShimmer are reusable visual pieces.
final metrics = SuperTileMetrics.of(
SuperTileDensity.compact,
context.superTheme.spacing,
);
const state = SuperTileVisualState(
selected: true,
focused: true,
);
const marker = SuperTileMarker(marker: SuperMarker.ledger);
const loading = SuperTileShimmer(width: 120);
List tile
SuperListTile(
marker: SuperMarker.identity,
leadingIcon: Icons.storefront_outlined,
titleText: 'Downtown Central Store',
subtitle: const Text('STR-0042 • Riyadh'),
badge: const StatusPill('ACTIVE', tone: PillTone.success),
trailingActions: [
SuperIconButton(
icon: Icons.edit_outlined,
onPressed: () {},
),
],
density: SuperTileDensity.comfortable,
alignment: SuperListTileAlignment.center,
selected: false,
onTap: () {},
);
Grid tile
SuperGridTile(
marker: SuperMarker.ledger,
header: const Text('TOTAL BALANCE'),
badge: const StatusPill('LIVE', tone: PillTone.success),
footer: const Text('Updated 2m ago'),
onTap: () {},
child: const Text('SAR 248,200.00'),
);
Slider
Use SuperSliderController when external controls need to drive a SuperSlider.
final sliderController = SuperSliderController();
SuperSlider(
controller: sliderController,
height: 180,
visibleItems: const SuperResponsive<int>(
mobile: 1,
tablet: 2,
desktop: 3,
),
peek: 16,
loop: true,
children: const [
Card(child: Center(child: Text('One'))),
Card(child: Center(child: Text('Two'))),
Card(child: Center(child: Text('Three'))),
],
);
// External navigation:
sliderController.next();
sliderController.previous();
Dispose a controller owned by a State object in dispose().
Views and dialogs
Confirmation view
Use SuperConfirmView inline inside pages/cards/sheets.
SuperConfirmView(
title: 'Delete account?',
description: 'This action cannot be undone.',
icon: Icons.delete_outline,
isDestructive: true,
onCancel: () {},
onConfirm: () {},
);
Use SuperConfirmDialog.show for modal confirmation:
final confirmed = await SuperConfirmDialog.show(
context,
title: 'Delete account?',
description: 'This action cannot be undone.',
isDestructive: true,
);
if (confirmed) {
// Delete the account.
}
Field view and dialog
SuperFieldView is reusable non-modal field/form content. SuperFieldDialog wraps the same concept in a dialog.
SuperFieldView(
title: 'Edit name',
description: 'Update the display name.',
child: const TextField(),
actions: [
SuperButton(label: 'Save', onPressed: () {}),
],
);
final result = await SuperFieldDialog.show<String>(
context,
title: 'Edit name',
child: const TextField(),
);
Feedback
Snackbars
SuperSnackBar provides semantic tone helpers plus a generic show/build API.
SuperSnackBar.success(
context,
'Journal entry posted.',
actionLabel: 'View',
onAction: () {},
);
SuperSnackBar.show(
context,
'Validation failed.',
tone: SuperSnackBarTone.danger,
);
Toast
Install the host
Place SuperToastHost near the app root. A custom SuperToastController and SuperToastHostStyle are optional.
final toastController = SuperToastController();
MaterialApp(
builder: (context, child) => SuperToastHost(
controller: toastController,
style: const SuperToastHostStyle(
maxVisible: 3,
expandBehavior: SuperToastExpandBehavior.hoverOrPress,
alignment: SuperToastAlignment.bottomEnd,
motion: SuperToastStackMotion(
expandDuration: Duration(milliseconds: 220),
),
),
child: child ?? const SizedBox.shrink(),
),
);
SuperToastHostState is the state returned by the host and is normally accessed through SuperToastHost.of(context) rather than instantiated directly.
Show semantic toasts
final handle = SuperToast.success(
context,
title: 'Document generated',
description: 'The PDF is ready to open.',
position: SuperToastPosition.bottomEnd,
showCloseButton: true,
action: SuperToastAction(
label: 'Open',
position: SuperToastActionPosition.trailing,
onPressed: () {},
),
suffixBuilder: (context, entry) => IconButton(
onPressed: entry.dismiss,
icon: const Icon(Icons.close),
),
);
// Imperative lifecycle:
handle.pause();
handle.resume();
handle.dismiss();
Available convenience tones are SuperToast.info, SuperToast.success, SuperToast.warning, and SuperToast.danger. SuperToastTone.neutral is available through SuperToast.show.
Custom alignment and style
final alignment = const SuperToastAlignment(
AlignmentDirectional.topEnd,
1,
);
final placement = alignment.resolve(Directionality.of(context));
final style = SuperToastStyle(
padding: const EdgeInsets.all(16),
motion: const SuperToastMotion(
entranceDismissFadeTween: SuperToastFadeTween(begin: 0, end: 1),
),
);
SuperToast.show(
context,
title: 'Saved',
alignment: alignment,
style: style,
);
final resolvedHost = const SuperToastHostStyle().resolve(context);
final SuperToastResolvedHostStyle hostValues = resolvedHost;
final SuperToastResolvedStackMotion stackMotion = resolvedHost.motion;
final resolvedStyle = style.resolve(context);
final SuperToastResolvedStyle surfaceValues = resolvedStyle;
final SuperToastResolvedMotion toastMotion = resolvedStyle.motion;
SuperToastPlacement is the resolved physical placement. SuperToastStackMotion, SuperToastMotion, SuperToastFadeTween, SuperToastStyle, and SuperToastHostStyle are the authoring-time configuration types. The SuperToastResolvedHostStyle, SuperToastResolvedStackMotion, SuperToastResolvedStyle, and SuperToastResolvedMotion types contain context-resolved values used by the host/view layer.
Custom toast content
SuperToastRawBuilder is the callback type used by showRaw. SuperToastSuffixBuilder is the suffix callback type used by the standard surface.
final data = SuperToastData(
title: 'Syncing',
description: 'Uploading records…',
duration: null,
dismissible: true,
);
SuperToast.showRaw(
context,
data: data,
builder: (context, handle) => SuperToastView(
data: data,
handle: handle,
icon: const CircularProgressIndicator(),
),
);
Use SuperToast.controllerOf(context) to access the nearest controller, or SuperToast.dismissAll(context) to dismiss the current host's active entries.
Example documentation widgets
The example app can use the built-in documentation primitives to present component previews and code samples.
SuperExampleDocsPage(
title: 'Buttons',
subtitle: 'SUPER CORE • COMPONENT GALLERY',
description: 'Primary and secondary button variants.',
badges: const [
SuperExampleDocsBadgeData(
icon: Icons.check_circle_outline,
label: 'Stable',
tone: SuperMarker.ledger,
),
],
api: const ['SuperButton', 'SuperIconButton'],
sections: [
SuperExampleDocsSectionData(
label: 'BUTTONS',
eyebrow: 'ACTIONS',
title: 'Button variants',
description: 'Primary and secondary actions.',
children: [
SuperExampleDocsCard(
title: 'Primary button',
description: 'Default primary action.',
code: "SuperButton(label: 'Save', onPressed: save);",
preview: SuperButton(
label: 'Save',
onPressed: () {},
),
),
],
),
],
);
For lower-level composition, use SuperExamplePreviewColumn, SuperExampleCodeBlock, and SuperExampleDocsNote.
Utilities and core contracts
Formatting
SuperFormat has no intl dependency.
final parsed = SuperFormat.parseNumber('1,234.50');
final amount = SuperFormat.currency(5240); // $5,240.00
final signed = SuperFormat.signed(-42.5); // -42.50
final fileSize = SuperFormat.bytes(3_500_000); // 3.3 MB
final hash = SuperFormat.truncateHash('a7f812345678b161');
Keyboard direction helpers
final step = horizontalStep(
LogicalKeyboardKey.arrowRight,
Directionality.of(context),
);
final expands = arrowGoesInto(
LogicalKeyboardKey.arrowRight,
Directionality.of(context),
);
final commandHeld = isCommandPressed(HardwareKeyboard.instance.logicalKeysPressed);
These helpers preserve visual arrow-key behavior in both LTR and RTL layouts.
Constants
final minHitTarget = SuperConstants.minHitTarget;
final debounce = SuperConstants.searchDebounce;
JSON/result typedefs and validation callbacks
final Json payload = <String, dynamic>{'id': 42};
final JsonList rows = <Json>[payload];
Validator<String?> requiredName = (value) {
if (value == null || value.trim().isEmpty) return 'Required';
return null;
};
RowValidator<Json> validateRow = (value, row) {
if (value.trim().isEmpty) return 'Required';
return row['id'] == null ? 'Missing id' : null;
};
ValidityChanged onValidityChanged = (isValid) {
debugPrint('valid: $isValid');
};
Result<T> is the package result typedef used by use cases.
Use cases
class LoadProfile implements UseCase<String, NoParams> {
const LoadProfile();
@override
Future<Result<String>> call(NoParams params) async {
return (value: 'Profile', failure: null);
}
}
For synchronous work, implement SyncUseCase<Output, Params> instead.
Failures and exceptions
Failure mapException(Object error) {
if (error is CacheException) {
return CacheFailure(error.message, cause: error);
}
if (error is RemoteException) {
return RemoteFailure(error.message, cause: error);
}
if (error is FormatException) {
return ValidationFailure(error.message, cause: error);
}
return UnexpectedFailure('Unexpected error', cause: error);
}
SuperException is the shared exception base. CacheException and RemoteException provide common typed exception cases.
RTL and responsive behavior
The package uses directional layout APIs and exposes direction helpers through SuperContextX.
final isRtl = context.isRtl;
final direction = context.direction;
For local responsive previews or nested panels, prefer SuperBreakpointProvider. For theme-level control sizing/typography, use SuperDeviceMode.
Complete public API inventory
The inventory below is generated from the package barrel exports each time this script rebuilds the README. If an exported public type appears in a source path that has no documented usage family, the script stops instead of writing an incomplete README.
Theme system
| Public API | Source | Usage |
|---|---|---|
SubtitlePosition |
lib/src/core/theme/super_app_bar_theme.dart |
See Theme system. |
SuperAppBarTheme |
lib/src/core/theme/super_app_bar_theme.dart |
See Theme system. |
SuperCardTheme |
lib/src/core/theme/super_card_theme.dart |
See Theme system. |
SuperColorX |
lib/src/core/theme/super_color_utils.dart |
See Theme system. |
SuperContextX |
lib/src/core/extensions/context_extensions.dart |
See Theme system. |
SuperDeviceMode |
lib/src/core/theme/super_device_mode.dart |
See Theme system. |
SuperInteractiveStateThemeData |
lib/src/core/theme/super_interactive_state_theme.dart |
See Theme system. |
SuperMarker |
lib/src/core/theme/super_tokens.dart |
See Theme system. |
SuperMaterialThemeData |
lib/src/core/theme/super_material_theme.dart |
See Theme system. |
SuperMetrics |
lib/src/core/theme/super_metrics.dart |
See Theme system. |
SuperPalette |
lib/src/core/theme/super_palette.dart |
See Theme system. |
SuperResponsive |
lib/src/core/theme/super_device_mode.dart |
See Theme system. |
SuperSectionFooterThemeData |
lib/src/core/theme/super_section_theme.dart |
See Theme system. |
SuperSectionHeaderThemeData |
lib/src/core/theme/super_section_theme.dart |
See Theme system. |
SuperSectionThemeData |
lib/src/core/theme/super_section_theme.dart |
See Theme system. |
SuperSectionTitleThemeData |
lib/src/core/theme/super_section_theme.dart |
See Theme system. |
SuperSemanticColor |
lib/src/core/theme/super_semantic_colors.dart |
See Theme system. |
SuperSemanticColors |
lib/src/core/theme/super_semantic_colors.dart |
See Theme system. |
SuperSemanticIntent |
lib/src/core/theme/super_semantic_colors.dart |
See Theme system. |
SuperSizing |
lib/src/core/theme/super_metrics.dart |
See Theme system. |
SuperSpacing |
lib/src/core/theme/super_spacing.dart |
See Theme system. |
SuperTextTheme |
lib/src/core/theme/super_text_styles.dart |
See Theme system. |
SuperThemeData |
lib/src/core/theme/super_theme.dart |
See Theme system. |
SuperTokensData |
lib/src/core/theme/super_tokens.dart |
See Theme system. |
Responsive layout
| Public API | Source | Usage |
|---|---|---|
ChromeScaffold |
lib/src/core/layout/scaffold/chrome_scaffold.dart |
See Responsive layout. |
SuperBreakpoint |
lib/src/core/layout/breakpoints.dart |
See Responsive layout. |
SuperBreakpointProvider |
lib/src/core/layout/breakpoints.dart |
See Responsive layout. |
SuperBreakpoints |
lib/src/core/layout/breakpoints.dart |
See Responsive layout. |
SuperGrid |
lib/src/core/layout/grid/view.dart |
See Responsive layout. |
SuperGridCell |
lib/src/core/layout/grid/cell.dart |
See Responsive layout. |
SuperGridScope |
lib/src/core/layout/grid/scope.dart |
See Responsive layout. |
SuperScaffold |
lib/src/core/layout/scaffold/scaffold.dart |
See Responsive layout. |
Section surfaces
| Public API | Source | Usage |
|---|---|---|
AccentSectionCard |
lib/src/core/widgets/section/accent_section_card.dart |
See Section surfaces. |
SuperFooterLink |
lib/src/core/widgets/section/super_section_footer.dart |
See Section surfaces. |
SuperSectionCard1 |
lib/src/core/widgets/section/super_section_card1.dart |
See Section surfaces. |
SuperSectionCard2 |
lib/src/core/widgets/section/super_section_card2.dart |
See Section surfaces. |
SuperSectionFooter |
lib/src/core/widgets/section/super_section_footer.dart |
See Section surfaces. |
SuperSectionHeader1 |
lib/src/core/widgets/section/super_section_header1.dart |
See Section surfaces. |
SuperSectionHeader2 |
lib/src/core/widgets/section/super_section_header2.dart |
See Section surfaces. |
SuperSectionTitle1 |
lib/src/core/widgets/section/super_section_card1.dart |
See Section surfaces. |
SuperSectionTitle2 |
lib/src/core/widgets/section/super_section_card2.dart |
See Section surfaces. |
Basic widgets
| Public API | Source | Usage |
|---|---|---|
FieldDensity |
lib/src/core/widgets/field_shell.dart |
See Basic widgets. |
FieldShell |
lib/src/core/widgets/field_shell.dart |
See Basic widgets. |
Hairline |
lib/src/core/widgets/hairline.dart |
See Basic widgets. |
PillTone |
lib/src/core/widgets/status_pill.dart |
See Basic widgets. |
StatusPill |
lib/src/core/widgets/status_pill.dart |
See Basic widgets. |
SuperButton |
lib/src/core/widgets/super_button.dart |
See Basic widgets. |
SuperButtonVariant |
lib/src/core/widgets/super_button.dart |
See Basic widgets. |
SuperIconButton |
lib/src/core/widgets/super_button.dart |
See Basic widgets. |
App bars
| Public API | Source | Usage |
|---|---|---|
SuperAppBar |
lib/src/core/widgets/super_app_bar.dart |
See App bars. |
SuperSliverAppBar |
lib/src/core/widgets/super_sliver_app_bar.dart |
See App bars. |
Tiles
| Public API | Source | Usage |
|---|---|---|
SuperGridTile |
lib/src/core/widgets/super_grid_tile.dart |
See Tiles. |
SuperListTile |
lib/src/core/widgets/super_list_tile.dart |
See Tiles. |
SuperListTileAlignment |
lib/src/core/widgets/super_list_tile.dart |
See Tiles. |
SuperTileDensity |
lib/src/core/widgets/super_tile_common.dart |
See Tiles. |
SuperTileMarker |
lib/src/core/widgets/super_tile_common.dart |
See Tiles. |
SuperTileMetrics |
lib/src/core/widgets/super_tile_common.dart |
See Tiles. |
SuperTileShimmer |
lib/src/core/widgets/super_tile_common.dart |
See Tiles. |
SuperTileVisualState |
lib/src/core/widgets/super_tile_common.dart |
See Tiles. |
Slider
| Public API | Source | Usage |
|---|---|---|
SuperSlider |
lib/src/core/widgets/super_slider.dart |
See Slider. |
SuperSliderController |
lib/src/core/widgets/super_slider.dart |
See Slider. |
Views and dialogs
| Public API | Source | Usage |
|---|---|---|
SuperConfirmDialog |
lib/src/core/widgets/super_confirm_dialog.dart |
See Views and dialogs. |
SuperConfirmView |
lib/src/core/widgets/super_confirm_view.dart |
See Views and dialogs. |
SuperFieldDialog |
lib/src/core/widgets/super_field_dialog.dart |
See Views and dialogs. |
SuperFieldView |
lib/src/core/widgets/super_field_view.dart |
See Views and dialogs. |
Feedback
| Public API | Source | Usage |
|---|---|---|
SuperSnackBar |
lib/src/core/widgets/super_snack_bar.dart |
See Feedback. |
SuperSnackBarTone |
lib/src/core/widgets/super_snack_bar.dart |
See Feedback. |
Toast
| Public API | Source | Usage |
|---|---|---|
SuperToast |
lib/src/features/toast/super_toast.dart |
See Toast. |
SuperToastAction |
lib/src/features/toast/presentation/models/super_toast_action.dart |
See Toast. |
SuperToastActionPosition |
lib/src/features/toast/presentation/models/super_toast_action.dart |
See Toast. |
SuperToastAlignment |
lib/src/features/toast/presentation/models/super_toast_alignment.dart |
See Toast. |
SuperToastController |
lib/src/features/toast/presentation/controllers/super_toast_controller.dart |
See Toast. |
SuperToastData |
lib/src/features/toast/domain/entities/super_toast_data.dart |
See Toast. |
SuperToastExpandBehavior |
lib/src/features/toast/presentation/models/super_toast_style.dart |
See Toast. |
SuperToastFadeTween |
lib/src/features/toast/presentation/models/super_toast_style.dart |
See Toast. |
SuperToastHandle |
lib/src/features/toast/presentation/controllers/super_toast_controller.dart |
See Toast. |
SuperToastHost |
lib/src/features/toast/presentation/views/super_toast_host.dart |
See Toast. |
SuperToastHostState |
lib/src/features/toast/presentation/views/super_toast_host.dart |
See Toast. |
SuperToastHostStyle |
lib/src/features/toast/presentation/models/super_toast_style.dart |
See Toast. |
SuperToastMotion |
lib/src/features/toast/presentation/models/super_toast_style.dart |
See Toast. |
SuperToastPlacement |
lib/src/features/toast/presentation/models/super_toast_alignment.dart |
See Toast. |
SuperToastPosition |
lib/src/features/toast/domain/entities/super_toast_data.dart |
See Toast. |
SuperToastRawBuilder |
lib/src/features/toast/presentation/controllers/super_toast_controller.dart |
See Toast. |
SuperToastResolvedHostStyle |
lib/src/features/toast/presentation/models/super_toast_style.dart |
See Toast. |
SuperToastResolvedMotion |
lib/src/features/toast/presentation/models/super_toast_style.dart |
See Toast. |
SuperToastResolvedStackMotion |
lib/src/features/toast/presentation/models/super_toast_style.dart |
See Toast. |
SuperToastResolvedStyle |
lib/src/features/toast/presentation/models/super_toast_style.dart |
See Toast. |
SuperToastStackMotion |
lib/src/features/toast/presentation/models/super_toast_style.dart |
See Toast. |
SuperToastStyle |
lib/src/features/toast/presentation/models/super_toast_style.dart |
See Toast. |
SuperToastSuffixBuilder |
lib/src/features/toast/super_toast.dart |
See Toast. |
SuperToastTone |
lib/src/features/toast/domain/entities/super_toast_data.dart |
See Toast. |
SuperToastView |
lib/src/features/toast/presentation/views/super_toast_view.dart |
See Toast. |
Example documentation widgets
| Public API | Source | Usage |
|---|---|---|
SuperExampleCodeBlock |
lib/src/core/widgets/super_example_docs.dart |
See Example documentation widgets. |
SuperExampleDocsBadgeData |
lib/src/core/widgets/super_example_docs.dart |
See Example documentation widgets. |
SuperExampleDocsCard |
lib/src/core/widgets/super_example_docs.dart |
See Example documentation widgets. |
SuperExampleDocsNote |
lib/src/core/widgets/super_example_docs.dart |
See Example documentation widgets. |
SuperExampleDocsPage |
lib/src/core/widgets/super_example_docs.dart |
See Example documentation widgets. |
SuperExampleDocsSectionData |
lib/src/core/widgets/super_example_docs.dart |
See Example documentation widgets. |
SuperExamplePreviewColumn |
lib/src/core/widgets/super_example_docs.dart |
See Example documentation widgets. |
Utilities and core contracts
| Public API | Source | Usage |
|---|---|---|
CacheException |
lib/src/core/errors/failures.dart |
See Utilities and core contracts. |
CacheFailure |
lib/src/core/errors/failures.dart |
See Utilities and core contracts. |
Failure |
lib/src/core/errors/failures.dart |
See Utilities and core contracts. |
Json |
lib/src/core/typedefs/typedefs.dart |
See Utilities and core contracts. |
JsonList |
lib/src/core/typedefs/typedefs.dart |
See Utilities and core contracts. |
NoParams |
lib/src/core/usecases/usecase.dart |
See Utilities and core contracts. |
RemoteException |
lib/src/core/errors/failures.dart |
See Utilities and core contracts. |
RemoteFailure |
lib/src/core/errors/failures.dart |
See Utilities and core contracts. |
Result |
lib/src/core/typedefs/typedefs.dart |
See Utilities and core contracts. |
RowValidator |
lib/src/core/typedefs/typedefs.dart |
See Utilities and core contracts. |
SuperConstants |
lib/src/core/constants/super_constants.dart |
See Utilities and core contracts. |
SuperException |
lib/src/core/errors/failures.dart |
See Utilities and core contracts. |
SuperFormat |
lib/src/core/utils/super_format.dart |
See Utilities and core contracts. |
SyncUseCase |
lib/src/core/usecases/usecase.dart |
See Utilities and core contracts. |
UnexpectedFailure |
lib/src/core/errors/failures.dart |
See Utilities and core contracts. |
UseCase |
lib/src/core/usecases/usecase.dart |
See Utilities and core contracts. |
ValidationFailure |
lib/src/core/errors/failures.dart |
See Utilities and core contracts. |
Validator |
lib/src/core/typedefs/typedefs.dart |
See Utilities and core contracts. |
ValidityChanged |
lib/src/core/typedefs/typedefs.dart |
See Utilities and core contracts. |
Top-level keyboard helpers
| Helper | Purpose |
|---|---|
horizontalStep |
Resolve left/right arrow keys to logical index movement with RTL mirroring. |
arrowGoesInto |
Test whether an arrow key points toward deeper nesting for the current direction. |
isCommandPressed |
Detect the platform primary command modifier for keyboard shortcuts. |
superTileFill |
Resolve a tile surface color from SuperThemeData and SuperTileVisualState. |
superTileBorder |
Resolve a tile border from SuperThemeData and SuperTileVisualState. |
Example app
The example/ application demonstrates the package components in runnable screens, including theme configuration, layout/grid primitives, section cards/headers, dialogs/views, toasts, chrome scaffolding, and the broader widget gallery.
Use the example source as the reference when you need a complete screen-level composition rather than an isolated API snippet.
API documentation
Public Dart API documentation is generated from /// comments when the package is published to pub.flutter-io.cn. Keep public declarations documented in source and keep this README focused on package discovery, setup, and practical usage.
Repository and support
- Repository: https://github.com/GeniusSystems24/super_core
- Issues: https://github.com/GeniusSystems24/super_core/issues
- Homepage: https://geniussystems24.github.io/super_core
License
See LICENSE for the package license.
Libraries
- super_core
- Super Core — the shared GeniusLink design-system foundation for the Super toolkit. Single source of truth for the visual identity that every Super package reads from, so the whole toolkit looks like one product.