tfn_design_system 0.1.0
tfn_design_system: ^0.1.0 copied to clipboard
TFN's Design System building blocks for Flutter applications.
Use this package as a library
Depend on it
Run this command:
With Dart:
$ dart pub add tfn_design_systemWith Flutter:
$ flutter pub add tfn_design_systemThis will add a line like this to your package's pubspec.yaml (and run an implicit dart pub get):
dependencies:
tfn_design_system: ^0.1.0Alternatively, your editor might support dart pub get or flutter pub get. Check the docs for your editor to learn more.
Import it
Now in your Dart code, you can use:
import 'package:tfn_design_system/components/auth_shell.dart';
import 'package:tfn_design_system/components/button/button.dart';
import 'package:tfn_design_system/components/cards/cards.dart';
import 'package:tfn_design_system/components/cards/collapsible_card.dart';
import 'package:tfn_design_system/components/cards/container_card.dart';
import 'package:tfn_design_system/components/cards/dashboard_card.dart';
import 'package:tfn_design_system/components/cards/debit_order_message_card.dart';
import 'package:tfn_design_system/components/cards/detail_card.dart';
import 'package:tfn_design_system/components/cards/message_card.dart';
import 'package:tfn_design_system/components/checkbox.dart';
import 'package:tfn_design_system/components/chips/filter_chip.dart';
import 'package:tfn_design_system/components/chips/selection_chip.dart';
import 'package:tfn_design_system/components/chips/status_filter_chip.dart';
import 'package:tfn_design_system/components/chips/status_filter_chips.dart';
import 'package:tfn_design_system/components/components.dart';
import 'package:tfn_design_system/components/inputs/cellphone.dart';
import 'package:tfn_design_system/components/inputs/date_field.dart';
import 'package:tfn_design_system/components/inputs/dropdown.dart';
import 'package:tfn_design_system/components/inputs/dropdown_menu.dart';
import 'package:tfn_design_system/components/inputs/file.dart';
import 'package:tfn_design_system/components/inputs/index.dart';
import 'package:tfn_design_system/components/inputs/password.dart';
import 'package:tfn_design_system/components/inputs/search.dart';
import 'package:tfn_design_system/components/inputs/text.dart';
import 'package:tfn_design_system/components/list_item.dart';
import 'package:tfn_design_system/components/loader.dart';
import 'package:tfn_design_system/components/menu_item.dart';
import 'package:tfn_design_system/components/navigation_bar.dart';
import 'package:tfn_design_system/components/notification_badge.dart';
import 'package:tfn_design_system/components/online_status.dart';
import 'package:tfn_design_system/components/progress_indicator.dart';
import 'package:tfn_design_system/components/radio.dart';
import 'package:tfn_design_system/components/responsive_image.dart';
import 'package:tfn_design_system/components/switch.dart';
import 'package:tfn_design_system/components/tabs.dart';
import 'package:tfn_design_system/components/tooltip.dart';
import 'package:tfn_design_system/components/user_avatar.dart';
import 'package:tfn_design_system/components/view_shell.dart';
import 'package:tfn_design_system/data/data.dart';
import 'package:tfn_design_system/data/mocks.dart';
import 'package:tfn_design_system/data/user/user.dart';
import 'package:tfn_design_system/data/user/user_repository.dart';
import 'package:tfn_design_system/data/vehicles/vehicle.dart';
import 'package:tfn_design_system/data/vehicles/vehicle_repository.dart';
import 'package:tfn_design_system/features/features.dart';
import 'package:tfn_design_system/features/signin/async_value.dart';
import 'package:tfn_design_system/features/signin/components/components.dart';
import 'package:tfn_design_system/features/signin/components/signin_card.dart';
import 'package:tfn_design_system/features/signin/signin.dart';
import 'package:tfn_design_system/features/signin/signin_screen.dart';
import 'package:tfn_design_system/features/signin/state/state.dart';
import 'package:tfn_design_system/features/signin/state/user_provider.dart';
import 'package:tfn_design_system/features/signin/views/signin_data_view.dart';
import 'package:tfn_design_system/features/signin/views/signin_error_view.dart';
import 'package:tfn_design_system/features/signin/views/signin_loading_view.dart';
import 'package:tfn_design_system/features/signin/views/views.dart';
import 'package:tfn_design_system/foundation/corner.dart';
import 'package:tfn_design_system/foundation/fonts.dart';
import 'package:tfn_design_system/foundation/index.dart';
import 'package:tfn_design_system/foundation/shapes.dart';
import 'package:tfn_design_system/foundation/sizes.dart';
import 'package:tfn_design_system/foundation/spacing.dart';
import 'package:tfn_design_system/foundation/text_styles.dart';
import 'package:tfn_design_system/theme/brand_theme.dart';
import 'package:tfn_design_system/theme/brand_theme_scope.dart';
import 'package:tfn_design_system/tokens/brand_assets.dart';
import 'package:tfn_design_system/tokens/brand_tokens.dart';
import 'package:tfn_design_system/tokens/colour_primitives_tokens.dart';
import 'package:tfn_design_system/tokens/colour_tokens.dart';
import 'package:tfn_design_system/tokens/component_colour_tokens.dart';
import 'package:tfn_design_system/tokens/corner_tokens.dart';
import 'package:tfn_design_system/tokens/index.dart';
import 'package:tfn_design_system/tokens/shape_tokens.dart';
import 'package:tfn_design_system/tokens/size_primitive_tokens.dart';
import 'package:tfn_design_system/tokens/spacing_tokens.dart';
import 'package:tfn_design_system/tokens/type_primitives.dart';
import 'package:tfn_design_system/tokens/typography_tokens.dart';
import 'package:tfn_design_system/utils/responsive_utils.dart';