react-state-bucket/index.js

A lightweight and powerful package designed to manage states globally in React applications. It provides CRUD operations for your state data with ease, enabling developers to handle complex state management scenarios without the need for heavy libraries.

'use strict';Object.defineProperty(exports,'__esModule',{value:true});var react=require('react');const createBucket = (initial, option) => {
    const hooks = new Map();
    let data = new Map();
    let changes = new Map();
    let _option = Object.assign({ store: "memory" }, option);
    for (let key in initial) {
        let value = initial[key];
        data.set(key, value);
        changes.set(key, true);
    }
    const handleStorage = (isLoaded = true) => {
        if (typeof window !== 'undefined') {
            let url = new URL(window.location.href);
            if (_option.store === 'session' || _option.store === 'local') {
                let storage = _option.store === "session" ? sessionStorage : localStorage;
                for (let key in initial) {
                    let has = storage.getItem(key) !== null;
                    if (isLoaded || !has) {
                        data.has(key) ? storage.setItem(key, data.get(key)) : storage.removeItem(key);
                    }
                    else if (has) {
                        data.set(key, storage.getItem(key));
                    }
                }
            }
            else if (_option.store === "url") {
                for (let key in initial) {
                    let has = url.searchParams.has(key);
                    if (isLoaded || !has) {
                        data.has(key) ? url.searchParams.set(key, data.get(key)) : url.searchParams.delete(key);
                    }
                    else if (has) {
                        data.set(key, url.searchParams.get(key));
                    }
                }
                window.history.replaceState(null, '', url.toString());
            }
        }
    };
    handleStorage(false);
    let dispatch = () => {
        hooks.forEach(d => {
            try {
                d();
            }
            catch (error) { }
        });
        handleStorage();
    };
    const set = (key, value) => {
        if (!(key in initial))
            throw new Error(`(${key}) Invalid key provided in the set function. Please verify the structure of the initial state data.`);
        data.set(key, value);
        changes.set(key, true);
        dispatch();
    };
    const get = (key) => data.get(key);
    const _delete = (key) => {
        data.delete(key);
        changes.set(key, true);
        dispatch();
    };
    const clear = () => {
        for (let key in initial) {
            data.delete(key);
            changes.set(key, true);
        }
        dispatch();
    };
    const getState = () => {
        let d = {};
        for (let key in initial) {
            d[key] = data.get(key);
        }
        return d;
    };
    const setState = (state) => {
        for (let key in state) {
            if (!(key in initial))
                throw new Error(`(${key}) Invalid key provided in the setState function. Please verify the structure of the initial state data.`);
            data.set(key, state[key]);
            changes.set(key, true);
        }
        dispatch();
    };
    const isChange = (key) => changes.get(key);
    const getChanges = () => Array.from(changes.keys()).filter((key) => changes.get(key));
    const clearChanges = () => Array.from(changes.keys()).forEach((key) => changes.set(key, false));
    const useHook = () => {
        const id = react.useId();
        const [d, setUp] = react.useState(0);
        react.useEffect(() => {
            hooks.set(id, () => setUp(Math.random()));
            return () => {
                hooks.delete(id);
            };
        }, []);
        const state = react.useMemo(() => getState(), [d]);
        return {
            set,
            get,
            delete: _delete,
            clear,
            getState: () => state,
            setState,
            isChange,
            getChanges,
            clearChanges,
        };
    };
    useHook.set = set;
    useHook.get = get;
    useHook.delete = _delete;
    useHook.clear = clear;
    useHook.getState = getState;
    useHook.setState = setState;
    useHook.isChange = isChange;
    useHook.getChanges = getChanges;
    useHook.clearChanges = clearChanges;
    return useHook;
};exports.createBucket=createBucket;//# sourceMappingURL=index.js.map