Function createStorageContext

Creates a React context + hook pair bound to a specific StorageAdapter instance. Returns a [Provider, useHook] tuple — rename to whatever fits your domain.

Setup:

import { StorageAdapter } from '@logosdx/storage';
import { createStorageContext } from '@logosdx/react';

interface AppStore {
    theme: 'light' | 'dark';
    userId: string;
    preferences: { lang: string; notifications: boolean };
}

const storage = new StorageAdapter<AppStore>({
    driver: new WebStorageDriver(localStorage),
    prefix: 'myapp',
});

export const [AppStorage, useAppStorage] = createStorageContext(storage);

Wrap your app:

<AppStorage>
    <App />
</AppStorage>

Use in components — any mutation triggers a re-render automatically:

function ThemeSwitcher() {

    const { get, set } = useAppStorage();

    // Reads current value — re-renders when any storage key changes
    const theme = get('theme');

    return (
        <button onClick={() => set('theme', theme === 'dark' ? 'light' : 'dark')}>
            Current: {theme}
        </button>
    );
}

Full API — typed pass-throughs to StorageAdapter:

const { get, set, remove, assign, has, clear, scope, keys, instance } = useAppStorage();

get('theme');                          // 'dark'
get();                                 // { theme: 'dark', userId: '...' ... }
set('theme', 'light');                 // triggers re-render
set({ theme: 'dark', userId: '42' }); // bulk set, triggers re-render
remove('userId');                      // triggers re-render
assign('preferences', { lang: 'es' });// Object.assign on the value
has('theme');                          // true
clear();                               // removes all prefixed keys
scope('theme');                         // scoped adapter for a single key
keys();                                // ['theme', 'userId', ...]