bloc_signals_jaspr 0.1.2
bloc_signals_jaspr: ^0.1.2 copied to clipboard
Jaspr web component integration and state binding for BlocSignal state containers.
bloc_signals_jaspr #
Jaspr web component integration and state binding for bloc_signals state containers.
bloc_signals_jaspr provides complete API and component parity with bloc_signals_flutter, allowing you to use BlocSignal and CubitSignal containers seamlessly within Jaspr web applications.
🌐 Ecosystem Packages #
The BlocSignal monorepo consists of 10 modular packages:
⚡ Features #
BlocSignalProvider<T>: Injects aBlocSignalorCubitSignalinto the Jaspr component tree viaInheritedComponent, supporting lazy initialization (lazy: true), existing values (.value), and automatic container disposal.MultiBlocSignalProvider: Combines multiple providers into a single linear component tree.BuildContextExtensions: Read (context.read<T>()), watch (context.watch<T>()), and selectively subscribe (context.select<T, R>()) directly fromBuildContext.BlocSignalBuilder<T, S>: Rebuilds Jaspr components dynamically when state changes.BlocSignalListener<T, S>: Executes side-effect callbacks on state changes with optionallistenWhenfiltering.BlocSignalConsumer<T, S>: CombinesBlocSignalBuilderandBlocSignalListener.BlocSignalSelector<T, S, V>: Fine-grained component rebuild filtering using computed state slices.MultiBlocSignalListener: Merges multiple listeners cleanly.
🚀 Quickstart #
Add bloc_signals_jaspr to your pubspec.yaml:
dependencies:
bloc_signals_jaspr: ^0.1.0
Providing & Consuming State in Jaspr #
import 'package:bloc_signals_jaspr/bloc_signals_jaspr.dart';
import 'package:jaspr/dom.dart';
import 'package:jaspr/jaspr.dart';
class CounterCubit extends CubitSignal<int> {
CounterCubit() : super(initialState: 0);
void increment() => emit(stateValue + 1);
}
class CounterApp extends StatelessComponent {
const CounterApp({super.key});
@override
Component build(BuildContext context) {
return BlocSignalProvider(
create: (context) => CounterCubit(),
child: const CounterView(),
);
}
}
class CounterView extends StatelessComponent {
const CounterView({super.key});
@override
Component build(BuildContext context) {
return div([
BlocSignalBuilder<CounterCubit, int>(
builder: (context, state) {
return h1([Component.text('Count: $state')]);
},
),
button(
onClick: () => context.read<CounterCubit>().increment(),
[Component.text('Increment')],
),
]);
}
}
📄 License #
MIT License. See LICENSE for details.