@replygirl/vanity/dist/index.js

simple, reactive state management for any framework using @vue/reactivity

import rfdc from 'rfdc';
import { reactive, readonly } from '@vue/reactivity';
import { entries } from './utils';
const createService = ({ name, baseState, methods }) => {
    const state = reactive(rfdc()(baseState));
    const storageKey = (k) => `service__${name}__${k}`;
    entries(state).forEach(([k, v]) => {
        const x = JSON.parse(localStorage.getItem(storageKey(k)) ?? 'null');
        if (x !== null && x !== v)
            state[k] = x;
    });
    const commit = (payload) => entries(payload)
        .filter(x => typeof x !== 'undefined')
        .forEach(([k, v]) => {
        if (v === null)
            localStorage.removeItem(storageKey(k));
        else
            localStorage.setItem(storageKey(k), JSON.stringify(v));
        state[k] = v;
    });
    const clear = () => commit(baseState);
    return readonly(reactive({
        ...state,
        ...(methods?.({ clear, commit, state }) ?? {})
    }));
};
export default createService;
//# sourceMappingURL=index.js.map