@buoy-gg/storage 7.0.40 → 7.0.42

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

@@ -1,160 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.StorageKeySection = StorageKeySection;
-exports.storageRowId = storageRowId;
-var _react = require("react");
-var _reactNative = require("react-native");
-var _StorageKeyRow = require("./StorageKeyRow");
-var _sharedUi = require("@buoy-gg/shared-ui");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * Identifies a ROW, not a key name — the same name routinely exists in more
- * than one backend. Shared with the browser so both sides agree on the id.
- */
-function storageRowId(storageKey) {
-  return storageKey.instanceId ? `${storageKey.storageType}-${storageKey.instanceId}-${storageKey.key}` : `${storageKey.storageType}-${storageKey.key}`;
-}
-/**
- * Storage key section component following composition principles [[rule3]]
- *
- * Applied principles:
- * - Decompose by Responsibility: Single purpose component for grouped storage keys
- * - Prefer Composition over Configuration: Reuses patterns from EnvVarSection
- * - Extract Reusable Logic: Shares expansion state management pattern
- */
-function StorageKeySection({
-  title,
-  count,
-  keys,
-  emptyMessage,
-  headerColor,
-  isSelectMode = false,
-  selectedKeys = new Set(),
-  onSelectionChange,
-  eventCountByKey,
-  onViewHistory,
-  onHideKey,
-  pinnedKeys,
-  onTogglePin,
-  onEditKey,
-  onToggleKey,
-  onDeleteKey,
-  editBlockedFor,
-  onRowRef,
-  onOpenKey
-}) {
-  /**
-   * Identifies a ROW, not a key name.
-   *
-   * The same name routinely exists in more than one place — an app that keeps
-   * `auth.refreshToken` in both MMKV and the keychain has two rows called
-   * that, and they are different values in different stores.
-   */
-  const getKeyIdentifier = (0, _react.useCallback)(storageKey => storageRowId(storageKey), []);
-
-  /**
-   * Which ROW is expanded — by identifier, not by key name.
-   *
-   * Keyed by name, tapping one of a pair of same-named rows opened BOTH of
-   * them: two cards, two value trees, and two Edit buttons, one of which
-   * writes to a store you weren't looking at.
-   */
-  const [expandedKey, setExpandedKey] = (0, _react.useState)(null);
-  const handleKeyPress = (0, _react.useCallback)(storageKey => {
-    // Fiber-driven automation can invoke the ROW's onPress prop directly,
-    // handing this a GestureResponderEvent instead of the key the row's own
-    // touchable wrapper binds. Rendering an event as a key produced a
-    // convincing all-"undefined" detail screen; refuse anything that isn't
-    // a key.
-    if (!storageKey || typeof storageKey.key !== "string") return;
-    if (onOpenKey) {
-      // Navigate-to-detail hosts: the card is a door, not a drawer.
-      onOpenKey(storageKey);
-      return;
-    }
-    const id = getKeyIdentifier(storageKey);
-    setExpandedKey(prev => prev === id ? null : id);
-  }, [getKeyIdentifier, onOpenKey]);
-  if (keys.length === 0 && title === "Required Keys") {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: styles.sectionContainer,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_sharedUi.SectionHeader, {
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.SectionHeader.Title, {
-          children: title
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.SectionHeader.Badge, {
-          count: 0,
-          color: headerColor
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: styles.emptySection,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: styles.emptySectionText,
-          children: emptyMessage
-        })
-      })]
-    });
-  }
-  if (keys.length === 0) return null;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    style: styles.sectionContainer,
-    children: [title ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_sharedUi.SectionHeader, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.SectionHeader.Title, {
-        children: title
-      }), count >= 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.SectionHeader.Badge, {
-        count: count,
-        color: headerColor
-      })]
-    }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      style: styles.sectionContent,
-      children: keys.map(storageKey => {
-        // Create unique key by combining storage type, instance ID (if present), and key name
-        const uniqueKey = getKeyIdentifier(storageKey);
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-          ref: onRowRef ? node => onRowRef(uniqueKey, node) : undefined,
-          collapsable: false,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_StorageKeyRow.StorageKeyRow, {
-            storageKey: storageKey,
-            isExpanded: !isSelectMode && expandedKey === uniqueKey,
-            onPress: handleKeyPress,
-            isSelectMode: isSelectMode,
-            isSelected: selectedKeys.has(uniqueKey),
-            onSelectionChange: onSelectionChange,
-            eventCount: eventCountByKey?.[storageKey.key],
-            onViewHistory: onViewHistory ? () => onViewHistory(storageKey.key) : undefined,
-            onHideKey: onHideKey,
-            onEditKey: onEditKey,
-            onToggleKey: onToggleKey,
-            onDeleteKey: onDeleteKey,
-            editBlockedReason: editBlockedFor?.(storageKey),
-            isPinned: pinnedKeys?.has(storageKey.key),
-            onTogglePin: onTogglePin
-          })
-        }, uniqueKey);
-      })
-    })]
-  });
-}
-const styles = _reactNative.StyleSheet.create({
-  sectionContainer: {
-    gap: 8
-  },
-  sectionContent: {
-    // No gap needed, StorageKeyRow has its own margins
-  },
-  emptySection: {
-    backgroundColor: _sharedUi.night.color.surface,
-    borderRadius: 6,
-    padding: 16,
-    borderWidth: 1,
-    borderColor: _sharedUi.night.color.border,
-    alignItems: "center"
-  },
-  emptySectionText: {
-    color: _sharedUi.night.color.textTertiary,
-    fontSize: 11,
-    textAlign: "center"
-  }
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.StorageKeySection=StorageKeySection;exports.storageRowId=storageRowId;var _react=require("react");var _reactNative=require("react-native");var _StorageKeyRow=require("./StorageKeyRow");var _sharedUi=require("@buoy-gg/shared-ui");var _jsxRuntime=require("react/jsx-runtime");function storageRowId(n){return n.instanceId?`${n.storageType}-${n.instanceId}-${n.key}`:`${n.storageType}-${n.key}`}function StorageKeySection({title:n,count:s,keys:r,emptyMessage:x,headerColor:d,isSelectMode:l=false,selectedKeys:S=new Set,onSelectionChange:h,eventCountByKey:y,onViewHistory:a,onHideKey:g,pinnedKeys:j,onTogglePin:p,onEditKey:f,onToggleKey:b,onDeleteKey:w,editBlockedFor:C,onRowRef:u,onOpenKey:i}){const o=(0,_react.useCallback)(e=>storageRowId(e),[]);const[T,v]=(0,_react.useState)(null);const k=(0,_react.useCallback)(e=>{if(!e||typeof e.key!=="string")return;if(i){i(e);return}const t=o(e);v(c=>c===t?null:t)},[o,i]);if(r.length===0&&n==="Required Keys"){return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.sectionContainer,children:[(0,_jsxRuntime.jsxs)(_sharedUi.SectionHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Title,{children:n}),(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Badge,{count:0,color:d})]}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.emptySection,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.emptySectionText,children:x})})]})}if(r.length===0)return null;return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.sectionContainer,children:[n?(0,_jsxRuntime.jsxs)(_sharedUi.SectionHeader,{children:[(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Title,{children:n}),s>=0&&(0,_jsxRuntime.jsx)(_sharedUi.SectionHeader.Badge,{count:s,color:d})]}):null,(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.sectionContent,children:r.map(e=>{const t=o(e);return(0,_jsxRuntime.jsx)(_reactNative.View,{ref:u?c=>u(t,c):void 0,collapsable:false,children:(0,_jsxRuntime.jsx)(_StorageKeyRow.StorageKeyRow,{storageKey:e,isExpanded:!l&&T===t,onPress:k,isSelectMode:l,isSelected:S.has(t),onSelectionChange:h,eventCount:y?.[e.key],onViewHistory:a?()=>a(e.key):void 0,onHideKey:g,onEditKey:f,onToggleKey:b,onDeleteKey:w,editBlockedReason:C?.(e),isPinned:j?.has(e.key),onTogglePin:p})},t)})})]})}const styles=_reactNative.StyleSheet.create({sectionContainer:{gap:8},sectionContent:{},emptySection:{backgroundColor:_sharedUi.night.color.surface,borderRadius:6,padding:16,borderWidth:1,borderColor:_sharedUi.night.color.border,alignItems:"center"},emptySectionText:{color:_sharedUi.night.color.textTertiary,fontSize:11,textAlign:"center"}});

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

