Core Primitives & Lifecycle

The foundation of the Neon widget tree and application lifecycle.

1. NeonApp

The root bootstrap widget that manages lifecycle hooks and configuration:

void main() {
  NeonApp.run(
    title: 'Neon Mobile App',
    theme: NeonThemeData.dark(),
    config: NeonConfig(
      port: 8080,
      enableHotReload: true,
      flavor: NeonBuildFlavor.development,
    ),
    home: const HomeScreen(),
  );
}

Lifecycle Hooks

• onInit: Called when the Dart server boots up.
• onResume: Called when the native app returns to foreground.
• onPause: Called when the native app is backgrounded.
• onDispose: Called when the app process is terminating.
• onHotReload: Invoked immediately after a code change is injected.

2. StatelessWidget vs StatefulWidget

// Stateless: Pure function of its configuration
class HeaderTitle extends StatelessWidget {
  final String title;
  const HeaderTitle({super.key, required this.title});

  @override
  NeonWidget build(NeonBuildContext context) {
    return Text(title, style: NeonTextStyle(fontSize: 20));
  }
}

// Stateful: Owns mutable state that triggers setState()
class LikeButton extends StatefulWidget {
  const LikeButton({super.key});

  @override
  NeonState<LikeButton> createState() => _LikeButtonState();
}

class _LikeButtonState extends NeonState<LikeButton> {
  bool _isLiked = false;

  @override
  NeonWidget build(NeonBuildContext context) {
    return IconButton(
      key: 'btn-like',
      icon: _isLiked ? Icons.favorite : Icons.favorite_border,
      color: _isLiked ? NeonColors.red : NeonColors.grey,
      onPressed: () {
        setState(() => _isLiked = !_isLiked);
      },
    );
  }
}