feat: added the first example

example/lib/src/examples_library/config/example_library.dart

@@ -0,0 +1,14 @@
+import 'package:impaktfull_ui_example/src/examples_library/config/example_library_item.dart';
+import 'package:impaktfull_ui_example/src/examples_library/examples/dashboard/dashboard_example.dart';
+
+class ExampleLibrary {
+  static ExampleLibrary? _instance;
+
+  ExampleLibrary._();
+
+  static ExampleLibrary get instance => _instance ??= ExampleLibrary._();
+
+  final List<ExampleLibraryItem> examples = [
+    const DashboardExample(),
+  ];
+}

example/lib/src/examples_library/config/example_library_item.dart

@@ -0,0 +1,16 @@
+import 'package:flutter/widgets.dart';
+
+abstract class ExampleLibraryItem {
+  String get title;
+
+  const ExampleLibraryItem();
+
+  String get name => title.replaceAll('ImpaktfullUi', '');
+
+  String get slug => name
+      .replaceAllMapped(RegExp(r'(?<=[a-z])[A-Z]'),
+          (Match m) => '-${m.group(0)!.toLowerCase()}')
+      .toLowerCase();
+
+  Widget build(BuildContext context);
+}

example/lib/src/examples_library/data/test_data.dart

@@ -0,0 +1,104 @@
+class TestData {
+  static List<String> getProducts() => [
+        "Smartphone",
+        "Laptop",
+        "Tablet",
+        "Smartwatch",
+        "Wireless Earbuds",
+        "Bluetooth Speaker",
+        "4K TV",
+        "Gaming Console",
+        "Digital Camera",
+        "E-reader",
+        "Fitness Tracker",
+        "Drone",
+        "VR Headset",
+        "Portable Charger",
+        "Wireless Mouse",
+        "Mechanical Keyboard",
+        "External Hard Drive",
+        "Wi-Fi Router",
+        "Smart Thermostat",
+        "Robot Vacuum",
+        "Air Purifier",
+        "Coffee Maker",
+        "Blender",
+        "Toaster Oven",
+        "Microwave",
+        "Refrigerator",
+        "Dishwasher",
+        "Washing Machine",
+        "Dryer",
+        "Air Conditioner",
+        "Space Heater",
+        "Ceiling Fan",
+        "Desk Lamp",
+        "Floor Lamp",
+        "Smart Light Bulbs",
+        "Security Camera",
+        "Doorbell Camera",
+        "Smart Lock",
+        "Smoke Detector",
+        "Carbon Monoxide Detector",
+        "Fire Extinguisher",
+        "First Aid Kit",
+        "Tool Set",
+        "Drill",
+        "Lawn Mower",
+        "Pressure Washer",
+        "Grill",
+        "Patio Furniture Set",
+        "Outdoor Umbrella",
+        "Tent",
+        "Sleeping Bag",
+        "Hiking Backpack",
+        "Binoculars",
+        "Telescope",
+        "Bicycle",
+        "Electric Scooter",
+        "Skateboard",
+        "Yoga Mat",
+        "Dumbbells",
+        "Treadmill",
+        "Exercise Bike",
+        "Rowing Machine",
+        "Elliptical Machine",
+        "Weight Bench",
+        "Resistance Bands",
+        "Jump Rope",
+        "Foam Roller",
+        "Massage Gun",
+        "Guitar",
+        "Piano Keyboard",
+        "Drum Set",
+        "Violin",
+        "Ukulele",
+        "Microphone",
+        "Turntable",
+        "Soundbar",
+        "Projector",
+        "Streaming Device",
+        "Gaming Chair",
+        "Gaming Mouse",
+        "Gaming Headset",
+        "Graphics Card",
+        "Computer Monitor",
+        "Printer",
+        "Scanner",
+        "Paper Shredder",
+        "Office Chair",
+        "Standing Desk",
+        "Bookshelf",
+        "Filing Cabinet",
+        "Whiteboard",
+        "Projector Screen",
+        "Surge Protector",
+        "UPS Battery Backup",
+        "Network Switch",
+        "NAS Device",
+        "Dash Cam",
+        "Car GPS",
+        "Tire Pressure Gauge",
+        "Jumper Cables"
+      ];
+}

