### NesTabView Usage Examples

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_tab_view.md

Provides various examples demonstrating how to use the NesTabView widget, including basic setup, using icons, combining icons and labels, and implementing callbacks for tab changes and closures.

```APIDOC
## Usage Examples

### Basic Tab View
```dart
NesTabView(
  tabs: [
    NesTabItem(
      label: 'Tab 1',
      child: Text('Content 1'),
    ),
    NesTabItem(
      label: 'Tab 2',
      child: Text('Content 2'),
    ),
    NesTabItem(
      label: 'Tab 3',
      child: Text('Content 3'),
    ),
  ],
)
```

### Tab View with Icons
```dart
NesTabView(
  tabs: [
    NesTabItem(
      icon: NesIcons.sword,
      child: WeaponList(),
    ),
    NesTabItem(
      icon: NesIcons.shield,
      child: ArmorList(),
    ),
    NesTabItem(
      icon: NesIcons.axe,
      child: ToolsList(),
    ),
  ],
)
```

### Tab View with Icons and Labels
```dart
NesTabView(
  tabs: [
    NesTabItem(
      icon: NesIcons.sword,
      label: 'Inventory',
      child: InventoryWidget(),
    ),
    NesTabItem(
      icon: NesIcons.shield,
      label: 'Equipment',
      child: EquipmentWidget(),
    ),
    NesTabItem(
      icon: NesIcons.handPointingRight,
      label: 'Stats',
      child: StatsWidget(),
    ),
  ],
)
```

### With Callbacks
```dart
NesTabView(
  tabs: tabs,
  initialTabIndex: 1,
  onTabChanged: (index) {
    print('Switched to tab $index');
    // Update UI based on selected tab
  },
  onTabClosed: (index) {
    print('Closed tab $index');
    // Handle tab closure
  },
)
```

### Closeable Tabs
If `onTabClosed` is provided, tabs show close buttons:
```dart
class TabManager extends StatefulWidget {
  @override
  State<TabManager> createState() => _TabManagerState();
}

class _TabManagerState extends State<TabManager> {
  final List<NesTabItem> _tabs = [
    NesTabItem(label: 'Home', child: HomeWidget()),
    NesTabItem(label: 'Profile', child: ProfileWidget()),
  ];

  void _removeTab(int index) {
    setState(() => _tabs.removeAt(index));
  }

  @override
  Widget build(BuildContext context) {
    return NesTabView(
      tabs: _tabs,
      onTabClosed: _removeTab,
    );
  }
}
```
```

--------------------------------

### NesTabView Complete Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_tab_view.md

A full example demonstrating the NesTabView with multiple tabs, each containing different content like inventory, equipment, and character stats. Includes usage of NesContainer and NesProgressBar.

```dart
import 'package:flutter/material.dart';
import 'package:nes_ui/nes_ui.dart';

class GameTabsDemo extends StatefulWidget {
  const GameTabsDemo({Key? key}) : super(key: key);

  @override
  State<GameTabsDemo> createState() => _GameTabsDemoState();
}

class _GameTabsDemoState extends State<GameTabsDemo> {
  @override
  Widget build(BuildContext context) {
    return NesTabView(
      initialTabIndex: 0,
      tabs: [
        NesTabItem(
          label: 'Inventory',
          icon: NesIcons.sword,
          child: _InventoryTab(),
        ),
        NesTabItem(
          label: 'Equipment',
          icon: NesIcons.shield,
          child: _EquipmentTab(),
        ),
        NesTabItem(
          label: 'Stats',
          icon: NesIcons.arrow,
          child: _StatsTab(),
        ),
      ],
      onTabChanged: (index) {
        print('Tab changed to $index');
      },
    );
  }
}

class _InventoryTab extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return NesContainer(
      label: 'Items',
      child: ListView(
        children: const [
          ListTile(title: Text('Potion')),
          ListTile(title: Text('Antidote')),
          ListTile(title: Text('Ether')),
        ],
      ),
    );
  }
}

class _EquipmentTab extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return NesContainer(
      label: 'Equipment',
      child: Column(
        children: const [
          ListTile(title: Text('Head: Iron Helmet')),
          ListTile(title: Text('Body: Steel Armor')),
          ListTile(title: Text('Hands: Leather Gloves')),
        ],
      ),
    );
  }
}

class _StatsTab extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return NesContainer(
      label: 'Character Stats',
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          const Text('HP: 100/100'),
          const SizedBox(height: 8),
          NesProgressBar(value: 1.0),
          const SizedBox(height: 16),
          const Text('MP: 50/75'),
          const SizedBox(height: 8),
          NesProgressBar(value: 50 / 75),
          const SizedBox(height: 16),
          const Text('Experience: 2500/5000'),
          const SizedBox(height: 8),
          NesProgressBar(value: 2500 / 5000),
        ],
      ),
    );
  }
}

```

--------------------------------

### Complete Example of Screen Transitions

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/screen-transitions.md

A comprehensive example showcasing various NES UI screen transitions including Fill, Horizontal Close, Vertical Close, Horizontal Grid, and Vertical Grid. It includes a helper widget for creating transition buttons.

