Like BlocConsumer but for Value/ChangeNotifiers

listenable_consumer.dart

import 'package:flutter/material.dart';

class ListenableConsumer<T extends Listenable> extends StatefulWidget {
  final T listenable;
  final Widget Function(BuildContext context, T value) builder;
  final void Function(BuildContext context, T value) listener;

  const ListenableConsumer({
    super.key,
    required this.listenable,
    required this.builder,
    required this.listener,
  });

  @override
  State<ListenableConsumer<T>> createState() => _ListenableConsumerState<T>();
}

class _ListenableConsumerState<T extends Listenable> extends State<ListenableConsumer<T>> {
  late T _value;

  @override
  void initState() {
    super.initState();
    _value = widget.listenable;
    _value.addListener(_valueChanged);
  }

  @override
  void didUpdateWidget(ListenableConsumer<T> oldWidget) {
    super.didUpdateWidget(oldWidget);
    if (oldWidget.listenable != widget.listenable) {
      oldWidget.listenable.removeListener(_valueChanged);
      _value = widget.listenable;
      _value.addListener(_valueChanged);
    }
  }

  @override
  void dispose() {
    _value.removeListener(_valueChanged);
    super.dispose();
  }

  void _valueChanged() {
    setState(() => widget.listener(context, _value));
  }

  @override
  Widget build(BuildContext context) {
    return widget.builder(context, _value);
  }
}