#sprint-1

example/lib/bottom_sheet_section.dart

@@ -0,0 +1,64 @@
+import 'package:flutter/material.dart';
+import 'package:ui_kit/ui_kit.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+
+class BottomSheetSection extends StatefulWidget {
+  const BottomSheetSection({super.key});
+
+  @override
+  State<BottomSheetSection> createState() => _BottomSheetSectionState();
+}
+
+class _BottomSheetSectionState extends State<BottomSheetSection> {
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      margin: EdgeInsets.only(top: height(context) * 3),
+      child: Column(
+        children: [
+          ButtonWidget(
+            onPressed: () {
+              showBottomSheetFunc(Column(), context);
+            },
+            label: "Показать Модалку(Background)",
+            variant: 'flat',
+          ),
+          SizedBox(height: height(context) * 3),
+          ButtonWidget(
+            onPressed: () {
+              showBottomSheetFunc(
+                Column(
+                  children: [
+                    Container(
+                      padding: EdgeInsets.symmetric(
+                        horizontal: 20,
+                        vertical: 24,
+                      ),
+                      child: Row(
+                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                        crossAxisAlignment: CrossAxisAlignment.center,
+                        children: [
+                          SizedBox(
+                            width: width(context) * 60,
+                            child: Text(
+                              'Рубашка Воскресенье для машинного вязания',
+                              style: title1ExtraBold,
+                            ),
+                          ),
+                          SvgPicture.asset('assets/close.svg'),
+                        ],
+                      ),
+                    ),
+                  ],
+                ),
+                context,
+              );
+            },
+            label: 'Показать Модалку',
+            variant: 'flat',
+          ),
+        ],
+      ),
+    );
+  }
+}

example/lib/main.dart

@@ -1,3 +1,4 @@
+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';
@@ -33,6 +34,7 @@ class MainApp extends StatelessWidget {
                 ButtonSection(),
                 SmallButtonSection(),
                 TabBarWidget(),
+                BottomSheetSection(),
               ],
             ),
           ),

example/pubspec.lock

@@ -155,6 +155,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "1.16.0"
+  modal_bottom_sheet:
+    dependency: "direct main"
+    description:
+      name: modal_bottom_sheet
+      sha256: eac66ef8cb0461bf069a38c5eb0fa728cee525a531a8304bd3f7b2185407c67e
+      url: "https://pub.dev"
+    source: hosted
+    version: "3.0.0"
   path:
     dependency: transitive
     description:

example/pubspec.yaml

@@ -9,6 +9,7 @@ environment:
 dependencies:
   flutter:
     sdk: flutter
+  modal_bottom_sheet: ^3.0.0
   ui_kit: 
     path: ..
 

lib/bottom_sheet.dart

@@ -0,0 +1,17 @@
+// ignore_for_file: prefer_function_declarations_over_variables
+
+import 'package:flutter/material.dart';
+import 'package:modal_bottom_sheet/modal_bottom_sheet.dart';
+import 'package:ui_kit/ui_kit.dart';
+
+final showBottomSheetFunc = (Widget children, context) {
+  return showCupertinoModalBottomSheet(
+    context: context,
+    backgroundColor: whiteColor,
+    builder: (context) => Container(
+      color: whiteColor,
+      width: width(context) * 100,
+      child: children,
+    ),
+  );
+};

lib/ui_kit.dart

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

pubspec.yaml

@@ -11,6 +11,7 @@ dependencies:
   flutter:
     sdk: flutter
   flutter_svg: ^2.1.0
+  modal_bottom_sheet: ^3.0.0
 
 dev_dependencies:
   flutter_test: