crossbuild_custom_widgets

A comprehensive, theme-aware, production-ready collection of reusable Flutter widgets — buttons, text fields, dropdowns, dialogs, shimmer loaders, empty/error states, cards, tiles, avatars, snackbars, and more.

Every widget automatically adapts to the host application's ThemeData (colors, text styles, Material 2/3, light/dark mode) and exposes explicit overrides for almost every visual and behavioral property when you need them.

Install the package, import it, and use highly customizable, production-ready widgets that fit right into your app's existing design system.

Features

• 🎨 Theme-aware by default — reads ColorScheme, TextTheme, InputDecorationTheme, and CardTheme from Theme.of(context). No hardcoded colors or fonts.
• 🧩 Deeply customizable — every important property (color, radius, padding, text style, shadow, animation…) can be overridden per-widget.
• 🧱 State-management agnostic — works with setState, Provider, Riverpod, GetX, Bloc, or anything else.
• ✅ Null-safe, const-friendly, no deprecated APIs.
• 📦 Minimal dependency footprint — only shimmer and cached_network_image, both mature and actively maintained.

Installation

dependencies:
  crossbuild_custom_widgets: ^0.0.1

flutter pub get

Import

import 'package:crossbuild_custom_widgets/crossbuild_custom_widgets.dart';

Basic usage

CBButton(
  text: 'Submit',
  onPressed: () {},
)

CBTextField(
  label: 'Email',
  hint: 'you@example.com',
  keyboardType: TextInputType.emailAddress,
)

CBDropdown<String>(
  items: countries,
  itemLabel: (c) => c,
  value: selectedCountry,
  onChanged: (c) => setState(() => selectedCountry = c),
  label: 'Country',
  searchable: true,
  searchThreshold: 10, // auto-shows search once there are 10+ items
)

The simple case stays simple. Every widget also accepts deep customization:

CBButton(
  text: 'Submit',
  onPressed: () {},
  width: double.infinity,
  height: 56,
  variant: CBButtonVariant.gradient,
  gradient: const LinearGradient(colors: [Colors.blue, Colors.purple]),
  borderRadius: BorderRadius.circular(16),
  isLoading: isSubmitting,
  loaderColor: Colors.white,
  textStyle: const TextStyle(fontSize: 16, fontWeight: FontWeight.w600),
)

Widget reference

Buttons

Widget	Description
CBButton	Filled / outlined / text / gradient / custom variants, loading + disabled states, icon support, full style overrides.

Inputs

Widget	Description
CBTextField	Full-featured text field with password toggle, validation, theme-aware decoration.
CBSearchField	Dedicated search field with optional debounce and a built-in clear button.

Dropdowns

Widget	Description
CBDropdown<T>	Generic dropdown with optional search (CBSearchMode.auto / .always / .never + configurable searchThreshold), single or multi-select, custom item builders.

Dialogs

Widget	Description
CBDialog / CBDialog.show(...)	Generic themeable dialog with an easy static helper.
CBConfirmationDialog	Confirm/cancel pattern with an optional destructive style.
CBLoadingDialog	Non-dismissible loading dialog with .show() / .hide().

Loading

Widget	Description
CBLoader	Circular indicator, plus CBLoader.fullScreen() and CBLoader.inline() helpers.
CBLoadingOverlay	Wraps any widget with a blocking loading overlay.
CBShimmer	Shimmer placeholder (rectangle/circle/rounded), plus .circle() and .multiple() helpers.

States

Widget	Description
CBEmptyState	"Nothing here" placeholder with optional action button.
CBErrorState	Error placeholder with an optional retry button/callback.
CBStateBuilder	Switches between loading / error / empty / data automatically.

Cards & tiles

Widget	Description
CBCard	Theme-aware card: solid color, gradient, elevation or custom shadows, tap/long-press.
CBTile	List row with leading/title/subtitle/trailing, selection styling, optional divider.

Images

Widget	Description
CBNetworkImage	Cached network image with shimmer placeholder, error fallback, shaping.
CBAvatar	Image avatar, falling back to initials or an icon.

Feedback

Widget	Description
CBSnackbar	.success(), .error(), .warning(), .info() static helpers.

Layout

Widget	Description
CBSectionTitle	Section heading with an optional trailing action.
CBSpacing	Expressive .v() / .h() spacing widget with xs/sm/md/lg/xl presets.
CBDivider	Horizontal or vertical themed divider.

Utils

Widget	Description
CBResponsive / CBResponsiveBuilder	Simple width-based breakpoint helpers (mobile/tablet/desktop).

Detailed example: the dropdown search threshold

CBDropdown<String>(
  items: items,
  itemLabel: (e) => e,
  searchable: true,
  searchThreshold: 10, // search auto-hides below 10 items, auto-shows at/above it
)

// Force search always on:
CBDropdown<String>(
  items: items,
  itemLabel: (e) => e,
  searchable: true,
  searchMode: CBSearchMode.always,
)

// Force search always off:
CBDropdown<String>(
  items: items,
  itemLabel: (e) => e,
  searchable: true,
  searchMode: CBSearchMode.never,
)

Light & dark theme

Every widget in this package is theme-driven; no additional setup is required. Run the example/ app and toggle the app bar's theme icon to see every screen adapt automatically between light and dark ThemeData.

Screenshots/GIFs: add your own captures of the example/ app screens here before publishing.

Example app

See example/ for a full demo app covering every widget across dedicated screens (Buttons, Inputs, Dropdown, Dialogs, Loading, States, Cards & Tiles, Images & Avatars).

cd example
flutter run

Testing

flutter test

Contributing

Issues and pull requests are welcome. Please:

1. Keep the package free of app-specific colors, fonts, or business logic.
2. Preserve the "easy by default, powerful when customized" API style — every new parameter should have a sensible theme-derived default.
3. Add or update tests for behavioral changes (loading states, threshold logic, callbacks, etc.).
4. Run flutter analyze and flutter test before submitting.

License

MIT — see LICENSE.