@breadstone/ziegel-redux
v0.0.9
Published
Includes utilities for redux.
Readme
@breadstone/ziegel-redux
State management and reactive patterns for the ziegel framework. Provides Redux-style stores, observables, subjects, and action/reducer patterns for predictable state management.
State Management: Redux-inspired state management with reactive programming patterns and type-safe actions and stores.
🚀 Overview
@breadstone/ziegel-redux provides:
- Redux Store: Type-safe Redux store implementation with actions and reducers
- Reactive Patterns: Observables, subjects, and subscription management
- Action System: Structured action interfaces and dispatching
- Middleware Support: Extensible middleware pipeline for actions
- State Management: Predictable state updates with action/reducer patterns
- Type Safety: Full TypeScript support for stores, actions, and state
📦 Installation
npm install @breadstone/ziegel-redux
# or
yarn add @breadstone/ziegel-redux🧩 Features & Usage Examples
Redux Store
import { Store, IStore, IAction } from '@breadstone/ziegel-redux';
interface AppState {
count: number;
user: User | null;
}
interface IncrementAction extends IAction {
type: 'INCREMENT';
payload?: number;
}
const store = new Store<AppState>({
count: 0,
user: null
});
// Dispatch actions
store.dispatch({ type: 'INCREMENT', payload: 1 });Observable and Subject
import { Observable, Subject, IObservable, IObserver } from '@breadstone/ziegel-redux';
// Create a subject for data streaming
const dataSubject = new Subject<string>();
// Subscribe to changes
dataSubject.subscribe(value => {
console.log('Received:', value);
});
// Emit values
dataSubject.next('Hello');
dataSubject.next('World');
// Create custom observables
const customObservable = new Observable<number>(observer => {
let count = 0;
const interval = setInterval(() => {
observer.next(count++);
}, 1000);
return () => clearInterval(interval);
});Action System
import { IAction, IDispatcher, IReducer } from '@breadstone/ziegel-redux';
// Define typed actions
interface SetUserAction extends IAction {
type: 'SET_USER';
payload: User;
}
interface ClearUserAction extends IAction {
type: 'CLEAR_USER';
}
type UserActions = SetUserAction | ClearUserAction;
// Implement reducer
const userReducer: IReducer<User | null, UserActions> = (state = null, action) => {
switch (action.type) {
case 'SET_USER':
return action.payload;
case 'CLEAR_USER':
return null;
default:
return state;
}
};Middleware
import { IMiddleware, IAction, IStore } from '@breadstone/ziegel-redux';
// Create logging middleware
const loggingMiddleware: IMiddleware = (store, next) => (action) => {
console.log('Dispatching action:', action);
const result = next(action);
console.log('New state:', store.getState());
return result;
};
// Apply middleware to store
store.use(loggingMiddleware);Reactive Subscriptions
import { ISubscription, ISubscribable } from '@breadstone/ziegel-redux';
// Subscribe to store changes
const subscription: ISubscription = store.subscribe(state => {
console.log('State changed:', state);
});
// Unsubscribe when done
subscription.unsubscribe();
// Work with subscribable patterns
function processSubscribable<T>(subscribable: ISubscribable<T>) {
return subscribable.subscribe(value => {
// Process the value
console.log('Processing:', value);
});
}📚 Package import points
import {
// Reactive Interfaces
IObservable, IObserver, ISubscribable, ISubscriber, ISubscription,
// Reactive Implementations
Observable, Subject,
// Redux Interfaces
IAction, IDispatcher, IMiddleware, IReducer,
// Store
IStore, Store
} from '@breadstone/ziegel-redux';// Redux utilities (to be implemented)
// This package is planned for Redux state management patterns
// Implementation will follow Redux/Redux Toolkit patterns} from '@breadstone/ziegel-redux';
## 📚 API Documentation
For detailed API documentation, visit: [API Docs](./../../.docs/api/ziegel-redux/index.md)
## Related Packages
- **@breadstone/ziegel-core**: Foundation utilities and type definitions
- **redux**: Core Redux library
- **reselect**: Selector library for Redux
## License
MIT
## Issues
Please report bugs and feature requests in the [Issue Tracker](https://github.com/RueDeRennes/ziegel/issues)
---
*Part of the [ziegel Enterprise TypeScript Framework](../../README.md)*