Skip to content

Commit

Permalink
feat: Menu Item Component (#508)
Browse files Browse the repository at this point in the history
* create menu item

* menu item

* review names
  • Loading branch information
tilucasoli authored Oct 18, 2024
1 parent e263b47 commit 405a068
Show file tree
Hide file tree
Showing 9 changed files with 659 additions and 14 deletions.
54 changes: 54 additions & 0 deletions packages/remix/demo/lib/components/menu_item_use_case.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
import 'package:demo/helpers/knob_builder.dart';
import 'package:flutter/material.dart' hide Scaffold;
import 'package:remix/remix.dart';
import 'package:widgetbook/widgetbook.dart';
import 'package:widgetbook_annotation/widgetbook_annotation.dart' as widgetbook;

final _key = GlobalKey();

@widgetbook.UseCase(
name: 'Menu Item Component',
type: MenuItem,
)
Widget buildButtonUseCase(BuildContext context) {
return KeyedSubtree(
key: _key,
child: Scaffold(
body: Center(
child: SizedBox(
width: 350,
child: MenuItem(
variants: [
context.knobs.variant(FortalezaButtonStyle.variants),
],
title: context.knobs.string(
label: 'Title',
initialValue: 'Menu Item',
),
subtitle: context.knobs.stringOrNull(
label: 'Subtitle',
initialValue: 'Subtitle',
),
onPress: () {},
disabled: context.knobs.boolean(
label: 'Disabled',
initialValue: false,
),
leadingWidgetBuilder: (icon) => context.knobs.boolean(
label: 'Show leading widget',
initialValue: false,
)
? Avatar(fallbackBuilder: (spec) => spec('LF'))
: const SizedBox.shrink(),
trailingWidgetBuilder: (icon) => context.knobs.boolean(
label: 'Show trailing widget',
initialValue: false,
)
? icon(Icons.chevron_right)
: const SizedBox.shrink(),
),
),
),
),
);
}
41 changes: 27 additions & 14 deletions packages/remix/demo/lib/main.directories.g.dart
Original file line number Diff line number Diff line change
Expand Up @@ -20,13 +20,14 @@ import 'package:demo/components/chip_use_case.dart' as _i9;
import 'package:demo/components/dialog_use_case.dart' as _i10;
import 'package:demo/components/divider_use_case.dart' as _i11;
import 'package:demo/components/icon_button_use_case.dart' as _i12;
import 'package:demo/components/progress_use_case.dart' as _i13;
import 'package:demo/components/radio_use_case.dart' as _i14;
import 'package:demo/components/segmented_control_use_case.dart' as _i15;
import 'package:demo/components/select_use_case.dart' as _i16;
import 'package:demo/components/spinner_use_case.dart' as _i17;
import 'package:demo/components/switch_use_case.dart' as _i18;
import 'package:demo/components/toast_use_case.dart' as _i19;
import 'package:demo/components/menu_item_use_case.dart' as _i13;
import 'package:demo/components/progress_use_case.dart' as _i14;
import 'package:demo/components/radio_use_case.dart' as _i15;
import 'package:demo/components/segmented_control_use_case.dart' as _i16;
import 'package:demo/components/select_use_case.dart' as _i17;
import 'package:demo/components/spinner_use_case.dart' as _i18;
import 'package:demo/components/switch_use_case.dart' as _i19;
import 'package:demo/components/toast_use_case.dart' as _i20;
import 'package:widgetbook/widgetbook.dart' as _i1;

final directories = <_i1.WidgetbookNode>[
Expand Down Expand Up @@ -165,14 +166,26 @@ final directories = <_i1.WidgetbookNode>[
)
],
),
_i1.WidgetbookFolder(
name: 'menu_item',
children: [
_i1.WidgetbookLeafComponent(
name: 'MenuItem',
useCase: _i1.WidgetbookUseCase(
name: 'Menu Item Component',
builder: _i13.buildButtonUseCase,
),
)
],
),
_i1.WidgetbookFolder(
name: 'progress',
children: [
_i1.WidgetbookLeafComponent(
name: 'Progress',
useCase: _i1.WidgetbookUseCase(
name: 'Progress Component',
builder: _i13.buildProgressUseCase,
builder: _i14.buildProgressUseCase,
),
)
],
Expand All @@ -184,7 +197,7 @@ final directories = <_i1.WidgetbookNode>[
name: 'Radio',
useCase: _i1.WidgetbookUseCase(
name: 'Radio Component',
builder: _i14.buildRadioUseCase,
builder: _i15.buildRadioUseCase,
),
)
],
Expand All @@ -196,7 +209,7 @@ final directories = <_i1.WidgetbookNode>[
name: 'SegmentedControl',
useCase: _i1.WidgetbookUseCase(
name: 'SegmentedControl Component',
builder: _i15.buildAccordionUseCase,
builder: _i16.buildAccordionUseCase,
),
)
],
Expand All @@ -208,7 +221,7 @@ final directories = <_i1.WidgetbookNode>[
name: 'Select',
useCase: _i1.WidgetbookUseCase(
name: 'Select Component',
builder: _i16.buildSelect,
builder: _i17.buildSelect,
),
)
],
Expand All @@ -220,7 +233,7 @@ final directories = <_i1.WidgetbookNode>[
name: 'Spinner',
useCase: _i1.WidgetbookUseCase(
name: 'Spinner Component',
builder: _i17.buildSpinnerUseCase,
builder: _i18.buildSpinnerUseCase,
),
)
],
Expand All @@ -232,7 +245,7 @@ final directories = <_i1.WidgetbookNode>[
name: 'Switch',
useCase: _i1.WidgetbookUseCase(
name: 'Switch Component',
builder: _i18.buildSwitchUseCase,
builder: _i19.buildSwitchUseCase,
),
)
],
Expand All @@ -244,7 +257,7 @@ final directories = <_i1.WidgetbookNode>[
name: 'Toast',
useCase: _i1.WidgetbookUseCase(
name: 'Toast Component',
builder: _i19.buildButtonUseCase,
builder: _i20.buildButtonUseCase,
),
)
],
Expand Down
1 change: 1 addition & 0 deletions packages/remix/lib/remix.dart
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@ export 'src/components/chip/chip.dart';
export 'src/components/dialog/dialog.dart';
export 'src/components/divider/divider.dart';
export 'src/components/icon_button/icon_button.dart';
export 'src/components/menu_item/menu_item.dart';
export 'src/components/progress/progress.dart';
export 'src/components/radio/radio.dart';
export 'src/components/scaffold/scaffold.dart';
Expand Down
51 changes: 51 additions & 0 deletions packages/remix/lib/src/components/menu_item/menu_item.dart
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
import 'package:flutter/foundation.dart';
import 'package:flutter/widgets.dart';
import 'package:mix/mix.dart';
import 'package:mix_annotations/mix_annotations.dart';