```dart
import 'package:flutter/material.dart';
import 'package:nes_ui/nes_ui.dart';

class TransitionDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: NesContainer(
        label: 'Screen Transitions',
        child: Column(
          children: [
            _TransitionButton(
              label: 'Fill',
              transition: NesFill(
                builder: (context) => const NextScreen(title: 'Fill Transition'),
                transitionDuration: Duration(milliseconds: 500),
                color: Colors.black,
              ),
            ),
            _TransitionButton(
              label: 'Horizontal Close',
              transition: NesHorizontalClose(
                builder: (context) => const NextScreen(title: 'Horizontal Close'),
                transitionDuration: Duration(milliseconds: 400),
              ),
            ),
            _TransitionButton(
              label: 'Vertical Close',
              transition: NesVerticalClose(
                builder: (context) => const NextScreen(title: 'Vertical Close'),
                transitionDuration: Duration(milliseconds: 400),
              ),
            ),
            _TransitionButton(
              label: 'Horizontal Grid',
              transition: NesHorizontalGrid(
                builder: (context) => const NextScreen(title: 'Horizontal Grid'),
                transitionDuration: Duration(milliseconds: 500),
                gridSize: 12,
              ),
            ),
            _TransitionButton(
              label: 'Vertical Grid',
              transition: NesVerticalGrid(
                builder: (context) => const NextScreen(title: 'Vertical Grid'),
                transitionDuration: Duration(milliseconds: 500),
                gridSize: 12,
              ),
            ),
          ],
        ),
      ),
    );
  }
}

class _TransitionButton extends StatelessWidget {
  final String label;
  final PageRoute pageRoute;

  const _TransitionButton({
    required this.label,
    required this.pageRoute,
  });

  @override
  Widget build(BuildContext context) {
    return NesButton.text(
      type: NesButtonType.primary,
      text: label,
      onPressed: () => Navigator.of(context).push(pageRoute),
    );
  }
}

class NextScreen extends StatelessWidget {
  final String title;

  const NextScreen({required this.title});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: NesContainer(
        label: title,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text('You transitioned with: $title'),
            SizedBox(height: 16),
            NesButton.text(
              type: NesButtonType.primary,
              text: 'Go Back',
              onPressed: () => Navigator.of(context).pop(),
            ),
          ],
        ),
      ),
    );
  }
}
```

--------------------------------

### Basic NesWindow Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_window.md

Demonstrates the simplest usage of NesWindow with a title and child widget.

```dart
NesWindow(
  title: 'Game Window',
  child: Text('Hello, world!'),
)
```

--------------------------------

### Complete NesSelectionList Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_selection_list.md

A comprehensive example demonstrating both vertical and horizontal NesSelectionList configurations. Includes basic item selection handling and input controller integration.

```dart
import 'package:flutter/material.dart';
import 'package:nes_ui/nes_ui.dart';

class SelectionListDemo extends StatefulWidget {
  const SelectionListDemo({Key? key}) : super(key: key);

  @override
  State<SelectionListDemo> createState() => _SelectionListDemoState();
}

class _SelectionListDemoState extends State<SelectionListDemo> {
  int _selectedIndex = 0;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        // Vertical list
        NesContainer(
          label: 'Choose Item',
          width: 200,
          child: NesSelectionList(
            initialIndex: _selectedIndex,
            children: [
              Text('Potion'),
              Text('Antidote'),
              Text('Ether'),
            ],
            onSelect: (index) {
              setState(() => _selectedIndex = index);
            },
          ),
        ),

        SizedBox(height: 32),

        // Horizontal list
        NesSelectionList(
          axis: Axis.horizontal,
          children: [
            Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                NesIcon(iconData: NesIcons.sword),
                Text('Sword'),
              ],
            ),
            Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                NesIcon(iconData: NesIcons.shield),
                Text('Shield'),
              ],
            ),
            Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                NesIcon(iconData: NesIcons.axe),
                Text('Axe'),
              ],
            ),
          ],
          onSelect: (index) {
            print('Equipment selected: $index');
          },
        ),

        SizedBox(height: 32),
        Text('Selected: $_selectedIndex'),
      ],
    );
  }
}
```

--------------------------------

### NesBasicDialogFrame Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_dialog.md

Demonstrates showing a dialog with a basic frame style.

```dart
const NesDialog.show<String>(
  context: context,
  builder: (context) => Text('Hello'),
  frame: NesBasicDialogFrame(),
)
```

--------------------------------

### Basic Dialog Usage

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_dialog.md

A simple example of displaying a NesDialog with basic content.

```dart
NesDialog.show(
  context: context,
  builder: (context) => Text('This is a dialog'),
)
```

--------------------------------

### NesProgressBar Complete Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_progress_bar.md

Demonstrates various NesProgressBar styles (pixel and smooth) within NesContainers, alongside a slider to control the progress value. This example showcases how to integrate progress bars for different UI elements and user feedback.

```dart
import 'package:flutter/material.dart';
import 'package:nes_ui/nes_ui.dart';

class ProgressBarDemo extends StatefulWidget {
  const ProgressBarDemo({Key? key}) : super(key: key);

  @override
  State<ProgressBarDemo> createState() => _ProgressBarDemoState();
}

class _ProgressBarDemoState extends State<ProgressBarDemo> {
  double _progress = 0.3;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        NesContainer(
          label: 'Download Progress',
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text('Pixel Fill:'),
              NesProgressBar(
                value: _progress,
                style: NesProgressBarStyle.pixel,
                label: '${(_progress * 100).toStringAsFixed(0)}%',
              ),
              SizedBox(height: 16),
              Text('Smooth Fill:'),
              NesProgressBar(
                value: _progress,
                style: NesProgressBarStyle.smooth,
              ),
            ],
          ),
        ),

        SizedBox(height: 32),

        // Game stats example
        NesContainer(
          label: 'Character Stats',
          width: 300,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Text('HP'),
                  Text('80/100'),
                ],
              ),
              NesProgressBar(value: 0.8),
              SizedBox(height: 12),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Text('MP'),
                  Text('60/100'),
                ],
              ),
              NesProgressBar(value: 0.6),
              SizedBox(height: 12),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Text('EXP'),
                  Text('450/1000'),
                ],
              ),
              NesProgressBar(value: 0.45),
            ],
          ),
        ),

        SizedBox(height: 32),

        // Slider to adjust progress
        Slider(
          value: _progress,
          onChanged: (value) {
            setState(() => _progress = value);
          },
        ),
        Text('Progress: ${(_progress * 100).toStringAsFixed(0)}%'),
      ],
    );
  }
}

```