example/lib/src/examples_library/examples/dashboard/dashboard_example.dart

@@ -0,0 +1,13 @@
+import 'package:flutter/widgets.dart';
+import 'package:impaktfull_ui_example/src/examples_library/examples/dashboard/src/app.dart';
+import 'package:impaktfull_ui_example/src/examples_library/config/example_library_item.dart';
+
+class DashboardExample extends ExampleLibraryItem {
+  const DashboardExample();
+
+  @override
+  String get title => 'Dashboard';
+
+  @override
+  Widget build(BuildContext context) => const DashboardExampleApp();
+}

example/lib/src/examples_library/examples/dashboard/src/app.dart

@@ -0,0 +1,18 @@
+import 'package:flutter/material.dart';
+import 'package:impaktfull_ui_2/impaktfull_ui.dart';
+import 'package:impaktfull_ui_example/src/examples_library/examples/dashboard/src/screen/dashboard_base_screen.dart';
+
+class DashboardExampleApp extends StatelessWidget {
+  const DashboardExampleApp({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return ImpaktfullUiApp(
+      title: 'Dashboard examples',
+      impaktfullUiTheme: ImpaktfullUiTheme.getDefault(
+        package: null,
+      ),
+      home: const DashboardBaseScreen(),
+    );
+  }
+}

example/lib/src/examples_library/examples/dashboard/src/screen/dashboard_base_screen.dart

@@ -0,0 +1,143 @@
+import 'package:flutter/material.dart';
+import 'package:impaktfull_ui_2/impaktfull_ui.dart';
+import 'package:impaktfull_ui_example/src/examples_library/examples/dashboard/src/screen/dashboard_store_products_screen.dart';
+import 'package:impaktfull_ui_example/src/examples_library/widgets/coming_soon.dart';
+import 'package:impaktfull_ui_example/src/util/network_images.dart';
+import 'package:phosphor_flutter/phosphor_flutter.dart';
+
+class DashboardBaseScreen extends StatefulWidget {
+  const DashboardBaseScreen({
+    super.key,
+  });
+
+  @override
+  State<DashboardBaseScreen> createState() => _DashboardBaseScreenState();
+}
+
+class _DashboardBaseScreenState extends State<DashboardBaseScreen> {
+  var _activeScreen = DashboardScreen.home;
+  @override
+  Widget build(BuildContext context) {
+    return ImpaktfullUiScreen(
+      child: ImpaktfullUiAutoLayout.horizontal(
+        children: [
+          ImpaktfullUiSidebarNavigation(
+            width: 300,
+            asset: theme.assets.images.logo,
+            items: [
+              ImpaktfullUiSidebarNavigationItem(
+                leading: ImpaktfullUiAsset.icon(PhosphorIcons.house()),
+                title: 'Home',
+                isSelected: _activeScreen == DashboardScreen.home,
+                onTap: () => setState(() => _activeScreen = DashboardScreen.home),
+              ),
+              ImpaktfullUiSidebarNavigationItem(
+                leading: ImpaktfullUiAsset.icon(PhosphorIcons.basket()),
+                title: 'Store',
+                items: [
+                  ImpaktfullUiSidebarNavigationItem(
+                    leading: ImpaktfullUiAsset.icon(PhosphorIcons.tShirt()),
+                    title: 'Products',
+                    isSelected: _activeScreen == DashboardScreen.storeProducts,
+                    onTap: () => setState(() => _activeScreen = DashboardScreen.storeProducts),
+                  ),
+                  ImpaktfullUiSidebarNavigationItem(
+                    leading: ImpaktfullUiAsset.icon(PhosphorIcons.money()),
+                    title: 'Orders',
+                    isSelected: _activeScreen == DashboardScreen.storeOrders,
+                    onTap: () => setState(() => _activeScreen = DashboardScreen.storeOrders),
+                  ),
+                  ImpaktfullUiSidebarNavigationItem(
+                    leading: ImpaktfullUiAsset.icon(PhosphorIcons.sealPercent()),
+                    title: 'Coupons',
+                    isSelected: _activeScreen == DashboardScreen.storeCoupons,
+                    onTap: () => setState(() => _activeScreen = DashboardScreen.storeCoupons),
+                  ),
+                  ImpaktfullUiSidebarNavigationItem(
+                    leading: ImpaktfullUiAsset.icon(PhosphorIcons.gearSix()),
+                    title: 'Settings',
+                    isSelected: _activeScreen == DashboardScreen.storeSettings,
+                    onTap: () => setState(() => _activeScreen = DashboardScreen.storeSettings),
+                  ),
+                ],
+              ),
+              ImpaktfullUiSidebarNavigationItem(
+                leading: ImpaktfullUiAsset.icon(PhosphorIcons.envelopeSimple()),
+                title: 'Emails',
+                items: [
+                  ImpaktfullUiSidebarNavigationItem(
+                    leading: ImpaktfullUiAsset.icon(PhosphorIcons.tShirt()),
+                    title: 'Campaigns',
+                    isSelected: _activeScreen == DashboardScreen.emailsCampaigns,
+                    onTap: () => setState(() => _activeScreen = DashboardScreen.emailsCampaigns),
+                  ),
+                  ImpaktfullUiSidebarNavigationItem(
+                    leading: ImpaktfullUiAsset.icon(PhosphorIcons.money()),
+                    title: 'API',
+                    isSelected: _activeScreen == DashboardScreen.emailsApi,
+                    onTap: () => setState(() => _activeScreen = DashboardScreen.emailsApi),
+                  ),
+                  ImpaktfullUiSidebarNavigationItem(
+                    leading: ImpaktfullUiAsset.icon(PhosphorIcons.gearSix()),
+                    title: 'Settings',
+                    isSelected: _activeScreen == DashboardScreen.emailsSettings,
+                    onTap: () => setState(() => _activeScreen = DashboardScreen.emailsSettings),
+                  ),
+                ],
+              ),
+            ],
+            footerItems: [
+              ImpaktfullUiSidebarNavigationItem(
+                leading: ImpaktfullUiAsset.icon(PhosphorIcons.gearSix()),
+                title: 'Settings',
+                isSelected: _activeScreen == DashboardScreen.settings,
+                onTap: () => setState(() => _activeScreen = DashboardScreen.settings),
+              ),
+            ],
+            footer: ImpaktfullUiSimpleListItem(
+              leadingWidgetBuilder: (context) => const ImpaktfullUiAvatar(
+                url: NetworkImages.profilePicture,
+              ),
+              title: 'Koen Van Looveren',
+              subtitle: '[email protected]',
+              trailingWidgetBuilder: (context) => ImpaktfullUiIconButton(
+                asset: ImpaktfullUiAsset.icon(PhosphorIcons.signOut()),
+                onTap: () => Navigator.of(context, rootNavigator: true).pop(),
+              ),
+            ),
+          ),
+          Expanded(
+            child: Builder(builder: (context) {
+              switch (_activeScreen) {
+                case DashboardScreen.home:
+                  return const ExampleComingSoon();
+                case DashboardScreen.storeProducts:
+                  return const DashboardStoreProductsScreen();
+                case DashboardScreen.storeOrders:
+                case DashboardScreen.storeCoupons:
+                case DashboardScreen.storeSettings:
+                case DashboardScreen.emailsCampaigns:
+                case DashboardScreen.emailsApi:
+                case DashboardScreen.emailsSettings:
+                case DashboardScreen.settings:
+                  return const ExampleComingSoon();
+              }
+            }),
+          ),
+        ],
+      ),
+    );
+  }
+}
+
+enum DashboardScreen {
+  home,
+  storeProducts,
+  storeOrders,
+  storeCoupons,
+  storeSettings,
+  emailsCampaigns,
+  emailsApi,
+  emailsSettings,
+  settings,
+}