From 70cb1e36baf9b210c91534b6adfcfbea744f05c4 Mon Sep 17 00:00:00 2001 From: Alexandru Mariuti Date: Fri, 10 Jan 2025 16:08:19 +0100 Subject: [PATCH] refactor: remove shad image in favor of icon --- CHANGELOG.md | 7 +- example/lib/main.dart | 2 - example/lib/pages/alert.dart | 4 +- example/lib/pages/button.dart | 4 +- example/lib/pages/card.dart | 4 +- example/lib/pages/context_menu.dart | 7 +- example/lib/pages/image.dart | 31 -- example/lib/pages/input.dart | 7 +- example/lib/pages/input_form_field.dart | 5 +- example/lib/pages/input_otp.dart | 2 +- example/lib/pages/input_otp_form_field.dart | 2 +- example/lib/pages/time_picker.dart | 2 +- lib/shadcn_ui.dart | 1 - lib/src/app.dart | 1 + lib/src/components/accordion.dart | 13 +- lib/src/components/alert.dart | 24 +- lib/src/components/avatar.dart | 5 +- lib/src/components/button.dart | 53 +--- lib/src/components/calendar.dart | 40 +-- lib/src/components/checkbox.dart | 3 +- lib/src/components/date_picker.dart | 47 +-- lib/src/components/dialog.dart | 17 +- .../components/form/fields/date_picker.dart | 19 +- .../form/fields/date_range_picker.dart | 19 +- lib/src/components/image.dart | 291 ------------------ lib/src/components/resizable.dart | 21 +- lib/src/components/select.dart | 9 +- lib/src/components/sheet.dart | 11 +- lib/src/components/toast.dart | 15 +- lib/src/theme/components/accordion.dart | 17 +- lib/src/theme/components/alert.dart | 8 - lib/src/theme/components/button.dart | 14 +- lib/src/theme/components/calendar.dart | 51 +-- lib/src/theme/components/date_picker.dart | 70 +++-- lib/src/theme/components/dialog.dart | 17 +- lib/src/theme/components/resizable.dart | 23 +- lib/src/theme/components/sheet.dart | 17 +- lib/src/theme/components/toast.dart | 17 +- ...ult_theme_no_secondary_border_variant.dart | 22 +- .../theme/themes/default_theme_variant.dart | 22 +- playground/lib/pages/alert.dart | 4 +- pubspec.yaml | 3 +- 42 files changed, 270 insertions(+), 681 deletions(-) delete mode 100644 example/lib/pages/image.dart delete mode 100644 lib/src/components/image.dart diff --git a/CHANGELOG.md b/CHANGELOG.md index f042f9eb..cc6f54b9 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,7 +1,8 @@ -## 0.17.7 +## 0.18.0 -- **FIX**: Remove `applyIconColorFilter` from `ShadButton`. -- **FIX** The `iconSize` of a `ShadButton` is now applied only if you use a `ShadImage`. +- **BREAKING CHANGE**: Remove `applyIconColorFilter` from `ShadButton`. +- **BREAKING CHANGE**: Remove `ShadImage` component. Prefer using the `Icon` widget for `IconData`, the `Image` widget for normal images, and `SvgPicture` (from the [flutter_svg package](https://pub.dev/packages/flutter_svg) for SVG images. +- **FIX** The `iconSize` of a `ShadButton` is now applied only if you use an `Icon` widget, wrap with a `SizedBox` to set the size otherwise. - **FIX**: Move `iconSize` from `ShadButtonTheme` to `ShadButtonSizesTheme`. ## 0.17.6 diff --git a/example/lib/main.dart b/example/lib/main.dart index a9373686..c18c57b7 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -12,7 +12,6 @@ import 'package:example/pages/context_menu.dart'; import 'package:example/pages/date_picker.dart'; import 'package:example/pages/date_picker_form_field.dart'; import 'package:example/pages/dialog.dart'; -import 'package:example/pages/image.dart'; import 'package:example/pages/input.dart'; import 'package:example/pages/input_form_field.dart'; import 'package:example/pages/input_otp.dart'; @@ -60,7 +59,6 @@ final routes = { '/date-picker': (_) => const DatePickerPage(), '/date-picker-form-field': (_) => const DatePickerFormFieldPage(), '/dialog': (_) => const DialogPage(), - '/image': (_) => const ImagePage(), '/input': (_) => const InputPage(), '/input-form-field': (_) => const InputFormFieldPage(), '/input-OTP': (_) => const InputOTPPage(), diff --git a/example/lib/pages/alert.dart b/example/lib/pages/alert.dart index d3c70658..63c608cf 100644 --- a/example/lib/pages/alert.dart +++ b/example/lib/pages/alert.dart @@ -14,7 +14,7 @@ class AlertPage extends StatelessWidget { ConstrainedBox( constraints: const BoxConstraints(maxWidth: 600), child: const ShadAlert( - iconSrc: LucideIcons.terminal, + iconData: LucideIcons.terminal, title: Text('Heads up!'), description: Text('You can add components to your app using the cli.'), @@ -23,7 +23,7 @@ class AlertPage extends StatelessWidget { ConstrainedBox( constraints: const BoxConstraints(maxWidth: 600), child: const ShadAlert.destructive( - iconSrc: LucideIcons.circleAlert, + iconData: LucideIcons.circleAlert, title: Text('Error'), description: Text('Your session has expired. Please log in again.'), ), diff --git a/example/lib/pages/button.dart b/example/lib/pages/button.dart index fddea2d1..24e8cb32 100644 --- a/example/lib/pages/button.dart +++ b/example/lib/pages/button.dart @@ -76,7 +76,7 @@ class _ButtonPageState extends State { ShadButton( size: size, enabled: enabled, - icon: const ShadImage(LucideIcons.mail), + icon: const Icon(LucideIcons.mail), child: const Text('Login with Email'), ), ShadButton( @@ -113,7 +113,7 @@ class _ButtonPageState extends State { child: ShadButton.outline( size: size, enabled: enabled, - icon: const ShadImage(LucideIcons.chevronRight), + icon: const Icon(LucideIcons.chevronRight), ), ), ], diff --git a/example/lib/pages/card.dart b/example/lib/pages/card.dart index 18b38992..9d7474e1 100644 --- a/example/lib/pages/card.dart +++ b/example/lib/pages/card.dart @@ -98,7 +98,7 @@ class _CardPageState extends State { width: double.infinity, icon: const Padding( padding: EdgeInsets.only(right: 8), - child: ShadImage.square(LucideIcons.check, size: 16), + child: Icon(LucideIcons.check), ), onPressed: () {}, child: const Text('Mark all as read'), @@ -114,7 +114,7 @@ class _CardPageState extends State { ), child: Row( children: [ - ShadImage.square( + Icon( LucideIcons.bellRing, size: 24, color: theme.colorScheme.foreground, diff --git a/example/lib/pages/context_menu.dart b/example/lib/pages/context_menu.dart index 1232b269..89e71c90 100644 --- a/example/lib/pages/context_menu.dart +++ b/example/lib/pages/context_menu.dart @@ -25,10 +25,7 @@ class ContextMenuPage extends StatelessWidget { child: Text('Reload'), ), const ShadContextMenuItem.inset( - trailing: ShadImage.square( - LucideIcons.chevronRight, - size: 16, - ), + trailing: Icon(LucideIcons.chevronRight), items: [ ShadContextMenuItem( child: Text('Save Page As...'), @@ -48,7 +45,7 @@ class ContextMenuPage extends StatelessWidget { ), const Divider(height: 8), const ShadContextMenuItem( - leading: ShadImage.square(LucideIcons.check, size: 16), + leading: Icon(LucideIcons.check), child: Text('Show Bookmarks Bar'), ), const ShadContextMenuItem.inset(child: Text('Show Full URLs')), diff --git a/example/lib/pages/image.dart b/example/lib/pages/image.dart deleted file mode 100644 index a7893df8..00000000 --- a/example/lib/pages/image.dart +++ /dev/null @@ -1,31 +0,0 @@ -import 'package:example/common/assets.dart'; -import 'package:example/common/base_scaffold.dart'; -import 'package:flutter/material.dart'; -import 'package:flutter/widgets.dart'; -import 'package:shadcn_ui/shadcn_ui.dart'; - -class ImagePage extends StatelessWidget { - const ImagePage({super.key}); - - @override - Widget build(BuildContext context) { - return const BaseScaffold( - appBarTitle: 'Image', - children: [ - ShadImage.square( - 'https://avatars.githubusercontent.com/u/124599?v=4', - size: 50, - ), - ShadImage.square( - Assets.flutter, - size: 50, - ), - ShadImage( - Assets.banner, - height: 100, - fit: BoxFit.fitHeight, - ), - ], - ); - } -} diff --git a/example/lib/pages/input.dart b/example/lib/pages/input.dart index b5a1e6f5..9696a165 100644 --- a/example/lib/pages/input.dart +++ b/example/lib/pages/input.dart @@ -42,7 +42,7 @@ class _InputPageState extends State { obscureText: obscure, prefix: const Padding( padding: EdgeInsets.all(4.0), - child: ShadImage.square(size: 16, LucideIcons.lock), + child: Icon(LucideIcons.lock), ), suffix: ShadButton( width: 24, @@ -52,10 +52,7 @@ class _InputPageState extends State { secondaryBorder: ShadBorder.none, secondaryFocusedBorder: ShadBorder.none, ), - icon: ShadImage.square( - size: 16, - obscure ? LucideIcons.eyeOff : LucideIcons.eye, - ), + icon: Icon(obscure ? LucideIcons.eyeOff : LucideIcons.eye), onPressed: () { setState(() => obscure = !obscure); }, diff --git a/example/lib/pages/input_form_field.dart b/example/lib/pages/input_form_field.dart index ece5b90b..736cc421 100644 --- a/example/lib/pages/input_form_field.dart +++ b/example/lib/pages/input_form_field.dart @@ -72,10 +72,7 @@ class _InputFormFieldPageState extends State { children: [ ShadInputFormField( id: 'username', - prefix: const ShadImage.square( - size: 16, - LucideIcons.user, - ), + prefix: const Icon(LucideIcons.user), label: const Text('Username'), placeholder: const Text('Enter your username'), description: const Text('This is your public display name.'), diff --git a/example/lib/pages/input_otp.dart b/example/lib/pages/input_otp.dart index d103c995..a81a4c14 100644 --- a/example/lib/pages/input_otp.dart +++ b/example/lib/pages/input_otp.dart @@ -67,7 +67,7 @@ class _InputOTPPageState extends State { ShadInputOTPSlot(), ], ), - ShadImage.square(size: 24, LucideIcons.dot), + Icon(LucideIcons.dot), ShadInputOTPGroup( children: [ ShadInputOTPSlot(), diff --git a/example/lib/pages/input_otp_form_field.dart b/example/lib/pages/input_otp_form_field.dart index 98ccfe06..9e2e72d9 100644 --- a/example/lib/pages/input_otp_form_field.dart +++ b/example/lib/pages/input_otp_form_field.dart @@ -90,7 +90,7 @@ class _InputOTPFormFieldPageState extends State { ShadInputOTPSlot(), ], ), - ShadImage.square(size: 24, LucideIcons.dot), + Icon(LucideIcons.dot), ShadInputOTPGroup( children: [ ShadInputOTPSlot(), diff --git a/example/lib/pages/time_picker.dart b/example/lib/pages/time_picker.dart index 8cbdae70..7699cc6f 100644 --- a/example/lib/pages/time_picker.dart +++ b/example/lib/pages/time_picker.dart @@ -15,7 +15,7 @@ class TimePickerPage extends StatelessWidget { child: ShadTimePicker( trailing: const Padding( padding: EdgeInsets.only(left: 8, top: 14), - child: ShadImage.square(LucideIcons.clock4, size: 16), + child: Icon(LucideIcons.clock4), ), onChanged: (time) { print('time: $time'); diff --git a/lib/shadcn_ui.dart b/lib/shadcn_ui.dart index 98528c5e..eb675f41 100644 --- a/lib/shadcn_ui.dart +++ b/lib/shadcn_ui.dart @@ -26,7 +26,6 @@ export 'src/components/form/fields/switch.dart'; export 'src/components/form/fields/time_picker.dart'; export 'src/components/form/fields/input_otp.dart'; export 'src/components/form/form.dart'; -export 'src/components/image.dart'; export 'src/components/input.dart'; export 'src/components/input_otp.dart'; export 'src/components/popover.dart'; diff --git a/lib/src/app.dart b/lib/src/app.dart index 320972ef..47dc379d 100644 --- a/lib/src/app.dart +++ b/lib/src/app.dart @@ -689,6 +689,7 @@ class _ShadAppState extends State { selectionColor: themeData.colorScheme.selection, selectionHandleColor: themeData.colorScheme.primary, ), + iconTheme: const IconThemeData(size: 16), ); mTheme = mTheme.copyWith( textTheme: diff --git a/lib/src/components/accordion.dart b/lib/src/components/accordion.dart index 28008cec..45afc730 100644 --- a/lib/src/components/accordion.dart +++ b/lib/src/components/accordion.dart @@ -2,7 +2,6 @@ import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:flutter_animate/flutter_animate.dart'; import 'package:lucide_icons_flutter/lucide_icons.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/raw_components/focusable.dart'; import 'package:shadcn_ui/src/theme/theme.dart'; import 'package:shadcn_ui/src/utils/animation_builder.dart'; @@ -92,7 +91,7 @@ class ShadAccordionItem extends StatefulWidget { required this.child, this.separator, this.icon, - this.iconSrc, + this.iconData, this.iconEffects, this.padding, this.underlineTitleOnHover, @@ -108,7 +107,7 @@ class ShadAccordionItem extends StatefulWidget { final Widget child; final Widget? separator; final Widget? icon; - final ShadImageSrc? iconSrc; + final IconData? iconData; final List>? iconEffects; final EdgeInsets? padding; final bool? underlineTitleOnHover; @@ -195,13 +194,13 @@ class _ShadAccordionItemState extends State> ), ]; - final effectiveIconSrc = widget.iconSrc ?? - theme.accordionTheme.iconSrc ?? + final effectiveIconData = widget.iconData ?? + theme.accordionTheme.iconData ?? LucideIcons.chevronDown; final effectiveIcon = widget.icon ?? - ShadImage.square( - effectiveIconSrc, + Icon( + effectiveIconData, color: theme.colorScheme.foreground, size: 16, ); diff --git a/lib/src/components/alert.dart b/lib/src/components/alert.dart index ec1face9..1722b207 100644 --- a/lib/src/components/alert.dart +++ b/lib/src/components/alert.dart @@ -1,5 +1,4 @@ import 'package:flutter/cupertino.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/theme/components/decorator.dart'; import 'package:shadcn_ui/src/theme/theme.dart'; import 'package:shadcn_ui/src/utils/border.dart'; @@ -14,14 +13,13 @@ class ShadAlert extends StatelessWidget { const ShadAlert({ super.key, this.icon, - this.iconSrc, + this.iconData, this.title, this.description, this.textDirection, this.decoration, this.iconPadding, this.iconColor, - this.iconSize, this.titleStyle, this.descriptionStyle, this.mainAxisAlignment, @@ -32,14 +30,13 @@ class ShadAlert extends StatelessWidget { const ShadAlert.destructive({ super.key, this.icon, - this.iconSrc, + this.iconData, this.title, this.description, this.textDirection, this.decoration, this.iconPadding, this.iconColor, - this.iconSize, this.titleStyle, this.descriptionStyle, this.mainAxisAlignment, @@ -51,14 +48,13 @@ class ShadAlert extends StatelessWidget { super.key, required this.variant, this.icon, - this.iconSrc, + this.iconData, this.title, this.description, this.textDirection, this.decoration, this.iconPadding, this.iconColor, - this.iconSize, this.titleStyle, this.descriptionStyle, this.mainAxisAlignment, @@ -68,14 +64,13 @@ class ShadAlert extends StatelessWidget { final ShadAlertVariant variant; final Widget? icon; - final ShadImageSrc? iconSrc; + final IconData? iconData; final Widget? title; final Widget? description; final TextDirection? textDirection; final ShadDecoration? decoration; final EdgeInsets? iconPadding; final Color? iconColor; - final Size? iconSize; final TextStyle? titleStyle; final TextStyle? descriptionStyle; final MainAxisAlignment? mainAxisAlignment; @@ -115,18 +110,13 @@ class ShadAlert extends StatelessWidget { effectiveAlertTheme.iconColor ?? theme.colorScheme.foreground; - final effectiveIconSize = - iconSize ?? effectiveAlertTheme.iconSize ?? const Size.square(16); - - final hasIcon = icon != null || iconSrc != null; + final hasIcon = icon != null || iconData != null; final effectiveIcon = hasIcon ? Padding( padding: effectiveIconPadding, child: icon ?? - ShadImage( - iconSrc!, - width: effectiveIconSize.width, - height: effectiveIconSize.height, + Icon( + iconData, color: effectiveIconColor, ), ) diff --git a/lib/src/components/avatar.dart b/lib/src/components/avatar.dart index 1bad7b1f..ac328b6d 100644 --- a/lib/src/components/avatar.dart +++ b/lib/src/components/avatar.dart @@ -1,6 +1,7 @@ import 'package:flutter/material.dart'; import 'package:shadcn_ui/shadcn_ui.dart'; import 'package:shadcn_ui/src/utils/debug_check.dart'; +import 'package:universal_image/universal_image.dart'; class ShadAvatar extends StatelessWidget { const ShadAvatar( @@ -14,7 +15,7 @@ class ShadAvatar extends StatelessWidget { this.fit, }); - final ShadImageSrc src; + final dynamic src; final Widget? placeholder; final Size? size; final ShapeBorder? shape; @@ -64,7 +65,7 @@ class ShadAvatar extends StatelessWidget { shape: effectiveShape(theme), color: effectiveBackgroundColor(theme), ), - child: ShadImage(src, placeholder: placeholder), + child: UniversalImage(src, placeholder: placeholder), ); } } diff --git a/lib/src/components/button.dart b/lib/src/components/button.dart index 7cbb366e..bef5bb5c 100644 --- a/lib/src/components/button.dart +++ b/lib/src/components/button.dart @@ -1,7 +1,6 @@ import 'package:flutter/gestures.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/raw_components/focusable.dart'; import 'package:shadcn_ui/src/theme/components/button.dart'; import 'package:shadcn_ui/src/theme/components/decorator.dart'; @@ -10,7 +9,6 @@ import 'package:shadcn_ui/src/theme/theme.dart'; import 'package:shadcn_ui/src/utils/debug_check.dart'; import 'package:shadcn_ui/src/utils/extensions/order_policy.dart'; import 'package:shadcn_ui/src/utils/gesture_detector.dart'; -import 'package:shadcn_ui/src/utils/provider.dart'; import 'package:shadcn_ui/src/utils/separated_iterable.dart'; import 'package:shadcn_ui/src/utils/states_controller.dart'; @@ -80,7 +78,6 @@ class ShadButton extends StatefulWidget { this.onFocusChange, this.orderPolicy, this.expands, - this.iconSize, }) : variant = ShadButtonVariant.primary; const ShadButton.raw({ @@ -134,7 +131,6 @@ class ShadButton extends StatefulWidget { this.onFocusChange, this.orderPolicy, this.expands, - this.iconSize, }); const ShadButton.destructive({ @@ -187,7 +183,6 @@ class ShadButton extends StatefulWidget { this.onFocusChange, this.orderPolicy, this.expands, - this.iconSize, }) : variant = ShadButtonVariant.destructive; const ShadButton.outline({ @@ -240,7 +235,6 @@ class ShadButton extends StatefulWidget { this.onFocusChange, this.orderPolicy, this.expands, - this.iconSize, }) : variant = ShadButtonVariant.outline; const ShadButton.secondary({ @@ -293,7 +287,6 @@ class ShadButton extends StatefulWidget { this.onFocusChange, this.orderPolicy, this.expands, - this.iconSize, }) : variant = ShadButtonVariant.secondary; const ShadButton.ghost({ @@ -346,7 +339,6 @@ class ShadButton extends StatefulWidget { this.onFocusChange, this.orderPolicy, this.expands, - this.iconSize, }) : variant = ShadButtonVariant.ghost; const ShadButton.link({ @@ -399,8 +391,7 @@ class ShadButton extends StatefulWidget { this.orderPolicy, this.expands, }) : variant = ShadButtonVariant.link, - icon = null, - iconSize = null; + icon = null; final VoidCallback? onPressed; final VoidCallback? onLongPress; @@ -481,14 +472,6 @@ class ShadButton extends StatefulWidget { /// {@endtemplate} final bool? expands; - /// {@template ShadButton.iconSize} - /// The size of the icon, defaults to `Size.square(16)`. - /// - /// __Please note__: the size is applied only if you use a [ShadImage] as - /// [icon]. If you use something else, wrap it with a SizedBox. - /// {@endtemplate} - final Size? iconSize; - @override State createState() => _ShadButtonState(); } @@ -711,6 +694,7 @@ class _ShadButtonState extends State { assertCheckHasTextOrIcon(); final theme = ShadTheme.of(context); + final materialTheme = Theme.of(context); final hasPressedBackgroundColor = widget.pressedBackgroundColor != null || buttonTheme(theme).pressedBackgroundColor != null; @@ -748,13 +732,6 @@ class _ShadButtonState extends State { final effectiveExpands = widget.expands ?? buttonTheme(theme).expands ?? false; - final effectiveIconSize = widget.iconSize ?? - sizeTheme( - theme, - buttonTheme(theme).size ?? ShadButtonSize.regular, - ).iconSize ?? - const Size.square(16); - return CallbackShortcuts( bindings: { const SingleActivator(LogicalKeyboardKey.enter): onTap, @@ -784,22 +761,6 @@ class _ShadButtonState extends State { shadows: shadows(theme), ); - var icon = widget.icon; - - if (icon != null) { - final imageData = ShadImageData( - size: effectiveIconSize, - color: effectiveForegroundColor, - ); - icon = ShadProvider( - data: imageData, - notifyUpdate: (state) { - return imageData != state.data; - }, - child: icon, - ); - } - Widget? child = widget.child == null ? null : DefaultTextStyle( @@ -890,7 +851,15 @@ class _ShadButtonState extends State { mainAxisAlignment: effectiveMainAxisAlignment, textDirection: effectiveTextDirection, children: [ - if (icon != null) icon, + if (widget.icon != null) + Theme( + data: materialTheme.copyWith( + iconTheme: materialTheme.iconTheme.copyWith( + color: effectiveForegroundColor, + ), + ), + child: widget.icon!, + ), if (child != null) child, ] .order(effectiveOrderPolicy) diff --git a/lib/src/components/calendar.dart b/lib/src/components/calendar.dart index 65303579..e0eeb40e 100644 --- a/lib/src/components/calendar.dart +++ b/lib/src/components/calendar.dart @@ -4,7 +4,6 @@ import 'package:flutter/material.dart'; import 'package:intl/intl.dart'; import 'package:lucide_icons_flutter/lucide_icons.dart'; import 'package:shadcn_ui/src/components/button.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/components/select.dart'; import 'package:shadcn_ui/src/theme/components/decorator.dart'; import 'package:shadcn_ui/src/theme/theme.dart'; @@ -121,8 +120,8 @@ class ShadCalendar extends StatefulWidget { this.monthSelectorPadding, this.navigationButtonSize, this.navigationButtonIconSize, - this.backNavigationButtonSrc, - this.forwardNavigationButtonSrc, + this.backNavigationButtonIconData, + this.forwardNavigationButtonIconData, this.navigationButtonPadding, this.navigationButtonDisabledOpacity, this.decoration, @@ -195,8 +194,8 @@ class ShadCalendar extends StatefulWidget { this.monthSelectorPadding, this.navigationButtonSize, this.navigationButtonIconSize, - this.backNavigationButtonSrc, - this.forwardNavigationButtonSrc, + this.backNavigationButtonIconData, + this.forwardNavigationButtonIconData, this.navigationButtonPadding, this.navigationButtonDisabledOpacity, this.decoration, @@ -269,8 +268,8 @@ class ShadCalendar extends StatefulWidget { this.monthSelectorPadding, this.navigationButtonSize, this.navigationButtonIconSize, - this.backNavigationButtonSrc, - this.forwardNavigationButtonSrc, + this.backNavigationButtonIconData, + this.forwardNavigationButtonIconData, this.navigationButtonPadding, this.navigationButtonDisabledOpacity, this.decoration, @@ -348,8 +347,8 @@ class ShadCalendar extends StatefulWidget { this.monthSelectorPadding, this.navigationButtonSize, this.navigationButtonIconSize, - this.backNavigationButtonSrc, - this.forwardNavigationButtonSrc, + this.backNavigationButtonIconData, + this.forwardNavigationButtonIconData, this.navigationButtonPadding, this.navigationButtonDisabledOpacity, this.decoration, @@ -562,15 +561,15 @@ class ShadCalendar extends StatefulWidget { /// {@endtemplate} final double? navigationButtonIconSize; - /// {@template ShadCalendar.backNavigationButtonSrc} + /// {@template ShadCalendar.backNavigationButtonIconData} /// The back navigation button src, defaults to [LucideIcons.chevronLeft] /// {@endtemplate} - final ShadImageSrc? backNavigationButtonSrc; + final IconData? backNavigationButtonIconData; - /// {@template ShadCalendar.forwardNavigationButtonSrc} + /// {@template ShadCalendar.forwardNavigationButtonIconData} /// The forward navigation button src, defaults to [LucideIcons.chevronRight] /// {@endtemplate} - final ShadImageSrc? forwardNavigationButtonSrc; + final IconData? forwardNavigationButtonIconData; /// {@template ShadCalendar.navigationButtonPadding} /// The padding of the navigation button, defaults to [EdgeInsets.zero] @@ -1126,13 +1125,14 @@ class _ShadCalendarState extends State { theme.calendarTheme.navigationButtonIconSize ?? 16; - final effectiveBackNavigationButtonSrc = widget.backNavigationButtonSrc ?? - theme.calendarTheme.backNavigationButtonSrc ?? - LucideIcons.chevronLeft; + final effectiveBackNavigationButtonSrc = + widget.backNavigationButtonIconData ?? + theme.calendarTheme.backNavigationButtonIconData ?? + LucideIcons.chevronLeft; final effectiveForwardNavigationButtonSrc = - widget.forwardNavigationButtonSrc ?? - theme.calendarTheme.forwardNavigationButtonSrc ?? + widget.forwardNavigationButtonIconData ?? + theme.calendarTheme.forwardNavigationButtonIconData ?? LucideIcons.chevronRight; final effectiveNavigationButtonPadding = widget.navigationButtonPadding ?? @@ -1338,7 +1338,7 @@ class _ShadCalendarState extends State { padding: effectiveNavigationButtonPadding, enabled: !isFirstMonthDisplayed, onHoverChange: (hovered) => backMonthButtonHovered.value = hovered, - icon: ShadImage.square( + icon: Icon( effectiveBackNavigationButtonSrc, size: effectiveNavigationButtonIconSize, ), @@ -1361,7 +1361,7 @@ class _ShadCalendarState extends State { onHoverChange: (hovered) => forwardMonthButtonHovered.value = hovered, onPressed: () => goToMonth(currentMonth.nextMonth), - child: ShadImage.square( + child: Icon( effectiveForwardNavigationButtonSrc, size: effectiveNavigationButtonIconSize, ), diff --git a/lib/src/components/checkbox.dart b/lib/src/components/checkbox.dart index d4a9638d..6a6f4e09 100644 --- a/lib/src/components/checkbox.dart +++ b/lib/src/components/checkbox.dart @@ -3,7 +3,6 @@ import 'package:flutter/services.dart'; import 'package:flutter_animate/flutter_animate.dart'; import 'package:lucide_icons_flutter/lucide_icons.dart'; import 'package:shadcn_ui/src/components/disabled.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/raw_components/focusable.dart'; import 'package:shadcn_ui/src/theme/components/decorator.dart'; import 'package:shadcn_ui/src/theme/theme.dart'; @@ -130,7 +129,7 @@ class _ShadCheckboxState extends State { final effectiveSize = widget.size ?? theme.checkboxTheme.size ?? 16; final effectiveIcon = widget.icon ?? - ShadImage.square( + Icon( LucideIcons.check, color: theme.colorScheme.primaryForeground, size: effectiveSize, diff --git a/lib/src/components/date_picker.dart b/lib/src/components/date_picker.dart index e06313db..9ae98fd8 100644 --- a/lib/src/components/date_picker.dart +++ b/lib/src/components/date_picker.dart @@ -7,7 +7,6 @@ import 'package:intl/intl.dart' as intl; import 'package:lucide_icons_flutter/lucide_icons.dart'; import 'package:shadcn_ui/src/components/button.dart'; import 'package:shadcn_ui/src/components/calendar.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/components/popover.dart'; import 'package:shadcn_ui/src/raw_components/portal.dart'; import 'package:shadcn_ui/src/theme/components/decorator.dart'; @@ -63,8 +62,8 @@ class ShadDatePicker extends StatefulWidget { this.monthSelectorPadding, this.navigationButtonSize, this.navigationButtonIconSize, - this.backNavigationButtonSrc, - this.forwardNavigationButtonSrc, + this.backNavigationButtonIconData, + this.forwardNavigationButtonIconData, this.navigationButtonPadding, this.navigationButtonDisabledOpacity, this.decoration, @@ -154,7 +153,7 @@ class ShadDatePicker extends StatefulWidget { this.longPressDuration, this.textDirection, this.onFocusChange, - this.iconSrc, + this.iconData, this.orderPolicy, this.expands, }) : variant = ShadDatePickerVariant.single, @@ -204,8 +203,8 @@ class ShadDatePicker extends StatefulWidget { this.monthSelectorPadding, this.navigationButtonSize, this.navigationButtonIconSize, - this.backNavigationButtonSrc, - this.forwardNavigationButtonSrc, + this.backNavigationButtonIconData, + this.forwardNavigationButtonIconData, this.navigationButtonPadding, this.navigationButtonDisabledOpacity, this.decoration, @@ -295,7 +294,7 @@ class ShadDatePicker extends StatefulWidget { this.longPressDuration, this.textDirection, this.onFocusChange, - this.iconSrc, + this.iconData, this.orderPolicy, this.expands, }) : variant = ShadDatePickerVariant.range, @@ -347,8 +346,8 @@ class ShadDatePicker extends StatefulWidget { this.monthSelectorPadding, this.navigationButtonSize, this.navigationButtonIconSize, - this.backNavigationButtonSrc, - this.forwardNavigationButtonSrc, + this.backNavigationButtonIconData, + this.forwardNavigationButtonIconData, this.navigationButtonPadding, this.navigationButtonDisabledOpacity, this.decoration, @@ -438,7 +437,7 @@ class ShadDatePicker extends StatefulWidget { this.longPressDuration, this.textDirection, this.onFocusChange, - this.iconSrc, + this.iconData, this.formatDateRange, this.placeholder, this.orderPolicy, @@ -603,11 +602,11 @@ class ShadDatePicker extends StatefulWidget { /// {@macro ShadCalendar.navigationButtonIconSize} final double? navigationButtonIconSize; - /// {@macro ShadCalendar.backNavigationButtonSrc} - final ShadImageSrc? backNavigationButtonSrc; + /// {@macro ShadCalendar.backNavigationButtonIconData} + final IconData? backNavigationButtonIconData; - /// {@macro ShadCalendar.forwardNavigationButtonSrc} - final ShadImageSrc? forwardNavigationButtonSrc; + /// {@macro ShadCalendar.forwardNavigationButtonIconData} + final IconData? forwardNavigationButtonIconData; /// {@macro ShadCalendar.navigationButtonPadding} final EdgeInsets? navigationButtonPadding; @@ -752,10 +751,10 @@ class ShadDatePicker extends StatefulWidget { /// {@macro ShadButton.icon} final Widget? icon; - /// {@template ShadDatePicker.iconSrc} + /// {@template ShadDatePicker.iconData} /// The icon of the date picker button, defaults to [LucideIcons.calendar]. /// {@endtemplate} - final ShadImageSrc? iconSrc; + final IconData? iconData; /// {@macro ShadButton.child} final Widget? buttonChild; @@ -1052,10 +1051,12 @@ class _ShadDatePickerState extends State { theme.datePickerTheme.navigationButtonSize, navigationButtonIconSize: widget.navigationButtonIconSize ?? theme.datePickerTheme.navigationButtonIconSize, - backNavigationButtonSrc: widget.backNavigationButtonSrc ?? - theme.datePickerTheme.backNavigationButtonSrc, - forwardNavigationButtonSrc: widget.forwardNavigationButtonSrc ?? - theme.datePickerTheme.forwardNavigationButtonSrc, + backNavigationButtonIconData: + widget.backNavigationButtonIconData ?? + theme.datePickerTheme.backNavigationButtonIconData, + forwardNavigationButtonIconData: + widget.forwardNavigationButtonIconData ?? + theme.datePickerTheme.forwardNavigationButtonIconData, navigationButtonPadding: widget.navigationButtonPadding ?? theme.datePickerTheme.navigationButtonPadding, navigationButtonDisabledOpacity: @@ -1157,9 +1158,9 @@ class _ShadDatePickerState extends State { theme.datePickerTheme.mainAxisAlignment ?? MainAxisAlignment.start, icon: widget.icon ?? - ShadImage.square( - widget.iconSrc ?? - theme.datePickerTheme.iconSrc ?? + Icon( + widget.iconData ?? + theme.datePickerTheme.iconData ?? LucideIcons.calendar, size: 16, color: isSelected diff --git a/lib/src/components/dialog.dart b/lib/src/components/dialog.dart index eb218730..ea6623a8 100644 --- a/lib/src/components/dialog.dart +++ b/lib/src/components/dialog.dart @@ -2,7 +2,6 @@ import 'package:flutter/material.dart'; import 'package:flutter_animate/flutter_animate.dart'; import 'package:lucide_icons_flutter/lucide_icons.dart'; import 'package:shadcn_ui/src/components/button.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/theme/theme.dart'; import 'package:shadcn_ui/src/theme/themes/shadows.dart'; import 'package:shadcn_ui/src/utils/position.dart'; @@ -84,7 +83,7 @@ class ShadDialog extends StatelessWidget { this.child, this.actions = const [], this.closeIcon, - this.closeIconSrc, + this.closeIconData, this.closeIconPosition, this.radius, this.backgroundColor, @@ -117,7 +116,7 @@ class ShadDialog extends StatelessWidget { this.child, this.actions = const [], this.closeIcon, - this.closeIconSrc, + this.closeIconData, this.closeIconPosition, this.radius, this.backgroundColor, @@ -151,7 +150,7 @@ class ShadDialog extends StatelessWidget { this.child, this.actions = const [], this.closeIcon, - this.closeIconSrc, + this.closeIconData, this.closeIconPosition, this.radius, this.backgroundColor, @@ -183,7 +182,7 @@ class ShadDialog extends StatelessWidget { final ShadDialogVariant variant; final List actions; final Widget? closeIcon; - final ShadImageSrc? closeIconSrc; + final IconData? closeIconData; final ShadPosition? closeIconPosition; final BorderRadius? radius; final Color? backgroundColor; @@ -221,13 +220,13 @@ class ShadDialog extends StatelessWidget { theme.colorScheme.background; final effectiveCloseIcon = closeIcon ?? - (closeIconSrc == null && effectiveDialogTheme.closeIconSrc == null + (closeIconData == null && effectiveDialogTheme.closeIconData == null ? null : ShadButton.ghost( - icon: ShadImage.square( + icon: Icon( size: 16, - closeIconSrc ?? - effectiveDialogTheme.closeIconSrc ?? + closeIconData ?? + effectiveDialogTheme.closeIconData ?? LucideIcons.x, ), width: 20, diff --git a/lib/src/components/form/fields/date_picker.dart b/lib/src/components/form/fields/date_picker.dart index 23ce1bdd..8eda5309 100644 --- a/lib/src/components/form/fields/date_picker.dart +++ b/lib/src/components/form/fields/date_picker.dart @@ -7,7 +7,6 @@ import 'package:shadcn_ui/src/components/button.dart'; import 'package:shadcn_ui/src/components/calendar.dart'; import 'package:shadcn_ui/src/components/date_picker.dart'; import 'package:shadcn_ui/src/components/form/field.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/components/popover.dart'; import 'package:shadcn_ui/src/raw_components/portal.dart'; import 'package:shadcn_ui/src/theme/components/decorator.dart'; @@ -151,11 +150,11 @@ class ShadDatePickerFormField extends ShadFormBuilderField { /// {@macro ShadCalendar.navigationButtonIconSize} double? navigationButtonIconSize, - /// {@macro ShadCalendar.backNavigationButtonSrc} - ShadImageSrc? backNavigationButtonSrc, + /// {@macro ShadCalendar.backNavigationButtonIconData} + IconData? backNavigationButtonIconData, - /// {@macro ShadCalendar.forwardNavigationButtonSrc} - ShadImageSrc? forwardNavigationButtonSrc, + /// {@macro ShadCalendar.forwardNavigationButtonIconData} + IconData? forwardNavigationButtonIconData, /// {@macro ShadCalendar.navigationButtonPadding} EdgeInsets? navigationButtonPadding, @@ -288,8 +287,8 @@ class ShadDatePickerFormField extends ShadFormBuilderField { /// {@macro ShadButton.icon} Widget? icon, - /// {@macro ShadDatePicker.iconSrc} - ShadImageSrc? iconSrc, + /// {@macro ShadDatePicker.iconData} + IconData? iconData, /// {@macro ShadButton.child} Widget? buttonChild, @@ -472,8 +471,8 @@ class ShadDatePickerFormField extends ShadFormBuilderField { monthSelectorPadding: monthSelectorPadding, navigationButtonSize: navigationButtonSize, navigationButtonIconSize: navigationButtonIconSize, - backNavigationButtonSrc: backNavigationButtonSrc, - forwardNavigationButtonSrc: forwardNavigationButtonSrc, + backNavigationButtonIconData: backNavigationButtonIconData, + forwardNavigationButtonIconData: forwardNavigationButtonIconData, navigationButtonPadding: navigationButtonPadding, navigationButtonDisabledOpacity: navigationButtonDisabledOpacity, spacingBetweenMonths: spacingBetweenMonths, @@ -515,7 +514,7 @@ class ShadDatePickerFormField extends ShadFormBuilderField { useSameGroupIdForChild: useSameGroupIdForChild, onPressed: onPressed, onLongPress: onLongPress, - iconSrc: iconSrc, + iconData: iconData, buttonChild: buttonChild, buttonVariant: buttonVariant, size: size, diff --git a/lib/src/components/form/fields/date_range_picker.dart b/lib/src/components/form/fields/date_range_picker.dart index d5b5013f..e3606d0c 100644 --- a/lib/src/components/form/fields/date_range_picker.dart +++ b/lib/src/components/form/fields/date_range_picker.dart @@ -7,7 +7,6 @@ import 'package:shadcn_ui/src/components/button.dart'; import 'package:shadcn_ui/src/components/calendar.dart'; import 'package:shadcn_ui/src/components/date_picker.dart'; import 'package:shadcn_ui/src/components/form/field.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/components/popover.dart'; import 'package:shadcn_ui/src/raw_components/portal.dart'; import 'package:shadcn_ui/src/theme/components/decorator.dart'; @@ -152,11 +151,11 @@ class ShadDateRangePickerFormField /// {@macro ShadCalendar.navigationButtonIconSize} double? navigationButtonIconSize, - /// {@macro ShadCalendar.backNavigationButtonSrc} - ShadImageSrc? backNavigationButtonSrc, + /// {@macro ShadCalendar.backNavigationButtonIconData} + IconData? backNavigationButtonIconData, - /// {@macro ShadCalendar.forwardNavigationButtonSrc} - ShadImageSrc? forwardNavigationButtonSrc, + /// {@macro ShadCalendar.forwardNavigationButtonIconData} + IconData? forwardNavigationButtonIconData, /// {@macro ShadCalendar.navigationButtonPadding} EdgeInsets? navigationButtonPadding, @@ -295,8 +294,8 @@ class ShadDateRangePickerFormField /// {@macro ShadButton.icon} Widget? icon, - /// {@macro ShadDatePicker.iconSrc} - ShadImageSrc? iconSrc, + /// {@macro ShadDatePicker.iconData} + IconData? iconData, /// {@macro ShadButton.child} Widget? buttonChild, @@ -479,8 +478,8 @@ class ShadDateRangePickerFormField monthSelectorPadding: monthSelectorPadding, navigationButtonSize: navigationButtonSize, navigationButtonIconSize: navigationButtonIconSize, - backNavigationButtonSrc: backNavigationButtonSrc, - forwardNavigationButtonSrc: forwardNavigationButtonSrc, + backNavigationButtonIconData: backNavigationButtonIconData, + forwardNavigationButtonIconData: forwardNavigationButtonIconData, navigationButtonPadding: navigationButtonPadding, navigationButtonDisabledOpacity: navigationButtonDisabledOpacity, spacingBetweenMonths: spacingBetweenMonths, @@ -524,7 +523,7 @@ class ShadDateRangePickerFormField useSameGroupIdForChild: useSameGroupIdForChild, onPressed: onPressed, onLongPress: onLongPress, - iconSrc: iconSrc, + iconData: iconData, buttonChild: buttonChild, buttonVariant: buttonVariant, size: size, diff --git a/lib/src/components/image.dart b/lib/src/components/image.dart deleted file mode 100644 index aed30563..00000000 --- a/lib/src/components/image.dart +++ /dev/null @@ -1,291 +0,0 @@ -import 'package:flutter/material.dart'; -import 'package:flutter_svg/flutter_svg.dart'; -import 'package:shadcn_ui/src/utils/provider.dart'; -import 'package:vector_graphics/vector_graphics.dart' - show AssetBytesLoader, NetworkBytesLoader; - -typedef ShadImageSrc = Object; - -/// {@template ShadImageData} -/// The data image provided to the [ShadImage] with a Provider. -/// -/// This value is used only if the properties are not overriden in the -/// [ShadImage]. -/// {@endtemplate} -@immutable -class ShadImageData { - /// {@macro ShadImageData} - const ShadImageData({this.size, this.color}); - - /// The size of the image. - final Size? size; - - /// The color of the image. - final Color? color; - - @override - bool operator ==(Object other) { - if (identical(this, other)) return true; - - return other is ShadImageData && other.size == size && other.color == color; - } - - @override - int get hashCode { - return Object.hashAll([size, color]); - } -} - -/// {@template image} -/// Unifies the display of an image. -/// -/// It takes a [src] that can be remote or local. -/// -/// Handles the correct widget to use depending on the [src]. -/// -/// It can display the following image's extensions: -/// [.png, .jpg, .jpeg, .svg, .svg.vec] and some more. -/// -/// It takes a [width] and [height]. -/// -/// It takes a [color] or a [gradient] that will be applied to the image. -/// -/// Finally it takes a [fit], that defauls to [BoxFit.contain]. -/// {@endtemplate} -class ShadImage extends StatelessWidget { - /// {@macro image} - const ShadImage( - this.src, { - super.key, - this.width, - this.height, - this.color, - this.gradient, - this.fit = BoxFit.contain, - this.alignment = Alignment.center, - this.placeholder, - this.antialiasing = true, - this.semanticLabel, - this.svgTheme, - this.package, - this.headers, - }) : assert( - src is String || src is IconData, - 'src must be a String or IconData', - ); - - /// {@macro image} - const ShadImage.square( - this.src, { - super.key, - required double size, - this.color, - this.gradient, - this.fit = BoxFit.contain, - this.alignment = Alignment.center, - this.placeholder, - this.antialiasing = true, - this.semanticLabel, - this.svgTheme, - this.package, - this.headers, - }) : width = size, - height = size, - assert( - src is String || src is IconData, - 'src must be a String or IconData', - ); - - /// The src of the image. - /// - /// Can be a remote image url or a local asset (svg is supported) - /// - /// Accepted data: - /// - assets/doc.jpg - /// - assets/email.svg - /// - assets/email.svg.vec - /// - https://picsum.photos/200 - final T src; - - /// The width of the image - final double? width; - - /// The height of the image - final double? height; - - /// The color of the image - final Color? color; - - /// The gradient color applied to the image as a mask. - final Gradient? gradient; - - /// The fit of the image, defaults to BoxFit.contain. - final BoxFit fit; - - /// An optional placeholder that will be displayed while the image is loading. - final Widget? placeholder; - - /// The alignment of the image - final Alignment alignment; - - /// The antialiasing - final bool antialiasing; - - /// The semantic label - final String? semanticLabel; - - /// The theme of the svg - final SvgTheme? svgTheme; - - /// The package of the image, if any. - final String? package; - - /// If the image is remote, - /// the optional HTTP headers to send as part of the request. - final Map? headers; - - /// Returns `true` if the image is remote. - bool get isRemote => Uri.tryParse(src as String)?.host.isNotEmpty ?? false; - - /// Returns `true` if the image is an svg. - bool get isSvg => (src as String).contains('.svg'); - - /// Returns `true` if the image is a vector asset. - bool get isSvgVector => (src as String).contains('.svg.vec'); - - @override - Widget build(BuildContext context) { - final inherited = context.maybeWatch(); - - var effectiveColor = color ?? inherited?.color; - if (gradient != null && effectiveColor == null) { - effectiveColor = Colors.white; - } - - final colorFilter = effectiveColor != null - ? ColorFilter.mode(effectiveColor, BlendMode.srcIn) - : null; - - final effectiveWidth = width ?? inherited?.size?.width; - final effectiveHeight = height ?? inherited?.size?.height; - - final Widget image; - - // If the image is an IconData, use it as an icon - if (src is IconData) { - image = Icon( - src as IconData, - size: effectiveWidth, - color: effectiveColor, - semanticLabel: semanticLabel, - ); - } else { - final sourceString = src as String; - // If the image is remote, download and display it. - // Otherwise if the image is a svg image, use the [SvgPicture] class - // In any other case, display the image as a [png/jpg]. - // - // Finally, if there is a [gradient], apply a shader mask to the image. - if (isRemote) { - if (isSvgVector) { - image = SvgPicture( - NetworkBytesLoader(Uri.parse(sourceString)), - width: effectiveWidth, - height: effectiveHeight, - fit: fit, - alignment: alignment, - colorFilter: colorFilter, - clipBehavior: Clip.antiAlias, - placeholderBuilder: - placeholder != null ? (_) => placeholder! : null, - semanticsLabel: semanticLabel, - ); - } else if (isSvg) { - image = SvgPicture.network( - sourceString, - width: effectiveWidth, - height: effectiveHeight, - fit: fit, - colorFilter: colorFilter, - clipBehavior: Clip.antiAlias, - alignment: alignment, - headers: headers, - placeholderBuilder: - placeholder != null ? (_) => placeholder! : null, - semanticsLabel: semanticLabel, - ); - } else { - image = Image.network( - sourceString, - width: effectiveWidth, - height: effectiveHeight, - fit: fit, - semanticLabel: semanticLabel, - color: effectiveColor, - alignment: alignment, - isAntiAlias: antialiasing, - headers: headers, - frameBuilder: (context, child, frame, wasSynchronouslyLoaded) { - if (frame == null) { - return placeholder ?? const SizedBox.shrink(); - } - return child; - }, - ); - } - } else if (isSvgVector) { - image = SvgPicture( - AssetBytesLoader(sourceString, packageName: package), - width: effectiveWidth, - height: effectiveHeight, - fit: fit, - alignment: alignment, - colorFilter: colorFilter, - clipBehavior: Clip.antiAlias, - placeholderBuilder: placeholder != null ? (_) => placeholder! : null, - semanticsLabel: semanticLabel, - ); - } else if (isSvg) { - image = SvgPicture.asset( - sourceString, - width: effectiveWidth, - height: effectiveHeight, - fit: fit, - colorFilter: colorFilter, - clipBehavior: Clip.antiAlias, - alignment: alignment, - placeholderBuilder: placeholder != null ? (_) => placeholder! : null, - semanticsLabel: semanticLabel, - package: package, - ); - } else { - image = Image.asset( - sourceString, - width: effectiveWidth, - height: effectiveHeight, - fit: fit, - color: effectiveColor, - isAntiAlias: antialiasing, - alignment: alignment, - frameBuilder: (context, child, frame, wasSynchronouslyLoaded) { - if (frame == null) { - return placeholder ?? const SizedBox.shrink(); - } - return child; - }, - semanticLabel: semanticLabel, - package: package, - ); - } - } - - if (gradient == null) return image; - - return ShaderMask( - shaderCallback: (bounds) { - return gradient!.createShader(Offset.zero & bounds.size); - }, - child: image, - ); - } -} diff --git a/lib/src/components/resizable.dart b/lib/src/components/resizable.dart index 98241f71..a1bf3aa6 100644 --- a/lib/src/components/resizable.dart +++ b/lib/src/components/resizable.dart @@ -1,7 +1,6 @@ import 'package:collection/collection.dart'; import 'package:flutter/material.dart'; import 'package:lucide_icons_flutter/lucide_icons.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/theme/components/decorator.dart'; import 'package:shadcn_ui/src/theme/theme.dart'; import 'package:shadcn_ui/src/utils/border.dart'; @@ -137,7 +136,7 @@ class ShadResizablePanelGroup extends StatefulWidget { this.verticalDirection, this.controller, this.showHandle, - this.handleIconSrc, + this.handleIconData, this.handleIcon, this.dividerSize, this.dividerThickness, @@ -158,7 +157,7 @@ class ShadResizablePanelGroup extends StatefulWidget { final VerticalDirection? verticalDirection; final ShadResizableController? controller; final bool? showHandle; - final ShadImageSrc? handleIconSrc; + final IconData? handleIconData; final Widget? handleIcon; final double? dividerSize; final double? dividerThickness; @@ -167,7 +166,7 @@ class ShadResizablePanelGroup extends StatefulWidget { final Color? dividerColor; final ShadDecoration? handleDecoration; final EdgeInsets? handlePadding; - final Size? handleSize; + final double? handleSize; @override ShadResizablePanelGroupState createState() => ShadResizablePanelGroupState(); @@ -294,9 +293,8 @@ class ShadResizablePanelGroupState extends State { horizontal: widget.axis == Axis.vertical ? 3 : 1, vertical: widget.axis == Axis.vertical ? 1 : 3, ); - final effectiveHandleSize = widget.handleSize ?? - theme.resizableTheme.handleSize ?? - const Size.square(10); + final effectiveHandleSize = + widget.handleSize ?? theme.resizableTheme.handleSize ?? 10; final effectiveMainAxisAlignment = widget.mainAxisAlignment ?? theme.resizableTheme.mainAxisAlignment ?? @@ -373,13 +371,12 @@ class ShadResizablePanelGroupState extends State { decoration: effectiveHandleDecoration, child: Padding( padding: effectiveHandlePadding, - child: ShadImage( - widget.handleIconSrc ?? + child: Icon( + widget.handleIconData ?? (isHorizontal ? LucideIcons.gripVertical : LucideIcons.gripHorizontal), - width: effectiveHandleSize.width, - height: effectiveHandleSize.height, + size: effectiveHandleSize, ), ), ); @@ -400,7 +397,7 @@ class ShadResizablePanelGroupState extends State { if (effectiveShowHandle) { leadingPosition -= effectiveHandlePadding.horizontal / 2; if (!theme.disableSecondaryBorder) { - leadingPosition -= effectiveHandleSize.width / 2; + leadingPosition -= effectiveHandleSize / 2; } } diff --git a/lib/src/components/select.dart b/lib/src/components/select.dart index ea10ec9d..76945da2 100644 --- a/lib/src/components/select.dart +++ b/lib/src/components/select.dart @@ -7,7 +7,6 @@ import 'package:flutter/services.dart'; import 'package:flutter_animate/flutter_animate.dart'; import 'package:lucide_icons_flutter/lucide_icons.dart'; import 'package:shadcn_ui/src/components/disabled.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/components/input.dart'; import 'package:shadcn_ui/src/components/popover.dart'; import 'package:shadcn_ui/src/raw_components/focusable.dart'; @@ -656,7 +655,7 @@ class ShadSelectState extends State> { } final effectiveTrailing = widget.trailing ?? - ShadImage.square( + Icon( LucideIcons.chevronDown, size: 16, color: theme.colorScheme.popoverForeground.withValues(alpha: .5), @@ -805,7 +804,7 @@ class ShadSelectState extends State> { width: calculatedMinWidth, padding: const EdgeInsets.symmetric(vertical: 4), - child: ShadImage.square( + child: Icon( LucideIcons.chevronUp, size: 16, color: theme.colorScheme.popoverForeground, @@ -835,7 +834,7 @@ class ShadSelectState extends State> { width: calculatedMinWidth, padding: const EdgeInsets.symmetric(vertical: 4), - child: ShadImage.square( + child: Icon( LucideIcons.chevronDown, size: 16, color: theme.colorScheme.popoverForeground, @@ -1035,7 +1034,7 @@ class _ShadOptionState extends State> { visible: selected, child: Padding( padding: const EdgeInsets.only(right: 8), - child: ShadImage.square( + child: Icon( LucideIcons.check, size: 16, color: theme.colorScheme.popoverForeground, diff --git a/lib/src/components/sheet.dart b/lib/src/components/sheet.dart index f16ad6b8..fd325fa0 100644 --- a/lib/src/components/sheet.dart +++ b/lib/src/components/sheet.dart @@ -5,7 +5,6 @@ import 'package:flutter/material.dart'; import 'package:flutter/rendering.dart'; import 'package:flutter_animate/flutter_animate.dart'; import 'package:shadcn_ui/src/components/dialog.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/theme/theme.dart'; import 'package:shadcn_ui/src/utils/position.dart'; @@ -148,7 +147,7 @@ class ShadSheet extends StatefulWidget { this.constraints, this.expandCrossSide, this.closeIcon, - this.closeIconSrc, + this.closeIconData, this.closeIconPosition, this.radius, this.backgroundColor, @@ -190,7 +189,7 @@ class ShadSheet extends StatefulWidget { final BoxConstraints? constraints; final bool? expandCrossSide; final Widget? closeIcon; - final ShadImageSrc? closeIconSrc; + final IconData? closeIconData; final ShadPosition? closeIconPosition; final BorderRadius? radius; final Color? backgroundColor; @@ -464,8 +463,8 @@ class _ShadSheetState extends State final effectiveDescriptionStyle = widget.descriptionStyle ?? theme.sheetTheme.descriptionStyle; - final effectiveCloseIconSrc = - widget.closeIconSrc ?? theme.sheetTheme.closeIconSrc; + final effectiveCloseIconData = + widget.closeIconData ?? theme.sheetTheme.closeIconData; final effectiveCloseIconPosition = widget.closeIconPosition ?? theme.sheetTheme.closeIconPosition; @@ -504,7 +503,7 @@ class _ShadSheetState extends State actions: widget.actions, radius: effectiveRadius, closeIcon: widget.closeIcon, - closeIconSrc: effectiveCloseIconSrc, + closeIconData: effectiveCloseIconData, closeIconPosition: effectiveCloseIconPosition, backgroundColor: effectiveBackgroundColor, expandActionsWhenTiny: effectiveExpandActionsWhenTiny, diff --git a/lib/src/components/toast.dart b/lib/src/components/toast.dart index 51ce11a2..ab344902 100644 --- a/lib/src/components/toast.dart +++ b/lib/src/components/toast.dart @@ -5,7 +5,6 @@ import 'package:flutter_animate/flutter_animate.dart'; import 'package:lucide_icons_flutter/lucide_icons.dart'; import 'package:shadcn_ui/src/components/button.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/theme/theme.dart'; import 'package:shadcn_ui/src/theme/themes/shadows.dart'; import 'package:shadcn_ui/src/utils/extensions/order_policy.dart'; @@ -258,7 +257,7 @@ class ShadToast extends StatefulWidget { this.description, this.action, this.closeIcon, - this.closeIconSrc, + this.closeIconData, this.alignment, this.offset, this.duration, @@ -286,7 +285,7 @@ class ShadToast extends StatefulWidget { this.description, this.action, this.closeIcon, - this.closeIconSrc, + this.closeIconData, this.alignment, this.offset, this.duration, @@ -315,7 +314,7 @@ class ShadToast extends StatefulWidget { this.description, this.action, this.closeIcon, - this.closeIconSrc, + this.closeIconData, this.alignment, this.offset, this.duration, @@ -341,7 +340,7 @@ class ShadToast extends StatefulWidget { final Widget? description; final Widget? action; final Widget? closeIcon; - final ShadImageSrc? closeIconSrc; + final IconData? closeIconData; final Alignment? alignment; final Offset? offset; final Duration? duration; @@ -396,10 +395,10 @@ class _ShadToastState extends State { final effectiveCloseIcon = widget.closeIcon ?? ShadButton.ghost( - icon: ShadImage.square( + icon: Icon( size: 16, - widget.closeIconSrc ?? - effectiveToastTheme.closeIconSrc ?? + widget.closeIconData ?? + effectiveToastTheme.closeIconData ?? LucideIcons.x, ), width: 20, diff --git a/lib/src/theme/components/accordion.dart b/lib/src/theme/components/accordion.dart index 9135f81c..454e25b7 100644 --- a/lib/src/theme/components/accordion.dart +++ b/lib/src/theme/components/accordion.dart @@ -1,13 +1,12 @@ import 'package:flutter/foundation.dart'; import 'package:flutter/widgets.dart'; import 'package:flutter_animate/flutter_animate.dart'; -import 'package:shadcn_ui/src/components/image.dart'; @immutable class ShadAccordionTheme { const ShadAccordionTheme({ this.merge = true, - this.iconSrc, + this.iconData, this.iconEffects, this.padding, this.underlineTitleOnHover, @@ -19,7 +18,7 @@ class ShadAccordionTheme { }); final bool merge; - final ShadImageSrc? iconSrc; + final IconData? iconData; final List>? iconEffects; final EdgeInsets? padding; final bool? underlineTitleOnHover; @@ -37,7 +36,7 @@ class ShadAccordionTheme { if (identical(a, b)) return a; return ShadAccordionTheme( merge: t < 0.5 ? a.merge : b.merge, - iconSrc: t < 0.5 ? a.iconSrc : b.iconSrc, + iconData: t < 0.5 ? a.iconData : b.iconData, iconEffects: t < 0.5 ? a.iconEffects : b.iconEffects, padding: EdgeInsets.lerp(a.padding, b.padding, t), underlineTitleOnHover: @@ -54,7 +53,7 @@ class ShadAccordionTheme { if (other == null) return this; if (!other.merge) return other; return copyWith( - iconSrc: other.iconSrc, + iconData: other.iconData, iconEffects: other.iconEffects, padding: other.padding, underlineTitleOnHover: other.underlineTitleOnHover, @@ -72,7 +71,7 @@ class ShadAccordionTheme { return other is ShadAccordionTheme && other.merge == merge && - other.iconSrc == iconSrc && + other.iconData == iconData && listEquals(other.iconEffects, iconEffects) && other.padding == padding && other.underlineTitleOnHover == underlineTitleOnHover && @@ -86,7 +85,7 @@ class ShadAccordionTheme { @override int get hashCode { return merge.hashCode ^ - iconSrc.hashCode ^ + iconData.hashCode ^ iconEffects.hashCode ^ padding.hashCode ^ underlineTitleOnHover.hashCode ^ @@ -99,7 +98,7 @@ class ShadAccordionTheme { ShadAccordionTheme copyWith({ bool? merge, - ShadImageSrc? iconSrc, + IconData? iconData, List>? iconEffects, EdgeInsets? padding, bool? underlineTitleOnHover, @@ -111,7 +110,7 @@ class ShadAccordionTheme { }) { return ShadAccordionTheme( merge: merge ?? this.merge, - iconSrc: iconSrc ?? this.iconSrc, + iconData: iconData ?? this.iconData, iconEffects: iconEffects ?? this.iconEffects, padding: padding ?? this.padding, underlineTitleOnHover: diff --git a/lib/src/theme/components/alert.dart b/lib/src/theme/components/alert.dart index 8c0c9002..6574da5d 100644 --- a/lib/src/theme/components/alert.dart +++ b/lib/src/theme/components/alert.dart @@ -9,7 +9,6 @@ class ShadAlertTheme { this.decoration, this.iconPadding, this.iconColor, - this.iconSize, this.titleStyle, this.descriptionStyle, this.mainAxisAlignment, @@ -21,7 +20,6 @@ class ShadAlertTheme { final ShadDecoration? decoration; final EdgeInsets? iconPadding; final Color? iconColor; - final Size? iconSize; final TextStyle? titleStyle; final TextStyle? descriptionStyle; final MainAxisAlignment? mainAxisAlignment; @@ -41,7 +39,6 @@ class ShadAlertTheme { decoration: ShadDecoration.lerp(a.decoration, b.decoration, t), iconPadding: EdgeInsets.lerp(a.iconPadding, b.iconPadding, t), iconColor: Color.lerp(a.iconColor, b.iconColor, t), - iconSize: Size.lerp(a.iconSize, b.iconSize, t), titleStyle: TextStyle.lerp(a.titleStyle, b.titleStyle, t), descriptionStyle: TextStyle.lerp(a.descriptionStyle, b.descriptionStyle, t), @@ -56,7 +53,6 @@ class ShadAlertTheme { ShadDecoration? decoration, EdgeInsets? iconPadding, Color? iconColor, - Size? iconSize, TextStyle? titleStyle, TextStyle? descriptionStyle, MainAxisAlignment? mainAxisAlignment, @@ -68,7 +64,6 @@ class ShadAlertTheme { decoration: decoration ?? this.decoration, iconPadding: iconPadding ?? this.iconPadding, iconColor: iconColor ?? this.iconColor, - iconSize: iconSize ?? this.iconSize, titleStyle: titleStyle ?? this.titleStyle, descriptionStyle: descriptionStyle ?? this.descriptionStyle, mainAxisAlignment: mainAxisAlignment ?? this.mainAxisAlignment, @@ -84,7 +79,6 @@ class ShadAlertTheme { decoration: decoration?.mergeWith(other.decoration) ?? other.decoration, iconPadding: other.iconPadding, iconColor: other.iconColor, - iconSize: other.iconSize, titleStyle: other.titleStyle, descriptionStyle: other.descriptionStyle, mainAxisAlignment: other.mainAxisAlignment, @@ -102,7 +96,6 @@ class ShadAlertTheme { other.decoration == decoration && other.iconPadding == iconPadding && other.iconColor == iconColor && - other.iconSize == iconSize && other.titleStyle == titleStyle && other.descriptionStyle == descriptionStyle && other.mainAxisAlignment == mainAxisAlignment && @@ -116,7 +109,6 @@ class ShadAlertTheme { decoration.hashCode ^ iconPadding.hashCode ^ iconColor.hashCode ^ - iconSize.hashCode ^ titleStyle.hashCode ^ descriptionStyle.hashCode ^ mainAxisAlignment.hashCode ^ diff --git a/lib/src/theme/components/button.dart b/lib/src/theme/components/button.dart index 0ec42cfc..acc16473 100644 --- a/lib/src/theme/components/button.dart +++ b/lib/src/theme/components/button.dart @@ -281,27 +281,21 @@ class ShadButtonSizeTheme { required this.height, required this.padding, this.width, - this.iconSize, }); final bool merge; final double height; final EdgeInsets padding; final double? width; - /// {@macro ShadButton.iconSize} - final Size? iconSize; - ShadButtonSizeTheme copyWith({ double? height, EdgeInsets? padding, double? width, - Size? iconSize, }) { return ShadButtonSizeTheme( height: height ?? this.height, padding: padding ?? this.padding, width: width ?? this.width, - iconSize: iconSize ?? this.iconSize, ); } @@ -315,7 +309,6 @@ class ShadButtonSizeTheme { height: lerpDouble(a?.height, b?.height, t)!, padding: EdgeInsets.lerp(a?.padding, b?.padding, t)!, width: lerpDouble(a?.width, b?.width, t), - iconSize: Size.lerp(a?.iconSize, b?.iconSize, t), ); } @@ -326,7 +319,6 @@ class ShadButtonSizeTheme { height: other.height, padding: other.padding, width: other.width, - iconSize: other.iconSize, ); } @@ -337,13 +329,11 @@ class ShadButtonSizeTheme { return other is ShadButtonSizeTheme && other.height == height && other.padding == padding && - other.width == width && - other.iconSize == iconSize; + other.width == width; } @override - int get hashCode => - height.hashCode ^ padding.hashCode ^ width.hashCode ^ iconSize.hashCode; + int get hashCode => height.hashCode ^ padding.hashCode ^ width.hashCode; } // The theme for the predefined sizes of ShadButton. diff --git a/lib/src/theme/components/calendar.dart b/lib/src/theme/components/calendar.dart index 280834ae..187ee309 100644 --- a/lib/src/theme/components/calendar.dart +++ b/lib/src/theme/components/calendar.dart @@ -15,8 +15,8 @@ class ShadCalendarTheme { this.monthSelectorPadding, this.navigationButtonSize, this.navigationButtonIconSize, - this.backNavigationButtonSrc, - this.forwardNavigationButtonSrc, + this.backNavigationButtonIconData, + this.forwardNavigationButtonIconData, this.navigationButtonPadding, this.navigationButtonDisabledOpacity, this.decoration, @@ -86,11 +86,11 @@ class ShadCalendarTheme { /// {@macro ShadCalendar.navigationButtonIconSize} final double? navigationButtonIconSize; - /// {@macro ShadCalendar.backNavigationButtonSrc} - final ShadImageSrc? backNavigationButtonSrc; + /// {@macro ShadCalendar.backNavigationButtonIconData} + final IconData? backNavigationButtonIconData; - /// {@macro ShadCalendar.forwardNavigationButtonSrc} - final ShadImageSrc? forwardNavigationButtonSrc; + /// {@macro ShadCalendar.forwardNavigationButtonIconData} + final IconData? forwardNavigationButtonIconData; /// {@macro ShadCalendar.navigationButtonPadding} final EdgeInsets? navigationButtonPadding; @@ -254,10 +254,12 @@ class ShadCalendarTheme { b.navigationButtonIconSize, t, ), - backNavigationButtonSrc: - t < .5 ? a.backNavigationButtonSrc : b.backNavigationButtonSrc, - forwardNavigationButtonSrc: - t < .5 ? a.forwardNavigationButtonSrc : b.forwardNavigationButtonSrc, + backNavigationButtonIconData: t < .5 + ? a.backNavigationButtonIconData + : b.backNavigationButtonIconData, + forwardNavigationButtonIconData: t < .5 + ? a.forwardNavigationButtonIconData + : b.forwardNavigationButtonIconData, navigationButtonPadding: EdgeInsets.lerp( a.navigationButtonPadding, b.navigationButtonPadding, @@ -398,10 +400,10 @@ class ShadCalendarTheme { navigationButtonSize: other.navigationButtonSize ?? navigationButtonSize, navigationButtonIconSize: other.navigationButtonIconSize ?? navigationButtonIconSize, - backNavigationButtonSrc: - other.backNavigationButtonSrc ?? backNavigationButtonSrc, - forwardNavigationButtonSrc: - other.forwardNavigationButtonSrc ?? forwardNavigationButtonSrc, + backNavigationButtonIconData: + other.backNavigationButtonIconData ?? backNavigationButtonIconData, + forwardNavigationButtonIconData: other.forwardNavigationButtonIconData ?? + forwardNavigationButtonIconData, navigationButtonPadding: other.navigationButtonPadding ?? navigationButtonPadding, navigationButtonDisabledOpacity: other.navigationButtonDisabledOpacity ?? @@ -476,8 +478,9 @@ class ShadCalendarTheme { other.monthSelectorPadding == monthSelectorPadding && other.navigationButtonSize == navigationButtonSize && other.navigationButtonIconSize == navigationButtonIconSize && - other.backNavigationButtonSrc == backNavigationButtonSrc && - other.forwardNavigationButtonSrc == forwardNavigationButtonSrc && + other.backNavigationButtonIconData == backNavigationButtonIconData && + other.forwardNavigationButtonIconData == + forwardNavigationButtonIconData && other.navigationButtonPadding == navigationButtonPadding && other.navigationButtonDisabledOpacity == navigationButtonDisabledOpacity && @@ -537,8 +540,8 @@ class ShadCalendarTheme { monthSelectorPadding.hashCode ^ navigationButtonSize.hashCode ^ navigationButtonIconSize.hashCode ^ - backNavigationButtonSrc.hashCode ^ - forwardNavigationButtonSrc.hashCode ^ + backNavigationButtonIconData.hashCode ^ + forwardNavigationButtonIconData.hashCode ^ navigationButtonPadding.hashCode ^ navigationButtonDisabledOpacity.hashCode ^ decoration.hashCode ^ @@ -594,8 +597,8 @@ class ShadCalendarTheme { EdgeInsets? monthSelectorPadding, double? navigationButtonSize, double? navigationButtonIconSize, - ShadImageSrc? backNavigationButtonSrc, - ShadImageSrc? forwardNavigationButtonSrc, + IconData? backNavigationButtonIconData, + IconData? forwardNavigationButtonIconData, EdgeInsets? navigationButtonPadding, double? navigationButtonDisabledOpacity, ShadDecoration? decoration, @@ -652,10 +655,10 @@ class ShadCalendarTheme { navigationButtonSize: navigationButtonSize ?? this.navigationButtonSize, navigationButtonIconSize: navigationButtonIconSize ?? this.navigationButtonIconSize, - backNavigationButtonSrc: - backNavigationButtonSrc ?? this.backNavigationButtonSrc, - forwardNavigationButtonSrc: - forwardNavigationButtonSrc ?? this.forwardNavigationButtonSrc, + backNavigationButtonIconData: + backNavigationButtonIconData ?? this.backNavigationButtonIconData, + forwardNavigationButtonIconData: forwardNavigationButtonIconData ?? + this.forwardNavigationButtonIconData, navigationButtonPadding: navigationButtonPadding ?? this.navigationButtonPadding, navigationButtonDisabledOpacity: navigationButtonDisabledOpacity ?? diff --git a/lib/src/theme/components/date_picker.dart b/lib/src/theme/components/date_picker.dart index 365b86e4..343bb66e 100644 --- a/lib/src/theme/components/date_picker.dart +++ b/lib/src/theme/components/date_picker.dart @@ -5,7 +5,6 @@ import 'package:flutter/widgets.dart'; import 'package:flutter_animate/flutter_animate.dart'; import 'package:shadcn_ui/src/components/button.dart'; import 'package:shadcn_ui/src/components/calendar.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/raw_components/portal.dart'; import 'package:shadcn_ui/src/theme/components/button.dart'; import 'package:shadcn_ui/src/theme/components/decorator.dart'; @@ -23,8 +22,8 @@ class ShadDatePickerTheme { this.monthSelectorPadding, this.navigationButtonSize, this.navigationButtonIconSize, - this.backNavigationButtonSrc, - this.forwardNavigationButtonSrc, + this.backNavigationButtonIconData, + this.forwardNavigationButtonIconData, this.navigationButtonPadding, this.navigationButtonDisabledOpacity, this.calendarDecoration, @@ -102,7 +101,7 @@ class ShadDatePickerTheme { this.formatDate, this.formatDateRange, this.buttonPadding, - this.iconSrc, + this.iconData, this.orderPolicy, this.expands, }); @@ -115,8 +114,8 @@ class ShadDatePickerTheme { /// {@macro ShadDatePicker.formatDateRange} final String Function(ShadDateTimeRange)? formatDateRange; - /// {@macro ShadDatePicker.iconSrc} - final ShadImageSrc? iconSrc; + /// {@macro ShadDatePicker.iconData} + final IconData? iconData; // --- // CALENDAR @@ -143,11 +142,11 @@ class ShadDatePickerTheme { /// {@macro ShadCalendar.navigationButtonIconSize} final double? navigationButtonIconSize; - /// {@macro ShadCalendar.backNavigationButtonSrc} - final ShadImageSrc? backNavigationButtonSrc; + /// {@macro ShadCalendar.backNavigationButtonIconData} + final IconData? backNavigationButtonIconData; - /// {@macro ShadCalendar.forwardNavigationButtonSrc} - final ShadImageSrc? forwardNavigationButtonSrc; + /// {@macro ShadCalendar.forwardNavigationButtonIconData} + final IconData? forwardNavigationButtonIconData; /// {@macro ShadCalendar.navigationButtonPadding} final EdgeInsets? navigationButtonPadding; @@ -418,10 +417,12 @@ class ShadDatePickerTheme { b.navigationButtonIconSize, t, ), - backNavigationButtonSrc: - t < .5 ? a.backNavigationButtonSrc : b.backNavigationButtonSrc, - forwardNavigationButtonSrc: - t < .5 ? a.forwardNavigationButtonSrc : b.forwardNavigationButtonSrc, + backNavigationButtonIconData: t < .5 + ? a.backNavigationButtonIconData + : b.backNavigationButtonIconData, + forwardNavigationButtonIconData: t < .5 + ? a.forwardNavigationButtonIconData + : b.forwardNavigationButtonIconData, navigationButtonPadding: EdgeInsets.lerp( a.navigationButtonPadding, b.navigationButtonPadding, @@ -596,7 +597,7 @@ class ShadDatePickerTheme { buttonVariant: t < 0.5 ? a.buttonVariant : b.buttonVariant, buttonPadding: EdgeInsetsGeometry.lerp(a.buttonPadding, b.buttonPadding, t), - iconSrc: t < 0.5 ? a.iconSrc : b.iconSrc, + iconData: t < 0.5 ? a.iconData : b.iconData, orderPolicy: t < .5 ? a.orderPolicy : b.orderPolicy, expands: t < .5 ? a.expands : b.expands, ); @@ -615,10 +616,10 @@ class ShadDatePickerTheme { navigationButtonSize: other.navigationButtonSize ?? navigationButtonSize, navigationButtonIconSize: other.navigationButtonIconSize ?? navigationButtonIconSize, - backNavigationButtonSrc: - other.backNavigationButtonSrc ?? backNavigationButtonSrc, - forwardNavigationButtonSrc: - other.forwardNavigationButtonSrc ?? forwardNavigationButtonSrc, + backNavigationButtonIconData: + other.backNavigationButtonIconData ?? backNavigationButtonIconData, + forwardNavigationButtonIconData: other.forwardNavigationButtonIconData ?? + forwardNavigationButtonIconData, navigationButtonPadding: other.navigationButtonPadding ?? navigationButtonPadding, navigationButtonDisabledOpacity: other.navigationButtonDisabledOpacity ?? @@ -713,7 +714,7 @@ class ShadDatePickerTheme { formatDateRange: other.formatDateRange, buttonVariant: other.buttonVariant, buttonPadding: other.buttonPadding, - iconSrc: other.iconSrc, + iconData: other.iconData, orderPolicy: other.orderPolicy, expands: other.expands, ); @@ -732,8 +733,9 @@ class ShadDatePickerTheme { other.monthSelectorPadding == monthSelectorPadding && other.navigationButtonSize == navigationButtonSize && other.navigationButtonIconSize == navigationButtonIconSize && - other.backNavigationButtonSrc == backNavigationButtonSrc && - other.forwardNavigationButtonSrc == forwardNavigationButtonSrc && + other.backNavigationButtonIconData == backNavigationButtonIconData && + other.forwardNavigationButtonIconData == + forwardNavigationButtonIconData && other.navigationButtonPadding == navigationButtonPadding && other.navigationButtonDisabledOpacity == navigationButtonDisabledOpacity && @@ -813,7 +815,7 @@ class ShadDatePickerTheme { other.formatDateRange == formatDateRange && other.buttonVariant == buttonVariant && other.buttonPadding == buttonPadding && - other.iconSrc == iconSrc && + other.iconData == iconData && other.orderPolicy == orderPolicy && other.expands == expands; } @@ -828,8 +830,8 @@ class ShadDatePickerTheme { monthSelectorPadding.hashCode ^ navigationButtonSize.hashCode ^ navigationButtonIconSize.hashCode ^ - backNavigationButtonSrc.hashCode ^ - forwardNavigationButtonSrc.hashCode ^ + backNavigationButtonIconData.hashCode ^ + forwardNavigationButtonIconData.hashCode ^ navigationButtonPadding.hashCode ^ navigationButtonDisabledOpacity.hashCode ^ calendarDecoration.hashCode ^ @@ -906,7 +908,7 @@ class ShadDatePickerTheme { formatDateRange.hashCode ^ buttonVariant.hashCode ^ buttonPadding.hashCode ^ - iconSrc.hashCode ^ + iconData.hashCode ^ orderPolicy.hashCode ^ expands.hashCode; } @@ -920,8 +922,8 @@ class ShadDatePickerTheme { EdgeInsets? monthSelectorPadding, double? navigationButtonSize, double? navigationButtonIconSize, - ShadImageSrc? backNavigationButtonSrc, - ShadImageSrc? forwardNavigationButtonSrc, + IconData? backNavigationButtonIconData, + IconData? forwardNavigationButtonIconData, EdgeInsets? navigationButtonPadding, double? navigationButtonDisabledOpacity, ShadDecoration? calendarDecoration, @@ -1001,7 +1003,7 @@ class ShadDatePickerTheme { String Function(ShadDateTimeRange range)? formatDateRange, ShadButtonVariant? buttonVariant, EdgeInsetsGeometry? buttonPadding, - ShadImageSrc? iconSrc, + IconData? iconData, WidgetOrderPolicy? orderPolicy, bool? expands, }) { @@ -1016,10 +1018,10 @@ class ShadDatePickerTheme { navigationButtonSize: navigationButtonSize ?? this.navigationButtonSize, navigationButtonIconSize: navigationButtonIconSize ?? this.navigationButtonIconSize, - backNavigationButtonSrc: - backNavigationButtonSrc ?? this.backNavigationButtonSrc, - forwardNavigationButtonSrc: - forwardNavigationButtonSrc ?? this.forwardNavigationButtonSrc, + backNavigationButtonIconData: + backNavigationButtonIconData ?? this.backNavigationButtonIconData, + forwardNavigationButtonIconData: forwardNavigationButtonIconData ?? + this.forwardNavigationButtonIconData, navigationButtonPadding: navigationButtonPadding ?? this.navigationButtonPadding, navigationButtonDisabledOpacity: navigationButtonDisabledOpacity ?? @@ -1114,7 +1116,7 @@ class ShadDatePickerTheme { formatDateRange: formatDateRange ?? this.formatDateRange, buttonVariant: buttonVariant ?? this.buttonVariant, buttonPadding: buttonPadding ?? this.buttonPadding, - iconSrc: iconSrc ?? this.iconSrc, + iconData: iconData ?? this.iconData, orderPolicy: orderPolicy ?? this.orderPolicy, expands: expands ?? this.expands, ); diff --git a/lib/src/theme/components/dialog.dart b/lib/src/theme/components/dialog.dart index 4a85027c..0e2125ea 100644 --- a/lib/src/theme/components/dialog.dart +++ b/lib/src/theme/components/dialog.dart @@ -3,7 +3,6 @@ import 'dart:ui'; import 'package:flutter/foundation.dart'; import 'package:flutter/widgets.dart'; import 'package:flutter_animate/flutter_animate.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/utils/position.dart'; @@ -11,7 +10,7 @@ import 'package:shadcn_ui/src/utils/position.dart'; class ShadDialogTheme { const ShadDialogTheme({ this.merge = true, - this.closeIconSrc, + this.closeIconData, this.closeIconPosition, this.radius, this.backgroundColor, @@ -40,7 +39,7 @@ class ShadDialogTheme { }); final bool merge; - final ShadImageSrc? closeIconSrc; + final IconData? closeIconData; final ShadPosition? closeIconPosition; final BorderRadius? radius; final Color? backgroundColor; @@ -75,7 +74,7 @@ class ShadDialogTheme { if (identical(a, b)) return a; return ShadDialogTheme( merge: b.merge, - closeIconSrc: b.closeIconSrc, + closeIconData: b.closeIconData, closeIconPosition: ShadPosition.lerp(a.closeIconPosition, b.closeIconPosition, t), radius: BorderRadius.lerp(a.radius, b.radius, t), @@ -108,7 +107,7 @@ class ShadDialogTheme { ShadDialogTheme copyWith({ bool? merge, - ShadImageSrc? closeIconSrc, + IconData? closeIconData, ShadPosition? closeIconPosition, BorderRadius? radius, Color? backgroundColor, @@ -137,7 +136,7 @@ class ShadDialogTheme { }) { return ShadDialogTheme( merge: merge ?? this.merge, - closeIconSrc: closeIconSrc, + closeIconData: closeIconData, closeIconPosition: closeIconPosition, radius: radius, backgroundColor: backgroundColor, @@ -170,7 +169,7 @@ class ShadDialogTheme { if (other == null) return this; if (!other.merge) return other; return copyWith( - closeIconSrc: other.closeIconSrc, + closeIconData: other.closeIconData, closeIconPosition: other.closeIconPosition, radius: other.radius, backgroundColor: other.backgroundColor, @@ -205,7 +204,7 @@ class ShadDialogTheme { return other is ShadDialogTheme && other.merge == merge && - other.closeIconSrc == closeIconSrc && + other.closeIconData == closeIconData && other.closeIconPosition == closeIconPosition && other.radius == radius && other.backgroundColor == backgroundColor && @@ -236,7 +235,7 @@ class ShadDialogTheme { @override int get hashCode { return merge.hashCode ^ - closeIconSrc.hashCode ^ + closeIconData.hashCode ^ closeIconPosition.hashCode ^ radius.hashCode ^ backgroundColor.hashCode ^ diff --git a/lib/src/theme/components/resizable.dart b/lib/src/theme/components/resizable.dart index a1a83ce6..599f7e81 100644 --- a/lib/src/theme/components/resizable.dart +++ b/lib/src/theme/components/resizable.dart @@ -1,7 +1,6 @@ import 'dart:ui'; import 'package:flutter/material.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/theme/components/decorator.dart'; @immutable @@ -14,7 +13,7 @@ class ShadResizableTheme { this.textDirection, this.verticalDirection, this.showHandle, - this.handleIconSrc, + this.handleIconData, this.dividerSize, this.resetOnDoubleTap, this.handleDecoration, @@ -31,12 +30,12 @@ class ShadResizableTheme { final TextDirection? textDirection; final VerticalDirection? verticalDirection; final bool? showHandle; - final ShadImageSrc? handleIconSrc; + final IconData? handleIconData; final double? dividerSize; final bool? resetOnDoubleTap; final ShadDecoration? handleDecoration; final EdgeInsets? handlePadding; - final Size? handleSize; + final double? handleSize; final double? dividerThickness; final Color? dividerColor; @@ -54,13 +53,13 @@ class ShadResizableTheme { textDirection: t < 0.5 ? a.textDirection : b.textDirection, verticalDirection: t < 0.5 ? a.verticalDirection : b.verticalDirection, showHandle: t < 0.5 ? a.showHandle : b.showHandle, - handleIconSrc: t < 0.5 ? a.handleIconSrc : b.handleIconSrc, + handleIconData: t < 0.5 ? a.handleIconData : b.handleIconData, dividerSize: lerpDouble(a.dividerSize, b.dividerSize, t), resetOnDoubleTap: t < 0.5 ? a.resetOnDoubleTap : b.resetOnDoubleTap, handleDecoration: ShadDecoration.lerp(a.handleDecoration, b.handleDecoration, t), handlePadding: EdgeInsets.lerp(a.handlePadding, b.handlePadding, t), - handleSize: Size.lerp(a.handleSize, b.handleSize, t), + handleSize: lerpDouble(a.handleSize, b.handleSize, t), dividerColor: Color.lerp(a.dividerColor, b.dividerColor, t), dividerThickness: lerpDouble(a.dividerThickness, b.dividerThickness, t), ); @@ -76,7 +75,7 @@ class ShadResizableTheme { textDirection: other.textDirection, verticalDirection: other.verticalDirection, showHandle: other.showHandle, - handleIconSrc: other.handleIconSrc, + handleIconData: other.handleIconData, dividerSize: other.dividerSize, resetOnDoubleTap: other.resetOnDoubleTap, handleDecoration: handleDecoration?.mergeWith(other.handleDecoration) ?? @@ -96,12 +95,12 @@ class ShadResizableTheme { TextDirection? textDirection, VerticalDirection? verticalDirection, bool? showHandle, - ShadImageSrc? handleIconSrc, + IconData? handleIconData, double? dividerSize, bool? resetOnDoubleTap, ShadDecoration? handleDecoration, EdgeInsets? handlePadding, - Size? handleSize, + double? handleSize, Color? dividerColor, double? dividerThickness, }) { @@ -113,7 +112,7 @@ class ShadResizableTheme { textDirection: textDirection ?? this.textDirection, verticalDirection: verticalDirection ?? this.verticalDirection, showHandle: showHandle ?? this.showHandle, - handleIconSrc: handleIconSrc ?? this.handleIconSrc, + handleIconData: handleIconData ?? this.handleIconData, dividerSize: dividerSize ?? this.dividerSize, resetOnDoubleTap: resetOnDoubleTap ?? this.resetOnDoubleTap, handleDecoration: handleDecoration ?? this.handleDecoration, @@ -136,7 +135,7 @@ class ShadResizableTheme { other.textDirection == textDirection && other.verticalDirection == verticalDirection && other.showHandle == showHandle && - other.handleIconSrc == handleIconSrc && + other.handleIconData == handleIconData && other.dividerSize == dividerSize && other.resetOnDoubleTap == resetOnDoubleTap && other.handleDecoration == handleDecoration && @@ -155,7 +154,7 @@ class ShadResizableTheme { textDirection.hashCode ^ verticalDirection.hashCode ^ showHandle.hashCode ^ - handleIconSrc.hashCode ^ + handleIconData.hashCode ^ dividerSize.hashCode ^ resetOnDoubleTap.hashCode ^ handleDecoration.hashCode ^ diff --git a/lib/src/theme/components/sheet.dart b/lib/src/theme/components/sheet.dart index 01432d9a..57c6ae4c 100644 --- a/lib/src/theme/components/sheet.dart +++ b/lib/src/theme/components/sheet.dart @@ -3,7 +3,6 @@ import 'dart:ui'; import 'package:flutter/foundation.dart'; import 'package:flutter/widgets.dart'; import 'package:flutter_animate/flutter_animate.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/utils/position.dart'; @@ -14,7 +13,7 @@ class ShadSheetTheme { this.constraints, this.expandCrossSide, this.closeIcon, - this.closeIconSrc, + this.closeIconData, this.closeIconPosition, this.radius, this.backgroundColor, @@ -47,7 +46,7 @@ class ShadSheetTheme { final BoxConstraints? constraints; final bool? expandCrossSide; final Widget? closeIcon; - final ShadImageSrc? closeIconSrc; + final IconData? closeIconData; final ShadPosition? closeIconPosition; final BorderRadius? radius; final Color? backgroundColor; @@ -87,7 +86,7 @@ class ShadSheetTheme { if (identical(a, b)) return a; return ShadSheetTheme( merge: b.merge, - closeIconSrc: b.closeIconSrc, + closeIconData: b.closeIconData, closeIconPosition: ShadPosition.lerp(a.closeIconPosition, b.closeIconPosition, t), radius: BorderRadius.lerp(a.radius, b.radius, t), @@ -129,7 +128,7 @@ class ShadSheetTheme { BoxConstraints? constraints, bool? expandCrossSide, Widget? closeIcon, - ShadImageSrc? closeIconSrc, + IconData? closeIconData, ShadPosition? closeIconPosition, BorderRadius? radius, Color? backgroundColor, @@ -162,7 +161,7 @@ class ShadSheetTheme { constraints: constraints ?? this.constraints, expandCrossSide: expandCrossSide ?? this.expandCrossSide, closeIcon: closeIcon ?? this.closeIcon, - closeIconSrc: closeIconSrc ?? this.closeIconSrc, + closeIconData: closeIconData ?? this.closeIconData, closeIconPosition: closeIconPosition ?? this.closeIconPosition, radius: radius ?? this.radius, backgroundColor: backgroundColor ?? this.backgroundColor, @@ -202,7 +201,7 @@ class ShadSheetTheme { if (other == null) return this; if (!other.merge) return other; return copyWith( - closeIconSrc: other.closeIconSrc, + closeIconData: other.closeIconData, closeIconPosition: other.closeIconPosition, radius: other.radius, backgroundColor: other.backgroundColor, @@ -241,7 +240,7 @@ class ShadSheetTheme { other.constraints == constraints && other.expandCrossSide == expandCrossSide && other.closeIcon == closeIcon && - other.closeIconSrc == closeIconSrc && + other.closeIconData == closeIconData && other.closeIconPosition == closeIconPosition && other.radius == radius && other.backgroundColor == backgroundColor && @@ -276,7 +275,7 @@ class ShadSheetTheme { constraints.hashCode ^ expandCrossSide.hashCode ^ closeIcon.hashCode ^ - closeIconSrc.hashCode ^ + closeIconData.hashCode ^ closeIconPosition.hashCode ^ radius.hashCode ^ backgroundColor.hashCode ^ diff --git a/lib/src/theme/components/toast.dart b/lib/src/theme/components/toast.dart index 10759648..e8f4cf27 100644 --- a/lib/src/theme/components/toast.dart +++ b/lib/src/theme/components/toast.dart @@ -1,7 +1,6 @@ import 'package:flutter/foundation.dart'; import 'package:flutter/widgets.dart'; import 'package:flutter_animate/flutter_animate.dart'; -import 'package:shadcn_ui/src/components/image.dart'; import 'package:shadcn_ui/src/utils/extensions/order_policy.dart'; import 'package:shadcn_ui/src/utils/position.dart'; @@ -11,7 +10,7 @@ class ShadToastTheme { const ShadToastTheme({ this.merge = true, this.backgroundColor, - this.closeIconSrc, + this.closeIconData, this.alignment, this.offset, this.duration, @@ -34,7 +33,7 @@ class ShadToastTheme { final bool merge; final Color? backgroundColor; - final ShadImageSrc? closeIconSrc; + final IconData? closeIconData; final Alignment? alignment; final Offset? offset; final Duration? duration; @@ -63,7 +62,7 @@ class ShadToastTheme { return ShadToastTheme( merge: b.merge, backgroundColor: Color.lerp(a.backgroundColor, b.backgroundColor, t), - closeIconSrc: t < .5 ? a.closeIconSrc : b.closeIconSrc, + closeIconData: t < .5 ? a.closeIconData : b.closeIconData, alignment: Alignment.lerp(a.alignment, b.alignment, t), offset: Offset.lerp(a.offset, b.offset, t), duration: t < .5 ? a.duration : b.duration, @@ -92,7 +91,7 @@ class ShadToastTheme { ShadToastTheme copyWith({ bool? merge, Color? backgroundColor, - ShadImageSrc? closeIconSrc, + IconData? closeIconData, Alignment? alignment, Offset? offset, Duration? duration, @@ -115,7 +114,7 @@ class ShadToastTheme { return ShadToastTheme( merge: merge ?? this.merge, backgroundColor: backgroundColor ?? this.backgroundColor, - closeIconSrc: closeIconSrc ?? this.closeIconSrc, + closeIconData: closeIconData ?? this.closeIconData, alignment: alignment ?? this.alignment, offset: offset ?? this.offset, duration: duration ?? this.duration, @@ -143,7 +142,7 @@ class ShadToastTheme { if (!other.merge) return other; return copyWith( backgroundColor: other.backgroundColor, - closeIconSrc: other.closeIconSrc, + closeIconData: other.closeIconData, alignment: other.alignment, offset: other.offset, duration: other.duration, @@ -172,7 +171,7 @@ class ShadToastTheme { return other is ShadToastTheme && other.merge == merge && other.backgroundColor == backgroundColor && - other.closeIconSrc == closeIconSrc && + other.closeIconData == closeIconData && other.alignment == alignment && other.offset == offset && other.duration == duration && @@ -197,7 +196,7 @@ class ShadToastTheme { int get hashCode { return merge.hashCode ^ backgroundColor.hashCode ^ - closeIconSrc.hashCode ^ + closeIconData.hashCode ^ alignment.hashCode ^ offset.hashCode ^ duration.hashCode ^ diff --git a/lib/src/theme/themes/default_theme_no_secondary_border_variant.dart b/lib/src/theme/themes/default_theme_no_secondary_border_variant.dart index f79d4ade..a76fb1ba 100644 --- a/lib/src/theme/themes/default_theme_no_secondary_border_variant.dart +++ b/lib/src/theme/themes/default_theme_no_secondary_border_variant.dart @@ -166,22 +166,18 @@ class ShadDefaultThemeNoSecondaryBorderVariant extends ShadThemeVariant { regular: ShadButtonSizeTheme( height: 40, padding: EdgeInsets.symmetric(horizontal: 16, vertical: 8), - iconSize: Size.square(16), ), sm: ShadButtonSizeTheme( height: 36, padding: EdgeInsets.symmetric(horizontal: 12), - iconSize: Size.square(16), ), lg: ShadButtonSizeTheme( height: 44, padding: EdgeInsets.symmetric(horizontal: 32, vertical: 8), - iconSize: Size.square(16), ), icon: ShadButtonSizeTheme( height: 40, width: 40, - iconSize: Size.square(16), padding: EdgeInsets.zero, ), ); @@ -483,7 +479,7 @@ class ShadDefaultThemeNoSecondaryBorderVariant extends ShadThemeVariant { ShadToastTheme primaryToastTheme() { return ShadToastTheme( alignment: Alignment.bottomRight, - closeIconSrc: LucideIcons.x, + closeIconData: LucideIcons.x, titleStyle: effectiveTextTheme.muted.copyWith( fontWeight: FontWeight.w500, color: colorScheme.foreground, @@ -506,7 +502,7 @@ class ShadDefaultThemeNoSecondaryBorderVariant extends ShadThemeVariant { ShadToastTheme destructiveToastTheme() { return ShadToastTheme( alignment: Alignment.bottomRight, - closeIconSrc: LucideIcons.x, + closeIconData: LucideIcons.x, titleStyle: effectiveTextTheme.muted.copyWith( fontWeight: FontWeight.w500, color: colorScheme.destructiveForeground, @@ -537,7 +533,6 @@ class ShadDefaultThemeNoSecondaryBorderVariant extends ShadThemeVariant { width: 1, ), ), - iconSize: const Size.square(16), iconColor: colorScheme.foreground, titleStyle: effectiveTextTheme.p.copyWith( color: colorScheme.foreground, @@ -562,7 +557,6 @@ class ShadDefaultThemeNoSecondaryBorderVariant extends ShadThemeVariant { width: 1, ), ), - iconSize: const Size.square(16), iconColor: colorScheme.destructive, titleStyle: effectiveTextTheme.p.copyWith( color: colorScheme.destructive, @@ -578,7 +572,7 @@ class ShadDefaultThemeNoSecondaryBorderVariant extends ShadThemeVariant { @override ShadDialogTheme primaryDialogTheme() { return ShadDialogTheme( - closeIconSrc: LucideIcons.x, + closeIconData: LucideIcons.x, radius: const BorderRadius.all(Radius.circular(8)), backgroundColor: colorScheme.background, removeBorderRadiusWhenTiny: true, @@ -675,7 +669,7 @@ class ShadDefaultThemeNoSecondaryBorderVariant extends ShadThemeVariant { const bezierCurve = Cubic(0.87, 0, 0.13, 1); const duration = Duration(milliseconds: 300); return ShadAccordionTheme( - iconSrc: LucideIcons.chevronDown, + iconData: LucideIcons.chevronDown, padding: const EdgeInsets.symmetric(vertical: 16), underlineTitleOnHover: true, duration: duration, @@ -728,7 +722,7 @@ class ShadDefaultThemeNoSecondaryBorderVariant extends ShadThemeVariant { width: 0, ), ), - handleSize: const Size.square(10), + handleSize: 10, mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.center, mainAxisSize: MainAxisSize.max, @@ -821,8 +815,8 @@ class ShadDefaultThemeNoSecondaryBorderVariant extends ShadThemeVariant { const EdgeInsets.symmetric(horizontal: 8, vertical: 4), navigationButtonSize: 28, navigationButtonIconSize: 16, - backNavigationButtonSrc: LucideIcons.chevronLeft, - forwardNavigationButtonSrc: LucideIcons.chevronRight, + backNavigationButtonIconData: LucideIcons.chevronLeft, + forwardNavigationButtonIconData: LucideIcons.chevronRight, navigationButtonPadding: EdgeInsets.zero, navigationButtonDisabledOpacity: .5, decoration: ShadDecoration( @@ -892,7 +886,7 @@ class ShadDefaultThemeNoSecondaryBorderVariant extends ShadThemeVariant { buttonVariant: ShadButtonVariant.outline, width: 276, mainAxisAlignment: MainAxisAlignment.start, - iconSrc: LucideIcons.calendar, + iconData: LucideIcons.calendar, ); } diff --git a/lib/src/theme/themes/default_theme_variant.dart b/lib/src/theme/themes/default_theme_variant.dart index 3fea2a62..b34cf74d 100644 --- a/lib/src/theme/themes/default_theme_variant.dart +++ b/lib/src/theme/themes/default_theme_variant.dart @@ -145,23 +145,19 @@ class ShadDefaultThemeVariant extends ShadThemeVariant { regular: ShadButtonSizeTheme( height: 40, padding: EdgeInsets.symmetric(horizontal: 16, vertical: 8), - iconSize: Size.square(16), ), sm: ShadButtonSizeTheme( height: 36, padding: EdgeInsets.symmetric(horizontal: 12), - iconSize: Size.square(16), ), lg: ShadButtonSizeTheme( height: 44, padding: EdgeInsets.symmetric(horizontal: 32, vertical: 8), - iconSize: Size.square(16), ), icon: ShadButtonSizeTheme( height: 40, width: 40, padding: EdgeInsets.zero, - iconSize: Size.square(16), ), ); } @@ -460,7 +456,7 @@ class ShadDefaultThemeVariant extends ShadThemeVariant { ShadToastTheme primaryToastTheme() { return ShadToastTheme( alignment: Alignment.bottomRight, - closeIconSrc: LucideIcons.x, + closeIconData: LucideIcons.x, titleStyle: effectiveTextTheme.muted.copyWith( fontWeight: FontWeight.w500, color: colorScheme.foreground, @@ -483,7 +479,7 @@ class ShadDefaultThemeVariant extends ShadThemeVariant { ShadToastTheme destructiveToastTheme() { return ShadToastTheme( alignment: Alignment.bottomRight, - closeIconSrc: LucideIcons.x, + closeIconData: LucideIcons.x, titleStyle: effectiveTextTheme.muted.copyWith( fontWeight: FontWeight.w500, color: colorScheme.destructiveForeground, @@ -514,7 +510,6 @@ class ShadDefaultThemeVariant extends ShadThemeVariant { width: 1, ), ), - iconSize: const Size.square(16), iconColor: colorScheme.foreground, titleStyle: effectiveTextTheme.p.copyWith( color: colorScheme.foreground, @@ -539,7 +534,6 @@ class ShadDefaultThemeVariant extends ShadThemeVariant { width: 1, ), ), - iconSize: const Size.square(16), iconColor: colorScheme.destructive, titleStyle: effectiveTextTheme.p.copyWith( color: colorScheme.destructive, @@ -555,7 +549,7 @@ class ShadDefaultThemeVariant extends ShadThemeVariant { @override ShadDialogTheme primaryDialogTheme() { return ShadDialogTheme( - closeIconSrc: LucideIcons.x, + closeIconData: LucideIcons.x, radius: const BorderRadius.all(Radius.circular(8)), backgroundColor: colorScheme.background, removeBorderRadiusWhenTiny: true, @@ -652,7 +646,7 @@ class ShadDefaultThemeVariant extends ShadThemeVariant { const bezierCurve = Cubic(0.87, 0, 0.13, 1); const duration = Duration(milliseconds: 300); return ShadAccordionTheme( - iconSrc: LucideIcons.chevronDown, + iconData: LucideIcons.chevronDown, padding: const EdgeInsets.symmetric(vertical: 16), underlineTitleOnHover: true, duration: duration, @@ -705,7 +699,7 @@ class ShadDefaultThemeVariant extends ShadThemeVariant { width: 0, ), ), - handleSize: const Size.square(10), + handleSize: 10, mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.center, mainAxisSize: MainAxisSize.max, @@ -800,8 +794,8 @@ class ShadDefaultThemeVariant extends ShadThemeVariant { const EdgeInsets.symmetric(horizontal: 8, vertical: 4), navigationButtonSize: 28, navigationButtonIconSize: 16, - backNavigationButtonSrc: LucideIcons.chevronLeft, - forwardNavigationButtonSrc: LucideIcons.chevronRight, + backNavigationButtonIconData: LucideIcons.chevronLeft, + forwardNavigationButtonIconData: LucideIcons.chevronRight, navigationButtonPadding: EdgeInsets.zero, navigationButtonDisabledOpacity: .5, decoration: ShadDecoration( @@ -871,7 +865,7 @@ class ShadDefaultThemeVariant extends ShadThemeVariant { buttonVariant: ShadButtonVariant.outline, width: 276, mainAxisAlignment: MainAxisAlignment.start, - iconSrc: LucideIcons.calendar, + iconData: LucideIcons.calendar, ); } diff --git a/playground/lib/pages/alert.dart b/playground/lib/pages/alert.dart index 029f74cf..564369cd 100644 --- a/playground/lib/pages/alert.dart +++ b/playground/lib/pages/alert.dart @@ -18,13 +18,13 @@ class AlertPage extends StatelessWidget { padding: const EdgeInsets.symmetric(horizontal: 40), child: switch (style) { ShadAlertVariant.primary => const ShadAlert( - iconSrc: LucideIcons.terminal, + iconData: LucideIcons.terminal, title: Text('Heads up!'), description: Text('You can add components to your app using the cli.'), ), ShadAlertVariant.destructive => const ShadAlert.destructive( - iconSrc: LucideIcons.circleAlert, + iconData: LucideIcons.circleAlert, title: Text('Error'), description: Text('Your session has expired. Please log in again.'), diff --git a/pubspec.yaml b/pubspec.yaml index 0604798d..9f4ea0f2 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -1,6 +1,6 @@ name: shadcn_ui description: shadcn-ui ported in Flutter. Awesome UI components for Flutter, fully customizable. -version: 0.17.7 +version: 0.18.0 homepage: https://flutter-shadcn-ui.mariuti.com repository: https://github.com/nank1ro/flutter-shadcn-ui documentation: https://flutter-shadcn-ui.mariuti.com @@ -26,6 +26,7 @@ dependencies: lucide_icons_flutter: ^1.2.5 # used by Table two_dimensional_scrollables: ^0.3.3 + universal_image: ^1.0.7 vector_graphics: ^1.1.15 dev_dependencies: