example/lib/header_section.dart

@@ -0,0 +1,25 @@
+import 'package:flutter/material.dart';
+import 'package:ui_kit/ui_kit.dart';
+
+class HeaderSection extends StatefulWidget {
+  const HeaderSection({super.key});
+
+  @override
+  State<HeaderSection> createState() => _HeaderSectionState();
+}
+
+class _HeaderSectionState extends State<HeaderSection> {
+  @override
+  Widget build(BuildContext context) {
+    return SizedBox(
+      width: width(context) * 100,
+      height: height(context) * 30,
+      child: Column(
+        children: [
+          HeaderWidget(variant: 'main', onPressed: () {}, handleBack: () {}),
+          HeaderWidget(variant: 'default', onPressed: () {}, handleBack: () {}),
+        ],
+      ),
+    );
+  }
+}

example/lib/main.dart

@@ -2,6 +2,7 @@ import 'package:example/bottom_sheet_section.dart';
 import 'package:example/button_section.dart';
 import 'package:example/colors_section.dart';
 import 'package:example/fonts_section.dart';
+import 'package:example/header_section.dart';
 import 'package:example/inputs_section.dart';
 import 'package:example/search_section.dart';
 import 'package:example/small_button_section.dart';
@@ -35,6 +36,7 @@ class MainApp extends StatelessWidget {
                 SmallButtonSection(),
                 TabBarWidget(),
                 BottomSheetSection(),
+                HeaderSection(),
               ],
             ),
           ),

lib/header.dart

@@ -0,0 +1,50 @@
+import 'package:flutter/widgets.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+import 'package:ui_kit/fonts.dart';
+
+class HeaderWidget extends StatefulWidget {
+  const HeaderWidget({
+    super.key,
+    required this.variant,
+    required this.onPressed,
+    required this.handleBack,
+  });
+  final String variant;
+  final VoidCallback onPressed;
+  final VoidCallback handleBack;
+
+  @override
+  State<HeaderWidget> createState() => _HeaderWidgetState();
+}
+
+class _HeaderWidgetState extends State<HeaderWidget> {
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      padding: EdgeInsets.symmetric(horizontal: 16, vertical: 16),
+      child: widget.variant == 'main'
+          ? Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                Row(
+                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                  children: [
+                    Image.asset('assets/back.png', width: 32, height: 32),
+                    SvgPicture.asset('assets/delete.svg'),
+                  ],
+                ),
+                SizedBox(height: 24),
+                Text('Корзина', style: title1ExtraBold),
+              ],
+            )
+          : Row(
+              mainAxisAlignment: MainAxisAlignment.spaceBetween,
+              children: [
+                Image.asset('assets/back.png', width: 32, height: 32),
+                Text('Корзина', style: title1ExtraBold),
+                SvgPicture.asset('assets/delete.svg'),
+              ],
+            ),
+    );
+  }
+}

lib/ui_kit.dart

@@ -9,3 +9,4 @@ export "search.dart";
 export 'button.dart';
 export 'tabbar.dart';
 export 'bottom_sheet.dart';
+export 'header.dart';