@buoy-gg/storage 7.0.40 → 7.0.42

package/lib/commonjs/storage/components/StorageKeyCard.js

@@ -1,520 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.StorageKeyCard = StorageKeyCard;
-var _reactNative = require("react-native");
-var _sharedUi = require("@buoy-gg/shared-ui");
-var _storageQueryUtils = require("../utils/storageQueryUtils");
-var _valueType = require("../utils/valueType");
-var _dataViewer = require("@buoy-gg/shared-ui/dataViewer");
-var _jsxRuntime = require("react/jsx-runtime");
-// Stable constants moved to module scope to prevent re-renders [[memory:4875251]]
-const HIT_SLOP = {
-  top: 6,
-  bottom: 6,
-  left: 6,
-  right: 6
-};
-
-// MMKV Instance color palette - consistent colors per instance
-const INSTANCE_COLORS = [_sharedUi.macOSColors.semantic.info,
-// Blue
-_sharedUi.macOSColors.semantic.success,
-// Green
-_sharedUi.macOSColors.semantic.warning,
-// Orange
-_sharedUi.macOSColors.semantic.debug,
-// Purple
-'#FF6B9D',
-// Pink
-'#00D9FF' // Cyan
-];
-
-/**
- * Get consistent color for an MMKV instance based on its ID
- * Uses simple hash to ensure same instance always gets same color
- */
-function getInstanceColor(instanceId) {
-  const hash = instanceId.split('').reduce((acc, char) => acc + char.charCodeAt(0), 0);
-  return INSTANCE_COLORS[hash % INSTANCE_COLORS.length];
-}
-const getStatusConfig = status => {
-  switch (status) {
-    case "required_present":
-      return {
-        icon: _sharedUi.CheckCircle2,
-        color: _sharedUi.macOSColors.semantic.success,
-        bgColor: _sharedUi.macOSColors.semantic.successBackground,
-        borderColor: _sharedUi.macOSColors.semantic.success + "40",
-        label: "REQUIRED",
-        labelColor: _sharedUi.macOSColors.semantic.success
-      };
-    case "required_missing":
-      return {
-        icon: _sharedUi.AlertCircle,
-        color: _sharedUi.macOSColors.semantic.error,
-        bgColor: _sharedUi.macOSColors.semantic.errorBackground,
-        borderColor: _sharedUi.macOSColors.semantic.error + "50",
-        label: "MISSING",
-        labelColor: _sharedUi.macOSColors.semantic.error
-      };
-    case "required_wrong_value":
-      return {
-        icon: _sharedUi.XCircle,
-        color: _sharedUi.macOSColors.semantic.warning,
-        bgColor: _sharedUi.macOSColors.semantic.warningBackground,
-        borderColor: _sharedUi.macOSColors.semantic.warning + "50",
-        label: "WRONG S",
-        labelColor: _sharedUi.macOSColors.semantic.warning
-      };
-    case "required_wrong_type":
-      return {
-        icon: _sharedUi.XCircle,
-        color: _sharedUi.macOSColors.semantic.info,
-        bgColor: _sharedUi.macOSColors.semantic.infoBackground,
-        borderColor: _sharedUi.macOSColors.semantic.info + "50",
-        label: "WRONG TYPE",
-        labelColor: _sharedUi.macOSColors.semantic.info
-      };
-    case "optional_present":
-      return {
-        icon: _sharedUi.Eye,
-        color: _sharedUi.macOSColors.semantic.debug,
-        bgColor: _sharedUi.macOSColors.semantic.infoBackground,
-        borderColor: _sharedUi.macOSColors.semantic.debug + "40",
-        label: "OPTIONAL",
-        labelColor: _sharedUi.macOSColors.semantic.debug
-      };
-  }
-};
-const getStorageIcon = storageType => {
-  switch (storageType) {
-    case "mmkv":
-      return _sharedUi.HardDrive;
-    case "async":
-      return _sharedUi.Database;
-    case "secure":
-      return _sharedUi.Shield;
-    default:
-      return _sharedUi.Database;
-    // Default fallback
-  }
-};
-
-/**
- * Storage key card component following composition principles [[rule3]]
- *
- * Applied principles:
- * - Decompose by Responsibility: Single purpose component for storage key display
- * - Prefer Composition over Configuration: Reuses existing patterns from EnvVarCard
- * - Extract Reusable Logic: Shares formatValue and status config patterns
- */
-function StorageKeyCard({
-  storageKey,
-  isExpanded,
-  onToggle
-}) {
-  const config = getStatusConfig(storageKey.status);
-  const StatusIcon = config.icon;
-  const StorageIcon = getStorageIcon(storageKey.storageType);
-  const hasValue = storageKey.value !== undefined && storageKey.value !== null;
-  const hasExpectedValue = storageKey.expectedValue !== undefined;
-  const hasExpectedType = storageKey.expectedType !== undefined;
-  const storageTypeColor = (0, _storageQueryUtils.getStorageTypeHexColor)(storageKey.storageType);
-  const storageTypeLabel = (0, _storageQueryUtils.getStorageTypeLabel)(storageKey.storageType);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    style: [styles.storageKeyCard, {
-      borderColor: config.borderColor
-    }],
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
-      accessibilityLabel: "Storage key card",
-      accessibilityHint: "View storage key card",
-      "sentry-label": `ignore storage key card ${storageKey.key}`,
-      accessibilityRole: "button",
-      style: styles.cardHeader,
-      onPress: onToggle,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: styles.cardHeaderLeft,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: [styles.iconContainer, {
-            backgroundColor: config.bgColor
-          }],
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(StatusIcon, {
-            size: 14,
-            color: config.color
-          })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-          style: styles.cardHeaderInfo,
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: styles.storageKeyText,
-            children: storageKey.key
-          }), storageKey.description ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: styles.descriptionText,
-            children: storageKey.description
-          }) : null, /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-            style: styles.cardHeaderMeta,
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-              style: [styles.statusBadge, {
-                backgroundColor: config.bgColor
-              }],
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-                style: [styles.statusText, {
-                  color: config.labelColor
-                }],
-                children: config.label
-              })
-            }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-              style: [styles.storageBadge, {
-                backgroundColor: `${storageTypeColor}15`
-              }],
-              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(StorageIcon, {
-                size: 10,
-                color: storageTypeColor
-              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-                style: [styles.storageText, {
-                  color: storageTypeColor
-                }],
-                children: storageTypeLabel
-              })]
-            }), storageKey.storageType === 'mmkv' && storageKey.instanceId && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-              style: [styles.instanceBadge, {
-                backgroundColor: getInstanceColor(storageKey.instanceId) + '20',
-                borderColor: getInstanceColor(storageKey.instanceId) + '40'
-              }],
-              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.HardDrive, {
-                size: 9,
-                color: getInstanceColor(storageKey.instanceId)
-              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-                style: [styles.instanceText, {
-                  color: getInstanceColor(storageKey.instanceId)
-                }],
-                children: storageKey.instanceId
-              })]
-            }), hasValue && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-              style: styles.valueBadge,
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-                style: styles.valueText,
-                children: storageKey.valueType ? storageKey.valueType.toUpperCase() : (0, _valueType.getValueTypeLabel)(storageKey.value)
-              })
-            })]
-          })]
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: styles.cardHeaderRight,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: styles.actionButton,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.Eye, {
-            size: 12,
-            color: _sharedUi.night.color.textSecondary
-          })
-        })
-      })]
-    }), isExpanded && hasValue && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: styles.cardBody,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: styles.dataViewerContainer,
-        children: (() => {
-          const parsed = typeof storageKey.value === "string" ? (() => {
-            try {
-              return JSON.parse(storageKey.value);
-            } catch {
-              return storageKey.value;
-            }
-          })() : storageKey.value;
-          const isSimple = typeof parsed === "string" || typeof parsed === "number" || typeof parsed === "boolean";
-          return isSimple ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-            style: styles.simpleValueContainer,
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-              style: styles.simpleValueLabel,
-              children: "Current Value:"
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-              style: styles.simpleValueBox,
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-                style: styles.simpleValueContent,
-                selectable: true,
-                children: String(parsed)
-              })
-            }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
-              style: styles.valueTypeText,
-              children: ["Type: ", (0, _valueType.getValueTypeLabel)(storageKey.value)]
-            })]
-          }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_dataViewer.DataViewer, {
-            title: "Current Value",
-            data: parsed,
-            showTypeFilter: false,
-            rawMode: true
-          });
-        })()
-      }), hasExpectedValue && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: styles.valueContainer,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: styles.valueLabel,
-          children: "Expected Value:"
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: styles.expectedValueBox,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: styles.expectedValueContent,
-            selectable: true,
-            children: storageKey.expectedValue
-          })
-        })]
-      }), hasExpectedType && storageKey.expectedType && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: styles.valueContainer,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: styles.valueLabel,
-          children: "Expected Type:"
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: styles.expectedValueBox,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: styles.expectedValueContent,
-            selectable: true,
-            children: storageKey.expectedType.toUpperCase()
-          })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
-          style: styles.typeHelperText,
-          children: ["Current type: ", (0, _valueType.getValueTypeLabel)(storageKey.value)]
-        })]
-      }), storageKey.lastUpdated ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: styles.metaInfo,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
-          style: styles.metaLabel,
-          children: ["Last updated: ", storageKey.lastUpdated.toLocaleString()]
-        })
-      }) : null]
-    }), isExpanded && !hasValue && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: styles.cardBody,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: styles.emptyValueContainer,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.AlertCircle, {
-          size: 16,
-          color: _sharedUi.macOSColors.semantic.warning
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: styles.emptyValueText,
-          children: "Storage key not found or empty"
-        })]
-      }), hasExpectedValue && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-        style: styles.valueContainer,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: styles.valueLabel,
-          children: "Expected Value:"
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          style: styles.expectedValueBox,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-            style: styles.expectedValueContent,
-            selectable: true,
-            children: storageKey.expectedValue
-          })
-        })]
-      })]
-    })]
-  });
-}
-const styles = _reactNative.StyleSheet.create({
-  storageKeyCard: {
-    backgroundColor: _sharedUi.night.color.surface,
-    borderRadius: 8,
-    borderWidth: 1,
-    overflow: "hidden"
-  },
-  cardHeader: {
-    padding: 12,
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between"
-  },
-  cardHeaderLeft: {
-    flexDirection: "row",
-    alignItems: "center",
-    flex: 1,
-    minWidth: 0
-  },
-  iconContainer: {
-    padding: 6,
-    borderRadius: 6,
-    marginRight: 10
-  },
-  cardHeaderInfo: {
-    flex: 1,
-    minWidth: 0,
-    gap: 4
-  },
-  storageKeyText: {
-    color: _sharedUi.night.color.text,
-    fontWeight: "500",
-    fontSize: 12,
-    flexWrap: "wrap",
-    flex: 1
-  },
-  descriptionText: {
-    color: _sharedUi.night.color.textSecondary,
-    fontSize: 10,
-    marginTop: 2,
-    flexWrap: "wrap"
-  },
-  cardHeaderMeta: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 6,
-    flexWrap: "wrap"
-  },
-  statusBadge: {
-    paddingHorizontal: 6,
-    paddingVertical: 2,
-    borderRadius: 4
-  },
-  statusText: {
-    fontSize: 9,
-    fontWeight: "600",
-    letterSpacing: 0.5
-  },
-  storageBadge: {
-    paddingHorizontal: 6,
-    paddingVertical: 2,
-    borderRadius: 4,
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 4
-  },
-  storageText: {
-    fontSize: 9,
-    fontWeight: "600"
-  },
-  instanceBadge: {
-    paddingHorizontal: 6,
-    paddingVertical: 3,
-    borderRadius: 4,
-    borderWidth: 1,
-    flexDirection: 'row',
-    alignItems: 'center',
-    gap: 4
-  },
-  instanceText: {
-    fontSize: 9,
-    fontWeight: "700",
-    fontFamily: _sharedUi.monoFont,
-    letterSpacing: 0.3
-  },
-  valueBadge: {
-    paddingHorizontal: 4,
-    paddingVertical: 2,
-    backgroundColor: _sharedUi.night.color.surfaceElevated,
-    borderRadius: 3
-  },
-  valueText: {
-    fontSize: 8,
-    color: _sharedUi.night.color.textSecondary,
-    fontWeight: "500"
-  },
-  cardHeaderRight: {
-    marginLeft: 8
-  },
-  actionButton: {
-    padding: 4,
-    borderRadius: 4,
-    backgroundColor: _sharedUi.night.color.surfaceElevated
-  },
-  cardBody: {
-    borderTopWidth: 1,
-    borderTopColor: _sharedUi.night.color.separator,
-    padding: 12,
-    gap: 12
-  },
-  dataViewerContainer: {
-    marginTop: 8
-  },
-  simpleValueContainer: {
-    gap: 8
-  },
-  simpleValueLabel: {
-    color: _sharedUi.night.color.textSecondary,
-    fontSize: 10,
-    fontWeight: "500",
-    textTransform: "uppercase",
-    letterSpacing: 0.5
-  },
-  simpleValueBox: {
-    backgroundColor: _sharedUi.night.color.bg,
-    borderRadius: 4,
-    padding: 10,
-    borderWidth: 1,
-    borderColor: _sharedUi.night.color.border
-  },
-  simpleValueContent: {
-    color: _sharedUi.gameUIColors.success,
-    fontSize: 12,
-    fontFamily: _sharedUi.monoFont,
-    lineHeight: 16
-  },
-  valueTypeText: {
-    color: _sharedUi.night.color.textTertiary,
-    fontSize: 9,
-    fontStyle: "italic"
-  },
-  valueContainer: {
-    gap: 6
-  },
-  valueLabel: {
-    color: _sharedUi.night.color.textSecondary,
-    fontSize: 10,
-    fontWeight: "500",
-    textTransform: "uppercase",
-    letterSpacing: 0.5
-  },
-  valueBox: {
-    backgroundColor: _sharedUi.night.color.bg,
-    borderRadius: 4,
-    padding: 8,
-    borderWidth: 1,
-    borderColor: _sharedUi.night.color.border
-  },
-  valueContent: {
-    color: _sharedUi.night.color.text,
-    fontSize: 10,
-    fontFamily: _sharedUi.monoFont,
-    lineHeight: 14
-  },
-  expectedValueBox: {
-    backgroundColor: _sharedUi.night.color.bg,
-    borderRadius: 4,
-    padding: 8,
-    borderWidth: 1,
-    borderColor: _sharedUi.night.color.border
-  },
-  expectedValueContent: {
-    color: _sharedUi.night.color.text,
-    fontSize: 10,
-    fontFamily: _sharedUi.monoFont,
-    lineHeight: 14
-  },
-  emptyValueContainer: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 6,
-    padding: 8,
-    backgroundColor: _sharedUi.gameUIColors.warning + "0D",
-    borderRadius: 4,
-    borderWidth: 1,
-    borderColor: _sharedUi.gameUIColors.warning + "1A"
-  },
-  emptyValueText: {
-    color: _sharedUi.gameUIColors.warning,
-    fontSize: 10,
-    fontStyle: "italic"
-  },
-  typeHelperText: {
-    color: _sharedUi.night.color.textSecondary,
-    fontSize: 9,
-    marginTop: 4,
-    textAlign: "center"
-  },
-  metaInfo: {
-    marginTop: 8
-  },
-  metaLabel: {
-    color: _sharedUi.night.color.textTertiary,
-    fontSize: 9,
-    fontStyle: "italic"
-  }
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.StorageKeyCard=StorageKeyCard;var _reactNative=require("react-native");var _sharedUi=require("@buoy-gg/shared-ui");var _storageQueryUtils=require("../utils/storageQueryUtils");var _valueType=require("../utils/valueType");var _dataViewer=require("@buoy-gg/shared-ui/dataViewer");var _jsxRuntime=require("react/jsx-runtime");const HIT_SLOP={top:6,bottom:6,left:6,right:6};const INSTANCE_COLORS=[_sharedUi.macOSColors.semantic.info,_sharedUi.macOSColors.semantic.success,_sharedUi.macOSColors.semantic.warning,_sharedUi.macOSColors.semantic.debug,"#FF6B9D","#00D9FF"];function getInstanceColor(e){const o=e.split("").reduce((l,r)=>l+r.charCodeAt(0),0);return INSTANCE_COLORS[o%INSTANCE_COLORS.length]}const getStatusConfig=e=>{switch(e){case"required_present":return{icon:_sharedUi.CheckCircle2,color:_sharedUi.macOSColors.semantic.success,bgColor:_sharedUi.macOSColors.semantic.successBackground,borderColor:_sharedUi.macOSColors.semantic.success+"40",label:"REQUIRED",labelColor:_sharedUi.macOSColors.semantic.success};case"required_missing":return{icon:_sharedUi.AlertCircle,color:_sharedUi.macOSColors.semantic.error,bgColor:_sharedUi.macOSColors.semantic.errorBackground,borderColor:_sharedUi.macOSColors.semantic.error+"50",label:"MISSING",labelColor:_sharedUi.macOSColors.semantic.error};case"required_wrong_value":return{icon:_sharedUi.XCircle,color:_sharedUi.macOSColors.semantic.warning,bgColor:_sharedUi.macOSColors.semantic.warningBackground,borderColor:_sharedUi.macOSColors.semantic.warning+"50",label:"WRONG S",labelColor:_sharedUi.macOSColors.semantic.warning};case"required_wrong_type":return{icon:_sharedUi.XCircle,color:_sharedUi.macOSColors.semantic.info,bgColor:_sharedUi.macOSColors.semantic.infoBackground,borderColor:_sharedUi.macOSColors.semantic.info+"50",label:"WRONG TYPE",labelColor:_sharedUi.macOSColors.semantic.info};case"optional_present":return{icon:_sharedUi.Eye,color:_sharedUi.macOSColors.semantic.debug,bgColor:_sharedUi.macOSColors.semantic.infoBackground,borderColor:_sharedUi.macOSColors.semantic.debug+"40",label:"OPTIONAL",labelColor:_sharedUi.macOSColors.semantic.debug}}};const getStorageIcon=e=>{switch(e){case"mmkv":return _sharedUi.HardDrive;case"async":return _sharedUi.Database;case"secure":return _sharedUi.Shield;default:return _sharedUi.Database}};function StorageKeyCard({storageKey:e,isExpanded:o,onToggle:l}){const r=getStatusConfig(e.status);const c=r.icon;const s=getStorageIcon(e.storageType);const a=e.value!==void 0&&e.value!==null;const i=e.expectedValue!==void 0;const d=e.expectedType!==void 0;const n=(0,_storageQueryUtils.getStorageTypeHexColor)(e.storageType);const u=(0,_storageQueryUtils.getStorageTypeLabel)(e.storageType);return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.storageKeyCard,{borderColor:r.borderColor}],children:[(0,_jsxRuntime.jsxs)(_reactNative.TouchableOpacity,{accessibilityLabel:"Storage key card",accessibilityHint:"View storage key card","sentry-label":`ignore storage key card ${e.key}`,accessibilityRole:"button",style:styles.cardHeader,onPress:l,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.cardHeaderLeft,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.iconContainer,{backgroundColor:r.bgColor}],children:(0,_jsxRuntime.jsx)(c,{size:14,color:r.color})}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.cardHeaderInfo,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.storageKeyText,children:e.key}),e.description?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.descriptionText,children:e.description}):null,(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.cardHeaderMeta,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.statusBadge,{backgroundColor:r.bgColor}],children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.statusText,{color:r.labelColor}],children:r.label})}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.storageBadge,{backgroundColor:`${n}15`}],children:[(0,_jsxRuntime.jsx)(s,{size:10,color:n}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.storageText,{color:n}],children:u})]}),e.storageType==="mmkv"&&e.instanceId&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:[styles.instanceBadge,{backgroundColor:getInstanceColor(e.instanceId)+"20",borderColor:getInstanceColor(e.instanceId)+"40"}],children:[(0,_jsxRuntime.jsx)(_sharedUi.HardDrive,{size:9,color:getInstanceColor(e.instanceId)}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.instanceText,{color:getInstanceColor(e.instanceId)}],children:e.instanceId})]}),a&&(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.valueBadge,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.valueText,children:e.valueType?e.valueType.toUpperCase():(0,_valueType.getValueTypeLabel)(e.value)})})]})]})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.cardHeaderRight,children:(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.actionButton,children:(0,_jsxRuntime.jsx)(_sharedUi.Eye,{size:12,color:_sharedUi.night.color.textSecondary})})})]}),o&&a&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.cardBody,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.dataViewerContainer,children:(()=>{const t=typeof e.value==="string"?(()=>{try{return JSON.parse(e.value)}catch{return e.value}})():e.value;const g=typeof t==="string"||typeof t==="number"||typeof t==="boolean";return g?(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.simpleValueContainer,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.simpleValueLabel,children:"Current Value:"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.simpleValueBox,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.simpleValueContent,selectable:true,children:String(t)})}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.valueTypeText,children:["Type: ",(0,_valueType.getValueTypeLabel)(e.value)]})]}):(0,_jsxRuntime.jsx)(_dataViewer.DataViewer,{title:"Current Value",data:t,showTypeFilter:false,rawMode:true})})()}),i&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.valueContainer,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.valueLabel,children:"Expected Value:"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.expectedValueBox,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.expectedValueContent,selectable:true,children:e.expectedValue})})]}),d&&e.expectedType&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.valueContainer,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.valueLabel,children:"Expected Type:"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.expectedValueBox,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.expectedValueContent,selectable:true,children:e.expectedType.toUpperCase()})}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.typeHelperText,children:["Current type: ",(0,_valueType.getValueTypeLabel)(e.value)]})]}),e.lastUpdated?(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.metaInfo,children:(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.metaLabel,children:["Last updated: ",e.lastUpdated.toLocaleString()]})}):null]}),o&&!a&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.cardBody,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.emptyValueContainer,children:[(0,_jsxRuntime.jsx)(_sharedUi.AlertCircle,{size:16,color:_sharedUi.macOSColors.semantic.warning}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.emptyValueText,children:"Storage key not found or empty"})]}),i&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.valueContainer,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.valueLabel,children:"Expected Value:"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.expectedValueBox,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.expectedValueContent,selectable:true,children:e.expectedValue})})]})]})]})}const styles=_reactNative.StyleSheet.create({storageKeyCard:{backgroundColor:_sharedUi.night.color.surface,borderRadius:8,borderWidth:1,overflow:"hidden"},cardHeader:{padding:12,flexDirection:"row",alignItems:"center",justifyContent:"space-between"},cardHeaderLeft:{flexDirection:"row",alignItems:"center",flex:1,minWidth:0},iconContainer:{padding:6,borderRadius:6,marginRight:10},cardHeaderInfo:{flex:1,minWidth:0,gap:4},storageKeyText:{color:_sharedUi.night.color.text,fontWeight:"500",fontSize:12,flexWrap:"wrap",flex:1},descriptionText:{color:_sharedUi.night.color.textSecondary,fontSize:10,marginTop:2,flexWrap:"wrap"},cardHeaderMeta:{flexDirection:"row",alignItems:"center",gap:6,flexWrap:"wrap"},statusBadge:{paddingHorizontal:6,paddingVertical:2,borderRadius:4},statusText:{fontSize:9,fontWeight:"600",letterSpacing:.5},storageBadge:{paddingHorizontal:6,paddingVertical:2,borderRadius:4,flexDirection:"row",alignItems:"center",gap:4},storageText:{fontSize:9,fontWeight:"600"},instanceBadge:{paddingHorizontal:6,paddingVertical:3,borderRadius:4,borderWidth:1,flexDirection:"row",alignItems:"center",gap:4},instanceText:{fontSize:9,fontWeight:"700",fontFamily:_sharedUi.monoFont,letterSpacing:.3},valueBadge:{paddingHorizontal:4,paddingVertical:2,backgroundColor:_sharedUi.night.color.surfaceElevated,borderRadius:3},valueText:{fontSize:8,color:_sharedUi.night.color.textSecondary,fontWeight:"500"},cardHeaderRight:{marginLeft:8},actionButton:{padding:4,borderRadius:4,backgroundColor:_sharedUi.night.color.surfaceElevated},cardBody:{borderTopWidth:1,borderTopColor:_sharedUi.night.color.separator,padding:12,gap:12},dataViewerContainer:{marginTop:8},simpleValueContainer:{gap:8},simpleValueLabel:{color:_sharedUi.night.color.textSecondary,fontSize:10,fontWeight:"500",textTransform:"uppercase",letterSpacing:.5},simpleValueBox:{backgroundColor:_sharedUi.night.color.bg,borderRadius:4,padding:10,borderWidth:1,borderColor:_sharedUi.night.color.border},simpleValueContent:{color:_sharedUi.gameUIColors.success,fontSize:12,fontFamily:_sharedUi.monoFont,lineHeight:16},valueTypeText:{color:_sharedUi.night.color.textTertiary,fontSize:9,fontStyle:"italic"},valueContainer:{gap:6},valueLabel:{color:_sharedUi.night.color.textSecondary,fontSize:10,fontWeight:"500",textTransform:"uppercase",letterSpacing:.5},valueBox:{backgroundColor:_sharedUi.night.color.bg,borderRadius:4,padding:8,borderWidth:1,borderColor:_sharedUi.night.color.border},valueContent:{color:_sharedUi.night.color.text,fontSize:10,fontFamily:_sharedUi.monoFont,lineHeight:14},expectedValueBox:{backgroundColor:_sharedUi.night.color.bg,borderRadius:4,padding:8,borderWidth:1,borderColor:_sharedUi.night.color.border},expectedValueContent:{color:_sharedUi.night.color.text,fontSize:10,fontFamily:_sharedUi.monoFont,lineHeight:14},emptyValueContainer:{flexDirection:"row",alignItems:"center",gap:6,padding:8,backgroundColor:_sharedUi.gameUIColors.warning+"0D",borderRadius:4,borderWidth:1,borderColor:_sharedUi.gameUIColors.warning+"1A"},emptyValueText:{color:_sharedUi.gameUIColors.warning,fontSize:10,fontStyle:"italic"},typeHelperText:{color:_sharedUi.night.color.textSecondary,fontSize:9,marginTop:4,textAlign:"center"},metaInfo:{marginTop:8},metaLabel:{color:_sharedUi.night.color.textTertiary,fontSize:9,fontStyle:"italic"}});