import '../../helpers/component_builder.dart';
import '../../theme/remix_theme.dart';
import '../../theme/remix_tokens.dart';

part 'menu_item.g.dart';
part 'menu_item_style.dart';
part 'menu_item_theme.dart';
part 'menu_item_widget.dart';

@MixableSpec()
class MenuItemSpec extends Spec<MenuItemSpec>
with _$MenuItemSpec, Diagnosticable {
final BoxSpec outerContainer;
final FlexSpec contentLayout;
final FlexSpec titleSubtitleLayout;
final IconSpec icon;
final TextSpec title;
final TextSpec subtitle;

/// {@macro button_spec_of}
static const of = _$MenuItemSpec.of;

static const from = _$MenuItemSpec.from;

const MenuItemSpec({
BoxSpec? outerContainer,
FlexSpec? contentLayout,
FlexSpec? titleSubtitleLayout,
IconSpec? icon,
TextSpec? title,
TextSpec? subtitle,
super.modifiers,
super.animated,
}) : outerContainer = outerContainer ?? const BoxSpec(),
contentLayout = contentLayout ?? const FlexSpec(),
titleSubtitleLayout = titleSubtitleLayout ?? const FlexSpec(),
icon = icon ?? const IconSpec(),
title = title ?? const TextSpec(),
subtitle = subtitle ?? const TextSpec();

@override
void debugFillProperties(DiagnosticPropertiesBuilder properties) {
super.debugFillProperties(properties);
_debugFillProperties(properties);
}
}
Loading

0 comments on commit 405a068

Please sign in to comment.