@@ -1,344 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.StorageKeyStatsSection = StorageKeyStatsSection;
-var _reactNative = require("react-native");
-var _sharedUi = require("@buoy-gg/shared-ui");
-var _storageQueryUtils = require("../utils/storageQueryUtils");
-var _jsxRuntime = require("react/jsx-runtime");
-// Variable type configurations matching env vars design
-const variableTypeData = [{
-  key: "valid",
-  label: "Valid Keys",
-  description: "Correctly stored and accessible",
-  icon: _sharedUi.CheckCircle2,
-  color: "#10B981",
-  textColor: "#10B981",
-  bgColor: "rgba(16, 185, 129, 0.1)"
-}, {
-  key: "missing",
-  label: "Missing Keys",
-  description: "Required but not found",
-  icon: _sharedUi.AlertCircle,
-  color: "#EF4444",
-  textColor: "#EF4444",
-  bgColor: "rgba(239, 68, 68, 0.1)"
-}, {
-  key: "wrongValue",
-  label: "Wrong Values",
-  description: "Stored but incorrect value",
-  icon: _sharedUi.XCircle,
-  color: "#F97316",
-  textColor: "#F97316",
-  bgColor: "rgba(249, 115, 22, 0.1)"
-}, {
-  key: "wrongType",
-  label: "Wrong Types",
-  description: "Value has incorrect data type",
-  icon: _sharedUi.XCircle,
-  color: "#0891B2",
-  textColor: "#0891B2",
-  bgColor: "rgba(8, 145, 178, 0.1)"
-}, {
-  key: "optional",
-  label: "Optional Keys",
-  description: "Available but not required",
-  icon: _sharedUi.Eye,
-  color: "#8B5CF6",
-  textColor: "#8B5CF6",
-  bgColor: "rgba(139, 92, 246, 0.1)"
-}];
-
-// Storage type breakdown data
-const storageTypeData = [{
-  key: "mmkv",
-  label: "MMKV",
-  description: "High-performance key-value storage",
-  icon: _sharedUi.Database
-}, {
-  key: "async",
-  label: "AsyncStorage",
-  description: "React Native async storage",
-  icon: _sharedUi.Database
-}, {
-  key: "secure",
-  label: "SecureStorage",
-  description: "Encrypted secure storage",
-  icon: _sharedUi.Shield
-}];
-
-/**
- * Storage key stats component following composition principles [[rule3]]
- *
- * Applied principles:
- * - Decompose by Responsibility: Single purpose component for storage stats display
- * - Prefer Composition over Configuration: Reuses patterns from EnvVarStats
- * - Extract Reusable Logic: Shares visualization patterns with env vars
- */
-function StorageKeyStatsSection({
-  stats
-}) {
-  const {
-    totalCount,
-    missingCount,
-    wrongValueCount,
-    wrongTypeCount,
-    presentRequiredCount,
-    optionalCount,
-    mmkvCount,
-    asyncCount,
-    secureCount
-  } = stats;
-
-  // If no storage keys at all, show minimal stats
-  if (totalCount === 0) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: styles.statsContainer,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: styles.sectionTitle,
-        children: "STORAGE BREAKDOWN"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: styles.emptyState,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-          style: styles.emptyStateText,
-          children: "No storage keys detected"
-        })
-      })]
-    });
-  }
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-    style: styles.statsContainer,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: styles.breakdownSection,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: styles.sectionTitle,
-        children: "KEY STATUS BREAKDOWN"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: styles.breakdownList,
-        children: variableTypeData.map(item => {
-          let count = 0;
-          let shouldShow = false;
-          switch (item.key) {
-            case "valid":
-              count = presentRequiredCount;
-              shouldShow = count > 0;
-              break;
-            case "missing":
-              count = missingCount;
-              shouldShow = count > 0;
-              break;
-            case "wrongValue":
-              count = wrongValueCount;
-              shouldShow = count > 0;
-              break;
-            case "wrongType":
-              count = wrongTypeCount;
-              shouldShow = count > 0;
-              break;
-            case "optional":
-              count = optionalCount;
-              shouldShow = count > 0;
-              break;
-          }
-          if (!shouldShow) return null;
-          const percentage = totalCount > 0 ? (count / totalCount * 100).toFixed(1) : "0";
-          const IconComponent = item.icon;
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-            style: styles.breakdownItem,
-            children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-              style: styles.breakdownItemRow,
-              children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-                style: styles.breakdownItemLeft,
-                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-                  style: [styles.breakdownIcon, {
-                    backgroundColor: item.bgColor
-                  }],
-                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconComponent, {
-                    size: 14,
-                    color: item.color
-                  })
-                }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-                  style: styles.breakdownItemInfo,
-                  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-                    style: styles.breakdownItemLabel,
-                    children: item.label
-                  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-                    style: styles.breakdownItemDesc,
-                    children: item.description
-                  })]
-                })]
-              }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-                style: styles.breakdownItemRight,
-                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-                  style: [styles.breakdownCount, {
-                    color: item.textColor
-                  }],
-                  children: count
-                }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
-                  style: styles.breakdownPercentage,
-                  children: [percentage, "%"]
-                })]
-              })]
-            })
-          }, item.key);
-        })
-      })]
-    }), (mmkvCount > 0 || asyncCount > 0 || secureCount > 0) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-      style: styles.breakdownSection,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-        style: styles.sectionTitle,
-        children: "STORAGE TYPE BREAKDOWN"
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-        style: styles.breakdownList,
-        children: storageTypeData.map(item => {
-          let count = 0;
-          let shouldShow = false;
-          switch (item.key) {
-            case "mmkv":
-              count = mmkvCount;
-              shouldShow = count > 0;
-              break;
-            case "async":
-              count = asyncCount;
-              shouldShow = count > 0;
-              break;
-            case "secure":
-              count = secureCount;
-              shouldShow = count > 0;
-              break;
-          }
-          if (!shouldShow) return null;
-          const percentage = totalCount > 0 ? (count / totalCount * 100).toFixed(1) : "0";
-          const IconComponent = item.icon;
-          const storageColor = (0, _storageQueryUtils.getStorageTypeHexColor)(item.key);
-          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-            style: styles.breakdownItem,
-            children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-              style: styles.breakdownItemRow,
-              children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-                style: styles.breakdownItemLeft,
-                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-                  style: [styles.breakdownIcon, {
-                    backgroundColor: `${storageColor}15`
-                  }],
-                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconComponent, {
-                    size: 14,
-                    color: storageColor
-                  })
-                }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-                  style: styles.breakdownItemInfo,
-                  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-                    style: styles.breakdownItemLabel,
-                    children: item.label
-                  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-                    style: styles.breakdownItemDesc,
-                    children: item.description
-                  })]
-                })]
-              }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
-                style: styles.breakdownItemRight,
-                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
-                  style: [styles.breakdownCount, {
-                    color: storageColor
-                  }],
-                  children: count
-                }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
-                  style: styles.breakdownPercentage,
-                  children: [percentage, "%"]
-                })]
-              })]
-            })
-          }, item.key);
-        })
-      })]
-    })]
-  });
-}
-const styles = _reactNative.StyleSheet.create({
-  statsContainer: {
-    marginBottom: 24,
-    backgroundColor: _sharedUi.night.color.surface,
-    borderRadius: 8,
-    padding: 16,
-    borderWidth: 1,
-    borderColor: _sharedUi.night.color.border
-  },
-  // Section titles
-  sectionTitle: {
-    color: _sharedUi.night.color.textSecondary,
-    fontSize: 12,
-    fontWeight: "500",
-    marginBottom: 16,
-    textTransform: "uppercase",
-    letterSpacing: 0.5
-  },
-  // Breakdown section
-  breakdownSection: {
-    gap: 12,
-    marginBottom: 20
-  },
-  breakdownList: {
-    gap: 12
-  },
-  breakdownItem: {
-    backgroundColor: _sharedUi.night.color.surfaceElevated,
-    padding: 12,
-    borderRadius: 8,
-    borderWidth: 1,
-    borderColor: _sharedUi.night.color.border
-  },
-  breakdownItemRow: {
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between"
-  },
-  breakdownItemLeft: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 12,
-    flex: 1,
-    minWidth: 0
-  },
-  breakdownIcon: {
-    padding: 8,
-    borderRadius: 8
-  },
-  breakdownItemInfo: {
-    flex: 1,
-    minWidth: 0
-  },
-  breakdownItemLabel: {
-    color: _sharedUi.night.color.text,
-    fontSize: 14,
-    fontWeight: "500"
-  },
-  breakdownItemDesc: {
-    color: _sharedUi.night.color.textSecondary,
-    fontSize: 12
-  },
-  breakdownItemRight: {
-    alignItems: "flex-end"
-  },
-  breakdownCount: {
-    fontSize: 16,
-    fontWeight: "600"
-  },
-  breakdownPercentage: {
-    color: _sharedUi.night.color.textTertiary,
-    fontSize: 10
-  },
-  // Empty state
-  emptyState: {
-    padding: 16,
-    backgroundColor: _sharedUi.night.color.surfaceElevated,
-    borderRadius: 6,
-    alignItems: "center"
-  },
-  emptyStateText: {
-    color: _sharedUi.night.color.textTertiary,
-    fontSize: 11,
-    textAlign: "center"
-  }
-});
+"use strict";Object.defineProperty(exports,"__esModule",{value:true});exports.StorageKeyStatsSection=StorageKeyStatsSection;var _storageLabels=require("../utils/storageLabels");var _reactNative=require("react-native");var _sharedUi=require("@buoy-gg/shared-ui");var _storageQueryUtils=require("../utils/storageQueryUtils");var _jsxRuntime=require("react/jsx-runtime");const variableTypeData=[{key:"valid",label:"Valid Keys",description:"Correctly stored and accessible",icon:_sharedUi.CheckCircle2,color:"#10B981",textColor:"#10B981",bgColor:"rgba(16, 185, 129, 0.1)"},{key:"missing",label:"Missing Keys",description:"Required but not found",icon:_sharedUi.AlertCircle,color:"#EF4444",textColor:"#EF4444",bgColor:"rgba(239, 68, 68, 0.1)"},{key:"wrongValue",label:"Wrong Values",description:"Stored but incorrect value",icon:_sharedUi.XCircle,color:"#F97316",textColor:"#F97316",bgColor:"rgba(249, 115, 22, 0.1)"},{key:"wrongType",label:"Wrong Types",description:"Value has incorrect data type",icon:_sharedUi.XCircle,color:"#0891B2",textColor:"#0891B2",bgColor:"rgba(8, 145, 178, 0.1)"},{key:"optional",label:"Optional Keys",description:"Available but not required",icon:_sharedUi.Eye,color:"#8B5CF6",textColor:"#8B5CF6",bgColor:"rgba(139, 92, 246, 0.1)"}];const storageTypeData=[{key:"mmkv",label:_storageLabels.storageLabels.mmkv,description:_storageLabels.storageLabels.hasSecure?"Synchronous key-value storage":"Storage for this browser tab",icon:_sharedUi.Database},{key:"async",label:_storageLabels.storageLabels.asyncFull,description:_storageLabels.storageLabels.hasSecure?"React Native async storage":"Persistent storage for this origin",icon:_sharedUi.Database},{key:"secure",label:"SecureStorage",description:"Encrypted secure storage",icon:_sharedUi.Shield}];function StorageKeyStatsSection({stats:d}){const{totalCount:r,missingCount:b,wrongValueCount:g,wrongTypeCount:y,presentRequiredCount:u,optionalCount:w,mmkvCount:l,asyncCount:i,secureCount:c}=d;if(r===0){return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.statsContainer,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.sectionTitle,children:"STORAGE BREAKDOWN"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.emptyState,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.emptyStateText,children:"No storage keys detected"})})]})}return(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.statsContainer,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.breakdownSection,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.sectionTitle,children:"KEY STATUS BREAKDOWN"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.breakdownList,children:variableTypeData.map(t=>{let e=0;let o=false;switch(t.key){case"valid":e=u;o=e>0;break;case"missing":e=b;o=e>0;break;case"wrongValue":e=g;o=e>0;break;case"wrongType":e=y;o=e>0;break;case"optional":e=w;o=e>0;break}if(!o)return null;const n=r>0?(e/r*100).toFixed(1):"0";const s=t.icon;return(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.breakdownItem,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.breakdownItemRow,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.breakdownItemLeft,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.breakdownIcon,{backgroundColor:t.bgColor}],children:(0,_jsxRuntime.jsx)(s,{size:14,color:t.color})}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.breakdownItemInfo,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.breakdownItemLabel,children:t.label}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.breakdownItemDesc,children:t.description})]})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.breakdownItemRight,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.breakdownCount,{color:t.textColor}],children:e}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.breakdownPercentage,children:[n,"%"]})]})]})},t.key)})})]}),(l>0||i>0||c>0)&&(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.breakdownSection,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.sectionTitle,children:"STORAGE TYPE BREAKDOWN"}),(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.breakdownList,children:storageTypeData.map(t=>{let e=0;let o=false;switch(t.key){case"mmkv":e=l;o=e>0;break;case"async":e=i;o=e>0;break;case"secure":e=c;o=e>0;break}if(!o)return null;const n=r>0?(e/r*100).toFixed(1):"0";const s=t.icon;const a=(0,_storageQueryUtils.getStorageTypeHexColor)(t.key);return(0,_jsxRuntime.jsx)(_reactNative.View,{style:styles.breakdownItem,children:(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.breakdownItemRow,children:[(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.breakdownItemLeft,children:[(0,_jsxRuntime.jsx)(_reactNative.View,{style:[styles.breakdownIcon,{backgroundColor:`${a}15`}],children:(0,_jsxRuntime.jsx)(s,{size:14,color:a})}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.breakdownItemInfo,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.breakdownItemLabel,children:t.label}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.breakdownItemDesc,children:t.description})]})]}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.breakdownItemRight,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:[styles.breakdownCount,{color:a}],children:e}),(0,_jsxRuntime.jsxs)(_reactNative.Text,{style:styles.breakdownPercentage,children:[n,"%"]})]})]})},t.key)})})]})]})}const styles=_reactNative.StyleSheet.create({statsContainer:{marginBottom:24,backgroundColor:_sharedUi.night.color.surface,borderRadius:8,padding:16,borderWidth:1,borderColor:_sharedUi.night.color.border},sectionTitle:{color:_sharedUi.night.color.textSecondary,fontSize:12,fontWeight:"500",marginBottom:16,textTransform:"uppercase",letterSpacing:.5},breakdownSection:{gap:12,marginBottom:20},breakdownList:{gap:12},breakdownItem:{backgroundColor:_sharedUi.night.color.surfaceElevated,padding:12,borderRadius:8,borderWidth:1,borderColor:_sharedUi.night.color.border},breakdownItemRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},breakdownItemLeft:{flexDirection:"row",alignItems:"center",gap:12,flex:1,minWidth:0},breakdownIcon:{padding:8,borderRadius:8},breakdownItemInfo:{flex:1,minWidth:0},breakdownItemLabel:{color:_sharedUi.night.color.text,fontSize:14,fontWeight:"500"},breakdownItemDesc:{color:_sharedUi.night.color.textSecondary,fontSize:12},breakdownItemRight:{alignItems:"flex-end"},breakdownCount:{fontSize:16,fontWeight:"600"},breakdownPercentage:{color:_sharedUi.night.color.textTertiary,fontSize:10},emptyState:{padding:16,backgroundColor:_sharedUi.night.color.surfaceElevated,borderRadius:6,alignItems:"center"},emptyStateText:{color:_sharedUi.night.color.textTertiary,fontSize:11,textAlign:"center"}});