--------------------------------

### Dialog with Keyboard Handling Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_dialog.md

Shows how to implement both confirm and close keyboard shortcuts for a dialog.

```dart
NesDialog.show(
  context: context,
  builder: (context) => Text('Press Enter to confirm or Escape to cancel'),
  onShortcutConfirm: () {
    Navigator.pop(context, 'confirmed');
    return NesDialogConfirmAction.closeDialog;
  },
  onShortcutClose: () {
    Navigator.pop(context, null);
    return true;
  },
)
```

--------------------------------

### NesVerticalGrid Transition Usage Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/screen-transitions.md

Demonstrates using the NesVerticalGrid transition, with an option to set the gridSize. Requires builder and duration.

```dart
Navigator.of(context).push(
  NesVerticalGrid(
    builder: (context) => const NextPage(),
    transitionDuration: Duration(milliseconds: 400),
  ),
);
```

--------------------------------

### NesCheckbox Complete Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_checkbox.md

Demonstrates a complete settings UI using NesCheckbox for audio, haptics, and display options. Includes saving functionality and snackbar feedback.

```dart
import 'package:flutter/material.dart';
import 'package:nes_ui/nes_ui.dart';

class CheckboxDemo extends StatefulWidget {
  const CheckboxDemo({Key? key}) : super(key: key);

  @override
  State<CheckboxDemo> createState() => _CheckboxDemoState();
}

class _CheckboxDemoState extends State<CheckboxDemo> {
  bool _soundEnabled = true;
  bool _musicEnabled = true;
  bool _vibrationEnabled = false;
  bool _fullscreen = true;

  @override
  Widget build(BuildContext context) {
    return NesContainer(
      label: 'Settings',
      width: 300,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text('Audio'),
          Row(
            children: [
              NesCheckBox(
                value: _soundEnabled,
                onChange: (v) => setState(() => _soundEnabled = v),
              ),
              SizedBox(width: 8),
              Text('Sound Effects'),
            ],
          ),
          Row(
            children: [
              NesCheckBox(
                value: _musicEnabled,
                onChange: (v) => setState(() => _musicEnabled = v),
              ),
              SizedBox(width: 8),
              Text('Music'),
            ],
          ),

          SizedBox(height: 16),

          Text('Haptics'),
          Row(
            children: [
              NesCheckBox(
                value: _vibrationEnabled,
                onChange: (v) => setState(() => _vibrationEnabled = v),
              ),
              SizedBox(width: 8),
              Text('Vibration'),
            ],
          ),

          SizedBox(height: 16),

          Text('Display'),
          Row(
            children: [
              NesCheckBox(
                value: _fullscreen,
                onChange: (v) => setState(() => _fullscreen = v),
              ),
              SizedBox(width: 8),
              Text('Fullscreen'),
            ],
          ),

          SizedBox(height: 24),

          NesButton.text(
            type: NesButtonType.primary,
            text: 'Save Settings',
            onPressed: () {
              _saveSettings();
              NesSnackbar.show(
                context,
                text: 'Settings saved!',
                type: NesSnackbarType.success,
              );
            },
          ),
        ],
      ),
    );
  }

  void _saveSettings() {
    // Save settings to persistent storage
    print('Sound: $_soundEnabled');
    print('Music: $_musicEnabled');
    print('Vibration: $_vibrationEnabled');
    print('Fullscreen: $_fullscreen');
  }
}

```

--------------------------------

### Nested NesWindow Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_window.md

Illustrates how to nest a NesContainer within a NesWindow. This example shows a simple main window containing text and an inner container.

```dart
class NestedWindowsDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return NesWindow(
      width: 400,
      height: 300,
      title: 'Main Window',
      icon: NesIcons.shield,
      child: Column(
        children: [
          Text('Outer window content'),
          SizedBox(height: 16),
          NesContainer(
            label: 'Inner Container',
            child: Text('This is a nested container inside a window'),
          ),
        ],
      ),
    );
  }
}

```

--------------------------------

### Loading Sequence Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_progress_bar.md

Shows an indeterminate smooth-style progress bar while assets are loading. This provides visual feedback during loading sequences before content is ready.

```dart
FutureBuilder<void>(
  future: loadAssets(),
  builder: (context, snapshot) {
    if (snapshot.connectionState == ConnectionState.waiting) {
      return NesProgressBar(
        value: 0.5, // Indeterminate; show mid-progress
        style: NesProgressBarStyle.smooth,
      );
    }
    return Text('Loading complete');
  },
)

```

--------------------------------

### Install Nes UI Package

Source: https://github.com/erickzanardo/nes_ui/blob/main/README.md

