react-native-storage-inspector 1.0.0

package/dist/index.mjs

@@ -0,0 +1,1223 @@
+import React6, { useState, useMemo, useEffect, useCallback } from 'react';
+import { StyleSheet, Dimensions, View, ScrollView, RefreshControl, Text, TouchableOpacity, Share, Modal, TextInput } from 'react-native';
+
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined") return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
+
+// src/adapters/mmkv.ts
+function createMMKVAdapter(instance, name) {
+  return {
+    type: "mmkv",
+    name: name ?? "MMKV",
+    getAllKeys() {
+      return Promise.resolve(instance.getAllKeys());
+    },
+    getItem(key) {
+      const value = instance.getString(key);
+      return Promise.resolve(value ?? null);
+    },
+    setItem(key, value) {
+      instance.set(key, value);
+      return Promise.resolve();
+    },
+    removeItem(key) {
+      instance.delete(key);
+      return Promise.resolve();
+    },
+    isAvailable() {
+      return true;
+    }
+  };
+}
+
+// src/adapters/async-storage.ts
+var asyncStorage = null;
+function getAsyncStorage() {
+  if (asyncStorage) return asyncStorage;
+  try {
+    asyncStorage = __require("@react-native-async-storage/async-storage").default;
+    return asyncStorage;
+  } catch {
+    return null;
+  }
+}
+function createAsyncStorageAdapter() {
+  return {
+    type: "async-storage",
+    name: "Async Storage",
+    async getAllKeys() {
+      const storage = getAsyncStorage();
+      if (!storage) return [];
+      return storage.getAllKeys();
+    },
+    async getItem(key) {
+      const storage = getAsyncStorage();
+      if (!storage) return null;
+      return storage.getItem(key);
+    },
+    async setItem(key, value) {
+      const storage = getAsyncStorage();
+      if (!storage) throw new Error("AsyncStorage is not available");
+      await storage.setItem(key, value);
+    },
+    async removeItem(key) {
+      const storage = getAsyncStorage();
+      if (!storage) throw new Error("AsyncStorage is not available");
+      await storage.removeItem(key);
+    },
+    isAvailable() {
+      return getAsyncStorage() !== null;
+    }
+  };
+}
+
+// src/adapters/keychain.ts
+var keychain = null;
+function getKeychain() {
+  if (keychain) return keychain;
+  try {
+    keychain = __require("react-native-keychain");
+    return keychain;
+  } catch {
+    return null;
+  }
+}
+function createKeychainAdapter(knownKeys = []) {
+  return {
+    type: "keychain",
+    name: "Keychain",
+    async getAllKeys() {
+      const kc = getKeychain();
+      if (!kc) return [...knownKeys];
+      const genericServices = [];
+      if (typeof kc.getAllGenericPasswordServices === "function") {
+        try {
+          const services = await kc.getAllGenericPasswordServices();
+          if (Array.isArray(services)) genericServices.push(...services);
+        } catch {
+        }
+      }
+      const merged = /* @__PURE__ */ new Set([...genericServices, ...knownKeys]);
+      return Array.from(merged);
+    },
+    async getItem(key) {
+      const kc = getKeychain();
+      if (!kc) return null;
+      if (typeof kc.getGenericPassword === "function") {
+        try {
+          const creds2 = await kc.getGenericPassword({ service: key });
+          if (creds2 && typeof creds2 === "object" && "password" in creds2) {
+            return creds2.password;
+          }
+        } catch {
+        }
+      }
+      const creds = await kc.getInternetCredentials(key);
+      return creds?.password ?? null;
+    },
+    async setItem(key, value) {
+      const kc = getKeychain();
+      if (!kc) throw new Error("react-native-keychain is not available");
+      if (typeof kc.setGenericPassword === "function") {
+        const result2 = await kc.setGenericPassword(key, value, { service: key });
+        if (result2 === false) throw new Error("Keychain set failed");
+        return;
+      }
+      const result = await kc.setInternetCredentials(key, key, value);
+      if (result === false) throw new Error("Keychain set failed");
+    },
+    async removeItem(key) {
+      const kc = getKeychain();
+      if (!kc) throw new Error("react-native-keychain is not available");
+      if (typeof kc.resetGenericPassword === "function") {
+        await kc.resetGenericPassword({ service: key });
+      }
+      await kc.resetInternetCredentials(key);
+    },
+    isAvailable() {
+      return getKeychain() !== null;
+    }
+  };
+}
+
+// src/adapters/secure-store.ts
+var secureStore = null;
+function getSecureStore() {
+  if (secureStore) return secureStore;
+  try {
+    secureStore = __require("expo-secure-store");
+    return secureStore;
+  } catch {
+    return null;
+  }
+}
+function createSecureStoreAdapter(knownKeys = []) {
+  return {
+    type: "expo-secure-store",
+    name: "Secure Store",
+    async getAllKeys() {
+      return [...knownKeys];
+    },
+    async getItem(key) {
+      const store = getSecureStore();
+      if (!store) return null;
+      return store.getItemAsync(key);
+    },
+    async setItem(key, value) {
+      const store = getSecureStore();
+      if (!store) throw new Error("expo-secure-store is not available");
+      await store.setItemAsync(key, value);
+    },
+    async removeItem(key) {
+      const store = getSecureStore();
+      if (!store) throw new Error("expo-secure-store is not available");
+      await store.deleteItemAsync(key);
+    },
+    isAvailable() {
+      return getSecureStore() !== null;
+    }
+  };
+}
+function useStorageItems(adapter) {
+  const [items, setItems] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  const refresh = useCallback(async () => {
+    if (!adapter || !adapter.isAvailable()) {
+      setItems([]);
+      setLoading(false);
+      return;
+    }
+    setLoading(true);
+    setError(null);
+    try {
+      const keys = await adapter.getAllKeys();
+      const pairs = [];
+      for (const key of keys) {
+        const value = await adapter.getItem(key);
+        pairs.push({ key, value: value ?? "" });
+      }
+      setItems(pairs);
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Failed to load items");
+      setItems([]);
+    } finally {
+      setLoading(false);
+    }
+  }, [adapter]);
+  useEffect(() => {
+    refresh();
+  }, [refresh]);
+  return { items, loading, error, refresh };
+}
+
+// src/theme.ts
+var theme = {
+  colors: {
+    background: "#ffffff",
+    backgroundSecondary: "#f5f5f5",
+    backgroundTertiary: "#eeeeee",
+    border: "#e0e0e0",
+    borderLight: "#ebebeb",
+    text: "#000000",
+    textSecondary: "#666666",
+    textMuted: "#999999",
+    inverted: "#ffffff"
+  }
+};
+
+// src/components/Icon.tsx
+var GLYPHS = {
+  chevronBack: "\u2039",
+  refresh: "\u21BB",
+  plus: "+",
+  chevronDown: "\u203A",
+  chevronUp: "\u203A",
+  chevronRight: "\u203A",
+  close: "\xD7",
+  copy: "\u2398",
+  edit: "\u270E",
+  trash: "\u232B"
+};
+var ROTATION = {
+  chevronDown: "90deg",
+  chevronUp: "-90deg"
+};
+function Icon({
+  name,
+  size = 20,
+  tintColor = theme.colors.text,
+  iconStyle
+}) {
+  const glyph = GLYPHS[name] ?? "?";
+  const rotation = ROTATION[name];
+  return /* @__PURE__ */ React6.createElement(
+    Text,
+    {
+      style: [
+        styles.icon,
+        { fontSize: size, color: tintColor, lineHeight: size },
+        ...rotation ? [{ transform: [{ rotate: rotation }] }] : [],
+        iconStyle
+      ]
+    },
+    glyph
+  );
+}
+var styles = StyleSheet.create({
+  icon: {
+    alignSelf: "center",
+    fontWeight: "300"
+  }
+});
+var { width: SCREEN_WIDTH } = Dimensions.get("window");
+var LAYOUT = {
+  padding: 16,
+  fontSize: 14,
+  headerHeight: 52,
+  rowMinHeight: 48,
+  sectionHeaderHeight: 48,
+  iconSize: 20,
+  chevronSize: 24,
+  iconGap: 2,
+  iconButtonSize: 36,
+  hitSlop: { top: 8, bottom: 8, left: 8, right: 8 },
+  hitSlopLarge: { top: 10, bottom: 10, left: 10, right: 10 },
+  fabSize: 52,
+  modalRadius: 16,
+  sectionRadius: 4,
+  screenWidth: SCREEN_WIDTH
+};
+var { colors } = theme;
+var styles2 = StyleSheet.create({
+  container: {
+    flex: 1,
+    width: "100%",
+    backgroundColor: colors.background
+  },
+  content: {
+    flex: 1
+  },
+  scroll: {
+    flex: 1
+  },
+  header: {
+    height: LAYOUT.headerHeight,
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    paddingHorizontal: LAYOUT.padding,
+    borderBottomWidth: StyleSheet.hairlineWidth,
+    borderBottomColor: colors.border,
+    backgroundColor: colors.background
+  },
+  headerLeft: {
+    minWidth: 44,
+    alignItems: "flex-start"
+  },
+  headerCenter: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  headerRight: {
+    minWidth: 44,
+    alignItems: "flex-end"
+  },
+  sectionHeaderLabelWrap: {
+    flex: 1
+  },
+  headerTitle: {
+    fontSize: 17,
+    fontWeight: "600",
+    color: colors.text
+  },
+  headerButton: {
+    width: 44,
+    height: 44,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  scrollContent: {
+    flexGrow: 1,
+    paddingBottom: LAYOUT.fabSize + LAYOUT.padding + 20,
+    paddingTop: LAYOUT.padding
+  },
+  sectionHeader: {
+    height: LAYOUT.sectionHeaderHeight,
+    flexDirection: "row",
+    alignItems: "center",
+    paddingHorizontal: LAYOUT.padding,
+    borderBottomWidth: StyleSheet.hairlineWidth,
+    borderBottomColor: colors.border,
+    backgroundColor: colors.backgroundSecondary,
+    marginTop: LAYOUT.padding,
+    marginHorizontal: LAYOUT.padding,
+    borderRadius: LAYOUT.sectionRadius
+  },
+  sectionHeaderLabel: {
+    fontSize: 15,
+    fontWeight: "600",
+    color: colors.text
+  },
+  sectionHeaderCount: {
+    color: colors.textSecondary,
+    fontWeight: "400"
+  },
+  storageRowActions: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: LAYOUT.iconGap
+  },
+  iconButton: {
+    width: LAYOUT.iconButtonSize,
+    height: LAYOUT.iconButtonSize,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  iconSlot: {
+    width: LAYOUT.iconButtonSize,
+    height: LAYOUT.iconButtonSize,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  itemRow: {
+    minHeight: LAYOUT.rowMinHeight,
+    paddingHorizontal: LAYOUT.padding,
+    paddingVertical: 12,
+    borderBottomWidth: StyleSheet.hairlineWidth,
+    borderBottomColor: colors.borderLight,
+    backgroundColor: colors.background,
+    marginHorizontal: LAYOUT.padding,
+    marginBottom: 4
+  },
+  itemRowCollapsed: {
+    flexDirection: "row",
+    alignItems: "center",
+    alignSelf: "stretch"
+  },
+  itemKey: {
+    flex: 1,
+    fontSize: LAYOUT.fontSize,
+    fontWeight: "500",
+    color: colors.text
+  },
+  itemChars: {
+    fontSize: 12,
+    color: colors.textSecondary,
+    marginTop: 2
+  },
+  itemRowActions: {
+    flexDirection: "row",
+    alignItems: "center",
+    marginLeft: LAYOUT.iconGap,
+    gap: LAYOUT.iconGap
+  },
+  itemRowExpanded: {
+    paddingTop: 4
+  },
+  valueBox: {
+    backgroundColor: colors.backgroundSecondary,
+    borderRadius: 8,
+    padding: 12,
+    marginTop: 8,
+    marginBottom: 8,
+    borderWidth: StyleSheet.hairlineWidth,
+    borderColor: colors.border
+  },
+  valueBoxLabel: {
+    fontSize: 11,
+    fontWeight: "600",
+    color: colors.textSecondary,
+    marginBottom: 4,
+    textTransform: "uppercase"
+  },
+  valueBoxText: {
+    fontSize: LAYOUT.fontSize,
+    color: colors.text
+  },
+  empty: {
+    padding: LAYOUT.padding * 2,
+    alignItems: "center",
+    marginHorizontal: LAYOUT.padding
+  },
+  emptyText: {
+    fontSize: LAYOUT.fontSize,
+    color: colors.textMuted
+  },
+  loading: {
+    padding: LAYOUT.padding * 2,
+    alignItems: "center",
+    marginHorizontal: LAYOUT.padding
+  },
+  loadingText: {
+    fontSize: LAYOUT.fontSize,
+    color: colors.textSecondary
+  },
+  error: {
+    padding: LAYOUT.padding,
+    backgroundColor: colors.backgroundTertiary,
+    marginHorizontal: LAYOUT.padding,
+    marginVertical: 8,
+    borderRadius: 8
+  },
+  errorText: {
+    fontSize: LAYOUT.fontSize,
+    color: colors.text
+  },
+  keychainHint: {
+    padding: LAYOUT.padding,
+    marginHorizontal: LAYOUT.padding,
+    marginTop: 8,
+    marginBottom: 4,
+    backgroundColor: colors.backgroundSecondary,
+    borderRadius: 8
+  },
+  keychainHintText: {
+    fontSize: LAYOUT.fontSize - 1,
+    color: colors.textSecondary
+  },
+  list: {
+    flex: 1
+  },
+  listContent: {
+    flexGrow: 1,
+    paddingBottom: LAYOUT.fabSize + LAYOUT.padding + 20
+  },
+  row: {
+    flexDirection: "row",
+    alignItems: "center",
+    minHeight: LAYOUT.rowMinHeight,
+    paddingHorizontal: LAYOUT.padding,
+    paddingVertical: 12,
+    borderBottomWidth: StyleSheet.hairlineWidth,
+    borderBottomColor: colors.borderLight,
+    backgroundColor: colors.background,
+    marginHorizontal: LAYOUT.padding
+  },
+  rowKey: {
+    flex: 1,
+    fontSize: LAYOUT.fontSize,
+    fontWeight: "500",
+    color: colors.text
+  },
+  rowValue: {
+    fontSize: LAYOUT.fontSize - 1,
+    color: colors.textSecondary
+  },
+  rowActions: {
+    flexDirection: "row",
+    alignItems: "center",
+    marginLeft: LAYOUT.iconGap,
+    gap: LAYOUT.iconGap
+  },
+  rowButton: {
+    paddingVertical: 8,
+    paddingHorizontal: 12
+  },
+  rowButtonText: {
+    fontSize: 14,
+    fontWeight: "600",
+    color: colors.text
+  },
+  rowButtonDanger: {
+    color: colors.text
+  },
+  addButton: {
+    position: "absolute",
+    bottom: LAYOUT.padding + 16,
+    right: LAYOUT.padding + 16,
+    width: LAYOUT.fabSize,
+    height: LAYOUT.fabSize,
+    borderRadius: LAYOUT.fabSize / 2,
+    backgroundColor: colors.text,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  addButtonText: {
+    fontSize: 16,
+    fontWeight: "600",
+    color: colors.inverted
+  },
+  fab: {
+    position: "absolute",
+    bottom: LAYOUT.padding + 16,
+    right: LAYOUT.padding + 16,
+    width: LAYOUT.fabSize,
+    height: LAYOUT.fabSize,
+    borderRadius: LAYOUT.fabSize / 2,
+    backgroundColor: colors.text,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  formOverlay: {
+    flex: 1,
+    backgroundColor: "rgba(0,0,0,0.5)",
+    justifyContent: "flex-end",
+    alignItems: "center"
+  },
+  formModal: {
+    width: "100%",
+    maxWidth: LAYOUT.screenWidth,
+    backgroundColor: colors.background,
+    borderTopLeftRadius: LAYOUT.modalRadius,
+    borderTopRightRadius: LAYOUT.modalRadius,
+    padding: LAYOUT.padding,
+    paddingBottom: LAYOUT.padding + 34
+  },
+  formHeader: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    marginBottom: LAYOUT.padding
+  },
+  formTitle: {
+    fontSize: 17,
+    fontWeight: "600",
+    color: colors.text,
+    flex: 1
+  },
+  formCloseButton: {
+    width: 44,
+    height: 44,
+    alignItems: "flex-end",
+    justifyContent: "center"
+  },
+  formStorageType: {
+    fontSize: 13,
+    color: colors.textSecondary,
+    marginBottom: 12
+  },
+  formLabel: {
+    fontSize: 12,
+    fontWeight: "600",
+    color: colors.textSecondary,
+    marginBottom: 6
+  },
+  formInput: {
+    borderWidth: 1,
+    borderColor: colors.border,
+    borderRadius: 10,
+    padding: 12,
+    fontSize: LAYOUT.fontSize,
+    marginBottom: LAYOUT.padding,
+    color: colors.text,
+    backgroundColor: colors.background
+  },
+  formInputDisabled: {
+    backgroundColor: colors.backgroundSecondary,
+    color: colors.textSecondary
+  },
+  formActions: {
+    flexDirection: "row",
+    justifyContent: "flex-end",
+    gap: 12,
+    marginTop: 8
+  },
+  formButton: {
+    paddingVertical: 12,
+    paddingHorizontal: 20,
+    borderRadius: 10,
+    minWidth: 100,
+    alignItems: "center"
+  },
+  formButtonCancel: {
+    backgroundColor: "transparent",
+    borderWidth: 1,
+    borderColor: colors.text
+  },
+  formButtonSubmit: {
+    backgroundColor: colors.text
+  },
+  formButtonText: {
+    fontSize: 16,
+    fontWeight: "600"
+  },
+  formButtonTextCancel: {
+    color: colors.text
+  },
+  formButtonTextSubmit: {
+    color: colors.inverted
+  },
+  confirmOverlay: {
+    flex: 1,
+    backgroundColor: "rgba(0,0,0,0.5)",
+    justifyContent: "flex-end",
+    alignItems: "center"
+  },
+  confirmModal: {
+    width: "100%",
+    maxWidth: LAYOUT.screenWidth,
+    backgroundColor: colors.background,
+    borderTopLeftRadius: LAYOUT.modalRadius,
+    borderTopRightRadius: LAYOUT.modalRadius,
+    padding: LAYOUT.padding,
+    paddingBottom: LAYOUT.padding + 34
+  },
+  confirmHeader: {
+    flexDirection: "row",
+    alignItems: "center",
+    justifyContent: "space-between",
+    marginBottom: 12
+  },
+  confirmTitle: {
+    fontSize: 17,
+    fontWeight: "600",
+    color: colors.text,
+    flex: 1
+  },
+  confirmMessage: {
+    fontSize: 15,
+    color: colors.textSecondary,
+    lineHeight: 22,
+    marginBottom: 20
+  },
+  confirmActions: {
+    flexDirection: "row",
+    gap: 12
+  },
+  confirmButton: {
+    flex: 1,
+    paddingVertical: 14,
+    borderRadius: 10,
+    alignItems: "center"
+  },
+  confirmButtonSecondary: {
+    backgroundColor: "transparent",
+    borderWidth: 1,
+    borderColor: colors.text
+  },
+  confirmButtonDanger: {
+    backgroundColor: colors.text
+  },
+  confirmButtonText: {
+    fontSize: 16,
+    fontWeight: "600"
+  },
+  confirmButtonTextSecondary: {
+    color: colors.text
+  },
+  confirmButtonTextDanger: {
+    color: colors.inverted
+  }
+});
+
+// src/components/IconButton.tsx
+function IconButton({
+  name,
+  onPress,
+  size = LAYOUT.iconSize,
+  tintColor = theme.colors.text,
+  disabled = false,
+  hitSlop = LAYOUT.hitSlop,
+  style,
+  activeOpacity = 0.6
+}) {
+  return /* @__PURE__ */ React6.createElement(
+    TouchableOpacity,
+    {
+      style: [styles2.iconButton, style],
+      onPress,
+      disabled,
+      hitSlop,
+      activeOpacity
+    },
+    /* @__PURE__ */ React6.createElement(
+      Icon,
+      {
+        name,
+        size,
+        tintColor: disabled ? theme.colors.textMuted : tintColor
+      }
+    )
+  );
+}
+
+// src/strings.ts
+var strings = {
+  // StorageInspector
+  noAdapterAvailable: "No storage adapter available. Install at least one of: react-native-mmkv, @react-native-async-storage/async-storage, react-native-keychain, expo-secure-store",
+  // StorageSection
+  keychainHint: "No generic password items yet. Add a key using + above, or pass keychainKeys for internet credentials.",
+  secureStoreHint: "Secure Store has no list API. Pass secureStoreKeys prop with known keys, or add a key using + above.",
+  loading: "Loading\u2026",
+  noItems: "No items",
+  valueLabel: "Value",
+  emptyValue: "(empty)",
+  charCount: (n) => n === 1 ? "1 char" : `${n} chars`,
+  deleteItemTitle: (key) => `Delete ${key}?`,
+  deleteItemMessage: (key) => `This will permanently delete the ${key} storage item. Do you wish to continue?`,
+  clearAllTitle: (name) => `Clear All ${name}?`,
+  clearAllMessage: (count, name) => `This will permanently delete all ${count} ${name} items. Do you wish to continue?`,
+  // StorageList
+  storageNotAvailable: "This storage is not available.",
+  keychainHintShort: "No items yet. Add a key below, or pass keychainKeys for internet credentials.",
+  edit: "Edit",
+  delete: "Delete",
+  addItem: "Add item",
+  // ItemForm
+  keyRequired: "Key is required",
+  saveFailed: "Save failed",
+  editItemTitle: (key) => `Edit ${key}`,
+  addItemTitle: (storageName) => `Add ${storageName} Item`,
+  storageTypeLabel: (name) => `Storage Type: ${name}`,
+  keyLabel: "Key",
+  enterKeyPlaceholder: "Enter key",
+  enterValuePlaceholder: "Enter value",
+  cancel: "Cancel",
+  saving: "Saving\u2026",
+  save: "Save",
+  add: "Add",
+  // ConfirmModal defaults
+  confirmDelete: "Yes, delete",
+  cancelKeep: "No, keep it"
+};
+
+// src/components/ItemForm.tsx
+function ItemForm({
+  visible,
+  storageName,
+  editingItem,
+  onSave,
+  onCancel
+}) {
+  const [key, setKey] = useState("");
+  const [value, setValue] = useState("");
+  const [saving, setSaving] = useState(false);
+  const [error, setError] = useState(null);
+  const isEdit = editingItem !== null;
+  useEffect(() => {
+    if (visible) {
+      setKey(editingItem?.key ?? "");
+      setValue(editingItem?.value ?? "");
+      setError(null);
+    }
+  }, [visible, editingItem]);
+  const handleSubmit = async () => {
+    const k = key.trim();
+    if (!k) {
+      setError(strings.keyRequired);
+      return;
+    }
+    setSaving(true);
+    setError(null);
+    try {
+      await onSave(k, value);
+      onCancel();
+    } catch (e) {
+      setError(e instanceof Error ? e.message : strings.saveFailed);
+    } finally {
+      setSaving(false);
+    }
+  };
+  const title = isEdit ? strings.editItemTitle(editingItem?.key ?? "") : strings.addItemTitle(storageName);
+  return /* @__PURE__ */ React6.createElement(Modal, { visible, transparent: true, animationType: "slide", onRequestClose: onCancel }, /* @__PURE__ */ React6.createElement(View, { style: styles2.formOverlay }, /* @__PURE__ */ React6.createElement(
+    TouchableOpacity,
+    {
+      style: { flex: 1, width: "100%" },
+      activeOpacity: 1,
+      onPress: onCancel
+    }
+  ), /* @__PURE__ */ React6.createElement(View, { style: styles2.formModal }, /* @__PURE__ */ React6.createElement(View, { style: styles2.formHeader }, /* @__PURE__ */ React6.createElement(Text, { style: styles2.formTitle, numberOfLines: 1 }, title), /* @__PURE__ */ React6.createElement(
+    IconButton,
+    {
+      name: "close",
+      onPress: onCancel,
+      size: 24,
+      tintColor: theme.colors.textSecondary,
+      style: styles2.formCloseButton,
+      hitSlop: LAYOUT.hitSlopLarge
+    }
+  )), /* @__PURE__ */ React6.createElement(Text, { style: styles2.formStorageType }, strings.storageTypeLabel(storageName)), /* @__PURE__ */ React6.createElement(Text, { style: styles2.formLabel }, strings.keyLabel), /* @__PURE__ */ React6.createElement(
+    TextInput,
+    {
+      style: [styles2.formInput, isEdit && styles2.formInputDisabled],
+      value: key,
+      onChangeText: setKey,
+      placeholder: strings.enterKeyPlaceholder,
+      placeholderTextColor: theme.colors.textMuted,
+      editable: !isEdit,
+      autoCapitalize: "none",
+      multiline: true
+    }
+  ), /* @__PURE__ */ React6.createElement(Text, { style: styles2.formLabel }, strings.valueLabel), /* @__PURE__ */ React6.createElement(
+    TextInput,
+    {
+      style: styles2.formInput,
+      value,
+      onChangeText: setValue,
+      placeholder: strings.enterValuePlaceholder,
+      placeholderTextColor: theme.colors.textMuted,
+      multiline: true,
+      numberOfLines: 3
+    }
+  ), error ? /* @__PURE__ */ React6.createElement(Text, { style: [styles2.errorText, { marginBottom: 12 }] }, error) : null, /* @__PURE__ */ React6.createElement(View, { style: styles2.formActions }, /* @__PURE__ */ React6.createElement(
+    TouchableOpacity,
+    {
+      style: [styles2.formButton, styles2.formButtonCancel],
+      onPress: onCancel,
+      disabled: saving
+    },
+    /* @__PURE__ */ React6.createElement(Text, { style: [styles2.formButtonText, styles2.formButtonTextCancel] }, strings.cancel)
+  ), /* @__PURE__ */ React6.createElement(
+    TouchableOpacity,
+    {
+      style: [styles2.formButton, styles2.formButtonSubmit],
+      onPress: handleSubmit,
+      disabled: saving
+    },
+    /* @__PURE__ */ React6.createElement(Text, { style: [styles2.formButtonText, styles2.formButtonTextSubmit] }, saving ? strings.saving : isEdit ? strings.save : strings.add)
+  )))));
+}
+function ConfirmModal({
+  visible,
+  title,
+  message,
+  confirmLabel = strings.confirmDelete,
+  cancelLabel = strings.cancelKeep,
+  danger = true,
+  onConfirm,
+  onCancel
+}) {
+  const handleConfirm = () => {
+    void Promise.resolve(onConfirm());
+  };
+  return /* @__PURE__ */ React6.createElement(Modal, { visible, transparent: true, animationType: "slide", onRequestClose: onCancel }, /* @__PURE__ */ React6.createElement(View, { style: styles2.confirmOverlay }, /* @__PURE__ */ React6.createElement(
+    TouchableOpacity,
+    {
+      style: { flex: 1, width: "100%" },
+      activeOpacity: 1,
+      onPress: onCancel
+    }
+  ), /* @__PURE__ */ React6.createElement(View, { style: styles2.confirmModal }, /* @__PURE__ */ React6.createElement(View, { style: styles2.confirmHeader }, /* @__PURE__ */ React6.createElement(Text, { style: styles2.confirmTitle }, title), /* @__PURE__ */ React6.createElement(
+    IconButton,
+    {
+      name: "close",
+      onPress: onCancel,
+      size: 24,
+      tintColor: theme.colors.textSecondary,
+      style: styles2.formCloseButton,
+      hitSlop: LAYOUT.hitSlopLarge
+    }
+  )), /* @__PURE__ */ React6.createElement(Text, { style: styles2.confirmMessage }, message), /* @__PURE__ */ React6.createElement(View, { style: styles2.confirmActions }, /* @__PURE__ */ React6.createElement(
+    TouchableOpacity,
+    {
+      style: [styles2.confirmButton, styles2.confirmButtonSecondary],
+      onPress: onCancel
+    },
+    /* @__PURE__ */ React6.createElement(Text, { style: [styles2.confirmButtonText, styles2.confirmButtonTextSecondary] }, cancelLabel)
+  ), /* @__PURE__ */ React6.createElement(
+    TouchableOpacity,
+    {
+      style: [
+        styles2.confirmButton,
+        danger ? styles2.confirmButtonDanger : styles2.formButtonSubmit
+      ],
+      onPress: handleConfirm
+    },
+    /* @__PURE__ */ React6.createElement(
+      Text,
+      {
+        style: [
+          styles2.confirmButtonText,
+          danger ? styles2.confirmButtonTextDanger : styles2.formButtonTextSubmit
+        ]
+      },
+      confirmLabel
+    )
+  )))));
+}
+function ItemRowActions({
+  item,
+  onCopy,
+  onEdit,
+  onDelete,
+  showChevron = false,
+  chevronDirection = "down"
+}) {
+  return /* @__PURE__ */ React6.createElement(View, { style: styles2.itemRowActions }, /* @__PURE__ */ React6.createElement(IconButton, { name: "copy", onPress: () => onCopy(item) }), /* @__PURE__ */ React6.createElement(IconButton, { name: "edit", onPress: () => onEdit(item) }), /* @__PURE__ */ React6.createElement(IconButton, { name: "trash", onPress: () => onDelete(item) }), showChevron && /* @__PURE__ */ React6.createElement(View, { style: styles2.iconSlot }, /* @__PURE__ */ React6.createElement(
+    Icon,
+    {
+      name: chevronDirection === "up" ? "chevronUp" : "chevronDown",
+      size: LAYOUT.chevronSize,
+      tintColor: theme.colors.text
+    }
+  )));
+}
+
+// src/components/StorageSection.tsx
+function StorageSection({
+  adapter,
+  keychainKeys,
+  onKeychainKeyAdded,
+  onSecureStoreKeyAdded,
+  defaultExpanded = true,
+  expanded: expandedProp,
+  onToggleExpanded,
+  refreshTrigger
+}) {
+  const { items, loading, error, refresh } = useStorageItems(adapter);
+  const [expandedInternal, setExpandedInternal] = useState(defaultExpanded);
+  const expanded = expandedProp !== void 0 ? expandedProp : expandedInternal;
+  const handleToggleExpanded = () => {
+    if (onToggleExpanded) onToggleExpanded();
+    else setExpandedInternal((p) => !p);
+  };
+  useEffect(() => {
+    if (refreshTrigger !== void 0) refresh();
+  }, [refreshTrigger, refresh]);
+  const [expandedKeys, setExpandedKeys] = useState(/* @__PURE__ */ new Set());
+  const [formVisible, setFormVisible] = useState(false);
+  const [editingItem, setEditingItem] = useState(null);
+  const [deleteItem, setDeleteItem] = useState(null);
+  const [clearAllVisible, setClearAllVisible] = useState(false);
+  const handleAdd = () => {
+    setEditingItem(null);
+    setFormVisible(true);
+  };
+  const handleEdit = (item) => {
+    setEditingItem(item);
+    setFormVisible(true);
+  };
+  const handleSave = async (key, value) => {
+    const isNewKey = !editingItem || editingItem.key !== key;
+    await adapter.setItem(key, value);
+    if (adapter.type === "keychain" && isNewKey) {
+      onKeychainKeyAdded?.(key);
+    }
+    if (adapter.type === "expo-secure-store" && isNewKey) {
+      onSecureStoreKeyAdded?.(key);
+    }
+    await refresh();
+  };
+  const handleDeleteItem = async () => {
+    if (deleteItem) {
+      await adapter.removeItem(deleteItem.key);
+      setDeleteItem(null);
+      await refresh();
+    }
+  };
+  const handleClearAll = async () => {
+    for (const item of items) {
+      await adapter.removeItem(item.key);
+    }
+    setClearAllVisible(false);
+    await refresh();
+  };
+  const handleCopy = async (item) => {
+    try {
+      await Share.share({
+        message: item.value,
+        title: item.key
+      });
+    } catch {
+    }
+  };
+  const isKeychain = adapter.type === "keychain";
+  const isSecureStore = adapter.type === "expo-secure-store";
+  const showKeychainHint = isKeychain && items.length === 0 && (keychainKeys?.length ?? 0) === 0;
+  const showSecureStoreHint = isSecureStore && items.length === 0;
+  if (!adapter.isAvailable()) return null;
+  return /* @__PURE__ */ React6.createElement(React6.Fragment, null, /* @__PURE__ */ React6.createElement(
+    TouchableOpacity,
+    {
+      style: styles2.sectionHeader,
+      onPress: handleToggleExpanded,
+      activeOpacity: 0.7
+    },
+    /* @__PURE__ */ React6.createElement(View, { style: styles2.sectionHeaderLabelWrap }, /* @__PURE__ */ React6.createElement(Text, { style: styles2.sectionHeaderLabel }, adapter.name, /* @__PURE__ */ React6.createElement(Text, { style: styles2.sectionHeaderCount }, " (", items.length, ")"))),
+    /* @__PURE__ */ React6.createElement(View, { style: styles2.storageRowActions }, /* @__PURE__ */ React6.createElement(IconButton, { name: "plus", onPress: handleAdd }), /* @__PURE__ */ React6.createElement(
+      IconButton,
+      {
+        name: "trash",
+        onPress: () => items.length > 0 && setClearAllVisible(true),
+        disabled: items.length === 0
+      }
+    ), /* @__PURE__ */ React6.createElement(View, { style: styles2.iconSlot }, /* @__PURE__ */ React6.createElement(
+      Icon,
+      {
+        name: expanded ? "chevronUp" : "chevronDown",
+        size: LAYOUT.chevronSize,
+        tintColor: theme.colors.text
+      }
+    )))
+  ), expanded && /* @__PURE__ */ React6.createElement(React6.Fragment, null, showKeychainHint ? /* @__PURE__ */ React6.createElement(View, { style: styles2.keychainHint }, /* @__PURE__ */ React6.createElement(Text, { style: styles2.keychainHintText }, strings.keychainHint)) : null, showSecureStoreHint ? /* @__PURE__ */ React6.createElement(View, { style: styles2.keychainHint }, /* @__PURE__ */ React6.createElement(Text, { style: styles2.keychainHintText }, strings.secureStoreHint)) : null, error ? /* @__PURE__ */ React6.createElement(View, { style: styles2.error }, /* @__PURE__ */ React6.createElement(Text, { style: styles2.errorText }, error)) : null, loading ? /* @__PURE__ */ React6.createElement(View, { style: styles2.loading }, /* @__PURE__ */ React6.createElement(Text, { style: styles2.loadingText }, strings.loading)) : items.map((item) => {
+    const isItemExpanded = expandedKeys.has(item.key);
+    const charCount = item.value.length;
+    const toggleItemExpanded = () => {
+      setExpandedKeys((prev) => {
+        const next = new Set(prev);
+        if (next.has(item.key)) next.delete(item.key);
+        else next.add(item.key);
+        return next;
+      });
+    };
+    return /* @__PURE__ */ React6.createElement(
+      TouchableOpacity,
+      {
+        key: item.key,
+        style: styles2.itemRow,
+        onPress: toggleItemExpanded,
+        activeOpacity: 0.7
+      },
+      /* @__PURE__ */ React6.createElement(View, { style: styles2.itemRowCollapsed }, /* @__PURE__ */ React6.createElement(View, { style: { flex: 1 } }, /* @__PURE__ */ React6.createElement(Text, { style: styles2.itemKey, numberOfLines: 1 }, item.key), /* @__PURE__ */ React6.createElement(Text, { style: styles2.itemChars }, strings.charCount(charCount))), !isItemExpanded ? /* @__PURE__ */ React6.createElement(
+        ItemRowActions,
+        {
+          item,
+          onCopy: handleCopy,
+          onEdit: handleEdit,
+          onDelete: setDeleteItem,
+          showChevron: true,
+          chevronDirection: "down"
+        }
+      ) : /* @__PURE__ */ React6.createElement(View, { style: styles2.iconSlot }, /* @__PURE__ */ React6.createElement(
+        Icon,
+        {
+          name: "chevronUp",
+          size: LAYOUT.chevronSize,
+          tintColor: theme.colors.text
+        }
+      ))),
+      isItemExpanded && /* @__PURE__ */ React6.createElement(View, { style: styles2.itemRowExpanded }, /* @__PURE__ */ React6.createElement(View, { style: styles2.valueBox }, /* @__PURE__ */ React6.createElement(Text, { style: styles2.valueBoxLabel }, strings.valueLabel), /* @__PURE__ */ React6.createElement(Text, { style: styles2.valueBoxText, selectable: true }, item.value || strings.emptyValue)), /* @__PURE__ */ React6.createElement(
+        ItemRowActions,
+        {
+          item,
+          onCopy: handleCopy,
+          onEdit: handleEdit,
+          onDelete: setDeleteItem
+        }
+      ))
+    );
+  }), !loading && items.length === 0 && !showKeychainHint && !showSecureStoreHint ? /* @__PURE__ */ React6.createElement(View, { style: styles2.empty }, /* @__PURE__ */ React6.createElement(Text, { style: styles2.emptyText }, strings.noItems)) : null), /* @__PURE__ */ React6.createElement(
+    ItemForm,
+    {
+      visible: formVisible,
+      storageName: adapter.name,
+      editingItem,
+      onSave: handleSave,
+      onCancel: () => {
+        setFormVisible(false);
+        setEditingItem(null);
+      }
+    }
+  ), /* @__PURE__ */ React6.createElement(
+    ConfirmModal,
+    {
+      visible: deleteItem !== null,
+      title: strings.deleteItemTitle(deleteItem?.key ?? ""),
+      message: strings.deleteItemMessage(deleteItem?.key ?? ""),
+      onConfirm: handleDeleteItem,
+      onCancel: () => setDeleteItem(null)
+    }
+  ), /* @__PURE__ */ React6.createElement(
+    ConfirmModal,
+    {
+      visible: clearAllVisible,
+      title: strings.clearAllTitle(adapter.name),
+      message: strings.clearAllMessage(items.length, adapter.name),
+      onConfirm: handleClearAll,
+      onCancel: () => setClearAllVisible(false)
+    }
+  ));
+}
+
+// src/components/StorageInspector.tsx
+function StorageInspector({
+  mmkvInstances = [],
+  keychainKeys: keychainKeysProp,
+  secureStoreKeys: secureStoreKeysProp,
+  customAdapters = []
+}) {
+  const [keychainKeysAdded, setKeychainKeysAdded] = useState([]);
+  const [secureStoreKeysAdded, setSecureStoreKeysAdded] = useState([]);
+  const [refreshKey, setRefreshKey] = useState(0);
+  const [refreshing, setRefreshing] = useState(false);
+  const [expandedIndices, setExpandedIndices] = useState(() => /* @__PURE__ */ new Set([0]));
+  const keychainKeys = useMemo(
+    () => [...keychainKeysProp ?? [], ...keychainKeysAdded],
+    [keychainKeysProp, keychainKeysAdded]
+  );
+  const secureStoreKeys = useMemo(
+    () => [...secureStoreKeysProp ?? [], ...secureStoreKeysAdded],
+    [secureStoreKeysProp, secureStoreKeysAdded]
+  );
+  const adapters = useMemo(() => {
+    const list = [];
+    mmkvInstances.forEach((inst, i) => {
+      list.push(
+        createMMKVAdapter(inst, mmkvInstances.length > 1 ? `MMKV ${i + 1}` : "MMKV")
+      );
+    });
+    const asyncAdapter = createAsyncStorageAdapter();
+    if (asyncAdapter.isAvailable()) list.push(asyncAdapter);
+    const keychainAdapter = createKeychainAdapter(keychainKeys);
+    if (keychainAdapter.isAvailable()) list.push(keychainAdapter);
+    const secureStoreAdapter = createSecureStoreAdapter(secureStoreKeys);
+    if (secureStoreAdapter.isAvailable()) list.push(secureStoreAdapter);
+    list.push(...customAdapters);
+    return list;
+  }, [mmkvInstances, keychainKeys, secureStoreKeys, customAdapters]);
+  const handleKeychainKeyAdded = (key) => {
+    setKeychainKeysAdded(
+      (prev) => prev.includes(key) ? prev : [...prev, key]
+    );
+  };
+  const handleSecureStoreKeyAdded = (key) => {
+    setSecureStoreKeysAdded(
+      (prev) => prev.includes(key) ? prev : [...prev, key]
+    );
+  };
+  const handleRefresh = () => {
+    setRefreshing(true);
+    setRefreshKey((k) => k + 1);
+    setTimeout(() => setRefreshing(false), 400);
+  };
+  return /* @__PURE__ */ React6.createElement(View, { style: styles2.container }, /* @__PURE__ */ React6.createElement(View, { style: styles2.content }, adapters.length > 0 ? /* @__PURE__ */ React6.createElement(React6.Fragment, null, /* @__PURE__ */ React6.createElement(
+    ScrollView,
+    {
+      style: styles2.scroll,
+      contentContainerStyle: styles2.scrollContent,
+      keyboardShouldPersistTaps: "handled",
+      showsVerticalScrollIndicator: true,
+      refreshControl: /* @__PURE__ */ React6.createElement(RefreshControl, { refreshing, onRefresh: handleRefresh })
+    },
+    adapters.map((adapter, index) => /* @__PURE__ */ React6.createElement(
+      StorageSection,
+      {
+        key: `${adapter.type}-${index}`,
+        adapter,
+        keychainKeys: keychainKeysProp,
+        onKeychainKeyAdded: handleKeychainKeyAdded,
+        onSecureStoreKeyAdded: handleSecureStoreKeyAdded,
+        expanded: expandedIndices.has(index),
+        onToggleExpanded: () => {
+          setExpandedIndices((prev) => {
+            const next = new Set(prev);
+            if (next.has(index)) next.delete(index);
+            else next.add(index);
+            return next;
+          });
+        },
+        refreshTrigger: refreshKey
+      }
+    ))
+  ), /* @__PURE__ */ React6.createElement(
+    IconButton,
+    {
+      name: "refresh",
+      onPress: handleRefresh,
+      size: 24,
+      tintColor: theme.colors.inverted,
+      style: styles2.fab,
+      activeOpacity: 0.85
+    }
+  )) : /* @__PURE__ */ React6.createElement(View, { style: styles2.empty }, /* @__PURE__ */ React6.createElement(Text, { style: styles2.emptyText }, strings.noAdapterAvailable))));
+}
+
+export { StorageInspector, createAsyncStorageAdapter, createKeychainAdapter, createMMKVAdapter, createSecureStoreAdapter, strings, theme };
+//# sourceMappingURL=index.mjs.map
+//# sourceMappingURL=index.mjs.map