feat : location details

assets/icons/calendar.svg

@@ -0,0 +1,16 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="vuesax/outline/calendar">
+<g id="calendar">
+<path id="Vector" d="M8 5.75C7.59 5.75 7.25 5.41 7.25 5V2C7.25 1.59 7.59 1.25 8 1.25C8.41 1.25 8.75 1.59 8.75 2V5C8.75 5.41 8.41 5.75 8 5.75Z" fill="#FFFFFF"/>
+<path id="Vector_2" d="M16 5.75C15.59 5.75 15.25 5.41 15.25 5V2C15.25 1.59 15.59 1.25 16 1.25C16.41 1.25 16.75 1.59 16.75 2V5C16.75 5.41 16.41 5.75 16 5.75Z" fill="#FFFFFF"/>
+<path id="Vector_3" d="M8.5 14.4998C8.37 14.4998 8.24 14.4698 8.12 14.4198C7.99 14.3698 7.89 14.2998 7.79 14.2098C7.61 14.0198 7.5 13.7698 7.5 13.4998C7.5 13.3698 7.53 13.2398 7.58 13.1198C7.63 12.9998 7.7 12.8898 7.79 12.7898C7.89 12.6998 7.99 12.6298 8.12 12.5798C8.48 12.4298 8.93 12.5098 9.21 12.7898C9.39 12.9798 9.5 13.2398 9.5 13.4998C9.5 13.5598 9.49 13.6298 9.48 13.6998C9.47 13.7598 9.45 13.8198 9.42 13.8798C9.4 13.9398 9.37 13.9998 9.33 14.0598C9.3 14.1098 9.25 14.1598 9.21 14.2098C9.02 14.3898 8.76 14.4998 8.5 14.4998Z" fill="#FFFFFF"/>
+<path id="Vector_4" d="M12 14.4999C11.87 14.4999 11.74 14.4699 11.62 14.4199C11.49 14.3699 11.39 14.2999 11.29 14.2099C11.11 14.0199 11 13.7699 11 13.4999C11 13.3699 11.03 13.2399 11.08 13.1199C11.13 12.9999 11.2 12.8899 11.29 12.7899C11.39 12.6999 11.49 12.6299 11.62 12.5799C11.98 12.4199 12.43 12.5099 12.71 12.7899C12.89 12.9799 13 13.2399 13 13.4999C13 13.5599 12.99 13.6299 12.98 13.6999C12.97 13.7599 12.95 13.8199 12.92 13.8799C12.9 13.9399 12.87 13.9999 12.83 14.0599C12.8 14.1099 12.75 14.1599 12.71 14.2099C12.52 14.3899 12.26 14.4999 12 14.4999Z" fill="#FFFFFF"/>
+<path id="Vector_5" d="M15.5 14.4999C15.37 14.4999 15.24 14.4699 15.12 14.4199C14.99 14.3699 14.89 14.2999 14.79 14.2099C14.75 14.1599 14.71 14.1099 14.67 14.0599C14.63 13.9999 14.6 13.9399 14.58 13.8799C14.55 13.8199 14.53 13.7599 14.52 13.6999C14.51 13.6299 14.5 13.5599 14.5 13.4999C14.5 13.2399 14.61 12.9799 14.79 12.7899C14.89 12.6999 14.99 12.6299 15.12 12.5799C15.49 12.4199 15.93 12.5099 16.21 12.7899C16.39 12.9799 16.5 13.2399 16.5 13.4999C16.5 13.5599 16.49 13.6299 16.48 13.6999C16.47 13.7599 16.45 13.8199 16.42 13.8799C16.4 13.9399 16.37 13.9999 16.33 14.0599C16.3 14.1099 16.25 14.1599 16.21 14.2099C16.02 14.3899 15.76 14.4999 15.5 14.4999Z" fill="#FFFFFF"/>
+<path id="Vector_6" d="M8.5 18.0002C8.37 18.0002 8.24 17.9702 8.12 17.9202C8 17.8702 7.89 17.8002 7.79 17.7102C7.61 17.5202 7.5 17.2602 7.5 17.0002C7.5 16.8702 7.53 16.7402 7.58 16.6202C7.63 16.4902 7.7 16.3802 7.79 16.2902C8.16 15.9202 8.84 15.9202 9.21 16.2902C9.39 16.4802 9.5 16.7402 9.5 17.0002C9.5 17.2602 9.39 17.5202 9.21 17.7102C9.02 17.8902 8.76 18.0002 8.5 18.0002Z" fill="#FFFFFF"/>
+<path id="Vector_7" d="M12 18.0002C11.74 18.0002 11.48 17.8902 11.29 17.7102C11.11 17.5202 11 17.2602 11 17.0002C11 16.8702 11.03 16.7402 11.08 16.6202C11.13 16.4902 11.2 16.3802 11.29 16.2902C11.66 15.9202 12.34 15.9202 12.71 16.2902C12.8 16.3802 12.87 16.4902 12.92 16.6202C12.97 16.7402 13 16.8702 13 17.0002C13 17.2602 12.89 17.5202 12.71 17.7102C12.52 17.8902 12.26 18.0002 12 18.0002Z" fill="#FFFFFF"/>
+<path id="Vector_8" d="M15.5 17.9999C15.24 17.9999 14.98 17.8899 14.79 17.7099C14.7 17.6199 14.63 17.5099 14.58 17.3799C14.53 17.2599 14.5 17.1299 14.5 16.9999C14.5 16.8699 14.53 16.7399 14.58 16.6199C14.63 16.4899 14.7 16.3799 14.79 16.2899C15.02 16.0599 15.37 15.9499 15.69 16.0199C15.76 16.0299 15.82 16.0499 15.88 16.0799C15.94 16.0999 16 16.1299 16.06 16.1699C16.11 16.1999 16.16 16.2499 16.21 16.2899C16.39 16.4799 16.5 16.7399 16.5 16.9999C16.5 17.2599 16.39 17.5199 16.21 17.7099C16.02 17.8899 15.76 17.9999 15.5 17.9999Z" fill="#FFFFFF"/>
+<path id="Vector_9" d="M20.5 9.83984H3.5C3.09 9.83984 2.75 9.49984 2.75 9.08984C2.75 8.67984 3.09 8.33984 3.5 8.33984H20.5C20.91 8.33984 21.25 8.67984 21.25 9.08984C21.25 9.49984 20.91 9.83984 20.5 9.83984Z" fill="#FFFFFF"/>
+<path id="Vector_10" d="M16 22.75H8C4.35 22.75 2.25 20.65 2.25 17V8.5C2.25 4.85 4.35 2.75 8 2.75H16C19.65 2.75 21.75 4.85 21.75 8.5V17C21.75 20.65 19.65 22.75 16 22.75ZM8 4.25C5.14 4.25 3.75 5.64 3.75 8.5V17C3.75 19.86 5.14 21.25 8 21.25H16C18.86 21.25 20.25 19.86 20.25 17V8.5C20.25 5.64 18.86 4.25 16 4.25H8Z" fill="#FFFFFF"/>
+</g>
+</g>
+</svg>

