feat: added SwitchListItem

README.md

@@ -75,6 +75,7 @@ Components are always prefixed with `ImpaktfullUi` to avoid conflicts with other
   - ImpaktfullUiSideNavigationItem
 - ImpaktfullUiSnackyConfigurator
 - ImpaktfullUiSwitch
+- ImpaktfullUiSwitchListItem
 - ImpaktfullUiTable
   - ImpaktfullUiTableHeader
     - ImpaktfullUiTableHeaderItem
@@ -98,7 +99,6 @@ Many more to come in the future, always with the focus on minimizing maintenance
 - ImpaktfullUiScreen
 - ImpaktfullUiSelectableListItem
 - ImpaktfullUiSeparatedColumn
-- ImpaktfullUiSwitchListItem
 - ImpaktfullUiTabBar
 - ImpaktfullUiTabBarItem
 - ImpaktfullUiTimePicker

example/lib/src/component_library/components/switch_list_item/switch_list_item_library_item.dart

@@ -0,0 +1,38 @@
+import 'package:impaktfull_ui_example/src/component_library/components/switch_list_item/switch_list_item_library_variant.dart';
+import 'package:impaktfull_ui_example/src/component_library/config/component_library_inputs.dart';
+import 'package:impaktfull_ui_example/src/component_library/config/component_library_item.dart';
+import 'package:impaktfull_ui_example/src/component_library/inputs/component_library_boolean_input.dart';
+import 'package:impaktfull_ui_example/src/component_library/inputs/component_library_string_input.dart';
+
+class SwitchListItemLibraryItem extends ComponentLibraryItem {
+  const SwitchListItemLibraryItem();
+
+  @override
+  String get title => 'ImpaktfullUiSwitchListItem';
+
+  @override
+  List<ComponentLibraryVariant> getComponentVariants() {
+    return [
+      const SwitchListItemLibraryVariant(),
+    ];
+  }
+}
+
+class SwitchListItemLibraryInputs extends ComponentLibraryInputs {
+  final ComponentLibraryStringInput title = ComponentLibraryStringInput(
+    'Title',
+    initialValue: 'Title',
+  );
+  final ComponentLibraryStringInput subtitle = ComponentLibraryStringInput(
+    'Subtitle',
+    initialValue: 'Subtitle',
+  );
+  final ComponentLibraryBoolInput switchValue =
+      ComponentLibraryBoolInput('Switch value');
+  @override
+  List<ComponentLibraryInputItem> buildInputItems() => [
+        title,
+        subtitle,
+        switchValue,
+      ];
+}

example/lib/src/component_library/components/switch_list_item/switch_list_item_library_variant.dart

@@ -0,0 +1,32 @@
+import 'package:flutter/material.dart';
+import 'package:impaktfull_ui_2/impaktfull_ui.dart';
+import 'package:impaktfull_ui_example/src/component_library/components/switch_list_item/switch_list_item_library_item.dart';
+import 'package:impaktfull_ui_example/src/component_library/config/component_library_item.dart';
+
+class SwitchListItemLibraryVariant
+    extends ComponentLibraryVariant<SwitchListItemLibraryPrimaryInputs> {
+  const SwitchListItemLibraryVariant();
+
+  @override
+  String get title => 'Default';
+
+  @override
+  List<Widget> build(
+      BuildContext context, SwitchListItemLibraryPrimaryInputs inputs) {
+    return [
+      ImpaktfullUiSwitchListItem(
+        title: inputs.title.value ?? '',
+        subtitle: inputs.subtitle.value,
+        leading: theme.assets.icons.settings,
+        value: inputs.switchValue.value ?? false,
+        onChanged: inputs.switchValue.updateState,
+      ),
+    ];
+  }
+
+  @override
+  SwitchListItemLibraryPrimaryInputs inputs() =>
+      SwitchListItemLibraryPrimaryInputs();
+}
+
+class SwitchListItemLibraryPrimaryInputs extends SwitchListItemLibraryInputs {}

example/lib/src/component_library/config/component_library.dart

@@ -29,6 +29,7 @@ import 'package:impaktfull_ui_example/src/component_library/components/sidebar_n
 import 'package:impaktfull_ui_example/src/component_library/components/simple_list_item/simple_list_item_library_item.dart';
 import 'package:impaktfull_ui_example/src/component_library/components/snacky/snacky_library_item.dart';
 import 'package:impaktfull_ui_example/src/component_library/components/switch/switch_library_item.dart';
+import 'package:impaktfull_ui_example/src/component_library/components/switch_list_item/switch_list_item_library_item.dart';
 import 'package:impaktfull_ui_example/src/component_library/components/table/table_library_item.dart';
 import 'package:impaktfull_ui_example/src/component_library/components/tooltip/tooltip_library_item.dart';
 import 'package:impaktfull_ui_example/src/component_library/config/component_library_item.dart';
