A Rozenite plugin for inspecting multiple storage backends in React Native DevTools.

The Storage Plugin provides a single inspector for sync and async storages, including MMKV, AsyncStorage and Expo SecureStore via adapters.

Installation

npm install @rozenite/storage-plugin

Optional peers depending on adapters you use:

npm install react-native-mmkv @react-native-async-storage/async-storage expo-secure-store

Usage

import {
  createAsyncStorageAdapter,
  createMMKVStorageAdapter,
  createExpoSecureStorageAdapter,
  useRozeniteStoragePlugin,
} from '@rozenite/storage-plugin';

const storages = [
  createMMKVStorageAdapter({
    storages: {
      user: userStorage,
      cache: cacheStorage,
    },
    blacklist: /user:token|cache:.*Binary.*/,
  }),
  createAsyncStorageAdapter({
    storage: AsyncStorage,
  }),
  createExpoSecureStorageAdapter({
    storage: SecureStore,
    keys: ['token', 'session'],
  }),
];

useRozeniteStoragePlugin({ storages });

MMKV v3 and v4

createMMKVStorageAdapter supports both:

// v3 style: array or named storages
createMMKVStorageAdapter({
  storages: [userStorage, cacheStorage],
});

// v4 style: named storages only
createMMKVStorageAdapter({
  storages: {
    user: userStorage,
    cache: cacheStorage,
  },
});

MMKV v4 requires a record of storage IDs because the storage instance no longer exposes an id that the plugin can derive from an array item.

AsyncStorage v2 and v3

createAsyncStorageAdapter supports both:

// v2 style: single storage object
createAsyncStorageAdapter({
  storage: AsyncStorage,
});

// v3 style: named storage instances
createAsyncStorageAdapter({
  storages: {
    auth: authStorageInstance,
    cache: {
      storage: cacheStorageInstance,
      name: 'Cache Instance',
    },
  },
});

createExpoAsyncStorageAdapter is still exported as a backward-compatible alias.

Web (React Native for Web)

When you use Rozenite for Web in development, this plugin loads in the browser like on native. AsyncStorage and Expo SecureStore adapters work on web when the underlying libraries do.

MMKV is not available in typical web bundles. In development on web, createMMKVStorageAdapter returns an adapter with empty storages (same behavior as production builds), so you can keep shared setup code without importing react-native-mmkv in the web bundle.

Notes

• Unsupported value types are disabled in UI create/edit flows.
• Type support is enforced in UI, runtime and Agent tools.
• Storages without subscriptions automatically use internal polling updates.
• Per-storage blacklists are supported through adapter configuration.
• Storage snapshots can be exported to and imported from a versioned JSON file from the panel. See the storage plugin docs for the schema and behavior.