Run this command in your terminal to fetch the Nes UI package after adding it to pubspec.yaml.

```sh
flutter packages get
```

--------------------------------

### Complete NesButton Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_button.md

A comprehensive example showcasing various NesButton types including text, icon, iconText, custom child, and disabled states. It also demonstrates updating a counter on button presses.

```dart
import 'package:flutter/material.dart';
import 'package:nes_ui/nes_ui.dart';

class ButtonDemo extends StatefulWidget {
  const ButtonDemo({Key? key}) : super(key: key);

  @override
  State<ButtonDemo> createState() => _ButtonDemoState();
}

class _ButtonDemoState extends State<ButtonDemo> {
  int _pressCount = 0;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        // Text button
        NesButton.text(
          type: NesButtonType.primary,
          text: 'Click me',
          onPressed: () => setState(() => _pressCount++),
        ),

        // Icon button
        NesButton.icon(
          type: NesButtonType.success,
          icon: NesIcons.check,
          onPressed: () => print('Confirmed'),
        ),

        // Icon + Text button
        NesButton.iconText(
          type: NesButtonType.warning,
          icon: NesIcons.sword,
          text: 'Attack',
          onPressed: () => print('Attacking!'),
        ),

        // Custom widget button
        NesButton(
          type: NesButtonType.error,
          onPressed: () => showDeleteDialog(),
          child: Row(
            mainAxisSize: MainAxisSize.min,
            children: [
              NesIcon(iconData: NesIcons.close),
              const SizedBox(width: 8),
              const Text('Delete'),
            ],
          ),
        ),

        // Disabled button (no callbacks)
        const NesButton(
          type: NesButtonType.normal,
          child: Text('Disabled'),
        ),

        Text('Pressed: $_pressCount times'),
      ],
    );
  }

  void showDeleteDialog() {
    // Show confirmation dialog
  }
]
)
```

--------------------------------

### NesHorizontalGrid Transition Usage Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/screen-transitions.md

Shows how to use the NesHorizontalGrid transition, allowing customization of the grid size. Specify builder, duration, and optionally gridSize.

```dart
Navigator.of(context).push(
  NesHorizontalGrid(
    builder: (context) => const NextPage(),
    transitionDuration: Duration(milliseconds: 400),
    gridSize: 8,
  ),
);
```

--------------------------------

### NesTabItem with Label and Icon

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_tab_view.md

Example of configuring a NesTabItem with both a text label and an icon.

```dart
NesTabItem(
  label: 'Character',
  icon: NesIcons.sword,
  child: CharacterWidget(),
)
```

--------------------------------

### NesHorizontalClose Transition Usage Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/screen-transitions.md

Shows how to apply the NesHorizontalClose transition for navigation. Requires a builder and transition duration.

```dart
Navigator.of(context).push(
  NesHorizontalClose(
    builder: (context) => const NextPage(),
    transitionDuration: Duration(milliseconds: 400),
  ),
);
```

--------------------------------

### NesFill Transition Usage Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/screen-transitions.md

Demonstrates how to use the NesFill transition when navigating to a new page. Specify the builder, duration, and an optional fill color.

```dart
Navigator.of(context).push(
  NesFill(
    builder: (context) => const NextPage(),
    transitionDuration: Duration(milliseconds: 500),
    color: Colors.black,
  ),
);
```

--------------------------------

### Complete NesWindow Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_window.md

Demonstrates the usage of NesWindow to create multiple interactive windows (Stats, Inventory, Controls) within a Stack. Each window can be shown, hidden, and has specific actions or content.

```dart
import 'package:flutter/material.dart';
import 'package:nes_ui/nes_ui.dart';

class WindowsDemo extends StatefulWidget {
  const WindowsDemo({Key? key}) : super(key: key);

  @override
  State<WindowsDemo> createState() => _WindowsDemoState();
}

class _WindowsDemoState extends State<WindowsDemo> {
  bool _showStats = true;
  bool _showInventory = true;

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        // Main game background
        Container(color: Colors.blue[900]),

        // Stats window
        if (_showStats)
          Positioned(
            left: 10,
            top: 10,
            child: NesWindow(
              width: 250,
              title: 'Stats',
              icon: NesIcons.sword,
              onClose: () => setState(() => _showStats = false),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text('HP: 100/100'),
                  NesProgressBar(value: 1.0),
                  SizedBox(height: 8),
                  Text('MP: 50/75'),
                  NesProgressBar(value: 50 / 75),
                ],
              ),
            ),
          ),

        // Inventory window
        if (_showInventory)
          Positioned(
            right: 10,
            top: 10,
            child: NesWindow(
              width: 200,
              title: 'Inventory',
              icon: NesIcons.handPointingRight,
              actions: [
                (
                  NesIcons.sword,
                  () => print('Sort inventory'),
                ),
              ],
              onClose: () => setState(() => _showInventory = false),
              child: ListView(
                children: const [
                  ListTile(title: Text('Potion x3')),
                  ListTile(title: Text('Antidote x1')),
                  ListTile(title: Text('Ether x2')),
                ],
              ),
            ),
          ),

        // Control panel
        Positioned(
          bottom: 10,
          right: 10,
          child: NesWindow(
            width: 200,
            title: 'Controls',
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                NesButton.text(
                  type: NesButtonType.primary,
                  text: _showStats ? 'Hide Stats' : 'Show Stats',
                  onPressed: () => setState(() => _showStats = !_showStats),
                ),
                SizedBox(height: 8),
                NesButton.text(
                  type: NesButtonType.primary,
                  text: _showInventory ? 'Hide Inv' : 'Show Inv',
                  onPressed: () => setState(() => _showInventory = !_showInventory),
                ),
              ],
            ),
          ),
        ),
      ],
    );
  }
}

```

