From a1418a5b9ab087c656d51b87da97c5f325e98015 Mon Sep 17 00:00:00 2001 From: thelukewalton Date: Fri, 9 May 2025 12:33:16 +0100 Subject: [PATCH 1/5] deps: Update flutter to 3.29 and all other dependencies chore: Update to work with Zeta Flutter v1 --- example/.gitignore | 2 + example/devtools_options.yaml | 3 + example/lib/home.dart | 2 +- example/lib/main.dart | 42 +- example/lib/pages/components/app_bar.dart | 2 +- .../lib/pages/components/bottom_sheet.dart | 14 +- example/lib/pages/components/button.dart | 22 +- example/lib/pages/components/calendar.dart | 4 +- example/lib/pages/components/card.dart | 2 +- .../lib/pages/components/card_actions.dart | 4 +- .../pages/components/icon_text_button.dart | 4 +- example/lib/pages/components/index.dart | 4 +- .../lib/pages/components/information_bar.dart | 8 +- example/lib/pages/components/list_tile.dart | 12 +- example/lib/pages/components/popover.dart | 4 +- example/lib/pages/components/search.dart | 2 +- .../lib/pages/components/sheet_header.dart | 8 +- .../pages/components/slidable_list_tile.dart | 10 +- example/lib/pages/components/stats_card.dart | 6 +- example/lib/pages/components/tag.dart | 6 +- example/lib/pages/components/toolbar.dart | 10 +- example/lib/pages/theme/colors.dart | 72 +- example/lib/pages/theme/text.dart | 2 +- .../lib/pages/utils/theme_color_switch.dart | 90 +- .../pages/utils/theme_constrast_switch.dart | 37 +- .../lib/pages/utils/theme_mode_switch.dart | 39 +- .../Flutter/GeneratedPluginRegistrant.swift | 4 +- example/macos/Podfile.lock | 18 +- .../xcshareddata/xcschemes/Runner.xcscheme | 1 + example/macos/Runner/AppDelegate.swift | 4 + example/pubspec.yaml | 19 +- lib/src/components/atoms/avatar.dart | 2 +- lib/src/components/atoms/button.dart | 23 +- .../components/atoms/circle_icon_button.dart | 4 +- lib/src/components/atoms/expandable.dart | 4 +- .../components/atoms/icon_text_button.dart | 8 +- lib/src/components/atoms/label.dart | 4 +- lib/src/components/atoms/selection_pills.dart | 16 +- lib/src/components/atoms/speed_slider.dart | 10 +- lib/src/components/atoms/toggle_button.dart | 4 +- lib/src/components/molecules/block_table.dart | 2 +- .../components/molecules/bottom_sheet.dart | 2 +- .../components/molecules/check_button.dart | 10 +- lib/src/components/molecules/comment.dart | 10 +- .../molecules/date_range_picker.dart | 6 +- .../molecules/date_time_picker.dart | 2 +- lib/src/components/molecules/dropdown.dart | 4 +- .../components/molecules/expansion_tile.dart | 6 +- .../molecules/fields_list_tile.dart | 4 +- .../components/molecules/information_bar.dart | 4 +- .../components/molecules/input_dialog.dart | 2 +- lib/src/components/molecules/menu_item.dart | 4 +- .../components/molecules/network_avatar.dart | 2 +- .../molecules/resizeable_text_area.dart | 4 +- .../molecules/selectable_list_tile.dart | 10 +- .../components/molecules/sheet_header.dart | 2 +- .../molecules/slidable_list_tile.dart | 4 +- lib/src/components/molecules/star_rating.dart | 12 +- lib/src/components/molecules/stats_card.dart | 2 +- lib/src/components/molecules/tab_bar.dart | 30 +- lib/src/components/molecules/tag.dart | 18 +- lib/src/components/molecules/toast.dart | 22 +- .../components/molecules/vertical_nav.dart | 4 +- lib/src/components/organisms/app_bar.dart | 12 +- lib/src/components/organisms/calendar.dart | 42 +- .../organisms/camera/camera_page.dart | 20 +- .../organisms/chat/audio_decoration.dart | 4 +- .../chat/message_body/attachment.dart | 6 +- .../chat/message_body/chat_message.dart | 12 +- .../organisms/chat/message_body/deleted.dart | 2 +- .../chat/message_body/file_preview.dart | 8 +- .../chat/message_body/forwarded.dart | 4 +- .../chat/message_body/link_preview.dart | 13 +- .../chat/message_body/reacts_tags.dart | 8 +- .../chat/message_body/read_receipt.dart | 4 +- .../organisms/chat/message_body/reply.dart | 4 +- .../organisms/chat/message_body/text.dart | 4 +- .../organisms/chat/message_input.dart | 6 +- lib/src/components/organisms/date_range.dart | 5 - .../organisms/date_range_picker_tile.dart | 4 +- .../organisms/file_picker/file_picker.dart | 10 +- .../organisms/file_picker/file_wrapper.dart | 10 - .../organisms/file_picker/giphy_picker.dart | 2 +- .../components/organisms/file_preview.dart | 4 +- .../organisms/fiscal_date_picker.dart | 4 +- .../organisms/html_preview/html_body.dart | 10 +- .../html_preview/table_html_extension.dart | 2 +- .../image_editor/pages/draw_page.dart | 4 +- .../image_editor/pages/draw_shape_page.dart | 8 +- .../image_editor/pages/text_page.dart | 2 +- .../image_editor/utils/editor_icon.dart | 2 +- lib/src/components/organisms/list_group.dart | 6 +- lib/src/components/organisms/list_tile.dart | 4 +- .../components/organisms/navigation_menu.dart | 4 +- lib/src/components/organisms/profile.dart | 2 +- .../components/organisms/properties_list.dart | 2 +- .../components/organisms/search_app_bar.dart | 2 +- .../organisms/selectable_widget.dart | 2 +- lib/src/utils/assets/icons.dart | 21 +- lib/src/utils/theme/input_border.dart | 2 +- lib/src/utils/theme/theme.dart | 152 +-- .../theme/theme_builders/app_bar_theme.dart | 10 +- .../theme_builders/bottom_app_bar_theme.dart | 26 +- .../bottom_navigation_bar_theme.dart | 16 +- .../theme_builders/bottom_sheet_theme.dart | 6 +- .../theme/theme_builders/button_theme.dart | 27 +- .../theme/theme_builders/card_theme.dart | 24 +- .../theme/theme_builders/checkbox_theme.dart | 26 +- .../theme/theme_builders/chip_theme.dart | 27 +- .../theme_builders/date_picker_theme.dart | 12 +- .../theme/theme_builders/dialog_theme.dart | 10 +- .../theme/theme_builders/divider_theme.dart | 10 +- .../theme/theme_builders/icon_theme.dart | 4 +- .../input_decoration_theme.dart | 34 +- .../theme/theme_builders/list_tile_theme.dart | 20 +- .../theme_builders/popup_menu_theme.dart | 12 +- .../progress_indicator_theme.dart | 10 +- .../theme/theme_builders/radio_theme.dart | 20 +- .../theme_builders/search_bar_theme.dart | 10 +- .../theme/theme_builders/slider_theme.dart | 18 +- .../theme/theme_builders/switch_theme.dart | 10 +- .../theme/theme_builders/tab_bar_theme.dart | 16 +- .../theme_builders/text_selection_theme.dart | 14 +- .../theme/theme_builders/zeta_theme.dart | 67 +- lib/src/utils/theme/theme_constants.dart | 4 - lib/src/utils/theme/theme_data.dart | 988 +++++++++--------- lib/src/utils/theme/theme_service.dart | 146 ++- lib/src/utils/tools/modifiers.dart | 21 - lib/src/utils/tools/nested_flow.dart | 27 +- lib/src/utils/tools/tab_navigator.dart | 5 + lib/src/utils/tools/utils.dart | 14 +- pubspec.yaml | 69 +- test/fixtures/test_app.dart | 2 +- 133 files changed, 1275 insertions(+), 1541 deletions(-) create mode 100644 example/devtools_options.yaml diff --git a/example/.gitignore b/example/.gitignore index 1eab1a22..13f41015 100644 --- a/example/.gitignore +++ b/example/.gitignore @@ -5,9 +5,11 @@ *.swp .DS_Store .atom/ +.build/ .buildlog/ .history .svn/ +.swiftpm/ migrate_working_dir/ # IntelliJ related diff --git a/example/devtools_options.yaml b/example/devtools_options.yaml new file mode 100644 index 00000000..fa0b357c --- /dev/null +++ b/example/devtools_options.yaml @@ -0,0 +1,3 @@ +description: This file stores settings for Dart & Flutter DevTools. +documentation: https://docs.flutter.dev/tools/devtools/extensions#configure-extension-enablement-states +extensions: diff --git a/example/lib/home.dart b/example/lib/home.dart index 044c05cf..1b288144 100644 --- a/example/lib/home.dart +++ b/example/lib/home.dart @@ -51,7 +51,7 @@ class _HomePageState extends State { title: Text(route.title), trailing: Icon( Icons.keyboard_arrow_right, - color: zeta.colors.iconSubtle, + color: zeta.colors.mainSubtle, ), onTap: () => Navigator.of(context).pushNamed(route.routeName)); }).toList(), diff --git a/example/lib/main.dart b/example/lib/main.dart index b4ad05f6..77ed4558 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -10,31 +10,36 @@ import 'routes.dart'; void main() async { WidgetsFlutterBinding.ensureInitialized(); final preferences = await SharedPreferences.getInstance(); - final themeService = ZdsThemeService(assetPath: 'assets/colors.json', preferences: preferences); - final themeData = await themeService.load(); + // final themeService = ZdsThemeService(assetPath: 'assets/colors.json', preferences: preferences); + // final themeData = await themeService.load(); HttpOverrides.global = MyHttpOverrides(); runApp( DemoApp( - data: themeData, - themeService: themeService, - ), + // data: themeData, + // themeService: themeService, + ), ); } class DemoApp extends StatelessWidget { - const DemoApp({Key? key, required this.data, required this.themeService}) : super(key: key); + const DemoApp({ + Key? key, + // this.data, + this.themeService, + }) : super(key: key); - final ZetaThemeService themeService; - final ZdsThemeData data; + final ZetaThemeService? themeService; + // final ZdsThemeData data; @override Widget build(BuildContext context) { return ZetaProvider( - themeService: themeService, - initialThemeMode: data.themeMode, - initialThemeData: data.themeData, - initialContrast: data.contrast, - builder: (context, themeData, themeMode) { + themeService: themeService ?? const ZetaDefaultThemeService(), + // initialThemeMode: data.themeMode, + + // initialThemeData: data.themeData, + // initialContrast: data.contrast, + builder: (context, themeData, darkTheme, themeMode) { return MaterialApp( title: 'Zds Demo', localeResolutionCallback: (Locale? locale, Iterable supportedLocales) { @@ -56,14 +61,9 @@ class DemoApp extends StatelessWidget { ], routes: kAllRoutes, themeMode: themeMode, - theme: themeData.colorsLight.toScheme().toTheme( - fontFamily: themeData.fontFamily, - appBarStyle: data.lightAppBarStyle, - ), - darkTheme: themeData.colorsDark.toScheme().toTheme( - fontFamily: themeData.fontFamily, - appBarStyle: data.darkAppBarStyle, - ), + // theme: themeData, + theme: themeData.copyWith(scaffoldBackgroundColor: Colors.red), + darkTheme: darkTheme, ); }, ); diff --git a/example/lib/pages/components/app_bar.dart b/example/lib/pages/components/app_bar.dart index c77bde42..e0d4d86c 100644 --- a/example/lib/pages/components/app_bar.dart +++ b/example/lib/pages/components/app_bar.dart @@ -115,7 +115,7 @@ class _AppBarDemoState extends State with SingleTickerProviderStateM color: ZdsTabBarColor.surface, icon: CircleAvatar( radius: 15, - backgroundColor: zetaColors.secondary, + backgroundColor: zetaColors.mainSecondary, child: Text( 'DM', style: TextStyle( diff --git a/example/lib/pages/components/bottom_sheet.dart b/example/lib/pages/components/bottom_sheet.dart index fd5e104a..3b2031b1 100644 --- a/example/lib/pages/components/bottom_sheet.dart +++ b/example/lib/pages/components/bottom_sheet.dart @@ -245,14 +245,14 @@ class _BottomSheetDemoState extends State with SingleTickerProv ZdsListTile( leading: Text('Urgent'), trailing: ZdsIndex( - color: Zeta.of(context).colors.red, + color: Zeta.of(context).colors.mainNegative, child: Text('U'), ), ), ZdsListTile( leading: Text('Height'), trailing: ZdsIndex( - color: Zeta.of(context).colors.orange, + color: Zeta.of(context).colors.mainWarning, child: Text('1'), ), ), @@ -266,7 +266,7 @@ class _BottomSheetDemoState extends State with SingleTickerProv ZdsListTile( leading: Text('Low'), trailing: ZdsIndex( - color: Zeta.of(context).colors.green, + color: Zeta.of(context).colors.mainPositive, child: Text('3'), ), ), @@ -308,7 +308,7 @@ class _BottomSheetDemoState extends State with SingleTickerProv ExcludeSemantics( child: Text( 'Date range', - style: themeData.textTheme.titleSmall?.copyWith(color: zetaColors.textSubtle), + style: themeData.textTheme.titleSmall?.copyWith(color: zetaColors.mainSubtle), ).paddingOnly(left: 8), ), const SizedBox(height: 8), @@ -323,7 +323,7 @@ class _BottomSheetDemoState extends State with SingleTickerProv child: Text( 'Type', style: themeData.textTheme.titleSmall?.copyWith( - color: zetaColors.textSubtle, + color: zetaColors.mainSubtle, ), ).paddingOnly(left: 8), ), @@ -398,7 +398,7 @@ class _BottomSheetDemoState extends State with SingleTickerProv child: Text( 'Date range', style: Theme.of(context).textTheme.titleSmall?.copyWith( - color: Zeta.of(context).colors.textSubtle, + color: Zeta.of(context).colors.mainSubtle, ), ).paddingOnly(left: 10), ), @@ -414,7 +414,7 @@ class _BottomSheetDemoState extends State with SingleTickerProv child: Text( 'Type', style: Theme.of(context).textTheme.titleSmall?.copyWith( - color: Zeta.of(context).colors.textSubtle, + color: Zeta.of(context).colors.mainSubtle, ), ).paddingOnly(left: 10), ), diff --git a/example/lib/pages/components/button.dart b/example/lib/pages/components/button.dart index 2998a4a5..77134dd1 100644 --- a/example/lib/pages/components/button.dart +++ b/example/lib/pages/components/button.dart @@ -189,7 +189,7 @@ class _ButtonDemoState extends State { splashRadius: 20, visualDensity: VisualDensity.compact, onPressed: open, - color: Zeta.of(context).colors.iconSubtle, + color: Zeta.of(context).colors.mainSubtle, icon: const Icon(ZdsIcons.more_vert), ), items: const [ @@ -301,9 +301,9 @@ class _ButtonDemoState extends State { ), const SizedBox(height: 12), ZdsSlidableButton( - buttonColor: Zeta.of(context).colors.iconDefault, + buttonColor: Zeta.of(context).colors.mainDefault, buttonText: 'Clock Out', - buttonSliderColor: Zeta.of(context).colors.warm.surface, + buttonSliderColor: Zeta.of(context).colors.surfaceWarm, buttonIcon: ZdsIcons.clock_stop, ), const SizedBox(height: 36), @@ -332,10 +332,10 @@ class _ButtonDemoState extends State { Text('Active, basic without animation', style: Theme.of(context).textTheme.headlineMedium), const SizedBox(height: 12), ZdsSlidableButton( - buttonColor: Zeta.of(context).colors.iconDefault, + buttonColor: Zeta.of(context).colors.mainDefault, buttonText: 'Clock Out', buttonIcon: ZdsIcons.clock_stop, - buttonSliderColor: Zeta.of(context).colors.warm.surface, + buttonSliderColor: Zeta.of(context).colors.surfaceWarm, onSlideComplete: () async { debugPrint('Done!'); return true; @@ -348,13 +348,13 @@ class _ButtonDemoState extends State { ), const SizedBox(height: 12), ZdsSlidableButton( - buttonColor: Zeta.of(context).colors.iconDefault, + buttonColor: Zeta.of(context).colors.mainDefault, buttonColorEnd: Theme.of(context).colorScheme.secondary, buttonText: 'Clock Out', buttonTextEnd: DateTime.now().format('KK:mm a'), buttonIcon: ZdsIcons.clock_stop, buttonIconEnd: ZdsIcons.check_circle, - buttonSliderColor: Zeta.of(context).colors.warm.surface, + buttonSliderColor: Zeta.of(context).colors.surfaceWarm, buttonSliderColorEnd: Theme.of(context).primaryColorLight, onSlideComplete: () async { debugPrint('Done!'); @@ -366,19 +366,19 @@ class _ButtonDemoState extends State { Text('Disabled, no message', style: Theme.of(context).textTheme.headlineMedium), const SizedBox(height: 12), ZdsSlidableButton( - buttonColor: Zeta.of(context).colors.iconDefault, + buttonColor: Zeta.of(context).colors.mainDefault, buttonText: 'Clock Out', buttonIcon: ZdsIcons.clock_stop, - buttonSliderColor: Zeta.of(context).colors.warm.surface, + buttonSliderColor: Zeta.of(context).colors.surfaceWarm, ), const SizedBox(height: 36), Text('Disabled with message', style: Theme.of(context).textTheme.headlineMedium), const SizedBox(height: 12), ZdsSlidableButton( - buttonColor: Zeta.of(context).colors.iconDefault, + buttonColor: Zeta.of(context).colors.mainDefault, buttonText: 'Clock Out', buttonIcon: ZdsIcons.clock_stop, - buttonSliderColor: Zeta.of(context).colors.warm.surface, + buttonSliderColor: Zeta.of(context).colors.surfaceWarm, disabledMessage: 'Disabled message that is quite long and goes over two lines', ), ], diff --git a/example/lib/pages/components/calendar.dart b/example/lib/pages/components/calendar.dart index 394cabe9..63153605 100644 --- a/example/lib/pages/components/calendar.dart +++ b/example/lib/pages/components/calendar.dart @@ -103,7 +103,9 @@ class _CalendarDemoState extends State { singleMarkerBuilder: (BuildContext context, DateTime date, dynamic _) { return Container( decoration: BoxDecoration( - color: date.isAfter(DateTime.now()) ? Zeta.of(context).colors.red : Zeta.of(context).colors.green, + color: date.isAfter(DateTime.now()) + ? Zeta.of(context).colors.mainNegative + : Zeta.of(context).colors.mainPositive, shape: BoxShape.circle, ), width: 5, diff --git a/example/lib/pages/components/card.dart b/example/lib/pages/components/card.dart index 993dd7f4..fda0a4e8 100644 --- a/example/lib/pages/components/card.dart +++ b/example/lib/pages/components/card.dart @@ -80,7 +80,7 @@ class CardDemo extends StatelessWidget { onPressed: () {}, icon: Transform.rotate( angle: math.pi / 2, - child: Icon(ZdsIcons.more_vert, color: Zeta.of(context).colors.iconSubtle), + child: Icon(ZdsIcons.more_vert, color: Zeta.of(context).colors.mainSubtle), ), ), child: const Text('With Header'), diff --git a/example/lib/pages/components/card_actions.dart b/example/lib/pages/components/card_actions.dart index 2e1207da..32b15c7b 100644 --- a/example/lib/pages/components/card_actions.dart +++ b/example/lib/pages/components/card_actions.dart @@ -120,14 +120,14 @@ class CardActionsDemo extends StatelessWidget { Text( '04/19/2021 03:35 PM', style: themeData.textTheme.titleSmall?.copyWith( - color: Zeta.of(context).colors.textSubtle, + color: Zeta.of(context).colors.mainSubtle, ), ), const SizedBox(height: 16), Text( 'SR-ROC-Rockford IL.00102', style: themeData.textTheme.titleSmall?.copyWith( - color: Zeta.of(context).colors.textSubtle, + color: Zeta.of(context).colors.mainSubtle, ), ), ], diff --git a/example/lib/pages/components/icon_text_button.dart b/example/lib/pages/components/icon_text_button.dart index 127b01f8..b4ec3656 100644 --- a/example/lib/pages/components/icon_text_button.dart +++ b/example/lib/pages/components/icon_text_button.dart @@ -23,13 +23,13 @@ class IconTextButtonDemo extends StatelessWidget { onTap: () => {onButtonTapped(context)}, icon: ZdsIcons.clock_switch, label: 'Shift Trade', - backgroundColor: zeta.colors.orange, + backgroundColor: zeta.colors.mainWarning, ), ZdsIconTextButton( onTap: () => {onButtonTapped(context)}, icon: ZdsIcons.clock_available, label: 'Availability', - backgroundColor: zeta.colors.pink, + backgroundColor: zeta.colors.primitives.pink, ) ], ), diff --git a/example/lib/pages/components/index.dart b/example/lib/pages/components/index.dart index cae918f7..683e74ce 100644 --- a/example/lib/pages/components/index.dart +++ b/example/lib/pages/components/index.dart @@ -15,14 +15,14 @@ class IndexDemo extends StatelessWidget { ZdsListTile( leading: ZdsIndex( child: Text('2'), - color: Zeta.of(context).colors.blue, + color: Zeta.of(context).colors.mainPrimary, ), title: Text('Showcase Extravaganza'), ), ZdsListTile( leading: ZdsIndex( child: Text('2'), - color: Zeta.of(context).colors.purple, + color: Zeta.of(context).colors.mainInfo, ), title: Text('Showcase Extravaganza'), ), diff --git a/example/lib/pages/components/information_bar.dart b/example/lib/pages/components/information_bar.dart index b2640f6e..11014654 100644 --- a/example/lib/pages/components/information_bar.dart +++ b/example/lib/pages/components/information_bar.dart @@ -10,19 +10,19 @@ class InformationBarDemo extends StatelessWidget { return Scaffold( body: Column(children: [ ZdsInformationBar( - zetaColorSwatch: zeta.colors.green, + zetaColorSwatch: zeta.colors.primitives.green, icon: ZdsIcons.check, label: 'Approved', ), SizedBox(height: 10), ZdsInformationBar( - zetaColorSwatch: zeta.colors.blue, + zetaColorSwatch: zeta.colors.primitives.blue, icon: ZdsIcons.hourglass, label: 'Pending', ), SizedBox(height: 10), ZdsInformationBar( - zetaColorSwatch: zeta.colors.red, + zetaColorSwatch: zeta.colors.primitives.red, icon: ZdsIcons.close, label: 'Declined', ), @@ -30,7 +30,7 @@ class InformationBarDemo extends StatelessWidget { ZdsInformationBar( icon: Icons.category, label: 'Neutral text', - zetaColorSwatch: zeta.colors.warm, + zetaColorSwatch: zeta.colors.primitives.warm, ) ]), ); diff --git a/example/lib/pages/components/list_tile.dart b/example/lib/pages/components/list_tile.dart index 4ae0252c..b06d5d6d 100644 --- a/example/lib/pages/components/list_tile.dart +++ b/example/lib/pages/components/list_tile.dart @@ -17,22 +17,22 @@ class ListTileDemo extends StatelessWidget { title: const Text('Urgent'), subTitle: const Text('32 hours available'), selected: true, - trailing: ZdsIndex(color: zeta.colors.red, child: const Text('U')), + trailing: ZdsIndex(color: zeta.colors.mainNegative, child: const Text('U')), onTap: () {}, ), ZdsSelectableListTile( title: const Text('High'), - trailing: ZdsIndex(color: zeta.colors.orange, child: const Text('1')), + trailing: ZdsIndex(color: zeta.colors.mainWarning, child: const Text('1')), onTap: () {}, ), ZdsSelectableListTile( title: const Text('Medium'), - trailing: ZdsIndex(color: zeta.colors.teal, child: const Text('2')), + trailing: ZdsIndex(color: zeta.colors.primitives.teal, child: const Text('2')), onTap: () {}, ), ZdsSelectableListTile( title: const Text('Low'), - trailing: ZdsIndex(color: zeta.colors.green, child: const Text('3')), + trailing: ZdsIndex(color: zeta.colors.mainPositive, child: const Text('3')), onTap: () {}, ), ZdsSelectableListTile.checkable( @@ -235,7 +235,7 @@ class ListTileDemo extends StatelessWidget { leading: Container( width: 6, height: 65, - color: zeta.colors.red, + color: zeta.colors.mainNegative, ), ), ZdsNotificationTile( @@ -248,7 +248,7 @@ class ListTileDemo extends StatelessWidget { content: 'Meeting with Jordan Smith at Jan 11 at 11:00 am', leadingData: Icon( ZdsIcons.lightbulb, - color: zeta.colors.orange, + color: zeta.colors.mainWarning, size: 16, ), ), diff --git a/example/lib/pages/components/popover.dart b/example/lib/pages/components/popover.dart index 7d78db26..9c391c9b 100644 --- a/example/lib/pages/components/popover.dart +++ b/example/lib/pages/components/popover.dart @@ -48,11 +48,11 @@ class _PopOverDemoState extends State { ), ZdsPopOverIconButton( icon: const Icon(ZdsIcons.sort), - backgroundColor: Zeta.of(context).colors.red, + backgroundColor: Zeta.of(context).colors.mainNegative, popOverBuilder: (context) { return Container( child: const Text('Lorem ipsum dolor sit amet.').textStyle( - Theme.of(context).textTheme.bodyLarge?.copyWith(color: Zeta.of(context).colors.red.onColor), + Theme.of(context).textTheme.bodyLarge?.copyWith(color: Zeta.of(context).colors.mainNegative.onColor), ), ).paddingInsets(_contentPadding); }, diff --git a/example/lib/pages/components/search.dart b/example/lib/pages/components/search.dart index 2b828a71..a0bc1213 100644 --- a/example/lib/pages/components/search.dart +++ b/example/lib/pages/components/search.dart @@ -50,7 +50,7 @@ class _SearchDemoState extends State { Widget build(BuildContext context) { final clearButton = _showSuffixClearButton ? IconButton( - icon: Icon(ZdsIcons.close_circle, color: Zeta.of(context).colors.iconSubtle), + icon: Icon(ZdsIcons.close_circle, color: Zeta.of(context).colors.mainSubtle), onPressed: _clearButtonFieldController.clear, ) : null; diff --git a/example/lib/pages/components/sheet_header.dart b/example/lib/pages/components/sheet_header.dart index b30bfbef..769fff88 100644 --- a/example/lib/pages/components/sheet_header.dart +++ b/example/lib/pages/components/sheet_header.dart @@ -71,20 +71,20 @@ class SheetHeaderDemo extends StatelessWidget { children: [ ZdsListTile( leading: const Text('Urgent'), - trailing: ZdsIndex(color: Zeta.of(context).colors.red, child: const Text('U')), + trailing: ZdsIndex(color: Zeta.of(context).colors.mainNegative, child: const Text('U')), ), ZdsListTile( leading: const Text('High'), - trailing: ZdsIndex(color: Zeta.of(context).colors.orange, child: const Text('1')), + trailing: ZdsIndex(color: Zeta.of(context).colors.mainWarning, child: const Text('1')), ), ZdsListTile( leading: const Text('Medium'), - trailing: ZdsIndex(color: Zeta.of(context).colors.teal, child: const Text('2')), + trailing: ZdsIndex(color: Zeta.of(context).colors.primitives.teal, child: const Text('2')), ), ZdsListTile( leading: const Text('Low'), trailing: ZdsIndex( - color: Zeta.of(context).colors.green, + color: Zeta.of(context).colors.mainPositive, child: const Text('3'), ), ), diff --git a/example/lib/pages/components/slidable_list_tile.dart b/example/lib/pages/components/slidable_list_tile.dart index 5f5b0cbf..4f5e51ab 100644 --- a/example/lib/pages/components/slidable_list_tile.dart +++ b/example/lib/pages/components/slidable_list_tile.dart @@ -111,7 +111,7 @@ class SlidableListTileDemo extends StatelessWidget { height: 60, child: ZdsSlidableListTile( slideButtonWidth: 120, - backgroundColor: zetaColors.red, + backgroundColor: zetaColors.mainNegative, width: MediaQuery.of(context).size.width, actions: [ ZdsSlidableAction( @@ -121,13 +121,13 @@ class SlidableListTileDemo extends StatelessWidget { ), ZdsSlidableAction( label: 'Direct swap', - backgroundColor: zetaColors.purple, - foregroundColor: zetaColors.purple.onColor, + backgroundColor: zetaColors.mainInfo, + foregroundColor: zetaColors.mainInfo.onColor, ), ZdsSlidableAction( label: 'Swap with anyone', - backgroundColor: themeData.colorScheme.secondaryContainer, - foregroundColor: themeData.colorScheme.secondaryContainer.onColor, + backgroundColor: themeData.colorScheme.secondary, + foregroundColor: themeData.colorScheme.secondary.onColor, textOverflow: TextOverflow.visible) ], child: const Center(child: Text('A list tile with 3 slidable action buttons')), diff --git a/example/lib/pages/components/stats_card.dart b/example/lib/pages/components/stats_card.dart index a2c75ef6..906dae8c 100644 --- a/example/lib/pages/components/stats_card.dart +++ b/example/lib/pages/components/stats_card.dart @@ -22,7 +22,7 @@ class StatsCardDemo extends StatelessWidget { ZdsStat( value: 32.4, description: 'Remaining', - color: Zeta.of(context).colors.green, + color: Zeta.of(context).colors.mainPositive, ) ], title: 'Medical', @@ -35,7 +35,7 @@ class StatsCardDemo extends StatelessWidget { ZdsStat( value: 1.75, description: 'Remaining', - color: Zeta.of(context).colors.green, + color: Zeta.of(context).colors.mainPositive, ) ], title: 'Floating Holidays', @@ -48,7 +48,7 @@ class StatsCardDemo extends StatelessWidget { ZdsStat( value: 5, description: 'Remaining', - color: Zeta.of(context).colors.green, + color: Zeta.of(context).colors.mainPositive, ) ], title: 'Vacation', diff --git a/example/lib/pages/components/tag.dart b/example/lib/pages/components/tag.dart index 304fe5e5..fbd86cfe 100644 --- a/example/lib/pages/components/tag.dart +++ b/example/lib/pages/components/tag.dart @@ -135,7 +135,7 @@ class TagDemo extends StatelessWidget { child: ZdsListTile( trailing: ZdsTag( filled: true, - customColor: zetaColors.cool, + customColor: zetaColors.primitives.cool, child: const Text('Custom onClose'), onClose: () {}, ), @@ -188,7 +188,7 @@ class TagDemo extends StatelessWidget { trailing: ZdsTag( rectangular: true, color: ZdsTagColor.success, - prefix: Icon(Icons.check, size: 18, color: zetaColors.green), + prefix: Icon(Icons.check, size: 18, color: zetaColors.mainPositive), child: const Text( 'Approved', ), @@ -212,7 +212,7 @@ class TagDemo extends StatelessWidget { trailing: ZdsTag( rectangular: true, color: ZdsTagColor.error, - prefix: Icon(Icons.close, size: 18, color: zetaColors.red), + prefix: Icon(Icons.close, size: 18, color: zetaColors.mainNegative), child: const Text('Declined'), ), ), diff --git a/example/lib/pages/components/toolbar.dart b/example/lib/pages/components/toolbar.dart index b0e4c1b2..35a103ac 100644 --- a/example/lib/pages/components/toolbar.dart +++ b/example/lib/pages/components/toolbar.dart @@ -32,7 +32,7 @@ class _ToolBarDemoState extends State { ), ), ZdsToolbar( - backgroundColor: zetaColors.iconDefault, + backgroundColor: zetaColors.mainDefault, title: ZdsDateRange( emptyLabel: 'Select range', isSelectable: false, @@ -47,7 +47,7 @@ class _ToolBarDemoState extends State { ), ), ZdsToolbar( - backgroundColor: zetaColors.primary, + backgroundColor: zetaColors.mainPrimary, title: ZdsDateRange( emptyLabel: 'Select range', initialDateRange: r, @@ -87,11 +87,11 @@ class _ToolBarDemoState extends State { ), ), ZdsToolbar( - backgroundColor: zetaColors.yellow.surface, + backgroundColor: zetaColors.surfaceSecondary, title: ZdsDateRange( textStyle: Theme.of(context).textTheme.titleSmall?.copyWith( fontWeight: FontWeight.w500, - color: zetaColors.yellow.selected, + color: zetaColors.stateSecondarySelected, ), initialDateRange: DateTimeRange( start: DateTime(2022, 05, 12), @@ -110,7 +110,7 @@ class _ToolBarDemoState extends State { ), ], child: Container( - color: Theme.of(context).colorScheme.surfacePrimary, + color: Theme.of(context).colorScheme.surface, height: 400, ), ), diff --git a/example/lib/pages/theme/colors.dart b/example/lib/pages/theme/colors.dart index 241f1dba..221f5534 100644 --- a/example/lib/pages/theme/colors.dart +++ b/example/lib/pages/theme/colors.dart @@ -36,11 +36,11 @@ class ColorsDemo extends StatelessWidget { 'name': 'Tertiary', 'subtitle': 'Theme.of(context).colorScheme.primaryContainer', }, - { - 'color': Theme.of(context).colorScheme.secondaryContainer, - 'name': 'Quaternary', - 'subtitle': 'Theme.of(context).colorScheme.secondaryContainer', - }, + // { + // 'color': Theme.of(context).colorScheme.mainSecondaryContainer, + // 'name': 'Quaternary', + // 'subtitle': 'Theme.of(context).colorScheme.mainSecondaryContainer', + // }, ]; final theme = [ @@ -74,11 +74,11 @@ class ColorsDemo extends StatelessWidget { 'name': 'onSecondary', 'subtitle': 'Theme.of(context).colorScheme.onSecondary', }, - { - 'color': Theme.of(context).colorScheme.secondaryContainer, - 'name': 'secondaryContainer', - 'subtitle': 'Theme.of(context).colorScheme.secondaryContainer', - }, + // { + // 'color': Theme.of(context).colorScheme.mainSecondaryContainer, + // 'name': 'secondaryContainer', + // 'subtitle': 'Theme.of(context).colorScheme.mainSecondaryContainer', + // }, { 'color': Theme.of(context).colorScheme.onSecondaryContainer, 'name': 'onSecondaryContainer', @@ -105,18 +105,18 @@ class ColorsDemo extends StatelessWidget { 'subtitle': 'Theme.of(context).colorScheme.onError', }, ]; - final List> greys = [ - { - 'color': Zeta.of(context).colors.black, - 'name': 'Black', - 'subtitle': 'Zeta.of(context).colors.black', - }, - { - 'color': Zeta.of(context).colors.white, - 'name': 'White', - 'subtitle': 'Zeta.of(context).colors.white', - }, - ]; + // final List> greys = [ + // { + // 'color': Zeta.of(context).colors.black, + // 'name': 'Black', + // 'subtitle': 'Zeta.of(context).colors.black', + // }, + // { + // 'color': Zeta.of(context).colors.white, + // 'name': 'White', + // 'subtitle': 'Zeta.of(context).colors.white', + // }, + // ]; final alertColors = [ { 'color': Zeta.of(context).colors.surfacePositive, @@ -151,7 +151,7 @@ class ColorsDemo extends StatelessWidget { children: [ _ColorRow(colors: theme, title: 'Theme colors'), _ColorRow(colors: primaryColors, title: 'Primary colors'), - _ColorRow(colors: greys, title: 'Greys'), + // _ColorRow(colors: greys, title: 'Greys'), _ColorRow(colors: alertColors, title: 'Alert colors'), const _PrimarySwatches(), const _OtherSwatches(), @@ -229,31 +229,31 @@ class _OtherSwatches extends StatelessWidget { final swatches = [ { 'key': 'Red', - 'value': Zeta.of(context).colors.red, + 'value': Zeta.of(context).colors.primitives.red, }, { 'key': 'Orange', - 'value': Zeta.of(context).colors.orange, + 'value': Zeta.of(context).colors.primitives.orange, }, { 'key': 'Yellow', - 'value': Zeta.of(context).colors.yellow, + 'value': Zeta.of(context).colors.primitives.yellow, }, { 'key': 'Green', - 'value': Zeta.of(context).colors.green, + 'value': Zeta.of(context).colors.primitives.green, }, { 'key': 'Blue', - 'value': Zeta.of(context).colors.blue, + 'value': Zeta.of(context).colors.primitives.blue, }, { 'key': 'Teal', - 'value': Zeta.of(context).colors.teal, + 'value': Zeta.of(context).colors.primitives.teal, }, { 'key': 'Pink', - 'value': Zeta.of(context).colors.pink, + 'value': Zeta.of(context).colors.primitives.pink, }, ]; return Column( @@ -329,30 +329,30 @@ class _PrimarySwatches extends StatelessWidget { children: [ const _Spacer(), _Swatch( - swatch: Zeta.of(context).colors.primary, + swatch: Zeta.of(context).colors.primitives.primary, values: List.generate(10, (i) => {'val': (i + 1) * 10, 'display': '${(i + 1) * 10}%'}), headColor: Theme.of(context).colorScheme.primary, headText: 'Primary', ), const _Spacer(), _Swatch( - swatch: Zeta.of(context).colors.secondary, + swatch: Zeta.of(context).colors.primitives.secondary, values: List.generate(10, (i) => {'val': (i + 1) * 10, 'display': '${(i + 1) * 10}%'}), headColor: Theme.of(context).colorScheme.secondary, headText: 'Secondary', ), const _Spacer(), _Swatch( - swatch: Zeta.of(context).colors.warm, + swatch: Zeta.of(context).colors.primitives.warm, values: List.generate(10, (i) => {'val': (i + 1) * 10, 'display': '${(i + 1) * 10}%'}), - headColor: Zeta.of(context).colors.warm, + headColor: Zeta.of(context).colors.primitives.warm, headText: 'Warm grey', ), const _Spacer(), _Swatch( - swatch: Zeta.of(context).colors.cool, + swatch: Zeta.of(context).colors.primitives.cool, values: List.generate(10, (i) => {'val': (i + 1) * 10, 'display': '${(i + 1) * 10}%'}), - headColor: Zeta.of(context).colors.cool, + headColor: Zeta.of(context).colors.primitives.cool, headText: 'Cool grey', ), const _Spacer(), diff --git a/example/lib/pages/theme/text.dart b/example/lib/pages/theme/text.dart index cab46642..bfac5052 100644 --- a/example/lib/pages/theme/text.dart +++ b/example/lib/pages/theme/text.dart @@ -115,7 +115,7 @@ class _FontGroup extends StatelessWidget { Text(e['header'].toString(), style: style), Text( 'Font: ${style.fontFamily}\nSize: ${style.fontSize?.toInt()}\nLine height: ${((style.height ?? 1) * style.fontSize!).toInt()}', - style: TextStyle(color: Zeta.of(context).colors.textSubtle), + style: TextStyle(color: Zeta.of(context).colors.mainSubtle), ), const _Spacer(), ], diff --git a/example/lib/pages/utils/theme_color_switch.dart b/example/lib/pages/utils/theme_color_switch.dart index 2490ac3a..6236d067 100644 --- a/example/lib/pages/utils/theme_color_switch.dart +++ b/example/lib/pages/utils/theme_color_switch.dart @@ -1,67 +1,57 @@ import 'package:flutter/material.dart'; import 'package:zeta_flutter/zeta_flutter.dart'; -class ZetaThemeColorSwitch extends StatelessWidget { +class ZetaThemeColorSwitch extends StatefulWidget { ZetaThemeColorSwitch({super.key}); - late final _themes = { - "default": ZetaThemeData(), - "teal": ZetaThemeData( - identifier: 'teal', - primary: ZetaColorBase.teal, - ), - "yellow": ZetaThemeData( - identifier: 'yellow', - primary: ZetaColorBase.yellow, - ), - "red": ZetaThemeData( - identifier: 'red', - primary: ZetaColorBase.red, - ), - "purple": ZetaThemeData( - identifier: 'purple', - primary: ZetaColorBase.purple, - ), - }; + @override + State createState() => _ZetaThemeColorSwitchState(); +} +class _ZetaThemeColorSwitchState extends State { @override Widget build(BuildContext context) { - var zeta = Zeta.of(context); + final zeta = Zeta.of(context); + final zetaProvider = ZetaProvider.of(context); + + final Map items = {}; + items.putIfAbsent(null, () => Icon(ZetaIcons.block)); - ZetaColors primary(ZetaThemeData data) { - if (zeta.brightness == Brightness.light) { - return data.colorsLight; - } else { - return data.colorsDark; - } - } + zetaProvider.customThemes.forEach((e) { + final color = e.primary; + final name = e.id; + items.putIfAbsent( + name, + () => ZetaAvatar( + size: ZetaAvatarSize.xxs, + backgroundColor: zeta.colors.surfaceDefault, + image: Icon( + Icons.color_lens, + color: color ?? + (Zeta.of(context).brightness == Brightness.light + ? ZetaPrimitivesLight().blue + : ZetaPrimitivesDark().blue), + ), + ), + ); + }); return DropdownButtonHideUnderline( - child: DropdownButton( - value: zeta.themeData.identifier, + child: DropdownButton( + value: zeta.customThemeId, elevation: 0, - isDense: true, - alignment: Alignment.center, - icon: SizedBox(width: 8), + padding: EdgeInsets.all(8), + icon: Nothing(), dropdownColor: zeta.colors.borderDisabled, - items: _themes.entries.map((e) { - var zetaColors = primary(_themes[e.key]!).apply(contrast: zeta.contrast); - var color = zetaColors.primary; - return DropdownMenuItem( - value: e.value.identifier, - alignment: Alignment.center, - child: CircleAvatar( - backgroundColor: color.surface, - foregroundColor: color, - child: Icon(Icons.color_lens, color: color), - ), - ); - }).toList(), + items: items.entries + .map((e) => DropdownMenuItem( + value: e.key, + alignment: Alignment.center, + child: e.value, + )) + .toList(), onChanged: (value) { - final theme = _themes[value]; - if (theme != null) { - ZetaProvider.of(context).updateThemeData(theme); - } + ZetaProvider.of(context).updateCustomTheme(themeId: value); }, ), ); diff --git a/example/lib/pages/utils/theme_constrast_switch.dart b/example/lib/pages/utils/theme_constrast_switch.dart index 3078bb55..658e6b82 100644 --- a/example/lib/pages/utils/theme_constrast_switch.dart +++ b/example/lib/pages/utils/theme_constrast_switch.dart @@ -11,38 +11,31 @@ class ZetaThemeContrastSwitch extends StatelessWidget { @override Widget build(BuildContext context) { - var zeta = Zeta.of(context); - - ZetaColors zetaColors(ZetaContrast contrast) { - if (zeta.brightness == Brightness.light) { - return zeta.themeData.apply(contrast: contrast).colorsLight; - } else { - return zeta.themeData.apply(contrast: contrast).colorsDark; - } - } + final zeta = Zeta.of(context); return DropdownButtonHideUnderline( child: DropdownButton( value: zeta.contrast, + padding: EdgeInsets.all(8), elevation: 0, - isDense: true, - alignment: Alignment.center, - icon: SizedBox(width: 8), + icon: Nothing(), dropdownColor: zeta.colors.borderDisabled, items: _themes.map((e) { - final colors = zetaColors(e); + final ZetaColors colors = (e == ZetaContrast.aa + ? ZetaColorsAA(primitives: Zeta.of(context).colors.primitives) + : ZetaColorsAAA(primitives: Zeta.of(context).colors.primitives)) as ZetaColors; return DropdownMenuItem( value: e, alignment: Alignment.center, - child: CircleAvatar( - backgroundColor: colors.primary.surface, - foregroundColor: colors.primary, - child: Text( - e == ZetaContrast.aa ? 'AA' : 'AAA', - style: ZetaTextStyles.bodyMedium.copyWith( - color: colors.primary, - fontWeight: FontWeight.w700, - ), + child: ZetaAvatar( + size: ZetaAvatarSize.xxs, + backgroundColor: colors.surfaceDefault, + initials: e.name.toUpperCase(), + initialTextStyle: TextStyle( + fontSize: 14, + letterSpacing: Zeta.of(context).spacing.none, + color: colors.mainPrimary, + fontWeight: FontWeight.w500, ), ), ); diff --git a/example/lib/pages/utils/theme_mode_switch.dart b/example/lib/pages/utils/theme_mode_switch.dart index 3531827c..595d3133 100644 --- a/example/lib/pages/utils/theme_mode_switch.dart +++ b/example/lib/pages/utils/theme_mode_switch.dart @@ -12,40 +12,31 @@ class ZetaThemeModeSwitch extends StatelessWidget { @override Widget build(BuildContext context) { - var zeta = Zeta.of(context); - - ZetaColors zetaColors(ThemeMode mode) { - if ((mode == ThemeMode.system && MediaQuery.of(context).platformBrightness == Brightness.light) || - mode == ThemeMode.light) { - return zeta.themeData.colorsLight; - } else { - return zeta.themeData.colorsDark; - } - } + final zeta = Zeta.of(context); + final colors = zeta.colors; return DropdownButtonHideUnderline( child: DropdownButton( + padding: EdgeInsets.all(8), value: zeta.themeMode, elevation: 0, - isDense: true, - alignment: Alignment.center, - icon: SizedBox(width: 8), + icon: Nothing(), dropdownColor: zeta.colors.borderDisabled, items: _themes.map((e) { - final colors = zetaColors(e).apply(contrast: zeta.contrast); return DropdownMenuItem( value: e, alignment: Alignment.center, - child: CircleAvatar( - backgroundColor: colors.primary.surface, - foregroundColor: colors.primary, - child: Icon( - e == ThemeMode.system - ? Icons.system_security_update_good - : e == ThemeMode.light - ? Icons.light_mode - : Icons.dark_mode, - color: colors.primary), + child: ZetaAvatar( + size: ZetaAvatarSize.xxs, + backgroundColor: colors.surfaceDefault, + image: Icon( + e == ThemeMode.system + ? Icons.system_security_update_good + : e == ThemeMode.light + ? Icons.light_mode + : Icons.dark_mode, + color: colors.mainPrimary, + ), ), ); }).toList(), diff --git a/example/macos/Flutter/GeneratedPluginRegistrant.swift b/example/macos/Flutter/GeneratedPluginRegistrant.swift index cc8208c6..bba4b0a3 100644 --- a/example/macos/Flutter/GeneratedPluginRegistrant.swift +++ b/example/macos/Flutter/GeneratedPluginRegistrant.swift @@ -18,7 +18,7 @@ import open_file_mac import package_info_plus import path_provider_foundation import quill_native_bridge_macos -import record_darwin +import record_macos import share_plus import shared_preferences_foundation import sqflite_darwin @@ -42,7 +42,7 @@ func RegisterGeneratedPlugins(registry: FlutterPluginRegistry) { FPPPackageInfoPlusPlugin.register(with: registry.registrar(forPlugin: "FPPPackageInfoPlusPlugin")) PathProviderPlugin.register(with: registry.registrar(forPlugin: "PathProviderPlugin")) QuillNativeBridgePlugin.register(with: registry.registrar(forPlugin: "QuillNativeBridgePlugin")) - RecordPlugin.register(with: registry.registrar(forPlugin: "RecordPlugin")) + RecordMacOsPlugin.register(with: registry.registrar(forPlugin: "RecordMacOsPlugin")) SharePlusMacosPlugin.register(with: registry.registrar(forPlugin: "SharePlusMacosPlugin")) SharedPreferencesPlugin.register(with: registry.registrar(forPlugin: "SharedPreferencesPlugin")) SqflitePlugin.register(with: registry.registrar(forPlugin: "SqflitePlugin")) diff --git a/example/macos/Podfile.lock b/example/macos/Podfile.lock index 291111a6..2b761120 100644 --- a/example/macos/Podfile.lock +++ b/example/macos/Podfile.lock @@ -31,7 +31,7 @@ PODS: - FlutterMacOS - quill_native_bridge_macos (0.0.1): - FlutterMacOS - - record_darwin (1.0.0): + - record_macos (1.0.0): - FlutterMacOS - share_plus (0.0.1): - FlutterMacOS @@ -68,7 +68,7 @@ DEPENDENCIES: - package_info_plus (from `Flutter/ephemeral/.symlinks/plugins/package_info_plus/macos`) - path_provider_foundation (from `Flutter/ephemeral/.symlinks/plugins/path_provider_foundation/darwin`) - quill_native_bridge_macos (from `Flutter/ephemeral/.symlinks/plugins/quill_native_bridge_macos/macos`) - - record_darwin (from `Flutter/ephemeral/.symlinks/plugins/record_darwin/macos`) + - record_macos (from `Flutter/ephemeral/.symlinks/plugins/record_macos/macos`) - share_plus (from `Flutter/ephemeral/.symlinks/plugins/share_plus/macos`) - shared_preferences_foundation (from `Flutter/ephemeral/.symlinks/plugins/shared_preferences_foundation/darwin`) - sqflite_darwin (from `Flutter/ephemeral/.symlinks/plugins/sqflite_darwin/darwin`) @@ -111,8 +111,8 @@ EXTERNAL SOURCES: :path: Flutter/ephemeral/.symlinks/plugins/path_provider_foundation/darwin quill_native_bridge_macos: :path: Flutter/ephemeral/.symlinks/plugins/quill_native_bridge_macos/macos - record_darwin: - :path: Flutter/ephemeral/.symlinks/plugins/record_darwin/macos + record_macos: + :path: Flutter/ephemeral/.symlinks/plugins/record_macos/macos share_plus: :path: Flutter/ephemeral/.symlinks/plugins/share_plus/macos shared_preferences_foundation: @@ -143,15 +143,15 @@ SPEC CHECKSUMS: just_audio: a42c63806f16995daf5b219ae1d679deb76e6a79 open_file_mac: 0e554648e2a87ce59e9438e3e5ca3e552e90d89a OrderedSet: e539b66b644ff081c73a262d24ad552a69be3a94 - package_info_plus: 12f1c5c2cfe8727ca46cbd0b26677728972d9a5b - path_provider_foundation: 2b6b4c569c0fb62ec74538f866245ac84301af46 + package_info_plus: f5790acc797bf17c3e959e9d6cf162cc68ff7523 + path_provider_foundation: 3784922295ac71e43754bd15e0653ccfd36a147c quill_native_bridge_macos: 3a5f378bc757eb92825193853020b759b56cbb2c - record_darwin: a0d515a0ef78c440c123ea3ac76184c9927a94d6 + record_macos: 3ead198d39fad25d10163780132a96b6fd162a1c share_plus: 1fa619de8392a4398bfaf176d441853922614e89 shared_preferences_foundation: fcdcbc04712aee1108ac7fda236f363274528f78 - sqflite_darwin: 5a7236e3b501866c1c9befc6771dfd73ffb8702d + sqflite_darwin: a553b1fd6fe66f53bbb0fe5b4f5bab93f08d7a13 super_native_extensions: 85efee3a7495b46b04befcfc86ed12069264ebf3 - url_launcher_macos: c82c93949963e55b228a30115bd219499a6fe404 + url_launcher_macos: d2691c7dd33ed713bf3544850a623080ec693d95 video_compress: c896234f100791b5fef7f049afa38f6d2ef7b42f video_player_avfoundation: 7c6c11d8470e1675df7397027218274b6d2360b3 wakelock_plus: 4783562c9a43d209c458cb9b30692134af456269 diff --git a/example/macos/Runner.xcodeproj/xcshareddata/xcschemes/Runner.xcscheme b/example/macos/Runner.xcodeproj/xcshareddata/xcschemes/Runner.xcscheme index 15368ecc..ac78810c 100644 --- a/example/macos/Runner.xcodeproj/xcshareddata/xcschemes/Runner.xcscheme +++ b/example/macos/Runner.xcodeproj/xcshareddata/xcschemes/Runner.xcscheme @@ -59,6 +59,7 @@ ignoresPersistentStateOnLaunch = "NO" debugDocumentVersioning = "YES" debugServiceExtension = "internal" + enableGPUValidationMode = "1" allowLocationSimulation = "YES"> diff --git a/example/macos/Runner/AppDelegate.swift b/example/macos/Runner/AppDelegate.swift index 8e02df28..b3c17614 100644 --- a/example/macos/Runner/AppDelegate.swift +++ b/example/macos/Runner/AppDelegate.swift @@ -6,4 +6,8 @@ class AppDelegate: FlutterAppDelegate { override func applicationShouldTerminateAfterLastWindowClosed(_ sender: NSApplication) -> Bool { return true } + + override func applicationSupportsSecureRestorableState(_ app: NSApplication) -> Bool { + return true + } } diff --git a/example/pubspec.yaml b/example/pubspec.yaml index 42b4c839..6e7d72bf 100644 --- a/example/pubspec.yaml +++ b/example/pubspec.yaml @@ -5,28 +5,19 @@ version: 1.0.0+1 environment: sdk: ">=3.0.0 <4.0.0" - flutter: ">=3.7.0" + flutter: ">=3.16.0" dependencies: flutter: sdk: flutter - flutter_localizations: - sdk: flutter - intl: ^0.19.0 - lottie: ^3.1.2 - path_provider: ^2.1.2 + lottie: ^3.3.1 scrollable_positioned_list: ^0.3.8 - shared_preferences: ^2.2.2 - table_calendar: ^3.0.9 zds_flutter: path: ../ - url_launcher: any - cross_file: any - zeta_flutter: any - flutter_quill: any - flutter_quill_extensions: any - image_picker: any +dependency_overrides: + intl: ^0.20.2 + flutter: uses-material-design: true assets: diff --git a/lib/src/components/atoms/avatar.dart b/lib/src/components/atoms/avatar.dart index 961233ae..7a5a0dce 100644 --- a/lib/src/components/atoms/avatar.dart +++ b/lib/src/components/atoms/avatar.dart @@ -57,7 +57,7 @@ class ZdsAvatar extends StatelessWidget implements PreferredSizeWidget { /// The background color of the avatar if [initials] are used. /// - /// Defaults to [ColorScheme.secondary]. + /// Defaults to [ColorScheme.mainSecondary]. final Color? backgroundColor; @override diff --git a/lib/src/components/atoms/button.dart b/lib/src/components/atoms/button.dart index 6bff3888..5d4e941e 100644 --- a/lib/src/components/atoms/button.dart +++ b/lib/src/components/atoms/button.dart @@ -248,7 +248,8 @@ class ZdsButton extends StatelessWidget { final EdgeInsetsGeometry tp = textPadding ?? const EdgeInsets.symmetric(horizontal: 16, vertical: 6); // Determine the default background color. - final Color defaultBackground = customColor ?? (isDangerButton ? zetaColors.surfaceNegative : zetaColors.secondary); + final Color defaultBackground = + customColor ?? (isDangerButton ? zetaColors.surfaceNegative : zetaColors.mainSecondary); // Common textStyle for all variants. final textStyle = WidgetStateProperty.all(textTheme.titleMedium?.copyWith(fontWeight: FontWeight.w500)); @@ -265,7 +266,7 @@ class ZdsButton extends StatelessWidget { textStyle: textStyle, foregroundColor: widgetStatePropertyResolver( defaultValue: defaultBackground.onColor, - disabledValue: zetaColors.textDisabled, + disabledValue: zetaColors.mainDisabled, ), backgroundColor: widgetStatePropertyResolver( defaultValue: defaultBackground, @@ -277,7 +278,7 @@ class ZdsButton extends StatelessWidget { defaultValue: Colors.transparent, ), side: widgetStatePropertyResolver( - focusedValue: BorderSide(color: zetaColors.secondary.subtle, width: 3), + focusedValue: BorderSide(color: zetaColors.surfaceSecondarySubtle, width: 3), disabledValue: BorderSide(color: zetaColors.borderDisabled), ), ); @@ -287,7 +288,7 @@ class ZdsButton extends StatelessWidget { textStyle: textStyle, foregroundColor: widgetStatePropertyResolver( defaultValue: defaultBackground, - disabledValue: zetaColors.textDisabled, + disabledValue: zetaColors.mainDisabled, ), backgroundColor: widgetStatePropertyResolver( defaultValue: Colors.transparent, @@ -299,7 +300,7 @@ class ZdsButton extends StatelessWidget { pressedValue: calculateOverlay(opacity: 0.2), ), side: widgetStatePropertyResolver( - focusedValue: BorderSide(color: zetaColors.secondary.subtle, width: 3), + focusedValue: BorderSide(color: zetaColors.surfaceSecondarySubtle, width: 3), defaultValue: BorderSide(color: defaultBackground), disabledValue: BorderSide(color: zetaColors.borderDisabled), ), @@ -309,8 +310,8 @@ class ZdsButton extends StatelessWidget { padding: WidgetStateProperty.all(tp), textStyle: textStyle, foregroundColor: widgetStatePropertyResolver( - defaultValue: isOnDarkBackground ? zetaColors.textInverse : defaultBackground, - disabledValue: zetaColors.textDisabled, + defaultValue: isOnDarkBackground ? zetaColors.mainInverse : defaultBackground, + disabledValue: zetaColors.mainDisabled, ), backgroundColor: widgetStatePropertyResolver( defaultValue: Colors.transparent, @@ -321,7 +322,7 @@ class ZdsButton extends StatelessWidget { pressedValue: calculateOverlay(opacity: 0.2), ), side: widgetStatePropertyResolver( - focusedValue: BorderSide(color: zetaColors.secondary.subtle, width: 3), + focusedValue: BorderSide(color: zetaColors.surfaceSecondarySubtle, width: 3), disabledValue: const BorderSide(color: Colors.transparent), ), ); @@ -330,8 +331,8 @@ class ZdsButton extends StatelessWidget { padding: WidgetStateProperty.all(tp), textStyle: textStyle, foregroundColor: widgetStatePropertyResolver( - defaultValue: zetaColors.textDefault, - disabledValue: zetaColors.textDisabled, + defaultValue: zetaColors.mainDefault, + disabledValue: zetaColors.mainDisabled, ), backgroundColor: widgetStatePropertyResolver( defaultValue: Colors.transparent, @@ -343,7 +344,7 @@ class ZdsButton extends StatelessWidget { pressedValue: calculateOverlay(background: zetaColors.borderDefault, opacity: 0.2), ), side: widgetStatePropertyResolver( - focusedValue: BorderSide(color: zetaColors.secondary.subtle, width: 3), + focusedValue: BorderSide(color: zetaColors.surfaceSecondarySubtle, width: 3), disabledValue: BorderSide(color: zetaColors.borderDisabled), defaultValue: BorderSide(color: zetaColors.borderDefault), ), diff --git a/lib/src/components/atoms/circle_icon_button.dart b/lib/src/components/atoms/circle_icon_button.dart index a051c9fe..84d3c94e 100644 --- a/lib/src/components/atoms/circle_icon_button.dart +++ b/lib/src/components/atoms/circle_icon_button.dart @@ -36,9 +36,9 @@ extension on CircleButtonType { ZetaColorSwatch color(ZetaColors colors) { switch (this) { case CircleButtonType.positive: - return colors.surfacePositive; + return colors.primitives.green; case CircleButtonType.negative: - return colors.surfaceNegative; + return colors.primitives.red; case CircleButtonType.alert: return ZetaColorSwatch.fromColor(Colors.white); case CircleButtonType.base: diff --git a/lib/src/components/atoms/expandable.dart b/lib/src/components/atoms/expandable.dart index 20451781..07e00f96 100644 --- a/lib/src/components/atoms/expandable.dart +++ b/lib/src/components/atoms/expandable.dart @@ -53,7 +53,7 @@ class ZdsExpandable extends StatelessWidget { return child.readMore( collapsedButtonText: collapsedButtonText, expandedButtonText: expandedButtonText, - color: color ?? Zeta.of(context).colors.surfaceTertiary, + color: color ?? Zeta.of(context).colors.surfaceDefault, minHeight: minHeight, ); } @@ -317,7 +317,7 @@ extension ExpandableTextExtension on Widget { collapsedButtonText.isEmpty ? strings.get('READ_MORE', 'Read more') : collapsedButtonText, expandedButtonText: expandedButtonText.isEmpty ? strings.get('COLLAPSE', 'Collapse') : expandedButtonText, minHeight: minHeight, - color: color ?? Zeta.of(context).colors.surfaceTertiary, + color: color ?? Zeta.of(context).colors.surfacePrimary, child: this, ); }, diff --git a/lib/src/components/atoms/icon_text_button.dart b/lib/src/components/atoms/icon_text_button.dart index a471463f..967fa99b 100644 --- a/lib/src/components/atoms/icon_text_button.dart +++ b/lib/src/components/atoms/icon_text_button.dart @@ -62,9 +62,9 @@ class ZdsIconTextButton extends StatelessWidget with Diagnosticable { width: 112, decoration: BoxDecoration( borderRadius: borderRadius, - color: backgroundColor ?? zetaColors.primary, + color: backgroundColor ?? zetaColors.mainPrimary, boxShadow: [ - BoxShadow(blurRadius: 4, color: zetaColors.textDefault.withOpacity(0.2)), + BoxShadow(blurRadius: 4, color: zetaColors.mainDefault.withOpacity(0.2)), ], ), child: Material( @@ -78,13 +78,13 @@ class ZdsIconTextButton extends StatelessWidget with Diagnosticable { Icon( icon, size: 56, - color: iconColor ?? (backgroundColor ?? zetaColors.primary).onColor, + color: iconColor ?? (backgroundColor ?? zetaColors.mainPrimary).onColor, ), const SizedBox(height: 8), Text( label, style: themeData.textTheme.titleSmall?.copyWith( - color: labelColor ?? (backgroundColor ?? zetaColors.primary).onColor, + color: labelColor ?? (backgroundColor ?? zetaColors.mainPrimary).onColor, ), ), ], diff --git a/lib/src/components/atoms/label.dart b/lib/src/components/atoms/label.dart index 216e7ea7..7309a5c1 100644 --- a/lib/src/components/atoms/label.dart +++ b/lib/src/components/atoms/label.dart @@ -39,14 +39,14 @@ class ZdsLabel extends StatelessWidget { Icon( icon, size: size, - color: zetaColors.secondary.icon, + color: zetaColors.mainSecondary, ), const SizedBox(width: 4), ], if (child != null) DefaultTextStyle( style: safeTextStyle(Theme.of(context).textTheme.titleSmall).copyWith( - color: zetaColors.textSubtle, + color: zetaColors.mainSubtle, ), child: child!, ), diff --git a/lib/src/components/atoms/selection_pills.dart b/lib/src/components/atoms/selection_pills.dart index 6fb30259..8418a265 100644 --- a/lib/src/components/atoms/selection_pills.dart +++ b/lib/src/components/atoms/selection_pills.dart @@ -70,7 +70,7 @@ class ZdsSelectionPill extends StatelessWidget { /// /// Custom color to override pill background color. /// - ///Defaults to `colorScheme.secondary.withOpacity(0.1)` + ///Defaults to `colorScheme.mainSecondary.withOpacity(0.1)` final Color? selectedColor; ///Use [color] instead. Will be deprecated in future release. @@ -89,20 +89,20 @@ class ZdsSelectionPill extends StatelessWidget { final Color background = disabled ? zetaColors.surfaceDisabled : selected - ? color?.surface ?? selectedColor?.withOpacity(0.2) ?? zetaColors.secondary.surface + ? selectedColor?.withOpacity(0.2) ?? zetaColors.surfaceSecondary : themeData.colorScheme.surface; final Color foreground = disabled - ? zetaColors.iconDisabled + ? zetaColors.mainDisabled : selected - ? color?.icon ?? selectedColor ?? zetaColors.secondary.icon - : zetaColors.iconSubtle; + ? selectedColor ?? zetaColors.mainSecondary + : zetaColors.mainSubtle; final Color border = borderColor ?? (disabled ? zetaColors.borderDisabled : selected - ? color?.border ?? zetaColors.secondary.border + ? zetaColors.borderSecondary : zetaColors.borderDefault); return ExpandTapWidget( @@ -142,9 +142,9 @@ class ZdsSelectionPill extends StatelessWidget { textAlign: TextAlign.center, style: themeData.textTheme.bodyMedium?.copyWith( color: disabled - ? zetaColors.textDisabled + ? zetaColors.mainDisabled : selected - ? color?.text ?? foreground + ? color ?? foreground : themeData.colorScheme.onSurface, fontWeight: selected && !disabled ? FontWeight.w600 : null, ), diff --git a/lib/src/components/atoms/speed_slider.dart b/lib/src/components/atoms/speed_slider.dart index 465e7691..2deb0e2f 100644 --- a/lib/src/components/atoms/speed_slider.dart +++ b/lib/src/components/atoms/speed_slider.dart @@ -197,17 +197,17 @@ class _Letter extends StatelessWidget { final zeta = Zeta.of(context); final colors = zeta.colors; - Color color = colors.textSubtle; + Color color = colors.mainSubtle; final diff = (index - selectedIndex).abs(); if (diff == 0) { - color = colors.primary; + color = colors.mainPrimary; } else if (diff == 1) { - color = colors.textDefault; + color = colors.mainDefault; } else if (diff > 1 && diff < 4) { - color = colors.textSubtle; + color = colors.mainSubtle; } else { - color = colors.textDisabled; + color = colors.mainDisabled; } return Padding( diff --git a/lib/src/components/atoms/toggle_button.dart b/lib/src/components/atoms/toggle_button.dart index 314dd1d1..b5b44abd 100644 --- a/lib/src/components/atoms/toggle_button.dart +++ b/lib/src/components/atoms/toggle_button.dart @@ -100,7 +100,7 @@ class ZdsToggleButtonState extends State { Container( height: kBigToggleHeight, decoration: ShapeDecoration( - color: Zeta.of(context).colors.warm.shade30, + color: Zeta.of(context).colors.primitives.warm.shade30, shape: const RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(28))), ), ), @@ -136,7 +136,7 @@ class ZdsToggleButtonState extends State { color: (index == _selectedValue) ? widget.foregroundColor ?? (widget.backgroundColor ?? Theme.of(context).colorScheme.primary).onColor - : Zeta.of(context).colors.textSubtle, + : Zeta.of(context).colors.mainSubtle, ), child: Text(widget.values[index]).semantics(identifier: 'TOGGLED_TAB_$index'), ), diff --git a/lib/src/components/molecules/block_table.dart b/lib/src/components/molecules/block_table.dart index 9b3ba0e0..52d6604c 100644 --- a/lib/src/components/molecules/block_table.dart +++ b/lib/src/components/molecules/block_table.dart @@ -409,7 +409,7 @@ class _BlockTable extends State with WidgetsBindingObserver { color: isSelected ? themeData.colorScheme.secondary.withLight( 0.1, - background: zetaColors.surfaceTertiary, + background: zetaColors.surfacePrimary, ) : tableCell.backgroundColor ?? themeData.colorScheme.surface, ), diff --git a/lib/src/components/molecules/bottom_sheet.dart b/lib/src/components/molecules/bottom_sheet.dart index eba91996..6ae5a106 100644 --- a/lib/src/components/molecules/bottom_sheet.dart +++ b/lib/src/components/molecules/bottom_sheet.dart @@ -56,7 +56,7 @@ class ZdsBottomSheet extends StatelessWidget { @override Widget build(BuildContext context) { final ColorScheme colorScheme = Theme.of(context).colorScheme; - final Color sheetBackgroundColor = backgroundColor ?? Zeta.of(context).colors.surfaceTertiary; + final Color sheetBackgroundColor = backgroundColor ?? Zeta.of(context).colors.surfacePrimary; final Color headerColor = header != null ? colorScheme.surface : sheetBackgroundColor; final _BottomSheetHeader headerWidget = _BottomSheetHeader(header: header, backgroundColor: headerColor); final MediaQueryData media = MediaQuery.of(context); diff --git a/lib/src/components/molecules/check_button.dart b/lib/src/components/molecules/check_button.dart index 9bfc0a95..3510592e 100644 --- a/lib/src/components/molecules/check_button.dart +++ b/lib/src/components/molecules/check_button.dart @@ -51,19 +51,19 @@ class ZdsCheckableButton extends StatelessWidget { final Color foreground = isChecked ? themeData.colorScheme.secondary.onColor : enabled - ? zetaColors.iconSubtle - : zetaColors.iconDisabled; + ? zetaColors.mainSubtle + : zetaColors.mainDisabled; final Color background = !enabled && isChecked - ? zetaColors.secondary.subtle + ? zetaColors.surfaceSecondarySubtle : isChecked - ? zetaColors.secondary + ? zetaColors.mainSecondary : enabled ? zetaColors.surfacePrimary : zetaColors.surfaceDisabled; final Color borderColor = isChecked - ? zetaColors.secondary + ? zetaColors.mainSecondary : enabled ? zetaColors.borderDefault : zetaColors.borderDisabled; diff --git a/lib/src/components/molecules/comment.dart b/lib/src/components/molecules/comment.dart index ccfb3682..7d9f4617 100644 --- a/lib/src/components/molecules/comment.dart +++ b/lib/src/components/molecules/comment.dart @@ -134,7 +134,7 @@ class ZdsComment extends StatelessWidget { ZdsSlidableAction( icon: ZetaIcons.reply, semanticLabel: replySemanticLabel, - foregroundColor: colors.primary, + foregroundColor: colors.mainPrimary, backgroundColor: colors.surfacePrimarySubtle, onPressed: (_) => onReply!(), ), @@ -144,7 +144,7 @@ class ZdsComment extends StatelessWidget { semanticLabel: deleteSemanticLabel, onPressed: (_) => onDelete!(), backgroundColor: colors.surfaceNegativeSubtle, - foregroundColor: colors.error, + foregroundColor: colors.mainNegative, ), ], child: Builder( @@ -189,7 +189,7 @@ class ZdsComment extends StatelessWidget { padding: EdgeInsets.only(left: spacing.small), child: Text( timeStamp!, - style: ZetaTextStyles.bodyXSmall.copyWith(color: colors.textSubtle), + style: ZetaTextStyles.bodyXSmall.copyWith(color: colors.mainSubtle), ), ), ], @@ -297,7 +297,7 @@ class _AttachmentRow extends StatelessWidget { return Material( color: backgroundColor, child: InkWell( - borderRadius: radius.minimal, + borderRadius: BorderRadius.all(radius.minimal), onTap: downloadCallback, child: Padding( padding: EdgeInsets.all(spacing.minimum), @@ -330,7 +330,7 @@ class _AttachmentRow extends StatelessWidget { if (attachment.size != null) Text( attachment.size!, - style: ZetaTextStyles.bodySmall.copyWith(color: colors.textSubtle), + style: ZetaTextStyles.bodySmall.copyWith(color: colors.mainSubtle), maxLines: 1, overflow: TextOverflow.ellipsis, ), diff --git a/lib/src/components/molecules/date_range_picker.dart b/lib/src/components/molecules/date_range_picker.dart index 5017e8d6..3533a246 100644 --- a/lib/src/components/molecules/date_range_picker.dart +++ b/lib/src/components/molecules/date_range_picker.dart @@ -1354,7 +1354,7 @@ class _ZdsDateRangePickerDialogState extends State wit shortMonthDayFormat: widget.shortMonthDayFormat, shortDateFormat: widget.shortDateFormat, ); - final DialogTheme dialogTheme = Theme.of(context).dialogTheme; + final DialogThemeData dialogTheme = Theme.of(context).dialogTheme; size = orientation == Orientation.portrait ? _inputPortraitDialogSize : _inputRangeLandscapeDialogSize; insetPadding = const EdgeInsets.symmetric(horizontal: 16, vertical: 24); shape = dialogTheme.shape; @@ -1443,8 +1443,8 @@ class _CalendarRangePickerDialog extends StatelessWidget { final zetaColors = Zeta.of(context).colors; final TextTheme textTheme = theme.textTheme; - final Color headerForeground = zetaColors.textDefault; - final Color headerDisabledForeground = zetaColors.textDisabled; + final Color headerForeground = zetaColors.mainDefault; + final Color headerDisabledForeground = zetaColors.mainDisabled; final String startDateText = _formatRangeStartDate( localizations, diff --git a/lib/src/components/molecules/date_time_picker.dart b/lib/src/components/molecules/date_time_picker.dart index 20b205d6..8f221dbf 100644 --- a/lib/src/components/molecules/date_time_picker.dart +++ b/lib/src/components/molecules/date_time_picker.dart @@ -266,7 +266,7 @@ class ZdsDateTimePickerState extends State { textAlign: widget.textAlign, style: widget.textStyle ?? textTheme.bodyLarge?.copyWith( - color: _dateTime == null ? zetaColors.textSubtle : textTheme.bodyLarge?.color, + color: _dateTime == null ? zetaColors.mainSubtle : textTheme.bodyLarge?.color, ), ); diff --git a/lib/src/components/molecules/dropdown.dart b/lib/src/components/molecules/dropdown.dart index a834aa15..d11eb2f7 100644 --- a/lib/src/components/molecules/dropdown.dart +++ b/lib/src/components/molecules/dropdown.dart @@ -158,7 +158,7 @@ class ZdsDropdownListState extends State> { widget.label!, style: widget.labelStyle ?? themeData.textTheme.headlineSmall?.copyWith( - color: zetaColors.textSubtle, + color: zetaColors.mainSubtle, ), ), const SizedBox(height: 4), @@ -183,7 +183,7 @@ class ZdsDropdownListState extends State> { suffixPadding: const EdgeInsets.only(right: 8), suffixIcon: Icon( _isOpen ? ZdsIcons.chevron_up : ZdsIcons.chevron_down, - color: zetaColors.iconSubtle, + color: zetaColors.mainSubtle, ), border: border, errorBorder: border, diff --git a/lib/src/components/molecules/expansion_tile.dart b/lib/src/components/molecules/expansion_tile.dart index 0375cff0..c876e8cf 100644 --- a/lib/src/components/molecules/expansion_tile.dart +++ b/lib/src/components/molecules/expansion_tile.dart @@ -323,7 +323,7 @@ class ZdsExpansionTileState extends State with SingleTickerPro turns: _iconTurns, child: Icon( widget.expansionTileType == ExpansionTileType.regular ? ZdsIcons.chevron_down : ZdsIcons.chevron_right, - color: zeta.colors.iconDefault, + color: zeta.colors.mainDefault, size: 24, ), ), @@ -376,7 +376,7 @@ class ZdsExpansionTileState extends State with SingleTickerPro const SizedBox(height: 5), DefaultTextStyle( style: themeData.textTheme.bodySmall!.copyWith( - color: zeta.colors.textSubtle, + color: zeta.colors.mainSubtle, ), child: widget.subtitle!, ), @@ -393,7 +393,7 @@ class ZdsExpansionTileState extends State with SingleTickerPro child: widget.expandWithIconOnly ? chevronIcon : IconTheme( - data: IconThemeData(color: zeta.colors.iconSubtle, size: 24), + data: IconThemeData(color: zeta.colors.mainSubtle, size: 24), child: RotationTransition( turns: _iconTurns, child: const Icon(ZdsIcons.chevron_down), diff --git a/lib/src/components/molecules/fields_list_tile.dart b/lib/src/components/molecules/fields_list_tile.dart index 16a90f3a..7094750a 100644 --- a/lib/src/components/molecules/fields_list_tile.dart +++ b/lib/src/components/molecules/fields_list_tile.dart @@ -133,7 +133,7 @@ class ZdsFieldsListTile extends StatelessWidget { const SizedBox(height: 8), DefaultTextStyle( style: safeTextStyle(themeData.textTheme.bodyMedium).copyWith( - color: Zeta.of(context).colors.textDisabled, + color: Zeta.of(context).colors.mainDisabled, ), child: footnote!, ), @@ -176,7 +176,7 @@ extension _UIBuilder on ZdsFieldsListTile { DefaultTextStyle( style: fieldsStartDefaultStyle ?? safeTextStyle(themeData.textTheme.titleSmall).copyWith( - color: Zeta.of(context).colors.textSubtle, + color: Zeta.of(context).colors.mainSubtle, ), textAlign: TextAlign.start, child: Flexible(flex: startFieldFlexFactor ?? 0, child: field.start!), diff --git a/lib/src/components/molecules/information_bar.dart b/lib/src/components/molecules/information_bar.dart index 00e502cb..53f37e10 100644 --- a/lib/src/components/molecules/information_bar.dart +++ b/lib/src/components/molecules/information_bar.dart @@ -117,7 +117,7 @@ class ZdsInformationBar extends StatelessWidget { Color _getBarColor(ZdsInformationBarTheme color, ZetaColors colors) { switch (color) { case ZdsInformationBarTheme.neutral: - return colors.cool.surface; + return colors.surfaceCool; case ZdsInformationBarTheme.positive: return colors.surfacePositiveSubtle; case ZdsInformationBarTheme.inProgress: @@ -130,7 +130,7 @@ Color _getBarColor(ZdsInformationBarTheme color, ZetaColors colors) { Color _getIconColor(ZdsInformationBarTheme color, ZetaColors colors) { switch (color) { case ZdsInformationBarTheme.neutral: - return colors.iconDefault; + return colors.mainDefault; case ZdsInformationBarTheme.positive: return colors.borderPositive; case ZdsInformationBarTheme.inProgress: diff --git a/lib/src/components/molecules/input_dialog.dart b/lib/src/components/molecules/input_dialog.dart index a0f172d2..3ba16ec4 100644 --- a/lib/src/components/molecules/input_dialog.dart +++ b/lib/src/components/molecules/input_dialog.dart @@ -203,7 +203,7 @@ class ZdsInputDialogState extends State { hintText: widget.hint, errorText: _error, errorStyle: theme.textTheme.bodyMedium?.copyWith( - color: zetaColors.error, + color: zetaColors.mainNegative, ), ), ), diff --git a/lib/src/components/molecules/menu_item.dart b/lib/src/components/molecules/menu_item.dart index 5ebadb42..fb849580 100644 --- a/lib/src/components/molecules/menu_item.dart +++ b/lib/src/components/molecules/menu_item.dart @@ -69,7 +69,7 @@ class ZdsMenuItem extends StatelessWidget { child: InkWell( onTap: onTap, child: IconTheme.merge( - data: IconThemeData(size: 24, color: Zeta.of(context).colors.iconSubtle), + data: IconThemeData(size: 24, color: Zeta.of(context).colors.mainSubtle), child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ @@ -92,7 +92,7 @@ class ZdsMenuItem extends StatelessWidget { ), ], ).textStyle( - themeData.textTheme.bodyLarge?.copyWith(color: Zeta.of(context).colors.textSubtle), + themeData.textTheme.bodyLarge?.copyWith(color: Zeta.of(context).colors.mainSubtle), ), ), if (trailing != null) trailing!, diff --git a/lib/src/components/molecules/network_avatar.dart b/lib/src/components/molecules/network_avatar.dart index 5e61dda6..cd73c20b 100644 --- a/lib/src/components/molecules/network_avatar.dart +++ b/lib/src/components/molecules/network_avatar.dart @@ -53,7 +53,7 @@ class ZdsNetworkAvatar extends StatelessWidget implements PreferredSizeWidget { /// The background color of this avatar if the [initials] are shown. /// - /// Defaults to [ColorScheme.secondary]. + /// Defaults to [ColorScheme.mainSecondary]. final Color? backgroundColor; /// Semantic label for description of image diff --git a/lib/src/components/molecules/resizeable_text_area.dart b/lib/src/components/molecules/resizeable_text_area.dart index d95afa58..83c4a7e4 100644 --- a/lib/src/components/molecules/resizeable_text_area.dart +++ b/lib/src/components/molecules/resizeable_text_area.dart @@ -174,7 +174,7 @@ class _ZdsResizableTextAreaState extends State { child: Icon( ZdsIcons.expand, size: 18, - color: zetaColors.iconSubtle, + color: zetaColors.mainSubtle, ).padding(4), ), onVerticalDragUpdate: (DragUpdateDetails details) { @@ -199,7 +199,7 @@ class _ZdsResizableTextAreaState extends State { offset: const Offset(0, -8), child: Text( widget.footerText!, - style: Theme.of(context).textTheme.bodySmall?.copyWith(color: zetaColors.textDisabled), + style: Theme.of(context).textTheme.bodySmall?.copyWith(color: zetaColors.mainDisabled), overflow: TextOverflow.ellipsis, maxLines: 2, ), diff --git a/lib/src/components/molecules/selectable_list_tile.dart b/lib/src/components/molecules/selectable_list_tile.dart index 51f7bd3f..a1f22a24 100644 --- a/lib/src/components/molecules/selectable_list_tile.dart +++ b/lib/src/components/molecules/selectable_list_tile.dart @@ -7,7 +7,7 @@ import '../../../../zds_flutter.dart'; /// /// There are two variants: /// * [ZdsSelectableListTile], which returns a list tile that changes its color when selected. -/// When a listTile is marked as selected, its background will be colored with the [ColorScheme.secondary] at 10% +/// When a listTile is marked as selected, its background will be colored with the [ColorScheme.mainSecondary] at 10% /// opacity. When it's unselected, the background will use [ColorScheme.surface] /// * [ZdsSelectableListTile.checkable], which returns a list tile that adds a check at the end of the tile when selected. /// @@ -84,17 +84,17 @@ class ZdsSelectableListTile extends StatelessWidget { final zetaColors = Zeta.of(context).colors; return IconTheme( - data: themeData.iconTheme.copyWith(size: 24, color: zetaColors.secondary.icon), + data: themeData.iconTheme.copyWith(size: 24, color: zetaColors.mainSecondary), child: Padding( padding: kZdsSelectableListTilePadding, child: ClipRRect( borderRadius: const BorderRadius.all(Radius.circular(kZdsSelectableListTileBorderRadius)), child: Material( - color: showSelected ? zetaColors.secondary.surface : themeData.colorScheme.surface, + color: showSelected ? zetaColors.surfaceSecondary : themeData.colorScheme.surface, child: DecoratedBox( decoration: BoxDecoration( border: showSelected - ? Border.all(color: zetaColors.secondary.border) + ? Border.all(color: zetaColors.borderSecondary) : Border.all(color: zetaColors.borderSubtle), borderRadius: const BorderRadius.all(Radius.circular(kZdsSelectableListTileBorderRadius)), ), @@ -135,7 +135,7 @@ class ZdsSelectableListTile extends StatelessWidget { if (subTitle != null) Container(child: subTitle).textStyle( themeData.textTheme.titleSmall! - .copyWith(color: zetaColors.textSubtle, fontSize: 12), + .copyWith(color: zetaColors.mainSubtle, fontSize: 12), ), ], ), diff --git a/lib/src/components/molecules/sheet_header.dart b/lib/src/components/molecules/sheet_header.dart index 3c7f422b..c819d8e7 100644 --- a/lib/src/components/molecules/sheet_header.dart +++ b/lib/src/components/molecules/sheet_header.dart @@ -72,7 +72,7 @@ class ZdsSheetHeader extends StatelessWidget implements PreferredSizeWidget { sortKey: const OrdinalSortKey(1), child: IconTheme( data: themeData.iconTheme.copyWith( - color: Zeta.of(context).colors.iconSubtle, + color: Zeta.of(context).colors.mainSubtle, size: 24, ), child: leading!, diff --git a/lib/src/components/molecules/slidable_list_tile.dart b/lib/src/components/molecules/slidable_list_tile.dart index 224f5336..13ecde5f 100644 --- a/lib/src/components/molecules/slidable_list_tile.dart +++ b/lib/src/components/molecules/slidable_list_tile.dart @@ -205,8 +205,8 @@ class _ActionBuilderState extends State<_ActionBuilder> { onPressed: widget.action.onPressed, label: size.height < 60 && widget.action.icon != null ? null : widget.action.label, icon: widget.action.icon, - backgroundColor: widget.action.backgroundColor ?? zetaColors.surfaceTertiary, - foregroundColor: widget.action.foregroundColor ?? zetaColors.textSubtle, + backgroundColor: widget.action.backgroundColor ?? zetaColors.surfaceDefault, + foregroundColor: widget.action.foregroundColor ?? zetaColors.mainSubtle, autoClose: widget.action.autoclose, spacing: 16, padding: EdgeInsets.zero, diff --git a/lib/src/components/molecules/star_rating.dart b/lib/src/components/molecules/star_rating.dart index df1ef855..d6e71750 100644 --- a/lib/src/components/molecules/star_rating.dart +++ b/lib/src/components/molecules/star_rating.dart @@ -42,7 +42,7 @@ class ZdsStarRating extends StatefulWidget { /// Optional color for the stars. /// - /// Defaults to [ZetaColors.iconDefault]. + /// Defaults to [ZetaColors.mainDefault]. final Color? color; @override @@ -118,8 +118,8 @@ class _ZdsStarRatingState extends State { child: AnimatedContainer( duration: const Duration(milliseconds: 250), decoration: BoxDecoration( - color: colors.cool.shade30.withOpacity(_selected ? 1 : 0), - borderRadius: borderRadius, + color: colors.primitives.cool.shade30.withOpacity(_selected ? 1 : 0), + borderRadius: BorderRadius.all(borderRadius), ), child: Row( mainAxisSize: MainAxisSize.min, @@ -128,8 +128,8 @@ class _ZdsStarRatingState extends State { (int index) => SizedBox.square( dimension: _boxSize, child: InkWell( - borderRadius: borderRadius, - splashColor: colors.cool.shade30, + borderRadius: BorderRadius.all(borderRadius), + splashColor: colors.primitives.cool.shade30, onTap: () { if (widget.halfIncrements && index + 0.5 == _valueTapped) { setValue(index.toDouble()); @@ -144,7 +144,7 @@ class _ZdsStarRatingState extends State { child: Icon( _starValue(index).icon(rounded: widget.rounded), size: _starSize, - color: widget.color ?? colors.iconDefault, + color: widget.color ?? colors.mainDefault, ), ), ), diff --git a/lib/src/components/molecules/stats_card.dart b/lib/src/components/molecules/stats_card.dart index b1385898..733b539c 100644 --- a/lib/src/components/molecules/stats_card.dart +++ b/lib/src/components/molecules/stats_card.dart @@ -111,7 +111,7 @@ class ZdsStatCard extends StatelessWidget { subtitle ?? '', textAlign: TextAlign.end, style: themeData.textTheme.bodySmall?.copyWith( - color: Zeta.of(context).colors.textSubtle, + color: Zeta.of(context).colors.mainSubtle, ), ), ) diff --git a/lib/src/components/molecules/tab_bar.dart b/lib/src/components/molecules/tab_bar.dart index b1df65f5..58fb2c52 100644 --- a/lib/src/components/molecules/tab_bar.dart +++ b/lib/src/components/molecules/tab_bar.dart @@ -146,28 +146,28 @@ class ZdsTabBar extends StatelessWidget implements PreferredSizeWidget { return _tabBarStyle( context, hasIcons, - background: zetaColors.primary, - indicator: zetaColors.primary.onColor, - selectedText: zetaColors.primary.onColor, - unselectedText: zetaColors.primary.onColor.withOpacity(0.7), + background: zetaColors.mainPrimary, + indicator: zetaColors.mainPrimary.onColor, + selectedText: zetaColors.mainPrimary.onColor, + unselectedText: zetaColors.mainPrimary.onColor.withOpacity(0.7), ); case ZdsTabBarColor.basic: return _tabBarStyle( context, hasIcons, - background: zetaColors.surfaceTertiary, - indicator: zetaColors.primary, - selectedText: zetaColors.textDefault, - unselectedText: zetaColors.textSubtle, + background: zetaColors.surfaceDefault, + indicator: zetaColors.mainPrimary, + selectedText: zetaColors.mainDefault, + unselectedText: zetaColors.mainSubtle, ); case ZdsTabBarColor.surface: return _tabBarStyle( context, hasIcons, background: zetaColors.surfacePrimary, - indicator: zetaColors.primary, - selectedText: zetaColors.textDefault, - unselectedText: zetaColors.textSubtle, + indicator: zetaColors.mainPrimary, + selectedText: zetaColors.mainDefault, + unselectedText: zetaColors.mainSubtle, ); case ZdsTabBarColor.appBar: final appBarTheme = Theme.of(context).appBarTheme; @@ -175,9 +175,9 @@ class ZdsTabBar extends StatelessWidget implements PreferredSizeWidget { context, hasIcons, background: appBarTheme.backgroundColor ?? zetaColors.surfacePrimary, - indicator: appBarTheme.foregroundColor ?? zetaColors.primary, - selectedText: appBarTheme.foregroundColor ?? zetaColors.textDefault, - unselectedText: appBarTheme.foregroundColor?.withOpacity(0.7) ?? zetaColors.textSubtle, + indicator: appBarTheme.foregroundColor ?? zetaColors.mainPrimary, + selectedText: appBarTheme.foregroundColor ?? zetaColors.mainDefault, + unselectedText: appBarTheme.foregroundColor?.withOpacity(0.7) ?? zetaColors.mainSubtle, ); } } @@ -194,7 +194,7 @@ class ZdsTabBar extends StatelessWidget implements PreferredSizeWidget { final double height = hasIcons ? 56.0 : 48.0; final ThemeData theme = Theme.of(context); - final TabBarTheme tabBarTheme = theme.tabBarTheme.copyWith(indicatorSize: TabBarIndicatorSize.tab); + final TabBarThemeData tabBarTheme = theme.tabBarTheme.copyWith(indicatorSize: TabBarIndicatorSize.tab); final TextStyle? labelStyle = hasIcons ? theme.textTheme.bodySmall : theme.textTheme.bodyLarge; return ZdsTabBarStyleContainer( diff --git a/lib/src/components/molecules/tag.dart b/lib/src/components/molecules/tag.dart index dd7913f8..65ed06b1 100644 --- a/lib/src/components/molecules/tag.dart +++ b/lib/src/components/molecules/tag.dart @@ -207,30 +207,30 @@ class ZdsTag extends StatelessWidget { case ZdsTagColor.alert: return zetaColors.surfaceWarning; case ZdsTagColor.primary: - return zetaColors.primary; + return zetaColors.mainPrimary; case ZdsTagColor.secondary: - return zetaColors.secondary; + return zetaColors.mainSecondary; case ZdsTagColor.success: return zetaColors.surfacePositive; case ZdsTagColor.basic: - return zetaColors.warm.shade80; + return zetaColors.primitives.warm.shade80; } } Color _resolveBgColor(ZetaColors zetaColors, ZdsTagColor tagColor) { switch (tagColor) { case ZdsTagColor.error: - return zetaColors.error.surface; + return zetaColors.surfaceNegative; case ZdsTagColor.alert: - return zetaColors.orange.surface; + return zetaColors.surfaceWarning; case ZdsTagColor.primary: - return zetaColors.primary.surface; + return zetaColors.surfacePrimary; case ZdsTagColor.secondary: - return zetaColors.secondary.surface; + return zetaColors.surfaceSecondary; case ZdsTagColor.success: - return zetaColors.green.surface; + return zetaColors.surfacePositive; case ZdsTagColor.basic: - return zetaColors.warm.shade30; + return zetaColors.surfaceWarm; } } diff --git a/lib/src/components/molecules/toast.dart b/lib/src/components/molecules/toast.dart index cd542e3e..19a6dc67 100644 --- a/lib/src/components/molecules/toast.dart +++ b/lib/src/components/molecules/toast.dart @@ -104,36 +104,36 @@ class ZdsToast extends StatelessWidget implements PreferredSizeWidget { case ZdsToastColors.info: return colors.surfaceInfoSubtle; case ZdsToastColors.error: - return colors.error.shade10; + return colors.surfaceNegativeSubtle; case ZdsToastColors.primary: - return colors.primary.shade10; + return colors.surfacePrimarySubtle; case ZdsToastColors.dark: - return colors.textDefault; + return colors.mainDefault; } } Color _iconColor(ZetaColors colors, ZdsToastColors toastColor) { switch (toastColor) { case ZdsToastColors.success: - return colors.green.shade60; + return colors.mainPositive; case ZdsToastColors.warning: - return colors.orange.shade60; + return colors.mainWarning; case ZdsToastColors.info: - return colors.surfaceInfo.shade60; + return colors.mainInfo; case ZdsToastColors.error: - return colors.error.shade60; + return colors.mainNegative; case ZdsToastColors.primary: - return colors.primary.shade60; + return colors.mainPrimary; case ZdsToastColors.dark: - return colors.textInverse; + return colors.mainInverse; } } Color _foregroundColor(ZetaColors colors, ZdsToastColors toastColor) { if (toastColor == ZdsToastColors.dark) { - return colors.textInverse; + return colors.mainInverse; } else { - return colors.textDefault; + return colors.mainDefault; } } diff --git a/lib/src/components/molecules/vertical_nav.dart b/lib/src/components/molecules/vertical_nav.dart index af365ea1..85c09e4c 100644 --- a/lib/src/components/molecules/vertical_nav.dart +++ b/lib/src/components/molecules/vertical_nav.dart @@ -121,7 +121,7 @@ class _ZdsVerticalNavState extends State { data: IconThemeData( color: selected ? Theme.of(context).colorScheme.secondary - : Zeta.of(context).colors.iconSubtle, + : Zeta.of(context).colors.mainSubtle, size: 24, ), child: item.icon, @@ -241,7 +241,7 @@ class _SelectedBackground extends StatelessWidget { padding: const EdgeInsets.only(left: 1), decoration: BoxDecoration( gradient: LinearGradient( - colors: [colors.surfaceTertiary, colors.surfacePrimary], + colors: [colors.surfaceDefault, colors.surfacePrimary], ), borderRadius: const BorderRadius.only( topLeft: Radius.circular(4), diff --git a/lib/src/components/organisms/app_bar.dart b/lib/src/components/organisms/app_bar.dart index 1aed65a5..00e2895c 100644 --- a/lib/src/components/organisms/app_bar.dart +++ b/lib/src/components/organisms/app_bar.dart @@ -202,8 +202,8 @@ class ZdsAppBar extends StatelessWidget implements PreferredSizeWidget { case ZdsTabBarColor.appBar: return Theme.of(context).appBarTheme; case ZdsTabBarColor.primary: - final fgColor = zetaColors.primary.onColor; - final bgColor = zetaColors.primary; + final fgColor = zetaColors.mainPrimary.onColor; + final bgColor = zetaColors.mainDefault; return AppBarTheme( systemOverlayStyle: computeSystemOverlayStyle(bgColor), backgroundColor: bgColor, @@ -215,8 +215,8 @@ class ZdsAppBar extends StatelessWidget implements PreferredSizeWidget { actionsIconTheme: IconThemeData(color: fgColor), ); case ZdsTabBarColor.basic: - final fgColor = zetaColors.textDefault; - final bgColor = zetaColors.surfaceTertiary; + final fgColor = zetaColors.mainDefault; + final bgColor = zetaColors.surfaceDefault; return AppBarTheme( systemOverlayStyle: computeSystemOverlayStyle(bgColor), backgroundColor: bgColor, @@ -228,8 +228,8 @@ class ZdsAppBar extends StatelessWidget implements PreferredSizeWidget { actionsIconTheme: IconThemeData(color: fgColor), ); case ZdsTabBarColor.surface: - final fgColor = zetaColors.textDefault; - final bgColor = zetaColors.surfacePrimary; + final fgColor = zetaColors.mainDefault; + final bgColor = zetaColors.surfaceDefault; return AppBarTheme( systemOverlayStyle: computeSystemOverlayStyle(bgColor), backgroundColor: bgColor, diff --git a/lib/src/components/organisms/calendar.dart b/lib/src/components/organisms/calendar.dart index 102616b0..3beed797 100644 --- a/lib/src/components/organisms/calendar.dart +++ b/lib/src/components/organisms/calendar.dart @@ -66,8 +66,6 @@ class ZdsCalendar extends StatefulWidget { this.nextTooltip, this.selectedRange, this.backgroundColor, - @Deprecated('This parameter is no longer used and will be removed in the next major version.') - bool showSelectedDateHeader = false, }) : _variant = _ZdsCalendarVariant.switchable, hasHeader = true; @@ -105,8 +103,6 @@ class ZdsCalendar extends StatefulWidget { this.nextTooltip, this.selectedRange, this.backgroundColor, - @Deprecated('This parameter is no longer used and will be removed in the next major version.') - bool showSelectedDateHeader = false, }) : _variant = _ZdsCalendarVariant.monthly; /// Shows a calendar in a fixed weekly format. @@ -142,8 +138,6 @@ class ZdsCalendar extends StatefulWidget { this.previousTooltip, this.nextTooltip, this.selectedRange, - @Deprecated('This parameter is no longer used and will be removed in the next major version.') - bool showSelectedDateHeader = false, }) : _variant = _ZdsCalendarVariant.weekly, hasHeader = false; @@ -241,7 +235,7 @@ class ZdsCalendar extends StatefulWidget { /// Color of the text on the calendar header /// - /// Defaults to Zeta.of(context).colors.textSubtle + /// Defaults to Zeta.of(context).colors.mainSubtle final Color? calendarHeaderTextColor; /// Custom color override for unselected days. @@ -474,7 +468,7 @@ class _ZdsCalendarState extends State { text, style: Theme.of(context).textTheme.titleSmall?.copyWith( fontWeight: FontWeight.w500, - color: colors.textSubtle, + color: colors.mainSubtle, ), textAlign: TextAlign.center, ), @@ -507,34 +501,34 @@ class _ZdsCalendarState extends State { cellMargin: EdgeInsets.all(widget.weekIcons != null && widget.weekIcons!.isNotEmpty ? 5 : 8), defaultTextStyle: textTheme.copyWith( - color: widget.calendarTextColor ?? colors.textSubtle, + color: widget.calendarTextColor ?? colors.mainSubtle, ), weekendTextStyle: textTheme.copyWith( - color: widget.calendarTextColor ?? colors.textSubtle, + color: widget.calendarTextColor ?? colors.mainSubtle, ), holidayDecoration: BoxDecoration( - color: colors.warm.surface, + color: colors.surfaceWarm, shape: BoxShape.circle, ), - selectedTextStyle: textTheme.copyWith(color: colors.secondary.onColor), - outsideTextStyle: textTheme.copyWith(color: colors.textSubtle), - rangeStartTextStyle: textTheme.copyWith(color: colors.secondary.onColor), - rangeEndTextStyle: textTheme.copyWith(color: colors.secondary.onColor), - rangeHighlightColor: colors.secondary.surface, + selectedTextStyle: textTheme.copyWith(color: colors.mainSecondary.onColor), + outsideTextStyle: textTheme.copyWith(color: colors.mainSubtle), + rangeStartTextStyle: textTheme.copyWith(color: colors.mainSecondary.onColor), + rangeEndTextStyle: textTheme.copyWith(color: colors.mainSecondary.onColor), + rangeHighlightColor: colors.surfaceSecondary, rangeStartDecoration: BoxDecoration( - color: colors.secondary, + color: colors.mainSecondary, shape: BoxShape.circle, ), rangeEndDecoration: BoxDecoration( - color: colors.secondary, + color: colors.mainSecondary, shape: BoxShape.circle, ), markerDecoration: BoxDecoration( - color: colors.iconSubtle, + color: colors.mainSubtle, shape: BoxShape.circle, ), selectedDecoration: BoxDecoration( - color: colors.secondary, + color: colors.mainSecondary, shape: BoxShape.circle, ), todayTextStyle: textTheme, @@ -619,7 +613,7 @@ class _ZdsCalendarState extends State { child: Text( _focusedDay.format('MMMM', languageCode), style: Theme.of(context).textTheme.headlineMedium!.copyWith( - color: widget.calendarHeaderTextColor ?? colors.textSubtle, + color: widget.calendarHeaderTextColor ?? colors.mainSubtle, ), ), ), @@ -670,7 +664,7 @@ class _ZdsCalendarState extends State { child: Text( _focusedDay.format('yyyy', languageCode), style: Theme.of(context).textTheme.headlineMedium!.copyWith( - color: widget.calendarHeaderTextColor ?? colors.textSubtle, + color: widget.calendarHeaderTextColor ?? colors.mainSubtle, ), ), ), @@ -753,7 +747,7 @@ class _ZdsCalendarState extends State { widget.allCustomLabel ?? ComponentStrings.of(context).get('ALL', 'All'), style: Theme.of(context).textTheme.titleSmall!.copyWith( fontWeight: FontWeight.w500, - color: colors.textSubtle, + color: colors.mainSubtle, ), ), ), @@ -883,7 +877,7 @@ class _ZdsCalendarState extends State { label: week.semanticLabel, child: IconTheme( data: IconThemeData( - color: colors.iconDefault, + color: colors.mainDefault, size: context.isSmallScreen() ? 18 : 24, ), child: week.child, diff --git a/lib/src/components/organisms/camera/camera_page.dart b/lib/src/components/organisms/camera/camera_page.dart index 56aa3bfe..8fa59f78 100644 --- a/lib/src/components/organisms/camera/camera_page.dart +++ b/lib/src/components/organisms/camera/camera_page.dart @@ -372,7 +372,7 @@ class _CameraWrapperState extends State<_CameraWrapper> { child: AwesomeCircleWidget( theme: theme, size: 45, - child: const Icon(Icons.close, color: ZetaColorBase.white), + child: const Icon(Icons.close, color: Colors.white), ), ), const Spacer(), @@ -492,13 +492,13 @@ class _ElapsedTime extends StatelessWidget { final elapsedTimeStr = _formatDuration(elapsedTime); final totalTimeStr = totalTime != null ? _formatDuration(totalTime!) : null; return ZdsTag( - customBackgroundColor: ZetaColorBase.red, + customBackgroundColor: Zeta.of(context).colors.mainNegative, child: Text( totalTimeStr != null ? '$elapsedTimeStr/$totalTimeStr' : elapsedTimeStr, style: const TextStyle( fontSize: 14, fontWeight: FontWeight.w500, - color: ZetaColorBase.white, // Use the determined text color + color: Colors.white, // Use the determined text color ), ), ); @@ -664,10 +664,10 @@ class _CameraButtonPainter extends CustomPainter { ..isAntiAlias = true; final radius = size.width / 2; final center = Offset(size.width / 2, size.height / 2); - bgPainter.color = ZetaColorBase.white.withOpacity(.5); + bgPainter.color = Colors.white.withOpacity(.5); canvas.drawCircle(center, radius, bgPainter); - bgPainter.color = ZetaColorBase.white; + bgPainter.color = Colors.white; canvas.drawCircle(center, radius - 8, bgPainter); } @@ -687,11 +687,11 @@ class _VideoButtonPainter extends CustomPainter { ..isAntiAlias = true; final radius = size.width / 2; final center = Offset(size.width / 2, size.height / 2); - bgPainter.color = ZetaColorBase.white.withOpacity(.5); + bgPainter.color = Colors.white.withOpacity(.5); canvas.drawCircle(center, radius, bgPainter); if (isRecording) { - bgPainter.color = ZetaColorBase.red; + bgPainter.color = ZetaPrimitivesLight().red; canvas.drawRRect( RRect.fromRectAndRadius( Rect.fromLTWH( @@ -705,7 +705,7 @@ class _VideoButtonPainter extends CustomPainter { bgPainter, ); } else { - bgPainter.color = ZetaColorBase.red; + bgPainter.color = ZetaPrimitivesLight().red; canvas.drawCircle(center, radius - 8, bgPainter); } } @@ -794,14 +794,14 @@ class _PreviewActions extends StatelessWidget { shape: const CircleBorder(), backgroundColor: Colors.black38, onPressed: () async => _onPop(context, false), - child: const Icon(Icons.close, color: ZetaColorBase.white), + child: const Icon(Icons.close, color: Colors.white), ), FloatingActionButton( elevation: 0, shape: const CircleBorder(), backgroundColor: Colors.black38, onPressed: () async => _onPop(context, true), - child: const Icon(Icons.done, color: ZetaColorBase.white), + child: const Icon(Icons.done, color: Colors.white), ), ], ), diff --git a/lib/src/components/organisms/chat/audio_decoration.dart b/lib/src/components/organisms/chat/audio_decoration.dart index cba3201d..b71d77a0 100644 --- a/lib/src/components/organisms/chat/audio_decoration.dart +++ b/lib/src/components/organisms/chat/audio_decoration.dart @@ -27,7 +27,7 @@ abstract class _AudioDecoration { /// Resolves the background color to the secondary container color if not defined Color resolveBackgroundColor(BuildContext context) { - return backgroundColor ?? Theme.of(context).colorScheme.secondaryContainer; + return backgroundColor ?? Zeta.of(context).colors.mainPrimary; } /// Resolves the foreground color to the on secondary container color if not defined @@ -118,7 +118,7 @@ class ZdsAudioRecorderDecoration extends _AudioDecoration { /// Resolves the microphone icon color to orange if not defined Color resolveMicIconTint(BuildContext context) { - return micIconTint ?? Zeta.of(context).colors.orange; + return micIconTint ?? Zeta.of(context).colors.mainWarning; } /// Resolves the send icon color to the secondary color if not defined diff --git a/lib/src/components/organisms/chat/message_body/attachment.dart b/lib/src/components/organisms/chat/message_body/attachment.dart index ffbf1003..8272ebf3 100644 --- a/lib/src/components/organisms/chat/message_body/attachment.dart +++ b/lib/src/components/organisms/chat/message_body/attachment.dart @@ -49,7 +49,7 @@ class ZdsChatAttachmentWidget extends StatelessWidget { margin: const EdgeInsets.all(12), decoration: BoxDecoration( color: colors.surfacePrimary, - borderRadius: zeta.radius.rounded, + borderRadius: BorderRadius.all(zeta.radius.rounded), border: Border.all(color: colors.borderSubtle), ), child: Column( @@ -71,7 +71,7 @@ class ZdsChatAttachmentWidget extends StatelessWidget { children: [ Text( ComponentStrings.of(context).get('SHARE_FILE', 'Shared a file:'), - style: Theme.of(context).textTheme.bodyMedium?.copyWith(color: colors.textSubtle), + style: Theme.of(context).textTheme.bodyMedium?.copyWith(color: colors.mainSubtle), ), const SizedBox.square(dimension: 2), Text( @@ -81,7 +81,7 @@ class ZdsChatAttachmentWidget extends StatelessWidget { overflow: TextOverflow.ellipsis, ), const SizedBox.square(dimension: 12), - Icon(ZdsIcons.download, size: 20, color: colors.iconSubtle), + Icon(ZdsIcons.download, size: 20, color: colors.mainSubtle), ], ), ), diff --git a/lib/src/components/organisms/chat/message_body/chat_message.dart b/lib/src/components/organisms/chat/message_body/chat_message.dart index ccd760d5..a80705ce 100644 --- a/lib/src/components/organisms/chat/message_body/chat_message.dart +++ b/lib/src/components/organisms/chat/message_body/chat_message.dart @@ -113,11 +113,11 @@ class ZdsChatMessage extends StatelessWidget { ZetaColorSwatch _getColor(BuildContext context) { final colors = Zeta.of(context).colors; if (highlight) { - return colors.yellow; + return colors.primitives.yellow; } else if (isLocalUser) { - return colors.secondary; + return colors.primitives.primary; } else { - return colors.cool; + return colors.primitives.cool; } } @@ -193,7 +193,7 @@ class ZdsChatMessage extends StatelessWidget { style: Theme.of(context) .textTheme .titleSmall - ?.copyWith(color: message.senderColor ?? Zeta.of(context).colors.textDefault), + ?.copyWith(color: message.senderColor ?? Zeta.of(context).colors.mainDefault), ), ), ), @@ -206,8 +206,8 @@ class ZdsChatMessage extends StatelessWidget { child: AnimatedContainer( duration: const Duration(milliseconds: 500), decoration: BoxDecoration( - color: color.surface, - border: Border.all(color: color.subtle), + color: color.shade10, + border: Border.all(color: color.shade50), borderRadius: _borderRadius, ), child: Material( diff --git a/lib/src/components/organisms/chat/message_body/deleted.dart b/lib/src/components/organisms/chat/message_body/deleted.dart index ede60de0..940cbc20 100644 --- a/lib/src/components/organisms/chat/message_body/deleted.dart +++ b/lib/src/components/organisms/chat/message_body/deleted.dart @@ -24,7 +24,7 @@ class ZdsChatDeletedText extends StatelessWidget { style: Theme.of(context) .textTheme .bodyLarge - ?.copyWith(fontStyle: FontStyle.italic, color: Zeta.of(context).colors.textSubtle), + ?.copyWith(fontStyle: FontStyle.italic, color: Zeta.of(context).colors.mainSubtle), ), ); } diff --git a/lib/src/components/organisms/chat/message_body/file_preview.dart b/lib/src/components/organisms/chat/message_body/file_preview.dart index 0786412b..dcfbb3da 100644 --- a/lib/src/components/organisms/chat/message_body/file_preview.dart +++ b/lib/src/components/organisms/chat/message_body/file_preview.dart @@ -86,7 +86,7 @@ class _ZdsChatFilePreviewState extends State { child: Row( mainAxisSize: MainAxisSize.min, children: [ - Icon(ZdsIcons.download, size: 24, color: Zeta.of(context).colors.iconSubtle), + Icon(ZdsIcons.download, size: 24, color: Zeta.of(context).colors.mainSubtle), const SizedBox.square(dimension: 10), Text( ComponentStrings.of(context).get('DOWNLOAD', 'Download'), @@ -234,12 +234,12 @@ class __VideoState extends State<_Video> { : await _videoController!.play(); setState(() {}); }, - backgroundColor: Zeta.of(context).colors.cool.shade30.withOpacity(0.7), - hoverColor: Zeta.of(context).colors.cool.shade30.withOpacity(0.5), + backgroundColor: Zeta.of(context).colors.primitives.cool.shade30.withOpacity(0.7), + hoverColor: Zeta.of(context).colors.primitives.cool.shade30.withOpacity(0.5), hoverElevation: 0, child: Icon( _videoController!.value.isPlaying ? Icons.pause : Icons.play_arrow, - color: Zeta.of(context).colors.cool.shade30.onColor, + color: Zeta.of(context).colors.primitives.cool.shade30.onColor, ), ), ), diff --git a/lib/src/components/organisms/chat/message_body/forwarded.dart b/lib/src/components/organisms/chat/message_body/forwarded.dart index a7b3a065..cc2a31e8 100644 --- a/lib/src/components/organisms/chat/message_body/forwarded.dart +++ b/lib/src/components/organisms/chat/message_body/forwarded.dart @@ -17,13 +17,13 @@ class ZdsChatForwarded extends StatelessWidget { children: [ Icon( ZdsIcons.email_forward, - color: zetaColors.iconSubtle, + color: zetaColors.mainSubtle, size: 16, ), const SizedBox(width: 4), Text( ComponentStrings.of(context).get('FORWARDED', 'Forwarded'), - style: Theme.of(context).textTheme.bodySmall?.copyWith(color: zetaColors.textSubtle), + style: Theme.of(context).textTheme.bodySmall?.copyWith(color: zetaColors.mainSubtle), ), ], ), diff --git a/lib/src/components/organisms/chat/message_body/link_preview.dart b/lib/src/components/organisms/chat/message_body/link_preview.dart index 79b3e010..fdc64feb 100644 --- a/lib/src/components/organisms/chat/message_body/link_preview.dart +++ b/lib/src/components/organisms/chat/message_body/link_preview.dart @@ -92,9 +92,9 @@ class _ZdsChatLinkPreviewState extends State { final colors = Zeta.of(context).colors; return Shimmer.fromColors( - baseColor: colors.warm.shade40, - highlightColor: colors.warm.shade60, - child: Container(height: 16, color: colors.white), + baseColor: colors.primitives.warm.shade40, + highlightColor: colors.primitives.warm.shade60, + child: Container(height: 16, color: Colors.white), ); } @@ -113,7 +113,7 @@ class _ZdsChatLinkPreviewState extends State { } return Text( text, - style: Theme.of(context).textTheme.bodySmall?.copyWith(color: Zeta.of(context).colors.textSubtle), + style: Theme.of(context).textTheme.bodySmall?.copyWith(color: Zeta.of(context).colors.mainSubtle), ); } @@ -132,7 +132,7 @@ class _ZdsChatLinkPreviewState extends State { borderRadius: const BorderRadius.all(Radius.circular(6)), child: Container( decoration: BoxDecoration( - color: Zeta.of(context).colors.warm.shade30.withOpacity(0.2), + color: Zeta.of(context).colors.primitives.warm.shade30.withOpacity(0.2), borderRadius: const BorderRadius.all(Radius.circular(6)), ), padding: const EdgeInsets.all(14), @@ -144,7 +144,8 @@ class _ZdsChatLinkPreviewState extends State { Container( width: 40, height: 40, - decoration: BoxDecoration(color: zetaColors.secondary.shade10, shape: BoxShape.circle), + decoration: + BoxDecoration(color: zetaColors.primitives.secondary.shade10, shape: BoxShape.circle), child: buildImage, ), Expanded( diff --git a/lib/src/components/organisms/chat/message_body/reacts_tags.dart b/lib/src/components/organisms/chat/message_body/reacts_tags.dart index 2a78a29e..9561fd2f 100644 --- a/lib/src/components/organisms/chat/message_body/reacts_tags.dart +++ b/lib/src/components/organisms/chat/message_body/reacts_tags.dart @@ -131,7 +131,7 @@ class _ChatReactionsPill extends StatelessWidget { ExcludeSemantics( child: Text( reactionsAmount, - style: Theme.of(context).textTheme.labelSmall?.copyWith(color: zetaColors.textSubtle), + style: Theme.of(context).textTheme.labelSmall?.copyWith(color: zetaColors.mainSubtle), ), ), const SizedBox(width: 6), @@ -222,18 +222,18 @@ class _ChatTagsPill extends StatelessWidget { offset: const Offset(0, 1), ), ], - color: zetaColors.secondary, + color: zetaColors.mainSecondary, ), child: Padding( padding: const EdgeInsets.symmetric(horizontal: 7, vertical: 5), child: Row( children: [ - Icon(ZdsIcons.tag, size: 10, color: zetaColors.secondary.onColor), + Icon(ZdsIcons.tag, size: 10, color: zetaColors.mainSecondary.onColor), const SizedBox(width: 4), ExcludeSemantics( child: Text( tags.length < 10 ? tags.length.toString() : '9+', - style: Theme.of(context).textTheme.labelSmall?.copyWith(color: zetaColors.secondary.onColor), + style: Theme.of(context).textTheme.labelSmall?.copyWith(color: zetaColors.mainSecondary.onColor), ), ), ], diff --git a/lib/src/components/organisms/chat/message_body/read_receipt.dart b/lib/src/components/organisms/chat/message_body/read_receipt.dart index 583d137f..e9d3a8f7 100644 --- a/lib/src/components/organisms/chat/message_body/read_receipt.dart +++ b/lib/src/components/organisms/chat/message_body/read_receipt.dart @@ -43,7 +43,7 @@ class ZdsReadReceipt extends StatelessWidget { children: [ Text( timeString, - style: themeData.textTheme.bodySmall?.copyWith(color: zetaColors.textSubtle, fontWeight: FontWeight.w500), + style: themeData.textTheme.bodySmall?.copyWith(color: zetaColors.mainSubtle, fontWeight: FontWeight.w500), ), if (isLocalUser) const SizedBox(width: 6), if (isLocalUser && status != ZdsChatMessageStatus.notSent && !messageDeleted) @@ -52,7 +52,7 @@ class ZdsReadReceipt extends StatelessWidget { ? Icons.done_all : Icons.done, size: 16, - color: status == ZdsChatMessageStatus.read ? themeData.colorScheme.secondary : zetaColors.iconSubtle, + color: status == ZdsChatMessageStatus.read ? themeData.colorScheme.secondary : zetaColors.mainSubtle, ), ], ), diff --git a/lib/src/components/organisms/chat/message_body/reply.dart b/lib/src/components/organisms/chat/message_body/reply.dart index 0f37b827..b410c3e0 100644 --- a/lib/src/components/organisms/chat/message_body/reply.dart +++ b/lib/src/components/organisms/chat/message_body/reply.dart @@ -25,14 +25,14 @@ class ZdsChatReplyMessageBody extends StatelessWidget { child: ClipRRect( borderRadius: BorderRadius.circular(6), child: ColoredBox( - color: zetaColors.warm.shade40, + color: zetaColors.primitives.warm.shade40, child: Stack( children: [ Positioned( top: 0, bottom: 0, left: 0, - child: Container(color: zetaColors.iconSubtle, width: 4), + child: Container(color: zetaColors.mainSubtle, width: 4), ), Padding( padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8), diff --git a/lib/src/components/organisms/chat/message_body/text.dart b/lib/src/components/organisms/chat/message_body/text.dart index e1200752..66c3152c 100644 --- a/lib/src/components/organisms/chat/message_body/text.dart +++ b/lib/src/components/organisms/chat/message_body/text.dart @@ -46,14 +46,14 @@ class ZdsChatTextMessage extends StatelessWidget { [...urls].map((e) { return MapEntry( e, - HighlightedWord(textStyle: textStyle?.apply(color: zetaColors.blue.shade70), onTap: onLinkTapped), + HighlightedWord(textStyle: textStyle?.apply(color: zetaColors.primitives.blue.shade70), onTap: onLinkTapped), ); }), ); if (searchTerm != null && searchTerm!.isNotEmpty) { wordsMapping[searchTerm!] = HighlightedWord( - decoration: BoxDecoration(color: zetaColors.yellow, borderRadius: BorderRadius.circular(2)), + decoration: BoxDecoration(color: zetaColors.primitives.yellow, borderRadius: BorderRadius.circular(2)), ); } return Padding( diff --git a/lib/src/components/organisms/chat/message_input.dart b/lib/src/components/organisms/chat/message_input.dart index 04c2e55c..dbc60c12 100644 --- a/lib/src/components/organisms/chat/message_input.dart +++ b/lib/src/components/organisms/chat/message_input.dart @@ -321,7 +321,7 @@ class ZdsMessageInputState extends State with SingleTickerProvi IconButton( padding: EdgeInsets.zero, icon: const Icon(ZdsIcons.add), - color: zetaColors.iconSubtle, + color: zetaColors.mainSubtle, tooltip: ComponentStrings.of(context).get( 'EXPAND_MESSAGE_OPTIONS', 'Expand message options', @@ -388,7 +388,7 @@ class ZdsMessageInputState extends State with SingleTickerProvi ), if (widget.allowVoiceNotes && !kIsWeb) IconButton( - icon: Icon(Icons.mic, size: 24, color: zetaColors.iconSubtle), + icon: Icon(Icons.mic, size: 24, color: zetaColors.mainSubtle), tooltip: ComponentStrings.of(context).get( 'ADD_VOICE_NOTE', 'Add voice note', @@ -485,7 +485,7 @@ class ZdsMessageInputState extends State with SingleTickerProvi child: IconButton( icon: const Icon(ZdsIcons.close, size: 20), onPressed: Navigator.of(context).pop, - color: zetaColors.iconSubtle, + color: zetaColors.mainSubtle, splashRadius: 24, ), ), diff --git a/lib/src/components/organisms/date_range.dart b/lib/src/components/organisms/date_range.dart index 2db3c223..810251c5 100644 --- a/lib/src/components/organisms/date_range.dart +++ b/lib/src/components/organisms/date_range.dart @@ -4,11 +4,6 @@ import 'package:intl/intl.dart'; import '../../../../zds_flutter.dart'; -/// A date range selector that also allows to quickly change the range selected by jumping to the next or -/// previous set of dates. -@Deprecated('Use ZdsDateRange instead') -typedef DateRange = ZdsDateRange; - /// A date range selector that also allows to quickly change the range selected by jumping to the next or /// previous set of dates. /// diff --git a/lib/src/components/organisms/date_range_picker_tile.dart b/lib/src/components/organisms/date_range_picker_tile.dart index 255fe703..d61c1d7b 100644 --- a/lib/src/components/organisms/date_range_picker_tile.dart +++ b/lib/src/components/organisms/date_range_picker_tile.dart @@ -534,7 +534,7 @@ class _DateField extends StatelessWidget { isInitialDate ? ComponentStrings.of(context).get('FROM', 'From') : ComponentStrings.of(context).get('TO', 'To'), - style: Theme.of(context).textTheme.bodySmall?.copyWith(color: zetaColors.textSubtle), + style: Theme.of(context).textTheme.bodySmall?.copyWith(color: zetaColors.mainSubtle), ).paddingOnly(left: 2), InkWell( onTap: () async { @@ -589,7 +589,7 @@ class _DateField extends StatelessWidget { ), Icon( ZdsIcons.calendar, - color: zetaColors.iconSubtle, + color: zetaColors.mainSubtle, size: 22, ), ], diff --git a/lib/src/components/organisms/file_picker/file_picker.dart b/lib/src/components/organisms/file_picker/file_picker.dart index 99a8d9d6..f83b9b90 100644 --- a/lib/src/components/organisms/file_picker/file_picker.dart +++ b/lib/src/components/organisms/file_picker/file_picker.dart @@ -43,10 +43,6 @@ typedef ZdsFileValidator = Future Function( ZdsFilePickerOptions option, ); -/// The configuration used in a [ZdsFilePicker]. -@Deprecated('Use ZdsFilePickerConfig instead of FilePickerConfig.') -typedef FilePickerConfig = ZdsFilePickerConfig; - /// The configuration used in a [ZdsFilePicker]. /// /// [maxPixelSize] is used to set a maximum side dimension for an image. For example, if the [maxPixelSize] is 500, @@ -482,7 +478,7 @@ class ZdsFilePickerState extends State with AutomaticKeepAliveCli Icon( option.icon, size: 24 + ((widget.visualDensity?.horizontal ?? 0) * 4), - color: zetaColors.iconSubtle, + color: zetaColors.mainSubtle, ), const SizedBox(width: 20), Text( @@ -951,7 +947,7 @@ extension on ZdsFilePickerState { Icon( option.icon, size: 24 + ((widget.visualDensity?.vertical ?? 0) * 4), - color: zetaColors.iconSubtle, + color: zetaColors.mainSubtle, ), if (widget.optionDisplay == ZdsOptionDisplay.standard) ...[ SizedBox(height: 10 + ((widget.visualDensity?.vertical ?? 0) * 4)), @@ -959,7 +955,7 @@ extension on ZdsFilePickerState { option.getLabel(context), maxLines: 1, overflow: TextOverflow.ellipsis, - style: style?.copyWith(color: zetaColors.textSubtle), + style: style?.copyWith(color: zetaColors.mainSubtle), textScaler: MediaQuery.textScalerOf(context).clamp(maxScaleFactor: 2.7), ), ], diff --git a/lib/src/components/organisms/file_picker/file_wrapper.dart b/lib/src/components/organisms/file_picker/file_wrapper.dart index d32dd396..d6bd2209 100644 --- a/lib/src/components/organisms/file_picker/file_wrapper.dart +++ b/lib/src/components/organisms/file_picker/file_wrapper.dart @@ -13,12 +13,6 @@ import 'package:mime/mime.dart' as mime; import 'package:path/path.dart' as path; import 'file_picker.dart'; -/// Extension on FilePickerException to show message - -/// Types of files the [ZdsFilePicker] can be used to pick. -@Deprecated('Use ZdsFilePickerOptions instead of FilePickerOptions.') -typedef FilePickerOptions = ZdsFilePickerOptions; - /// Types of files the [ZdsFilePicker] can be used to pick. enum ZdsFilePickerOptions { /// Opens native video file picker. @@ -40,10 +34,6 @@ enum ZdsFilePickerOptions { GIF } -/// Wrapper around files picked using [ZdsFilePicker]. -@Deprecated('Use ZdsFileWrapper instead of FileWrapper.') -typedef FileWrapper = ZdsFileWrapper; - /// Wrapper around files picked using [ZdsFilePicker]. @immutable class ZdsFileWrapper { diff --git a/lib/src/components/organisms/file_picker/giphy_picker.dart b/lib/src/components/organisms/file_picker/giphy_picker.dart index 57395263..b0fb24d9 100644 --- a/lib/src/components/organisms/file_picker/giphy_picker.dart +++ b/lib/src/components/organisms/file_picker/giphy_picker.dart @@ -146,7 +146,7 @@ class _ZdsGiphyPickerState extends State { ] : [], ), - backgroundColor: Zeta.of(context).colors.surfaceTertiary, + backgroundColor: Zeta.of(context).colors.surfaceDefault, body: LayoutBuilder( builder: (BuildContext context, BoxConstraints box) { return Column( diff --git a/lib/src/components/organisms/file_preview.dart b/lib/src/components/organisms/file_preview.dart index 3e2a09dc..0931be8d 100644 --- a/lib/src/components/organisms/file_preview.dart +++ b/lib/src/components/organisms/file_preview.dart @@ -92,7 +92,7 @@ class ZdsFilePreview extends StatelessWidget { padding: EdgeInsets.zero, splashRadius: 24, visualDensity: VisualDensity.compact, - icon: Icon(ZdsIcons.close_circle, size: 24, color: Zeta.of(context).colors.error), + icon: Icon(ZdsIcons.close_circle, size: 24, color: Zeta.of(context).colors.mainNegative), onPressed: onDelete, ), ), @@ -180,7 +180,7 @@ class ZdsFileSize extends StatelessWidget { Widget _sizeText(BuildContext context, int size) { return Text( fileSizeWithUnit(size), - style: Theme.of(context).textTheme.bodySmall?.copyWith(color: Zeta.of(context).colors.textSubtle), + style: Theme.of(context).textTheme.bodySmall?.copyWith(color: Zeta.of(context).colors.mainSubtle), ); } diff --git a/lib/src/components/organisms/fiscal_date_picker.dart b/lib/src/components/organisms/fiscal_date_picker.dart index 26ff7475..92e8dc1b 100644 --- a/lib/src/components/organisms/fiscal_date_picker.dart +++ b/lib/src/components/organisms/fiscal_date_picker.dart @@ -165,8 +165,8 @@ class _ZdsDatePickerDialogState extends State { lastDay: widget.lastDate, calendarRowHeight: orientation == Orientation.portrait ? 44 : 38, headerPadding: EdgeInsets.zero, - calendarHeaderIconColor: Zeta.of(context).colors.iconDefault, - calendarHeaderTextColor: Zeta.of(context).colors.textSubtle, + calendarHeaderIconColor: Zeta.of(context).colors.mainDefault, + calendarHeaderTextColor: Zeta.of(context).colors.mainSubtle, startingDayOfWeek: _getStartingDayOfWeek(widget.startDayOfWeek), onDaySelected: (selectedDay, focusedDay) { setState(() { diff --git a/lib/src/components/organisms/html_preview/html_body.dart b/lib/src/components/organisms/html_preview/html_body.dart index d56f337d..7b40745a 100644 --- a/lib/src/components/organisms/html_preview/html_body.dart +++ b/lib/src/components/organisms/html_preview/html_body.dart @@ -196,20 +196,20 @@ class ZdsHtml extends StatelessWidget { margin: Margins.zero, padding: HtmlPaddings.symmetric(horizontal: 14, vertical: 8), border: Border(left: BorderSide(color: zetaColors.borderDisabled, width: 4)), - color: zetaColors.textSubtle, + color: zetaColors.mainSubtle, ), 'pre': Style( margin: Margins.zero, padding: HtmlPaddings.all(14), - backgroundColor: zetaColors.surfaceTertiary, + backgroundColor: zetaColors.surfaceDefault, lineHeight: LineHeight.percent(100), - color: zetaColors.primary.selected, + color: zetaColors.statePrimarySelected, ), 'code': Style( margin: Margins.zero, - backgroundColor: zetaColors.surfaceTertiary, + backgroundColor: zetaColors.surfaceDefault, lineHeight: LineHeight.percent(100), - color: zetaColors.primary, + color: zetaColors.mainPrimary, ), ...style, }; diff --git a/lib/src/components/organisms/html_preview/table_html_extension.dart b/lib/src/components/organisms/html_preview/table_html_extension.dart index ffa9c0e9..483c4f54 100644 --- a/lib/src/components/organisms/html_preview/table_html_extension.dart +++ b/lib/src/components/organisms/html_preview/table_html_extension.dart @@ -269,7 +269,7 @@ class ZdsTableHtmlExtension extends HtmlExtension { children: children, href: context.attributes['href'], style: Style( - color: ZetaColorBase.blue.shade50, + color: const ZetaPrimitivesLight().blue.shade50, textDecoration: TextDecoration.underline, ), node: context.node, diff --git a/lib/src/components/organisms/image_editor/pages/draw_page.dart b/lib/src/components/organisms/image_editor/pages/draw_page.dart index df6ac565..84d79421 100644 --- a/lib/src/components/organisms/image_editor/pages/draw_page.dart +++ b/lib/src/components/organisms/image_editor/pages/draw_page.dart @@ -158,7 +158,7 @@ class _DrawPageState extends State { isSelected: selectedTab == DrawOptions.pen, icon: Icon( Icons.edit, - color: selectedTab == DrawOptions.pen ? zetaColors.primary : null, + color: selectedTab == DrawOptions.pen ? zetaColors.mainPrimary : null, ), label: strings.get('PEN', 'Pen'), onPressed: () { @@ -175,7 +175,7 @@ class _DrawPageState extends State { isSelected: selectedTab == DrawOptions.highlight, icon: Icon( Icons.highlight, - color: selectedTab == DrawOptions.highlight ? zetaColors.primary : null, + color: selectedTab == DrawOptions.highlight ? zetaColors.mainPrimary : null, ), label: strings.get('HIGHLIGHT', 'Highlight'), onPressed: () { diff --git a/lib/src/components/organisms/image_editor/pages/draw_shape_page.dart b/lib/src/components/organisms/image_editor/pages/draw_shape_page.dart index 1d9a9f98..cc1aab43 100644 --- a/lib/src/components/organisms/image_editor/pages/draw_shape_page.dart +++ b/lib/src/components/organisms/image_editor/pages/draw_shape_page.dart @@ -172,7 +172,7 @@ class _DrawShapePageState extends State { isSelected: _selectedShapeType == ShapeType.square, icon: Icon( Icons.square_outlined, - color: _selectedShapeType == ShapeType.square ? zetaColors.primary : null, + color: _selectedShapeType == ShapeType.square ? zetaColors.mainPrimary : null, ), label: strings.get('SQUARE', 'Square'), onPressed: () { @@ -185,7 +185,7 @@ class _DrawShapePageState extends State { isSelected: _selectedShapeType == ShapeType.circle, icon: Icon( Icons.circle_outlined, - color: _selectedShapeType == ShapeType.circle ? zetaColors.primary : null, + color: _selectedShapeType == ShapeType.circle ? zetaColors.mainPrimary : null, ), label: strings.get('CIRCLE', 'Circle'), onPressed: () { @@ -198,7 +198,7 @@ class _DrawShapePageState extends State { isSelected: _selectedShapeType == ShapeType.arrow, icon: Icon( Icons.arrow_forward, - color: _selectedShapeType == ShapeType.arrow ? zetaColors.primary : null, + color: _selectedShapeType == ShapeType.arrow ? zetaColors.mainPrimary : null, ), label: strings.get('ARROW', 'Arrow'), onPressed: () { @@ -211,7 +211,7 @@ class _DrawShapePageState extends State { isSelected: _selectedShapeType == ShapeType.line, icon: Icon( Icons.horizontal_rule, - color: _selectedShapeType == ShapeType.line ? zetaColors.primary : null, + color: _selectedShapeType == ShapeType.line ? zetaColors.mainPrimary : null, ), label: strings.get('LINE', 'Line'), onPressed: () { diff --git a/lib/src/components/organisms/image_editor/pages/text_page.dart b/lib/src/components/organisms/image_editor/pages/text_page.dart index fe9439cc..484ae0df 100644 --- a/lib/src/components/organisms/image_editor/pages/text_page.dart +++ b/lib/src/components/organisms/image_editor/pages/text_page.dart @@ -49,7 +49,7 @@ class _TextPageState extends State { Widget build(BuildContext context) { final strings = ComponentStrings.of(context); final zetaColors = Zeta.of(context).colors; - final backgroundColor = widget.image.color ?? zetaColors.black.withAlpha(110); + final backgroundColor = widget.image.color ?? zetaColors.primitives.pure.shade1000.withAlpha(110); return PopScope( canPop: false, diff --git a/lib/src/components/organisms/image_editor/utils/editor_icon.dart b/lib/src/components/organisms/image_editor/utils/editor_icon.dart index cb0782b5..c061254a 100644 --- a/lib/src/components/organisms/image_editor/utils/editor_icon.dart +++ b/lib/src/components/organisms/image_editor/utils/editor_icon.dart @@ -42,7 +42,7 @@ class EditorIcon extends StatelessWidget { const SizedBox(height: 12), Text( label, - style: TextStyle(color: isSelected ? zetaColors.primary : null), + style: TextStyle(color: isSelected ? zetaColors.mainPrimary : null), ), ], ), diff --git a/lib/src/components/organisms/list_group.dart b/lib/src/components/organisms/list_group.dart index 1a49995d..00974b83 100644 --- a/lib/src/components/organisms/list_group.dart +++ b/lib/src/components/organisms/list_group.dart @@ -85,15 +85,15 @@ class ZdsListGroup extends StatelessWidget { children: [ Expanded( child: DefaultTextStyle( - style: safeTextStyle(themeData.textTheme.titleSmall).copyWith(color: zetaColors.textSubtle), + style: safeTextStyle(themeData.textTheme.titleSmall).copyWith(color: zetaColors.mainSubtle), child: headerLabel != null ? headerLabel! : const SizedBox(), ), ), if (headerActions?.isNotEmpty ?? false) IconTheme.merge( - data: IconThemeData(color: zetaColors.secondary.icon, size: 20), + data: IconThemeData(color: zetaColors.mainSecondary, size: 20), child: DefaultTextStyle( - style: safeTextStyle(themeData.textTheme.titleSmall).copyWith(color: zetaColors.secondary.text), + style: safeTextStyle(themeData.textTheme.titleSmall).copyWith(color: zetaColors.mainSecondary), child: Align( alignment: Alignment.centerRight, child: Row( diff --git a/lib/src/components/organisms/list_tile.dart b/lib/src/components/organisms/list_tile.dart index ec793f29..50afa91a 100644 --- a/lib/src/components/organisms/list_tile.dart +++ b/lib/src/components/organisms/list_tile.dart @@ -55,7 +55,7 @@ class ZdsListTile extends StatelessWidget { /// Typically a [Text] widget. /// /// The subtitle's default [TextStyle] depends on [TextTheme.bodyMedium] except - /// [TextStyle.color]. The [TextStyle.color] is Zeta.of(context).colors.textSubtle. + /// [TextStyle.color]. The [TextStyle.color] is Zeta.of(context).colors.mainSubtle. final Widget? subtitle; /// A widget to display after the title. @@ -123,7 +123,7 @@ class ZdsListTile extends StatelessWidget { final EdgeInsets padding = contentPadding ?? kZdsListTileTheme.contentPadding; final TextStyle? titleStyle = themeData.textTheme.bodyMedium; final zetaColors = Zeta.of(context).colors; - final Color subtitleColor = zetaColors.textSubtle; + final Color subtitleColor = zetaColors.mainSubtle; final EdgeInsets insets = _resolveInsets(padding); final Color effectiveBackground = backgroundColor ?? (context.findAncestorWidgetOfExactType() != null diff --git a/lib/src/components/organisms/navigation_menu.dart b/lib/src/components/organisms/navigation_menu.dart index e25f04f5..7a982e68 100644 --- a/lib/src/components/organisms/navigation_menu.dart +++ b/lib/src/components/organisms/navigation_menu.dart @@ -63,7 +63,7 @@ class ZdsNavigationMenu extends StatelessWidget { .toList(), ), ), - if (withSpacer) Container(height: 12, color: Zeta.of(context).colors.surfaceTertiary), + if (withSpacer) Container(height: 12, color: Zeta.of(context).colors.surfaceDefault), ], ), ); @@ -91,7 +91,7 @@ class ZdsNavigationMenuLabel extends StatelessWidget { @override Widget build(BuildContext context) { return child.textStyle( - Theme.of(context).textTheme.titleSmall?.copyWith(color: Zeta.of(context).colors.textSubtle), + Theme.of(context).textTheme.titleSmall?.copyWith(color: Zeta.of(context).colors.mainSubtle), ); } } diff --git a/lib/src/components/organisms/profile.dart b/lib/src/components/organisms/profile.dart index f292f9a4..676ca808 100644 --- a/lib/src/components/organisms/profile.dart +++ b/lib/src/components/organisms/profile.dart @@ -101,7 +101,7 @@ class ZdsProfile extends StatelessWidget { label: semanticLabelSubTitle, child: jobTitleText.textStyle( themeData.textTheme.titleMedium?.copyWith( - color: zetaColors.textSubtle, + color: zetaColors.mainSubtle, ), ), ), diff --git a/lib/src/components/organisms/properties_list.dart b/lib/src/components/organisms/properties_list.dart index f6ee885d..5e8bc082 100644 --- a/lib/src/components/organisms/properties_list.dart +++ b/lib/src/components/organisms/properties_list.dart @@ -122,7 +122,7 @@ class ZdsPropertiesList extends StatelessWidget { child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ - label.textStyle(themeData.textTheme.titleSmall?.copyWith(color: zetaColors.textSubtle)).space(8), + label.textStyle(themeData.textTheme.titleSmall?.copyWith(color: zetaColors.mainSubtle)).space(8), value.textStyle( themeData.textTheme.bodyLarge?.copyWith(color: zetaColors.textDefault), overflow: TextOverflow.clip, diff --git a/lib/src/components/organisms/search_app_bar.dart b/lib/src/components/organisms/search_app_bar.dart index 0acd0088..7c49a3f3 100644 --- a/lib/src/components/organisms/search_app_bar.dart +++ b/lib/src/components/organisms/search_app_bar.dart @@ -269,7 +269,7 @@ class ZdsSearchAppBarState extends State { icon: Icon( ZdsIcons.close_circle, size: 20, - color: Zeta.of(context).colors.iconSubtle, + color: Zeta.of(context).colors.mainSubtle, ), onPressed: () { _textEditingController.clear(); diff --git a/lib/src/components/organisms/selectable_widget.dart b/lib/src/components/organisms/selectable_widget.dart index b4818e34..4813b21f 100644 --- a/lib/src/components/organisms/selectable_widget.dart +++ b/lib/src/components/organisms/selectable_widget.dart @@ -75,7 +75,7 @@ class _ZdsSelectableWidgetState extends State { if (!(widget.copyable ?? false)) return widget.child; final zeta = Zeta.of(context).colors; return GestureDetector( - child: ColoredBox(color: isSelected ? zeta.primary.surface : Colors.transparent, child: widget.child), + child: ColoredBox(color: isSelected ? zeta.surfacePrimary : Colors.transparent, child: widget.child), onLongPress: () async { if (isSelected) return; toggleSelection(); diff --git a/lib/src/utils/assets/icons.dart b/lib/src/utils/assets/icons.dart index d053f706..1be3372c 100644 --- a/lib/src/utils/assets/icons.dart +++ b/lib/src/utils/assets/icons.dart @@ -405,13 +405,13 @@ Color iconColor(String ext, {BuildContext? context}) { case '.rtf': case '.ttf': case '.txt': - return colors?.blue ?? const Color(0xFF376FC9); + return colors?.primitives.blue ?? const Color(0xFF376FC9); case '.pdf': case '.ppt': case '.ppr': case '.pptx': - return colors?.red ?? const Color(0xFFDB0D00); + return colors?.primitives.red ?? const Color(0xFFDB0D00); case '.gif': case '.ico': @@ -421,7 +421,7 @@ Color iconColor(String ext, {BuildContext? context}) { case '.tif': case '.tiff': case '.bmp': - return colors?.orange ?? const Color(0xFFF56200); + return colors?.primitives.orange ?? const Color(0xFFF56200); case '.flv': case '.m4v': @@ -429,7 +429,7 @@ Color iconColor(String ext, {BuildContext? context}) { case '.mpeg': case '.mpg': case '.qt': - return colors?.purple ?? const Color(0xFF6F00C6); + return colors?.primitives.purple ?? const Color(0xFF6F00C6); case '.aac': case '.au': @@ -438,22 +438,22 @@ Color iconColor(String ext, {BuildContext? context}) { case '.mp3': case '.mp4': case '.wav': - return colors?.teal ?? const Color(0xFF70A300); + return colors?.primitives.teal ?? const Color(0xFF70A300); case '.csv': case '.xml': case '.xls': case '.xlsx': - return colors?.green ?? const Color(0xFF1F802E); + return colors?.primitives.green ?? const Color(0xFF1F802E); case '.htm': case '.rar': case '.url': case '.zip': - return colors?.warm ?? const Color(0xFF888888); + return colors?.primitives.warm ?? const Color(0xFF888888); default: - return colors?.iconDefault ?? const Color(0xFF1d1e23); + return colors?.mainDefault ?? const Color(0xFF1d1e23); } } @@ -481,11 +481,6 @@ extension IconDataFromExt on String { return _extensions[_safeExt] ?? ZdsIcons.file_o; } - @Deprecated('Use fileIconColor instead.') - Icon coloredFileIcon() { - return Icon(fileIcon(), color: iconColor(_safeExt)); - } - Color fileIconColor(BuildContext context) { return iconColor(_safeExt, context: context); } diff --git a/lib/src/utils/theme/input_border.dart b/lib/src/utils/theme/input_border.dart index 4e3bd05f..291d97b0 100644 --- a/lib/src/utils/theme/input_border.dart +++ b/lib/src/utils/theme/input_border.dart @@ -74,7 +74,7 @@ class ZdsInputDecoration extends InputDecoration { ), Text( ' *', - style: TextStyle(color: Zeta.of(context).colors.error), + style: TextStyle(color: Zeta.of(context).colors.mainNegative), ).excludeSemantics(), ], ); diff --git a/lib/src/utils/theme/theme.dart b/lib/src/utils/theme/theme.dart index 864217bf..1fa29496 100644 --- a/lib/src/utils/theme/theme.dart +++ b/lib/src/utils/theme/theme.dart @@ -11,7 +11,7 @@ ZdsBottomBarThemeData buildZdsBottomBarThemeData(BuildContext context) { shadows: [ BoxShadow( offset: const Offset(0, -1), - color: Zeta.of(context).colors.textDefault.withOpacity(0.1), + color: Zeta.of(context).colors.mainDefault.withOpacity(0.1), blurRadius: 2, ), ], @@ -288,18 +288,10 @@ extension ThemeExtension on ThemeData { /// Gets prefix icon used for [ZdsSearchField]. Widget get prefixIcon => Builder( builder: (context) { - return Icon(ZdsIcons.search, color: Zeta.of(context).colors.iconSubtle); + return Icon(ZdsIcons.search, color: Zeta.of(context).colors.mainSubtle); }, ); - /// Gets default theme data for [ZdsListTile]. - @Deprecated('Use kZdsListTileTheme instead') - ZdsListTileTheme get zdsListTileThemeData => kZdsListTileTheme; - - ///Gets default theme data for [ZdsToolbar]. - @Deprecated('Use kZdsToolbarTheme instead') - ZdsToolbarThemeData get zdsToolbarThemeData => kZdsToolbarTheme; - /// Gets default theme data for [ZdsSearchField] ThemeData zdsSearchThemeData(ThemeData baseTheme, ZdsSearchFieldVariant variant, ZetaColors zetaColors) { final OutlineInputBorder border = OutlineInputBorder( @@ -321,7 +313,7 @@ extension ThemeExtension on ThemeData { ); } - final CardTheme cardTheme = this.cardTheme.copyWith( + final CardThemeData cardTheme = this.cardTheme.copyWith( shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(kSearchBorderRadius), ), @@ -362,144 +354,6 @@ extension ThemeExtension on ThemeData { ); } - /// Generates theme for [ZdsTabBar]. - @Deprecated('Use ZdsTabBar.buildTheme() instead') - ZdsTabBarStyleContainer zdsTabBarThemeData( - BuildContext context, { - required bool hasIcons, - required ZdsTabBarColor color, - Color? indicatorColor, - }) { - /// Builds [ZdsTabBarStyleContainer]. Defaults to primary color. - ZdsTabBarStyleContainer tabBarStyle( - BuildContext context, { - required bool hasIcons, - required Color selectedText, - required Color background, - required Color unselectedText, - required Color indicator, - }) { - final double height = hasIcons ? 56.0 : 48.0; - final ThemeData theme = Theme.of(context); - - final TabBarTheme tabBarTheme = theme.tabBarTheme.copyWith(indicatorSize: TabBarIndicatorSize.tab); - final TextStyle? labelStyle = hasIcons ? theme.textTheme.bodySmall : theme.textTheme.bodyLarge; - - return ZdsTabBarStyleContainer( - customTheme: ZdsTabBarThemeData( - decoration: BoxDecoration(color: background), - height: height, - ), - theme: theme.copyWith( - tabBarTheme: tabBarTheme.copyWith( - labelStyle: labelStyle, - unselectedLabelStyle: labelStyle, - unselectedLabelColor: unselectedText, - labelColor: selectedText, - indicator: UnderlineTabIndicator( - borderSide: BorderSide( - width: 3, - color: indicator, - ), - ), - ), - ), - ); - } - - final zetaColors = Zeta.of(context).colors; - switch (color) { - case ZdsTabBarColor.primary: - return tabBarStyle( - context, - hasIcons: hasIcons, - background: zetaColors.primary, - indicator: zetaColors.primary.onColor, - selectedText: zetaColors.primary.onColor, - unselectedText: zetaColors.primary.onColor.withOpacity(0.5), - ); - case ZdsTabBarColor.basic: - return tabBarStyle( - context, - hasIcons: hasIcons, - background: colorScheme.background, - indicator: zetaColors.primary, - selectedText: zetaColors.textDefault, - unselectedText: zetaColors.textSubtle, - ); - case ZdsTabBarColor.surface: - return tabBarStyle( - context, - hasIcons: hasIcons, - background: zetaColors.surfacePrimary, - indicator: zetaColors.primary, - selectedText: zetaColors.textDefault, - unselectedText: zetaColors.textSubtle, - ); - case ZdsTabBarColor.appBar: - final appBarTheme = Theme.of(context).appBarTheme; - return tabBarStyle( - context, - hasIcons: hasIcons, - background: appBarTheme.backgroundColor ?? zetaColors.surfacePrimary, - indicator: appBarTheme.foregroundColor ?? zetaColors.primary, - selectedText: appBarTheme.foregroundColor ?? zetaColors.textDefault, - unselectedText: appBarTheme.foregroundColor?.withOpacity(0.5) ?? zetaColors.textSubtle, - ); - } - } - - /// Builds theme variants for [ZdsAppBar]. - /// - /// See also - /// * [ZdsTabBarColor]. - @Deprecated('Use ZdsAppBar.buildTheme() instead.') - AppBarTheme buildAppBarTheme(ZdsTabBarColor color) { - final isDarkMode = brightness == Brightness.dark; - switch (color) { - case ZdsTabBarColor.primary: - case ZdsTabBarColor.appBar: - final fgColor = isDarkMode ? colorScheme.cool.shade90 : colorScheme.onPrimary; - final bgColor = isDarkMode ? colorScheme.cool.shade10 : colorScheme.primary; - return AppBarTheme( - systemOverlayStyle: computeSystemOverlayStyle(bgColor), - backgroundColor: bgColor, - foregroundColor: fgColor, - centerTitle: false, - titleSpacing: 0, - elevation: 0.5, - iconTheme: IconThemeData(color: fgColor), - actionsIconTheme: IconThemeData(color: fgColor), - ); - case ZdsTabBarColor.basic: - final fgColor = isDarkMode ? colorScheme.cool.shade90 : colorScheme.cool.shade10; - final bgColor = isDarkMode ? colorScheme.cool.shade10 : colorScheme.cool.shade90; - return AppBarTheme( - systemOverlayStyle: computeSystemOverlayStyle(bgColor), - backgroundColor: bgColor, - foregroundColor: fgColor, - centerTitle: false, - titleSpacing: 0, - elevation: 0.5, - iconTheme: IconThemeData(color: fgColor), - actionsIconTheme: IconThemeData(color: fgColor), - ); - case ZdsTabBarColor.surface: - final fgColor = isDarkMode ? colorScheme.cool.shade90 : colorScheme.onSurface; - final bgColor = isDarkMode ? colorScheme.cool.shade10 : colorScheme.surface; - return AppBarTheme( - systemOverlayStyle: computeSystemOverlayStyle(bgColor), - backgroundColor: bgColor, - foregroundColor: fgColor, - centerTitle: false, - titleSpacing: 0, - elevation: 0.5, - iconTheme: IconThemeData(color: fgColor), - actionsIconTheme: IconThemeData(color: fgColor), - ); - } - } - /// Theme data used to create compact buttons. /// /// Should not be used often as buttons typically should not be too small. diff --git a/lib/src/utils/theme/theme_builders/app_bar_theme.dart b/lib/src/utils/theme/theme_builders/app_bar_theme.dart index 763b8e03..8484865f 100644 --- a/lib/src/utils/theme/theme_builders/app_bar_theme.dart +++ b/lib/src/utils/theme/theme_builders/app_bar_theme.dart @@ -1,11 +1,11 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorExtensions, ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart' show ZetaSemantics; import '../../tools.dart' show computeSystemOverlayStyle; -/// An extension on the [ZetaColorScheme] class that adds the method +/// An extension on the [ZetaSemantics] class that adds the method /// [appBarTheme] for creating an [AppBarTheme] object. -extension ZetaAppBarTheme on ZetaColorScheme { +extension ZetaAppBarTheme on ZetaSemantics { /// Returns an [AppBarTheme] object created based on the provided [textTheme] /// and [background]. /// @@ -15,9 +15,9 @@ extension ZetaAppBarTheme on ZetaColorScheme { /// The `foreground` color is determined based on the [background] color. AppBarTheme appBarTheme(TextTheme textTheme, Color background) { // Calculate the preferred foreground color based on the given background color. - final foreground = background.onColor; + final foreground = primitives.cool.shade90; // Replace with appropriate logic if needed. - // Return an AppBarTheme instant built using the resolved foreground color and provided parameters. + // Return an AppBarTheme instance built using the resolved foreground color and provided parameters. return AppBarTheme( // Compute the SystemUiOverlayStyle to be set given the appBar's background color. systemOverlayStyle: computeSystemOverlayStyle(background), diff --git a/lib/src/utils/theme/theme_builders/bottom_app_bar_theme.dart b/lib/src/utils/theme/theme_builders/bottom_app_bar_theme.dart index 91c76458..c53c34a0 100644 --- a/lib/src/utils/theme/theme_builders/bottom_app_bar_theme.dart +++ b/lib/src/utils/theme/theme_builders/bottom_app_bar_theme.dart @@ -1,26 +1,26 @@ import 'package:flutter/foundation.dart'; import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart' show ZetaSemantics; -/// This extension provides a [BottomAppBarTheme] instance for a given [ZetaColorScheme]. -extension ZetaBottomAppBartTheme on ZetaColorScheme { - /// Creates and returns a [BottomAppBarTheme] based on the defined [ZetaColorScheme]. +/// This extension provides a [BottomAppBarTheme] instance for a given [ZetaSemantics]. +extension ZetaBottomAppBarTheme on ZetaSemantics { + /// Creates and returns a [BottomAppBarTheme] based on the defined [ZetaSemantics]. /// /// The [BottomAppBarTheme] has its color, surface tint color, shadow color, and padding values - /// influenced by the [ZetaColorScheme]. + /// influenced by the [ZetaSemantics]. BottomAppBarTheme bottomAppBarTheme() { return BottomAppBarTheme( - /// The color of the `BottomAppBar`. This is set to the `surface` color of the - /// `ZetaColorScheme`. - color: surface, + /// The color of the `BottomAppBar`. This is set to the `surfaceDefault` color of the + /// `ZetaSemantics`. + color: colors.surfaceDefault, - /// The surface tint color of the `BottomAppBar`. This is set to the `onSurface` color of the - /// `ZetaColorScheme`. - surfaceTintColor: onSurface, + /// The surface tint color of the `BottomAppBar`. This is set to the `mainDefault` color of the + /// `ZetaSemantics`. + surfaceTintColor: colors.mainDefault, - /// The shadow color of the `BottomAppBar` is set to the `onBackground` color of the `ZetaColorScheme`, + /// The shadow color of the `BottomAppBar` is set to the `mainSubtle` color of the `ZetaSemantics`, /// but with an opacity of 0.1. - shadowColor: onSurface.withOpacity(0.1), + shadowColor: colors.mainSubtle.withOpacity(0.1), /// Padding inside the `BottomAppBar`. This is constant and set to be symmetric both horizontally /// and vertically. When running on the web, vertical padding is 8, otherwise it's 4. diff --git a/lib/src/utils/theme/theme_builders/bottom_navigation_bar_theme.dart b/lib/src/utils/theme/theme_builders/bottom_navigation_bar_theme.dart index 038d475f..48e23084 100644 --- a/lib/src/utils/theme/theme_builders/bottom_navigation_bar_theme.dart +++ b/lib/src/utils/theme/theme_builders/bottom_navigation_bar_theme.dart @@ -1,13 +1,13 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart' show ZetaSemantics; -/// An extension on [ZetaColorScheme] class, offering a collection of +/// An extension on [ZetaSemantics] class, offering a collection of /// methods for convenient creation of bottom sheet related /// themes such as [BottomSheetThemeData], [BottomAppBarTheme] and /// [BottomNavigationBarThemeData] objects. -extension ZetaBottomNavigationBarTheme on ZetaColorScheme { +extension ZetaBottomNavigationBarTheme on ZetaSemantics { /// Returns a [BottomNavigationBarTheme] object taking into account - /// the [textTheme] style and the color scheme of this [ZetaColorScheme]. + /// the [textTheme] style and the color scheme of this [ZetaSemantics]. BottomNavigationBarThemeData bottomNavigationBarTheme(TextTheme textTheme) { return BottomNavigationBarThemeData( // Set the type of the bottom navigation bar @@ -15,11 +15,11 @@ extension ZetaBottomNavigationBarTheme on ZetaColorScheme { // Sets the style of the selected and unselected labels of the navigation bar selectedLabelStyle: textTheme.bodySmall, unselectedLabelStyle: textTheme.bodySmall, - unselectedItemColor: zetaColors.textSubtle, - selectedItemColor: secondary, + unselectedItemColor: colors.mainSubtle, + selectedItemColor: colors.mainSecondary, // Sets the icon theme for selected and unselected items - selectedIconTheme: IconThemeData(size: 24, color: secondary), - unselectedIconTheme: IconThemeData(size: 24, color: zetaColors.iconSubtle), + selectedIconTheme: IconThemeData(size: 24, color: colors.mainSecondary), + unselectedIconTheme: IconThemeData(size: 24, color: colors.mainSubtle), ); } } diff --git a/lib/src/utils/theme/theme_builders/bottom_sheet_theme.dart b/lib/src/utils/theme/theme_builders/bottom_sheet_theme.dart index fcfea868..b9144b68 100644 --- a/lib/src/utils/theme/theme_builders/bottom_sheet_theme.dart +++ b/lib/src/utils/theme/theme_builders/bottom_sheet_theme.dart @@ -1,8 +1,8 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart' show ZetaSemantics; -/// An extension of the [ZetaColorScheme] that provides a BottomSheet theme design. -extension ZetaBottomSheetTheme on ZetaColorScheme { +/// An extension of the [ZetaSemantics] that provides a BottomSheet theme design. +extension ZetaBottomSheetTheme on ZetaSemantics { /// Creates and returns a themed [BottomSheetThemeData]. /// /// The [BottomSheetThemeData] uses a custom shape border for diff --git a/lib/src/utils/theme/theme_builders/button_theme.dart b/lib/src/utils/theme/theme_builders/button_theme.dart index 3b19ba59..11fa4d93 100644 --- a/lib/src/utils/theme/theme_builders/button_theme.dart +++ b/lib/src/utils/theme/theme_builders/button_theme.dart @@ -1,23 +1,24 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart'; +import '../../../../zds_flutter.dart'; import '../../../components/atoms/button.dart' show ZdsButton, ZdsButtonVariant; -/// An extension on [ZetaColorScheme] class, offering methods for creating -/// text, elevated, and outlined button themes for this [ZetaColorScheme]. -extension ZetaButtonTheme on ZetaColorScheme { +/// An extension on [ZetaSemantics] class, offering methods for creating +/// text, elevated, and outlined button themes for this [ZetaSemantics]. +extension ZetaButtonTheme on ZetaSemantics { /// Returns a [BorderSide] with no outline. This is meant for buttons /// that should not have any border. WidgetStateProperty baseButtonBorderSide() => WidgetStateProperty.all(BorderSide.none); - /// Provides a standard padding for buttons across this [ZetaColorScheme]. + /// Provides a standard padding for buttons across this [ZetaSemantics]. EdgeInsets buttonPadding() => const EdgeInsets.symmetric(horizontal: 24, vertical: 10); - /// Provides the border radius for round buttons in this [ZetaColorScheme]. + /// Provides the border radius for round buttons in this [ZetaSemantics]. BorderRadius buttonBorderRadius() => const BorderRadius.all(Radius.circular(71)); /// Returns a [WidgetStateProperty] of [OutlinedBorder] which could - /// be used when round buttons are required in this [ZetaColorScheme]. + /// be used when round buttons are required in this [ZetaSemantics]. WidgetStateProperty buttonCircularShapeBorder() { return WidgetStateProperty.all( RoundedRectangleBorder( @@ -27,12 +28,12 @@ extension ZetaButtonTheme on ZetaColorScheme { } /// Builds a [TextButtonThemeData] with styles specified by the [ZdsButton.getStyle] function - /// and the [ZetaColorScheme] colors. + /// and the [ZetaSemantics] colors. TextButtonThemeData textButtonTheme(TextTheme textTheme) { return TextButtonThemeData( style: ZdsButton.getStyle( variant: ZdsButtonVariant.text, - zetaColors: zetaColors, + zetaColors: colors, textTheme: textTheme, ).copyWith( padding: WidgetStateProperty.all(buttonPadding()), @@ -44,12 +45,12 @@ extension ZetaButtonTheme on ZetaColorScheme { } /// Builds a [ElevatedButtonThemeData] with properties specified by - /// the [ZdsButton.getStyle] function and the [ZetaColorScheme] colors. + /// the [ZdsButton.getStyle] function and the [ZetaSemantics] colors. ElevatedButtonThemeData elevatedButtonTheme(TextTheme textTheme) { return ElevatedButtonThemeData( style: ZdsButton.getStyle( variant: ZdsButtonVariant.filled, - zetaColors: zetaColors, + zetaColors: colors, textTheme: textTheme, ).copyWith( padding: WidgetStateProperty.all(buttonPadding()), @@ -61,12 +62,12 @@ extension ZetaButtonTheme on ZetaColorScheme { } /// Builds a [OutlinedButtonThemeData] with properties specified by - /// the [ZdsButton.getStyle] function and the [ZetaColorScheme] colors. + /// the [ZdsButton.getStyle] function and the [ZetaSemantics] colors. OutlinedButtonThemeData outlinedButtonTheme(TextTheme textTheme) { return OutlinedButtonThemeData( style: ZdsButton.getStyle( variant: ZdsButtonVariant.outlined, - zetaColors: zetaColors, + zetaColors: colors, textTheme: textTheme, ).copyWith( padding: WidgetStateProperty.all(buttonPadding()), diff --git a/lib/src/utils/theme/theme_builders/card_theme.dart b/lib/src/utils/theme/theme_builders/card_theme.dart index c02f9d2c..e4ae5783 100644 --- a/lib/src/utils/theme/theme_builders/card_theme.dart +++ b/lib/src/utils/theme/theme_builders/card_theme.dart @@ -1,32 +1,28 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart' show ZetaSemantics; -import '../../theme.dart'; - -/// This extension method is used to add additional properties to the [ZetaColorScheme]. -extension ZetaCardTheme on ZetaColorScheme { - /// This function returns a [CardTheme] after applying some properties to the [ZetaColorScheme]. +/// This extension method is used to add additional properties to the [ZetaSemantics]. +extension ZetaCardTheme on ZetaSemantics { + /// This function returns a [CardTheme] after applying some properties to the [ZetaSemantics]. /// /// Returns: /// A CardTheme with the applied properties. CardTheme cardTheme() { - /// Returns CardTheme after customizing properties like color, - /// elevation, margin, shadowColor and shape. return CardTheme( - /// Assigning color to surface - color: surface, + /// Assigning color to surfaceDefault + color: colors.surfaceDefault, - /// Settings elevation to 1 + /// Settings elevation to 2 elevation: 2, /// Setting margin to EdgeInsets.all(3) - margin: const EdgeInsets.all(kZdsCardMargin), + margin: EdgeInsets.all(primitives.x1), /// Setting shadowColor with a bit of opacity - shadowColor: kZdsCardShadowColor, + shadowColor: colors.mainSubtle.withOpacity(0.1), /// Customizing the shape of the Card - shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(kZdsCardRadius)), + shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(primitives.x4)), ); } } diff --git a/lib/src/utils/theme/theme_builders/checkbox_theme.dart b/lib/src/utils/theme/theme_builders/checkbox_theme.dart index 64d55804..e2769b55 100644 --- a/lib/src/utils/theme/theme_builders/checkbox_theme.dart +++ b/lib/src/utils/theme/theme_builders/checkbox_theme.dart @@ -1,11 +1,11 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorExtensions, ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart'; import '../../tools.dart' show widgetStatePropertyResolver; -/// This is an extension method on [ZetaColorScheme] which is used to customize the [CheckboxThemeData]. -extension ZetaCheckboxTheme on ZetaColorScheme { - /// This function returns a [CheckboxThemeData] customized with properties taken from the [ZetaColorScheme]. +/// This is an extension method on [ZetaSemantics] which is used to customize the [CheckboxThemeData]. +extension ZetaCheckboxTheme on ZetaSemantics { + /// This function returns a [CheckboxThemeData] customized with properties taken from the [ZetaSemantics]. /// /// Returns: /// A [CheckboxThemeData] with the applied properties. @@ -22,26 +22,26 @@ extension ZetaCheckboxTheme on ZetaColorScheme { /// Setting up custom fill color for different material states. fillColor: widgetStatePropertyResolver( - selectedValue: zetaColors.secondary, - hoveredValue: zetaColors.secondary, - focusedValue: zetaColors.secondary.hover, - disabledValue: zetaColors.secondary.subtle, + selectedValue: colors.mainSecondary, + hoveredValue: colors.mainSecondary, + focusedValue: colors.stateSecondaryHover, + disabledValue: colors.surfaceSecondarySubtle, defaultValue: Colors.transparent, ), /// Setting up the side property. - side: BorderSide(color: zetaColors.iconDefault, width: 2), + side: BorderSide(color: colors.mainDefault, width: 2), /// Setting up custom checkColor for different material states. checkColor: widgetStatePropertyResolver( - selectedValue: onSecondary, - hoveredValue: onSecondary, - defaultValue: zetaColors.secondary.onColor, + selectedValue: colors.mainInverse, + hoveredValue: colors.mainInverse, + defaultValue: colors.mainInverse, ), /// Setting up custom overlayColor for different material states. overlayColor: widgetStatePropertyResolver( - hoveredValue: zetaColors.surfaceHover, + hoveredValue: colors.surfaceHover, ), /// Setting tap target size to "padded". diff --git a/lib/src/utils/theme/theme_builders/chip_theme.dart b/lib/src/utils/theme/theme_builders/chip_theme.dart index fc3d3347..9757b493 100644 --- a/lib/src/utils/theme/theme_builders/chip_theme.dart +++ b/lib/src/utils/theme/theme_builders/chip_theme.dart @@ -1,10 +1,10 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart'; -/// This is an extension method on [ZetaColorScheme] which is used to customize the [ChipThemeData]. -extension ZetaChipTheme on ZetaColorScheme { +/// This is an extension method on [ZetaSemantics] which is used to customize the [ChipThemeData]. +extension ZetaChipTheme on ZetaSemantics { /// This function requires a [TextTheme] object as a parameter, and - /// returns a [ChipThemeData] customized with properties taken from the [ZetaColorScheme] and the passed TextTheme. + /// returns a [ChipThemeData] customized with properties taken from the [ZetaSemantics] and the passed TextTheme. /// /// Parameter: /// [textTheme] : A TextTheme object used to copy styles for label and secondary label. @@ -17,31 +17,28 @@ extension ZetaChipTheme on ZetaColorScheme { /// checkmarkColor, labelStyle, secondaryLabelStyle and iconTheme. return ChipThemeData( /// Setting up the background color. - backgroundColor: zetaColors.secondary.surface, + backgroundColor: colors.surfaceSecondary, /// Setting up the selected color. - selectedColor: zetaColors.secondary.surface, + selectedColor: colors.surfaceSecondary, /// Setting up the disabled color. - disabledColor: zetaColors.borderDisabled, + disabledColor: colors.borderDisabled, /// Setting up the delete icon color. - deleteIconColor: zetaColors.secondary.selected, + deleteIconColor: colors.stateSecondarySelected, /// Setting up the checkmark color. - checkmarkColor: zetaColors.secondary.selected, + checkmarkColor: colors.stateSecondarySelected, /// Defining the label style using the provided textTheme. - labelStyle: textTheme.bodyMedium?.copyWith(color: zetaColors.secondary.selected), + labelStyle: textTheme.bodyMedium?.copyWith(color: colors.stateSecondarySelected), /// Defining the secondary label style using the provided textTheme. - secondaryLabelStyle: textTheme.bodyMedium?.copyWith(color: zetaColors.textSubtle), + secondaryLabelStyle: textTheme.bodyMedium?.copyWith(color: colors.mainSubtle), // Defining an icon theme data. - iconTheme: IconThemeData( - size: 24, - color: zetaColors.secondary.selected, - ), + iconTheme: IconThemeData(size: 24, color: colors.stateSecondarySelected), ); } } diff --git a/lib/src/utils/theme/theme_builders/date_picker_theme.dart b/lib/src/utils/theme/theme_builders/date_picker_theme.dart index 0892845b..602ee3e9 100644 --- a/lib/src/utils/theme/theme_builders/date_picker_theme.dart +++ b/lib/src/utils/theme/theme_builders/date_picker_theme.dart @@ -2,10 +2,10 @@ import 'package:flutter/material.dart'; import '../../../../zds_flutter.dart'; -/// This is an extension method on [ZetaColorScheme] which is used to customize the [DatePickerThemeData]. -extension ZetaDatePickerTheme on ZetaColorScheme { +/// This is an extension method on [ZetaSemantics] which is used to customize the [DatePickerThemeData]. +extension ZetaDatePickerTheme on ZetaSemantics { /// This function returns a [DatePickerThemeData] customized with properties - /// taken from the [ZetaColorScheme]. + /// taken from the [ZetaSemantics]. /// /// Returns: /// A [DatePickerThemeData] with the applied properties. @@ -15,10 +15,10 @@ extension ZetaDatePickerTheme on ZetaColorScheme { return DatePickerThemeData( headerBackgroundColor: appBarTheme.backgroundColor, headerForegroundColor: appBarTheme.foregroundColor, - backgroundColor: zetaColors.surfacePrimary, - rangePickerBackgroundColor: zetaColors.surfacePrimary, + backgroundColor: colors.surfacePrimary, + rangePickerBackgroundColor: colors.surfacePrimary, rangePickerHeaderForegroundColor: appBarTheme.foregroundColor, - rangeSelectionBackgroundColor: zetaColors.secondary.shade20, + rangeSelectionBackgroundColor: colors.primitives.secondary.shade20, ); } } diff --git a/lib/src/utils/theme/theme_builders/dialog_theme.dart b/lib/src/utils/theme/theme_builders/dialog_theme.dart index cd6431e8..8dbbf122 100644 --- a/lib/src/utils/theme/theme_builders/dialog_theme.dart +++ b/lib/src/utils/theme/theme_builders/dialog_theme.dart @@ -1,10 +1,10 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart'; -/// Extension method on the [ZetaColorScheme] class. +/// Extension method on the [ZetaSemantics] class. /// /// Returns a custom [DialogTheme]. -extension ZetaDialogTheme on ZetaColorScheme { +extension ZetaDialogTheme on ZetaSemantics { /// Generates a [DialogTheme] based on the current color scheme. /// /// The background color of the dialog will be set to the tertiary surface color @@ -15,10 +15,10 @@ extension ZetaDialogTheme on ZetaColorScheme { // Return a DialogTheme with custom properties return DialogTheme( // Set the background color to the tertiary color of this ZetaColorScheme - backgroundColor: zetaColors.surfaceTertiary, + backgroundColor: colors.surfaceDefault, // sets dialog barrier color to white12 if the brightness is dark, otherwise black54 - barrierColor: zetaColors.brightness == Brightness.dark ? Colors.white12 : Colors.black54, + barrierColor: colors.primitives.brightness == Brightness.dark ? Colors.white12 : Colors.black54, // Set the shape to a RoundedRectangle with a borderRadius of 8 shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)), diff --git a/lib/src/utils/theme/theme_builders/divider_theme.dart b/lib/src/utils/theme/theme_builders/divider_theme.dart index 933c29b4..bcaa0634 100644 --- a/lib/src/utils/theme/theme_builders/divider_theme.dart +++ b/lib/src/utils/theme/theme_builders/divider_theme.dart @@ -1,10 +1,10 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart'; -/// This is an extension method on [ZetaColorScheme] which is used to customize the [DividerThemeData]. -extension ZetaDividerTheme on ZetaColorScheme { +/// This is an extension method on [ZetaSemantics] which is used to customize the [DividerThemeData]. +extension ZetaDividerTheme on ZetaSemantics { /// This function returns a [DividerThemeData] customized with properties - /// taken from the [ZetaColorScheme]. + /// taken from the [ZetaSemantics]. /// /// Returns: /// A [DividerThemeData] with the applied properties. @@ -19,7 +19,7 @@ extension ZetaDividerTheme on ZetaColorScheme { space: 1, /// Using a color from the zetaColors for the divider color - color: zetaColors.borderSubtle, + color: colors.borderSubtle, ); } } diff --git a/lib/src/utils/theme/theme_builders/icon_theme.dart b/lib/src/utils/theme/theme_builders/icon_theme.dart index f0c4f849..efceed41 100644 --- a/lib/src/utils/theme/theme_builders/icon_theme.dart +++ b/lib/src/utils/theme/theme_builders/icon_theme.dart @@ -1,9 +1,9 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart'; /// ZetaIconTheme extension on ZetaColorScheme. /// Provides an IconThemeData instance with predefined size and color. -extension ZetaIconTheme on ZetaColorScheme { +extension ZetaIconTheme on ZetaSemantics { /// Returns a [IconThemeData] object taking the given parameters into account. /// /// [color] is used to define the icon color. diff --git a/lib/src/utils/theme/theme_builders/input_decoration_theme.dart b/lib/src/utils/theme/theme_builders/input_decoration_theme.dart index 6efb0fac..8cb4ab55 100644 --- a/lib/src/utils/theme/theme_builders/input_decoration_theme.dart +++ b/lib/src/utils/theme/theme_builders/input_decoration_theme.dart @@ -1,12 +1,12 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart'; import '../../theme.dart' show ZdsInputBorder; -/// This extension on [ZetaColorScheme] allows to create and customize [InputDecorationTheme]. -extension ZetaDividerTheme on ZetaColorScheme { +/// This extension on [ZetaSemantics] allows to create and customize [InputDecorationTheme]. +extension ZetaDividerTheme on ZetaSemantics { /// Creates a custom [InputDecorationTheme] using the specified - /// properties and styles obtained from the [ZetaColorScheme] and [TextTheme]. + /// properties and styles obtained from the [ZetaSemantics] and [TextTheme]. /// /// Parameter: /// [textTheme] : A TextTheme object to copy text styles from. @@ -21,16 +21,16 @@ extension ZetaDividerTheme on ZetaColorScheme { /// labelStyle, and counterStyle. return InputDecorationTheme( /// Setting up the border using custom ZdsInputBorder. - border: ZdsInputBorder(borderSide: BorderSide(color: zetaColors.borderDefault)), + border: ZdsInputBorder(borderSide: BorderSide(color: colors.borderDefault)), /// Setting up the border when the input is focussed. - focusedBorder: ZdsInputBorder(borderSide: BorderSide(color: zetaColors.borderSelected)), + focusedBorder: ZdsInputBorder(borderSide: BorderSide(color: colors.borderSelected)), /// Setting up the border when the input is enabled. - enabledBorder: ZdsInputBorder(borderSide: BorderSide(color: zetaColors.borderDefault)), + enabledBorder: ZdsInputBorder(borderSide: BorderSide(color: colors.borderDefault)), /// Setting up the border when the input is disabled. - disabledBorder: ZdsInputBorder(borderSide: BorderSide(color: zetaColors.borderDisabled)), + disabledBorder: ZdsInputBorder(borderSide: BorderSide(color: colors.borderDisabled)), /// Always displaying the floating label. floatingLabelBehavior: FloatingLabelBehavior.always, @@ -39,40 +39,40 @@ extension ZetaDividerTheme on ZetaColorScheme { contentPadding: const EdgeInsets.fromLTRB(12, 27, 12, 27), /// Setting up the border to indicate an error. - errorBorder: ZdsInputBorder(borderSide: BorderSide(color: errorContainer)), + errorBorder: ZdsInputBorder(borderSide: BorderSide(color: colors.borderNegative)), - /// Setting up the colour of input when focused. - focusColor: zetaColors.borderSelected, + /// Setting up the color of input when focused. + focusColor: colors.borderSelected, /// Custom border setup for when the input has focus and also has an error. - focusedErrorBorder: ZdsInputBorder(borderSide: BorderSide(color: error)), + focusedErrorBorder: ZdsInputBorder(borderSide: BorderSide(color: colors.mainNegative)), /// Setting up the label text style using the provided textTheme. labelStyle: textTheme.titleSmall?.copyWith( fontSize: 19, fontWeight: FontWeight.w500, - color: zetaColors.textSubtle, + color: colors.mainSubtle, height: 0, ), /// Setting up the Icon color for suffix - prefixIconColor: zetaColors.iconDefault, + prefixIconColor: colors.mainDefault, /// Setting up the Icon color for suffix - suffixIconColor: zetaColors.iconSubtle, + suffixIconColor: colors.mainSubtle, /// Setting up the label text style using the provided textTheme. suffixStyle: textTheme.titleSmall?.copyWith( fontSize: 19, fontWeight: FontWeight.w500, - color: zetaColors.textSubtle, + color: colors.mainSubtle, height: 0, ), /// Setting up the counter text style using the provided textTheme. counterStyle: textTheme.bodySmall?.copyWith( height: 0.1, - color: zetaColors.textSubtle, + color: colors.mainSubtle, ), ); } diff --git a/lib/src/utils/theme/theme_builders/list_tile_theme.dart b/lib/src/utils/theme/theme_builders/list_tile_theme.dart index 502edc9b..9cdc13b1 100644 --- a/lib/src/utils/theme/theme_builders/list_tile_theme.dart +++ b/lib/src/utils/theme/theme_builders/list_tile_theme.dart @@ -1,12 +1,12 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart'; import '../../tools.dart' show widgetStatePropertyResolver; -/// This extension on [ZetaColorScheme] allows to create and customize [ListTileThemeData]. -extension ListTileExtension on ZetaColorScheme { +/// This extension on [ZetaSemantics] allows to create and customize [ListTileThemeData]. +extension ListTileExtension on ZetaSemantics { /// Creates a custom [ListTileThemeData] using the specified - /// properties and styles obtained from the [ZetaColorScheme] and [TextTheme]. + /// properties and styles obtained from the [ZetaSemantics] and [TextTheme]. /// /// Parameter: /// [textTheme] : A TextTheme object to copy text styles from. @@ -20,22 +20,22 @@ extension ListTileExtension on ZetaColorScheme { /// mouseCursor. return ListTileThemeData( /// Setting up the selected list tile color. - selectedColor: zetaColors.primary.selected, + selectedColor: colors.statePrimarySelected, /// Selected tile color - selectedTileColor: zetaColors.primary.surface, + selectedTileColor: colors.surfacePrimary, /// Setting up the icon color. - iconColor: zetaColors.iconDefault, + iconColor: colors.mainDefault, /// Setting up the title text style using the provided textTheme. - titleTextStyle: textTheme.bodyMedium?.copyWith(color: zetaColors.textDefault), + titleTextStyle: textTheme.bodyMedium?.copyWith(color: colors.mainDefault), /// Setting up the subtitle text style using the provided textTheme. - subtitleTextStyle: textTheme.bodySmall?.copyWith(color: zetaColors.textSubtle), + subtitleTextStyle: textTheme.bodySmall?.copyWith(color: colors.mainSubtle), /// Setting up the styles for both leading and trailing texts. - leadingAndTrailingTextStyle: textTheme.bodySmall?.copyWith(color: zetaColors.textSubtle), + leadingAndTrailingTextStyle: textTheme.bodySmall?.copyWith(color: colors.mainSubtle), /// Setting up custom mouse cursors for different material states. mouseCursor: widgetStatePropertyResolver( diff --git a/lib/src/utils/theme/theme_builders/popup_menu_theme.dart b/lib/src/utils/theme/theme_builders/popup_menu_theme.dart index c7e5568d..86b33788 100644 --- a/lib/src/utils/theme/theme_builders/popup_menu_theme.dart +++ b/lib/src/utils/theme/theme_builders/popup_menu_theme.dart @@ -1,10 +1,10 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart'; -/// This extension on [ZetaColorScheme] allows to create and customize [PopupMenuThemeData]. -extension PopupMenuExtension on ZetaColorScheme { +/// This extension on [ZetaSemantics] allows to create and customize [PopupMenuThemeData]. +extension PopupMenuExtension on ZetaSemantics { /// Creates a custom [PopupMenuThemeData] using the specified - /// properties and styles obtained from the [ZetaColorScheme] and [TextTheme]. + /// properties and styles obtained from the [ZetaSemantics] and [TextTheme]. /// /// Parameter: /// [textTheme] : A TextTheme object to copy text styles from. @@ -23,10 +23,10 @@ extension PopupMenuExtension on ZetaColorScheme { elevation: 5, /// Setting up the color. - color: surface, + color: colors.surfaceDefault, /// Setting up the tint color of the surface. - surfaceTintColor: onSurface, + surfaceTintColor: colors.mainDefault, ); } } diff --git a/lib/src/utils/theme/theme_builders/progress_indicator_theme.dart b/lib/src/utils/theme/theme_builders/progress_indicator_theme.dart index acbee263..ecd01bb9 100644 --- a/lib/src/utils/theme/theme_builders/progress_indicator_theme.dart +++ b/lib/src/utils/theme/theme_builders/progress_indicator_theme.dart @@ -1,10 +1,10 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart'; -/// An extension on [ZetaColorScheme] for customizing the [ProgressIndicatorThemeData]. -extension ProgressIndicatorExtension on ZetaColorScheme { +/// An extension on [ZetaSemantics] for customizing the [ProgressIndicatorThemeData]. +extension ProgressIndicatorExtension on ZetaSemantics { /// Creates a custom [ProgressIndicatorThemeData] using the properties obtained - /// from the [ZetaColorScheme]. + /// from the [ZetaSemantics]. /// /// Returns: /// A [ProgressIndicatorThemeData] with the applied properties. @@ -13,7 +13,7 @@ extension ProgressIndicatorExtension on ZetaColorScheme { /// Returns ProgressIndicatorThemeData after assigning the color property. return ProgressIndicatorThemeData( /// Setting up the color. - color: secondary, + color: colors.mainSecondary, linearTrackColor: Colors.transparent, circularTrackColor: Colors.transparent, ); diff --git a/lib/src/utils/theme/theme_builders/radio_theme.dart b/lib/src/utils/theme/theme_builders/radio_theme.dart index 43db8deb..a368331d 100644 --- a/lib/src/utils/theme/theme_builders/radio_theme.dart +++ b/lib/src/utils/theme/theme_builders/radio_theme.dart @@ -1,13 +1,13 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart'; import '../../tools/utils.dart' show widgetStatePropertyResolver; -/// An extension on [ZetaColorScheme]. +/// An extension on [ZetaSemantics]. /// /// This extension adds a method [radioThemeData], which allows for customizing -/// the appearance of a radio button using the [ZetaColorScheme]. -extension RadioExtension on ZetaColorScheme { +/// the appearance of a radio button using the [ZetaSemantics]. +extension RadioExtension on ZetaSemantics { /// Creates and returns a [RadioThemeData] object. /// /// Mouse cursors, fill color, overlay color, tap target size, and visual density @@ -25,16 +25,16 @@ extension RadioExtension on ZetaColorScheme { /// Defines the fill color for the different states of radio button. fillColor: widgetStatePropertyResolver( - selectedValue: zetaColors.secondary, - hoveredValue: zetaColors.secondary.hover, - focusedValue: zetaColors.secondary.hover, - disabledValue: zetaColors.secondary.subtle, - defaultValue: zetaColors.iconDefault, + selectedValue: colors.mainSecondary, + hoveredValue: colors.stateSecondaryHover, + focusedValue: colors.stateSecondaryHover, + disabledValue: colors.surfaceSecondarySubtle, + defaultValue: colors.mainDefault, ), /// Defines the overlay color for hover state of radio button. overlayColor: widgetStatePropertyResolver( - hoveredValue: zetaColors.surfaceHover, + hoveredValue: colors.surfaceHover, ), /// Defines the size of the material tap target. diff --git a/lib/src/utils/theme/theme_builders/search_bar_theme.dart b/lib/src/utils/theme/theme_builders/search_bar_theme.dart index 765eceee..7e4a552e 100644 --- a/lib/src/utils/theme/theme_builders/search_bar_theme.dart +++ b/lib/src/utils/theme/theme_builders/search_bar_theme.dart @@ -1,11 +1,11 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart'; -/// An extension on [ZetaColorScheme]. +/// An extension on [ZetaSemantics]. /// /// This extension adds a method [searchBarTheme], which allows for customizing -/// the appearance of a SearchBar using the [ZetaColorScheme] and a given [TextTheme]. -extension SearchBarExtension on ZetaColorScheme { +/// the appearance of a SearchBar using the [ZetaSemantics] and a given [TextTheme]. +extension SearchBarExtension on ZetaSemantics { /// Creates and returns a [SearchBarThemeData] object. /// /// Text styles, color and elevation of the SearchBar can be customized through this method. @@ -15,7 +15,7 @@ extension SearchBarExtension on ZetaColorScheme { return SearchBarThemeData( /// Defines the hintStyle - The style of hint text to display in the SearchBar /// when no text has been entered. - hintStyle: WidgetStateProperty.all(textTheme.bodyMedium?.copyWith(color: zetaColors.textSubtle)), + hintStyle: WidgetStateProperty.all(textTheme.bodyMedium?.copyWith(color: colors.mainSubtle)), /// Defines the textStyle - The style of text to display in the SearchBar /// when the user has entered text. diff --git a/lib/src/utils/theme/theme_builders/slider_theme.dart b/lib/src/utils/theme/theme_builders/slider_theme.dart index edad2c02..40eaa627 100644 --- a/lib/src/utils/theme/theme_builders/slider_theme.dart +++ b/lib/src/utils/theme/theme_builders/slider_theme.dart @@ -1,11 +1,11 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart'; -/// An extension on [ZetaColorScheme]. +/// An extension on [ZetaSemantics]. /// /// This extension adds a method [sliderTheme], which allows for customizing -/// the appearance of a [Slider] using the [ZetaColorScheme]. -extension ZetaDividerTheme on ZetaColorScheme { +/// the appearance of a [Slider] using the [ZetaSemantics]. +extension ZetaDividerTheme on ZetaSemantics { /// Creates and returns a [SliderThemeData] object. /// /// Track height, active and inactive track colors, active and inactive tick mark @@ -16,19 +16,19 @@ extension ZetaDividerTheme on ZetaColorScheme { trackHeight: 3, /// Defines the color of the active part of the slider track - activeTrackColor: zetaColors.secondary, + activeTrackColor: colors.mainSecondary, /// Defines the color of the active tick mark in the slider - activeTickMarkColor: onSecondary, + activeTickMarkColor: colors.mainInverse, /// Defines the color of the inactive tick mark in the slider - inactiveTickMarkColor: zetaColors.borderSelected, + inactiveTickMarkColor: colors.borderSelected, /// Defines the color of the inactive part of the slider track - inactiveTrackColor: zetaColors.borderSubtle, + inactiveTrackColor: colors.borderSubtle, /// Defines the color of the secondary active part of the slider track - secondaryActiveTrackColor: zetaColors.borderDefault, + secondaryActiveTrackColor: colors.borderDefault, ); } } diff --git a/lib/src/utils/theme/theme_builders/switch_theme.dart b/lib/src/utils/theme/theme_builders/switch_theme.dart index 765b2c99..00a0c7d1 100644 --- a/lib/src/utils/theme/theme_builders/switch_theme.dart +++ b/lib/src/utils/theme/theme_builders/switch_theme.dart @@ -1,16 +1,16 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart'; import '../../tools/utils.dart' show widgetStatePropertyResolver; -/// This code defines a Dart extension method for [ZetaColorScheme], which uses Material UI components. -/// It provides a new [switchTheme] method that allows for customization of a [SwitchThemeData] according to the [ZetaColorScheme]. +/// This code defines a Dart extension method for [ZetaSemantics], which uses Material UI components. +/// It provides a new [switchTheme] method that allows for customization of a [SwitchThemeData] according to the [ZetaSemantics]. /// The [SwitchThemeData] object returned by the [switchTheme] method has three customized properties: /// 1. mouseCursor: A [MouseCursor] determined by the Material State. /// 2. overlayColor: A [Color] determined by the Material State. /// 3. materialTapTargetSize: Defines the size of the tap target. -extension SwitchExtension on ZetaColorScheme { +extension SwitchExtension on ZetaSemantics { /// Generates a [SwitchThemeData] object with properties /// inherited from the parent [ThemeData]. /// @@ -33,7 +33,7 @@ extension SwitchExtension on ZetaColorScheme { /// Defines the overlay [Color] for the [Switch] when it's hovered. overlayColor: widgetStatePropertyResolver( - hoveredValue: zetaColors.black.withOpacity(0.1), + hoveredValue: Colors.black.withOpacity(0.1), ), /// The smallest detectable part of [Switch] that can lead to a tap event. diff --git a/lib/src/utils/theme/theme_builders/tab_bar_theme.dart b/lib/src/utils/theme/theme_builders/tab_bar_theme.dart index 1139215f..b3d11ce1 100644 --- a/lib/src/utils/theme/theme_builders/tab_bar_theme.dart +++ b/lib/src/utils/theme/theme_builders/tab_bar_theme.dart @@ -1,8 +1,8 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart' show ZetaSemantics; -/// This extension method for the [ZetaColorScheme] class provides a new [tabBarTheme] -/// method. It enables the customization of a [TabBarTheme] to match the [ZetaColorScheme]. +/// This extension method for the [ZetaSemantics] class provides a new [tabBarTheme] +/// method. It enables the customization of a [TabBarTheme] to match the [ZetaSemantics]. /// /// The [TabBarTheme] object returned has several properties: /// 1. indicatorColor: The color of the selected tab's underline. @@ -10,23 +10,23 @@ import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; /// 3. unselectedLabelColor: The color of the text within any unselected tabs. /// 4. labelStyle: The text styling applied to text within the selected tab. /// 5. unselectedLabelStyle: The text styling applied to text within any unselected tabs. -extension TabBarExtension on ZetaColorScheme { +extension TabBarExtension on ZetaSemantics { /// Generate a [TabBarTheme] object with visual properties for a [TabBar]. /// [TabBar]s display a horizontal row of tabs, one tab per [TabController]. /// /// [textTheme] is used to style the labels of the selected and unselected tabs. /// - /// Returns a [TabBarTheme] that matches the [ZetaColorScheme]. + /// Returns a [TabBarTheme] that matches the [ZetaSemantics]. TabBarTheme tabBarTheme(TextTheme textTheme) { return TabBarTheme( /// The color of the line that appears below the selected tab. - indicatorColor: zetaColors.secondary, + indicatorColor: colors.mainSecondary, /// The color to use for [Tab] labels when a [Tab] is selected. - labelColor: zetaColors.secondary, + labelColor: colors.mainSecondary, /// The color to use for [Tab] labels when the associated [Tab] is not selected. - unselectedLabelColor: zetaColors.textSubtle, + unselectedLabelColor: colors.mainSubtle, /// The [TextStyle] to apply to [Tab] labels when a [Tab] is selected. labelStyle: textTheme.bodySmall, diff --git a/lib/src/utils/theme/theme_builders/text_selection_theme.dart b/lib/src/utils/theme/theme_builders/text_selection_theme.dart index 7aa15cb3..bfa624c9 100644 --- a/lib/src/utils/theme/theme_builders/text_selection_theme.dart +++ b/lib/src/utils/theme/theme_builders/text_selection_theme.dart @@ -1,7 +1,7 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart'; -/// This extends the [ZetaColorScheme] class with a method [textSelectionTheme] +/// This extends the [ZetaSemantics] class with a method [textSelectionTheme] /// which allows you to generate a new [TextSelectionThemeData]. /// /// The [TextSelectionThemeData] object returned holds configurations for components @@ -9,23 +9,23 @@ import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; /// 1. cursorColor: Defines the color of the cursor in a text field. /// 2. selectionColor: Color of the text selection toolbar. /// 3. selectionHandleColor: Color of the text selection handle. -extension TextSelectionExtension on ZetaColorScheme { +extension TextSelectionExtension on ZetaSemantics { /// Defines a [TextSelectionThemeData] using ZetaColorScheme. /// /// A [TextSelectionThemeData] holds the color and style parameters which /// defines a material design text selection toolbar. /// - /// Returns a [TextSelectionThemeData] object matching the [ZetaColorScheme]. + /// Returns a [TextSelectionThemeData] object matching the [ZetaSemantics]. TextSelectionThemeData textSelectionTheme() { return TextSelectionThemeData( /// Defines the color of the cursor in a text field. - cursorColor: zetaColors.secondary, + cursorColor: colors.mainSecondary, /// Indicates the color of the text selection toolbar. - selectionColor: zetaColors.secondary.subtle.withOpacity(0.5), + selectionColor: colors.surfaceSecondarySubtle.withOpacity(0.5), /// Color of the text selection handle. - selectionHandleColor: zetaColors.secondary.selected, + selectionHandleColor: colors.stateSecondarySelected, ); } } diff --git a/lib/src/utils/theme/theme_builders/zeta_theme.dart b/lib/src/utils/theme/theme_builders/zeta_theme.dart index 3168ef8d..b1a7bd76 100644 --- a/lib/src/utils/theme/theme_builders/zeta_theme.dart +++ b/lib/src/utils/theme/theme_builders/zeta_theme.dart @@ -1,5 +1,5 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart' show ZetaColorScheme; +import 'package:zeta_flutter/zeta_flutter.dart'; import '../text.dart'; import 'app_bar_theme.dart'; @@ -25,7 +25,7 @@ import 'switch_theme.dart'; import 'tab_bar_theme.dart'; import 'text_selection_theme.dart'; -/// Enum to select the used AppBarTheme style in [ZetaColorScheme] based themes. +/// Enum to select the used AppBarTheme style in [ZetaSemantics] based themes. enum ZetaAppBarStyle { /// Use the scheme primary color as the AppBar's themed background color. /// @@ -40,54 +40,33 @@ enum ZetaAppBarStyle { /// Use scheme surface color as the AppBar's themed background color, /// including any blend (surface tint) color it may have. surface, - - /// Use scheme background color as the AppBar's themed background color, - /// including any blend (surface tint) color it may have. - @Deprecated('Use surface instead. ' 'This feature was deprecated after v3.18.0-0.1.pre.') - background, } /// Extension method on ZetaAppBarStyle to add appBar color functionality. extension AppBarColor on ZetaAppBarStyle { /// Returns effective appBar color depending upon the color scheme. /// - /// [colorScheme] is the color palette maintained by the app/theme - /// for standard color consistency across the app. - /// - /// [ZetaAppBarStyle] is the style variant for AppBar, which determines - /// the colour that should be derived from the [colorScheme]. - /// - /// Returns [Color], the final colour to be applied to the appBar. - Color effectiveAppBarColor(ZetaColorScheme colorScheme) { + /// Returns [Color], the final color to be applied to the appBar. + Color effectiveAppBarColor(ZetaColors colors) { switch (this) { case ZetaAppBarStyle.primary: // Applying primary color of color scheme - return colorScheme.primary; + return colors.mainPrimary; case ZetaAppBarStyle.secondary: // Applying secondary color of color scheme - return colorScheme.secondary; + return colors.mainSecondary; case ZetaAppBarStyle.surface: // Applying surface color of color scheme - return colorScheme.surface; - // This ignore is used because the `ZetaAppBarStyle.background` value is marked - // as deprecated within the same package. However, it is still in use in the - // codebase as part of the conversion process. Refactoring to remove the - // deprecated value requires replacing all instances of it, which will be done - // in a future update. This usage of the deprecated member is temporary until - // the transition is complete. - // ignore: deprecated_member_use_from_same_package - case ZetaAppBarStyle.background: - // Applying background color of color scheme - return colorScheme.surface; + return colors.surfaceDefault; } } } -/// A Dart extension on [ZetaColorScheme] +/// A Dart extension on [ZetaSemantics] /// /// Allows the client to easily interface with the more verbose ThemeData class of Flutter /// and generate a theme configuration based on the simpler ZetaColorScheme object. -extension ZetaThemeBuilder on ZetaColorScheme { +extension ZetaThemeBuilder on ZetaSemantics { /// Converts the ZetaColorScheme to a ThemeData object. /// /// Takes optional parameters [fontFamily] , a string representing @@ -103,55 +82,55 @@ extension ZetaThemeBuilder on ZetaColorScheme { }) { // A TextTheme object for the colors onPrimary. final primaryTextTheme = buildZdsTextTheme( - textColor: onPrimary, + textColor: colors.mainInverse, fontFamily: fontFamily, ); // A TextTheme object for the colors onSurface. final TextTheme textTheme = buildZdsTextTheme( - textColor: onSurface, + textColor: colors.mainDefault, fontFamily: fontFamily, ); // The actual appBar color defined by the appBarStyle, based on the color scheme. - final effectiveAppBarColor = appBarStyle.effectiveAppBarColor(this); + final effectiveAppBarColor = appBarStyle.effectiveAppBarColor(colors); // Returns a ThemeData that is constructed from the ZetaColorScheme. final barTheme = appBarTheme(primaryTextTheme, effectiveAppBarColor); return ThemeData( - colorScheme: this, + colorScheme: ZetaSemanticsAA(primitives: const ZetaPrimitivesLight()).colors.toColorScheme, appBarTheme: barTheme, useMaterial3: useMaterial3, bottomAppBarTheme: bottomAppBarTheme(), bottomNavigationBarTheme: bottomNavigationBarTheme(textTheme), bottomSheetTheme: bottomSheetTheme(), - brightness: brightness, - canvasColor: surface, + brightness: colors.primitives.brightness, + canvasColor: colors.surfaceDefault, cardTheme: cardTheme(), checkboxTheme: checkboxTheme(), chipTheme: chipThemeData(textTheme), datePickerTheme: datePickerTheme(barTheme), - dividerColor: zetaColors.borderSubtle, + dividerColor: colors.borderSubtle, dividerTheme: dividerTheme(), elevatedButtonTheme: elevatedButtonTheme(primaryTextTheme), fontFamily: fontFamily, - iconTheme: iconTheme(color: zetaColors.iconDefault), - indicatorColor: secondary, + iconTheme: iconTheme(color: colors.mainDefault), + indicatorColor: colors.mainSecondary, inputDecorationTheme: inputDecorationTheme(textTheme), listTileTheme: listTileTheme(textTheme), outlinedButtonTheme: outlinedButtonTheme(primaryTextTheme), popupMenuTheme: popupMenuTheme(textTheme), - primaryColor: primary, - primaryIconTheme: iconTheme(color: onPrimary), + primaryColor: colors.mainPrimary, + primaryIconTheme: iconTheme(color: colors.mainDefault), primaryTextTheme: primaryTextTheme, progressIndicatorTheme: progressIndicatorTheme(), radioTheme: radioThemeData(), - scaffoldBackgroundColor: zetaColors.surfaceTertiary, + scaffoldBackgroundColor: colors.surfaceDefault, searchBarTheme: searchBarTheme(textTheme), - shadowColor: zetaColors.borderDisabled.withOpacity(0.7), + shadowColor: colors.borderDisabled.withOpacity(0.7), sliderTheme: sliderTheme(), - splashColor: zetaColors.surfaceSelected, + splashColor: colors.surfaceSelected, switchTheme: switchTheme(), tabBarTheme: tabBarTheme(textTheme), textButtonTheme: textButtonTheme(primaryTextTheme), diff --git a/lib/src/utils/theme/theme_constants.dart b/lib/src/utils/theme/theme_constants.dart index 4716906c..2668eb4e 100644 --- a/lib/src/utils/theme/theme_constants.dart +++ b/lib/src/utils/theme/theme_constants.dart @@ -76,10 +76,6 @@ const double calendarDaysOfWeekHeight = 36; /// Width / height of circular buttons in [ZdsCheckableButton]. const double kZdsCheckableButtonSize = 48; -/// Width / height of circular buttons in [ZdsCheckableButton]. -@Deprecated('Use kZdsCheckableButtonSize instead') -const double checkableButtonSize = 48; - /// ListTile theme const ZdsListTileTheme kZdsListTileTheme = ZdsListTileTheme( contentPadding: EdgeInsets.only(left: 24, top: 18, bottom: 18, right: 24), diff --git a/lib/src/utils/theme/theme_data.dart b/lib/src/utils/theme/theme_data.dart index ea9bf0b8..b8b35f14 100644 --- a/lib/src/utils/theme/theme_data.dart +++ b/lib/src/utils/theme/theme_data.dart @@ -1,493 +1,495 @@ -import 'dart:convert'; - -import 'package:flutter/material.dart'; -import 'package:flutter/services.dart'; -import 'package:zeta_flutter/zeta_flutter.dart'; - -import '../theme.dart'; -import '../tools/utils.dart'; - -class _ZdsBaseColors { - _ZdsBaseColors({required this.primary, required this.secondary, required this.error}); - - factory _ZdsBaseColors.fromJson(Map? json) { - // Extracts primary, secondary, and error colors from JSON, with default fallbacks. - final primary = (json?['primary'] as String?)?.toColor() ?? ZetaColorBase.blue; - final secondary = (json?['secondary'] as String?)?.toColor() ?? ZetaColorBase.blue; - - var error = (json?['error'] as String?)?.toColor(); - if (error == null && isShadeOfRed(primary)) { - error = ZetaColorBase.warm; - } else { - error = ZetaColorBase.red; - } - - return _ZdsBaseColors(primary: primary, secondary: secondary, error: error); - } - - final Color primary; - final Color secondary; - final Color error; - - static bool isShadeOfRed(Color color) { - // Get the red, green, and blue components of the color - final red = color.red; - final green = color.green; - final blue = color.blue; - - // Check if the red component is dominant - return red > green && red > blue; - } - - Map toJson() { - return { - 'primary': primary.toHex(), - 'secondary': secondary.toHex(), - 'error': error.toHex(), - }; - } -} - -/// Class to allow custom color definitions in dark and light modes and used with new [ZetaProvider] -/// -/// This class holds the definitions for themes in both Dark and Light mode. -/// These definitions are later used by `ZetaProvider` class. -/// -/// See also: -/// * [ZetaProvider] -/// * [Zeta] -/// * [ZetaThemeData] -/// * [ZetaColorScheme] -/// * [ZetaAppBarStyle] -@immutable -class ZdsThemeData { - /// Creates a `ZdsThemeData`. - /// - /// The [themeData] and [themeMode] must not be null. - /// - /// The [themeData] parameter, which is required, defines the theme data to be used with [ZetaProvider]. - /// The [themeMode] parameter, which is required, defines the theme mode for the [Zeta], and defaults to [ThemeMode.system]. - /// The [darkAppBarStyle] parameter defines the AppBar style for the dark theme, used to select the colors used in AppBarTheme style from [ZetaColorScheme]. Defaults to [ZetaAppBarStyle.surface]. - /// The [lightAppBarStyle] parameter defines the AppBar style for the light theme, used to select the colors used in AppBarTheme style from [ZetaColorScheme]. Defaults to [ZetaAppBarStyle.primary]. - const ZdsThemeData._({ - required this.themeData, - required this.themeMode, - required this.darkAppBarStyle, - required this.lightAppBarStyle, - required this.contrast, - required this.adjustAccessibility, - required _ZdsBaseColors lightColors, - required _ZdsBaseColors darkColors, - }) : _lightColors = lightColors, - _darkColors = darkColors; - - /// Creates a default [ZdsThemeData] instance with predefined settings. - /// - /// This factory constructor initializes a [ZdsThemeData] object with a set of default values. It is useful for creating a standard theme data configuration that can be used across the app when specific customizations are not required. - /// - /// The default settings include: - /// - A primary and secondary color set to blue. - /// - An error color set to red. - /// - The theme mode set to the system's default. - /// - Default styles for both dark and light app bar styles. - /// - A default contrast level. - /// - Accessibility adjustments set to false. - /// - The same color settings applied for both light and dark themes. - factory ZdsThemeData.defaultData() { - // Initialize base colors with default primary, secondary, and error colors. - final baseColors = _ZdsBaseColors( - primary: ZetaColorBase.blue, // Default primary color set to blue. - secondary: ZetaColorBase.blue, // Default secondary color set to blue. - error: ZetaColorBase.red, // Default error color set to red. - ); - - // Return a new instance of ZdsThemeData with default settings. - return ZdsThemeData._( - themeData: ZetaThemeData(), - // Initialize with default ZetaThemeData. - themeMode: ThemeMode.system, - // Use system default theme mode. - darkAppBarStyle: ZetaAppBarStyle.surface, - // Default style for dark app bar. - lightAppBarStyle: ZetaAppBarStyle.primary, - // Default style for light app bar. - contrast: ZetaContrast.aa, - // Set default contrast level. - adjustAccessibility: false, - // Accessibility adjustments are turned off by default. - lightColors: baseColors, - // Apply the base colors to light theme. - darkColors: baseColors, // Apply the same base colors to dark theme. - ); - } - - /// Factory constructor for creating [ZdsThemeData] from a JSON map. - factory ZdsThemeData.fromJson(Map json) { - // Determines if accessibility adjustments are needed. - final adjustAccessibility = json['adjustAccessibility'] as bool? ?? false; - - // Determines the contrast level, defaulting to 'aa' if not specified as 'aaa'. - final contrast = _zetaContrast(json); - - // Determines theme mode - final themeMode = _themeMode(json); - - final light = json['light'] as Map?; - final dark = json['dark'] as Map?; - - final lightColors = _ZdsBaseColors.fromJson(light); - final darkColors = dark != null ? _ZdsBaseColors.fromJson(light) : lightColors; - - return ZdsThemeData._( - themeMode: themeMode, - contrast: contrast, - lightColors: lightColors, - darkColors: darkColors, - adjustAccessibility: adjustAccessibility, - lightAppBarStyle: _zetaAppBarStyle(light), - darkAppBarStyle: _zetaAppBarStyle(dark), - themeData: _zetaThemeDataFromJson( - json, - contrast, - adjustAccessibility, - lightColors, - darkColors, - ), - ); - } - - /// Creates a new instance of [ZdsThemeData] from a JSON format string. - /// - /// The [json] parameter is a JSON string that conforms to the structure of [ZdsThemeData]. - /// Example: - /// { - /// "identifier": "default", - /// "themeMode": "system", // Possible values "dark", "light", "system" - /// "contrast": "aa", // Possible values "aa", "aaa" - /// "fontFamily": "packages/zeta_flutter/IBMPlexSans", - /// "adjustAccessibility": true, - /// "light": { - /// "appBarStyle": "primary", // Possible values "surface", "background", "secondary", "primary" - /// "primary": "#0073e6", - /// "secondary": "#0073e6", - /// "error": "#D70015" - /// }, - /// "dark": { - /// "appBarStyle": "surface", // Possible values "surface", "background", "secondary", "primary" - /// "primary": "#0073e6", - /// "secondary": "#0073e6", - /// "error": "#D70015" - /// } - /// } - /// - /// - /// This string is parsed to a Map using the [_parseJson] helper method, and then - /// it's used to construct a new instance of [ZdsThemeData]. - /// - /// Returns a new [ZdsThemeData] object from JSON data. - factory ZdsThemeData.fromJsonString(String json) { - return ZdsThemeData.fromJson(_parseJson(json)); - } - - /// Asynchronously creates an instance of [ZdsThemeData] from the JSON file at the given [path]. - /// - /// [path] represents the location of the JSON file in your application assets. - /// - /// The JSON data is expected to be a serialized version of the [ZdsThemeData] object. - /// - /// Returns a Future that completes with the [ZdsThemeData] once it has been loaded and parsed. - static Future fromAssets(String path) async { - final json = await _readAsset(path); - return ZdsThemeData.fromJsonString(json); - } - - /// Theme data to be used with [ZetaProvider] - /// - /// This field hold the instance of [ZetaThemeData] which is used by `ZetaProvider` class. - final ZetaThemeData themeData; - - /// The theme mode for the [Zeta] - /// - /// It defaults to [ThemeMode.system] - /// This holds the mode of the theme which is by default set to [ThemeMode.system]. - final ThemeMode themeMode; - - /// AppBar style for the dark theme - /// - /// This holds the AppBar style for dark theme mode which is used to - /// select the colors from [ZetaColorScheme]. - final ZetaAppBarStyle darkAppBarStyle; - - /// AppBar style for the light theme - /// - /// This holds the AppBar style for light theme mode which is used to - /// select the colors from [ZetaColorScheme]. - final ZetaAppBarStyle lightAppBarStyle; - - /// Represents the Zeta accessibility standard. - /// {@macro zeta-color-dark} - final ZetaContrast contrast; - - /// Decides if accessibility adjustments should be applied to colors. - /// - /// Defaults to false - final bool adjustAccessibility; - - /// Base light colors, used internally to save and retrieve the colors from JSON - final _ZdsBaseColors _lightColors; - - /// Base dark colors, used internally to save and retrieve the colors from JSON - final _ZdsBaseColors _darkColors; - - /// Converts the [ZdsThemeData] instance to a JSON map. - Map toJson() { - return { - 'identifier': themeData.identifier, - 'themeMode': _themeModeToString(themeMode), - 'fontFamily': themeData.fontFamily, - 'adjustAccessibility': adjustAccessibility, - 'contrast': _contrastToString(contrast), - 'light': { - 'appBarStyle': _zetaAppBarStyleToString(lightAppBarStyle), - ..._lightColors.toJson(), - }, - 'dark': { - 'appBarStyle': _zetaAppBarStyleToString(darkAppBarStyle), - ..._darkColors.toJson(), - }, - }; - } - - static ZetaContrast _zetaContrast(Map json) { - final contrastString = json['contrast'] as String?; - final contrast = contrastString == 'aaa' ? ZetaContrast.aaa : ZetaContrast.aa; - return contrast; - } - - static ThemeMode _themeMode(Map json) { - final themModeString = json['themeMode'] as String?; - final themeMode = themModeString == 'light' - ? ThemeMode.light - : themModeString == 'dark' - ? ThemeMode.dark - : ThemeMode.system; - return themeMode; - } - - static ZetaAppBarStyle _zetaAppBarStyle(Map? json) { - final appBarStyleString = json?['appBarStyle'] as String?; - return appBarStyleString == 'surface' - ? ZetaAppBarStyle.surface - : appBarStyleString == 'background' - // This ignore is used because the `ZetaAppBarStyle.background`, - // `ZetaAppBarStyle.secondary`, and `ZetaAppBarStyle.primary` values are marked - // as deprecated within the same package. However, they are still in use in the - // codebase, and replacing them requires refactoring to a new style system. - // The deprecated usage is temporary, and a future update will remove it once - // the new styles are fully integrated and tested. - // ignore: deprecated_member_use_from_same_package - ? ZetaAppBarStyle.background - : appBarStyleString == 'secondary' - ? ZetaAppBarStyle.secondary - : ZetaAppBarStyle.primary; - } - - /// Parses the given JSON map into [ZetaThemeData]. - static ZetaThemeData _zetaThemeDataFromJson( - Map json, - ZetaContrast contrast, - bool adjustAccessibility, - _ZdsBaseColors lightColors, - _ZdsBaseColors darkColors, - ) { - // Constructs and returns a new instance of ZetaThemeData. - final light = _colors(lightColors, Brightness.light, contrast, adjustAccessibility); - final dark = _colors(darkColors, Brightness.dark, contrast, adjustAccessibility); - - return ZetaThemeData( - identifier: json['identifier'] as String? ?? 'default', - // Sets the identifier, defaulting to 'default'. - fontFamily: json['fontFamily'] as String? ?? kZetaFontFamily, - // Sets the font family, with a default value. - contrast: contrast, - // Sets the determined contrast. - colorsLight: light, - // Processes light theme colors. - colorsDark: dark, // Processes dark theme colors. - ); - } - - /// Creates a [ZetaColors] object from the given JSON, brightness, and contrast. - static ZetaColors _colors( - _ZdsBaseColors colors, - Brightness brightness, - ZetaContrast contrast, - bool adjustAccessibility, - ) { - // Helper function to create a color swatch based on the given base color. - ZetaColorSwatch swatch(Color base) => ZetaColorSwatch.fromColor(base).apply(brightness: brightness); - - // Returns either a dark or light themed [ZetaColors] object based on the brightness. - return brightness == Brightness.dark - ? ZetaColors.dark( - contrast: contrast, - primary: swatch(colors.primary), - secondary: swatch(colors.secondary), - error: swatch(colors.error), - ) - : ZetaColors.light( - contrast: contrast, - primary: swatch(colors.primary), - secondary: swatch(colors.secondary), - error: swatch(colors.error), - ); - } - - /// Helper function to convert [ThemeMode] to string representation. - static String _themeModeToString(ThemeMode themeMode) { - switch (themeMode) { - case ThemeMode.light: - return 'light'; - case ThemeMode.dark: - return 'dark'; - case ThemeMode.system: - return 'system'; - } - } - - /// Helper function to convert [ZetaAppBarStyle] to string representation. - static String _zetaAppBarStyleToString(ZetaAppBarStyle appBarStyle) { - switch (appBarStyle) { - case ZetaAppBarStyle.surface: - return 'surface'; - // This ignore is used because the `ZetaAppBarStyle.background` value is marked - // as deprecated within the same package. However, it is still in use in the - // codebase as part of the conversion process. Refactoring to remove the - // deprecated value requires replacing all instances of it, which will be done - // in a future update. This usage of the deprecated member is temporary until - // the transition is complete. - // ignore: deprecated_member_use_from_same_package - case ZetaAppBarStyle.background: - return 'background'; - case ZetaAppBarStyle.secondary: - return 'secondary'; - case ZetaAppBarStyle.primary: - return 'primary'; - } - } - - /// Converts [ZetaContrast] to string. - static String _contrastToString(ZetaContrast contrast) { - return contrast == ZetaContrast.aaa ? 'aaa' : 'aa'; - } - - /// Private helper function that reads a JSON file from the application assets. - /// - /// [path] is the location of the JSON file. - /// - /// Returns a Future that completes with a `Map` once the file has been loaded and decoded. - /// If an error occurs during loading or decoding, it catches the exception and returns an empty Map. - static Future _readAsset(String path) async { - try { - return await rootBundle.loadString(path); - } catch (e) { - return '{}'; - } - } - - /// Parses a JSON string and returns it as a Map. - /// - /// The [jsonString] argument is a JSON string that will be parsed into a `Map`. - /// - /// This method tries to decode the given JSON string. If an error occurs during decoding, - /// it catches the exception and returns an empty Map. - static Map _parseJson(String jsonString) { - try { - return jsonDecode(jsonString) as Map; - } catch (e) { - return {}; - } - } - - /// Creates a copy of this [ZdsThemeData] but with the given fields replaced with the new values. - /// - /// [themeData] (optional): The [ZetaThemeData] that is paired with [ZdsThemeData]. - /// This is the raw ThemeData instance that is used to construct the [ZdsThemeData] object. - /// - /// [themeMode] (optional): Specifies the mode of the theme - light, dark etc. If a themeMode - /// is not provided, it will default to the current [ZdsThemeData] theme mode. - /// - /// [darkAppBarStyle] (optional): Defines the style of the app bar in dark theme. If not provided, - /// it will use the existing style from this [ZdsThemeData] for the dark app bar style. - /// - /// [lightAppBarStyle] (optional): Same as [darkAppBarStyle], but for light theme. - /// - /// [contrast] (optional): Specifies the contrast level for the theme. If not provided, - /// it defaults to the current contrast level of this [ZdsThemeData] instance. - /// - /// [adjustAccessibility] (optional): Boolean value that controls whether to adjust the accessibility - /// options depending on the theme contrast. If not provided, it will preserve the original value - /// of [adjustAccessibility] from this [ZdsThemeData] instance. - /// - /// Returns a new [ZdsThemeData] instance. - ZdsThemeData copyWith({ - ZetaThemeData? themeData, - ThemeMode? themeMode, - ZetaAppBarStyle? darkAppBarStyle, - ZetaAppBarStyle? lightAppBarStyle, - ZetaContrast? contrast, - bool? adjustAccessibility, - }) { - var lightColors = _lightColors; - var darkColors = _darkColors; - - if (themeData != null) { - lightColors = _ZdsBaseColors( - primary: themeData.colorsLight.primary.shade60, - secondary: themeData.colorsLight.secondary.shade60, - error: themeData.colorsLight.error.shade60, - ); - - darkColors = _ZdsBaseColors( - primary: themeData.colorsLight.primary.shade50, - secondary: themeData.colorsLight.secondary.shade50, - error: themeData.colorsLight.error.shade50, - ); - } - - return ZdsThemeData._( - lightColors: lightColors, - darkColors: darkColors, - themeData: themeData ?? this.themeData, - themeMode: themeMode ?? this.themeMode, - darkAppBarStyle: darkAppBarStyle ?? this.darkAppBarStyle, - lightAppBarStyle: lightAppBarStyle ?? this.lightAppBarStyle, - contrast: contrast ?? this.contrast, - adjustAccessibility: adjustAccessibility ?? this.adjustAccessibility, - ); - } -} - -/// Returns a map of colors shades with their respective indexes. -class ZetaSwatchGenerator { - /// Darker shades are obtained by darkening the primary color and - /// lighter shades by lightening it. - /// - /// - 100, 90, 80, and 70 are darker shades of the primary color. - /// - 60 is the primary color itself. - /// - 50, 40, 30, 20, and 10 are progressively lighter shades of the primary color. - static ZetaColorSwatch generate( - Color primary, { - Brightness brightness = Brightness.light, - ZetaContrast contrast = ZetaContrast.aa, - Color background = Colors.white, - bool adjustAccessibility = false, - }) { - return ZetaColorSwatch( - contrast: contrast, - brightness: brightness, - primary: primary.value, - swatch: primary.generateSwatch(background: background, adjustPrimary: adjustAccessibility), - ).apply(brightness: brightness); - } -} +// import 'dart:convert'; + +// import 'package:flutter/material.dart'; +// import 'package:flutter/services.dart'; +// import 'package:zeta_flutter/zeta_flutter.dart'; + +// import '../theme.dart'; +// import '../tools/utils.dart'; + +// class _ZdsBaseColors { +// _ZdsBaseColors({required this.primary, required this.secondary, required this.error}); + +// factory _ZdsBaseColors.fromJson(Map? json) { +// // Extracts primary, secondary, and error colors from JSON, with default fallbacks. +// final primary = (json?['primary'] as String?)?.toColor() ?? const ZetaPrimitivesLight().blue; +// final secondary = (json?['secondary'] as String?)?.toColor() ?? const ZetaPrimitivesLight().blue; + +// var error = (json?['error'] as String?)?.toColor(); +// if (error == null && isShadeOfRed(primary)) { +// error = const ZetaPrimitivesLight().warm; +// } else { +// error = const ZetaPrimitivesLight().red; +// } + +// return _ZdsBaseColors(primary: primary, secondary: secondary, error: error); +// } + +// final Color primary; +// final Color secondary; +// final Color error; + +// static bool isShadeOfRed(Color color) { +// // Get the red, green, and blue components of the color +// final red = color.red; +// final green = color.green; +// final blue = color.blue; + +// // Check if the red component is dominant +// return red > green && red > blue; +// } + +// Map toJson() { +// return { +// 'primary': primary.toHex(), +// 'secondary': secondary.toHex(), +// 'error': error.toHex(), +// }; +// } +// } + +// /// Class to allow custom color definitions in dark and light modes and used with new [ZetaProvider] +// /// +// /// This class holds the definitions for themes in both Dark and Light mode. +// /// These definitions are later used by `ZetaProvider` class. +// /// +// /// See also: +// /// * [ZetaProvider] +// /// * [Zeta] +// /// * [ZetaColors] +// /// * [ZetaColorScheme] +// /// * [ZetaAppBarStyle] +// @immutable +// class ZdsThemeData { +// /// Creates a `ZdsThemeData`. +// /// +// /// The [themeData] and [themeMode] must not be null. +// /// +// /// The [themeData] parameter, which is required, defines the theme data to be used with [ZetaProvider]. +// /// The [themeMode] parameter, which is required, defines the theme mode for the [Zeta], and defaults to [ThemeMode.system]. +// /// The [darkAppBarStyle] parameter defines the AppBar style for the dark theme, used to select the colors used in AppBarTheme style from [ZetaColorScheme]. Defaults to [ZetaAppBarStyle.surface]. +// /// The [lightAppBarStyle] parameter defines the AppBar style for the light theme, used to select the colors used in AppBarTheme style from [ZetaColorScheme]. Defaults to [ZetaAppBarStyle.primary]. +// const ZdsThemeData._({ +// required this.themeData, +// required this.themeMode, +// required this.darkAppBarStyle, +// required this.lightAppBarStyle, +// required this.contrast, +// required this.adjustAccessibility, +// required _ZdsBaseColors lightColors, +// required _ZdsBaseColors darkColors, +// }) : _lightColors = lightColors, +// _darkColors = darkColors; + +// /// Creates a default [ZdsThemeData] instance with predefined settings. +// /// +// /// This factory constructor initializes a [ZdsThemeData] object with a set of default values. It is useful for creating a standard theme data configuration that can be used across the app when specific customizations are not required. +// /// +// /// The default settings include: +// /// - A primary and secondary color set to blue. +// /// - An error color set to red. +// /// - The theme mode set to the system's default. +// /// - Default styles for both dark and light app bar styles. +// /// - A default contrast level. +// /// - Accessibility adjustments set to false. +// /// - The same color settings applied for both light and dark themes. +// factory ZdsThemeData.defaultData() { +// // Initialize base colors with default primary, secondary, and error colors. +// final baseColors = _ZdsBaseColors( +// primary: const ZetaPrimitivesLight().blue, // Default primary color set to blue. +// secondary: const ZetaPrimitivesLight().blue, // Default secondary color set to blue. +// error: const ZetaPrimitivesLight().red, // Default error color set to red. +// ); + +// // Return a new instance of ZdsThemeData with default settings. +// return ZdsThemeData._( +// themeData: ThemeData(), +// // themeData: generateZetaTheme(brightness: Brightness.light, colorScheme: , textTheme: textTheme), +// // themeData: ZetaThemeData(), +// // Initialize with default ZetaThemeData. +// themeMode: ThemeMode.system, +// // Use system default theme mode. +// darkAppBarStyle: ZetaAppBarStyle.surface, +// // Default style for dark app bar. +// lightAppBarStyle: ZetaAppBarStyle.primary, +// // Default style for light app bar. +// contrast: ZetaContrast.aa, +// // Set default contrast level. +// adjustAccessibility: false, +// // Accessibility adjustments are turned off by default. +// lightColors: baseColors, +// // Apply the base colors to light theme. +// darkColors: baseColors, // Apply the same base colors to dark theme. +// ); +// } + +// /// Factory constructor for creating [ZdsThemeData] from a JSON map. +// factory ZdsThemeData.fromJson(Map json) { +// // Determines if accessibility adjustments are needed. +// final adjustAccessibility = json['adjustAccessibility'] as bool? ?? false; + +// // Determines the contrast level, defaulting to 'aa' if not specified as 'aaa'. +// final contrast = _zetaContrast(json); + +// // Determines theme mode +// final themeMode = _themeMode(json); + +// final light = json['light'] as Map?; +// final dark = json['dark'] as Map?; + +// final lightColors = _ZdsBaseColors.fromJson(light); +// final darkColors = dark != null ? _ZdsBaseColors.fromJson(light) : lightColors; + +// return ZdsThemeData._( +// themeMode: themeMode, +// contrast: contrast, +// lightColors: lightColors, +// darkColors: darkColors, +// adjustAccessibility: adjustAccessibility, +// lightAppBarStyle: _zetaAppBarStyle(light), +// darkAppBarStyle: _zetaAppBarStyle(dark), +// themeData: _zetaThemeDataFromJson( +// json, +// contrast, +// adjustAccessibility, +// lightColors, +// darkColors, +// ), +// ); +// } + +// /// Creates a new instance of [ZdsThemeData] from a JSON format string. +// /// +// /// The [json] parameter is a JSON string that conforms to the structure of [ZdsThemeData]. +// /// Example: +// /// { +// /// "identifier": "default", +// /// "themeMode": "system", // Possible values "dark", "light", "system" +// /// "contrast": "aa", // Possible values "aa", "aaa" +// /// "fontFamily": "packages/zeta_flutter/IBMPlexSans", +// /// "adjustAccessibility": true, +// /// "light": { +// /// "appBarStyle": "primary", // Possible values "surface", "background", "secondary", "primary" +// /// "primary": "#0073e6", +// /// "secondary": "#0073e6", +// /// "error": "#D70015" +// /// }, +// /// "dark": { +// /// "appBarStyle": "surface", // Possible values "surface", "background", "secondary", "primary" +// /// "primary": "#0073e6", +// /// "secondary": "#0073e6", +// /// "error": "#D70015" +// /// } +// /// } +// /// +// /// +// /// This string is parsed to a Map using the [_parseJson] helper method, and then +// /// it's used to construct a new instance of [ZdsThemeData]. +// /// +// /// Returns a new [ZdsThemeData] object from JSON data. +// factory ZdsThemeData.fromJsonString(String json) { +// return ZdsThemeData.fromJson(_parseJson(json)); +// } + +// /// Asynchronously creates an instance of [ZdsThemeData] from the JSON file at the given [path]. +// /// +// /// [path] represents the location of the JSON file in your application assets. +// /// +// /// The JSON data is expected to be a serialized version of the [ZdsThemeData] object. +// /// +// /// Returns a Future that completes with the [ZdsThemeData] once it has been loaded and parsed. +// static Future fromAssets(String path) async { +// final json = await _readAsset(path); +// return ZdsThemeData.fromJsonString(json); +// } + +// /// Theme data to be used with [ZetaProvider] +// /// +// /// This field hold the instance of [ZetaThemeServiceData] which is used by `ZetaProvider` class. +// final ZetaThemeServiceData themeData; + +// /// The theme mode for the [Zeta] +// /// +// /// It defaults to [ThemeMode.system] +// /// This holds the mode of the theme which is by default set to [ThemeMode.system]. +// final ThemeMode themeMode; + +// /// AppBar style for the dark theme +// /// +// /// This holds the AppBar style for dark theme mode which is used to +// /// select the colors from [ZetaColors]. +// final ZetaAppBarStyle darkAppBarStyle; + +// /// AppBar style for the light theme +// /// +// /// This holds the AppBar style for light theme mode which is used to +// /// select the colors from [ZetaColors]. +// final ZetaAppBarStyle lightAppBarStyle; + +// /// Represents the Zeta accessibility standard. +// /// {@macro zeta-color-dark} +// final ZetaContrast contrast; + +// /// Decides if accessibility adjustments should be applied to colors. +// /// +// /// Defaults to false +// final bool adjustAccessibility; + +// /// Base light colors, used internally to save and retrieve the colors from JSON +// final _ZdsBaseColors _lightColors; + +// /// Base dark colors, used internally to save and retrieve the colors from JSON +// final _ZdsBaseColors _darkColors; + +// /// Converts the [ZdsThemeData] instance to a JSON map. +// Map toJson() { +// return { +// // 'identifier': themeData.identifier, +// 'themeMode': _themeModeToString(themeMode), +// 'fontFamily': themeData.fontFamily, +// 'adjustAccessibility': adjustAccessibility, +// 'contrast': _contrastToString(contrast), +// 'light': { +// 'appBarStyle': _zetaAppBarStyleToString(lightAppBarStyle), +// ..._lightColors.toJson(), +// }, +// 'dark': { +// 'appBarStyle': _zetaAppBarStyleToString(darkAppBarStyle), +// ..._darkColors.toJson(), +// }, +// }; +// } + +// static ZetaContrast _zetaContrast(Map json) { +// final contrastString = json['contrast'] as String?; +// final contrast = contrastString == 'aaa' ? ZetaContrast.aaa : ZetaContrast.aa; +// return contrast; +// } + +// static ThemeMode _themeMode(Map json) { +// final themModeString = json['themeMode'] as String?; +// final themeMode = themModeString == 'light' +// ? ThemeMode.light +// : themModeString == 'dark' +// ? ThemeMode.dark +// : ThemeMode.system; +// return themeMode; +// } + +// static ZetaAppBarStyle _zetaAppBarStyle(Map? json) { +// final appBarStyleString = json?['appBarStyle'] as String?; +// return appBarStyleString == 'surface' +// ? ZetaAppBarStyle.surface +// : appBarStyleString == 'background' +// // This ignore is used because the `ZetaAppBarStyle.background`, +// // `ZetaAppBarStyle.mainSecondary`, and `ZetaAppBarStyle.primary` values are marked +// // as deprecated within the same package. However, they are still in use in the +// // codebase, and replacing them requires refactoring to a new style system. +// // The deprecated usage is temporary, and a future update will remove it once +// // the new styles are fully integrated and tested. +// // ignore: deprecated_member_use_from_same_package +// ? ZetaAppBarStyle.background +// : appBarStyleString == 'secondary' +// ? ZetaAppBarStyle.mainSecondary +// : ZetaAppBarStyle.primary; +// } + +// /// Parses the given JSON map into [ZetaThemeData]. +// static ZetaThemeData _zetaThemeDataFromJson( +// Map json, +// ZetaContrast contrast, +// bool adjustAccessibility, +// _ZdsBaseColors lightColors, +// _ZdsBaseColors darkColors, +// ) { +// // Constructs and returns a new instance of ZetaThemeData. +// final light = _colors(lightColors, Brightness.light, contrast, adjustAccessibility); +// final dark = _colors(darkColors, Brightness.dark, contrast, adjustAccessibility); + +// return ZetaThemeData( +// identifier: json['identifier'] as String? ?? 'default', +// // Sets the identifier, defaulting to 'default'. +// fontFamily: json['fontFamily'] as String? ?? kZetaFontFamily, +// // Sets the font family, with a default value. +// contrast: contrast, +// // Sets the determined contrast. +// colorsLight: light, +// // Processes light theme colors. +// colorsDark: dark, // Processes dark theme colors. +// ); +// } + +// /// Creates a [ZetaColors] object from the given JSON, brightness, and contrast. +// static ZetaColors _colors( +// _ZdsBaseColors colors, +// Brightness brightness, +// ZetaContrast contrast, +// bool adjustAccessibility, +// ) { +// // Helper function to create a color swatch based on the given base color. +// ZetaColorSwatch swatch(Color base) => ZetaColorSwatch.fromColor(base).apply(brightness: brightness); + +// // Returns either a dark or light themed [ZetaColors] object based on the brightness. +// return brightness == Brightness.dark +// ? ZetaColors.dark( +// contrast: contrast, +// primary: swatch(colors.primary), +// secondary: swatch(colors.mainSecondary), +// error: swatch(colors.error), +// ) +// : ZetaColors.light( +// contrast: contrast, +// primary: swatch(colors.primary), +// secondary: swatch(colors.mainSecondary), +// error: swatch(colors.error), +// ); +// } + +// /// Helper function to convert [ThemeMode] to string representation. +// static String _themeModeToString(ThemeMode themeMode) { +// switch (themeMode) { +// case ThemeMode.light: +// return 'light'; +// case ThemeMode.dark: +// return 'dark'; +// case ThemeMode.system: +// return 'system'; +// } +// } + +// /// Helper function to convert [ZetaAppBarStyle] to string representation. +// static String _zetaAppBarStyleToString(ZetaAppBarStyle appBarStyle) { +// switch (appBarStyle) { +// case ZetaAppBarStyle.surface: +// return 'surface'; +// // This ignore is used because the `ZetaAppBarStyle.background` value is marked +// // as deprecated within the same package. However, it is still in use in the +// // codebase as part of the conversion process. Refactoring to remove the +// // deprecated value requires replacing all instances of it, which will be done +// // in a future update. This usage of the deprecated member is temporary until +// // the transition is complete. +// // ignore: deprecated_member_use_from_same_package +// case ZetaAppBarStyle.background: +// return 'background'; +// case ZetaAppBarStyle.mainSecondary: +// return 'secondary'; +// case ZetaAppBarStyle.primary: +// return 'primary'; +// } +// } + +// /// Converts [ZetaContrast] to string. +// static String _contrastToString(ZetaContrast contrast) { +// return contrast == ZetaContrast.aaa ? 'aaa' : 'aa'; +// } + +// /// Private helper function that reads a JSON file from the application assets. +// /// +// /// [path] is the location of the JSON file. +// /// +// /// Returns a Future that completes with a `Map` once the file has been loaded and decoded. +// /// If an error occurs during loading or decoding, it catches the exception and returns an empty Map. +// static Future _readAsset(String path) async { +// try { +// return await rootBundle.loadString(path); +// } catch (e) { +// return '{}'; +// } +// } + +// /// Parses a JSON string and returns it as a Map. +// /// +// /// The [jsonString] argument is a JSON string that will be parsed into a `Map`. +// /// +// /// This method tries to decode the given JSON string. If an error occurs during decoding, +// /// it catches the exception and returns an empty Map. +// static Map _parseJson(String jsonString) { +// try { +// return jsonDecode(jsonString) as Map; +// } catch (e) { +// return {}; +// } +// } + +// /// Creates a copy of this [ZdsThemeData] but with the given fields replaced with the new values. +// /// +// /// [themeData] (optional): The [ZetaThemeData] that is paired with [ZdsThemeData]. +// /// This is the raw ThemeData instance that is used to construct the [ZdsThemeData] object. +// /// +// /// [themeMode] (optional): Specifies the mode of the theme - light, dark etc. If a themeMode +// /// is not provided, it will default to the current [ZdsThemeData] theme mode. +// /// +// /// [darkAppBarStyle] (optional): Defines the style of the app bar in dark theme. If not provided, +// /// it will use the existing style from this [ZdsThemeData] for the dark app bar style. +// /// +// /// [lightAppBarStyle] (optional): Same as [darkAppBarStyle], but for light theme. +// /// +// /// [contrast] (optional): Specifies the contrast level for the theme. If not provided, +// /// it defaults to the current contrast level of this [ZdsThemeData] instance. +// /// +// /// [adjustAccessibility] (optional): Boolean value that controls whether to adjust the accessibility +// /// options depending on the theme contrast. If not provided, it will preserve the original value +// /// of [adjustAccessibility] from this [ZdsThemeData] instance. +// /// +// /// Returns a new [ZdsThemeData] instance. +// ZdsThemeData copyWith({ +// ZetaThemeData? themeData, +// ThemeMode? themeMode, +// ZetaAppBarStyle? darkAppBarStyle, +// ZetaAppBarStyle? lightAppBarStyle, +// ZetaContrast? contrast, +// bool? adjustAccessibility, +// }) { +// var lightColors = _lightColors; +// var darkColors = _darkColors; + +// if (themeData != null) { +// lightColors = _ZdsBaseColors( +// primary: themeData.colorsLight.primary.shade60, +// secondary: themeData.colorsLight.mainSecondary.shade60, +// error: themeData.colorsLight.error.shade60, +// ); + +// darkColors = _ZdsBaseColors( +// primary: themeData.colorsLight.primary.shade50, +// secondary: themeData.colorsLight.mainSecondary.shade50, +// error: themeData.colorsLight.error.shade50, +// ); +// } + +// return ZdsThemeData._( +// lightColors: lightColors, +// darkColors: darkColors, +// themeData: themeData ?? this.themeData, +// themeMode: themeMode ?? this.themeMode, +// darkAppBarStyle: darkAppBarStyle ?? this.darkAppBarStyle, +// lightAppBarStyle: lightAppBarStyle ?? this.lightAppBarStyle, +// contrast: contrast ?? this.contrast, +// adjustAccessibility: adjustAccessibility ?? this.adjustAccessibility, +// ); +// } +// } + +// /// Returns a map of colors shades with their respective indexes. +// class ZetaSwatchGenerator { +// /// Darker shades are obtained by darkening the primary color and +// /// lighter shades by lightening it. +// /// +// /// - 100, 90, 80, and 70 are darker shades of the primary color. +// /// - 60 is the primary color itself. +// /// - 50, 40, 30, 20, and 10 are progressively lighter shades of the primary color. +// static ZetaColorSwatch generate( +// Color primary, { +// Brightness brightness = Brightness.light, +// ZetaContrast contrast = ZetaContrast.aa, +// Color background = Colors.white, +// bool adjustAccessibility = false, +// }) { +// return ZetaColorSwatch( +// contrast: contrast, +// brightness: brightness, +// primary: primary.value, +// swatch: primary.generateSwatch(background: background, adjustPrimary: adjustAccessibility), +// ).apply(brightness: brightness); +// } +// } diff --git a/lib/src/utils/theme/theme_service.dart b/lib/src/utils/theme/theme_service.dart index 6183510b..11e13ef7 100644 --- a/lib/src/utils/theme/theme_service.dart +++ b/lib/src/utils/theme/theme_service.dart @@ -1,88 +1,72 @@ -import 'dart:convert'; +// import 'dart:convert'; +// import 'package:shared_preferences/shared_preferences.dart'; +// import 'package:zeta_flutter/zeta_flutter.dart'; -import 'package:flutter/material.dart'; -import 'package:shared_preferences/shared_preferences.dart'; -import 'package:zeta_flutter/zeta_flutter.dart'; +// import '../theme.dart'; -import '../theme.dart'; +// /// A class representing theme service which extends `ZetaThemeService` class. +// /// This class assists in loading and saving theme data. +// /// See also: +// /// * [ZetaProvider] +// /// * [ZdsThemeData] +// class ZdsThemeService extends ZetaThemeService { +// /// Creates an instance of `ZdsThemeService`. +// /// +// /// Throws an [ArgumentError] if [assetPath] or [preferences] is null. +// /// +// /// The optional [assetPath] parameter defines the path to theme assets. +// /// - This asset path should point to a valid json file. +// /// - The JSON string should conform to the structure of [ZdsThemeData]. +// ZdsThemeService({required this.preferences, this.assetPath}); -/// A class representing theme service which extends `ZetaThemeService` class. -/// This class assists in loading and saving theme data. -/// See also: -/// * [ZetaProvider] -/// * [ZdsThemeData] -class ZdsThemeService extends ZetaThemeService { - /// Creates an instance of `ZdsThemeService`. - /// - /// Throws an [ArgumentError] if [assetPath] or [preferences] is null. - /// - /// The optional [assetPath] parameter defines the path to theme assets. - /// - This asset path should point to a valid json file. - /// - The JSON string should conform to the structure of [ZdsThemeData]. - /// Example: - /// { - /// "identifier": "default", - /// "themeMode": "system", // Possible values "dark", "light", "system" - /// "contrast": "aa", // Possible values "aa", "aaa" - /// "fontFamily": "packages/zeta_flutter/IBMPlexSans", - /// "adjustAccessibility": true, - /// "light": { - /// "appBarStyle": "primary", // Possible values "surface", "background", "secondary", "primary" - /// "primary": "#0073e6", - /// "secondary": "#0073e6", - /// "error": "#D70015" - /// }, - /// "dark": { - /// "appBarStyle": "surface", // Possible values "surface", "background", "secondary", "primary" - /// "primary": "#0073e6", - /// "secondary": "#0073e6", - /// "error": "#D70015" - /// } - /// The [preferences] parameter manages local storage for user settings. - ZdsThemeService({required this.preferences, this.assetPath}); +// /// The path to load theme assets from. +// final String? assetPath; - /// The path to load theme assets from. - final String? assetPath; +// /// An instance of `SharedPreferences` class to manage local user preferences. +// final SharedPreferences preferences; - /// An instance of `SharedPreferences` class to manage local user preferences. - final SharedPreferences preferences; +// /// Loads theme data from local storage or assets. +// /// +// /// Returns an instance of `ZdsThemeData` either from a saved JSON string in preferences or from assets. +// Future load() async { +// final json = preferences.getString('zds.theme.preferences.json'); +// if (json != null) { +// return ZdsThemeData.fromJsonString(json); +// } else if (assetPath != null) { +// return ZdsThemeData.fromAssets(assetPath!); +// } else { +// return ZdsThemeData.defaultData(); +// } +// } - /// Loads theme data from local storage or assets. - /// - /// Returns an instance of `ZdsThemeData` either from a saved JSON string in preferences or from assets. - Future load() async { - final json = preferences.getString('zds.theme.preferences.json'); - if (json != null) { - return ZdsThemeData.fromJsonString(json); - } else if (assetPath != null) { - return ZdsThemeData.fromAssets(assetPath!); - } else { - return ZdsThemeData.defaultData(); - } - } +// /// An overridden method to load theme, theme mode, and contrast. +// /// +// /// Returns a `ZetaThemeServiceData` object containing theme data, mode, and contrast. +// @override +// Future loadTheme() async { +// final data = await load(); +// return ZetaThemeServiceData( +// themeId: data.identifier, +// themeMode: data.themeMode, +// contrast: data.contrast, +// fontFamily: data.fontFamily, +// ); +// } - /// An overridden method to load theme, theme mode, and contrast. - /// - /// Returns a tuple containing `ZetaThemeData`, `ThemeMode`, and `ZetaContrast`. - @override - Future<(ZetaThemeData?, ThemeMode?, ZetaContrast?)> loadTheme() async { - final data = await load(); - return (data.themeData, data.themeMode, data.contrast); - } - - /// An overridden method to save the theme, theme mode, and contrast. - /// - /// Save the setting as a JSON string to local storage (`SharedPreferences`). - /// - /// Called from [ZetaProvider] when any theme attribute is changed - @override - Future saveTheme({ - required ZetaThemeData themeData, - required ThemeMode themeMode, - required ZetaContrast contrast, - }) async { - final data = await load(); - final newData = data.copyWith(themeData: themeData, themeMode: themeMode, contrast: contrast); - await preferences.setString('zds.theme.preferences.json', jsonEncode(newData.toJson())); - } -} +// /// An overridden method to save the theme, theme mode, and contrast. +// /// +// /// Save the setting as a JSON string to local storage (`SharedPreferences`). +// /// +// /// Called from [ZetaProvider] when any theme attribute is changed. +// @override +// Future saveTheme({required ZetaThemeServiceData themeData}) async { +// final data = await load(); +// final newData = data.copyWith( +// identifier: themeData.themeId, +// themeMode: themeData.themeMode, +// contrast: themeData.contrast, +// fontFamily: themeData.fontFamily, +// ); +// await preferences.setString('zds.theme.preferences.json', jsonEncode(newData.toJson())); +// } +// } diff --git a/lib/src/utils/tools/modifiers.dart b/lib/src/utils/tools/modifiers.dart index 7cb93474..a1494226 100644 --- a/lib/src/utils/tools/modifiers.dart +++ b/lib/src/utils/tools/modifiers.dart @@ -443,27 +443,6 @@ extension RowLayout on Row { } } -/// A selection of modifiers on TextTheme. -extension TextThemeExtension on TextTheme { - /// TextStyle for tab item 1 - @Deprecated('Use bodyTextLarge, or bodyTextMedium if tab has icons.') - TextStyle get tabItem1 { - return bodyLarge!.copyWith(letterSpacing: 0.2); - } - - /// TextStyle tabitem2 - @Deprecated('Use bodyTextLarge, or bodyTextMedium if tab has icons.') - TextStyle get tabItem2 { - return bodyMedium!; - } - - /// TextStyle bodyText3 - @Deprecated('Use bodyTextSmall') - TextStyle get bodyText3 { - return titleLarge!.copyWith(fontWeight: FontWeight.w400); - } -} - /// Applies Semanctics to [Widget] extension SemanticsModifier on Widget { /// Include Semantics with label this widget. diff --git a/lib/src/utils/tools/nested_flow.dart b/lib/src/utils/tools/nested_flow.dart index 6fadb69e..451a9f8f 100644 --- a/lib/src/utils/tools/nested_flow.dart +++ b/lib/src/utils/tools/nested_flow.dart @@ -30,25 +30,13 @@ class ZdsNestedFlow extends StatefulWidget { const ZdsNestedFlow({ super.key, this.onGenerateRoute, - @Deprecated('Use of shouldClose is redundant') this.shouldClose = true, - @Deprecated('Use child or builder property instead') this.rootPage, this.child, this.builder, }) : assert( - (child != null ? 1 : 0) + (builder != null ? 1 : 0) + (rootPage != null ? 1 : 0) == 1, - 'Exactly one of child, builder, or rootPage must be provided', + (child != null ? 1 : 0) + (builder != null ? 1 : 0) == 1, + 'Exactly one of child, or builder must be provided', ); - /// Root page for the navigator. - @Deprecated('Use child or builder property instead') - final Page? rootPage; - - /// Should page be closed when just root page remains on the stack, useful when added as root widget in TabBar. - /// - /// Defaults to true. - @Deprecated('Use of shouldClose is redundant') - final bool shouldClose; - /// Child widget for the navigator root page. final Widget? child; @@ -74,8 +62,6 @@ class ZdsNestedFlow extends StatefulWidget { void debugFillProperties(DiagnosticPropertiesBuilder properties) { super.debugFillProperties(properties); properties - ..add(DiagnosticsProperty>('rootPage', rootPage)) - ..add(DiagnosticsProperty('shouldClose', shouldClose)) ..add(DiagnosticsProperty('child', child)) ..add(ObjectFlagProperty.has('builder', builder)) ..add(ObjectFlagProperty.has('onGenerateRoute', onGenerateRoute)); @@ -111,9 +97,7 @@ class ZdsNestedFlowState extends State implements NavigatorObserv onGenerateRoute: widget.onGenerateRoute, onGenerateInitialRoutes: (navigator, initialRoute) { return [ - if (widget.rootPage != null) - widget.rootPage!.createRoute(context) - else if (widget.builder != null) + if (widget.builder != null) ZdsFadePageRouteBuilder( builder: (BuildContext context) { return PopScope( @@ -173,4 +157,9 @@ class ZdsNestedFlowState extends State implements NavigatorObserv Navigator.of(context).pop(await route.popped); } } + + @override + void didChangeTop(Route topRoute, Route? previousTopRoute) { + // TODO: implement didChangeTop + } } diff --git a/lib/src/utils/tools/tab_navigator.dart b/lib/src/utils/tools/tab_navigator.dart index 39d76aee..f7215c33 100644 --- a/lib/src/utils/tools/tab_navigator.dart +++ b/lib/src/utils/tools/tab_navigator.dart @@ -356,6 +356,11 @@ class ZdsSplitNavigatorState extends State with FrameCallback ..add(DiagnosticsProperty>('navigatorKey', navigatorKey)) ..add(DiagnosticsProperty>('currentRoute', currentRoute)); } + + @override + void didChangeTop(Route topRoute, Route? previousTopRoute) { + // TODO: implement didChangeTop + } } class _SplitContent extends StatelessWidget { diff --git a/lib/src/utils/tools/utils.dart b/lib/src/utils/tools/utils.dart index 5e1960a4..5469bab7 100644 --- a/lib/src/utils/tools/utils.dart +++ b/lib/src/utils/tools/utils.dart @@ -417,13 +417,13 @@ Color getRandomColorFromTheme(Object? seed, {List? colors}) { if (colors == null || colors.isEmpty) { setColors = [ - ZetaColorBase.red, - ZetaColorBase.orange, - ZetaColorBase.yellow, - ZetaColorBase.green, - ZetaColorBase.blue, - ZetaColorBase.teal, - ZetaColorBase.pink, + const ZetaPrimitivesLight().red, + const ZetaPrimitivesLight().orange, + const ZetaPrimitivesLight().yellow, + const ZetaPrimitivesLight().green, + const ZetaPrimitivesLight().blue, + const ZetaPrimitivesLight().teal, + const ZetaPrimitivesLight().pink, ]; } else { setColors = colors; diff --git a/pubspec.yaml b/pubspec.yaml index 2233746e..014dea8d 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -18,74 +18,77 @@ environment: flutter: ">=3.16.0" dependencies: - any_link_preview: ^3.0.2 + any_link_preview: ^3.0.3 cached_network_image: ^3.4.1 - camerawesome: 2.1.0 # TODO: Update this once repo is on 3.27.x - chewie: ^1.8.5 - collection: ^1.18.0 - crop_image: ^1.0.15 + camerawesome: ^2.3.0 + chewie: ^1.11.3 + collection: ^1.19.1 + crop_image: ^1.0.16 cross_file: ^0.3.4+2 - csslib: ^0.17.3 + csslib: ^1.0.2 dart_emoji: ^0.2.0+2 dropdown_button2: ^2.3.9 expand_tap_area: ^1.1.1 - extended_image: ^8.3.1 - file_picker: ^8.1.4 + file_picker: ^10.1.3 flutter: sdk: flutter flutter_colorpicker: ^1.1.0 - flutter_html: ^3.0.0-beta.2 - flutter_html_audio: ^3.0.0-beta.2 - flutter_html_svg: ^3.0.0-beta.2 - flutter_html_table: ^3.0.0-beta.2 - flutter_html_video: ^3.0.0-beta.2 - flutter_image_compress: ^2.3.0 + flutter_html: ^3.0.0 + flutter_html_audio: ^3.0.0 + flutter_html_svg: ^3.0.0 + flutter_html_table: ^3.0.0 + flutter_html_video: ^3.0.0 + flutter_image_compress: ^2.4.0 flutter_inappwebview: ^6.1.5 - flutter_layout_grid: ^2.0.7 + flutter_layout_grid: ^2.0.8 flutter_localizations: sdk: flutter flutter_quill: ^10.8.2 flutter_quill_extensions: ^10.8.2 - flutter_slidable: ^3.1.1 - flutter_svg: ^2.0.10+1 + flutter_slidable: ^4.0.0 + flutter_svg: ^2.1.0 flutter_swipe_action_cell: ^3.1.5 giphy_get: ^3.5.6 - html: ^0.15.4 + html: ^0.15.6 http_client_helper: ^3.0.0 image_editor_plus: ^1.0.6 image_picker: ^1.1.2 interval_time_picker: ^3.0.3+9 - intl: ^0.19.0 - just_audio: ^0.9.38 + intl: ^0.20.2 + just_audio: ^0.10.2 linked_scroll_controller: ^0.2.0 mime: ^2.0.0 - modal_bottom_sheet: ^3.0.0-pre + modal_bottom_sheet: ^3.0.0 open_file: ^3.5.10 painter: ^2.0.0 - path: ^1.9.0 - path_provider: ^2.1.3 - popover: ^0.3.0+1 - record: ^5.1.1 + path: ^1.9.1 + path_provider: ^2.1.5 + popover: ^0.3.1 + record: ^6.0.0 screenshot: ^3.0.0 - share_plus: ^10.0.3 - shared_preferences: ^2.2.3 + share_plus: ^11.0.0 + shared_preferences: ^2.5.3 shimmer: ^3.0.0 - table_calendar: ^3.1.2 + table_calendar: ^3.2.0 text_editor: ^0.7.0 universal_platform: ^1.1.0 - url_launcher: ^6.3.0 + url_launcher: ^6.3.1 validators: ^3.0.0 - video_compress: ^3.1.3 - video_player: ^2.8.6 + video_compress: ^3.1.4 + video_player: ^2.9.5 vsc_quill_delta_to_html: ^1.0.5 - zeta_flutter: ^0.20.2 + zeta_flutter: ^1.1.0 dev_dependencies: flutter_test: sdk: flutter - lottie: ^3.1.2 + lottie: ^3.3.1 zds_analysis: ^1.1.1 +dependency_overrides: + extended_image: ^10.0.1 + intl: ^0.20.2 + flutter: uses-material-design: true assets: diff --git a/test/fixtures/test_app.dart b/test/fixtures/test_app.dart index ef722491..7dc5a659 100644 --- a/test/fixtures/test_app.dart +++ b/test/fixtures/test_app.dart @@ -16,7 +16,7 @@ class TestApp extends StatelessWidget { ComponentDelegate(testing: true), ], home: ZetaProvider( - builder: (context, themeData, themeMode) { + builder: (context, themeData, darkTheme, themeMode) { return Scaffold(body: builder.call(context)); }, ), From 78ddb774d8e22c1fd465ff7521beedb391396c78 Mon Sep 17 00:00:00 2001 From: thelukewalton Date: Fri, 9 May 2025 16:56:57 +0100 Subject: [PATCH 2/5] continuing progress --- example/lib/home.dart | 4 +- example/lib/main.dart | 38 +- .../pages/components/quill_editor_demo.dart | 2 - example/lib/pages/theme/colors.dart | 16 +- example/pubspec.yaml | 2 + lib/src/components/atoms/expandable.dart | 2 +- lib/src/components/atoms/selection_pills.dart | 34 +- lib/src/components/molecules/block_table.dart | 19 +- lib/src/components/molecules/comment.dart | 6 +- lib/src/components/molecules/tab_bar.dart | 2 +- lib/src/components/molecules/tag.dart | 73 +- .../components/molecules/vertical_nav.dart | 4 +- lib/src/components/organisms/app_bar.dart | 2 +- .../organisms/chat/audio_recorder.dart | 4 +- .../chat/message_body/attachment.dart | 2 +- .../chat/message_body/reacts_tags.dart | 2 +- .../organisms/chat/message_input.dart | 8 +- .../organisms/file_picker/file_picker.dart | 2 +- .../organisms/html_preview/html_body.dart | 1 + .../organisms/selectable_widget.dart | 2 +- .../theme/theme_builders/checkbox_theme.dart | 24 +- .../theme/theme_builders/chip_theme.dart | 4 +- .../theme/theme_builders/list_tile_theme.dart | 2 +- .../theme/theme_builders/radio_theme.dart | 2 +- .../theme/theme_builders/zeta_theme.dart | 7 +- lib/src/utils/theme/theme_data.dart | 978 +++++++++--------- lib/src/utils/theme/theme_service.dart | 130 +-- pubspec.yaml | 2 + 28 files changed, 670 insertions(+), 704 deletions(-) diff --git a/example/lib/home.dart b/example/lib/home.dart index 1b288144..287a843d 100644 --- a/example/lib/home.dart +++ b/example/lib/home.dart @@ -41,9 +41,7 @@ class _HomePageState extends State { return ZdsExpansionTile( title: Text( rec.key, - style: Theme.of(context).textTheme.titleMedium?.copyWith( - color: zeta.colors.textDefault, - ), + style: Theme.of(context).textTheme.titleMedium, ), child: ZdsListGroup( items: items.map((route) { diff --git a/example/lib/main.dart b/example/lib/main.dart index 77ed4558..7847c802 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -10,35 +10,36 @@ import 'routes.dart'; void main() async { WidgetsFlutterBinding.ensureInitialized(); final preferences = await SharedPreferences.getInstance(); - // final themeService = ZdsThemeService(assetPath: 'assets/colors.json', preferences: preferences); - // final themeData = await themeService.load(); + final themeService = ZdsThemeService(assetPath: 'assets/colors.json', preferences: preferences); + final themeData = await themeService.load(); HttpOverrides.global = MyHttpOverrides(); runApp( DemoApp( - // data: themeData, - // themeService: themeService, - ), + data: themeData, + themeService: themeService, + ), ); } class DemoApp extends StatelessWidget { const DemoApp({ Key? key, - // this.data, + required this.data, this.themeService, }) : super(key: key); final ZetaThemeService? themeService; - // final ZdsThemeData data; + final ZdsThemeData data; @override Widget build(BuildContext context) { return ZetaProvider( themeService: themeService ?? const ZetaDefaultThemeService(), - // initialThemeMode: data.themeMode, - + initialThemeMode: data.themeMode, // initialThemeData: data.themeData, - // initialContrast: data.contrast, + initialTheme: 'zds', + initialContrast: data.contrast, + customThemes: [data.toCustomTheme()], builder: (context, themeData, darkTheme, themeMode) { return MaterialApp( title: 'Zds Demo', @@ -62,8 +63,21 @@ class DemoApp extends StatelessWidget { routes: kAllRoutes, themeMode: themeMode, // theme: themeData, - theme: themeData.copyWith(scaffoldBackgroundColor: Colors.red), - darkTheme: darkTheme, + // theme: themeData.copyWith(scaffoldBackgroundColor: Colors.red), + // darkTheme: darkTheme, + theme: Zeta.of(context).semantics.toTheme( + // fontFamily: themeData.fontFamily, + appBarStyle: data.lightAppBarStyle, + ), + darkTheme: Zeta.of(context).semantics.toTheme( + // fontFamily: themeData.fontFamily, + appBarStyle: data.darkAppBarStyle, + // brightness: Brightness.dark, + ), + // darkTheme: themeData.colorsDark.toScheme().toTheme( + // fontFamily: themeData.fontFamily, + // appBarStyle: data.darkAppBarStyle, + // ), ); }, ); diff --git a/example/lib/pages/components/quill_editor_demo.dart b/example/lib/pages/components/quill_editor_demo.dart index 6008e797..86c54e23 100644 --- a/example/lib/pages/components/quill_editor_demo.dart +++ b/example/lib/pages/components/quill_editor_demo.dart @@ -55,7 +55,6 @@ class _QuillEditorDemoState extends State { Expanded( child: Scaffold( resizeToAvoidBottomInset: false, - backgroundColor: Zeta.of(context).colors.surfacePrimary, appBar: AppBar( title: const Text('Quill Editor'), actions: [ @@ -121,7 +120,6 @@ class _QuillEditorDemoState extends State { Expanded( child: Scaffold( resizeToAvoidBottomInset: false, - backgroundColor: Zeta.of(context).colors.surfacePrimary, body: Builder(builder: (context) { final html = ZdsQuillDelta(document: controller.document).toHtml(); return SingleChildScrollView( diff --git a/example/lib/pages/theme/colors.dart b/example/lib/pages/theme/colors.dart index 221f5534..0738f759 100644 --- a/example/lib/pages/theme/colors.dart +++ b/example/lib/pages/theme/colors.dart @@ -105,18 +105,6 @@ class ColorsDemo extends StatelessWidget { 'subtitle': 'Theme.of(context).colorScheme.onError', }, ]; - // final List> greys = [ - // { - // 'color': Zeta.of(context).colors.black, - // 'name': 'Black', - // 'subtitle': 'Zeta.of(context).colors.black', - // }, - // { - // 'color': Zeta.of(context).colors.white, - // 'name': 'White', - // 'subtitle': 'Zeta.of(context).colors.white', - // }, - // ]; final alertColors = [ { 'color': Zeta.of(context).colors.surfacePositive, @@ -129,9 +117,9 @@ class ColorsDemo extends StatelessWidget { 'subtitle': 'Zeta.of(context).colors.surfaceNegative', }, { - 'color': Zeta.of(context).colors.surfaceNegative, + 'color': Zeta.of(context).colors.surfaceWarning, 'name': 'Warning', - 'subtitle': 'Zeta.of(context).colors.surfaceNegative', + 'subtitle': 'Zeta.of(context).colors.surfaceWarning', }, { 'color': Zeta.of(context).colors.surfaceInfo, diff --git a/example/pubspec.yaml b/example/pubspec.yaml index 6e7d72bf..e3050971 100644 --- a/example/pubspec.yaml +++ b/example/pubspec.yaml @@ -17,6 +17,8 @@ dependencies: dependency_overrides: intl: ^0.20.2 + zeta_flutter_theme: + path: ../../../zeta/zeta_flutter/packages/zeta_flutter_theme flutter: uses-material-design: true diff --git a/lib/src/components/atoms/expandable.dart b/lib/src/components/atoms/expandable.dart index 07e00f96..90aac654 100644 --- a/lib/src/components/atoms/expandable.dart +++ b/lib/src/components/atoms/expandable.dart @@ -317,7 +317,7 @@ extension ExpandableTextExtension on Widget { collapsedButtonText.isEmpty ? strings.get('READ_MORE', 'Read more') : collapsedButtonText, expandedButtonText: expandedButtonText.isEmpty ? strings.get('COLLAPSE', 'Collapse') : expandedButtonText, minHeight: minHeight, - color: color ?? Zeta.of(context).colors.surfacePrimary, + color: color ?? Zeta.of(context).colors.surfaceDefault, child: this, ); }, diff --git a/lib/src/components/atoms/selection_pills.dart b/lib/src/components/atoms/selection_pills.dart index 8418a265..0fad2033 100644 --- a/lib/src/components/atoms/selection_pills.dart +++ b/lib/src/components/atoms/selection_pills.dart @@ -29,8 +29,6 @@ class ZdsSelectionPill extends StatelessWidget { this.onClose, this.padding = const EdgeInsets.all(9), this.color, - this.selectedColor, - this.borderColor, }); /// The button's label. @@ -66,44 +64,30 @@ class ZdsSelectionPill extends StatelessWidget { /// Defaults to primary. final ZetaColorSwatch? color; - ///Use [color] instead. Will be deprecated in future release. - /// - /// Custom color to override pill background color. - /// - ///Defaults to `colorScheme.mainSecondary.withOpacity(0.1)` - final Color? selectedColor; - - ///Use [color] instead. Will be deprecated in future release. - /// - /// Custom color to override unselected pill border color. - /// - /// Defaults to `ZdsColors.greyCoolSwatch[100]`. - final Color? borderColor; - @override Widget build(BuildContext context) { final zetaColors = Zeta.of(context).colors; final themeData = Theme.of(context); final bool disabled = onTap == null; + final ZetaColorSwatch _color = color ?? zetaColors.primitives.primary; final Color background = disabled ? zetaColors.surfaceDisabled : selected - ? selectedColor?.withOpacity(0.2) ?? zetaColors.surfaceSecondary + ? _color.shade10 : themeData.colorScheme.surface; final Color foreground = disabled ? zetaColors.mainDisabled : selected - ? selectedColor ?? zetaColors.mainSecondary + ? _color.shade60 : zetaColors.mainSubtle; - final Color border = borderColor ?? - (disabled - ? zetaColors.borderDisabled - : selected - ? zetaColors.borderSecondary - : zetaColors.borderDefault); + final Color border = (disabled + ? zetaColors.borderDisabled + : selected + ? _color.shade60 + : zetaColors.borderDefault); return ExpandTapWidget( onTap: onTap ?? () {}, @@ -179,8 +163,6 @@ class ZdsSelectionPill extends StatelessWidget { ..add(ObjectFlagProperty.has('onTap', onTap)) ..add(ObjectFlagProperty.has('onClose', onClose)) ..add(DiagnosticsProperty('padding', padding)) - ..add(ColorProperty('selectedColor', selectedColor)) - ..add(ColorProperty('borderColor', borderColor)) ..add(ColorProperty('color', color)); } } diff --git a/lib/src/components/molecules/block_table.dart b/lib/src/components/molecules/block_table.dart index 52d6604c..f57052ad 100644 --- a/lib/src/components/molecules/block_table.dart +++ b/lib/src/components/molecules/block_table.dart @@ -180,7 +180,7 @@ class _BlockTable extends State with WidgetsBindingObserver { @override Widget build(BuildContext context) { return ColoredBox( - color: Zeta.of(context).colors.surfacePrimary, + color: Zeta.of(context).colors.borderSubtle, child: IntrinsicHeight( child: Column( crossAxisAlignment: CrossAxisAlignment.start, @@ -362,7 +362,13 @@ class _BlockTable extends State with WidgetsBindingObserver { final List cells = []; final List rows = widget.rows; final double cellHeight = _cellHeight + widget.cellPadding; - final zetaColors = Zeta.of(context).colors; + final zeta = Zeta.of(context); + + final zetaColors = zeta.colors; + // print('COLOR ' + zetaColors.mainPrimary.toARGB32().toString()); + // print('COLOR ' + zetaColors.mainPrimary.toARGB32().toString()); + // print('COLOR ' + zetaColors.primitives.brightness.toString()); + //TODO: LUKE dark / light mode does not propegate proerly on PRIMARY / SECONDARY Swatches. this is happening in all places, not just this component for (int j = 0; j < rows[index].data.length; j++) { final List columnWidgets = []; @@ -395,7 +401,7 @@ class _BlockTable extends State with WidgetsBindingObserver { child: DecoratedBox( decoration: BoxDecoration( border: isSelected - ? Border.all(color: themeData.colorScheme.secondary, width: 2) + ? Border.all(color: zetaColors.borderPrimary, width: 2) : Border( bottom: BorderSide( width: 1.5, @@ -407,10 +413,7 @@ class _BlockTable extends State with WidgetsBindingObserver { ), ), color: isSelected - ? themeData.colorScheme.secondary.withLight( - 0.1, - background: zetaColors.surfacePrimary, - ) + ? zetaColors.primitives.primary.shade90 : tableCell.backgroundColor ?? themeData.colorScheme.surface, ), child: Align( @@ -422,7 +425,7 @@ class _BlockTable extends State with WidgetsBindingObserver { themeData.textTheme.bodySmall?.copyWith( fontSize: 12, fontWeight: FontWeight.w400, - color: tableCell.textColor ?? themeData.colorScheme.onSurface, + color: tableCell.textColor ?? zetaColors.mainDefault, ), ), ), diff --git a/lib/src/components/molecules/comment.dart b/lib/src/components/molecules/comment.dart index 7d9f4617..4ac79618 100644 --- a/lib/src/components/molecules/comment.dart +++ b/lib/src/components/molecules/comment.dart @@ -90,12 +90,12 @@ class ZdsComment extends StatelessWidget { /// The background color of the comment. /// - /// Defaults to [ZetaColors.surfacePrimary]. + /// Defaults to [ZetaColors.surfaceDefault]. final Color? backgroundColor; /// The background color of the popup menu. /// - /// Defaults to [ZetaColors.surfacePrimary]. + /// Defaults to [ZetaColors.surfaceDefault]. final Color? popupMenuBackgroundColor; @override @@ -103,7 +103,7 @@ class ZdsComment extends StatelessWidget { final colors = Zeta.of(context).colors; final spacing = Zeta.of(context).spacing; - final backgroundColor = this.backgroundColor ?? colors.surfacePrimary; + final backgroundColor = this.backgroundColor ?? colors.surfaceDefault; return ColoredBox( color: backgroundColor, diff --git a/lib/src/components/molecules/tab_bar.dart b/lib/src/components/molecules/tab_bar.dart index 58fb2c52..7039a3c8 100644 --- a/lib/src/components/molecules/tab_bar.dart +++ b/lib/src/components/molecules/tab_bar.dart @@ -164,7 +164,7 @@ class ZdsTabBar extends StatelessWidget implements PreferredSizeWidget { return _tabBarStyle( context, hasIcons, - background: zetaColors.surfacePrimary, + background: zetaColors.mainInverse, indicator: zetaColors.mainPrimary, selectedText: zetaColors.mainDefault, unselectedText: zetaColors.mainSubtle, diff --git a/lib/src/components/molecules/tag.dart b/lib/src/components/molecules/tag.dart index 65ed06b1..fda24f1a 100644 --- a/lib/src/components/molecules/tag.dart +++ b/lib/src/components/molecules/tag.dart @@ -9,23 +9,42 @@ import '../../../../zds_flutter.dart'; /// /// Otherwise, the background will the same color, but with 10% opacity. enum ZdsTagColor { - /// [ColorScheme.error]. + /// [ZetaPrimitives.red]. error, - /// [ZetaColors.orange]. + /// [ZetaPrimitives.orange]. alert, - /// Primary color. + /// [ZetaPrimitives.primary]. + primary, - /// Secondary color. + /// [ZetaPrimitives.secondary]. secondary, - /// [ZetaColors.green]. + /// [ZetaPrimitives.green]. success, - /// [ZetaColors.warm] - basic, + /// [ZetaPrimitives.warm] + basic; + + /// Returns the color swatch for this tag color. + ZetaColorSwatch toColorSwatch(ZetaPrimitives colors) { + switch (this) { + case ZdsTagColor.error: + return colors.red; + case ZdsTagColor.alert: + return colors.orange; + case ZdsTagColor.primary: + return colors.primary; + case ZdsTagColor.secondary: + return colors.secondary; + case ZdsTagColor.success: + return colors.green; + case ZdsTagColor.basic: + return colors.warm; + } + } } /// A tag used to show status information or selected options. @@ -123,14 +142,16 @@ class ZdsTag extends StatelessWidget { Widget build(BuildContext context) { final zetaColors = Zeta.of(context).colors; - Color fgColor = customColor ?? _resolveFgColor(zetaColors, color); + final ZetaColorSwatch swatch = color.toColorSwatch(zetaColors.primitives); + + Color fgColor = customColor ?? swatch.shade60; Color bgColor; if (filled) { bgColor = fgColor; fgColor = fgColor.onColor; } else { - bgColor = customBackgroundColor ?? _resolveBgColor(zetaColors, color); + bgColor = customBackgroundColor ?? swatch.shade30; } final double height = onClose == null @@ -200,40 +221,6 @@ class ZdsTag extends StatelessWidget { ); } - Color _resolveFgColor(ZetaColors zetaColors, ZdsTagColor tagColor) { - switch (tagColor) { - case ZdsTagColor.error: - return zetaColors.surfaceNegative; - case ZdsTagColor.alert: - return zetaColors.surfaceWarning; - case ZdsTagColor.primary: - return zetaColors.mainPrimary; - case ZdsTagColor.secondary: - return zetaColors.mainSecondary; - case ZdsTagColor.success: - return zetaColors.surfacePositive; - case ZdsTagColor.basic: - return zetaColors.primitives.warm.shade80; - } - } - - Color _resolveBgColor(ZetaColors zetaColors, ZdsTagColor tagColor) { - switch (tagColor) { - case ZdsTagColor.error: - return zetaColors.surfaceNegative; - case ZdsTagColor.alert: - return zetaColors.surfaceWarning; - case ZdsTagColor.primary: - return zetaColors.surfacePrimary; - case ZdsTagColor.secondary: - return zetaColors.surfaceSecondary; - case ZdsTagColor.success: - return zetaColors.surfacePositive; - case ZdsTagColor.basic: - return zetaColors.surfaceWarm; - } - } - @override void debugFillProperties(DiagnosticPropertiesBuilder properties) { super.debugFillProperties(properties); diff --git a/lib/src/components/molecules/vertical_nav.dart b/lib/src/components/molecules/vertical_nav.dart index 85c09e4c..ea0fc140 100644 --- a/lib/src/components/molecules/vertical_nav.dart +++ b/lib/src/components/molecules/vertical_nav.dart @@ -240,9 +240,7 @@ class _SelectedBackground extends StatelessWidget { margin: const EdgeInsets.fromLTRB(2, 2, 0, 2), padding: const EdgeInsets.only(left: 1), decoration: BoxDecoration( - gradient: LinearGradient( - colors: [colors.surfaceDefault, colors.surfacePrimary], - ), + color: colors.surfaceDefault, borderRadius: const BorderRadius.only( topLeft: Radius.circular(4), bottomLeft: Radius.circular(4), diff --git a/lib/src/components/organisms/app_bar.dart b/lib/src/components/organisms/app_bar.dart index 00e2895c..f590acbd 100644 --- a/lib/src/components/organisms/app_bar.dart +++ b/lib/src/components/organisms/app_bar.dart @@ -229,7 +229,7 @@ class ZdsAppBar extends StatelessWidget implements PreferredSizeWidget { ); case ZdsTabBarColor.surface: final fgColor = zetaColors.mainDefault; - final bgColor = zetaColors.surfaceDefault; + final bgColor = zetaColors.mainInverse; return AppBarTheme( systemOverlayStyle: computeSystemOverlayStyle(bgColor), backgroundColor: bgColor, diff --git a/lib/src/components/organisms/chat/audio_recorder.dart b/lib/src/components/organisms/chat/audio_recorder.dart index 847c79e6..de56820d 100644 --- a/lib/src/components/organisms/chat/audio_recorder.dart +++ b/lib/src/components/organisms/chat/audio_recorder.dart @@ -271,11 +271,11 @@ class ZdsVoiceNoteRecorderState extends State { }, child: CircleAvatar( backgroundColor: widget.recorderDecoration.resolveMicIconTint(context), - foregroundColor: zetaColors.surfacePrimary, + foregroundColor: zetaColors.surfaceDefault, radius: 27.5, child: Icon( _isRecording ? Icons.pause : Icons.mic, - color: zetaColors.surfacePrimary, + color: zetaColors.surfaceDefault, size: 30, ), ), diff --git a/lib/src/components/organisms/chat/message_body/attachment.dart b/lib/src/components/organisms/chat/message_body/attachment.dart index 8272ebf3..699feb8f 100644 --- a/lib/src/components/organisms/chat/message_body/attachment.dart +++ b/lib/src/components/organisms/chat/message_body/attachment.dart @@ -48,7 +48,7 @@ class ZdsChatAttachmentWidget extends StatelessWidget { height: 80, margin: const EdgeInsets.all(12), decoration: BoxDecoration( - color: colors.surfacePrimary, + color: colors.surfaceDefault, borderRadius: BorderRadius.all(zeta.radius.rounded), border: Border.all(color: colors.borderSubtle), ), diff --git a/lib/src/components/organisms/chat/message_body/reacts_tags.dart b/lib/src/components/organisms/chat/message_body/reacts_tags.dart index 9561fd2f..f8708185 100644 --- a/lib/src/components/organisms/chat/message_body/reacts_tags.dart +++ b/lib/src/components/organisms/chat/message_body/reacts_tags.dart @@ -114,7 +114,7 @@ class _ChatReactionsPill extends StatelessWidget { offset: const Offset(0, 1), ), ], - color: zetaColors.surfacePrimary, + color: zetaColors.surfaceDefault, border: Border.all(color: zetaColors.borderSubtle), ), child: Row( diff --git a/lib/src/components/organisms/chat/message_input.dart b/lib/src/components/organisms/chat/message_input.dart index dbc60c12..25c9034b 100644 --- a/lib/src/components/organisms/chat/message_input.dart +++ b/lib/src/components/organisms/chat/message_input.dart @@ -260,7 +260,7 @@ class ZdsMessageInputState extends State with SingleTickerProvi if (mounted) { return showZdsBottomSheet( enforceSheet: true, - backgroundColor: Zeta.of(context).colors.surfacePrimary, + backgroundColor: Zeta.of(context).colors.surfaceDefault, context: context, builder: (context) { return SingleChildScrollView( @@ -308,11 +308,11 @@ class ZdsMessageInputState extends State with SingleTickerProvi color: Theme.of(context).colorScheme.shadow.withOpacity(0.1), blurRadius: 2, ), - BoxShadow(offset: const Offset(0, 1), color: zetaColors.surfacePrimary, blurRadius: 2), + BoxShadow(offset: const Offset(0, 1), color: zetaColors.surfaceDefault, blurRadius: 2), ], ), child: Material( - color: zetaColors.surfacePrimary, + color: zetaColors.surfaceDefault, child: AnimatedSize( duration: const Duration(milliseconds: 250), child: Row( @@ -454,7 +454,7 @@ class ZdsMessageInputState extends State with SingleTickerProvi unawaited( showZdsBottomSheet( enforceSheet: widget.enforceSheet, - backgroundColor: zetaColors.surfacePrimary, + backgroundColor: zetaColors.surfaceDefault, context: context, maxHeight: maxSheetHeight, builder: (_) { diff --git a/lib/src/components/organisms/file_picker/file_picker.dart b/lib/src/components/organisms/file_picker/file_picker.dart index f83b9b90..d2b3ab7a 100644 --- a/lib/src/components/organisms/file_picker/file_picker.dart +++ b/lib/src/components/organisms/file_picker/file_picker.dart @@ -485,7 +485,7 @@ class ZdsFilePickerState extends State with AutomaticKeepAliveCli option.getLabel(context), maxLines: 1, overflow: TextOverflow.ellipsis, - style: style?.copyWith(color: zetaColors.textDefault), + style: style?.copyWith(color: zetaColors.mainDefault), textScaler: MediaQuery.textScalerOf(context).clamp(maxScaleFactor: 2.7), ).semantics(identifier: option.getLabel(context)), ], diff --git a/lib/src/components/organisms/html_preview/html_body.dart b/lib/src/components/organisms/html_preview/html_body.dart index 7b40745a..9bd2b731 100644 --- a/lib/src/components/organisms/html_preview/html_body.dart +++ b/lib/src/components/organisms/html_preview/html_body.dart @@ -211,6 +211,7 @@ class ZdsHtml extends StatelessWidget { lineHeight: LineHeight.percent(100), color: zetaColors.mainPrimary, ), + 'strong': Style(color: zetaColors.mainDefault), ...style, }; } diff --git a/lib/src/components/organisms/selectable_widget.dart b/lib/src/components/organisms/selectable_widget.dart index 4813b21f..f3042aa3 100644 --- a/lib/src/components/organisms/selectable_widget.dart +++ b/lib/src/components/organisms/selectable_widget.dart @@ -75,7 +75,7 @@ class _ZdsSelectableWidgetState extends State { if (!(widget.copyable ?? false)) return widget.child; final zeta = Zeta.of(context).colors; return GestureDetector( - child: ColoredBox(color: isSelected ? zeta.surfacePrimary : Colors.transparent, child: widget.child), + child: ColoredBox(color: isSelected ? zeta.surfacePrimarySubtle : Colors.transparent, child: widget.child), onLongPress: () async { if (isSelected) return; toggleSelection(); diff --git a/lib/src/utils/theme/theme_builders/checkbox_theme.dart b/lib/src/utils/theme/theme_builders/checkbox_theme.dart index e2769b55..cae18b0a 100644 --- a/lib/src/utils/theme/theme_builders/checkbox_theme.dart +++ b/lib/src/utils/theme/theme_builders/checkbox_theme.dart @@ -20,14 +20,18 @@ extension ZetaCheckboxTheme on ZetaSemantics { defaultValue: SystemMouseCursors.basic, ), - /// Setting up custom fill color for different material states. - fillColor: widgetStatePropertyResolver( - selectedValue: colors.mainSecondary, - hoveredValue: colors.mainSecondary, - focusedValue: colors.stateSecondaryHover, - disabledValue: colors.surfaceSecondarySubtle, - defaultValue: Colors.transparent, - ), + fillColor: WidgetStateProperty.resolveWith((states) { + if (states.contains(WidgetState.selected)) { + return colors.mainSecondary; + } + if (states.contains(WidgetState.disabled)) { + return colors.mainDisabled; + } + if (states.contains(WidgetState.hovered)) { + return colors.stateDefaultHover; + } + return Colors.transparent; + }), /// Setting up the side property. side: BorderSide(color: colors.mainDefault, width: 2), @@ -41,8 +45,8 @@ extension ZetaCheckboxTheme on ZetaSemantics { /// Setting up custom overlayColor for different material states. overlayColor: widgetStatePropertyResolver( - hoveredValue: colors.surfaceHover, - ), + // hoveredValue: colors.surfaceHover, + ), /// Setting tap target size to "padded". materialTapTargetSize: MaterialTapTargetSize.padded, diff --git a/lib/src/utils/theme/theme_builders/chip_theme.dart b/lib/src/utils/theme/theme_builders/chip_theme.dart index 9757b493..f22f6d76 100644 --- a/lib/src/utils/theme/theme_builders/chip_theme.dart +++ b/lib/src/utils/theme/theme_builders/chip_theme.dart @@ -17,10 +17,10 @@ extension ZetaChipTheme on ZetaSemantics { /// checkmarkColor, labelStyle, secondaryLabelStyle and iconTheme. return ChipThemeData( /// Setting up the background color. - backgroundColor: colors.surfaceSecondary, + backgroundColor: colors.surfaceSecondarySubtle, /// Setting up the selected color. - selectedColor: colors.surfaceSecondary, + selectedColor: colors.surfaceSecondarySubtle, /// Setting up the disabled color. disabledColor: colors.borderDisabled, diff --git a/lib/src/utils/theme/theme_builders/list_tile_theme.dart b/lib/src/utils/theme/theme_builders/list_tile_theme.dart index 9cdc13b1..157ec0cc 100644 --- a/lib/src/utils/theme/theme_builders/list_tile_theme.dart +++ b/lib/src/utils/theme/theme_builders/list_tile_theme.dart @@ -23,7 +23,7 @@ extension ListTileExtension on ZetaSemantics { selectedColor: colors.statePrimarySelected, /// Selected tile color - selectedTileColor: colors.surfacePrimary, + selectedTileColor: colors.surfacePrimarySubtle, /// Setting up the icon color. iconColor: colors.mainDefault, diff --git a/lib/src/utils/theme/theme_builders/radio_theme.dart b/lib/src/utils/theme/theme_builders/radio_theme.dart index a368331d..bf7eae29 100644 --- a/lib/src/utils/theme/theme_builders/radio_theme.dart +++ b/lib/src/utils/theme/theme_builders/radio_theme.dart @@ -26,7 +26,7 @@ extension RadioExtension on ZetaSemantics { /// Defines the fill color for the different states of radio button. fillColor: widgetStatePropertyResolver( selectedValue: colors.mainSecondary, - hoveredValue: colors.stateSecondaryHover, + hoveredValue: colors.mainDefault, focusedValue: colors.stateSecondaryHover, disabledValue: colors.surfaceSecondarySubtle, defaultValue: colors.mainDefault, diff --git a/lib/src/utils/theme/theme_builders/zeta_theme.dart b/lib/src/utils/theme/theme_builders/zeta_theme.dart index b1a7bd76..93870400 100644 --- a/lib/src/utils/theme/theme_builders/zeta_theme.dart +++ b/lib/src/utils/theme/theme_builders/zeta_theme.dart @@ -79,6 +79,7 @@ extension ZetaThemeBuilder on ZetaSemantics { String? fontFamily, ZetaAppBarStyle appBarStyle = ZetaAppBarStyle.primary, bool useMaterial3 = false, + Brightness? brightness, }) { // A TextTheme object for the colors onPrimary. final primaryTextTheme = buildZdsTextTheme( @@ -99,13 +100,13 @@ extension ZetaThemeBuilder on ZetaSemantics { final barTheme = appBarTheme(primaryTextTheme, effectiveAppBarColor); return ThemeData( - colorScheme: ZetaSemanticsAA(primitives: const ZetaPrimitivesLight()).colors.toColorScheme, + colorScheme: ZetaSemanticsAA(primitives: primitives).colors.toColorScheme, appBarTheme: barTheme, useMaterial3: useMaterial3, bottomAppBarTheme: bottomAppBarTheme(), bottomNavigationBarTheme: bottomNavigationBarTheme(textTheme), bottomSheetTheme: bottomSheetTheme(), - brightness: colors.primitives.brightness, + brightness: brightness ?? colors.primitives.brightness, canvasColor: colors.surfaceDefault, cardTheme: cardTheme(), checkboxTheme: checkboxTheme(), @@ -126,7 +127,7 @@ extension ZetaThemeBuilder on ZetaSemantics { primaryTextTheme: primaryTextTheme, progressIndicatorTheme: progressIndicatorTheme(), radioTheme: radioThemeData(), - scaffoldBackgroundColor: colors.surfaceDefault, + scaffoldBackgroundColor: colors.surfaceWarm, searchBarTheme: searchBarTheme(textTheme), shadowColor: colors.borderDisabled.withOpacity(0.7), sliderTheme: sliderTheme(), diff --git a/lib/src/utils/theme/theme_data.dart b/lib/src/utils/theme/theme_data.dart index b8b35f14..5ae564a0 100644 --- a/lib/src/utils/theme/theme_data.dart +++ b/lib/src/utils/theme/theme_data.dart @@ -1,495 +1,483 @@ -// import 'dart:convert'; - -// import 'package:flutter/material.dart'; -// import 'package:flutter/services.dart'; -// import 'package:zeta_flutter/zeta_flutter.dart'; - -// import '../theme.dart'; -// import '../tools/utils.dart'; - -// class _ZdsBaseColors { -// _ZdsBaseColors({required this.primary, required this.secondary, required this.error}); - -// factory _ZdsBaseColors.fromJson(Map? json) { -// // Extracts primary, secondary, and error colors from JSON, with default fallbacks. -// final primary = (json?['primary'] as String?)?.toColor() ?? const ZetaPrimitivesLight().blue; -// final secondary = (json?['secondary'] as String?)?.toColor() ?? const ZetaPrimitivesLight().blue; - -// var error = (json?['error'] as String?)?.toColor(); -// if (error == null && isShadeOfRed(primary)) { -// error = const ZetaPrimitivesLight().warm; -// } else { -// error = const ZetaPrimitivesLight().red; -// } - -// return _ZdsBaseColors(primary: primary, secondary: secondary, error: error); -// } - -// final Color primary; -// final Color secondary; -// final Color error; - -// static bool isShadeOfRed(Color color) { -// // Get the red, green, and blue components of the color -// final red = color.red; -// final green = color.green; -// final blue = color.blue; - -// // Check if the red component is dominant -// return red > green && red > blue; -// } - -// Map toJson() { -// return { -// 'primary': primary.toHex(), -// 'secondary': secondary.toHex(), -// 'error': error.toHex(), -// }; -// } -// } - -// /// Class to allow custom color definitions in dark and light modes and used with new [ZetaProvider] -// /// -// /// This class holds the definitions for themes in both Dark and Light mode. -// /// These definitions are later used by `ZetaProvider` class. -// /// -// /// See also: -// /// * [ZetaProvider] -// /// * [Zeta] -// /// * [ZetaColors] -// /// * [ZetaColorScheme] -// /// * [ZetaAppBarStyle] -// @immutable -// class ZdsThemeData { -// /// Creates a `ZdsThemeData`. -// /// -// /// The [themeData] and [themeMode] must not be null. -// /// -// /// The [themeData] parameter, which is required, defines the theme data to be used with [ZetaProvider]. -// /// The [themeMode] parameter, which is required, defines the theme mode for the [Zeta], and defaults to [ThemeMode.system]. -// /// The [darkAppBarStyle] parameter defines the AppBar style for the dark theme, used to select the colors used in AppBarTheme style from [ZetaColorScheme]. Defaults to [ZetaAppBarStyle.surface]. -// /// The [lightAppBarStyle] parameter defines the AppBar style for the light theme, used to select the colors used in AppBarTheme style from [ZetaColorScheme]. Defaults to [ZetaAppBarStyle.primary]. -// const ZdsThemeData._({ -// required this.themeData, -// required this.themeMode, -// required this.darkAppBarStyle, -// required this.lightAppBarStyle, -// required this.contrast, -// required this.adjustAccessibility, -// required _ZdsBaseColors lightColors, -// required _ZdsBaseColors darkColors, -// }) : _lightColors = lightColors, -// _darkColors = darkColors; - -// /// Creates a default [ZdsThemeData] instance with predefined settings. -// /// -// /// This factory constructor initializes a [ZdsThemeData] object with a set of default values. It is useful for creating a standard theme data configuration that can be used across the app when specific customizations are not required. -// /// -// /// The default settings include: -// /// - A primary and secondary color set to blue. -// /// - An error color set to red. -// /// - The theme mode set to the system's default. -// /// - Default styles for both dark and light app bar styles. -// /// - A default contrast level. -// /// - Accessibility adjustments set to false. -// /// - The same color settings applied for both light and dark themes. -// factory ZdsThemeData.defaultData() { -// // Initialize base colors with default primary, secondary, and error colors. -// final baseColors = _ZdsBaseColors( -// primary: const ZetaPrimitivesLight().blue, // Default primary color set to blue. -// secondary: const ZetaPrimitivesLight().blue, // Default secondary color set to blue. -// error: const ZetaPrimitivesLight().red, // Default error color set to red. -// ); - -// // Return a new instance of ZdsThemeData with default settings. -// return ZdsThemeData._( -// themeData: ThemeData(), -// // themeData: generateZetaTheme(brightness: Brightness.light, colorScheme: , textTheme: textTheme), -// // themeData: ZetaThemeData(), -// // Initialize with default ZetaThemeData. -// themeMode: ThemeMode.system, -// // Use system default theme mode. -// darkAppBarStyle: ZetaAppBarStyle.surface, -// // Default style for dark app bar. -// lightAppBarStyle: ZetaAppBarStyle.primary, -// // Default style for light app bar. -// contrast: ZetaContrast.aa, -// // Set default contrast level. -// adjustAccessibility: false, -// // Accessibility adjustments are turned off by default. -// lightColors: baseColors, -// // Apply the base colors to light theme. -// darkColors: baseColors, // Apply the same base colors to dark theme. -// ); -// } - -// /// Factory constructor for creating [ZdsThemeData] from a JSON map. -// factory ZdsThemeData.fromJson(Map json) { -// // Determines if accessibility adjustments are needed. -// final adjustAccessibility = json['adjustAccessibility'] as bool? ?? false; - -// // Determines the contrast level, defaulting to 'aa' if not specified as 'aaa'. -// final contrast = _zetaContrast(json); - -// // Determines theme mode -// final themeMode = _themeMode(json); - -// final light = json['light'] as Map?; -// final dark = json['dark'] as Map?; - -// final lightColors = _ZdsBaseColors.fromJson(light); -// final darkColors = dark != null ? _ZdsBaseColors.fromJson(light) : lightColors; - -// return ZdsThemeData._( -// themeMode: themeMode, -// contrast: contrast, -// lightColors: lightColors, -// darkColors: darkColors, -// adjustAccessibility: adjustAccessibility, -// lightAppBarStyle: _zetaAppBarStyle(light), -// darkAppBarStyle: _zetaAppBarStyle(dark), -// themeData: _zetaThemeDataFromJson( -// json, -// contrast, -// adjustAccessibility, -// lightColors, -// darkColors, -// ), -// ); -// } - -// /// Creates a new instance of [ZdsThemeData] from a JSON format string. -// /// -// /// The [json] parameter is a JSON string that conforms to the structure of [ZdsThemeData]. -// /// Example: -// /// { -// /// "identifier": "default", -// /// "themeMode": "system", // Possible values "dark", "light", "system" -// /// "contrast": "aa", // Possible values "aa", "aaa" -// /// "fontFamily": "packages/zeta_flutter/IBMPlexSans", -// /// "adjustAccessibility": true, -// /// "light": { -// /// "appBarStyle": "primary", // Possible values "surface", "background", "secondary", "primary" -// /// "primary": "#0073e6", -// /// "secondary": "#0073e6", -// /// "error": "#D70015" -// /// }, -// /// "dark": { -// /// "appBarStyle": "surface", // Possible values "surface", "background", "secondary", "primary" -// /// "primary": "#0073e6", -// /// "secondary": "#0073e6", -// /// "error": "#D70015" -// /// } -// /// } -// /// -// /// -// /// This string is parsed to a Map using the [_parseJson] helper method, and then -// /// it's used to construct a new instance of [ZdsThemeData]. -// /// -// /// Returns a new [ZdsThemeData] object from JSON data. -// factory ZdsThemeData.fromJsonString(String json) { -// return ZdsThemeData.fromJson(_parseJson(json)); -// } - -// /// Asynchronously creates an instance of [ZdsThemeData] from the JSON file at the given [path]. -// /// -// /// [path] represents the location of the JSON file in your application assets. -// /// -// /// The JSON data is expected to be a serialized version of the [ZdsThemeData] object. -// /// -// /// Returns a Future that completes with the [ZdsThemeData] once it has been loaded and parsed. -// static Future fromAssets(String path) async { -// final json = await _readAsset(path); -// return ZdsThemeData.fromJsonString(json); -// } - -// /// Theme data to be used with [ZetaProvider] -// /// -// /// This field hold the instance of [ZetaThemeServiceData] which is used by `ZetaProvider` class. -// final ZetaThemeServiceData themeData; - -// /// The theme mode for the [Zeta] -// /// -// /// It defaults to [ThemeMode.system] -// /// This holds the mode of the theme which is by default set to [ThemeMode.system]. -// final ThemeMode themeMode; - -// /// AppBar style for the dark theme -// /// -// /// This holds the AppBar style for dark theme mode which is used to -// /// select the colors from [ZetaColors]. -// final ZetaAppBarStyle darkAppBarStyle; - -// /// AppBar style for the light theme -// /// -// /// This holds the AppBar style for light theme mode which is used to -// /// select the colors from [ZetaColors]. -// final ZetaAppBarStyle lightAppBarStyle; - -// /// Represents the Zeta accessibility standard. -// /// {@macro zeta-color-dark} -// final ZetaContrast contrast; - -// /// Decides if accessibility adjustments should be applied to colors. -// /// -// /// Defaults to false -// final bool adjustAccessibility; - -// /// Base light colors, used internally to save and retrieve the colors from JSON -// final _ZdsBaseColors _lightColors; - -// /// Base dark colors, used internally to save and retrieve the colors from JSON -// final _ZdsBaseColors _darkColors; - -// /// Converts the [ZdsThemeData] instance to a JSON map. -// Map toJson() { -// return { -// // 'identifier': themeData.identifier, -// 'themeMode': _themeModeToString(themeMode), -// 'fontFamily': themeData.fontFamily, -// 'adjustAccessibility': adjustAccessibility, -// 'contrast': _contrastToString(contrast), -// 'light': { -// 'appBarStyle': _zetaAppBarStyleToString(lightAppBarStyle), -// ..._lightColors.toJson(), -// }, -// 'dark': { -// 'appBarStyle': _zetaAppBarStyleToString(darkAppBarStyle), -// ..._darkColors.toJson(), -// }, -// }; -// } - -// static ZetaContrast _zetaContrast(Map json) { -// final contrastString = json['contrast'] as String?; -// final contrast = contrastString == 'aaa' ? ZetaContrast.aaa : ZetaContrast.aa; -// return contrast; -// } - -// static ThemeMode _themeMode(Map json) { -// final themModeString = json['themeMode'] as String?; -// final themeMode = themModeString == 'light' -// ? ThemeMode.light -// : themModeString == 'dark' -// ? ThemeMode.dark -// : ThemeMode.system; -// return themeMode; -// } - -// static ZetaAppBarStyle _zetaAppBarStyle(Map? json) { -// final appBarStyleString = json?['appBarStyle'] as String?; -// return appBarStyleString == 'surface' -// ? ZetaAppBarStyle.surface -// : appBarStyleString == 'background' -// // This ignore is used because the `ZetaAppBarStyle.background`, -// // `ZetaAppBarStyle.mainSecondary`, and `ZetaAppBarStyle.primary` values are marked -// // as deprecated within the same package. However, they are still in use in the -// // codebase, and replacing them requires refactoring to a new style system. -// // The deprecated usage is temporary, and a future update will remove it once -// // the new styles are fully integrated and tested. -// // ignore: deprecated_member_use_from_same_package -// ? ZetaAppBarStyle.background -// : appBarStyleString == 'secondary' -// ? ZetaAppBarStyle.mainSecondary -// : ZetaAppBarStyle.primary; -// } - -// /// Parses the given JSON map into [ZetaThemeData]. -// static ZetaThemeData _zetaThemeDataFromJson( -// Map json, -// ZetaContrast contrast, -// bool adjustAccessibility, -// _ZdsBaseColors lightColors, -// _ZdsBaseColors darkColors, -// ) { -// // Constructs and returns a new instance of ZetaThemeData. -// final light = _colors(lightColors, Brightness.light, contrast, adjustAccessibility); -// final dark = _colors(darkColors, Brightness.dark, contrast, adjustAccessibility); - -// return ZetaThemeData( -// identifier: json['identifier'] as String? ?? 'default', -// // Sets the identifier, defaulting to 'default'. -// fontFamily: json['fontFamily'] as String? ?? kZetaFontFamily, -// // Sets the font family, with a default value. -// contrast: contrast, -// // Sets the determined contrast. -// colorsLight: light, -// // Processes light theme colors. -// colorsDark: dark, // Processes dark theme colors. -// ); -// } - -// /// Creates a [ZetaColors] object from the given JSON, brightness, and contrast. -// static ZetaColors _colors( -// _ZdsBaseColors colors, -// Brightness brightness, -// ZetaContrast contrast, -// bool adjustAccessibility, -// ) { -// // Helper function to create a color swatch based on the given base color. -// ZetaColorSwatch swatch(Color base) => ZetaColorSwatch.fromColor(base).apply(brightness: brightness); - -// // Returns either a dark or light themed [ZetaColors] object based on the brightness. -// return brightness == Brightness.dark -// ? ZetaColors.dark( -// contrast: contrast, -// primary: swatch(colors.primary), -// secondary: swatch(colors.mainSecondary), -// error: swatch(colors.error), -// ) -// : ZetaColors.light( -// contrast: contrast, -// primary: swatch(colors.primary), -// secondary: swatch(colors.mainSecondary), -// error: swatch(colors.error), -// ); -// } - -// /// Helper function to convert [ThemeMode] to string representation. -// static String _themeModeToString(ThemeMode themeMode) { -// switch (themeMode) { -// case ThemeMode.light: -// return 'light'; -// case ThemeMode.dark: -// return 'dark'; -// case ThemeMode.system: -// return 'system'; -// } -// } - -// /// Helper function to convert [ZetaAppBarStyle] to string representation. -// static String _zetaAppBarStyleToString(ZetaAppBarStyle appBarStyle) { -// switch (appBarStyle) { -// case ZetaAppBarStyle.surface: -// return 'surface'; -// // This ignore is used because the `ZetaAppBarStyle.background` value is marked -// // as deprecated within the same package. However, it is still in use in the -// // codebase as part of the conversion process. Refactoring to remove the -// // deprecated value requires replacing all instances of it, which will be done -// // in a future update. This usage of the deprecated member is temporary until -// // the transition is complete. -// // ignore: deprecated_member_use_from_same_package -// case ZetaAppBarStyle.background: -// return 'background'; -// case ZetaAppBarStyle.mainSecondary: -// return 'secondary'; -// case ZetaAppBarStyle.primary: -// return 'primary'; -// } -// } - -// /// Converts [ZetaContrast] to string. -// static String _contrastToString(ZetaContrast contrast) { -// return contrast == ZetaContrast.aaa ? 'aaa' : 'aa'; -// } - -// /// Private helper function that reads a JSON file from the application assets. -// /// -// /// [path] is the location of the JSON file. -// /// -// /// Returns a Future that completes with a `Map` once the file has been loaded and decoded. -// /// If an error occurs during loading or decoding, it catches the exception and returns an empty Map. -// static Future _readAsset(String path) async { -// try { -// return await rootBundle.loadString(path); -// } catch (e) { -// return '{}'; -// } -// } - -// /// Parses a JSON string and returns it as a Map. -// /// -// /// The [jsonString] argument is a JSON string that will be parsed into a `Map`. -// /// -// /// This method tries to decode the given JSON string. If an error occurs during decoding, -// /// it catches the exception and returns an empty Map. -// static Map _parseJson(String jsonString) { -// try { -// return jsonDecode(jsonString) as Map; -// } catch (e) { -// return {}; -// } -// } - -// /// Creates a copy of this [ZdsThemeData] but with the given fields replaced with the new values. -// /// -// /// [themeData] (optional): The [ZetaThemeData] that is paired with [ZdsThemeData]. -// /// This is the raw ThemeData instance that is used to construct the [ZdsThemeData] object. -// /// -// /// [themeMode] (optional): Specifies the mode of the theme - light, dark etc. If a themeMode -// /// is not provided, it will default to the current [ZdsThemeData] theme mode. -// /// -// /// [darkAppBarStyle] (optional): Defines the style of the app bar in dark theme. If not provided, -// /// it will use the existing style from this [ZdsThemeData] for the dark app bar style. -// /// -// /// [lightAppBarStyle] (optional): Same as [darkAppBarStyle], but for light theme. -// /// -// /// [contrast] (optional): Specifies the contrast level for the theme. If not provided, -// /// it defaults to the current contrast level of this [ZdsThemeData] instance. -// /// -// /// [adjustAccessibility] (optional): Boolean value that controls whether to adjust the accessibility -// /// options depending on the theme contrast. If not provided, it will preserve the original value -// /// of [adjustAccessibility] from this [ZdsThemeData] instance. -// /// -// /// Returns a new [ZdsThemeData] instance. -// ZdsThemeData copyWith({ -// ZetaThemeData? themeData, -// ThemeMode? themeMode, -// ZetaAppBarStyle? darkAppBarStyle, -// ZetaAppBarStyle? lightAppBarStyle, -// ZetaContrast? contrast, -// bool? adjustAccessibility, -// }) { -// var lightColors = _lightColors; -// var darkColors = _darkColors; - -// if (themeData != null) { -// lightColors = _ZdsBaseColors( -// primary: themeData.colorsLight.primary.shade60, -// secondary: themeData.colorsLight.mainSecondary.shade60, -// error: themeData.colorsLight.error.shade60, -// ); - -// darkColors = _ZdsBaseColors( -// primary: themeData.colorsLight.primary.shade50, -// secondary: themeData.colorsLight.mainSecondary.shade50, -// error: themeData.colorsLight.error.shade50, -// ); -// } - -// return ZdsThemeData._( -// lightColors: lightColors, -// darkColors: darkColors, -// themeData: themeData ?? this.themeData, -// themeMode: themeMode ?? this.themeMode, -// darkAppBarStyle: darkAppBarStyle ?? this.darkAppBarStyle, -// lightAppBarStyle: lightAppBarStyle ?? this.lightAppBarStyle, -// contrast: contrast ?? this.contrast, -// adjustAccessibility: adjustAccessibility ?? this.adjustAccessibility, -// ); -// } -// } - -// /// Returns a map of colors shades with their respective indexes. -// class ZetaSwatchGenerator { -// /// Darker shades are obtained by darkening the primary color and -// /// lighter shades by lightening it. -// /// -// /// - 100, 90, 80, and 70 are darker shades of the primary color. -// /// - 60 is the primary color itself. -// /// - 50, 40, 30, 20, and 10 are progressively lighter shades of the primary color. -// static ZetaColorSwatch generate( -// Color primary, { -// Brightness brightness = Brightness.light, -// ZetaContrast contrast = ZetaContrast.aa, -// Color background = Colors.white, -// bool adjustAccessibility = false, -// }) { -// return ZetaColorSwatch( -// contrast: contrast, -// brightness: brightness, -// primary: primary.value, -// swatch: primary.generateSwatch(background: background, adjustPrimary: adjustAccessibility), -// ).apply(brightness: brightness); -// } -// } +import 'dart:convert'; + +import 'package:flutter/material.dart'; +import 'package:flutter/services.dart'; +import 'package:zeta_flutter/zeta_flutter.dart'; + +import '../theme.dart'; +import '../tools/utils.dart'; + +class _ZdsBaseColors { + _ZdsBaseColors({required this.primary, required this.secondary, required this.error}); + + factory _ZdsBaseColors.fromJson(Map? json) { + // Extracts primary, secondary, and error colors from JSON, with default fallbacks. + final primary = (json?['primary'] as String?)?.toColor() ?? const ZetaPrimitivesLight().blue; + final secondary = (json?['secondary'] as String?)?.toColor() ?? const ZetaPrimitivesLight().blue; + + var error = (json?['error'] as String?)?.toColor(); + if (error == null && isShadeOfRed(primary)) { + error = const ZetaPrimitivesLight().warm; + } else { + error = const ZetaPrimitivesLight().red; + } + + return _ZdsBaseColors(primary: primary, secondary: secondary, error: error); + } + + final Color primary; + final Color secondary; + final Color error; + + static bool isShadeOfRed(Color color) { + // Get the red, green, and blue components of the color + final red = color.r; + final green = color.g; + final blue = color.b; + + // Check if the red component is dominant + return red > green && red > blue; + } + + Map toJson() { + return { + 'primary': primary.toHex(), + 'secondary': secondary.toHex(), + 'error': error.toHex(), + }; + } +} + +/// Class to allow custom color definitions in dark and light modes and used with new [ZetaProvider] +/// +/// This class holds the definitions for themes in both Dark and Light mode. +/// These definitions are later used by `ZetaProvider` class. +/// +/// See also: +/// * [ZetaProvider] +/// * [Zeta] +/// * [ZetaColors] +/// * [ZetaAppBarStyle] +@immutable +class ZdsThemeData { + /// Creates a `ZdsThemeData`. + /// + /// The [themeData] and [themeMode] must not be null. + /// + /// The [themeData] parameter, which is required, defines the theme data to be used with [ZetaProvider]. + /// The [themeMode] parameter, which is required, defines the theme mode for the [Zeta], and defaults to [ThemeMode.system]. + /// The [darkAppBarStyle] parameter defines the AppBar style for the dark theme, used to select the colors used in AppBarTheme style from [ZetaColorScheme]. Defaults to [ZetaAppBarStyle.surface]. + /// The [lightAppBarStyle] parameter defines the AppBar style for the light theme, used to select the colors used in AppBarTheme style from [ZetaColorScheme]. Defaults to [ZetaAppBarStyle.primary]. + const ZdsThemeData._({ + // required this.themeData, + required this.themeMode, + required this.darkAppBarStyle, + required this.lightAppBarStyle, + required this.contrast, + required this.adjustAccessibility, + required _ZdsBaseColors lightColors, + required _ZdsBaseColors darkColors, + }) : _lightColors = lightColors, + _darkColors = darkColors; + + /// Creates a default [ZdsThemeData] instance with predefined settings. + /// + /// This factory constructor initializes a [ZdsThemeData] object with a set of default values. It is useful for creating a standard theme data configuration that can be used across the app when specific customizations are not required. + /// + /// The default settings include: + /// - A primary and secondary color set to blue. + /// - An error color set to red. + /// - The theme mode set to the system's default. + /// - Default styles for both dark and light app bar styles. + /// - A default contrast level. + /// - Accessibility adjustments set to false. + /// - The same color settings applied for both light and dark themes. + factory ZdsThemeData.defaultData() { + // Initialize base colors with default primary, secondary, and error colors. + final baseColors = _ZdsBaseColors( + primary: const ZetaPrimitivesLight().blue, // Default primary color set to blue. + secondary: const ZetaPrimitivesLight().blue, // Default secondary color set to blue. + error: const ZetaPrimitivesLight().red, // Default error color set to red. + ); + + // Return a new instance of ZdsThemeData with default settings. + return ZdsThemeData._( + // themeData: ThemeData(), + // themeData: generateZetaTheme(brightness: Brightness.light, colorScheme: , textTheme: textTheme), + // themeData: ZetaThemeData(), + // Initialize with default ZetaThemeData. + themeMode: ThemeMode.system, + // Use system default theme mode. + darkAppBarStyle: ZetaAppBarStyle.surface, + // Default style for dark app bar. + lightAppBarStyle: ZetaAppBarStyle.primary, + // Default style for light app bar. + contrast: ZetaContrast.aa, + // Set default contrast level. + adjustAccessibility: false, + // Accessibility adjustments are turned off by default. + lightColors: baseColors, + // Apply the base colors to light theme. + darkColors: baseColors, // Apply the same base colors to dark theme. + ); + } + + /// Factory constructor for creating [ZdsThemeData] from a JSON map. + factory ZdsThemeData.fromJson(Map json) { + // Determines if accessibility adjustments are needed. + final adjustAccessibility = json['adjustAccessibility'] as bool? ?? false; + + // Determines the contrast level, defaulting to 'aa' if not specified as 'aaa'. + final contrast = _zetaContrast(json); + + // Determines theme mode + final themeMode = _themeMode(json); + + final light = json['light'] as Map?; + final dark = json['dark'] as Map?; + + final lightColors = _ZdsBaseColors.fromJson(light); + final darkColors = dark != null ? _ZdsBaseColors.fromJson(light) : lightColors; + + return ZdsThemeData._( + themeMode: themeMode, + contrast: contrast, + lightColors: lightColors, + darkColors: darkColors, + adjustAccessibility: adjustAccessibility, + lightAppBarStyle: _zetaAppBarStyle(light), + darkAppBarStyle: _zetaAppBarStyle(dark), + // themeData: _zetaThemeDataFromJson( + // json, + // contrast, + // adjustAccessibility, + // lightColors, + // darkColors, + // ), + ); + } + + /// Creates a new instance of [ZdsThemeData] from a JSON format string. + /// + /// The [json] parameter is a JSON string that conforms to the structure of [ZdsThemeData]. + /// Example: + /// { + /// "identifier": "default", + /// "themeMode": "system", // Possible values "dark", "light", "system" + /// "contrast": "aa", // Possible values "aa", "aaa" + /// "fontFamily": "packages/zeta_flutter/IBMPlexSans", + /// "adjustAccessibility": true, + /// "light": { + /// "appBarStyle": "primary", // Possible values "surface", "background", "secondary", "primary" + /// "primary": "#0073e6", + /// "secondary": "#0073e6", + /// "error": "#D70015" + /// }, + /// "dark": { + /// "appBarStyle": "surface", // Possible values "surface", "background", "secondary", "primary" + /// "primary": "#0073e6", + /// "secondary": "#0073e6", + /// "error": "#D70015" + /// } + /// } + /// + /// + /// This string is parsed to a Map using the [_parseJson] helper method, and then + /// it's used to construct a new instance of [ZdsThemeData]. + /// + /// Returns a new [ZdsThemeData] object from JSON data. + factory ZdsThemeData.fromJsonString(String json) { + return ZdsThemeData.fromJson(_parseJson(json)); + } + + /// Asynchronously creates an instance of [ZdsThemeData] from the JSON file at the given [path]. + /// + /// [path] represents the location of the JSON file in your application assets. + /// + /// The JSON data is expected to be a serialized version of the [ZdsThemeData] object. + /// + /// Returns a Future that completes with the [ZdsThemeData] once it has been loaded and parsed. + static Future fromAssets(String path) async { + final json = await _readAsset(path); + return ZdsThemeData.fromJsonString(json); + } + + // /// Theme data to be used with [ZetaProvider] + // /// + // /// This field hold the instance of [ZetaThemeServiceData] which is used by `ZetaProvider` class. + // final ZetaThemeServiceData themeData; + + /// The theme mode for the [Zeta] + /// + /// It defaults to [ThemeMode.system] + /// This holds the mode of the theme which is by default set to [ThemeMode.system]. + final ThemeMode themeMode; + + /// AppBar style for the dark theme + /// + /// This holds the AppBar style for dark theme mode which is used to + /// select the colors from [ZetaColors]. + final ZetaAppBarStyle darkAppBarStyle; + + /// AppBar style for the light theme + /// + /// This holds the AppBar style for light theme mode which is used to + /// select the colors from [ZetaColors]. + final ZetaAppBarStyle lightAppBarStyle; + + /// Represents the Zeta accessibility standard. + /// {@macro zeta-color-dark} + final ZetaContrast contrast; + + /// Decides if accessibility adjustments should be applied to colors. + /// + /// Defaults to false + final bool adjustAccessibility; + + /// Base light colors, used internally to save and retrieve the colors from JSON + final _ZdsBaseColors _lightColors; + + /// Base dark colors, used internally to save and retrieve the colors from JSON + final _ZdsBaseColors _darkColors; + + /// Converts the [ZdsThemeData] instance to a JSON map. + Map toJson() { + return { + // 'identifier': themeData.identifier, + 'themeMode': _themeModeToString(themeMode), + // 'fontFamily': themeData.fontFamily, + 'adjustAccessibility': adjustAccessibility, + 'contrast': _contrastToString(contrast), + 'light': { + 'appBarStyle': _zetaAppBarStyleToString(lightAppBarStyle), + ..._lightColors.toJson(), + }, + 'dark': { + 'appBarStyle': _zetaAppBarStyleToString(darkAppBarStyle), + ..._darkColors.toJson(), + }, + }; + } + + static ZetaContrast _zetaContrast(Map json) { + final contrastString = json['contrast'] as String?; + final contrast = contrastString == 'aaa' ? ZetaContrast.aaa : ZetaContrast.aa; + return contrast; + } + + static ThemeMode _themeMode(Map json) { + final themModeString = json['themeMode'] as String?; + final themeMode = themModeString == 'light' + ? ThemeMode.light + : themModeString == 'dark' + ? ThemeMode.dark + : ThemeMode.system; + return themeMode; + } + + static ZetaAppBarStyle _zetaAppBarStyle(Map? json) { + final appBarStyleString = json?['appBarStyle'] as String?; + return appBarStyleString == 'surface' + ? ZetaAppBarStyle.surface + : appBarStyleString == 'secondary' + ? ZetaAppBarStyle.secondary + : ZetaAppBarStyle.primary; + } + + // // /// Parses the given JSON map into [ZetaThemeServiceData]. + // static ZetaThemeServiceData _zetaThemeDataFromJson( + // Map json, + // ZetaContrast contrast, + // bool adjustAccessibility, + // _ZdsBaseColors lightColors, + // _ZdsBaseColors darkColors, + // ) { + // // Constructs and returns a new instance of ZetaThemeData. + // final light = _colors(lightColors, Brightness.light, contrast, adjustAccessibility); + // final dark = _colors(darkColors, Brightness.dark, contrast, adjustAccessibility); + + // return ZetaThemeServiceData( + // identifier: json['identifier'] as String? ?? 'default', + // // Sets the identifier, defaulting to 'default'. + // fontFamily: json['fontFamily'] as String? ?? kZetaFontFamily, + // // Sets the font family, with a default value. + // contrast: contrast, + // // Sets the determined contrast. + // colorsLight: light, + // // Processes light theme colors. + // colorsDark: dark, // Processes dark theme colors. + // ); + // } + + /// Creates a [ZetaColors] object from the given JSON, brightness, and contrast. + // static ZetaColors _colors( + // _ZdsBaseColors colors, + // Brightness brightness, + // ZetaContrast contrast, + // bool adjustAccessibility, + // ) { + // // Helper function to create a color swatch based on the given base color. + // ZetaColorSwatch swatch(Color base) => ZetaColorSwatch.fromColor(base).apply(brightness: brightness); + + // // Returns either a dark or light themed [ZetaColors] object based on the brightness. + // return brightness == Brightness.dark + // ? ZetaColors.dark( + // contrast: contrast, + // primary: swatch(colors.primary), + // secondary: swatch(colors.mainSecondary), + // error: swatch(colors.error), + // ) + // : ZetaColors.light( + // contrast: contrast, + // primary: swatch(colors.primary), + // secondary: swatch(colors.mainSecondary), + // error: swatch(colors.error), + // ); + // } + + /// Helper function to convert [ThemeMode] to string representation. + static String _themeModeToString(ThemeMode themeMode) { + switch (themeMode) { + case ThemeMode.light: + return 'light'; + case ThemeMode.dark: + return 'dark'; + case ThemeMode.system: + return 'system'; + } + } + + /// Helper function to convert [ZetaAppBarStyle] to string representation. + static String _zetaAppBarStyleToString(ZetaAppBarStyle appBarStyle) { + switch (appBarStyle) { + case ZetaAppBarStyle.surface: + return 'surface'; + case ZetaAppBarStyle.secondary: + return 'secondary'; + case ZetaAppBarStyle.primary: + return 'primary'; + } + } + + /// Converts [ZetaContrast] to string. + static String _contrastToString(ZetaContrast contrast) { + return contrast == ZetaContrast.aaa ? 'aaa' : 'aa'; + } + + /// Private helper function that reads a JSON file from the application assets. + /// + /// [path] is the location of the JSON file. + /// + /// Returns a Future that completes with a `Map` once the file has been loaded and decoded. + /// If an error occurs during loading or decoding, it catches the exception and returns an empty Map. + static Future _readAsset(String path) async { + try { + return await rootBundle.loadString(path); + } catch (e) { + return '{}'; + } + } + + /// Parses a JSON string and returns it as a Map. + /// + /// The [jsonString] argument is a JSON string that will be parsed into a `Map`. + /// + /// This method tries to decode the given JSON string. If an error occurs during decoding, + /// it catches the exception and returns an empty Map. + static Map _parseJson(String jsonString) { + try { + return jsonDecode(jsonString) as Map; + } catch (e) { + return {}; + } + } + + /// Creates a copy of this [ZdsThemeData] but with the given fields replaced with the new values. + /// + /// [themeMode] (optional): Specifies the mode of the theme - light, dark etc. If a themeMode + /// is not provided, it will default to the current [ZdsThemeData] theme mode. + /// + /// [darkAppBarStyle] (optional): Defines the style of the app bar in dark theme. If not provided, + /// it will use the existing style from this [ZdsThemeData] for the dark app bar style. + /// + /// [lightAppBarStyle] (optional): Same as [darkAppBarStyle], but for light theme. + /// + /// [contrast] (optional): Specifies the contrast level for the theme. If not provided, + /// it defaults to the current contrast level of this [ZdsThemeData] instance. + /// + /// [adjustAccessibility] (optional): Boolean value that controls whether to adjust the accessibility + /// options depending on the theme contrast. If not provided, it will preserve the original value + /// of [adjustAccessibility] from this [ZdsThemeData] instance. + /// + /// Returns a new [ZdsThemeData] instance. + ZdsThemeData copyWith({ + ThemeMode? themeMode, + ZetaAppBarStyle? darkAppBarStyle, + ZetaAppBarStyle? lightAppBarStyle, + ZetaContrast? contrast, + bool? adjustAccessibility, + }) { + var lightColors = _lightColors; + var darkColors = _darkColors; + + // if (themeData != null) { + // lightColors = _ZdsBaseColors( + // primary: themeData.colorsLight.primary.shade60, + // secondary: themeData.colorsLight.mainSecondary.shade60, + // error: themeData.colorsLight.error.shade60, + // ); + + // darkColors = _ZdsBaseColors( + // primary: themeData.colorsLight.primary.shade50, + // secondary: themeData.colorsLight.mainSecondary.shade50, + // error: themeData.colorsLight.error.shade50, + // ); + // } + + return ZdsThemeData._( + lightColors: lightColors, + darkColors: darkColors, + // themeData: ThemeData(), + // themeData: themeData ?? this.themeData, + themeMode: themeMode ?? this.themeMode, + darkAppBarStyle: darkAppBarStyle ?? this.darkAppBarStyle, + lightAppBarStyle: lightAppBarStyle ?? this.lightAppBarStyle, + contrast: contrast ?? this.contrast, + adjustAccessibility: adjustAccessibility ?? this.adjustAccessibility, + ); + } + + ZetaCustomTheme toCustomTheme() { + return ZetaCustomTheme( + id: 'zds', + primary: _lightColors.primary, + secondary: _lightColors.secondary, + primaryDark: _darkColors.primary, + secondaryDark: _darkColors.secondary, + ); + } +} + +/// Returns a map of colors shades with their respective indexes. +class ZetaSwatchGenerator { + /// Darker shades are obtained by darkening the primary color and + /// lighter shades by lightening it. + /// + /// - 100, 90, 80, and 70 are darker shades of the primary color. + /// - 60 is the primary color itself. + /// - 50, 40, 30, 20, and 10 are progressively lighter shades of the primary color. + static ZetaColorSwatch generate( + Color primary, { + Brightness brightness = Brightness.light, + ZetaContrast contrast = ZetaContrast.aa, + Color background = Colors.white, + bool adjustAccessibility = false, + }) { + return ZetaColorSwatch( + // contrast: contrast, + // brightness: brightness, + primary: primary.value, + swatch: primary.generateSwatch(background: background, adjustPrimary: adjustAccessibility), + ).apply(brightness: brightness); + } +} diff --git a/lib/src/utils/theme/theme_service.dart b/lib/src/utils/theme/theme_service.dart index 11e13ef7..9b558df4 100644 --- a/lib/src/utils/theme/theme_service.dart +++ b/lib/src/utils/theme/theme_service.dart @@ -1,72 +1,72 @@ -// import 'dart:convert'; -// import 'package:shared_preferences/shared_preferences.dart'; -// import 'package:zeta_flutter/zeta_flutter.dart'; +import 'dart:convert'; +import 'package:shared_preferences/shared_preferences.dart'; +import 'package:zeta_flutter/zeta_flutter.dart'; -// import '../theme.dart'; +import '../theme.dart'; -// /// A class representing theme service which extends `ZetaThemeService` class. -// /// This class assists in loading and saving theme data. -// /// See also: -// /// * [ZetaProvider] -// /// * [ZdsThemeData] -// class ZdsThemeService extends ZetaThemeService { -// /// Creates an instance of `ZdsThemeService`. -// /// -// /// Throws an [ArgumentError] if [assetPath] or [preferences] is null. -// /// -// /// The optional [assetPath] parameter defines the path to theme assets. -// /// - This asset path should point to a valid json file. -// /// - The JSON string should conform to the structure of [ZdsThemeData]. -// ZdsThemeService({required this.preferences, this.assetPath}); +/// A class representing theme service which extends `ZetaThemeService` class. +/// This class assists in loading and saving theme data. +/// See also: +/// * [ZetaProvider] +/// * [ZdsThemeData] +class ZdsThemeService extends ZetaThemeService { + /// Creates an instance of `ZdsThemeService`. + /// + /// Throws an [ArgumentError] if [assetPath] or [preferences] is null. + /// + /// The optional [assetPath] parameter defines the path to theme assets. + /// - This asset path should point to a valid json file. + /// - The JSON string should conform to the structure of [ZdsThemeData]. + ZdsThemeService({required this.preferences, this.assetPath}); -// /// The path to load theme assets from. -// final String? assetPath; + /// The path to load theme assets from. + final String? assetPath; -// /// An instance of `SharedPreferences` class to manage local user preferences. -// final SharedPreferences preferences; + /// An instance of `SharedPreferences` class to manage local user preferences. + final SharedPreferences preferences; -// /// Loads theme data from local storage or assets. -// /// -// /// Returns an instance of `ZdsThemeData` either from a saved JSON string in preferences or from assets. -// Future load() async { -// final json = preferences.getString('zds.theme.preferences.json'); -// if (json != null) { -// return ZdsThemeData.fromJsonString(json); -// } else if (assetPath != null) { -// return ZdsThemeData.fromAssets(assetPath!); -// } else { -// return ZdsThemeData.defaultData(); -// } -// } + /// Loads theme data from local storage or assets. + /// + /// Returns an instance of `ZdsThemeData` either from a saved JSON string in preferences or from assets. + Future load() async { + final json = preferences.getString('zds.theme.preferences.json'); + if (json != null) { + return ZdsThemeData.fromJsonString(json); + } else if (assetPath != null) { + return ZdsThemeData.fromAssets(assetPath!); + } else { + return ZdsThemeData.defaultData(); + } + } -// /// An overridden method to load theme, theme mode, and contrast. -// /// -// /// Returns a `ZetaThemeServiceData` object containing theme data, mode, and contrast. -// @override -// Future loadTheme() async { -// final data = await load(); -// return ZetaThemeServiceData( -// themeId: data.identifier, -// themeMode: data.themeMode, -// contrast: data.contrast, -// fontFamily: data.fontFamily, -// ); -// } + /// An overridden method to load theme, theme mode, and contrast. + /// + /// Returns a `ZetaThemeServiceData` object containing theme data, mode, and contrast. + @override + Future loadTheme() async { + final data = await load(); + return ZetaThemeServiceData( + // themeId: data.identifier, + themeMode: data.themeMode, + contrast: data.contrast, + // fontFamily: data.fontFamily, + ); + } -// /// An overridden method to save the theme, theme mode, and contrast. -// /// -// /// Save the setting as a JSON string to local storage (`SharedPreferences`). -// /// -// /// Called from [ZetaProvider] when any theme attribute is changed. -// @override -// Future saveTheme({required ZetaThemeServiceData themeData}) async { -// final data = await load(); -// final newData = data.copyWith( -// identifier: themeData.themeId, -// themeMode: themeData.themeMode, -// contrast: themeData.contrast, -// fontFamily: themeData.fontFamily, -// ); -// await preferences.setString('zds.theme.preferences.json', jsonEncode(newData.toJson())); -// } -// } + /// An overridden method to save the theme, theme mode, and contrast. + /// + /// Save the setting as a JSON string to local storage (`SharedPreferences`). + /// + /// Called from [ZetaProvider] when any theme attribute is changed. + @override + Future saveTheme({required ZetaThemeServiceData themeData}) async { + final data = await load(); + final newData = data.copyWith( + // identifier: themeData.themeId, + themeMode: themeData.themeMode, + contrast: themeData.contrast, + // fontFamily: themeData.fontFamily, + ); + await preferences.setString('zds.theme.preferences.json', jsonEncode(newData.toJson())); + } +} diff --git a/pubspec.yaml b/pubspec.yaml index 014dea8d..69045a7b 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -88,6 +88,8 @@ dev_dependencies: dependency_overrides: extended_image: ^10.0.1 intl: ^0.20.2 + zeta_flutter_theme: + path: ../../zeta/zeta_flutter/packages/zeta_flutter_theme flutter: uses-material-design: true From 1f0668f4f7381691759cb0aa34588531911cd266 Mon Sep 17 00:00:00 2001 From: thelukewalton Date: Mon, 12 May 2025 17:50:42 +0100 Subject: [PATCH 3/5] address most issues / warnings --- example/lib/pages/components/app_bar.dart | 2 +- .../lib/pages/components/expansion_tile.dart | 2 +- .../macos/Runner/DebugProfile.entitlements | 3 +- example/macos/Runner/Release.entitlements | 2 ++ example/pubspec.yaml | 3 +- lib/src/components/atoms/avatar.dart | 2 +- lib/src/components/atoms/button.dart | 2 +- lib/src/components/atoms/expandable.dart | 2 +- .../components/atoms/icon_text_button.dart | 2 +- lib/src/components/atoms/selection_pills.dart | 8 ++--- lib/src/components/molecules/block_table.dart | 5 +-- .../components/molecules/bottom_sheet.dart | 4 +-- lib/src/components/molecules/comment.dart | 13 ++++---- .../molecules/date_range_picker.dart | 6 ++-- lib/src/components/molecules/dropdown.dart | 2 +- .../components/molecules/expansion_tile.dart | 2 +- .../molecules/fields_list_tile.dart | 2 +- .../components/molecules/input_dialog.dart | 2 +- .../molecules/interval_time_picker.dart | 23 +++++++------ .../components/molecules/network_avatar.dart | 2 +- .../molecules/selectable_list_tile.dart | 2 +- .../components/molecules/slidable_button.dart | 2 +- lib/src/components/molecules/star_rating.dart | 2 +- lib/src/components/molecules/tab_bar.dart | 4 +-- lib/src/components/molecules/toolbar.dart | 2 +- .../components/molecules/vertical_nav.dart | 4 +-- lib/src/components/organisms/app_bar.dart | 2 +- .../organisms/camera/camera_page.dart | 8 ++--- .../organisms/chat/audio_decoration.dart | 2 +- .../organisms/chat/audio_player.dart | 8 ++--- .../chat/message_body/attachment.dart | 2 +- .../chat/message_body/chat_utils.dart | 2 +- .../chat/message_body/file_preview.dart | 14 ++++---- .../chat/message_body/link_preview.dart | 2 +- .../chat/message_body/reacts_tags.dart | 4 +-- .../organisms/chat/message_input.dart | 4 +-- lib/src/components/organisms/day_picker.dart | 2 +- .../html_preview/html_container.dart | 14 ++++---- .../html_preview/video_html_extension.dart | 2 +- .../image_editor/utils/shape_painter.dart | 2 +- lib/src/components/organisms/profile.dart | 2 +- .../components/organisms/properties_list.dart | 4 +-- .../organisms/quill_editor/color_button.dart | 4 +-- .../quill_editor/material_picker.dart | 2 +- .../quill_editor/quill_editor_page.dart | 4 +-- lib/src/utils/theme/theme.dart | 10 +++--- .../theme_builders/bottom_app_bar_theme.dart | 2 +- .../theme/theme_builders/button_theme.dart | 2 -- .../theme/theme_builders/card_theme.dart | 2 +- .../theme/theme_builders/switch_theme.dart | 2 +- .../theme_builders/text_selection_theme.dart | 2 +- .../theme/theme_builders/zeta_theme.dart | 2 +- lib/src/utils/theme/theme_data.dart | 2 +- lib/src/utils/tools/nested_flow.dart | 4 +-- lib/src/utils/tools/tab_navigator.dart | 6 ++-- lib/src/utils/tools/utils.dart | 32 +++++++++---------- pubspec.yaml | 1 + 57 files changed, 127 insertions(+), 129 deletions(-) diff --git a/example/lib/pages/components/app_bar.dart b/example/lib/pages/components/app_bar.dart index e0d4d86c..47474257 100644 --- a/example/lib/pages/components/app_bar.dart +++ b/example/lib/pages/components/app_bar.dart @@ -94,7 +94,7 @@ class _AppBarDemoState extends State with SingleTickerProviderStateM title: const Text('Basic color scheme'), icon: CircleAvatar( radius: 15, - backgroundColor: zetaColors.iconInverse, + backgroundColor: zetaColors.mainInverse, child: Text( 'DM', style: TextStyle( diff --git a/example/lib/pages/components/expansion_tile.dart b/example/lib/pages/components/expansion_tile.dart index c8bf695c..ebbbf683 100644 --- a/example/lib/pages/components/expansion_tile.dart +++ b/example/lib/pages/components/expansion_tile.dart @@ -88,7 +88,7 @@ class _ExpansionTileDemoState extends State { ZdsExpansionTile( title: const Text('Collect feedback from customers who was'), initiallyExpanded: true, - titleColor: const Color(0xff007ABA).withOpacity(0.1), + titleColor: const Color(0xff007ABA).withValues(alpha: 0.1), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ diff --git a/example/macos/Runner/DebugProfile.entitlements b/example/macos/Runner/DebugProfile.entitlements index 053b4e74..d414d3b5 100644 --- a/example/macos/Runner/DebugProfile.entitlements +++ b/example/macos/Runner/DebugProfile.entitlements @@ -10,6 +10,7 @@ com.apple.security.files.user-selected.read-only - + com.apple.security.network.client + diff --git a/example/macos/Runner/Release.entitlements b/example/macos/Runner/Release.entitlements index 852fa1a4..48271acc 100644 --- a/example/macos/Runner/Release.entitlements +++ b/example/macos/Runner/Release.entitlements @@ -4,5 +4,7 @@ com.apple.security.app-sandbox + com.apple.security.network.client + diff --git a/example/pubspec.yaml b/example/pubspec.yaml index e3050971..c0c92394 100644 --- a/example/pubspec.yaml +++ b/example/pubspec.yaml @@ -23,5 +23,4 @@ dependency_overrides: flutter: uses-material-design: true assets: - - assets/colors.json - - assets/notification.wav + - assets/ diff --git a/lib/src/components/atoms/avatar.dart b/lib/src/components/atoms/avatar.dart index 7a5a0dce..961233ae 100644 --- a/lib/src/components/atoms/avatar.dart +++ b/lib/src/components/atoms/avatar.dart @@ -57,7 +57,7 @@ class ZdsAvatar extends StatelessWidget implements PreferredSizeWidget { /// The background color of the avatar if [initials] are used. /// - /// Defaults to [ColorScheme.mainSecondary]. + /// Defaults to [ColorScheme.secondary]. final Color? backgroundColor; @override diff --git a/lib/src/components/atoms/button.dart b/lib/src/components/atoms/button.dart index 5d4e941e..23188814 100644 --- a/lib/src/components/atoms/button.dart +++ b/lib/src/components/atoms/button.dart @@ -256,7 +256,7 @@ class ZdsButton extends StatelessWidget { // Helper function to calculate the overlay color. Color calculateOverlay({double opacity = 0.1, Color? background}) { - return customColor?.withOpacity(opacity) ?? (background ?? defaultBackground).withOpacity(opacity); + return customColor?.withValues(alpha: opacity) ?? (background ?? defaultBackground).withValues(alpha: opacity); } switch (variant) { diff --git a/lib/src/components/atoms/expandable.dart b/lib/src/components/atoms/expandable.dart index 90aac654..05c990f7 100644 --- a/lib/src/components/atoms/expandable.dart +++ b/lib/src/components/atoms/expandable.dart @@ -262,7 +262,7 @@ class _FadeOpacity extends StatelessWidget { stops: const [0, 1], colors: [ color, - color.withOpacity(0.1), + color.withValues(alpha: 0.1), ], ), ), diff --git a/lib/src/components/atoms/icon_text_button.dart b/lib/src/components/atoms/icon_text_button.dart index 967fa99b..e9007c0f 100644 --- a/lib/src/components/atoms/icon_text_button.dart +++ b/lib/src/components/atoms/icon_text_button.dart @@ -64,7 +64,7 @@ class ZdsIconTextButton extends StatelessWidget with Diagnosticable { borderRadius: borderRadius, color: backgroundColor ?? zetaColors.mainPrimary, boxShadow: [ - BoxShadow(blurRadius: 4, color: zetaColors.mainDefault.withOpacity(0.2)), + BoxShadow(blurRadius: 4, color: zetaColors.mainDefault..withValues(alpha: 0.2)), ], ), child: Material( diff --git a/lib/src/components/atoms/selection_pills.dart b/lib/src/components/atoms/selection_pills.dart index 0fad2033..c6354b75 100644 --- a/lib/src/components/atoms/selection_pills.dart +++ b/lib/src/components/atoms/selection_pills.dart @@ -69,24 +69,24 @@ class ZdsSelectionPill extends StatelessWidget { final zetaColors = Zeta.of(context).colors; final themeData = Theme.of(context); final bool disabled = onTap == null; - final ZetaColorSwatch _color = color ?? zetaColors.primitives.primary; + final ZetaColorSwatch colorSwatch = color ?? zetaColors.primitives.primary; final Color background = disabled ? zetaColors.surfaceDisabled : selected - ? _color.shade10 + ? colorSwatch.shade10 : themeData.colorScheme.surface; final Color foreground = disabled ? zetaColors.mainDisabled : selected - ? _color.shade60 + ? colorSwatch.shade60 : zetaColors.mainSubtle; final Color border = (disabled ? zetaColors.borderDisabled : selected - ? _color.shade60 + ? colorSwatch.shade60 : zetaColors.borderDefault); return ExpandTapWidget( diff --git a/lib/src/components/molecules/block_table.dart b/lib/src/components/molecules/block_table.dart index f57052ad..3855dfca 100644 --- a/lib/src/components/molecules/block_table.dart +++ b/lib/src/components/molecules/block_table.dart @@ -365,10 +365,7 @@ class _BlockTable extends State with WidgetsBindingObserver { final zeta = Zeta.of(context); final zetaColors = zeta.colors; - // print('COLOR ' + zetaColors.mainPrimary.toARGB32().toString()); - // print('COLOR ' + zetaColors.mainPrimary.toARGB32().toString()); - // print('COLOR ' + zetaColors.primitives.brightness.toString()); - //TODO: LUKE dark / light mode does not propegate proerly on PRIMARY / SECONDARY Swatches. this is happening in all places, not just this component + for (int j = 0; j < rows[index].data.length; j++) { final List columnWidgets = []; diff --git a/lib/src/components/molecules/bottom_sheet.dart b/lib/src/components/molecules/bottom_sheet.dart index 6ae5a106..39a0ea72 100644 --- a/lib/src/components/molecules/bottom_sheet.dart +++ b/lib/src/components/molecules/bottom_sheet.dart @@ -56,7 +56,7 @@ class ZdsBottomSheet extends StatelessWidget { @override Widget build(BuildContext context) { final ColorScheme colorScheme = Theme.of(context).colorScheme; - final Color sheetBackgroundColor = backgroundColor ?? Zeta.of(context).colors.surfacePrimary; + final Color sheetBackgroundColor = backgroundColor ?? Zeta.of(context).colors.surfaceDefault; final Color headerColor = header != null ? colorScheme.surface : sheetBackgroundColor; final _BottomSheetHeader headerWidget = _BottomSheetHeader(header: header, backgroundColor: headerColor); final MediaQueryData media = MediaQuery.of(context); @@ -345,7 +345,7 @@ class _BottomSheetHeader extends StatelessWidget implements PreferredSizeWidget final zetaColors = Zeta.of(context).colors; return DecoratedBox( decoration: BoxDecoration( - border: header != null ? Border(bottom: BorderSide(color: zetaColors.textDefault.withOpacity(0.1))) : null, + border: header != null ? Border(bottom: BorderSide(color: zetaColors.borderSubtle)) : null, ), child: Column( children: [ diff --git a/lib/src/components/molecules/comment.dart b/lib/src/components/molecules/comment.dart index 4ac79618..fd7e1715 100644 --- a/lib/src/components/molecules/comment.dart +++ b/lib/src/components/molecules/comment.dart @@ -177,9 +177,9 @@ class ZdsComment extends StatelessWidget { Expanded( child: Text( author!, - style: ZetaTextStyles.labelLarge.copyWith( - fontWeight: FontWeight.w500, - ), + style: Zeta.of(context).textStyles.labelLarge.copyWith( + fontWeight: FontWeight.w500, + ), maxLines: 1, overflow: TextOverflow.ellipsis, ), @@ -189,7 +189,8 @@ class ZdsComment extends StatelessWidget { padding: EdgeInsets.only(left: spacing.small), child: Text( timeStamp!, - style: ZetaTextStyles.bodyXSmall.copyWith(color: colors.mainSubtle), + style: + Zeta.of(context).textStyles.bodyXSmall.copyWith(color: colors.mainSubtle), ), ), ], @@ -323,14 +324,14 @@ class _AttachmentRow extends StatelessWidget { children: [ Text( attachment.name, - style: ZetaTextStyles.bodySmall, + style: Zeta.of(context).textStyles.bodySmall, maxLines: 1, overflow: TextOverflow.ellipsis, ), if (attachment.size != null) Text( attachment.size!, - style: ZetaTextStyles.bodySmall.copyWith(color: colors.mainSubtle), + style: Zeta.of(context).textStyles.bodySmall.copyWith(color: colors.mainSubtle), maxLines: 1, overflow: TextOverflow.ellipsis, ), diff --git a/lib/src/components/molecules/date_range_picker.dart b/lib/src/components/molecules/date_range_picker.dart index 3533a246..d8f7540b 100644 --- a/lib/src/components/molecules/date_range_picker.dart +++ b/lib/src/components/molecules/date_range_picker.dart @@ -2378,7 +2378,7 @@ class MonthItemState extends State { } Color _highlightColor(BuildContext context) { - return Theme.of(context).colorScheme.secondary.withOpacity(0.12); + return Theme.of(context).colorScheme.secondary.withValues(alpha: 0.12); } void _dayFocusChanged(bool focused) { @@ -2456,7 +2456,7 @@ class MonthItemState extends State { textDirection: textDirection, ); } else if (isDisabled) { - itemStyle = textTheme.bodyMedium?.apply(color: colorScheme.onSurface.withOpacity(0.38)); + itemStyle = textTheme.bodyMedium?.apply(color: colorScheme.onSurface.withValues(alpha: 0.38)); } else if (DateUtils.isSameDay(widget.currentDate, dayToBuild)) { // The current day gets a different text color and a circle stroke // border. @@ -2505,7 +2505,7 @@ class MonthItemState extends State { focusNode: _dayFocusNodes[day - 1], onTap: () => widget.onChanged(dayToBuild), radius: _monthItemRowHeight / 2 + 4, - splashColor: colorScheme.primary.withOpacity(0.38), + splashColor: colorScheme.primary.withValues(alpha: 0.38), onFocusChange: _dayFocusChanged, child: dayWidget, ); diff --git a/lib/src/components/molecules/dropdown.dart b/lib/src/components/molecules/dropdown.dart index d11eb2f7..a6bc1beb 100644 --- a/lib/src/components/molecules/dropdown.dart +++ b/lib/src/components/molecules/dropdown.dart @@ -210,7 +210,7 @@ class ZdsDropdownListState extends State> { menuItemStyleData: MenuItemStyleData( selectedMenuItemBuilder: (BuildContext context, Widget child) { return ColoredBox( - color: themeData.colorScheme.secondary.withOpacity(0.1), + color: themeData.colorScheme.secondary.withValues(alpha: 0.1), child: child, ); }, diff --git a/lib/src/components/molecules/expansion_tile.dart b/lib/src/components/molecules/expansion_tile.dart index c876e8cf..e9fc3ac4 100644 --- a/lib/src/components/molecules/expansion_tile.dart +++ b/lib/src/components/molecules/expansion_tile.dart @@ -367,7 +367,7 @@ class ZdsExpansionTileState extends State with SingleTickerPro children: [ DefaultTextStyle( style: safeTextStyle(themeData.textTheme.bodyLarge) - .copyWith(color: zeta.colors.textDefault), + .copyWith(color: zeta.colors.mainDefault), maxLines: 1, overflow: TextOverflow.ellipsis, child: widget.title, diff --git a/lib/src/components/molecules/fields_list_tile.dart b/lib/src/components/molecules/fields_list_tile.dart index 7094750a..894bd12f 100644 --- a/lib/src/components/molecules/fields_list_tile.dart +++ b/lib/src/components/molecules/fields_list_tile.dart @@ -62,7 +62,7 @@ class ZdsFieldsListTile extends StatelessWidget { /// The textStyle used for the starting elements of each field. /// - /// Defaults to [TextTheme.titleSmall] with [ZetaColorSwatch.text] color. + /// Defaults to [TextTheme.titleSmall] with [ZetaColors.mainDefault] color. final TextStyle? fieldsStartTextStyle; /// The textStyle used for the end elements of each field. diff --git a/lib/src/components/molecules/input_dialog.dart b/lib/src/components/molecules/input_dialog.dart index 3ba16ec4..50ac7b77 100644 --- a/lib/src/components/molecules/input_dialog.dart +++ b/lib/src/components/molecules/input_dialog.dart @@ -162,7 +162,7 @@ class ZdsInputDialogState extends State { Text( widget.title!, style: theme.textTheme.displaySmall?.copyWith( - color: zetaColors.textDefault, + color: zetaColors.mainDefault, ), ), Padding( diff --git a/lib/src/components/molecules/interval_time_picker.dart b/lib/src/components/molecules/interval_time_picker.dart index fbbd0696..1f69a649 100644 --- a/lib/src/components/molecules/interval_time_picker.dart +++ b/lib/src/components/molecules/interval_time_picker.dart @@ -280,8 +280,8 @@ class _HourMinuteControl extends StatelessWidget { final Color backgroundColor = timePickerTheme.hourMinuteColor ?? WidgetStateColor.resolveWith((Set states) { return states.contains(WidgetState.selected) - ? themeData.colorScheme.primary.withOpacity(isDark ? 0.24 : 0.12) - : themeData.colorScheme.onSurface.withOpacity(0.12); + ? themeData.colorScheme.primary.withValues(alpha: isDark ? 0.24 : 0.12) + : themeData.colorScheme.onSurface.withValues(alpha: 0.12); }); final TextStyle style = timePickerTheme.hourMinuteTextStyle ?? themeData.textTheme.displayMedium!; final ShapeBorder shape = timePickerTheme.hourMinuteShape ?? _kDefaultShape; @@ -554,7 +554,9 @@ class _DayPeriodControl extends StatelessWidget { final bool isDark = colorScheme.brightness == Brightness.dark; final Color textColor = timePickerTheme.dayPeriodTextColor ?? WidgetStateColor.resolveWith((Set states) { - return states.contains(WidgetState.selected) ? colorScheme.primary : colorScheme.onSurface.withOpacity(0.60); + return states.contains(WidgetState.selected) + ? colorScheme.primary + : colorScheme.onSurface.withValues(alpha: 0.60); }); final Color backgroundColor = timePickerTheme.dayPeriodColor ?? WidgetStateColor.resolveWith((Set states) { @@ -563,7 +565,7 @@ class _DayPeriodControl extends StatelessWidget { // and allows the optional elevation overlay for dark mode to be // visible. return states.contains(WidgetState.selected) - ? colorScheme.primary.withOpacity(isDark ? 0.24 : 0.12) + ? colorScheme.primary.withValues(alpha: isDark ? 0.24 : 0.12) : Colors.transparent; }); final bool amSelected = selectedTime.period == DayPeriod.am; @@ -581,7 +583,7 @@ class _DayPeriodControl extends StatelessWidget { timePickerTheme.dayPeriodShape ?? const RoundedRectangleBorder(borderRadius: _kDefaultBorderRadius); final BorderSide borderSide = timePickerTheme.dayPeriodBorderSide ?? BorderSide( - color: Color.alphaBlend(colorScheme.onSurface.withOpacity(0.38), colorScheme.surface), + color: Color.alphaBlend(colorScheme.onSurface.withValues(alpha: 0.38), colorScheme.surface), ); // Apply the custom borderSide. shape = shape.copyWith( @@ -1289,7 +1291,8 @@ class _DialState extends State<_Dial> with SingleTickerProviderStateMixin { Widget build(BuildContext context) { final ThemeData theme = Theme.of(context); final TimePickerThemeData pickerTheme = TimePickerTheme.of(context); - final Color backgroundColor = pickerTheme.dialBackgroundColor ?? themeData.colorScheme.onSurface.withOpacity(0.12); + final Color backgroundColor = + pickerTheme.dialBackgroundColor ?? themeData.colorScheme.onSurface.withValues(alpha: 0.12); final Color accentColor = pickerTheme.dialHandColor ?? themeData.colorScheme.primary; final Color primaryLabelColor = WidgetStateProperty.resolveAs(pickerTheme.dialTextColor, {}) ?? themeData.colorScheme.onSurface; @@ -1865,12 +1868,12 @@ class _HourMinuteTextFieldState extends State<_HourMinuteTextField> with Restora focusedErrorBorder: OutlineInputBorder( borderSide: BorderSide(color: colorScheme.error, width: 2), ), - hintStyle: widget.style.copyWith(color: colorScheme.onSurface.withOpacity(0.36)), + hintStyle: widget.style.copyWith(color: colorScheme.onSurface.withValues(alpha: 0.36)), // TODO(rami-a): Remove this logic once https://github.com/flutter/flutter/issues/54104 is fixed. errorStyle: const TextStyle(fontSize: 0, height: 0), // Prevent the error text from appearing. ); } - final Color unfocusedFillColor = timePickerTheme.hourMinuteColor ?? colorScheme.onSurface.withOpacity(0.12); + final Color unfocusedFillColor = timePickerTheme.hourMinuteColor ?? colorScheme.onSurface.withValues(alpha: 0.12); // If screen reader is in use, make the hint text say hours/minutes. // Otherwise, remove the hint text when focused because the centered cursor // appears odd above the hint text. @@ -2381,8 +2384,8 @@ class _IntervalTimePickerDialogState extends State wit if (_entryMode.value == TimePickerEntryMode.dial || _entryMode.value == TimePickerEntryMode.input) IconButton( color: TimePickerTheme.of(context).entryModeIconColor ?? - theme.colorScheme.onSurface.withOpacity( - theme.colorScheme.brightness == Brightness.dark ? 1.0 : 0.6, + theme.colorScheme.onSurface.withValues( + alpha: theme.colorScheme.brightness == Brightness.dark ? 1.0 : 0.6, ), onPressed: _handleEntryModeToggle, icon: Icon(_entryMode.value == TimePickerEntryMode.dial ? Icons.keyboard : Icons.access_time), diff --git a/lib/src/components/molecules/network_avatar.dart b/lib/src/components/molecules/network_avatar.dart index cd73c20b..5e61dda6 100644 --- a/lib/src/components/molecules/network_avatar.dart +++ b/lib/src/components/molecules/network_avatar.dart @@ -53,7 +53,7 @@ class ZdsNetworkAvatar extends StatelessWidget implements PreferredSizeWidget { /// The background color of this avatar if the [initials] are shown. /// - /// Defaults to [ColorScheme.mainSecondary]. + /// Defaults to [ColorScheme.secondary]. final Color? backgroundColor; /// Semantic label for description of image diff --git a/lib/src/components/molecules/selectable_list_tile.dart b/lib/src/components/molecules/selectable_list_tile.dart index a1f22a24..8e9ffbc4 100644 --- a/lib/src/components/molecules/selectable_list_tile.dart +++ b/lib/src/components/molecules/selectable_list_tile.dart @@ -7,7 +7,7 @@ import '../../../../zds_flutter.dart'; /// /// There are two variants: /// * [ZdsSelectableListTile], which returns a list tile that changes its color when selected. -/// When a listTile is marked as selected, its background will be colored with the [ColorScheme.mainSecondary] at 10% +/// When a listTile is marked as selected, its background will be colored with the [ColorScheme.secondary] at 10% /// opacity. When it's unselected, the background will use [ColorScheme.surface] /// * [ZdsSelectableListTile.checkable], which returns a list tile that adds a check at the end of the tile when selected. /// diff --git a/lib/src/components/molecules/slidable_button.dart b/lib/src/components/molecules/slidable_button.dart index a5a3ea0c..559e3eb0 100644 --- a/lib/src/components/molecules/slidable_button.dart +++ b/lib/src/components/molecules/slidable_button.dart @@ -162,7 +162,7 @@ class ZdsSlidableButtonState extends State { ? widget.buttonColorEnd! : widget.onSlideComplete != null ? widget.buttonColor - : widget.buttonColor.withOpacity(0.5); + : widget.buttonColor.withValues(alpha: 0.5); return Semantics( slider: true, diff --git a/lib/src/components/molecules/star_rating.dart b/lib/src/components/molecules/star_rating.dart index d6e71750..f6175f53 100644 --- a/lib/src/components/molecules/star_rating.dart +++ b/lib/src/components/molecules/star_rating.dart @@ -118,7 +118,7 @@ class _ZdsStarRatingState extends State { child: AnimatedContainer( duration: const Duration(milliseconds: 250), decoration: BoxDecoration( - color: colors.primitives.cool.shade30.withOpacity(_selected ? 1 : 0), + color: colors.primitives.cool.shade30.withValues(alpha: _selected ? 1 : 0), borderRadius: BorderRadius.all(borderRadius), ), child: Row( diff --git a/lib/src/components/molecules/tab_bar.dart b/lib/src/components/molecules/tab_bar.dart index 7039a3c8..c6350c72 100644 --- a/lib/src/components/molecules/tab_bar.dart +++ b/lib/src/components/molecules/tab_bar.dart @@ -149,7 +149,7 @@ class ZdsTabBar extends StatelessWidget implements PreferredSizeWidget { background: zetaColors.mainPrimary, indicator: zetaColors.mainPrimary.onColor, selectedText: zetaColors.mainPrimary.onColor, - unselectedText: zetaColors.mainPrimary.onColor.withOpacity(0.7), + unselectedText: zetaColors.mainPrimary.onColor.withValues(alpha: 0.7), ); case ZdsTabBarColor.basic: return _tabBarStyle( @@ -177,7 +177,7 @@ class ZdsTabBar extends StatelessWidget implements PreferredSizeWidget { background: appBarTheme.backgroundColor ?? zetaColors.surfacePrimary, indicator: appBarTheme.foregroundColor ?? zetaColors.mainPrimary, selectedText: appBarTheme.foregroundColor ?? zetaColors.mainDefault, - unselectedText: appBarTheme.foregroundColor?.withOpacity(0.7) ?? zetaColors.mainSubtle, + unselectedText: appBarTheme.foregroundColor?.withValues(alpha: 0.7) ?? zetaColors.mainSubtle, ); } } diff --git a/lib/src/components/molecules/toolbar.dart b/lib/src/components/molecules/toolbar.dart index 634db23d..883ec3ab 100644 --- a/lib/src/components/molecules/toolbar.dart +++ b/lib/src/components/molecules/toolbar.dart @@ -101,7 +101,7 @@ class ZdsToolbar extends StatelessWidget { maxLines: 1, overflow: TextOverflow.ellipsis, style: safeTextStyle(theme.primaryTextTheme.titleSmall).copyWith( - color: effectiveForeground.withOpacity(0.8), + color: effectiveForeground.withValues(alpha: 0.8), ), child: subtitle!, ), diff --git a/lib/src/components/molecules/vertical_nav.dart b/lib/src/components/molecules/vertical_nav.dart index ea0fc140..4ecbc52c 100644 --- a/lib/src/components/molecules/vertical_nav.dart +++ b/lib/src/components/molecules/vertical_nav.dart @@ -173,7 +173,7 @@ class _ZdsVerticalNavState extends State { color: themeData.colorScheme.surface, boxShadow: [ BoxShadow( - color: themeData.colorScheme.onSurface.withOpacity(0.25), + color: themeData.colorScheme.onSurface.withValues(alpha: 0.25), blurRadius: 1, offset: const Offset(1, 0), ), @@ -247,7 +247,7 @@ class _SelectedBackground extends StatelessWidget { ), boxShadow: [ BoxShadow( - color: themeData.cardTheme.shadowColor ?? Colors.black.withOpacity(0.25), + color: themeData.cardTheme.shadowColor ?? Colors.black.withValues(alpha: 0.25), blurRadius: 1, spreadRadius: 1, offset: const Offset(-1, 1), diff --git a/lib/src/components/organisms/app_bar.dart b/lib/src/components/organisms/app_bar.dart index f590acbd..20d2f797 100644 --- a/lib/src/components/organisms/app_bar.dart +++ b/lib/src/components/organisms/app_bar.dart @@ -140,7 +140,7 @@ class ZdsAppBar extends StatelessWidget implements PreferredSizeWidget { DefaultTextStyle.merge( child: subtitle!, style: theme.primaryTextTheme.titleSmall - ?.copyWith(color: appBarTheme.foregroundColor?.withOpacity(0.8)), + ?.copyWith(color: appBarTheme.foregroundColor?.withValues(alpha: 0.8)), ), ], ), diff --git a/lib/src/components/organisms/camera/camera_page.dart b/lib/src/components/organisms/camera/camera_page.dart index 8fa59f78..190e4618 100644 --- a/lib/src/components/organisms/camera/camera_page.dart +++ b/lib/src/components/organisms/camera/camera_page.dart @@ -664,7 +664,7 @@ class _CameraButtonPainter extends CustomPainter { ..isAntiAlias = true; final radius = size.width / 2; final center = Offset(size.width / 2, size.height / 2); - bgPainter.color = Colors.white.withOpacity(.5); + bgPainter.color = Colors.white.withValues(alpha: .5); canvas.drawCircle(center, radius, bgPainter); bgPainter.color = Colors.white; @@ -687,11 +687,11 @@ class _VideoButtonPainter extends CustomPainter { ..isAntiAlias = true; final radius = size.width / 2; final center = Offset(size.width / 2, size.height / 2); - bgPainter.color = Colors.white.withOpacity(.5); + bgPainter.color = Colors.white.withValues(alpha: .5); canvas.drawCircle(center, radius, bgPainter); if (isRecording) { - bgPainter.color = ZetaPrimitivesLight().red; + bgPainter.color = const ZetaPrimitivesLight().red; canvas.drawRRect( RRect.fromRectAndRadius( Rect.fromLTWH( @@ -705,7 +705,7 @@ class _VideoButtonPainter extends CustomPainter { bgPainter, ); } else { - bgPainter.color = ZetaPrimitivesLight().red; + bgPainter.color = const ZetaPrimitivesLight().red; canvas.drawCircle(center, radius - 8, bgPainter); } } diff --git a/lib/src/components/organisms/chat/audio_decoration.dart b/lib/src/components/organisms/chat/audio_decoration.dart index b71d77a0..77c48e32 100644 --- a/lib/src/components/organisms/chat/audio_decoration.dart +++ b/lib/src/components/organisms/chat/audio_decoration.dart @@ -123,7 +123,7 @@ class ZdsAudioRecorderDecoration extends _AudioDecoration { /// Resolves the send icon color to the secondary color if not defined Color resolveSendIconTint(BuildContext context) { - return sendIconTint ?? Theme.of(context).colorScheme.secondary; + return sendIconTint ?? Zeta.of(context).colors.mainSecondary; } /// Copies the given properties into a new [ZdsAudioRecorderDecoration] diff --git a/lib/src/components/organisms/chat/audio_player.dart b/lib/src/components/organisms/chat/audio_player.dart index e3c7d51c..936a2cfd 100644 --- a/lib/src/components/organisms/chat/audio_player.dart +++ b/lib/src/components/organisms/chat/audio_player.dart @@ -239,7 +239,7 @@ class ZdsAudioPlayerState extends State { final backgroundColor = widget.decoration.resolveBackgroundColor(context); final thumbColor = widget.decoration.resolveThumbColor(context); final waveColor = widget.decoration.resolveWaveColor(context); - final inactiveTrackColor = backgroundColor.withOpacity(0.5); + final inactiveTrackColor = backgroundColor.withValues(alpha: 0.5); return Material( color: backgroundColor, @@ -253,7 +253,7 @@ class ZdsAudioPlayerState extends State { IconButton( icon: Icon( playing ? Icons.pause_circle_outline : Icons.play_circle_outline, - color: !_disabled ? foregroundColor : foregroundColor.withOpacity(0.5), + color: !_disabled ? foregroundColor : foregroundColor.withValues(alpha: 0.5), ), onPressed: !_disabled ? playing @@ -353,14 +353,14 @@ class _PlaybackProgress extends StatelessWidget { child: SliderTheme( data: SliderTheme.of(context).copyWith( activeTrackColor: Colors.transparent, - inactiveTrackColor: backgroundColor.withOpacity(0.4), + inactiveTrackColor: backgroundColor.withValues(alpha: 0.4), trackShape: const RectangularSliderTrackShape(), thumbShape: enabled ? const RoundSliderThumbShape() : SliderComponentShape.noThumb, trackHeight: box.maxHeight, thumbColor: thumbColor, disabledThumbColor: thumbColor, disabledActiveTrackColor: Colors.transparent, - disabledInactiveTrackColor: backgroundColor.withOpacity(0.4), + disabledInactiveTrackColor: backgroundColor.withValues(alpha: 0.4), ), child: Slider( value: min(value, maxValue), diff --git a/lib/src/components/organisms/chat/message_body/attachment.dart b/lib/src/components/organisms/chat/message_body/attachment.dart index 699feb8f..6dba9629 100644 --- a/lib/src/components/organisms/chat/message_body/attachment.dart +++ b/lib/src/components/organisms/chat/message_body/attachment.dart @@ -76,7 +76,7 @@ class ZdsChatAttachmentWidget extends StatelessWidget { const SizedBox.square(dimension: 2), Text( _fileName, - style: Theme.of(context).textTheme.bodyLarge?.copyWith(color: colors.textDefault), + style: Theme.of(context).textTheme.bodyLarge?.copyWith(color: colors.mainDefault), maxLines: 3, overflow: TextOverflow.ellipsis, ), diff --git a/lib/src/components/organisms/chat/message_body/chat_utils.dart b/lib/src/components/organisms/chat/message_body/chat_utils.dart index 4c822040..8de253bf 100644 --- a/lib/src/components/organisms/chat/message_body/chat_utils.dart +++ b/lib/src/components/organisms/chat/message_body/chat_utils.dart @@ -296,7 +296,7 @@ class ZdsMessage { /// Optional custom color used to display sender name. /// - /// Defaults to using [ZetaColors.textDefault]. + /// Defaults to using [ZetaColors.mainDefault]. final Color? senderColor; /// [ZdsChatMessageStatus] of message. diff --git a/lib/src/components/organisms/chat/message_body/file_preview.dart b/lib/src/components/organisms/chat/message_body/file_preview.dart index dcfbb3da..9fb44513 100644 --- a/lib/src/components/organisms/chat/message_body/file_preview.dart +++ b/lib/src/components/organisms/chat/message_body/file_preview.dart @@ -126,7 +126,7 @@ class _ZdsChatFilePreviewState extends State { ? widget.attachment.content : null, imageUrl: widget.attachment.type == ZdsChatAttachmentType.imageNetwork - ? widget.attachment.content + ? widget.attachment.content ?? widget.attachment.url.toString() : null, body: heroWidget, ), @@ -234,8 +234,8 @@ class __VideoState extends State<_Video> { : await _videoController!.play(); setState(() {}); }, - backgroundColor: Zeta.of(context).colors.primitives.cool.shade30.withOpacity(0.7), - hoverColor: Zeta.of(context).colors.primitives.cool.shade30.withOpacity(0.5), + backgroundColor: Zeta.of(context).colors.primitives.cool.shade30.withValues(alpha: 0.7), + hoverColor: Zeta.of(context).colors.primitives.cool.shade30.withValues(alpha: 0.5), hoverElevation: 0, child: Icon( _videoController!.value.isPlaying ? Icons.pause : Icons.play_arrow, @@ -275,7 +275,7 @@ class _FullScreenViewer extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( - backgroundColor: Colors.black.withOpacity(0.8), + backgroundColor: Colors.black.withValues(alpha: 0.8), extendBodyBehindAppBar: true, appBar: AppBar( backgroundColor: Colors.black, @@ -293,13 +293,13 @@ class _FullScreenViewer extends StatelessWidget { const Base64Decoder().convert(imageBytes!.base64!), mimeType: imageBytes!.base64Extension, ); - await Share.shareXFiles([image]); + await SharePlus.instance.share(ShareParams(files: [image])); } if (imagePath != null) { - await Share.shareXFiles([XFile(imagePath!)]); + await SharePlus.instance.share(ShareParams(files: [XFile(imagePath!)])); } if (imageUrl != null) { - await Share.shareUri(Uri.parse(imageUrl!)); + await SharePlus.instance.share(ShareParams(uri: Uri.parse(imageUrl!))); } } : null, diff --git a/lib/src/components/organisms/chat/message_body/link_preview.dart b/lib/src/components/organisms/chat/message_body/link_preview.dart index fdc64feb..7b3a15f3 100644 --- a/lib/src/components/organisms/chat/message_body/link_preview.dart +++ b/lib/src/components/organisms/chat/message_body/link_preview.dart @@ -132,7 +132,7 @@ class _ZdsChatLinkPreviewState extends State { borderRadius: const BorderRadius.all(Radius.circular(6)), child: Container( decoration: BoxDecoration( - color: Zeta.of(context).colors.primitives.warm.shade30.withOpacity(0.2), + color: Zeta.of(context).colors.primitives.warm.shade30.withValues(alpha: 0.2), borderRadius: const BorderRadius.all(Radius.circular(6)), ), padding: const EdgeInsets.all(14), diff --git a/lib/src/components/organisms/chat/message_body/reacts_tags.dart b/lib/src/components/organisms/chat/message_body/reacts_tags.dart index f8708185..1259720d 100644 --- a/lib/src/components/organisms/chat/message_body/reacts_tags.dart +++ b/lib/src/components/organisms/chat/message_body/reacts_tags.dart @@ -109,7 +109,7 @@ class _ChatReactionsPill extends StatelessWidget { borderRadius: const BorderRadius.all(Radius.circular(10)), boxShadow: [ BoxShadow( - color: Theme.of(context).colorScheme.shadow.withOpacity(0.1), + color: Theme.of(context).colorScheme.shadow.withValues(alpha: 0.1), blurRadius: 1, offset: const Offset(0, 1), ), @@ -217,7 +217,7 @@ class _ChatTagsPill extends StatelessWidget { borderRadius: const BorderRadius.all(Radius.circular(10)), boxShadow: [ BoxShadow( - color: Theme.of(context).colorScheme.shadow.withOpacity(0.1), + color: Theme.of(context).colorScheme.shadow.withValues(alpha: 0.1), blurRadius: 1, offset: const Offset(0, 1), ), diff --git a/lib/src/components/organisms/chat/message_input.dart b/lib/src/components/organisms/chat/message_input.dart index 25c9034b..105efb81 100644 --- a/lib/src/components/organisms/chat/message_input.dart +++ b/lib/src/components/organisms/chat/message_input.dart @@ -305,7 +305,7 @@ class ZdsMessageInputState extends State with SingleTickerProvi boxShadow: [ BoxShadow( offset: const Offset(0, -1), - color: Theme.of(context).colorScheme.shadow.withOpacity(0.1), + color: Theme.of(context).colorScheme.shadow.withValues(alpha: 0.1), blurRadius: 2, ), BoxShadow(offset: const Offset(0, 1), color: zetaColors.surfaceDefault, blurRadius: 2), @@ -475,7 +475,7 @@ class ZdsMessageInputState extends State with SingleTickerProvi container: true, child: Text( widget.addAttachment ?? ComponentStrings.of(context).get('ADD', 'Add'), - style: ZetaTextStyles.h5, + style: Zeta.of(context).textStyles.h5, overflow: TextOverflow.ellipsis, ), ), diff --git a/lib/src/components/organisms/day_picker.dart b/lib/src/components/organisms/day_picker.dart index fdff9a11..d9848d0a 100644 --- a/lib/src/components/organisms/day_picker.dart +++ b/lib/src/components/organisms/day_picker.dart @@ -276,7 +276,7 @@ class _ZdsDayPickerState extends State { if (widget.header != null) Text( widget.header!, - style: Theme.of(context).textTheme.titleSmall?.copyWith(color: Zeta.of(context).colors.textDefault), + style: Theme.of(context).textTheme.titleSmall?.copyWith(color: Zeta.of(context).colors.mainDefault), ).paddingOnly(left: 6), if (widget.allowMultiSelect) SizedBox( diff --git a/lib/src/components/organisms/html_preview/html_container.dart b/lib/src/components/organisms/html_preview/html_container.dart index 0af8768c..e28de0eb 100644 --- a/lib/src/components/organisms/html_preview/html_container.dart +++ b/lib/src/components/organisms/html_preview/html_container.dart @@ -323,13 +323,13 @@ class _ZdsHtmlContainerState extends State with FrameCallbackM begin: Alignment.topCenter, end: Alignment.bottomCenter, colors: [ - surfaceColor.surface.withOpacity(0.3), - surfaceColor.surface.withOpacity(0.4), - surfaceColor.surface.withOpacity(0.5), - surfaceColor.surface.withOpacity(0.6), - surfaceColor.surface.withOpacity(0.7), - surfaceColor.surface.withOpacity(0.8), - surfaceColor.surface.withOpacity(0.9), + surfaceColor.surface.withValues(alpha: 0.3), + surfaceColor.surface.withValues(alpha: 0.4), + surfaceColor.surface.withValues(alpha: 0.5), + surfaceColor.surface.withValues(alpha: 0.6), + surfaceColor.surface.withValues(alpha: 0.7), + surfaceColor.surface.withValues(alpha: 0.8), + surfaceColor.surface.withValues(alpha: 0.9), surfaceColor.surface, ], ), diff --git a/lib/src/components/organisms/html_preview/video_html_extension.dart b/lib/src/components/organisms/html_preview/video_html_extension.dart index 91c5c9f5..33ab902c 100644 --- a/lib/src/components/organisms/html_preview/video_html_extension.dart +++ b/lib/src/components/organisms/html_preview/video_html_extension.dart @@ -38,7 +38,7 @@ class ZdsVideoHtmlExtension extends HtmlExtension { builder: (BuildContext ctx, BoxConstraints box) { return DecoratedBox( decoration: BoxDecoration( - border: Border.all(color: Theme.of(ctx).colorScheme.onSurface.withOpacity(0.4), width: 0.5), + border: Border.all(color: Theme.of(ctx).colorScheme.onSurface.withValues(alpha: 0.4), width: 0.5), ), child: ZdsVideoWidget( context: context, diff --git a/lib/src/components/organisms/image_editor/utils/shape_painter.dart b/lib/src/components/organisms/image_editor/utils/shape_painter.dart index 320fa029..78531411 100644 --- a/lib/src/components/organisms/image_editor/utils/shape_painter.dart +++ b/lib/src/components/organisms/image_editor/utils/shape_painter.dart @@ -51,7 +51,7 @@ class ShapePainter extends CustomPainter { // Draw the preview shape if it exists if (previewShape != null) { - paint.color = previewShape!.color.withOpacity(0.5); // Semi-transparent preview + paint.color = previewShape!.color.withValues(alpha: 0.5); // Semi-transparent preview _drawShape(canvas, paint, previewShape!); } } diff --git a/lib/src/components/organisms/profile.dart b/lib/src/components/organisms/profile.dart index 676ca808..1706eb94 100644 --- a/lib/src/components/organisms/profile.dart +++ b/lib/src/components/organisms/profile.dart @@ -83,7 +83,7 @@ class ZdsProfile extends StatelessWidget { label: semanticLabelTitle, child: nameText.textStyle( themeData.textTheme.displaySmall?.copyWith( - color: zetaColors.textDefault, + color: zetaColors.mainDefault, ), ), ), diff --git a/lib/src/components/organisms/properties_list.dart b/lib/src/components/organisms/properties_list.dart index 5e8bc082..bb3d9f89 100644 --- a/lib/src/components/organisms/properties_list.dart +++ b/lib/src/components/organisms/properties_list.dart @@ -110,7 +110,7 @@ class ZdsPropertiesList extends StatelessWidget { label.textStyle(themeData.textTheme.bodyLarge), Flexible( child: value.textStyle( - themeData.textTheme.titleSmall?.copyWith(color: zetaColors.textDefault), + themeData.textTheme.titleSmall?.copyWith(color: zetaColors.mainDefault), ), ), ], @@ -124,7 +124,7 @@ class ZdsPropertiesList extends StatelessWidget { children: [ label.textStyle(themeData.textTheme.titleSmall?.copyWith(color: zetaColors.mainSubtle)).space(8), value.textStyle( - themeData.textTheme.bodyLarge?.copyWith(color: zetaColors.textDefault), + themeData.textTheme.bodyLarge?.copyWith(color: zetaColors.mainDefault), overflow: TextOverflow.clip, ), ], diff --git a/lib/src/components/organisms/quill_editor/color_button.dart b/lib/src/components/organisms/quill_editor/color_button.dart index a4746ce6..4965e67d 100644 --- a/lib/src/components/organisms/quill_editor/color_button.dart +++ b/lib/src/components/organisms/quill_editor/color_button.dart @@ -466,9 +466,7 @@ Color _hexToColor(String? hexString) { return Color(int.tryParse(buffer.toString(), radix: 16) ?? 0xFF000000); } -String _colorToHex(Color color) { - return color.value.toRadixString(16).padLeft(8, '0').toUpperCase(); -} +String _colorToHex(Color color) => color.toHex(); Color _stringToColor(String? colorString, [Color? originalColor]) { if (colorString == null) return originalColor ?? Colors.black; diff --git a/lib/src/components/organisms/quill_editor/material_picker.dart b/lib/src/components/organisms/quill_editor/material_picker.dart index e3342489..f496838b 100644 --- a/lib/src/components/organisms/quill_editor/material_picker.dart +++ b/lib/src/components/organisms/quill_editor/material_picker.dart @@ -125,7 +125,7 @@ class _ZdsMaterialPickerState extends State { void initState() { for (final List colors in _colorTypes) { _shadingTypes(colors).forEach((Map color) { - if (widget.pickerColor.value == color.keys.first.value) { + if (widget.pickerColor.toARGB32() == color.keys.first.toARGB32()) { return setState(() { _currentColorType = colors; _currentShading = color.keys.first; diff --git a/lib/src/components/organisms/quill_editor/quill_editor_page.dart b/lib/src/components/organisms/quill_editor/quill_editor_page.dart index 2740fe14..add632cb 100644 --- a/lib/src/components/organisms/quill_editor/quill_editor_page.dart +++ b/lib/src/components/organisms/quill_editor/quill_editor_page.dart @@ -425,7 +425,7 @@ class _ZdsQuillEditorPageState extends State with FrameCallb iconSize: 24, controller: _quillController, enabledColor: appBarFg, - disabledColor: appBarFg.withOpacity(0.3), + disabledColor: appBarFg.withValues(alpha: 0.3), afterPressed: _afterUndoRedo, undo: true, ), @@ -435,7 +435,7 @@ class _ZdsQuillEditorPageState extends State with FrameCallb iconSize: 24, controller: _quillController, enabledColor: appBarFg, - disabledColor: appBarFg.withOpacity(0.3), + disabledColor: appBarFg.withValues(alpha: 0.3), afterPressed: _afterUndoRedo, undo: false, ), diff --git a/lib/src/utils/theme/theme.dart b/lib/src/utils/theme/theme.dart index 1fa29496..7af8696b 100644 --- a/lib/src/utils/theme/theme.dart +++ b/lib/src/utils/theme/theme.dart @@ -11,7 +11,7 @@ ZdsBottomBarThemeData buildZdsBottomBarThemeData(BuildContext context) { shadows: [ BoxShadow( offset: const Offset(0, -1), - color: Zeta.of(context).colors.mainDefault.withOpacity(0.1), + color: Zeta.of(context).colors.mainDefault.withValues(alpha: 0.1), blurRadius: 2, ), ], @@ -328,7 +328,7 @@ extension ThemeExtension on ThemeData { ), ), textSelectionTheme: TextSelectionThemeData(cursorColor: colorScheme.onSurface), - hintColor: colorScheme.onSurface.withOpacity(0.5), + hintColor: colorScheme.onSurface.withValues(alpha: 0.5), cardTheme: cardTheme.copyWith(shadowColor: Colors.transparent), ); case ZdsSearchFieldVariant.elevated: @@ -338,7 +338,7 @@ extension ThemeExtension on ThemeData { cursorColor: colorScheme.onSurface, ), cardTheme: cardTheme, - hintColor: colorScheme.onSurface.withOpacity(0.5), + hintColor: colorScheme.onSurface.withValues(alpha: 0.5), ); } } @@ -346,7 +346,9 @@ extension ThemeExtension on ThemeData { /// Custom theme for [ZdsDateTimePicker]. ThemeData get zdsDateTimePickerTheme { return copyWith( - dialogBackgroundColor: colorScheme.brightness == Brightness.dark ? colorScheme.surface : null, + dialogTheme: dialogTheme.copyWith( + backgroundColor: colorScheme.brightness == Brightness.dark ? colorScheme.surface : null, + ), colorScheme: colorScheme.copyWith( primary: colorScheme.secondary.withLight(colorScheme.brightness == Brightness.dark ? 0.75 : 1), onPrimary: colorScheme.onSecondary, diff --git a/lib/src/utils/theme/theme_builders/bottom_app_bar_theme.dart b/lib/src/utils/theme/theme_builders/bottom_app_bar_theme.dart index c53c34a0..e9ec5d81 100644 --- a/lib/src/utils/theme/theme_builders/bottom_app_bar_theme.dart +++ b/lib/src/utils/theme/theme_builders/bottom_app_bar_theme.dart @@ -20,7 +20,7 @@ extension ZetaBottomAppBarTheme on ZetaSemantics { /// The shadow color of the `BottomAppBar` is set to the `mainSubtle` color of the `ZetaSemantics`, /// but with an opacity of 0.1. - shadowColor: colors.mainSubtle.withOpacity(0.1), + shadowColor: colors.mainSubtle.withValues(alpha: 0.1), /// Padding inside the `BottomAppBar`. This is constant and set to be symmetric both horizontally /// and vertically. When running on the web, vertical padding is 8, otherwise it's 4. diff --git a/lib/src/utils/theme/theme_builders/button_theme.dart b/lib/src/utils/theme/theme_builders/button_theme.dart index 11fa4d93..59dec0ce 100644 --- a/lib/src/utils/theme/theme_builders/button_theme.dart +++ b/lib/src/utils/theme/theme_builders/button_theme.dart @@ -1,8 +1,6 @@ import 'package:flutter/material.dart'; -import 'package:zeta_flutter/zeta_flutter.dart'; import '../../../../zds_flutter.dart'; -import '../../../components/atoms/button.dart' show ZdsButton, ZdsButtonVariant; /// An extension on [ZetaSemantics] class, offering methods for creating /// text, elevated, and outlined button themes for this [ZetaSemantics]. diff --git a/lib/src/utils/theme/theme_builders/card_theme.dart b/lib/src/utils/theme/theme_builders/card_theme.dart index e4ae5783..43dfeff8 100644 --- a/lib/src/utils/theme/theme_builders/card_theme.dart +++ b/lib/src/utils/theme/theme_builders/card_theme.dart @@ -19,7 +19,7 @@ extension ZetaCardTheme on ZetaSemantics { margin: EdgeInsets.all(primitives.x1), /// Setting shadowColor with a bit of opacity - shadowColor: colors.mainSubtle.withOpacity(0.1), + shadowColor: colors.mainSubtle.withValues(alpha: 0.1), /// Customizing the shape of the Card shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(primitives.x4)), diff --git a/lib/src/utils/theme/theme_builders/switch_theme.dart b/lib/src/utils/theme/theme_builders/switch_theme.dart index 00a0c7d1..adb68e2d 100644 --- a/lib/src/utils/theme/theme_builders/switch_theme.dart +++ b/lib/src/utils/theme/theme_builders/switch_theme.dart @@ -33,7 +33,7 @@ extension SwitchExtension on ZetaSemantics { /// Defines the overlay [Color] for the [Switch] when it's hovered. overlayColor: widgetStatePropertyResolver( - hoveredValue: Colors.black.withOpacity(0.1), + hoveredValue: Colors.black.withValues(alpha: 0.1), ), /// The smallest detectable part of [Switch] that can lead to a tap event. diff --git a/lib/src/utils/theme/theme_builders/text_selection_theme.dart b/lib/src/utils/theme/theme_builders/text_selection_theme.dart index bfa624c9..16228797 100644 --- a/lib/src/utils/theme/theme_builders/text_selection_theme.dart +++ b/lib/src/utils/theme/theme_builders/text_selection_theme.dart @@ -22,7 +22,7 @@ extension TextSelectionExtension on ZetaSemantics { cursorColor: colors.mainSecondary, /// Indicates the color of the text selection toolbar. - selectionColor: colors.surfaceSecondarySubtle.withOpacity(0.5), + selectionColor: colors.surfaceSecondarySubtle.withValues(alpha: 0.5), /// Color of the text selection handle. selectionHandleColor: colors.stateSecondarySelected, diff --git a/lib/src/utils/theme/theme_builders/zeta_theme.dart b/lib/src/utils/theme/theme_builders/zeta_theme.dart index 93870400..8892fb39 100644 --- a/lib/src/utils/theme/theme_builders/zeta_theme.dart +++ b/lib/src/utils/theme/theme_builders/zeta_theme.dart @@ -129,7 +129,7 @@ extension ZetaThemeBuilder on ZetaSemantics { radioTheme: radioThemeData(), scaffoldBackgroundColor: colors.surfaceWarm, searchBarTheme: searchBarTheme(textTheme), - shadowColor: colors.borderDisabled.withOpacity(0.7), + shadowColor: colors.borderDisabled.withValues(alpha: 0.7), sliderTheme: sliderTheme(), splashColor: colors.surfaceSelected, switchTheme: switchTheme(), diff --git a/lib/src/utils/theme/theme_data.dart b/lib/src/utils/theme/theme_data.dart index 5ae564a0..4a0c76da 100644 --- a/lib/src/utils/theme/theme_data.dart +++ b/lib/src/utils/theme/theme_data.dart @@ -1,5 +1,4 @@ import 'dart:convert'; - import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:zeta_flutter/zeta_flutter.dart'; @@ -447,6 +446,7 @@ class ZdsThemeData { ); } + /// Converts ZDS legacy theme to Zeta theme. ZetaCustomTheme toCustomTheme() { return ZetaCustomTheme( id: 'zds', diff --git a/lib/src/utils/tools/nested_flow.dart b/lib/src/utils/tools/nested_flow.dart index 451a9f8f..097bae4b 100644 --- a/lib/src/utils/tools/nested_flow.dart +++ b/lib/src/utils/tools/nested_flow.dart @@ -159,7 +159,5 @@ class ZdsNestedFlowState extends State implements NavigatorObserv } @override - void didChangeTop(Route topRoute, Route? previousTopRoute) { - // TODO: implement didChangeTop - } + void didChangeTop(Route topRoute, Route? previousTopRoute) {} } diff --git a/lib/src/utils/tools/tab_navigator.dart b/lib/src/utils/tools/tab_navigator.dart index f7215c33..0e61dd2b 100644 --- a/lib/src/utils/tools/tab_navigator.dart +++ b/lib/src/utils/tools/tab_navigator.dart @@ -358,9 +358,7 @@ class ZdsSplitNavigatorState extends State with FrameCallback } @override - void didChangeTop(Route topRoute, Route? previousTopRoute) { - // TODO: implement didChangeTop - } + void didChangeTop(Route topRoute, Route? previousTopRoute) {} } class _SplitContent extends StatelessWidget { @@ -400,7 +398,7 @@ class _SplitContent extends StatelessWidget { final List? boxShadow = boxShadowDivider ? [ BoxShadow( - color: themeData.colorScheme.onSurface.withOpacity(0.1), + color: themeData.colorScheme.onSurface.withValues(alpha: 0.1), blurRadius: 2, offset: const Offset(-1, 0), ), diff --git a/lib/src/utils/tools/utils.dart b/lib/src/utils/tools/utils.dart index 5469bab7..4225bc44 100644 --- a/lib/src/utils/tools/utils.dart +++ b/lib/src/utils/tools/utils.dart @@ -261,9 +261,9 @@ extension LightHexColor on Color { /// Lightens this [Color]. Color withLight(double opacity, {Color? background}) { return Color.fromRGBO( - _transform(opacity, red, (background ?? Colors.white).red), - _transform(opacity, green, (background ?? Colors.white).green), - _transform(opacity, blue, (background ?? Colors.white).blue), + _transform(opacity, r, (background ?? Colors.white).r), + _transform(opacity, g, (background ?? Colors.white).g), + _transform(opacity, b, (background ?? Colors.white).b), 1, ); } @@ -290,22 +290,22 @@ extension LightHexColor on Color { /// /// Prefixes a hash sign if [leadingHashSign] is set to true (defaults to true). String toHex({bool leadingHashSign = true}) => '${leadingHashSign ? '#' : ''}' - '${alpha.toRadixString(16).padLeft(2, '0')}' - '${red.toRadixString(16).padLeft(2, '0')}' - '${green.toRadixString(16).padLeft(2, '0')}' - '${blue.toRadixString(16).padLeft(2, '0')}'; + '${(a * 255).round().toRadixString(16).padLeft(2, '0')}' + '${(r * 255).round().toRadixString(16).padLeft(2, '0')}' + '${(g * 255).round().toRadixString(16).padLeft(2, '0')}' + '${(b * 255).round().toRadixString(16).padLeft(2, '0')}'; /// Returns this Color's hexcode without the alpha channel. /// /// Prefixes a hash sign if [leadingHashSign] is set to true (defaults to true). String toHexNoAlpha({bool leadingHashSign = true}) => '${leadingHashSign ? '#' : ''}' - '${red.toRadixString(16).padLeft(2, '0')}' - '${green.toRadixString(16).padLeft(2, '0')}' - '${blue.toRadixString(16).padLeft(2, '0')}'; + '${(r * 255).round().toRadixString(16).padLeft(2, '0')}' + '${(g * 255).round().toRadixString(16).padLeft(2, '0')}' + '${(b * 255).round().toRadixString(16).padLeft(2, '0')}'; } -int _transform(double p, int t, int b) { - return (p * t + (1 - p) * b).round(); +int _transform(double p, num t, num b) { + return (p * (t * 255) + (1 - p) * (b * 255)).round(); } /// Render extensions on [BuildContext]. @@ -381,10 +381,10 @@ extension LaunchUrlInWebView on Uri { /// [shade] Shade from 0-1 Color getShadedColor(Color input, double shade) { return Color.fromARGB( - input.alpha, - changeShade(input.red, 1 - shade), - changeShade(input.green, 1 - shade), - changeShade(input.blue, 1 - shade), + input.a.round(), + changeShade(input.r.round(), 1 - shade), + changeShade(input.g.round(), 1 - shade), + changeShade(input.b.round(), 1 - shade), ); } diff --git a/pubspec.yaml b/pubspec.yaml index 69045a7b..ecab3c3f 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -29,6 +29,7 @@ dependencies: dart_emoji: ^0.2.0+2 dropdown_button2: ^2.3.9 expand_tap_area: ^1.1.1 + extended_image: ^8.1.0 file_picker: ^10.1.3 flutter: sdk: flutter From 65b446171b1afac545c61b06bb79f229d9506a25 Mon Sep 17 00:00:00 2001 From: thelukewalton Date: Wed, 21 May 2025 12:38:51 +0100 Subject: [PATCH 4/5] chore: Update to Flutter 3.32.0 --- .gitignore | 1 + .../components/organisms/chat/audio_recorder.dart | 2 +- lib/src/components/organisms/chat/message_input.dart | 2 +- .../organisms/quill_editor/html_parser.dart | 4 ++-- lib/src/utils/theme/theme_builders/card_theme.dart | 4 ++-- lib/src/utils/theme/theme_builders/dialog_theme.dart | 4 ++-- .../utils/theme/theme_builders/tab_bar_theme.dart | 4 ++-- lib/src/utils/theme/theme_builders/zeta_theme.dart | 1 - pubspec.yaml | 12 ++++++------ 9 files changed, 17 insertions(+), 17 deletions(-) diff --git a/.gitignore b/.gitignore index 83d63d64..9c60b192 100644 --- a/.gitignore +++ b/.gitignore @@ -78,3 +78,4 @@ pubspec.lock .master/ **/.fvm/ .fvmrc +**/ios/Flutter/ diff --git a/lib/src/components/organisms/chat/audio_recorder.dart b/lib/src/components/organisms/chat/audio_recorder.dart index de56820d..27e8ae64 100644 --- a/lib/src/components/organisms/chat/audio_recorder.dart +++ b/lib/src/components/organisms/chat/audio_recorder.dart @@ -125,7 +125,7 @@ class ZdsVoiceNoteRecorderState extends State { _waveform.add(0); }); if (_duration >= widget.maxDuration.inMilliseconds) { - stop(); + unawaited(stop()); } }); } else { diff --git a/lib/src/components/organisms/chat/message_input.dart b/lib/src/components/organisms/chat/message_input.dart index 105efb81..869d79f7 100644 --- a/lib/src/components/organisms/chat/message_input.dart +++ b/lib/src/components/organisms/chat/message_input.dart @@ -284,7 +284,7 @@ class ZdsMessageInputState extends State with SingleTickerProvi final recordingPath = recorderKey.currentState?.recordingDestination; if (recordingPath != null) { final recording = File(recordingPath); - if (recording.existsSync()) recording.delete(); + if (recording.existsSync()) unawaited(recording.delete()); } } return value; diff --git a/lib/src/components/organisms/quill_editor/html_parser.dart b/lib/src/components/organisms/quill_editor/html_parser.dart index 29cd3680..05454243 100644 --- a/lib/src/components/organisms/quill_editor/html_parser.dart +++ b/lib/src/components/organisms/quill_editor/html_parser.dart @@ -64,7 +64,7 @@ extension DeltaToHtml on Delta { completer.complete(''); } // Dispose the WebView after getting the HTML. - webView.dispose(); + unawaited(webView.dispose()); }, ); }, @@ -127,7 +127,7 @@ extension HtmlToDelta on String { callback: (List args) { try { // Dispose the WebView after getting the Delta. - webView.dispose(); + unawaited(webView.dispose()); // Parse the Delta from the callback arguments. final dynamic resp = jsonDecode(args.first as String); // This ignore is used because the `resp['ops']` value is accessed dynamically. diff --git a/lib/src/utils/theme/theme_builders/card_theme.dart b/lib/src/utils/theme/theme_builders/card_theme.dart index 43dfeff8..bee2e4b6 100644 --- a/lib/src/utils/theme/theme_builders/card_theme.dart +++ b/lib/src/utils/theme/theme_builders/card_theme.dart @@ -7,8 +7,8 @@ extension ZetaCardTheme on ZetaSemantics { /// /// Returns: /// A CardTheme with the applied properties. - CardTheme cardTheme() { - return CardTheme( + CardThemeData cardTheme() { + return CardThemeData( /// Assigning color to surfaceDefault color: colors.surfaceDefault, diff --git a/lib/src/utils/theme/theme_builders/dialog_theme.dart b/lib/src/utils/theme/theme_builders/dialog_theme.dart index 8dbbf122..9466d895 100644 --- a/lib/src/utils/theme/theme_builders/dialog_theme.dart +++ b/lib/src/utils/theme/theme_builders/dialog_theme.dart @@ -11,9 +11,9 @@ extension ZetaDialogTheme on ZetaSemantics { /// of the current color scheme. /// /// The shape of the dialog is set to a [RoundedRectangleBorder] with a border radius of 8. - DialogTheme dialogTheme() { + DialogThemeData dialogTheme() { // Return a DialogTheme with custom properties - return DialogTheme( + return DialogThemeData( // Set the background color to the tertiary color of this ZetaColorScheme backgroundColor: colors.surfaceDefault, diff --git a/lib/src/utils/theme/theme_builders/tab_bar_theme.dart b/lib/src/utils/theme/theme_builders/tab_bar_theme.dart index b3d11ce1..b9684165 100644 --- a/lib/src/utils/theme/theme_builders/tab_bar_theme.dart +++ b/lib/src/utils/theme/theme_builders/tab_bar_theme.dart @@ -17,8 +17,8 @@ extension TabBarExtension on ZetaSemantics { /// [textTheme] is used to style the labels of the selected and unselected tabs. /// /// Returns a [TabBarTheme] that matches the [ZetaSemantics]. - TabBarTheme tabBarTheme(TextTheme textTheme) { - return TabBarTheme( + TabBarThemeData tabBarTheme(TextTheme textTheme) { + return TabBarThemeData( /// The color of the line that appears below the selected tab. indicatorColor: colors.mainSecondary, diff --git a/lib/src/utils/theme/theme_builders/zeta_theme.dart b/lib/src/utils/theme/theme_builders/zeta_theme.dart index 8892fb39..a9bca377 100644 --- a/lib/src/utils/theme/theme_builders/zeta_theme.dart +++ b/lib/src/utils/theme/theme_builders/zeta_theme.dart @@ -117,7 +117,6 @@ extension ZetaThemeBuilder on ZetaSemantics { elevatedButtonTheme: elevatedButtonTheme(primaryTextTheme), fontFamily: fontFamily, iconTheme: iconTheme(color: colors.mainDefault), - indicatorColor: colors.mainSecondary, inputDecorationTheme: inputDecorationTheme(textTheme), listTileTheme: listTileTheme(textTheme), outlinedButtonTheme: outlinedButtonTheme(primaryTextTheme), diff --git a/pubspec.yaml b/pubspec.yaml index ecab3c3f..5caf8f36 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -20,7 +20,7 @@ environment: dependencies: any_link_preview: ^3.0.3 cached_network_image: ^3.4.1 - camerawesome: ^2.3.0 + camerawesome: ^2.4.0 chewie: ^1.11.3 collection: ^1.19.1 crop_image: ^1.0.16 @@ -29,8 +29,8 @@ dependencies: dart_emoji: ^0.2.0+2 dropdown_button2: ^2.3.9 expand_tap_area: ^1.1.1 - extended_image: ^8.1.0 - file_picker: ^10.1.3 + extended_image: ^8.1.0 #TODO: Check this + file_picker: ^10.1.9 flutter: sdk: flutter flutter_colorpicker: ^1.1.0 @@ -44,8 +44,8 @@ dependencies: flutter_layout_grid: ^2.0.8 flutter_localizations: sdk: flutter - flutter_quill: ^10.8.2 - flutter_quill_extensions: ^10.8.2 + flutter_quill: ^10.8.2 #TODO: Check this + flutter_quill_extensions: ^10.8.2 #TODO: Check this flutter_slidable: ^4.0.0 flutter_svg: ^2.1.0 flutter_swipe_action_cell: ^3.1.5 @@ -56,7 +56,7 @@ dependencies: image_picker: ^1.1.2 interval_time_picker: ^3.0.3+9 intl: ^0.20.2 - just_audio: ^0.10.2 + just_audio: ^0.10.3 linked_scroll_controller: ^0.2.0 mime: ^2.0.0 modal_bottom_sheet: ^3.0.0 From f512fdf66ea25f246f24495dfc9e0d01981c2569 Mon Sep 17 00:00:00 2001 From: thelukewalton Date: Thu, 5 Jun 2025 12:04:08 +0100 Subject: [PATCH 5/5] update --- .github/workflows/on-main.yml | 2 +- .github/workflows/on-release.yml | 4 +-- .github/workflows/pull-request.yml | 4 +-- example/lib/main.dart | 20 ++---------- example/macos/Podfile.lock | 8 ++--- lib/src/utils/theme/theme_data.dart | 47 ++++++++++++++++++----------- 6 files changed, 41 insertions(+), 44 deletions(-) diff --git a/.github/workflows/on-main.yml b/.github/workflows/on-main.yml index c0a51861..fe4eac6e 100644 --- a/.github/workflows/on-main.yml +++ b/.github/workflows/on-main.yml @@ -27,7 +27,7 @@ jobs: with: cache: true channel: stable - flutter-version: 3.24.x # TODO UX-1347 + flutter-version: 3.32.x - name: Setup flutter run: flutter pub get - name: Lint and format diff --git a/.github/workflows/on-release.yml b/.github/workflows/on-release.yml index 4e0999bd..56dfa449 100644 --- a/.github/workflows/on-release.yml +++ b/.github/workflows/on-release.yml @@ -18,7 +18,7 @@ jobs: with: cache: true channel: stable - flutter-version: 3.24.x # TODO UX-1347 + flutter-version: 3.32.x - name: Install dependencies run: flutter pub get - name: Format code @@ -38,7 +38,7 @@ jobs: with: cache: true channel: stable - flutter-version: 3.24.x # TODO UX-1347 + flutter-version: 3.32.x - name: Setup flutter run: flutter pub get - name: Build example app diff --git a/.github/workflows/pull-request.yml b/.github/workflows/pull-request.yml index 3193a289..a9bf324d 100644 --- a/.github/workflows/pull-request.yml +++ b/.github/workflows/pull-request.yml @@ -20,7 +20,7 @@ jobs: with: cache: true channel: stable - flutter-version: 3.24.x # TODO UX-1347 + flutter-version: 3.32.x - uses: ZebraDevs/flutter-code-quality@main with: token: ${{secrets.GITHUB_TOKEN}} @@ -54,7 +54,7 @@ jobs: with: cache: true channel: stable - flutter-version: 3.24.x # TODO UX-1347 + flutter-version: 3.32.x - name: Setup flutter run: flutter pub get - name: Build example app diff --git a/example/lib/main.dart b/example/lib/main.dart index 7847c802..a5af5edc 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -36,7 +36,7 @@ class DemoApp extends StatelessWidget { return ZetaProvider( themeService: themeService ?? const ZetaDefaultThemeService(), initialThemeMode: data.themeMode, - // initialThemeData: data.themeData, + fontFamily: data.fontFamily, initialTheme: 'zds', initialContrast: data.contrast, customThemes: [data.toCustomTheme()], @@ -62,22 +62,8 @@ class DemoApp extends StatelessWidget { ], routes: kAllRoutes, themeMode: themeMode, - // theme: themeData, - // theme: themeData.copyWith(scaffoldBackgroundColor: Colors.red), - // darkTheme: darkTheme, - theme: Zeta.of(context).semantics.toTheme( - // fontFamily: themeData.fontFamily, - appBarStyle: data.lightAppBarStyle, - ), - darkTheme: Zeta.of(context).semantics.toTheme( - // fontFamily: themeData.fontFamily, - appBarStyle: data.darkAppBarStyle, - // brightness: Brightness.dark, - ), - // darkTheme: themeData.colorsDark.toScheme().toTheme( - // fontFamily: themeData.fontFamily, - // appBarStyle: data.darkAppBarStyle, - // ), + theme: themeData, + darkTheme: darkTheme, ); }, ); diff --git a/example/macos/Podfile.lock b/example/macos/Podfile.lock index 2b761120..b0064b42 100644 --- a/example/macos/Podfile.lock +++ b/example/macos/Podfile.lock @@ -143,15 +143,15 @@ SPEC CHECKSUMS: just_audio: a42c63806f16995daf5b219ae1d679deb76e6a79 open_file_mac: 0e554648e2a87ce59e9438e3e5ca3e552e90d89a OrderedSet: e539b66b644ff081c73a262d24ad552a69be3a94 - package_info_plus: f5790acc797bf17c3e959e9d6cf162cc68ff7523 - path_provider_foundation: 3784922295ac71e43754bd15e0653ccfd36a147c + package_info_plus: 12f1c5c2cfe8727ca46cbd0b26677728972d9a5b + path_provider_foundation: 2b6b4c569c0fb62ec74538f866245ac84301af46 quill_native_bridge_macos: 3a5f378bc757eb92825193853020b759b56cbb2c record_macos: 3ead198d39fad25d10163780132a96b6fd162a1c share_plus: 1fa619de8392a4398bfaf176d441853922614e89 shared_preferences_foundation: fcdcbc04712aee1108ac7fda236f363274528f78 - sqflite_darwin: a553b1fd6fe66f53bbb0fe5b4f5bab93f08d7a13 + sqflite_darwin: 5a7236e3b501866c1c9befc6771dfd73ffb8702d super_native_extensions: 85efee3a7495b46b04befcfc86ed12069264ebf3 - url_launcher_macos: d2691c7dd33ed713bf3544850a623080ec693d95 + url_launcher_macos: c82c93949963e55b228a30115bd219499a6fe404 video_compress: c896234f100791b5fef7f049afa38f6d2ef7b42f video_player_avfoundation: 7c6c11d8470e1675df7397027218274b6d2360b3 wakelock_plus: 4783562c9a43d209c458cb9b30692134af456269 diff --git a/lib/src/utils/theme/theme_data.dart b/lib/src/utils/theme/theme_data.dart index 4a0c76da..58122e41 100644 --- a/lib/src/utils/theme/theme_data.dart +++ b/lib/src/utils/theme/theme_data.dart @@ -61,12 +61,11 @@ class _ZdsBaseColors { class ZdsThemeData { /// Creates a `ZdsThemeData`. /// - /// The [themeData] and [themeMode] must not be null. + /// The [themeMode] must not be null. /// - /// The [themeData] parameter, which is required, defines the theme data to be used with [ZetaProvider]. /// The [themeMode] parameter, which is required, defines the theme mode for the [Zeta], and defaults to [ThemeMode.system]. - /// The [darkAppBarStyle] parameter defines the AppBar style for the dark theme, used to select the colors used in AppBarTheme style from [ZetaColorScheme]. Defaults to [ZetaAppBarStyle.surface]. - /// The [lightAppBarStyle] parameter defines the AppBar style for the light theme, used to select the colors used in AppBarTheme style from [ZetaColorScheme]. Defaults to [ZetaAppBarStyle.primary]. + // /// The [darkAppBarStyle] parameter defines the AppBar style for the dark theme, used to select the colors used in AppBarTheme style from [ZetaColorScheme]. Defaults to [ZetaAppBarStyle.surface]. + // /// The [lightAppBarStyle] parameter defines the AppBar style for the light theme, used to select the colors used in AppBarTheme style from [ZetaColorScheme]. Defaults to [ZetaAppBarStyle.primary]. const ZdsThemeData._({ // required this.themeData, required this.themeMode, @@ -74,6 +73,7 @@ class ZdsThemeData { required this.lightAppBarStyle, required this.contrast, required this.adjustAccessibility, + required this.fontFamily, required _ZdsBaseColors lightColors, required _ZdsBaseColors darkColors, }) : _lightColors = lightColors, @@ -118,6 +118,7 @@ class ZdsThemeData { lightColors: baseColors, // Apply the base colors to light theme. darkColors: baseColors, // Apply the same base colors to dark theme. + fontFamily: kZetaFontFamily, ); } @@ -138,6 +139,8 @@ class ZdsThemeData { final lightColors = _ZdsBaseColors.fromJson(light); final darkColors = dark != null ? _ZdsBaseColors.fromJson(light) : lightColors; + final fontFamily = json['fontFamily'] as String? ?? kZetaFontFamily; + return ZdsThemeData._( themeMode: themeMode, contrast: contrast, @@ -146,6 +149,7 @@ class ZdsThemeData { adjustAccessibility: adjustAccessibility, lightAppBarStyle: _zetaAppBarStyle(light), darkAppBarStyle: _zetaAppBarStyle(dark), + fontFamily: fontFamily, // themeData: _zetaThemeDataFromJson( // json, // contrast, @@ -239,6 +243,9 @@ class ZdsThemeData { /// Base dark colors, used internally to save and retrieve the colors from JSON final _ZdsBaseColors _darkColors; + /// Font override to use + final String fontFamily; + /// Converts the [ZdsThemeData] instance to a JSON map. Map toJson() { return { @@ -410,32 +417,35 @@ class ZdsThemeData { /// /// Returns a new [ZdsThemeData] instance. ZdsThemeData copyWith({ + ZetaCustomTheme? themeData, ThemeMode? themeMode, ZetaAppBarStyle? darkAppBarStyle, ZetaAppBarStyle? lightAppBarStyle, ZetaContrast? contrast, bool? adjustAccessibility, + String? fontFamily, }) { var lightColors = _lightColors; var darkColors = _darkColors; - // if (themeData != null) { - // lightColors = _ZdsBaseColors( - // primary: themeData.colorsLight.primary.shade60, - // secondary: themeData.colorsLight.mainSecondary.shade60, - // error: themeData.colorsLight.error.shade60, - // ); - - // darkColors = _ZdsBaseColors( - // primary: themeData.colorsLight.primary.shade50, - // secondary: themeData.colorsLight.mainSecondary.shade50, - // error: themeData.colorsLight.error.shade50, - // ); - // } + if (themeData != null) { + lightColors = _ZdsBaseColors( + primary: themeData.primary ?? const ZetaPrimitivesLight().blue, + secondary: themeData.secondary ?? const ZetaPrimitivesLight().blue, + error: const ZetaPrimitivesLight().red, + ); + + darkColors = _ZdsBaseColors( + primary: themeData.primaryDark ?? const ZetaPrimitivesDark().blue, + secondary: themeData.secondaryDark ?? const ZetaPrimitivesDark().blue, + error: const ZetaPrimitivesDark().red, + ); + } return ZdsThemeData._( lightColors: lightColors, darkColors: darkColors, + // themeData: // themeData: ThemeData(), // themeData: themeData ?? this.themeData, themeMode: themeMode ?? this.themeMode, @@ -443,6 +453,7 @@ class ZdsThemeData { lightAppBarStyle: lightAppBarStyle ?? this.lightAppBarStyle, contrast: contrast ?? this.contrast, adjustAccessibility: adjustAccessibility ?? this.adjustAccessibility, + fontFamily: fontFamily ?? this.fontFamily, ); } @@ -476,7 +487,7 @@ class ZetaSwatchGenerator { return ZetaColorSwatch( // contrast: contrast, // brightness: brightness, - primary: primary.value, + primary: primary.toARGB32(), swatch: primary.generateSwatch(background: background, adjustPrimary: adjustAccessibility), ).apply(brightness: brightness); }