<!--
 * Copyright (C) 2023 WYATT GROUP
 * Please see the AUTHORS file for details.

 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * any later version.

 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
 * GNU General Public License for more details.

 * You should have received a copy of the GNU General Public License
 * along with this program. If not, see <https://www.gnu.org/licenses/>.
-->

# Flutter - Wyatt Ui Components

<p align="left">
  <a href="https://git.wyatt-studio.fr/Wyatt-FOSS/wyatt-packages/src/branch/master/packages/wyatt_analysis">
    <img src="https://img.shields.io/badge/Style-Wyatt%20Analysis-blue.svg?style=flat-square" alt="Style: Wyatt Analysis" />
  </a>
  <img src="https://img.shields.io/badge/SDK-Flutter-blue?style=flat-square" alt="SDK: Flutter" />
</p>

Wyatt Ui Components for Flutter.

## Usage

### Configuration

First create all your custom components in `core/design_system/components/`folder. For exemple :

├── design_system
│ ├── components
│ │ ├── custom_app_bar.dart
│ │ ├── custom_bottom_navigation_bar.dart
│ │ └── ...
│ └── ...
└── ...

You have to override `confgure` method.

Then create AppComponentTheme class in `core/design_system/` folder and add all your components. For Example :

```dart
class AppThemeComponent {
  static ComponentThemeData get components => ComponentThemeData.raw(
        appBar: const CustomAppBar(),
        bottomNavigationBar: CustomBottomNavigationBar(
          onTap: (context, index) {
            print('$index');
          },
        ),
      );
}
```

### Provider

In you main file, before calling router, call `ComponentTheme` widget and give your app as child. For example :

```dart
void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) => ComponentTheme(
        themDataWidget: AppThemeComponent.components,
        child: MaterialApp(
          title: 'Wyatt Ui Layout Example',
          theme: ThemeData(
            primarySwatch: Colors.blue,
          ),
          home: const ..,
        ),
      );
}
```

### Call

Then you're ready to call all your components from everywhere in your app using :

```dart
context.components,
```

For example :

```dart
  @override
  Widget build(BuildContext context) => Scaffold(
    appBar: context.components.appBar,
    body: ...
  )
```

If you need specific settings, or pass parameters to your component, call `configure` method. It will use default paramters you've passed in your app comppnent theme file, and update the parameter you need to change. For example :

```dart
  @override
  Widget build(BuildContext context) => Scaffold(
    appBar: context.components.appBar.configure({title:'New Title !}),
    body: ...
  )
```
