feat: add a builder for around the bigtextbutton

This allows apps to use a custom decoration around that element, for instance a dotted border.

packages/flutter_availability/lib/src/config/availability_options.dart

@@ -18,6 +18,7 @@ class AvailabilityOptions {
     this.secondaryButtonBuilder = DefaultSecondaryButton.builder,
     this.bigTextButtonBuilder = DefaultBigTextButton.builder,
     this.smallTextButtonBuilder = DefaultSmallTextButton.builder,
+    this.bigTextButtonWrapperBuilder = DefaultBigTextButtonWrapper.builder,
     this.spacing = const AvailabilitySpacing(),
     this.textStyles = const AvailabilityTextStyles(),
     this.colors = const AvailabilityColors(),
@@ -54,6 +55,10 @@ class AvailabilityOptions {
   /// This is used as a smaller variant of the tertiary button
   final ButtonBuilder smallTextButtonBuilder;
 
+  /// A way to provide your own element wrapper for the [bigTextButtonBuilder]
+  /// On some screens this button is wrapped in a container with a padding
+  final ButtonBuilder bigTextButtonWrapperBuilder;
+
   /// The spacing between elements
   final AvailabilitySpacing spacing;
 

packages/flutter_availability/lib/src/ui/widgets/default_buttons.dart

@@ -105,6 +105,46 @@ class DefaultBigTextButton extends StatelessWidget {
       );
 }
 
+///
+class DefaultBigTextButtonWrapper extends StatelessWidget {
+  ///
+  const DefaultBigTextButtonWrapper({
+    required this.child,
+    required this.onPressed,
+    super.key,
+  });
+
+  ///
+  final Widget? child;
+
+  ///
+  final FutureOr<void> Function()? onPressed;
+
+  ///
+  static Widget builder(
+    BuildContext context,
+    FutureOr<void> Function()? onPressed,
+    Widget? child,
+  ) =>
+      DefaultBigTextButtonWrapper(onPressed: onPressed, child: child);
+
+  @override
+  Widget build(BuildContext context) => InkWell(
+        onTap: onPressed,
+        child: Container(
+          decoration: BoxDecoration(
+            border: Border.all(
+              color: Theme.of(context).colorScheme.primary,
+              width: 1,
+            ),
+          ),
+          width: double.infinity,
+          padding: const EdgeInsets.symmetric(vertical: 8),
+          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

packages/flutter_availability/lib/src/ui/widgets/pause_selection.dart

@@ -63,15 +63,10 @@ class PauseSelection extends StatelessWidget {
     var sortedBreaks = breaks.toList()
       ..sort((a, b) => a.startTime.compareTo(b.startTime));
 
-    var addButton = DecoratedBox(
-      decoration: BoxDecoration(
-        border: Border.all(
-          color: theme.colorScheme.primary,
-          width: 1,
-        ),
-        borderRadius: BorderRadius.circular(4),
-      ),
-      child: options.bigTextButtonBuilder(
+    var addButton = options.bigTextButtonWrapperBuilder(
+      context,
+      onClickAddBreak,
+      options.bigTextButtonBuilder(
         context,
         onClickAddBreak,
         Text(translations.addButton),