--------------------------------

### Basic Navigation with NesFill Transition

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/screen-transitions.md

Example of performing basic navigation using the NesFill transition. This function shows how to initiate a push with a specified builder, duration, and color.

```dart
void navigateWithTransition(BuildContext context) {
  Navigator.of(context).push(
    NesFill(
      builder: (context) => const NextPage(),
      transitionDuration: Duration(milliseconds: 500),
      color: Colors.black87,
    ),
  );
}
```

--------------------------------

### Basic Menu Example with NesSelectionList

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_selection_list.md

Demonstrates how to use NesSelectionList to create a main menu within a NesContainer. Handles item selection and navigation.

```dart
class MenuWidget extends StatefulWidget {
  const MenuWidget({Key? key}) : super(key: key);

  @override
  State<MenuWidget> createState() => _MenuWidgetState();
}

class _MenuWidgetState extends State<MenuWidget> {
  int _selectedIndex = 0;

  @override
  Widget build(BuildContext context) {
    return NesContainer(
      label: 'Main Menu',
      child: NesSelectionList(
        initialIndex: 0,
        children: [
          Text('New Game'),
          Text('Continue'),
          Text('Settings'),
          Text('About'),
          Text('Exit'),
        ],
        onSelect: (index) {
          setState(() => _selectedIndex = index);
          _handleMenuSelection(index);
        },
        onCancelSelection: () {
          // Back to previous menu
          Navigator.pop(context);
        },
      ),
    );
  }

  void _handleMenuSelection(int index) {
    switch (index) {
      case 0:
        _startNewGame();
        break;
      case 1:
        _continueGame();
        break;
      case 2:
        _openSettings();
        break;
      case 3:
        _showAbout();
        break;
      case 4:
        _exit();
        break;
    }
  }

  // Handler methods...
}
```

--------------------------------

### NesVerticalClose Transition Usage Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/screen-transitions.md

Demonstrates using the NesVerticalClose transition. Provide the page builder and animation duration.

```dart
Navigator.of(context).push(
  NesVerticalClose(
    builder: (context) => const NextPage(),
    transitionDuration: Duration(milliseconds: 400),
  ),
);
```

--------------------------------

### NesWindowDialogFrame Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_dialog.md

Shows a dialog using the NesWindowDialogFrame with a title and icon.

```dart
const NesDialog.show<String>(
  context: context,
  builder: (context) => Text('Hello'),
  frame: NesWindowDialogFrame(
    title: 'Greeting',
    leftIcon: NesIcons.handPointingRight,
  ),
)
```

--------------------------------

### Custom NesContainer Painter Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_container.md

Illustrates how to provide a custom painter to the NesContainer using the painterBuilder.

```dart
NesContainer(
  painterBuilder: ({ 
    required label,
    required pixelSize,
    required textStyle,
    required backgroundColor,
    required borderColor,
  }) => MyCustomContainerPainter(
    label: label,
    pixelSize: pixelSize,
    textStyle: textStyle,
    backgroundColor: backgroundColor,
    borderColor: borderColor,
  ),
  child: Text('Custom painted container'),
)
```

--------------------------------

### NesCheckBox Usage Examples

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_checkbox.md

Demonstrates various ways to use the NesCheckBox widget, including basic usage, uncontrolled checkboxes, and integration within StatefulWidgets.

```APIDOC
## NesCheckBox Usage Examples

### Description
Examples showcasing how to implement and use the NesCheckBox widget in different scenarios.

### Basic Checkbox
```dart
NesCheckBox(
  value: true,
  onChange: (newValue) {
    print('Checkbox: $newValue');
  },
)
```

### Uncontrolled Checkbox
```dart
NesCheckBox(
  value: false,
)
```

### In Stateful Widget
```dart
class CheckboxDemo extends StatefulWidget {
  const CheckboxDemo({Key? key}) : super(key: key);

  @override
  State<CheckboxDemo> createState() => _CheckboxDemoState();
}

class _CheckboxDemoState extends State<CheckboxDemo> {
  bool _agreed = false;

  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        NesCheckBox(
          value: _agreed,
          onChange: (value) {
            setState(() => _agreed = value);
          },
        ),
        SizedBox(width: 8),
        Text(_agreed ? 'You agreed' : 'You disagreed'),
      ],
    );
  }
}
```

### Multiple Checkboxes
```dart
class MultipleCheckboxes extends StatefulWidget {
  @override
  State<MultipleCheckboxes> createState() => _MultipleCheckboxesState();
}

class _MultipleCheckboxesState extends State<MultipleCheckboxes> {
  bool _option1 = false;
  bool _option2 = false;
  bool _option3 = false;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Row(
          children: [
            NesCheckBox(
              value: _option1,
              onChange: (v) => setState(() => _option1 = v),
            ),
            Text('Enable Feature 1'),
          ],
        ),
        Row(
          children: [
            NesCheckBox(
              value: _option2,
              onChange: (v) => setState(() => _option2 = v),
            ),
            Text('Enable Feature 2'),
          ],
        ),
        Row(
          children: [
            NesCheckBox(
              value: _option3,
              onChange: (v) => setState(() => _option3 = v),
            ),
            Text('Enable Feature 3'),
          ],
        ),
      ],
    );
  }
}
```
```