features/supervision/lib/presentation/location_details/logic.dart

@@ -0,0 +1,34 @@
+import 'package:flutter/cupertino.dart';
+import 'package:rasadyar_core/core.dart';
+
+class LocationDetailsLogic extends GetxController {
+  RxInt selectedSegment = 0.obs;
+
+  // The data for the segments
+  final Map<int, Widget> segments = {
+    0: Container(
+      padding: EdgeInsets.all(10),
+      decoration: BoxDecoration(borderRadius: BorderRadius.circular(50)),
+      child: Text('همه', style: AppFonts.yekan13),
+    ),
+    1: Container(
+      padding: EdgeInsets.all(10),
+      decoration: BoxDecoration(borderRadius: BorderRadius.circular(50)),
+      child: Text('بر اساس تاریخ', style: AppFonts.yekan13),
+    ),
+  };
+
+  RxBool seletected = false.obs;
+
+  @override
+  void onReady() {
+    // TODO: implement onReady
+    super.onReady();
+  }
+
+  @override
+  void onClose() {
+    // TODO: implement onClose
+    super.onClose();
+  }
+}

features/supervision/lib/presentation/location_details/view.dart

@@ -0,0 +1,245 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:rasadyar_core/core.dart';
+import 'package:rasadyar_core/presentation/utils/color_utils.dart';
+import 'package:rasadyar_core/presentation/widget/tabs/new_tab.dart';
+
+import 'logic.dart';
+
+class LocationDetailsPage extends GetView<LocationDetailsLogic> {
+  const LocationDetailsPage({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        automaticallyImplyLeading: false,
+        actions: [
+          Padding(
+            padding: const EdgeInsets.symmetric(horizontal: 8),
+            child: IconButton(
+              onPressed: () {
+                Get.back();
+              },
+              icon: Icon(CupertinoIcons.chevron_back),
+              color: AppColor.blueNormal,
+            ),
+          ),
+        ],
+      ),
+      body: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Padding(
+            padding: const EdgeInsets.symmetric(horizontal: 22),
+            child: Row(
+              mainAxisAlignment: MainAxisAlignment.spaceBetween,
+              children: [
+                headerInfo(description: 'ایداگل محمدی', title: 'نام مالک'),
+
+                headerInfo(
+                  description: '09415115545',
+                  title: 'شماره همراه',
+                  background: AppColor.green1Light,
+                ),
+
+                headerInfo(description: '183کیلوگرم', title: 'موجودی'),
+              ],
+            ),
+          ),
+
+          Padding(
+            padding: const EdgeInsets.fromLTRB(22, 13, 22, 4),
+            child: Text(
+              'نوع دریافت',
+              textAlign: TextAlign.center,
+              style: AppFonts.yekan13.copyWith(color: AppColor.blueNormal),
+            ),
+          ),
+
+          ObxValue((data) {
+            return NewCupertinoSegmentedControl<int>(
+              padding: EdgeInsetsDirectional.symmetric(
+                horizontal: 20,
+                vertical: 10,
+              ),
+              children: controller.segments,
+              groupValue: data.value,
+              selectedColor: AppColor.blueNormal,
+              unselectedColor: Colors.white,
+              borderColor: Colors.grey.shade300,
+              onValueChanged: (int value) {
+                data.value = value;
+              },
+            );
+          }, controller.selectedSegment),
+          Container(
+            height: 32,
+            margin: EdgeInsets.only(top: 10, left: 22, right: 22),
+
+            child: Row(
+              mainAxisAlignment: MainAxisAlignment.start,
+              crossAxisAlignment: CrossAxisAlignment.center,
+              spacing: 10,
+              children: [
+                Expanded(
+                  child: ROutlinedElevatedIcon(
+                    icon: Icon(Icons.calendar_month),
+                    onPressed: () {},
+                    text: 'از تاریخ',
+                    textStyle: AppFonts.yekan16.copyWith(
+                      color: AppColor.blueNormal,
+                    ),
+                  ),
+                ),
+                Expanded(
+                  child: ROutlinedElevatedIcon(
+                    icon: Icon(Icons.calendar_month),
+                    onPressed: () {},
+                    text: 'تا تاریخ',
+                    textStyle: AppFonts.yekan16.copyWith(
+                      color: AppColor.blueNormal,
+                    ),
+                  ),
+                ),
+              ],
+            ),
+          ),
+          SizedBox(height: 20),
+          Row(
+            children: [
+              Expanded(child: Divider()),
+              Container(
+                padding: EdgeInsets.symmetric(horizontal: 10, vertical: 6),
+                margin: EdgeInsets.symmetric(horizontal: 2),
+                clipBehavior: Clip.antiAlias,
+                decoration: ShapeDecoration(
+                  color: AppColor.blueNormal.disabledColor,
+                  shape: RoundedRectangleBorder(
+                    borderRadius: BorderRadius.circular(60),
+                  ),
+                ),
+                child: Text(
+                  'تعداد کل تراکنش ها : 0',
+                  textAlign: TextAlign.center,
+                  style: AppFonts.yekan10,
+                ),
+              ),
+              Expanded(child: Divider()),
+            ],
+          ),
+
+          Expanded(
+            child: GridView.builder(
+              itemCount: 50,
+              physics: BouncingScrollPhysics(),
+              padding: EdgeInsets.fromLTRB(20, 14, 20, 50),
+              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
+                crossAxisCount: 2,
+                crossAxisSpacing: 8,
+                mainAxisSpacing: 8,
+              ),
+              itemBuilder:
+                  (context, index) => Container(
+                    clipBehavior: Clip.antiAlias,
+                    decoration: ShapeDecoration(
+                      color: Colors.white,
+                      shape: RoundedRectangleBorder(
+                        side: BorderSide(
+                          width: 1,
+                          color: const Color(0xFFEFEFEF),
+                        ),
+                        borderRadius: BorderRadius.circular(16),
+                      ),
+                    ),
+                    child: Padding(
+                      padding: const EdgeInsets.symmetric(
+                        horizontal: 22,
+                        vertical: 25,
+                      ),
+                      child: Column(
+                        spacing: 6,
+                        mainAxisAlignment: MainAxisAlignment.center,
+                        crossAxisAlignment: CrossAxisAlignment.center,
+                        children: [
+                          Text(
+                            '${index + 1}- تراکنش موفق',
+                            textAlign: TextAlign.center,
+                            style: AppFonts.yekan10,
+                          ),
+                          SizedBox(height: 2),
+                          Text(
+                            '1043/12/12',
+                            textAlign: TextAlign.center,
+                            style: AppFonts.yekan12,
+                          ),
+
+                          Text(
+                            'محصول : مرغ',
+                            textAlign: TextAlign.center,
+                            style: AppFonts.yekan12.copyWith(
+                              color: AppColor.lightGreyNormalActive,
+                            ),
+                          ),
+                          Text(
+                            'وزن : 5555 گرم',
+                            textAlign: TextAlign.center,
+                            style: AppFonts.yekan12.copyWith(
+                              color: AppColor.lightGreyNormalActive,
+                            ),
+                          ),
+                          Text(
+                            'مبلغ : 14،000،000',
+                            textAlign: TextAlign.center,
+                            style: AppFonts.yekan12.copyWith(
+                              color: AppColor.lightGreyNormalActive,
+                            ),
+                          ),
+
+                          Text(
+                            'سرویس سامان کیش',
+                            textAlign: TextAlign.center,
+                            style: AppFonts.yekan12.copyWith(
+                              color: AppColor.blueNormal,
+                            ),
+                          ),
+                        ],
+                      ),
+                    ),
+                  ),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Container headerInfo({
+    required String title,
+    required String description,
+    Color? background,
+  }) {
+    return Container(
+      clipBehavior: Clip.antiAlias,
+      padding: EdgeInsets.symmetric(horizontal: 16, vertical: 12),
+      decoration: ShapeDecoration(
+        color: background ?? AppColor.blueLight,
+        shape: RoundedRectangleBorder(
+          side: BorderSide(width: 1, color: AppColor.blackLightHover),
+          borderRadius: BorderRadius.circular(8),
+        ),
+      ),
+      alignment: AlignmentDirectional.center,
+      child: Column(
+        mainAxisAlignment: MainAxisAlignment.center,
+        crossAxisAlignment: CrossAxisAlignment.center,
+        spacing: 10,
+        children: [
+          Text(title, style: AppFonts.yekan10),
+
+          Text(description, style: AppFonts.yekan12),
+        ],
+      ),
+    );
+  }
+}

lib/main.dart

@@ -1,7 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:get/get.dart';
 import 'package:rasadyar_app/domain/service/user/user_service.dart';
-import 'package:rasadyar_app/infrastructure/di/di.dart';
 import 'package:rasadyar_app/presentation/common/app_color.dart';
 import 'package:rasadyar_app/presentation/routes/app_pages.dart';
 import 'package:rasadyar_core/infrastructure/di/di.dart';

lib/presentation/common/assets.dart

@@ -5,6 +5,7 @@ class Assets {
   static const String iconsAdd = 'assets/icons/add.svg';
   static const String iconsArrowLeft = 'assets/icons/arrow_left.svg';
   static const String iconsArrowRight = 'assets/icons/arrow_right.svg';
+  static const String iconsCalendar = 'assets/icons/calendar.svg';
   static const String iconsCall = 'assets/icons/call.svg';
   static const String iconsDownload = 'assets/icons/download.svg';
   static const String iconsEdit = 'assets/icons/edit.svg';

lib/presentation/routes/app_pages.dart

@@ -3,6 +3,7 @@ import 'package:rasadyar_app/presentation/pages/auth/auth_with_use_and_pass/logi
 import 'package:rasadyar_app/presentation/pages/auth/auth_with_use_and_pass/view.dart';
 import 'package:rasadyar_app/presentation/pages/splash/logic.dart';
 import 'package:rasadyar_app/presentation/pages/splash/view.dart';
+import 'package:rasadyar_app/presentation/pages/system_design/system_design.dart';
 import 'package:supervision/supervision.dart';
 
 part 'app_paths.dart';
@@ -11,8 +12,10 @@ sealed class AppPages {
   AppPages._();
 
   static const String initRoutes = AppPaths.splash;
+  static const String initDesignSystem = AppPaths.systemDesignPage;
 
   static List<GetPage> pages = [
+    GetPage(name: AppPaths.systemDesignPage, page: () => SystemDesignPage()),
     GetPage(
       name: AppPaths.splash,
       page: () => SplashPage(),

lib/presentation/routes/app_paths.dart

@@ -6,4 +6,5 @@ sealed class AppPaths {
   static const String splash = '/splash';
   static const String authWithUserAndPass = '/authWithUserAndPass';
   static const String authWithOtp = '/authWithOtp';
+  static const String systemDesignPage = '/systemDesignPage';
 }

lib/presentation/widget/buttons/outline_elevated_icon.dart

@@ -0,0 +1,103 @@
+import 'package:flutter/material.dart';
+import 'package:rasadyar_app/presentation/common/app_color.dart';
+import 'package:rasadyar_app/presentation/common/app_fonts.dart';
+import 'package:rasadyar_app/presentation/utils/color_utils.dart';
+
+class ROutlinedElevatedIcon extends StatefulWidget {
+  ROutlinedElevatedIcon({
+    super.key,
+    required this.text,
+    required this.onPressed,
+    this.foregroundColor,
+    this.backgroundColor,
+    this.borderColor,
+    this.disabledBackgroundColor,
+    this.pressedBackgroundColor,
+    this.radius,
+    this.textStyle,
+    this.width = 150.0,
+    this.height = 56.0,
+  });
+
+  final String text;
+  final VoidCallback? onPressed;
+  final double width;
+  final double height;
+  Color? foregroundColor;
+  Color? backgroundColor;
+
+  Color? borderColor;
+
+  Color? disabledBackgroundColor;
+  Color? pressedBackgroundColor;
+  double? radius;
+  TextStyle? textStyle;
+  Widget? icon;
+
+  @override
+  State<ROutlinedElevatedIcon> createState() => _ROutlinedElevatedStateIcon();
+}
+
+class _ROutlinedElevatedStateIcon extends State<ROutlinedElevatedIcon> {
+  @override
+  Widget build(BuildContext context) {
+    return OutlinedButton.icon(
+      icon: widget.icon,
+      label: Text(widget.text),
+      onPressed: widget.onPressed,
+      style: ButtonStyle(
+        side: WidgetStateProperty.resolveWith<BorderSide?>((states) {
+          if (states.contains(WidgetState.pressed)) {
+            return BorderSide(
+              color: widget.borderColor ?? AppColor.blueNormal,
+              width: 2,
+            );
+          } else if (states.contains(WidgetState.disabled)) {
+            return BorderSide(
+              color: widget.borderColor ?? AppColor.blueNormal.withAlpha(38),
+              width: 2,
+            );
+          }
+          return BorderSide(
+            color: widget.borderColor ?? AppColor.blueNormal,
+            width: 2,
+          );
+        }),
+        backgroundColor: WidgetStateProperty.resolveWith<Color?>((states) {
+          if (states.contains(WidgetState.pressed)) {
+            if (widget.pressedBackgroundColor != null) {
+              return widget.pressedBackgroundColor;
+            }
+            return widget.backgroundColor?.pressedColor ?? AppColor.blueNormal;
+          } else if (states.contains(WidgetState.hovered)) {
+            return widget.backgroundColor?.hoverColor ??
+                AppColor.blueNormal.hoverColor;
+          } else if (states.contains(WidgetState.disabled)) {
+            return widget.backgroundColor?.disabledColor ?? Colors.transparent;
+          }
+          return widget.backgroundColor;
+        }),
+        foregroundColor: WidgetStateProperty.resolveWith<Color?>((states) {
+          if (states.contains(WidgetState.pressed)) {
+            return Colors.white;
+          } else if (states.contains(WidgetState.disabled)) {
+            return AppColor.blueNormal.withAlpha(38);
+          }
+          return AppColor.blueNormal;
+        }),
+
+        shape: WidgetStatePropertyAll(
+          RoundedRectangleBorder(
+            borderRadius: BorderRadius.circular(widget.radius ?? 8),
+          ),
+        ),
+        fixedSize: WidgetStatePropertyAll(Size(widget.width, widget.height)),
+        padding: WidgetStatePropertyAll(EdgeInsets.zero),
+        textStyle: WidgetStatePropertyAll(
+          widget.textStyle ??
+              AppFonts.yekan24.copyWith(color: AppColor.blueNormal),
+        ),
+      ),
+    );
+  }
+}

lib/presentation/widget/vec_widget.dart

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
+import 'package:rasadyar_app/presentation/common/app_color.dart';
 import 'package:vector_graphics/vector_graphics.dart';
 
 SvgPicture vecWidget(
@@ -64,3 +65,69 @@ Widget vecWidget2(
     ),
   );
 }
+
+
+class ColoredSvgButton extends StatefulWidget {
+  final String svgPath;
+  final String text;
+  final VoidCallback? onPressed;
+
+  const ColoredSvgButton({
+    required this.svgPath,
+    required this.text,
+    this.onPressed,
+    super.key,
+  });
+
+  @override
+  State<ColoredSvgButton> createState() => _ColoredSvgButtonState();
+}
+
+class _ColoredSvgButtonState extends State<ColoredSvgButton> {
+  bool _isPressed = false;
+  bool _isHovered = false;
+
+  Color _getIconColor() {
+    if (_isPressed) return Colors.white;
+    if (_isHovered) return AppColor.blueNormal.withAlpha(50);
+    return AppColor.blueNormal;
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return MouseRegion(
+      onEnter: (_) => setState(() => _isHovered = true),
+      onExit: (_) => setState(() {
+        _isHovered = false;
+        _isPressed = false;
+      }),
+      child: GestureDetector(
+        onTapDown: (_) => setState(() => _isPressed = true),
+        onTapUp: (_) => setState(() => _isPressed = false),
+        onTapCancel: () => setState(() => _isPressed = false),
+        child: OutlinedButton.icon(
+          icon: SvgPicture.asset(
+            widget.svgPath,
+            width: 24,
+            height: 24,
+            color: _getIconColor(),
+          ),
+          label: Text(widget.text),
+          onPressed: widget.onPressed,
+          style: OutlinedButton.styleFrom(
+            side: BorderSide(
+              color: AppColor.blueNormal,
+              width: 2,
+            ),
+            foregroundColor: AppColor.blueNormal,
+            backgroundColor: _isPressed ? AppColor.blueNormal : null,
+            shape: RoundedRectangleBorder(
+              borderRadius: BorderRadius.circular(8),
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}
+

packages/core/lib/presentation/widget/buttons/outline_elevated.dart

@@ -6,8 +6,8 @@ import 'package:rasadyar_core/presentation/utils/color_utils.dart';
 class ROutlinedElevated extends StatefulWidget {
   ROutlinedElevated({
     super.key,
-    required this.text,
-    required this.onPressed,
+    this.text,
+    this.onPressed,
     this.foregroundColor,
     this.backgroundColor,
     this.borderColor,
@@ -15,11 +15,12 @@ class ROutlinedElevated extends StatefulWidget {
     this.pressedBackgroundColor,
     this.radius,
     this.textStyle,
+    this.child,
     this.width = 150.0,
     this.height = 56.0,
   });
 
-  final String text;
+  final String? text;
   final VoidCallback? onPressed;
   final double width;
   final double height;
@@ -32,6 +33,7 @@ class ROutlinedElevated extends StatefulWidget {
   Color? pressedBackgroundColor;
   double? radius;
   TextStyle? textStyle;
+  Widget? child;
 
   @override
   State<ROutlinedElevated> createState() => _ROutlinedElevatedState();
@@ -95,7 +97,7 @@ class _ROutlinedElevatedState extends State<ROutlinedElevated> {
               AppFonts.yekan24.copyWith(color: AppColor.blueNormal),
         ),
       ),
-      child: Text(widget.text),
+      child: widget.child ?? Text(widget.text!, style: widget.textStyle),
     );
   }
 }

packages/core/lib/presentation/widget/buttons/outline_elevated_icon.dart

@@ -0,0 +1,132 @@
+import 'package:flutter/material.dart';
+import 'package:rasadyar_core/core.dart';
+import 'package:rasadyar_core/data/utils.dart';
+import 'package:rasadyar_core/presentation/utils/color_utils.dart';
+
+class ROutlinedElevatedIcon extends StatefulWidget {
+  ROutlinedElevatedIcon({
+    super.key,
+    required this.text,
+    required this.onPressed,
+    this.foregroundColor,
+    this.backgroundColor,
+    this.borderColor,
+    this.disabledBackgroundColor,
+    this.pressedBackgroundColor,
+    this.radius,
+    this.textStyle,
+    this.icon,
+    this.width = 150.0,
+    this.height = 56.0,
+  });
+
+  final String text;
+  final VoidCallback? onPressed;
+  final double width;
+  final double height;
+  Color? foregroundColor;
+  Color? backgroundColor;
+  Color? borderColor;
+  Color? disabledBackgroundColor;
+  Color? pressedBackgroundColor;
+  double? radius;
+  TextStyle? textStyle;
+  Widget? icon;
+
+  @override
+  State<ROutlinedElevatedIcon> createState() => _ROutlinedElevatedStateIcon();
+}
+
+class _ROutlinedElevatedStateIcon extends State<ROutlinedElevatedIcon> {
+  @override
+  Widget build(BuildContext context) {
+    return OutlinedButton.icon(
+      icon: widget.icon,
+      label: Text(widget.text),
+      onPressed: () {},
+      style: ButtonStyle(
+        side: WidgetStateProperty.resolveWith<BorderSide?>((states) {
+          if (states.contains(WidgetState.pressed)) {
+            return BorderSide(
+              color: widget.borderColor ?? AppColor.blueNormal,
+              width: 2,
+            );
+          } else if (states.contains(WidgetState.disabled)) {
+            return BorderSide(
+              color: widget.borderColor ?? AppColor.blueNormal.withAlpha(38),
+              width: 2,
+            );
+          }
+          return BorderSide(
+            color: widget.borderColor ?? AppColor.blueNormal,
+            width: 2,
+          );
+        }),
+        iconColor: WidgetStateProperty.resolveWith<Color?>((states) {
+          if (states.contains(WidgetState.pressed)) {
+            return Colors.white;
+          } else if (states.contains(WidgetState.disabled)) {
+            return widget.foregroundColor?.disabledColor ??
+                AppColor.blueNormal.withAlpha(38);
+          } else if (states.contains(WidgetState.hovered)) {
+            return widget.foregroundColor?.hoverColor ??
+                AppColor.blueNormal.withAlpha(50);
+          }
+          return widget.foregroundColor ?? AppColor.blueNormal;
+        }),
+        backgroundColor: WidgetStateProperty.resolveWith<Color?>((states) {
+          if (states.contains(WidgetState.pressed)) {
+            if (widget.pressedBackgroundColor != null) {
+              return widget.pressedBackgroundColor;
+            }
+            return widget.backgroundColor?.pressedColor ?? AppColor.blueNormal;
+          } else if (states.contains(WidgetState.hovered)) {
+            return widget.backgroundColor?.hoverColor ??
+                AppColor.blueNormal.hoverColor;
+          } else if (states.contains(WidgetState.disabled)) {
+            return widget.backgroundColor?.disabledColor ?? Colors.transparent;
+          }
+          return widget.backgroundColor;
+        }),
+        foregroundColor: WidgetStateProperty.resolveWith<Color?>((states) {
+          if (states.contains(WidgetState.pressed)) {
+            return Colors.white;
+          } else if (states.contains(WidgetState.disabled)) {
+            return widget.foregroundColor?.disabledColor ??
+                AppColor.blueNormal.withAlpha(38);
+          } else if (states.contains(WidgetState.hovered)) {
+            return widget.foregroundColor?.hoverColor ??
+                AppColor.blueNormal.withAlpha(50);
+          }
+          return widget.foregroundColor ?? AppColor.blueNormal;
+        }),
+        shape: WidgetStatePropertyAll(
+          RoundedRectangleBorder(
+            borderRadius: BorderRadius.circular(widget.radius ?? 8),
+          ),
+        ),
+        fixedSize: WidgetStatePropertyAll(Size(widget.width, widget.height)),
+        padding: WidgetStatePropertyAll(EdgeInsets.zero),
+        textStyle: WidgetStatePropertyAll(
+          widget.textStyle ??
+              AppFonts.yekan24.copyWith(color: AppColor.blueNormal),
+        ),
+      ),
+    );
+  }
+}
+
+Color? _getIconColor(BuildContext context) {
+  var ss =WidgetStateProperty.resolveWith<Color?>((states) {
+    if (states.contains(WidgetState.pressed)) {
+      return Colors.white;
+    } else if (states.contains(WidgetState.disabled)) {
+      return Colors.grey.withAlpha(38);
+    } else if (states.contains(WidgetState.hovered)) {
+      return Colors.blue.withAlpha(50);
+    }
+    return Colors.blue;
+  }).resolve({});
+  fLog(ss);
+  return ss;
+}

packages/core/lib/presentation/widget/vec_widget.dart

@@ -1,5 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
+import 'package:rasadyar_core/presentation/common/app_color.dart';
+import 'package:rasadyar_core/presentation/utils/color_utils.dart';
 import 'package:vector_graphics/vector_graphics.dart';
 
 SvgPicture vecWidget(
@@ -85,3 +87,4 @@ Widget vecWidget2(
     ),
   );
 }
+

packages/core/lib/presentation/widget/widget.dart

@@ -2,3 +2,6 @@ export 'vec_widget.dart';
 export 'bottom_navigation/bottom_navigation_1.dart';
 export 'draggable_bottom_sheet/draggable_bottom_sheet.dart';
 export 'draggable_bottom_sheet/draggable_bottom_sheet_controller.dart';
+export 'buttons/outline_elevated_icon.dart';
+export 'buttons/outline_elevated.dart';
+