State>` - `setState(input: RootState | NextStateUpdater): Promise` - `mergeState(input: Patch | Updater): Promise` - `configureGlobalStore(config: GlobalStoreConfig): void` - `selector(selectorFn: (state: Readonly) => T): T` - `initStore(config, options?): InitializedStore<...>` ## `hummbit/react` - `getState(): Readonly` - `setState(input: RootState | NextStateUpdater): Promise` - `mergeState(input: Patch | MergeUpdater): Promise` - `useSelector(selectorFn, equalityFn?): T` - `configureGlobalStore(config): void` - `initStore(config, options?): InitializedReactStore<...>` # Справочник API --- ## `hummbit.getState` Одноразовое чтение иммутабельного snapshot из глобального singleton store. ### Базовое чтение ```ts import { getState } from "hummbit"; const snapshot = getState(); console.log(snapshot); ``` ### Чтение вложенного поля ```ts import { getState } from "hummbit"; const userName = getState().user?.name ?? "anonymous"; ``` ### Чтение в обработчике события ```ts import { getState } from "hummbit"; function onCheckoutClick() { con1a:T707,# Middleware: подробности `Middleware` в `hummbit` — это композиционный слой перехвата вокруг переходов состояния и событий DevTools. Он нужен для сквозной (cross-cutting) логики без засорения доменных action: - логирование и трассировка; - аналитика и телеметрия; - замер производительности; - инварианты и runtime-проверки; - нормализация событий перед отправкой в DevTools. ## 1) Ментальная модель Каждый middleware получает контекст (`ctx`) и возвращает любой набор hook-ов. Можно реализовать один hook или несколько hook-ов в одном middleware. Поддерживаемые hooks: - `wrapAction(name, next)` - `wrapSetState(next)` - `wrapMergeState(next)` - `afterUpdate(info)` - `devtoolsFilter(event)` - `devtoolsTransform(event)` `wrap*`-hooks работают как декораторы функций: - `next` — это "текущая реализация"; - ваш hook может выполнить код до и/или после `next`; - можно пробрасывать аргументы как есть, модифицировать их или делать short-circuit. ## 2) Пайплайн выполнения и порядок Middleware применяются по порядку в массиве. Для wrapper-хуков это означает: первый middleware становится самым внешним слоем: ```ts const m1: Middleware = () => ({ wrapAction: (name, next) => async (...args) => { c1b:T642,# Redux DevTools: подробности Ниже полный практический гайд по подключению и настройке. ## 1) Как подключается Redux DevTools 1. Установите расширение браузера Redux DevTools (Chrome/Edge/Firefox). 2. Создайте store через `initStore(...)` или настройте глобальный store через `configureGlobalStore(...)`. 3. Убедитесь, что DevTools включены: - по умолчанию auto mode: включены при `NODE_ENV !== "production"`; - либо явно через `config.devtools`. 4. Откройте вкладку расширения Redux DevTools в браузере и выберите нужный store по имени. Пример явного включения для instance-store: ```ts const store = initStore({ initialState: { count: 0 }, devtools: true, actions: ({ actionCreator, setState }) => ({ inc: actionCreator("inc", () => setState((s) => ({ ...