--------------------------------

### NesWindow with Multiple Actions Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_window.md

Shows a NesWindow with multiple action buttons in the title bar, each with an icon and a callback.

```dart
NesWindow(
  title: 'Media Player',
  actions: [
    (NesIcons.arrow, () => previousTrack()),
    (NesIcons.arrow, () => nextTrack()),
  ],
  onClose: () => stopPlayback(),
  child: MediaPlayerWidget(),
)
```

--------------------------------

### Navigating to Different Screens with Specific Transitions

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/screen-transitions.md

Demonstrates navigating to different screens using distinct transition types. This example shows how to use NesHorizontalGrid for a game screen and NesVerticalClose for a menu screen.

```dart
void navigateToGame(BuildContext context) {
  Navigator.of(context).push(
    NesHorizontalGrid(
      builder: (context) => const GameScreen(),
      transitionDuration: Duration(milliseconds: 600),
    ),
  );
}

void navigateToMenu(BuildContext context) {
  Navigator.of(context).push(
    NesVerticalClose(
      builder: (context) => const MenuScreen(),
      transitionDuration: Duration(milliseconds: 400),
    ),
  );
}
```

--------------------------------

### NesTabView within NesWindow

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_tab_view.md

Demonstrates how to integrate NesTabView inside a NesWindow to create dockable windows. The example shows dynamic tab creation and closing.

```dart
class DockableWindow extends StatefulWidget {
  final List<String> openTabs;
  final void Function(int) onTabClosed;

  const DockableWindow({
    required this.openTabs,
    required this.onTabClosed,
  });

  @override
  State<DockableWindow> createState() => _DockableWindowState();
}

class _DockableWindowState extends State<DockableWindow> {
  @override
  Widget build(BuildContext context) {
    return NesWindow(
      title: 'Windows',
      child: NesTabView(
        tabs: widget.openTabs
            .asMap()
            .entries
            .map(
              (entry) => NesTabItem(
                label: entry.value,
                child: Center(
                  child: Text('Content of ${entry.value}'),
                ),
              ),
            )
            .toList(),
        onTabClosed: (index) {
          widget.onTabClosed(index);
        },
      ),
    );
  }
}

```

--------------------------------

### Window Dialog Usage

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_dialog.md

Example of using NesDialog with a NesWindowDialogFrame, including a title and icon.

```dart
NesDialog.show(
  context: context,
  frame: NesWindowDialogFrame(
    title: 'Game Over',
    leftIcon: NesIcons.close,
  ),
  builder: (context) => Column(
    mainAxisSize: MainAxisSize.min,
    children: [
      Text('Final Score: 1000'),
      Text('Continue playing?'),
    ],
  ),
)
```

--------------------------------

### NesCheckbox Game Settings Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_checkbox.md

Implements a reusable game settings panel using NesCheckbox for difficulty and accessibility options. It accepts initial settings and provides a callback for saving.

```dart
class GameSettingsPanel extends StatefulWidget {
  final GameSettings initialSettings;
  final void Function(GameSettings) onSave;

  const GameSettingsPanel({
    required this.initialSettings,
    required this.onSave,
  });

  @override
  State<GameSettingsPanel> createState() => _GameSettingsPanelState();
}

class _GameSettingsPanelState extends State<GameSettingsPanel> {
  late GameSettings _settings;

  @override
  void initState() {
    super.initState();
    _settings = widget.initialSettings;
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text('Difficulty Options'),
        Row(
          children: [
            NesCheckBox(
              value: _settings.hardMode,
              onChange: (v) => setState(() => _settings = _settings.copyWith(hardMode: v)),
            ),
            Text('Hard Mode'),
          ],
        ),

        SizedBox(height: 16),

        Text('Accessibility'),
        Row(
          children: [
            NesCheckBox(
              value: _settings.colorblindMode,
              onChange: (v) => setState(() => _settings = _settings.copyWith(colorblindMode: v)),
            ),
            Text('Colorblind Mode'),
          ],
        ),
        Row(
          children: [
            NesCheckBox(
              value: _settings.largeText,
              onChange: (v) => setState(() => _settings = _settings.copyWith(largeText: v)),
            ),
            Text('Large Text'),
          ],
        ),

        SizedBox(height: 24),

        NesButton.text(
          type: NesButtonType.primary,
          text: 'Apply',
          onPressed: () => widget.onSave(_settings),
        ),
      ],
    );
  }
}

```

--------------------------------

### Complete Example with Custom Controller and Key Mapping

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_controller.md

Demonstrates setting up a NesInputController with a custom keyboard key mapping (WASD + Space/Backspace) and integrating it into a Flutter application. This allows for custom input handling for navigation and actions within the app.

