@elcrm/state

Лёгкий React-store для elCRM: подписки по ключам, actions без лишнего ререндера и опциональный LocalStorage.

Установка

npm install @elcrm/state
# или
bun add @elcrm/state

Быстрый старт

store.ts

import { State } from "@elcrm/state";

const useCountState = State.create((set) => ({
    count: 0,
    onIncrease: () => set((state) => ({ count: state.count + 1 })),
    onZeroize: () => set({ count: 0 }),
}));

App.tsx

function App() {
    // подписка только на "count"
    const count = useCountState("count");

    return <h1>Counter: {count}</h1>;
}

function Controls() {
    // только action, без подписки на изменения
    const { onIncrease } = useCountState([]);

    return <button onClick={onIncrease}>Increase</button>;
}

Подписки

// все изменения
const state = useCountState();

// одно поле
const params = useCountState("params");

// несколько полей — ререндер только при их изменении
const { id, name, age } = useCountState(["name", "age"]);

// без подписки (только actions)
const { onIncrease } = useCountState([]);

Обновление состояния

const useCountState = State.create((set, get) => ({
    count: 0,
    onCommon: () => set((state) => ({ count: state.count + 1 })),
    onSimple: () => set({ count: get().count + 1 }),
    onAssign: (params: number) => set({ count: params }),
}));

Вне React

useCountState.getState();
useCountState.setState({ count: 10 });

const unsub = useCountState.subscribe(() => {
    console.log(useCountState.getState());
});

LocalStorage

Второй аргумент — ключ в localStorage (функции не сохраняются):

const useStore = State.create(
    (set) => ({
        id: 0,
        name: "",
        age: 0,
        setAge: (age: number) => set({ age }),
    }),
    "profile",
);