Select Menu Tile

enum Notification { all, direct, nothing }
 
FSelectMenuTile<Notification>.fromMap(
  const {
    'All': Notification.all,
    'Direct Messages': Notification.direct,
    'None': Notification.nothing,
  },
  selectControl: const FMultiValueControl.managed(initial: {Notification.all}),
  autoHide: true,
  validator: (value) => value == null ? 'Select an item' : null,
  prefix: const Icon(FIcons.bell),
  title: const Text('Notifications'),
  detailsBuilder: (_, values, _) => Text(switch (values.firstOrNull) {
    Notification.all => 'All',
    Notification.direct => 'Direct Messages',
    _ => 'None',
  }),
);

enum Notification { all, direct, nothing }
 
FSelectMenuTile<Notification>(
  selectControl: const FMultiValueControl.managed(initial: {Notification.all}),
  autoHide: false,
  validator: (value) => value == null ? 'Select an item' : null,
  prefix: const Icon(FIcons.bell),
  title: const Text('Notifications'),
  detailsBuilder: (_, values, _) => Text(switch (values.firstOrNull) {
    Notification.all => 'All',
    Notification.direct => 'Direct Messages',
    _ => 'None',
  }),
  menu: const [
    FSelectTile(title: Text('All'), value: Notification.all),
    FSelectTile(title: Text('Direct Messages'), value: Notification.direct),
    FSelectTile(title: Text('None'), value: Notification.nothing),
  ],
);

enum Notification { all, direct, limitedTime, timeSensitive, selectedApps, nothing }
 
FSelectMenuTile<Notification>(
  selectControl: const FMultiValueControl.managed(initial: {Notification.all}),
  maxHeight: 150,
  validator: (value) => value == null ? 'Select an item' : null,
  prefix: const Icon(FIcons.bell),
  title: const Text('Notifications'),
  detailsBuilder: (_, values, _) => Text(switch (values.firstOrNull) {
    Notification.all => 'All',
    Notification.direct => 'Direct Messages',
    Notification.limitedTime => 'Limited Time',
    Notification.selectedApps => 'Selected Apps',
    Notification.timeSensitive => 'Time Sensitive',
    null || Notification.nothing => 'None',
  }),
  menu: const [
    FSelectTile(title: Text('All'), value: Notification.all),
    FSelectTile(title: Text('Direct Messages'), value: Notification.direct),
    FSelectTile(title: Text('Limited Time'), value: Notification.limitedTime),
    FSelectTile(title: Text('Selected Apps'), value: Notification.selectedApps),
    FSelectTile(title: Text('Time Sensitive'), value: Notification.timeSensitive),
    FSelectTile(title: Text('None'), value: Notification.nothing),
  ],
);

FSelectMenuTile<int>.builder(
  selectControl: const FMultiValueControl.managed(initial: {1}),
  prefix: const Icon(FIcons.variable),
  title: const Text('Applicable values'),
  maxHeight: 200,
  menuBuilder: (context, index) => FSelectTile(title: Text('Tile $index'), value: index),
);

enum Notification { all, direct, nothing }
 
class SelectMenuTileForm extends StatefulWidget {
  const SelectMenuTileForm({super.key});
 
  @override
  State<SelectMenuTileForm> createState() => _SelectMenuTileFormState();
}
 
class _SelectMenuTileFormState extends State<SelectMenuTileForm> {
  final _key = GlobalKey<FormState>();
 
  @override
  Widget build(BuildContext context) => Form(
    key: _key,
    child: Column(
      mainAxisSize: MainAxisSize.min,
      spacing: 20,
      children: [
        FSelectMenuTile<Notification>(
          selectControl: const FMultiValueControl.managed(initial: {Notification.all}),
          validator: (value) => value == null ? 'Select an item' : null,
          prefix: const Icon(FIcons.bell),
          title: const Text('Notifications'),
          detailsBuilder: (_, values, _) => Text(switch (values.firstOrNull) {
            Notification.all => 'All',
            Notification.direct => 'Direct Messages',
            _ => 'None',
          }),
          menu: const [
            FSelectTile(title: Text('All'), value: Notification.all),
            FSelectTile(title: Text('Direct Messages'), value: Notification.direct),
            FSelectTile(title: Text('None'), value: Notification.nothing),
          ],
        ),
        FButton(
          child: const Text('Save'),
          onPress: () {
            if (!_key.currentState!.validate()) {
              // Handle errors here.
              return;
            }
 
            _key.currentState!.save();
            // Do something.
          },
        ),
      ],
    ),
  );
}