```dart
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:nes_ui/nes_ui.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  
  // Create custom key mapping (WASD + Space/Backspace)
  const customMapping = NesKeyboardKeyMapping(
    up: [LogicalKeyboardKey.keyW, LogicalKeyboardKey.arrowUp],
    down: [LogicalKeyboardKey.keyS, LogicalKeyboardKey.arrowDown],
    left: [LogicalKeyboardKey.keyA, LogicalKeyboardKey.arrowLeft],
    right: [LogicalKeyboardKey.keyD, LogicalKeyboardKey.arrowRight],
    confirm: [LogicalKeyboardKey.space, LogicalKeyboardKey.enter],
    cancel: [LogicalKeyboardKey.backspace, LogicalKeyboardKey.escape],
  );

  final customAdapter = NesKeyboardInputAdapter(mapping: customMapping);
  final customController = NesInputController(adapters: [customAdapter]);

  runApp(
    NesController(
      controller: customController,
      child: const MyApp(),
    ),
  );
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Nes UI',
      theme: flutterNesTheme(),
      home: const HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  int _selectedIndex = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: NesSelectionList(
        initialIndex: _selectedIndex,
        children: [
          Text('Option 1 (W/ArrowUp to move up)'),
          Text('Option 2 (S/ArrowDown to move down)'),
          Text('Option 3 (Space/Enter to confirm)'),
          Text('Option 4 (Backspace/Escape to cancel)'),
        ],
        onSelect: (index) {
          setState(() => _selectedIndex = index);
          print('Selected: $index');
        },
      ),
    );
  }
}

```

--------------------------------

### Custom Game Input Adapter Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_controller.md

Demonstrates how to create a custom NesInputAdapter to integrate game controller input with the NesInputController. This involves defining a GameController and a GameInputAdapter that bridges game inputs to NesInputEvents.

```dart
class GameController {
  Stream<GameInput> get inputStream => _inputController.stream;
  final _inputController = StreamController<GameInput>();
}

class GameInputAdapter extends NesInputAdapter {
  GameInputAdapter(this.gameController);
  
  final GameController gameController;
  late StreamSubscription _subscription;

  void initialize() {
    _subscription = gameController.inputStream.listen((input) {
      // Convert game input to Nes events
      // and trigger callbacks
    });
  }

  @override
  void disposeListeners(FocusNode node) {}

  @override
  void addListener(FocusNode node, NesInputEvent event, VoidCallback callback) {
    // Register listener for game input
  }
}

// Usage:
final gameController = GameController();
final gameAdapter = GameInputAdapter(gameController);
gameAdapter.initialize();

final controller = NesInputController(adapters: [
  NesKeyboardInputAdapter(mapping: const NesKeyboardKeyMapping()),
  gameAdapter,
]);
```

--------------------------------

### Pushing a Screen with Return Value

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/screen-transitions.md

Demonstrates how to push a new screen and retrieve a return value using Navigator.of(context).push. The example uses NesFill for the transition.

```dart
final result = await Navigator.of(context).push<String>(
  NesFill(
    builder: (context) => const SelectionScreen(),
    transitionDuration: Duration(milliseconds: 500),
  ),
);

if (result != null) {
  print('Selected: $result');
}
```

--------------------------------

### Basic NesSelectionList Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_selection_list.md

A simple NesSelectionList with three text options. The onSelect callback prints the index of the selected item.

```dart
NesSelectionList(
  children: [
    Text('Option 1'),
    Text('Option 2'),
    Text('Option 3'),
  ],
  onSelect: (index) {
    print('Selected: $index');
  },
)
```

--------------------------------

### NesContainer Widget Examples

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_container.md

Demonstrates various ways to use the NesContainer widget, including basic usage, containers with labels, items in a grid, and nested containers. Ensure necessary imports for NesUI widgets.

```dart
import 'package:flutter/material.dart';
import 'package:nes_ui/nes_ui.dart';

class ContainerDemo extends StatelessWidget {
  const ContainerDemo({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        // Simple container
        NesContainer(
          child: Text('Basic container'),
        ),

        // Container with label
        NesContainer(
          label: 'Player Info',
          width: 250,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text('Name: Hero'),
              Text('Level: 10'),
              Text('Experience: 2500/5000'),
            ],
          ),
        ),

        // Multiple containers in grid
        GridView.count(
          crossAxisCount: 2,
          children: List.generate(
            4,
            (index) => NesContainer(
              label: 'Item ${index + 1}',
              child: Center(
                child: NesIcon(
                  iconData: NesIcons.sword,
                  size: Size(48, 48),
                ),
              ),
            ),
          ),
        ),

        // Nested containers
        NesContainer(
          label: 'Outer',
          child: Column(
            children: [
              Text('Content 1'),
              NesContainer(
                label: 'Inner',
                child: Text('Nested content'),
              ),
            ],
          ),
        ),
      ],
    );
  }
}
```

--------------------------------

### Confirm Shortcut Handler

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_dialog.md

Example of handling the Enter key for dialog confirmation. Returns an action to control dialog behavior.

```dart
onShortcutConfirm: () {
  print('Dialog confirmed by Enter');
  return NesDialogConfirmAction.closeDialog;
}
```

--------------------------------

### Basic NesButton Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_button.md

Creates a basic NesButton with a Text child and an onPressed callback. The button type is set to primary.

```dart
NesButton(
  type: NesButtonType.primary,
  onPressed: () => print('Button pressed'),
  child: Text('Click me'),
)
```

--------------------------------

### NesButton with Text Example

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_button.md

Creates a NesButton with text content and an onPressed callback. The button type is primary and the text is 'OK'.

```dart
NesButton.text(
  type: NesButtonType.primary,
  text: 'OK',
  onPressed: () => Navigator.pop(context),
)
```

--------------------------------

### Complete Nes UI Dialog Demo

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_dialog.md

A comprehensive example demonstrating various dialog types and their integration within a Flutter application. This includes basic dialogs, window dialogs with results, and confirmation dialogs, all triggered by NesButtons. It also shows how to update the UI based on dialog results.

