feat: split the textButtonBuilder into a big and small variant

This commit is contained in:
Freek van de Ven 2024-07-11 11:00:28 +02:00 committed by Bart Ribbers
parent 625e38fd47
commit 244df8ea1f
6 changed files with 77 additions and 17 deletions

View file

@ -16,7 +16,8 @@ class AvailabilityOptions {
this.baseScreenBuilder = DefaultBaseScreen.builder,
this.primaryButtonBuilder = DefaultPrimaryButton.builder,
this.secondaryButtonBuilder = DefaultSecondaryButton.builder,
this.textButtonBuilder = DefaultTextButton.builder,
this.bigTextButtonBuilder = DefaultBigTextButton.builder,
this.smallTextButtonBuilder = DefaultSmallTextButton.builder,
this.spacing = const AvailabilitySpacing(),
this.textStyles = const AvailabilityTextStyles(),
this.colors = const AvailabilityColors(),
@ -45,8 +46,13 @@ class AvailabilityOptions {
/// A way to provide your own secondary button implementation
final ButtonBuilder secondaryButtonBuilder;
/// A way to provide your own text button implementation
final ButtonBuilder textButtonBuilder;
/// A way to provide your own big text button implementation
/// This is used as a tertiary button
final ButtonBuilder bigTextButtonBuilder;
/// A way to provide your own small text button implementation
/// This is used as a smaller variant of the tertiary button
final ButtonBuilder smallTextButtonBuilder;
/// The spacing between elements
final AvailabilitySpacing spacing;

View file

@ -120,7 +120,7 @@ class _AvailabilityOverviewState extends State<AvailabilityOverview> {
}
}
var clearSelectedButton = options.textButtonBuilder(
var clearSelectedButton = options.bigTextButtonBuilder(
context,
onClearButtonClicked,
Text(translations.clearAvailabilityButton),

View file

@ -80,7 +80,7 @@ class _AvailabilityDayTemplateEditState
Text(translations.saveButton),
);
var deleteButton = options.textButtonBuilder(
var deleteButton = options.bigTextButtonBuilder(
context,
onDeletePressed,
Text(translations.deleteTemplateButton),

View file

@ -104,7 +104,8 @@ class _TemplateListSection extends StatelessWidget {
var availabilityScope = AvailabilityScope.of(context);
var options = availabilityScope.options;
var templateCreationButton = GestureDetector(
var templateCreationButton = InkWell(
hoverColor: Colors.transparent,
onTap: onAddTemplate,
child: Container(
color: Colors.transparent,
@ -115,10 +116,11 @@ class _TemplateListSection extends StatelessWidget {
children: [
const Icon(Icons.add),
const SizedBox(width: 8),
options.smallTextButtonBuilder(
context,
onAddTemplate,
Text(
createButtonText,
style: textTheme.bodyLarge?.copyWith(
decoration: TextDecoration.underline,
),
),
],

View file

@ -64,10 +64,11 @@ class DefaultSecondaryButton extends StatelessWidget {
OutlinedButton(onPressed: onPressed, child: child);
}
///
class DefaultTextButton extends StatelessWidget {
/// The default big text button used in the component when no custom
/// button is provided. This button is used as a teritary button
class DefaultBigTextButton extends StatelessWidget {
///
const DefaultTextButton({
const DefaultBigTextButton({
required this.child,
required this.onPressed,
super.key,
@ -79,7 +80,7 @@ class DefaultTextButton extends StatelessWidget {
FutureOr<void> Function()? onPressed,
Widget child,
) =>
DefaultTextButton(
DefaultBigTextButton(
onPressed: onPressed,
child: child,
);
@ -91,6 +92,57 @@ class DefaultTextButton extends StatelessWidget {
final FutureOr<void> Function()? onPressed;
@override
Widget build(BuildContext context) =>
TextButton(onPressed: onPressed, child: child);
Widget build(BuildContext context) => TextButton(
onPressed: onPressed,
style: TextButton.styleFrom(
textStyle: const TextStyle(
fontWeight: FontWeight.bold,
decoration: TextDecoration.underline,
fontSize: 16,
),
),
child: child,
);
}
/// The default small text button used in the component when no custom
/// button is provided. This button is used as a smaller variant of the
/// tertiary button
class DefaultSmallTextButton extends StatelessWidget {
///
const DefaultSmallTextButton({
required this.child,
required this.onPressed,
super.key,
});
///
static Widget builder(
BuildContext context,
FutureOr<void> Function()? onPressed,
Widget child,
) =>
DefaultSmallTextButton(
onPressed: onPressed,
child: child,
);
///
final Widget child;
///
final FutureOr<void> Function()? onPressed;
@override
Widget build(BuildContext context) => TextButton(
onPressed: onPressed,
style: TextButton.styleFrom(
textStyle: const TextStyle(
decoration: TextDecoration.underline,
),
overlayColor: Colors.transparent,
backgroundColor: Colors.transparent,
),
child: child,
);
}

View file

@ -71,7 +71,7 @@ class PauseSelection extends StatelessWidget {
),
borderRadius: BorderRadius.circular(4),
),
child: options.textButtonBuilder(
child: options.bigTextButtonBuilder(
context,
onClickAddBreak,
Text(translations.addButton),