ChipsButton

example/lib/storybook.dart

@@ -12,6 +12,7 @@ class StorybookApp extends StatelessWidget {
         return UtilsMaterialWrapper(widget: widget);
       },
       stories: [
+        ChipsButtonWidget.story,
         BigButtonWidget.story,
         SmallButtonWidget.story,
         BubbleButtonWidget.story,

lib/src/presentation/theme/styles.dart

@@ -4,7 +4,7 @@ import 'package:matule_uikit/matule_uikit.dart';
 
 class Styles {
   final Palette palette;
-  final String _family = "RobotoFlex";
+  final String _family = "Roboto";
   final String _package = "matule_uikit";
 
   Styles({required this.palette});
@@ -152,4 +152,13 @@ class Styles {
     height: 20 / 12,
     letterSpacing: 0,
   );
+
+  TextStyle get textMedium15Old => TextStyle(
+    fontFamily: _family,
+    package: _package,
+    fontWeight: FontWeight.w500,
+    fontSize: 15.sp,
+    height: 20 / 15,
+    letterSpacing: 0,
+  );
 }

lib/src/presentation/widgets/button_widget.dart

@@ -48,7 +48,7 @@ abstract class BaseStateButtonWidget extends StatelessWidget {
   final CustomTheme theme;
   final Function()? onTap;
   final Color backgroundColor;
-  final Color disabledBackgroundColor;
+  final Color? disabledBackgroundColor;
   final Color strokeColor;
   final String text;
   final Color textColor;
@@ -64,7 +64,7 @@ abstract class BaseStateButtonWidget extends StatelessWidget {
     required this.strokeColor,
   });
 
-  double get _width;
+  double? get _width;
 
   double get _height;
 
@@ -360,3 +360,56 @@ class SmallButtonWidget extends BigButtonWidget {
     },
   );
 }
+
+class ChipsButtonWidget extends BaseStateButtonWidget {
+  final bool active;
+
+  ChipsButtonWidget({
+    super.key,
+    required super.theme,
+    required this.active,
+    required super.onTap,
+    required super.text,
+  }) : super(
+         textColor: active
+             ? theme.palette.whiteOld
+             : theme.palette.descriptionOld,
+         backgroundColor: active
+             ? theme.palette.accentOld
+             : theme.palette.inputBackgroundOld,
+         disabledBackgroundColor: null,
+         strokeColor: Colors.transparent,
+       );
+
+  @override
+  double get _height => 48.h;
+
+  @override
+  double? get _width => null;
+
+  @override
+  EdgeInsets get _padding =>
+      EdgeInsets.symmetric(horizontal: 20.w, vertical: 14.h);
+
+  @override
+  TextStyle get _textStyle => theme.styles.textMedium15Old;
+
+  static Story get story => Story(
+    name: "ChipsButton",
+    builder: (BuildContext context) {
+      var theme = CustomTheme.of(context);
+      onTap() {
+        debugPrint("ChipsButton pressed!");
+      }
+
+      String text = context.knobs.text(label: "Text", initial: "Добавить");
+      bool active = context.knobs.boolean(label: "Active", initial: true);
+      return ChipsButtonWidget(
+        theme: theme,
+        active: active,
+        onTap: onTap,
+        text: text,
+      );
+    },
+  );
+}

pubspec.yaml

@@ -27,6 +27,24 @@ flutter:
     - assets/icons/
 
   fonts:
-    - family: RobotoFlex
+    - family: Roboto
       fonts:
-        - asset: assets/fonts/RobotoFlex.ttf
+        - asset: assets/fonts/Roboto-Thin.ttf
+          weight: 100
+        - asset: assets/fonts/Roboto-ExtraLight.ttf
+          weight: 200
+        - asset: assets/fonts/Roboto-Light.ttf
+          weight: 300
+        - asset: assets/fonts/Roboto-Regular.ttf
+          weight: 400
+        - asset: assets/fonts/Roboto-Medium.ttf
+          weight: 500
+        - asset: assets/fonts/Roboto-SemiBold.ttf
+          weight: 600
+        - asset: assets/fonts/Roboto-Bold.ttf
+          weight: 700
+        - asset: assets/fonts/Roboto-ExtraBold.ttf
+          weight: 800
+        - asset: assets/fonts/Roboto-Black.ttf
+          weight: 900
+