@buoy-gg/storage 7.0.40 → 7.0.42

package/lib/module/storage/components/MMKVInstanceInfoPanel.js

@@ -1,253 +1 @@
-"use strict";
-
-/**
- * MMKVInstanceInfoPanel Component
- *
- * Displays detailed information about a selected MMKV instance:
- * - Instance ID and path
- * - Encryption status
- * - Read-only status
- * - Key count
- * - Size (if available)
- *
- * Used in GameUIStorageBrowser below the instance selector.
- */
-
-import { View, Text, StyleSheet } from 'react-native';
-import { macOSColors, night, monoFont } from '@buoy-gg/shared-ui';
-import { useMMKVInstance } from '../hooks/useMMKVInstances';
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-/**
- * MMKV Instance Info Panel
- *
- * Shows metadata and statistics for a selected MMKV instance.
- *
- * @example
- * ```typescript
- * function MyStorageUI() {
- *   const [selectedInstance, setSelectedInstance] = useState('mmkv.default');
- *
- *   return (
- *     <View>
- *       <MMKVInstanceSelector
- *         selectedInstanceId={selectedInstance}
- *         onSelectInstance={setSelectedInstance}
- *       />
- *       {selectedInstance && (
- *         <MMKVInstanceInfoPanel instanceId={selectedInstance} />
- *       )}
- *     </View>
- *   );
- * }
- * ```
- */
-export function MMKVInstanceInfoPanel({
-  instanceId
-}) {
-  const instance = useMMKVInstance(instanceId);
-  if (!instance) {
-    return /*#__PURE__*/_jsx(View, {
-      style: styles.container,
-      children: /*#__PURE__*/_jsx(View, {
-        style: styles.errorState,
-        children: /*#__PURE__*/_jsxs(Text, {
-          style: styles.errorText,
-          children: ["Instance not found: ", instanceId]
-        })
-      })
-    });
-  }
-  return /*#__PURE__*/_jsx(View, {
-    style: styles.container,
-    children: /*#__PURE__*/_jsxs(View, {
-      style: styles.panel,
-      children: [/*#__PURE__*/_jsx(View, {
-        style: styles.header,
-        children: /*#__PURE__*/_jsx(Text, {
-          style: styles.headerTitle,
-          children: "Instance Details"
-        })
-      }), /*#__PURE__*/_jsxs(View, {
-        style: styles.infoGrid,
-        children: [/*#__PURE__*/_jsx(InfoItem, {
-          label: "Instance ID",
-          value: instance.id,
-          valueStyle: styles.monoValue
-        }), /*#__PURE__*/_jsx(InfoItem, {
-          label: "Keys",
-          value: `${instance.keyCount} ${instance.keyCount === 1 ? 'key' : 'keys'}`,
-          highlight: true
-        }), /*#__PURE__*/_jsx(InfoItem, {
-          label: "Encryption",
-          value: instance.encrypted ? '🔒 Encrypted' : '🔓 Not encrypted',
-          valueColor: instance.encrypted ? macOSColors.semantic.success : night.color.textTertiary
-        }), /*#__PURE__*/_jsx(InfoItem, {
-          label: "Access",
-          value: instance.readOnly ? '👁️ Read-only' : '✏️ Read-write',
-          valueColor: instance.readOnly ? macOSColors.semantic.warning : night.color.textTertiary
-        }), instance.size !== undefined && /*#__PURE__*/_jsx(InfoItem, {
-          label: "Size",
-          value: formatBytes(instance.size),
-          valueStyle: styles.monoValue
-        })]
-      }), instance.encrypted && /*#__PURE__*/_jsxs(View, {
-        style: styles.notice,
-        children: [/*#__PURE__*/_jsx(Text, {
-          style: styles.noticeIcon,
-          children: "\uD83D\uDD12"
-        }), /*#__PURE__*/_jsx(Text, {
-          style: styles.noticeText,
-          children: "This instance is encrypted. Values are protected at rest."
-        })]
-      }), instance.readOnly && /*#__PURE__*/_jsxs(View, {
-        style: [styles.notice, styles.noticeWarning],
-        children: [/*#__PURE__*/_jsx(Text, {
-          style: styles.noticeIcon,
-          children: "\uD83D\uDC41\uFE0F"
-        }), /*#__PURE__*/_jsx(Text, {
-          style: [styles.noticeText, styles.noticeTextWarning],
-          children: "Read-only mode. Cannot modify values in this instance."
-        })]
-      })]
-    })
-  });
-}
-
-/**
- * InfoItem Component - Displays a label-value pair
- */
-function InfoItem({
-  label,
-  value,
-  valueStyle,
-  valueColor,
-  highlight
-}) {
-  return /*#__PURE__*/_jsxs(View, {
-    style: styles.infoItem,
-    children: [/*#__PURE__*/_jsx(Text, {
-      style: styles.infoLabel,
-      children: label
-    }), /*#__PURE__*/_jsx(Text, {
-      style: [styles.infoValue, valueStyle, valueColor && {
-        color: valueColor
-      }, highlight && styles.infoValueHighlight],
-      children: value
-    })]
-  });
-}
-
-/**
- * Format bytes to human-readable string
- */
-function formatBytes(bytes) {
-  if (bytes === 0) return '0 Bytes';
-  const k = 1024;
-  const sizes = ['Bytes', 'KB', 'MB', 'GB'];
-  const i = Math.floor(Math.log(bytes) / Math.log(k));
-  return `${parseFloat((bytes / Math.pow(k, i)).toFixed(2))} ${sizes[i]}`;
-}
-const styles = StyleSheet.create({
-  container: {
-    marginBottom: 12
-  },
-  // Error state
-  errorState: {
-    backgroundColor: macOSColors.semantic.error + '15',
-    borderRadius: 12,
-    padding: 12,
-    borderWidth: 1,
-    borderColor: macOSColors.semantic.error + '40'
-  },
-  errorText: {
-    fontSize: 12,
-    color: macOSColors.semantic.error,
-    textAlign: 'center'
-  },
-  // Panel
-  panel: {
-    backgroundColor: night.color.surface,
-    borderRadius: 12,
-    borderWidth: 1,
-    borderColor: night.color.border,
-    overflow: 'hidden',
-    shadowColor: '#000000',
-    shadowOpacity: 0.03,
-    shadowRadius: 8,
-    shadowOffset: {
-      width: 0,
-      height: 2
-    }
-  },
-  // Header
-  header: {
-    padding: 12,
-    borderBottomWidth: 1,
-    borderBottomColor: night.color.separator
-  },
-  headerTitle: {
-    fontSize: 11,
-    fontWeight: '600',
-    color: night.color.text,
-    textTransform: "uppercase",
-    letterSpacing: 0.5
-  },
-  // Info grid
-  infoGrid: {
-    padding: 12,
-    gap: 10
-  },
-  infoItem: {
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    alignItems: 'center',
-    paddingVertical: 4
-  },
-  infoLabel: {
-    fontSize: 12,
-    color: night.color.textTertiary,
-    fontWeight: '500'
-  },
-  infoValue: {
-    fontSize: 12,
-    color: night.color.text,
-    fontWeight: '500'
-  },
-  infoValueHighlight: {
-    fontSize: 14,
-    fontWeight: '600',
-    color: night.color.accent
-  },
-  monoValue: {
-    fontFamily: monoFont
-  },
-  // Notices
-  notice: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    gap: 8,
-    padding: 10,
-    margin: 12,
-    marginTop: 0,
-    backgroundColor: macOSColors.semantic.success + '10',
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: macOSColors.semantic.success + '30'
-  },
-  noticeWarning: {
-    backgroundColor: macOSColors.semantic.warning + '10',
-    borderColor: macOSColors.semantic.warning + '30'
-  },
-  noticeIcon: {
-    fontSize: 14
-  },
-  noticeText: {
-    flex: 1,
-    fontSize: 11,
-    color: macOSColors.semantic.success,
-    lineHeight: 16
-  },
-  noticeTextWarning: {
-    color: macOSColors.semantic.warning
-  }
-});
+"use strict";import{View as r,Text as a,StyleSheet as f}from"react-native";import{macOSColors as n,night as i,monoFont as y}from"@buoy-gg/shared-ui";import{useMMKVInstance as g}from"../hooks/useMMKVInstances";import{jsxs as c,jsx as t}from"react/jsx-runtime";export function MMKVInstanceInfoPanel({instanceId:l}){const o=g(l);if(!o){return t(r,{style:e.container,children:t(r,{style:e.errorState,children:c(a,{style:e.errorText,children:["Instance not found: ",l]})})})}return t(r,{style:e.container,children:c(r,{style:e.panel,children:[t(r,{style:e.header,children:t(a,{style:e.headerTitle,children:"Instance Details"})}),c(r,{style:e.infoGrid,children:[t(d,{label:"Instance ID",value:o.id,valueStyle:e.monoValue}),t(d,{label:"Keys",value:`${o.keyCount} ${o.keyCount===1?"key":"keys"}`,highlight:true}),t(d,{label:"Encryption",value:o.encrypted?"\u{1F512} Encrypted":"\u{1F513} Not encrypted",valueColor:o.encrypted?n.semantic.success:i.color.textTertiary}),t(d,{label:"Access",value:o.readOnly?"\u{1F441}\uFE0F Read-only":"\u270F\uFE0F Read-write",valueColor:o.readOnly?n.semantic.warning:i.color.textTertiary}),o.size!==void 0&&t(d,{label:"Size",value:m(o.size),valueStyle:e.monoValue})]}),o.encrypted&&c(r,{style:e.notice,children:[t(a,{style:e.noticeIcon,children:"\u{1F512}"}),t(a,{style:e.noticeText,children:"This instance is encrypted. Values are protected at rest."})]}),o.readOnly&&c(r,{style:[e.notice,e.noticeWarning],children:[t(a,{style:e.noticeIcon,children:"\u{1F441}\uFE0F"}),t(a,{style:[e.noticeText,e.noticeTextWarning],children:"Read-only mode. Cannot modify values in this instance."})]})]})})}function d({label:l,value:o,valueStyle:h,valueColor:s,highlight:u}){return c(r,{style:e.infoItem,children:[t(a,{style:e.infoLabel,children:l}),t(a,{style:[e.infoValue,h,s&&{color:s},u&&e.infoValueHighlight],children:o})]})}function m(l){if(l===0)return"0 Bytes";const o=1024;const h=["Bytes","KB","MB","GB"];const s=Math.floor(Math.log(l)/Math.log(o));return`${parseFloat((l/Math.pow(o,s)).toFixed(2))} ${h[s]}`}const e=f.create({container:{marginBottom:12},errorState:{backgroundColor:n.semantic.error+"15",borderRadius:12,padding:12,borderWidth:1,borderColor:n.semantic.error+"40"},errorText:{fontSize:12,color:n.semantic.error,textAlign:"center"},panel:{backgroundColor:i.color.surface,borderRadius:12,borderWidth:1,borderColor:i.color.border,overflow:"hidden",shadowColor:"#000000",shadowOpacity:.03,shadowRadius:8,shadowOffset:{width:0,height:2}},header:{padding:12,borderBottomWidth:1,borderBottomColor:i.color.separator},headerTitle:{fontSize:11,fontWeight:"600",color:i.color.text,textTransform:"uppercase",letterSpacing:.5},infoGrid:{padding:12,gap:10},infoItem:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",paddingVertical:4},infoLabel:{fontSize:12,color:i.color.textTertiary,fontWeight:"500"},infoValue:{fontSize:12,color:i.color.text,fontWeight:"500"},infoValueHighlight:{fontSize:14,fontWeight:"600",color:i.color.accent},monoValue:{fontFamily:y},notice:{flexDirection:"row",alignItems:"center",gap:8,padding:10,margin:12,marginTop:0,backgroundColor:n.semantic.success+"10",borderRadius:8,borderWidth:1,borderColor:n.semantic.success+"30"},noticeWarning:{backgroundColor:n.semantic.warning+"10",borderColor:n.semantic.warning+"30"},noticeIcon:{fontSize:14},noticeText:{flex:1,fontSize:11,color:n.semantic.success,lineHeight:16},noticeTextWarning:{color:n.semantic.warning}});

package/lib/module/storage/components/MMKVInstanceSelector.js

@@ -1,414 +1 @@
-"use strict";
-
-/**
- * MMKVInstanceSelector Component
- *
- * Dropdown selector for choosing between multiple MMKV instances.
- * Shows instance ID, key count, and metadata badges (encrypted, read-only).
- *
- * Used in GameUIStorageBrowser when storage type filter is set to "mmkv".
- */
-
-import { useState } from 'react';
-import { View, Text, StyleSheet, TouchableOpacity, ScrollView, Modal } from 'react-native';
-import { macOSColors, night, monoFont } from '@buoy-gg/shared-ui';
-import { useMMKVInstances } from '../hooks/useMMKVInstances';
-import { isMMKVAvailable, getMMKVUnavailableMessage } from '../utils/mmkvAvailability';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/**
- * MMKV Instance Selector Component
- *
- * Displays a dropdown to select between registered MMKV instances.
- *
- * @example
- * ```typescript
- * function MyStorageUI() {
- *   const [selectedInstance, setSelectedInstance] = useState('mmkv.default');
- *
- *   return (
- *     <MMKVInstanceSelector
- *       selectedInstanceId={selectedInstance}
- *       onSelectInstance={setSelectedInstance}
- *     />
- *   );
- * }
- * ```
- */
-export function MMKVInstanceSelector({
-  selectedInstanceId,
-  onSelectInstance,
-  showRefreshButton = true
-}) {
-  const [isDropdownOpen, setIsDropdownOpen] = useState(false);
-  const {
-    instances,
-    instanceCount,
-    refresh
-  } = useMMKVInstances(false);
-
-  // Find the selected instance
-  const selectedInstance = instances.find(inst => inst.id === selectedInstanceId);
-
-  // Handle instance selection
-  const handleSelectInstance = instanceId => {
-    onSelectInstance(instanceId);
-    setIsDropdownOpen(false);
-  };
-
-  // If MMKV is not available, show unavailable message
-  if (!isMMKVAvailable()) {
-    return /*#__PURE__*/_jsx(View, {
-      style: styles.container,
-      children: /*#__PURE__*/_jsxs(View, {
-        style: styles.unavailableState,
-        children: [/*#__PURE__*/_jsx(Text, {
-          style: styles.unavailableTitle,
-          children: "MMKV Not Available"
-        }), /*#__PURE__*/_jsx(Text, {
-          style: styles.unavailableDescription,
-          children: getMMKVUnavailableMessage()
-        })]
-      })
-    });
-  }
-
-  // If no instances registered, show message
-  if (instanceCount === 0) {
-    return /*#__PURE__*/_jsx(View, {
-      style: styles.container,
-      children: /*#__PURE__*/_jsxs(View, {
-        style: styles.emptyState,
-        children: [/*#__PURE__*/_jsx(Text, {
-          style: styles.emptyStateTitle,
-          children: "No MMKV Instances Registered"
-        }), /*#__PURE__*/_jsx(Text, {
-          style: styles.emptyStateDescription,
-          children: "Register MMKV instances using registerMMKVInstance() to monitor them in dev tools."
-        }), showRefreshButton && /*#__PURE__*/_jsx(TouchableOpacity, {
-          style: styles.refreshButton,
-          onPress: refresh,
-          activeOpacity: 0.7,
-          children: /*#__PURE__*/_jsx(Text, {
-            style: styles.refreshButtonText,
-            children: "\u21BB Refresh"
-          })
-        })]
-      })
-    });
-  }
-  return /*#__PURE__*/_jsxs(View, {
-    style: styles.container,
-    children: [/*#__PURE__*/_jsxs(TouchableOpacity, {
-      style: styles.selectorButton,
-      onPress: () => setIsDropdownOpen(true),
-      activeOpacity: 0.7,
-      children: [/*#__PURE__*/_jsx(View, {
-        style: styles.selectorContent,
-        children: selectedInstance ? /*#__PURE__*/_jsx(InstanceRow, {
-          instance: selectedInstance,
-          isSelected: true
-        }) : /*#__PURE__*/_jsx(Text, {
-          style: styles.placeholderText,
-          children: "Select MMKV Instance"
-        })
-      }), /*#__PURE__*/_jsx(Text, {
-        style: styles.dropdownArrow,
-        children: "\u25BC"
-      })]
-    }), /*#__PURE__*/_jsx(Modal, {
-      visible: isDropdownOpen,
-      transparent: true,
-      animationType: "fade",
-      onRequestClose: () => setIsDropdownOpen(false),
-      children: /*#__PURE__*/_jsx(TouchableOpacity, {
-        style: styles.modalOverlay,
-        activeOpacity: 1,
-        onPress: () => setIsDropdownOpen(false),
-        children: /*#__PURE__*/_jsxs(View, {
-          style: styles.dropdownContainer,
-          children: [/*#__PURE__*/_jsxs(View, {
-            style: styles.dropdownHeader,
-            children: [/*#__PURE__*/_jsxs(Text, {
-              style: styles.dropdownTitle,
-              children: ["Select MMKV Instance (", instanceCount, ")"]
-            }), showRefreshButton && /*#__PURE__*/_jsx(TouchableOpacity, {
-              style: styles.headerRefreshButton,
-              onPress: refresh,
-              activeOpacity: 0.7,
-              children: /*#__PURE__*/_jsx(Text, {
-                style: styles.headerRefreshText,
-                children: "\u21BB"
-              })
-            })]
-          }), /*#__PURE__*/_jsx(ScrollView, {
-            style: styles.dropdownList,
-            children: instances.map(instance => /*#__PURE__*/_jsx(TouchableOpacity, {
-              style: [styles.dropdownItem, instance.id === selectedInstanceId && styles.dropdownItemSelected],
-              onPress: () => handleSelectInstance(instance.id),
-              activeOpacity: 0.7,
-              children: /*#__PURE__*/_jsx(InstanceRow, {
-                instance: instance,
-                isSelected: instance.id === selectedInstanceId
-              })
-            }, instance.id))
-          })]
-        })
-      })
-    })]
-  });
-}
-
-/**
- * Instance Row Component
- *
- * Displays a single MMKV instance with its metadata.
- */
-function InstanceRow({
-  instance,
-  isSelected
-}) {
-  return /*#__PURE__*/_jsxs(View, {
-    style: styles.instanceRow,
-    children: [/*#__PURE__*/_jsxs(View, {
-      style: styles.instanceLeft,
-      children: [/*#__PURE__*/_jsx(Text, {
-        style: [styles.instanceId, isSelected && styles.instanceIdSelected],
-        numberOfLines: 1,
-        children: instance.id
-      }), /*#__PURE__*/_jsxs(View, {
-        style: styles.instanceBadges,
-        children: [instance.encrypted && /*#__PURE__*/_jsx(View, {
-          style: [styles.badge, styles.badgeEncrypted],
-          children: /*#__PURE__*/_jsx(Text, {
-            style: styles.badgeText,
-            children: "\uD83D\uDD12 Encrypted"
-          })
-        }), instance.readOnly && /*#__PURE__*/_jsx(View, {
-          style: [styles.badge, styles.badgeReadOnly],
-          children: /*#__PURE__*/_jsx(Text, {
-            style: styles.badgeText,
-            children: "\uD83D\uDC41\uFE0F Read-only"
-          })
-        })]
-      })]
-    }), /*#__PURE__*/_jsxs(View, {
-      style: styles.instanceRight,
-      children: [/*#__PURE__*/_jsx(Text, {
-        style: styles.keyCount,
-        children: instance.keyCount
-      }), /*#__PURE__*/_jsx(Text, {
-        style: styles.keyCountLabel,
-        children: "keys"
-      })]
-    })]
-  });
-}
-const styles = StyleSheet.create({
-  container: {
-    marginBottom: 12
-  },
-  // Unavailable state
-  unavailableState: {
-    backgroundColor: macOSColors.semantic.warning + '15',
-    borderRadius: 12,
-    padding: 20,
-    borderWidth: 1,
-    borderColor: macOSColors.semantic.warning + '40',
-    alignItems: 'center',
-    gap: 12
-  },
-  unavailableTitle: {
-    fontSize: 14,
-    fontWeight: '600',
-    color: macOSColors.semantic.warning
-  },
-  unavailableDescription: {
-    fontSize: 12,
-    color: night.color.textSecondary,
-    textAlign: 'center',
-    lineHeight: 18
-  },
-  // Empty state
-  emptyState: {
-    backgroundColor: night.color.surface,
-    borderRadius: 12,
-    padding: 20,
-    borderWidth: 1,
-    borderColor: night.color.border,
-    alignItems: 'center',
-    gap: 12
-  },
-  emptyStateTitle: {
-    fontSize: 14,
-    fontWeight: '600',
-    color: night.color.text
-  },
-  emptyStateDescription: {
-    fontSize: 12,
-    color: night.color.textTertiary,
-    textAlign: 'center',
-    lineHeight: 18
-  },
-  refreshButton: {
-    marginTop: 8,
-    paddingHorizontal: 16,
-    paddingVertical: 8,
-    backgroundColor: night.color.accentSoft,
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: night.color.accentBorderStrong
-  },
-  refreshButtonText: {
-    fontSize: 12,
-    fontWeight: '600',
-    color: night.color.accent
-  },
-  // Selector button
-  selectorButton: {
-    backgroundColor: night.color.surface,
-    borderRadius: 12,
-    borderWidth: 1,
-    borderColor: night.color.border,
-    padding: 12,
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'space-between',
-    shadowColor: '#000000',
-    shadowOpacity: 0.03,
-    shadowRadius: 8,
-    shadowOffset: {
-      width: 0,
-      height: 2
-    }
-  },
-  selectorContent: {
-    flex: 1
-  },
-  placeholderText: {
-    fontSize: 13,
-    color: night.color.placeholder,
-    fontStyle: 'italic'
-  },
-  dropdownArrow: {
-    fontSize: 10,
-    color: night.color.textTertiary,
-    marginLeft: 8
-  },
-  // Modal overlay
-  modalOverlay: {
-    flex: 1,
-    backgroundColor: 'rgba(0, 0, 0, 0.5)',
-    justifyContent: 'center',
-    alignItems: 'center',
-    padding: 20
-  },
-  // Dropdown container
-  dropdownContainer: {
-    backgroundColor: night.color.surface,
-    borderRadius: 16,
-    borderWidth: 1,
-    borderColor: night.color.border,
-    width: '100%',
-    maxWidth: 500,
-    maxHeight: '70%',
-    shadowColor: '#000000',
-    shadowOpacity: 0.2,
-    shadowRadius: 20,
-    shadowOffset: {
-      width: 0,
-      height: 10
-    },
-    overflow: 'hidden'
-  },
-  dropdownHeader: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'space-between',
-    padding: 16,
-    borderBottomWidth: 1,
-    borderBottomColor: night.color.separator
-  },
-  dropdownTitle: {
-    fontSize: 14,
-    fontWeight: '600',
-    color: night.color.text
-  },
-  headerRefreshButton: {
-    padding: 4
-  },
-  headerRefreshText: {
-    fontSize: 18,
-    color: night.color.accent
-  },
-  dropdownList: {
-    maxHeight: 400
-  },
-  dropdownItem: {
-    padding: 12,
-    borderBottomWidth: 1,
-    borderBottomColor: night.color.separator
-  },
-  dropdownItemSelected: {
-    backgroundColor: night.color.accentSoft
-  },
-  // Instance row
-  instanceRow: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'space-between',
-    gap: 12
-  },
-  instanceLeft: {
-    flex: 1,
-    gap: 6
-  },
-  instanceId: {
-    fontSize: 13,
-    fontWeight: '500',
-    color: night.color.text,
-    fontFamily: monoFont
-  },
-  instanceIdSelected: {
-    fontWeight: '600',
-    color: night.color.accent
-  },
-  instanceBadges: {
-    flexDirection: 'row',
-    flexWrap: 'wrap',
-    gap: 6
-  },
-  badge: {
-    paddingHorizontal: 6,
-    paddingVertical: 2,
-    borderRadius: 4,
-    borderWidth: 1
-  },
-  badgeEncrypted: {
-    backgroundColor: macOSColors.semantic.success + '15',
-    borderColor: macOSColors.semantic.success + '40'
-  },
-  badgeReadOnly: {
-    backgroundColor: macOSColors.semantic.warning + '15',
-    borderColor: macOSColors.semantic.warning + '40'
-  },
-  badgeText: {
-    fontSize: 9,
-    fontWeight: '500',
-    color: night.color.textSecondary
-  },
-  instanceRight: {
-    alignItems: 'flex-end'
-  },
-  keyCount: {
-    fontSize: 16,
-    fontWeight: '600',
-    color: night.color.text,
-    fontFamily: monoFont
-  },
-  keyCountLabel: {
-    fontSize: 9,
-    color: night.color.textTertiary,
-    textTransform: "uppercase",
-    letterSpacing: 0.5
-  }
-});
+"use strict";import{storageLabels as x}from"../utils/storageLabels";import{useState as C}from"react";import{View as r,Text as n,StyleSheet as R,TouchableOpacity as c,ScrollView as T,Modal as I}from"react-native";import{macOSColors as d,night as o,monoFont as b}from"@buoy-gg/shared-ui";import{useMMKVInstances as v}from"../hooks/useMMKVInstances";import{isMMKVAvailable as B,getMMKVUnavailableMessage as M}from"../utils/mmkvAvailability";import{jsxs as i,jsx as t}from"react/jsx-runtime";export function MMKVInstanceSelector({selectedInstanceId:a,onSelectInstance:h,showRefreshButton:g=true}){const[w,s]=C(false);const{instances:p,instanceCount:f,refresh:y}=v(false);const u=p.find(l=>l.id===a);const S=l=>{h(l);s(false)};if(!B()){return t(r,{style:e.container,children:i(r,{style:e.unavailableState,children:[i(n,{style:e.unavailableTitle,children:[x.mmkv," Not Available"]}),t(n,{style:e.unavailableDescription,children:M()})]})})}if(f===0){return t(r,{style:e.container,children:i(r,{style:e.emptyState,children:[t(n,{style:e.emptyStateTitle,children:"No MMKV Instances Registered"}),t(n,{style:e.emptyStateDescription,children:"Register MMKV instances using registerMMKVInstance() to monitor them in dev tools."}),g&&t(c,{style:e.refreshButton,onPress:y,activeOpacity:.7,children:t(n,{style:e.refreshButtonText,children:"\u21BB Refresh"})})]})})}return i(r,{style:e.container,children:[i(c,{style:e.selectorButton,onPress:()=>s(true),activeOpacity:.7,children:[t(r,{style:e.selectorContent,children:u?t(m,{instance:u,isSelected:true}):t(n,{style:e.placeholderText,children:"Select MMKV Instance"})}),t(n,{style:e.dropdownArrow,children:"\u25BC"})]}),t(I,{visible:w,transparent:true,animationType:"fade",onRequestClose:()=>s(false),children:t(c,{style:e.modalOverlay,activeOpacity:1,onPress:()=>s(false),children:i(r,{style:e.dropdownContainer,children:[i(r,{style:e.dropdownHeader,children:[i(n,{style:e.dropdownTitle,children:["Select MMKV Instance (",f,")"]}),g&&t(c,{style:e.headerRefreshButton,onPress:y,activeOpacity:.7,children:t(n,{style:e.headerRefreshText,children:"\u21BB"})})]}),t(T,{style:e.dropdownList,children:p.map(l=>t(c,{style:[e.dropdownItem,l.id===a&&e.dropdownItemSelected],onPress:()=>S(l.id),activeOpacity:.7,children:t(m,{instance:l,isSelected:l.id===a})},l.id))})]})})})]})}function m({instance:a,isSelected:h}){return i(r,{style:e.instanceRow,children:[i(r,{style:e.instanceLeft,children:[t(n,{style:[e.instanceId,h&&e.instanceIdSelected],numberOfLines:1,children:a.id}),i(r,{style:e.instanceBadges,children:[a.encrypted&&t(r,{style:[e.badge,e.badgeEncrypted],children:t(n,{style:e.badgeText,children:"\u{1F512} Encrypted"})}),a.readOnly&&t(r,{style:[e.badge,e.badgeReadOnly],children:t(n,{style:e.badgeText,children:"\u{1F441}\uFE0F Read-only"})})]})]}),i(r,{style:e.instanceRight,children:[t(n,{style:e.keyCount,children:a.keyCount}),t(n,{style:e.keyCountLabel,children:"keys"})]})]})}const e=R.create({container:{marginBottom:12},unavailableState:{backgroundColor:d.semantic.warning+"15",borderRadius:12,padding:20,borderWidth:1,borderColor:d.semantic.warning+"40",alignItems:"center",gap:12},unavailableTitle:{fontSize:14,fontWeight:"600",color:d.semantic.warning},unavailableDescription:{fontSize:12,color:o.color.textSecondary,textAlign:"center",lineHeight:18},emptyState:{backgroundColor:o.color.surface,borderRadius:12,padding:20,borderWidth:1,borderColor:o.color.border,alignItems:"center",gap:12},emptyStateTitle:{fontSize:14,fontWeight:"600",color:o.color.text},emptyStateDescription:{fontSize:12,color:o.color.textTertiary,textAlign:"center",lineHeight:18},refreshButton:{marginTop:8,paddingHorizontal:16,paddingVertical:8,backgroundColor:o.color.accentSoft,borderRadius:8,borderWidth:1,borderColor:o.color.accentBorderStrong},refreshButtonText:{fontSize:12,fontWeight:"600",color:o.color.accent},selectorButton:{backgroundColor:o.color.surface,borderRadius:12,borderWidth:1,borderColor:o.color.border,padding:12,flexDirection:"row",alignItems:"center",justifyContent:"space-between",shadowColor:"#000000",shadowOpacity:.03,shadowRadius:8,shadowOffset:{width:0,height:2}},selectorContent:{flex:1},placeholderText:{fontSize:13,color:o.color.placeholder,fontStyle:"italic"},dropdownArrow:{fontSize:10,color:o.color.textTertiary,marginLeft:8},modalOverlay:{flex:1,backgroundColor:"rgba(0, 0, 0, 0.5)",justifyContent:"center",alignItems:"center",padding:20},dropdownContainer:{backgroundColor:o.color.surface,borderRadius:16,borderWidth:1,borderColor:o.color.border,width:"100%",maxWidth:500,maxHeight:"70%",shadowColor:"#000000",shadowOpacity:.2,shadowRadius:20,shadowOffset:{width:0,height:10},overflow:"hidden"},dropdownHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",padding:16,borderBottomWidth:1,borderBottomColor:o.color.separator},dropdownTitle:{fontSize:14,fontWeight:"600",color:o.color.text},headerRefreshButton:{padding:4},headerRefreshText:{fontSize:18,color:o.color.accent},dropdownList:{maxHeight:400},dropdownItem:{padding:12,borderBottomWidth:1,borderBottomColor:o.color.separator},dropdownItemSelected:{backgroundColor:o.color.accentSoft},instanceRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",gap:12},instanceLeft:{flex:1,gap:6},instanceId:{fontSize:13,fontWeight:"500",color:o.color.text,fontFamily:b},instanceIdSelected:{fontWeight:"600",color:o.color.accent},instanceBadges:{flexDirection:"row",flexWrap:"wrap",gap:6},badge:{paddingHorizontal:6,paddingVertical:2,borderRadius:4,borderWidth:1},badgeEncrypted:{backgroundColor:d.semantic.success+"15",borderColor:d.semantic.success+"40"},badgeReadOnly:{backgroundColor:d.semantic.warning+"15",borderColor:d.semantic.warning+"40"},badgeText:{fontSize:9,fontWeight:"500",color:o.color.textSecondary},instanceRight:{alignItems:"flex-end"},keyCount:{fontSize:16,fontWeight:"600",color:o.color.text,fontFamily:b},keyCountLabel:{fontSize:9,color:o.color.textTertiary,textTransform:"uppercase",letterSpacing:.5}});