feat: menubar

example/lib/main.dart

@@ -16,6 +16,7 @@ import 'package:example/pages/input.dart';
 import 'package:example/pages/input_form_field.dart';
 import 'package:example/pages/input_otp.dart';
 import 'package:example/pages/input_otp_form_field.dart';
+import 'package:example/pages/menubar.dart';
 import 'package:example/pages/popover.dart';
 import 'package:example/pages/progress.dart';
 import 'package:example/pages/radio_group.dart';
@@ -60,9 +61,10 @@ final routes = <String, WidgetBuilder>{
   '/date-picker-form-field': (_) => const DatePickerFormFieldPage(),
   '/dialog': (_) => const DialogPage(),
   '/input': (_) => const InputPage(),
-  '/input-form-field': (_) => const InputFormFieldPage(),
   '/input-OTP': (_) => const InputOTPPage(),
   '/input-OTP-form-field': (_) => const InputOTPFormFieldPage(),
+  '/input-form-field': (_) => const InputFormFieldPage(),
+  '/menubar': (_) => const MenubarPage(),
   '/popover': (_) => const PopoverPage(),
   '/progress': (_) => const ProgressPage(),
   '/radio-group': (_) => const RadioPage(),

example/lib/pages/menubar.dart

@@ -0,0 +1,18 @@
+import 'package:example/common/base_scaffold.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter/widgets.dart';
+import 'package:shadcn_ui/shadcn_ui.dart';
+
+class MenubarPage extends StatelessWidget {
+  const MenubarPage({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return const BaseScaffold(
+      appBarTitle: 'Menubar',
+      children: [
+        ShadMenubar(),
+      ],
+    );
+  }
+}

lib/shadcn_ui.dart

@@ -41,6 +41,7 @@ export 'src/components/tabs.dart';
 export 'src/components/time_picker.dart';
 export 'src/components/toast.dart';
 export 'src/components/tooltip.dart';
+export 'src/components/menubar.dart';
 
 // Raw Components
 export 'src/raw_components/portal.dart';
@@ -94,6 +95,7 @@ export 'src/theme/components/tabs.dart';
 export 'src/theme/components/time_picker.dart';
 export 'src/theme/components/toast.dart';
 export 'src/theme/components/tooltip.dart';
+export 'src/theme/components/menubar.dart';
 export 'src/theme/text_theme/text_styles_default.dart';
 export 'src/theme/text_theme/theme.dart';
 

lib/src/components/menubar.dart

@@ -0,0 +1,10 @@
+import 'package:flutter/widgets.dart';
+
+class ShadMenubar extends StatelessWidget {
+  const ShadMenubar({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return const Text('Menubar');
+  }
+}

lib/src/theme/components/menubar.dart

@@ -0,0 +1,47 @@
+import 'package:flutter/widgets.dart';
+
+@immutable
+class ShadMenubarTheme {
+  const ShadMenubarTheme({
+    this.merge = true,
+  });
+
+  final bool merge;
+
+  static ShadMenubarTheme lerp(
+    ShadMenubarTheme a,
+    ShadMenubarTheme b,
+    double t,
+  ) {
+    if (identical(a, b)) return a;
+    return ShadMenubarTheme(
+      merge: b.merge,
+    );
+  }
+
+  ShadMenubarTheme copyWith({
+    bool? merge,
+  }) {
+    return ShadMenubarTheme(
+      merge: merge ?? this.merge,
+    );
+  }
+
+  ShadMenubarTheme mergeWith(ShadMenubarTheme? other) {
+    if (other == null) return this;
+    if (!other.merge) return other;
+    return copyWith();
+  }
+
+  @override
+  bool operator ==(Object other) {
+    if (identical(this, other)) return true;
+
+    return other is ShadMenubarTheme && other.merge == merge;
+  }
+
+  @override
+  int get hashCode {
+    return merge.hashCode;
+  }
+}

lib/src/theme/data.dart

@@ -16,6 +16,7 @@ import 'package:shadcn_ui/src/theme/components/decorator.dart';
 import 'package:shadcn_ui/src/theme/components/dialog.dart';
 import 'package:shadcn_ui/src/theme/components/input.dart';
 import 'package:shadcn_ui/src/theme/components/input_otp.dart';
+import 'package:shadcn_ui/src/theme/components/menubar.dart';
 import 'package:shadcn_ui/src/theme/components/option.dart';
 import 'package:shadcn_ui/src/theme/components/popover.dart';
 import 'package:shadcn_ui/src/theme/components/progress.dart';
@@ -90,6 +91,7 @@ class ShadThemeData extends ShadBaseTheme {
     ShadDatePickerTheme? datePickerTheme,
     ShadTimePickerTheme? timePickerTheme,
     ShadInputOTPTheme? inputOTPTheme,
+    ShadMenubarTheme? menubarTheme,
   }) {
     final effectiveRadius =
         radius ?? const BorderRadius.all(Radius.circular(6));
@@ -232,6 +234,7 @@ class ShadThemeData extends ShadBaseTheme {
       timePickerTheme:
           effectiveVariant.timePickerTheme().mergeWith(timePickerTheme),
       inputOTPTheme: effectiveVariant.inputOTPTheme().mergeWith(inputOTPTheme),
+      menubarTheme: effectiveVariant.menubarTheme().mergeWith(menubarTheme),
     );
   }
 
@@ -285,6 +288,7 @@ class ShadThemeData extends ShadBaseTheme {
     required super.datePickerTheme,
     required super.timePickerTheme,
     required super.inputOTPTheme,
+    required super.menubarTheme,
   });
 
   static ShadThemeData lerp(ShadThemeData a, ShadThemeData b, double t) {
@@ -387,6 +391,7 @@ class ShadThemeData extends ShadBaseTheme {
           ShadTimePickerTheme.lerp(a.timePickerTheme, b.timePickerTheme, t),
       inputOTPTheme:
           ShadInputOTPTheme.lerp(a.inputOTPTheme, b.inputOTPTheme, t),
+      menubarTheme: ShadMenubarTheme.lerp(a.menubarTheme, b.menubarTheme, t),
     );
   }
 
@@ -443,7 +448,8 @@ class ShadThemeData extends ShadBaseTheme {
         other.calendarTheme == calendarTheme &&
         other.datePickerTheme == datePickerTheme &&
         other.timePickerTheme == timePickerTheme &&
-        other.inputOTPTheme == inputOTPTheme;
+        other.inputOTPTheme == inputOTPTheme &&
+        other.menubarTheme == menubarTheme;
   }
 
   @override
@@ -496,7 +502,8 @@ class ShadThemeData extends ShadBaseTheme {
         calendarTheme.hashCode ^
         datePickerTheme.hashCode ^
         timePickerTheme.hashCode ^
-        inputOTPTheme.hashCode;
+        inputOTPTheme.hashCode ^
+        menubarTheme.hashCode;
   }
 
   ShadThemeData copyWith({
@@ -549,6 +556,7 @@ class ShadThemeData extends ShadBaseTheme {
     ShadDatePickerTheme? datePickerTheme,
     ShadTimePickerTheme? timePickerTheme,
     ShadInputOTPTheme? inputOTPTheme,
+    ShadMenubarTheme? menubarTheme,
   }) {
     return ShadThemeData(
       colorScheme: colorScheme ?? this.colorScheme,
@@ -605,6 +613,7 @@ class ShadThemeData extends ShadBaseTheme {
       datePickerTheme: datePickerTheme ?? this.datePickerTheme,
       timePickerTheme: timePickerTheme ?? this.timePickerTheme,
       inputOTPTheme: inputOTPTheme ?? this.inputOTPTheme,
+      menubarTheme: menubarTheme ?? this.menubarTheme,
     );
   }
 }

lib/src/theme/themes/base.dart

@@ -14,6 +14,7 @@ import 'package:shadcn_ui/src/theme/components/decorator.dart';
 import 'package:shadcn_ui/src/theme/components/dialog.dart';
 import 'package:shadcn_ui/src/theme/components/input.dart';
 import 'package:shadcn_ui/src/theme/components/input_otp.dart';
+import 'package:shadcn_ui/src/theme/components/menubar.dart';
 import 'package:shadcn_ui/src/theme/components/option.dart';
 import 'package:shadcn_ui/src/theme/components/popover.dart';
 import 'package:shadcn_ui/src/theme/components/progress.dart';
@@ -84,6 +85,7 @@ abstract class ShadBaseTheme {
     required this.datePickerTheme,
     required this.timePickerTheme,
     required this.inputOTPTheme,
+    required this.menubarTheme,
   });
 
   final ShadColorScheme colorScheme;
@@ -135,6 +137,7 @@ abstract class ShadBaseTheme {
   final ShadDatePickerTheme datePickerTheme;
   final ShadTimePickerTheme timePickerTheme;
   final ShadInputOTPTheme inputOTPTheme;
+  final ShadMenubarTheme menubarTheme;
 }
 
 @immutable
@@ -181,4 +184,5 @@ abstract class ShadThemeVariant {
   ShadDatePickerTheme datePickerTheme();
   ShadTimePickerTheme timePickerTheme();
   ShadInputOTPTheme inputOTPTheme();
+  ShadMenubarTheme menubarTheme();
 }

lib/src/theme/themes/default_theme_no_secondary_border_variant.dart

@@ -21,6 +21,7 @@ import 'package:shadcn_ui/src/theme/components/decorator.dart';
 import 'package:shadcn_ui/src/theme/components/dialog.dart';
 import 'package:shadcn_ui/src/theme/components/input.dart';
 import 'package:shadcn_ui/src/theme/components/input_otp.dart';
+import 'package:shadcn_ui/src/theme/components/menubar.dart';
 import 'package:shadcn_ui/src/theme/components/option.dart';
 import 'package:shadcn_ui/src/theme/components/popover.dart';
 import 'package:shadcn_ui/src/theme/components/progress.dart';
@@ -964,4 +965,9 @@ class ShadDefaultThemeNoSecondaryBorderVariant extends ShadThemeVariant {
       ),
     );
   }
+
+  @override
+  ShadMenubarTheme menubarTheme() {
+    return const ShadMenubarTheme();
+  }
 }

lib/src/theme/themes/default_theme_variant.dart

@@ -21,6 +21,7 @@ import 'package:shadcn_ui/src/theme/components/decorator.dart';
 import 'package:shadcn_ui/src/theme/components/dialog.dart';
 import 'package:shadcn_ui/src/theme/components/input.dart';
 import 'package:shadcn_ui/src/theme/components/input_otp.dart';
+import 'package:shadcn_ui/src/theme/components/menubar.dart';
 import 'package:shadcn_ui/src/theme/components/option.dart';
 import 'package:shadcn_ui/src/theme/components/popover.dart';
 import 'package:shadcn_ui/src/theme/components/progress.dart';
@@ -930,4 +931,9 @@ class ShadDefaultThemeVariant extends ShadThemeVariant {
       ),
     );
   }
+
+  @override
+  ShadMenubarTheme menubarTheme() {
+    return const ShadMenubarTheme();
+  }
 }