```dart
import 'package:flutter/material.dart';
import 'package:nes_ui/nes_ui.dart';

class DialogDemo extends StatefulWidget {
  const DialogDemo({Key? key}) : super(key: key);

  @override
  State<DialogDemo> createState() => _DialogDemoState();
}

class _DialogDemoState extends State<DialogDemo> {
  String _lastResult = 'No dialog result yet';

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text(_lastResult),
        SizedBox(height: 16),

        // Basic dialog
        NesButton.text(
          type: NesButtonType.primary,
          text: 'Show Dialog',
          onPressed: () async {
            await NesDialog.show(
              context: context,
              builder: (context) => Text('Hello, World!'),
            );
          },
        ),

        // Window dialog with result
        NesButton.text(
          type: NesButtonType.primary,
          text: 'Window Dialog',
          onPressed: () async {
            final result = await NesDialog.show<String>(
              context: context,
              frame: NesWindowDialogFrame(
                title: 'Input',
                leftIcon: NesIcons.handPointingRight,
              ),
              builder: (context) => Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  Text('Enter something:'),
                  TextField(),
                ],
              ),
            );
            setState(() {
              _lastResult = 'Dialog result: $result';
            });
          },
        ),

        // Confirm dialog
        NesButton.text(
          type: NesButtonType.warning,
          text: 'Confirm Dialog',
          onPressed: () async {
            final confirmed = await NesConfirmDialog.show(
              context: context,
              message: 'Delete this item?',
              confirmLabel: 'Delete',
              cancelLabel: 'Keep',
            );
            setState(() {
              _lastResult = 'Confirmed: $confirmed';
            });
          },
        ),
      ],
    );
  }
}

```

--------------------------------

### Basic NesController Usage

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_controller.md

Example of using the default NesController, which is automatically handled by widgets like NesSelectionList. The default controller includes a NesKeyboardInputAdapter with standard key mappings.

```dart
NesSelectionList(
  children: items,
  onSelect: (index) {
    // Keyboard input automatically handled
  },
)
```

--------------------------------

### NesSnackbar Display Examples

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_snackbar.md

Demonstrates how to show different types of NesSnackbar notifications (normal, success, warning, error) by pressing buttons. Ensure the widget is used within a Scaffold or equivalent.

```dart
import 'package:flutter/material.dart';
import 'package:nes_ui/nes_ui.dart';

class SnackbarDemo extends StatefulWidget {
  const SnackbarDemo({Key? key}) : super(key: key);

  @override
  State<SnackbarDemo> createState() => _SnackbarDemoState();
}

class _SnackbarDemoState extends State<SnackbarDemo> {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        NesButton.text(
          type: NesButtonType.primary,
          text: 'Show Normal',
          onPressed: () => NesSnackbar.show(
            context,
            text: 'This is a normal notification',
            type: NesSnackbarType.normal,
          ),
        ),
        SizedBox(height: 12),
        NesButton.text(
          type: NesButtonType.success,
          text: 'Show Success',
          onPressed: () => NesSnackbar.show(
            context,
            text: 'Operation completed successfully!',
            type: NesSnackbarType.success,
          ),
        ),
        SizedBox(height: 12),
        NesButton.text(
          type: NesButtonType.warning,
          text: 'Show Warning',
          onPressed: () => NesSnackbar.show(
            context,
            text: 'Please be careful with this action',
            type: NesSnackbarType.warning,
          ),
        ),
        SizedBox(height: 12),
        NesButton.text(
          type: NesButtonType.error,
          text: 'Show Error',
          onPressed: () => NesSnackbar.show(
            context,
            text: 'An error occurred!',
            type: NesSnackbarType.error,
          ),
        ),
      ],
    );
  }
}
```

--------------------------------

### Basic Flutter App Setup with Nes UI Theme

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/main-reference.md

Configure a basic Flutter application to use the Nes UI theme by calling flutterNesTheme() in your MaterialApp.

```dart
import 'package:flutter/material.dart';
import 'package:nes_ui/nes_ui.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Nes UI',
      theme: flutterNesTheme(),
      home: const HomePage(),
    );
  }
}
```

--------------------------------

### Bundle Google Fonts License

Source: https://github.com/erickzanardo/nes_ui/blob/main/README.md

When bundling Google Fonts, ensure the font license is included in the LicenseRegistry. This example shows how to load and register the license for Press Start 2P.

```dart
void main() {
  LicenseRegistry.addLicense(() async* {
    final license = await rootBundle.loadString('google_fonts/OFL.txt');
    yield LicenseEntryWithLineBreaks(['google_fonts'], license);
  });

  runApp(...);
}
```

--------------------------------

### Customize NesSnackbar Theme

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_snackbar.md

Example of customizing the NesSnackbar theme within a MaterialApp.

```dart
MaterialApp(
  theme: flutterNesTheme(
    nesSnackbarTheme: NesSnackbarTheme(
      normal: Colors.blue,
      success: Colors.green,
      warning: Colors.yellow,
      error: Colors.red,
      normalTextStyle: TextStyle(color: Colors.white),
      successTextStyle: TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
      warningTextStyle: TextStyle(color: Colors.black),
      errorTextStyle: TextStyle(color: Colors.white),
    ),
  ),
)
```

--------------------------------

### NesIconBadge Usage

Source: https://github.com/erickzanardo/nes_ui/blob/main/_autodocs/api-reference/nes_icon.md

Example of using NesIconBadge to display an icon with a notification badge.

```dart
NesIconBadge(
  icon: NesIcons.shield,
  badge: Text('5'),
)
```