@@ -69,6 +70,7 @@ class ComponentLibrary {
     const SimpleListItemLibraryItem(),
     const SnackyLibraryItem(),
     const SwitchLibraryItem(),
+    const SwitchListItemLibraryItem(),
     const TableLibraryItem(),
     const TooltipLibraryItem(),
   ];

lib/impaktfull_ui.dart

@@ -35,6 +35,7 @@ export 'src/components/sidebar_navigation/sidebar_navigation.dart';
 export 'src/components/sidebar_navigation_item/sidebar_navigation_item.dart';
 export 'src/components/simple_list_item/simple_list_item.dart';
 export 'src/components/switch/switch.dart';
+export 'src/components/switch_list_item/switch_list_item.dart';
 export 'src/components/table/table_column_config.dart';
 export 'src/components/table/table.dart';
 export 'src/components/table_row/table_row.dart';

lib/src/components/switch_list_item/switch_list_item.dart

@@ -0,0 +1,57 @@
+import 'package:flutter/material.dart';
+import 'package:impaktfull_ui_2/impaktfull_ui.dart';
+import 'package:impaktfull_ui_2/src/components/theme/theme_component_builder.dart';
+
+export 'switch_list_item_style.dart';
+
+part 'switch_list_item.describe.dart';
+
+class ImpaktfullUiSwitchListItem extends StatelessWidget
+    with ComponentDescriptorMixin {
+  final String title;
+  final String? subtitle;
+  final bool value;
+  final ImpaktfullUiAsset? leading;
+  final ValueChanged<bool>? onChanged;
+  final ImpaktfullUiSwitchListItemTheme? theme;
+
+  const ImpaktfullUiSwitchListItem({
+    required this.title,
+    required this.value,
+    required this.onChanged,
+    this.subtitle,
+    this.leading,
+    this.theme,
+    super.key,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return ImpaktfullUiComponentThemeBuidler<ImpaktfullUiSwitchListItemTheme>(
+      overrideComponentTheme: theme,
+      builder: (context, theme, componentTheme) => ImpaktfullUiSimpleListItem(
+        title: title,
+        subtitle: subtitle,
+        onTap: onChanged == null ? null : _onTap,
+        type: ImpaktfullUiSimpleListItemType.neutral,
+        leadingWidgetBuilder: leading == null
+            ? null
+            : (context) => ImpaktfullUiAssetWidget(
+                  asset: leading,
+                  color: componentTheme.colors.icons,
+                ),
+        trailingWidgetBuilder: (context) => ImpaktfullUiSwitch(
+          value: value,
+          onChanged: onChanged == null ? null : _onChanged,
+        ),
+      ),
+    );
+  }
+
+  @override
+  String describe(BuildContext context) => _describeInstance(context, this);
+
+  void _onTap() => _onChanged(!value);
+
+  void _onChanged(bool value) => onChanged?.call(value);
+}

lib/src/components/switch_list_item/switch_list_item.describe.dart

@@ -0,0 +1,8 @@
+part of 'switch_list_item.dart';
+
+String _describeInstance(
+    BuildContext context, ImpaktfullUiSwitchListItem instance) {
+  final descriptor = ComponentDescriptor();
+  descriptor.add('theme', instance.theme);
+  return descriptor.describe();
+}

lib/src/components/switch_list_item/switch_list_item_style.dart

@@ -0,0 +1,38 @@
+import 'package:flutter/widgets.dart';
+import 'package:impaktfull_ui_2/src/theme/theme.dart';
+
+class ImpaktfullUiSwitchListItemTheme extends ImpaktfullUiComponentTheme {
+  final ImpaktfullUiSwitchListItemAssetsTheme assets;
+  final ImpaktfullUiSwitchListItemColorTheme colors;
+  final ImpaktfullUiSwitchListItemDimensTheme dimens;
+  final ImpaktfullUiSwitchListItemTextStyleTheme textStyles;
+
+  const ImpaktfullUiSwitchListItemTheme({
+    required this.assets,
+    required this.colors,
+    required this.dimens,
+    required this.textStyles,
+  });
+
+  static ImpaktfullUiSwitchListItemTheme of(BuildContext context) =>
+      ImpaktfullUiTheme.of(context).components.switchListItem;
+}
+
+class ImpaktfullUiSwitchListItemAssetsTheme {
+  const ImpaktfullUiSwitchListItemAssetsTheme();
+}
+
+class ImpaktfullUiSwitchListItemColorTheme {
+  final Color icons;
+  const ImpaktfullUiSwitchListItemColorTheme({
+    required this.icons,
+  });
+}
+
+class ImpaktfullUiSwitchListItemDimensTheme {
+  const ImpaktfullUiSwitchListItemDimensTheme();
+}
+
+class ImpaktfullUiSwitchListItemTextStyleTheme {
+  const ImpaktfullUiSwitchListItemTextStyleTheme();
+}

lib/src/theme/component_theme.dart

@@ -31,6 +31,7 @@ import 'package:impaktfull_ui_2/src/components/sidebar_navigation_item/sidebar_n
 import 'package:impaktfull_ui_2/src/components/simple_list_item/simple_list_item.dart';
 import 'package:impaktfull_ui_2/src/components/snacky/snacky_configurator.dart';
 import 'package:impaktfull_ui_2/src/components/switch/switch.dart';
+import 'package:impaktfull_ui_2/src/components/switch_list_item/switch_list_item.dart';
 import 'package:impaktfull_ui_2/src/components/table/table.dart';
 import 'package:impaktfull_ui_2/src/components/table_header/table_header.dart';
 import 'package:impaktfull_ui_2/src/components/table_header_item/table_header_item.dart';
@@ -75,6 +76,7 @@ class ImpaktfullUiComponentsTheme {
   final ImpaktfullUiSimpleListItemTheme simpleListItem;
   final ImpaktfullUiSnackyConfiguratorTheme snackyConfigurator;
   final ImpaktfullUiSwitchTheme switchTheme;
+  final ImpaktfullUiSwitchListItemTheme switchListItem;
   final ImpaktfullUiTableTheme table;
   final ImpaktfullUiTableHeaderTheme tableHeader;
   final ImpaktfullUiTableHeaderItemTheme tableHeaderItem;
@@ -115,6 +117,7 @@ class ImpaktfullUiComponentsTheme {
     required this.simpleListItem,
     required this.snackyConfigurator,
     required this.switchTheme,
+    required this.switchListItem,
     required this.tableHeader,
     required this.tableHeaderItem,
     required this.table,
@@ -156,6 +159,7 @@ class ImpaktfullUiComponentsTheme {
     ImpaktfullUiSimpleListItemTheme? simpleListItem,
     ImpaktfullUiSnackyConfiguratorTheme? snackyConfigurator,
     ImpaktfullUiSwitchTheme? switchTheme,
+    ImpaktfullUiSwitchListItemTheme? switchListItem,
     ImpaktfullUiTableTheme? table,
     ImpaktfullUiTableHeaderTheme? tableHeader,
     ImpaktfullUiTableHeaderItemTheme? tableHeaderItem,
@@ -197,6 +201,7 @@ class ImpaktfullUiComponentsTheme {
         simpleListItem: simpleListItem ?? this.simpleListItem,
         snackyConfigurator: snackyConfigurator ?? this.snackyConfigurator,
         switchTheme: switchTheme ?? this.switchTheme,
+        switchListItem: switchListItem ?? this.switchListItem,
         table: table ?? this.table,
         tableHeader: tableHeader ?? this.tableHeader,
         tableHeaderItem: tableHeaderItem ?? this.tableHeaderItem,
@@ -270,6 +275,8 @@ class ImpaktfullUiComponentsTheme {
       return ImpaktfullUiSnackyConfiguratorTheme.of(context) as T;
     } else if (T == ImpaktfullUiSwitchTheme) {
       return ImpaktfullUiSwitchTheme.of(context) as T;
+    } else if (T == ImpaktfullUiSwitchListItemTheme) {
+      return ImpaktfullUiSwitchListItemTheme.of(context) as T;
     } else if (T == ImpaktfullUiTableTheme) {
       return ImpaktfullUiTableTheme.of(context) as T;
     } else if (T == ImpaktfullUiTableHeaderTheme) {

lib/src/theme/theme_default.dart

@@ -31,6 +31,7 @@ import 'package:impaktfull_ui_2/src/components/sidebar_navigation_item/sidebar_n
 import 'package:impaktfull_ui_2/src/components/simple_list_item/simple_list_item.dart';
 import 'package:impaktfull_ui_2/src/components/snacky/snacky_configurator.dart';
 import 'package:impaktfull_ui_2/src/components/switch/switch.dart';
+import 'package:impaktfull_ui_2/src/components/switch_list_item/switch_list_item.dart';
 import 'package:impaktfull_ui_2/src/components/table/table.dart';
 import 'package:impaktfull_ui_2/src/components/table_header/table_header.dart';
 import 'package:impaktfull_ui_2/src/components/table_header_item/table_header_item.dart';
@@ -645,6 +646,14 @@ class DefaultTheme {
             inactive: assets.icons.close,
           ),
         ),
+        switchListItem: ImpaktfullUiSwitchListItemTheme(
+          assets: const ImpaktfullUiSwitchListItemAssetsTheme(),
+          colors: ImpaktfullUiSwitchListItemColorTheme(
+            icons: colors.primary,
+          ),
+          dimens: const ImpaktfullUiSwitchListItemDimensTheme(),
+          textStyles: const ImpaktfullUiSwitchListItemTextStyleTheme(),
+        ),
         tableHeader: ImpaktfullUiTableHeaderTheme(
           colors: ImpaktfullUiTableHeaderColorTheme(
             background: colors.canvas,