react-native-inapp-inspector 2.4.0 → 2.4.1

package/dist/esm/components/Inspector/ReduxTab.js

@@ -1,11 +1,11 @@
-import Le,{useCallback as Pe,useMemo as N,useRef as De,useState as _}from"react";import{FlatList as Fe,Platform as Y,Pressable as Ce,StyleSheet as We,Text as S,TextInput as Oe,TouchableOpacity as Ee,View as C}from"react-native";import{useTranslation as je}from"../../i18n";import{useInspector as Me}from"./InspectorContext";import Ne from"../TouchableScale";import $e from"../AnimatedEntrance";import Ue from"../EmptyState";import Ge from"../EndOfListFooter";import Te from"../HighlightText";import{getSize as Se,openInVSCode as Ke,getCleanCallerDisplay as Ze}from"../../helpers";import E from"../../styles";import{AppColors as e}from"../../styles/AppColors";import{AppFonts as z}from"../../styles/AppFonts";import{getActionHistory as qe}from"../../customHooks/reduxLogger";import{TerminalIcon as Ie,SearchIcon as Je,ClearIcon as Qe,LayersIcon as Xe,ClockIcon as _e,SizeIcon as Ye,ForwardChevronIcon as Ct,SortArrowIcon as Tt,BoltIcon as U,AtomIcon as St,ScreenIcon as It,ListenerIcon as Rt,DocIcon as At,LoadingSpinnerIcon as Vt,CircleAlertIcon as Ht,TextAaIcon as Bt}from"../NetworkIcons";const Re=L=>{switch(L){case"saga":return{label:"SAGA",renderIcon:(R,A=9)=><U color={R}size={A}/>,bg:e.purple100,text:e.brandPurple,border:e.purple200};case"thunk":return{label:"THUNK",renderIcon:(R,A=9)=><St color={R}size={A}/>,bg:e.amber100,text:e.amber800Warm,border:e.amber200};case"ui":return{label:"UI",renderIcon:(R,A=9)=><It color={R}size={A}/>,bg:e.sky100,text:e.sky600,border:e.sky400};case"listener":return{label:"LISTENER",renderIcon:(R,A=9)=><Rt color={R}size={A}/>,bg:e.teal100,text:e.teal700,border:e.teal400};default:return{label:"DIRECT",renderIcon:(R,A=9)=><U color={R}size={A}/>,bg:e.slate100,text:e.slate700,border:e.slate200}}},Lt=Le.memo(()=>{const{t:L}=je(),{reduxState:R,reduxLastActionMap:A,reduxSearch:k,setReduxSearch:G,setSelectedReduxSlice:Z}=Me(),ze=De(null),[q,Ae]=_(100),[F,ke]=_("latest"),Ve=N(()=>Se(R),[R]),J=N(()=>qe(),[A]),$=N(()=>!R||typeof R!="object"?[]:Object.keys(R).map(I=>{const T=R[I],H=Array.isArray(T),M=T&&typeof T=="object";let D="Primitive",B=0;H?(B=T.length,D=`Array [${B}]`):M?(B=Object.keys(T).length,D=`Object {${B}}`):typeof T<"u"&&(B=1,D=typeof T);let W="live",v;M&&(T.loading===!0||T.isLoading===!0||T.status==="loading"||T.status==="pending"?(W="loading",v="Loading"):T.error||T.hasError||T.status==="error"||T.status==="failed"?(W="error",v=typeof T.error=="string"?T.error:"Error"):B===0&&(W="empty",v="Empty"));const V=A[I],He=V?.updatedAt||0,Be=J.filter(O=>!O.affectedSlices||O.affectedSlices.length===0?!0:O.affectedSlices.includes(I)).length;let Q;if(V){let O;if(V.payload!==void 0&&V.payload!==null)try{if(typeof V.payload=="object"){const X=Object.keys(V.payload);O=`{ ${X.slice(0,3).join(", ")}${X.length>3?"...":""} }`}else O=String(V.payload)}catch{}Q={type:V.type,timestamp:V.timestamp,updatedAt:V.updatedAt,payloadPreview:O,originType:V.originType,callerFile:V.callerFile,callerLine:V.callerLine,callerCol:V.callerCol}}return{id:`slice-${I}`,name:I,keysCount:B,sizeStr:Se(T),typeLabel:D,status:W,statusMessage:v,timelineCount:Be,lastAction:Q,updatedAt:He}}),[R,A,J]),P=N(()=>{let t=$;if(k&&k.trim().length>0){const I=k.trim().toLowerCase().split(/\s+/).filter(Boolean);t=t.filter(T=>{const H=R?R[T.name]:null,M=[T.name||"",T.lastAction?.type||"",T.lastAction?.payloadPreview||"",T.lastAction?.originType||"",T.status||"",T.statusMessage||"",H?typeof H=="string"?H:JSON.stringify(H):""].join(" ").toLowerCase();return I.every(D=>M.includes(D))})}return[...t].sort((I,T)=>F==="latest"&&T.updatedAt!==I.updatedAt?T.updatedAt-I.updatedAt:I.name.localeCompare(T.name))},[$,k,F,R]),K=N(()=>P.slice(0,q),[P,q]),j=N(()=>{const t=Object.values(A);return t.length===0?null:t.reduce((I,T)=>I?(T.updatedAt||0)>(I.updatedAt||0)?T:I:T,null)},[A]),ve=Pe(({item:t,index:I})=>{const T=t.updatedAt>0&&Date.now()-t.updatedAt<5e3,H=t.status==="error"?e.errorColor:t.status==="loading"?e.warningIconGold:t.status==="empty"?e.grayTextWeak:e.greenColor,M=t.status==="error"?e.red100:t.status==="loading"?e.amber100:t.status==="empty"?e.grayBackground:e.emeraldBg,D=t.status==="error"?e.errorBorder:t.status==="loading"?e.amber200:t.status==="empty"?e.dividerColor:e.emeraldBorder,B=t.status==="error"?e.red600:t.status==="loading"?e.amber800Warm:t.status==="empty"?e.grayTextWeak:e.emerald700,W=t.lastAction?.callerFile?Ze(t.lastAction.callerFile):null;return<$e index={I}distance={8}>
+import ee,{useCallback as Be,useMemo as N,useRef as Pe,useState as te}from"react";import{FlatList as De,Platform as oe,Pressable as Ce,StyleSheet as Fe,Text as S,TextInput as Ee,TouchableOpacity as We,View as C}from"react-native";import{useTranslation as Oe}from"../../i18n";import{useInspector as Me}from"./InspectorContext";import Ne from"../TouchableScale";import $e from"../AnimatedEntrance";import Ue from"../EmptyState";import Ge from"../EndOfListFooter";import Te from"../HighlightText";import{getSize as Se,openInVSCode as _e,getCleanCallerDisplay as Ze}from"../../helpers";import O from"../../styles";import{AppColors as e}from"../../styles/AppColors";import{AppFonts as R}from"../../styles/AppFonts";import{getActionHistory as Ke}from"../../customHooks/reduxLogger";import{TerminalIcon as Ae,SearchIcon as Je,ClearIcon as Qe,LayersIcon as Xe,ClockIcon as Ye,SizeIcon as Ct,ForwardChevronIcon as Tt,SortArrowIcon as St,BoltIcon as U,AtomIcon as At,ScreenIcon as It,ListenerIcon as Rt,DocIcon as Vt,LoadingSpinnerIcon as Ht,CircleAlertIcon as Lt,TextAaIcon as Bt}from"../NetworkIcons";const Ie=B=>{switch(B){case"saga":return{label:"SAGA",renderIcon:(I,z=9)=><U color={I}size={z}/>,bg:e.purple100,text:e.brandPurple,border:e.purple200};case"thunk":return{label:"THUNK",renderIcon:(I,z=9)=><At color={I}size={z}/>,bg:e.amber100,text:e.amber800Warm,border:e.amber200};case"ui":return{label:"UI",renderIcon:(I,z=9)=><It color={I}size={z}/>,bg:e.sky100,text:e.sky600,border:e.sky400};case"listener":return{label:"LISTENER",renderIcon:(I,z=9)=><Rt color={I}size={z}/>,bg:e.teal100,text:e.teal700,border:e.teal400};default:return{label:"DIRECT",renderIcon:(I,z=9)=><U color={I}size={z}/>,bg:e.slate100,text:e.slate700,border:e.slate200}}},Re=50,ze=10,Pt=ee.memo(()=>{const{t:B}=Oe(),{reduxState:I,reduxLastActionMap:z,reduxSearch:k,setReduxSearch:G,setSelectedReduxSlice:Z}=Me(),K=Pe(null),[q,J]=te(Re),[P,ke]=te("latest");ee.useEffect(()=>{J(Re),K.current?.scrollToOffset({offset:0,animated:!1})},[k,P]);const Ve=N(()=>Se(I),[I]),Q=N(()=>Ke(),[z]),$=N(()=>!I||typeof I!="object"?[]:Object.keys(I).map(A=>{const T=I[A],H=Array.isArray(T),j=T&&typeof T=="object";let F="Primitive",L=0;H?(L=T.length,F=`Array [${L}]`):j?(L=Object.keys(T).length,F=`Object {${L}}`):typeof T<"u"&&(L=1,F=typeof T);let E="live",v;j&&(T.loading===!0||T.isLoading===!0||T.status==="loading"||T.status==="pending"?(E="loading",v="Loading"):T.error||T.hasError||T.status==="error"||T.status==="failed"?(E="error",v=typeof T.error=="string"?T.error:"Error"):L===0&&(E="empty",v="Empty"));const V=z[A],He=V?.updatedAt||0,Le=Q.filter(W=>!W.affectedSlices||W.affectedSlices.length===0?!0:W.affectedSlices.includes(A)).length;let X;if(V){let W;if(V.payload!==void 0&&V.payload!==null)try{if(typeof V.payload=="object"){const Y=Object.keys(V.payload);W=`{ ${Y.slice(0,3).join(", ")}${Y.length>3?"...":""} }`}else W=String(V.payload)}catch{}X={type:V.type,timestamp:V.timestamp,updatedAt:V.updatedAt,payloadPreview:W,originType:V.originType,callerFile:V.callerFile,callerLine:V.callerLine,callerCol:V.callerCol}}return{id:`slice-${A}`,name:A,keysCount:L,sizeStr:Se(T),typeLabel:F,status:E,statusMessage:v,timelineCount:Le,lastAction:X,updatedAt:He}}),[I,z,Q]),D=N(()=>{let t=$;if(k&&k.trim().length>0){const A=k.trim().toLowerCase().split(/\s+/).filter(Boolean);t=t.filter(T=>{const H=I?I[T.name]:null,j=[T.name||"",T.lastAction?.type||"",T.lastAction?.payloadPreview||"",T.lastAction?.originType||"",T.status||"",T.statusMessage||"",H?typeof H=="string"?H:JSON.stringify(H):""].join(" ").toLowerCase();return A.every(F=>j.includes(F))})}return[...t].sort((A,T)=>P==="latest"&&T.updatedAt!==A.updatedAt?T.updatedAt-A.updatedAt:A.name.localeCompare(T.name))},[$,k,P,I]),_=N(()=>D.slice(0,q),[D,q]),M=N(()=>{const t=Object.values(z);return t.length===0?null:t.reduce((A,T)=>A?(T.updatedAt||0)>(A.updatedAt||0)?T:A:T,null)},[z]),ve=Be(({item:t,index:A})=>{const T=t.updatedAt>0&&Date.now()-t.updatedAt<5e3,H=t.status==="error"?e.errorColor:t.status==="loading"?e.warningIconGold:t.status==="empty"?e.grayTextWeak:e.greenColor,j=t.status==="error"?e.red100:t.status==="loading"?e.amber100:t.status==="empty"?e.grayBackground:e.emeraldBg,F=t.status==="error"?e.errorBorder:t.status==="loading"?e.amber200:t.status==="empty"?e.dividerColor:e.emeraldBorder,L=t.status==="error"?e.red600:t.status==="loading"?e.amber800Warm:t.status==="empty"?e.grayTextWeak:e.emerald700,E=t.lastAction?.callerFile?Ze(t.lastAction.callerFile):null;return<$e index={A}distance={8}>
           <C style={o.cardContainer}>
             <Ne onPress={()=>{Z(t.name)}}style={[o.card,{borderLeftWidth:3.5,borderLeftColor:H,backgroundColor:t.status==="error"?e.errorCardBg:e.white},T&&o.cardRecentlyUpdated]}>
               <C style={o.cardBody}>
                 
                 <C style={o.cardHeaderRow}>
                   <C style={o.cardHeaderLeft}>
-                    <S style={o.serialNumber}>#{I+1}</S>
+                    <S style={o.serialNumber}>#{A+1}</S>
                     <C style={[o.methodBadge,{backgroundColor:e.violet600}]}>
                       <S style={o.methodBadgeText}>REDUX</S>
                     </C>
@@ -15,7 +15,7 @@ import Le,{useCallback as Pe,useMemo as N,useRef as De,useState as _}from"react"
                       </S>
                     </C>
 
-                    {t.lastAction?.originType&&(()=>{const v=Re(t.lastAction.originType);return<C style={[o.chip,{backgroundColor:v.bg,borderColor:v.border}]}>
+                    {t.lastAction?.originType&&(()=>{const v=Ie(t.lastAction.originType);return<C style={[o.chip,{backgroundColor:v.bg,borderColor:v.border}]}>
                           {v.renderIcon(v.text,8.5)}
                           <S style={[o.chipText,{color:v.text}]}>
                             {v.label}
@@ -24,13 +24,13 @@ import Le,{useCallback as Pe,useMemo as N,useRef as De,useState as _}from"react"
                   </C>
 
                   <C style={o.cardHeaderRight}>
-                    <C style={[o.statusPill,{backgroundColor:M,borderColor:D}]}>
-                      {t.status==="loading"?<Vt color={e.amber800Warm}size={10}/>:t.status==="error"?<Ht color={e.red600}size={10}/>:t.status==="empty"?null:<C style={o.liveDot}/>}
-                      <S style={[o.statusPillText,{color:B}]}>
+                    <C style={[o.statusPill,{backgroundColor:j,borderColor:F}]}>
+                      {t.status==="loading"?<Ht color={e.amber800Warm}size={10}/>:t.status==="error"?<Lt color={e.red600}size={10}/>:t.status==="empty"?null:<C style={o.liveDot}/>}
+                      <S style={[o.statusPillText,{color:L}]}>
                         {t.status==="loading"?"Loading":t.status==="error"?t.statusMessage||"Error":t.status==="empty"?"Empty":"Live"}
                       </S>
                     </C>
-                    <Ct color={e.grayTextWeak}size={13}/>
+                    <Tt color={e.grayTextWeak}size={13}/>
                   </C>
                 </C>
 
@@ -46,7 +46,7 @@ import Le,{useCallback as Pe,useMemo as N,useRef as De,useState as _}from"react"
                       </C>}
                   </C>
                   <C style={o.actionPreviewRow}>
-                    <Ie color={e.grayTextWeak}size={10}/>
+                    <Ae color={e.grayTextWeak}size={10}/>
                     {t.lastAction?<Te text={t.lastAction.type+(t.lastAction.payloadPreview?` \xB7 ${t.lastAction.payloadPreview}`:"")}search={k}style={o.actionPreviewText}highlightStyle={o.highlight}numberOfLines={1}/>:<S style={o.actionPreviewEmptyText}numberOfLines={1}>
                         Initial state (no actions dispatched yet)
                       </S>}
@@ -56,21 +56,21 @@ import Le,{useCallback as Pe,useMemo as N,useRef as De,useState as _}from"react"
                 
                 <C style={o.cardFooterRow}>
                   <C style={o.footerLeft}>
-                    <_e color={e.grayTextWeak}size={10}/>
+                    <Ye color={e.grayTextWeak}size={10}/>
                     <S style={o.footerTimestampText}numberOfLines={1}>
                       {t.lastAction?.timestamp||"Initial state"}
                     </S>
-                    {W&&<Ce onPress={()=>Ke(t.lastAction.callerFile,t.lastAction.callerLine,t.lastAction.callerCol)}hitSlop={6}style={o.callerChip}>
-                        <At color={e.sky600}size={9}/>
+                    {E&&<Ce onPress={()=>_e(t.lastAction.callerFile,t.lastAction.callerLine,t.lastAction.callerCol)}hitSlop={6}style={o.callerChip}>
+                        <Vt color={e.sky600}size={9}/>
                         <S style={o.callerChipText}>
-                          {W.display}
+                          {E.display}
                         </S>
                       </Ce>}
                   </C>
 
                   <C style={o.footerRight}>
                     <C style={o.metaStatChip}>
-                      <Ye color={e.violet600}size={9.5}/>
+                      <Ct color={e.violet600}size={9.5}/>
                       <S style={o.metaStatText}>
                         {t.sizeStr}
                       </S>
@@ -91,34 +91,34 @@ import Le,{useCallback as Pe,useMemo as N,useRef as De,useState as _}from"react"
               </C>
             </Ne>
           </C>
-        </$e>},[k,Z]);return R?<C style={{flex:1,backgroundColor:e.grayBackground}}>
+        </$e>},[k,Z]);return I?<C style={{flex:1,backgroundColor:e.grayBackground}}>
       
       <C style={o.overviewCard}>
         <C style={o.statCol}>
-          <S style={o.statHeading}>{L("redux.activeSlices","ACTIVE SLICES")}</S>
+          <S style={o.statHeading}>{B("redux.activeSlices","ACTIVE SLICES")}</S>
           <S style={o.statBigVal}>{$.length}</S>
         </C>
         <C style={o.statDivider}/>
         <C style={o.statCol}>
-          <S style={o.statHeading}>{L("redux.totalState","TOTAL STATE")}</S>
+          <S style={o.statHeading}>{B("redux.totalState","TOTAL STATE")}</S>
           <S style={o.statBigVal}>{Ve}</S>
         </C>
         <C style={o.statDivider}/>
         <C style={[o.statCol,{flex:1.6}]}>
           <C style={{flexDirection:"row",alignItems:"center",gap:4}}>
-            <S style={o.statHeading}>{L("redux.lastActionHeader","LAST ACTION")}</S>
-            {j?.originType&&(()=>{const t=Re(j.originType);return<C style={{flexDirection:"row",alignItems:"center",gap:2,backgroundColor:t.bg,paddingHorizontal:4,paddingVertical:1,borderRadius:3}}>
+            <S style={o.statHeading}>{B("redux.lastActionHeader","LAST ACTION")}</S>
+            {M?.originType&&(()=>{const t=Ie(M.originType);return<C style={{flexDirection:"row",alignItems:"center",gap:2,backgroundColor:t.bg,paddingHorizontal:4,paddingVertical:1,borderRadius:3}}>
                   {t.renderIcon(t.text,8)}
-                  <S style={{fontFamily:z.interBold,fontSize:7.5,color:t.text}}>
+                  <S style={{fontFamily:R.interBold,fontSize:7.5,color:t.text}}>
                     {t.label}
                   </S>
                 </C>})()}
           </C>
           <S style={o.statLastAction}numberOfLines={1}>
-            {j?j.type:"Initial"}
+            {M?M.type:"Initial"}
           </S>
-          {j?.timestamp&&<S style={o.statLastTime}>
-              {j.timestamp}
+          {M?.timestamp&&<S style={o.statLastTime}>
+              {M.timestamp}
             </S>}
         </C>
       </C>
@@ -126,13 +126,13 @@ import Le,{useCallback as Pe,useMemo as N,useRef as De,useState as _}from"react"
       
       <C style={o.toolbarContainer}>
         <C style={o.searchRow}>
-          <C style={E.searchContainer}>
+          <C style={O.searchContainer}>
             <Je color={e.grayTextWeak}size={15}/>
-            <Oe accessible={!0}accessibilityRole="search"accessibilityLabel="Search Redux slices or actions"accessibilityHint="Type to filter state slices in real time"placeholder={L("redux.searchPlaceholder","Search state or actions...")}placeholderTextColor={e.grayTextWeak}value={k}onChangeText={G}style={E.searchInput}autoCorrect={!1}autoCapitalize="none"/>
+            <Ee accessible={!0}accessibilityRole="search"accessibilityLabel="Search Redux slices or actions"accessibilityHint="Type to filter state slices in real time"placeholder={B("redux.searchPlaceholder","Search state or actions...")}placeholderTextColor={e.grayTextWeak}value={k}onChangeText={G}style={O.searchInput}autoCorrect={!1}autoCapitalize="none"/>
             {k.length>0&&<C style={{flexDirection:"row",alignItems:"center",gap:4}}>
                 <C style={{backgroundColor:`${e.purple}20`,borderRadius:10,paddingHorizontal:6,paddingVertical:1.5}}>
-                  <S style={{color:e.purple,fontSize:9.5,fontFamily:z.interBold}}>
-                    {P.length}
+                  <S style={{color:e.purple,fontSize:9.5,fontFamily:R.interBold}}>
+                    {D.length}
                   </S>
                 </C>
                 <Ce accessible={!0}accessibilityRole="button"accessibilityLabel="Clear search input"onPress={()=>G("")}hitSlop={10}>
@@ -142,32 +142,32 @@ import Le,{useCallback as Pe,useMemo as N,useRef as De,useState as _}from"react"
           </C>
 
           
-          <Ee accessible={!0}accessibilityRole="button"accessibilityLabel={`Sort order: ${F==="latest"?"Recently updated first":"Alphabetical A to Z"}`}accessibilityHint="Switches sorting between recently updated and alphabetical"style={[E.toolbarBtn,F==="latest"&&{backgroundColor:`${e.brandPurple}1F`,borderColor:e.brandPurple}]}onPress={()=>ke(t=>t==="latest"?"alpha":"latest")}hitSlop={6}>
-            <Tt color={F==="latest"?e.brandPurple:e.grayTextStrong}size={16}/>
-          </Ee>
+          <We accessible={!0}accessibilityRole="button"accessibilityLabel={`Sort order: ${P==="latest"?"Recently updated first":"Alphabetical A to Z"}`}accessibilityHint="Switches sorting between recently updated and alphabetical"style={[O.toolbarBtn,P==="latest"&&{backgroundColor:`${e.brandPurple}1F`,borderColor:e.brandPurple}]}onPress={()=>ke(t=>t==="latest"?"alpha":"latest")}hitSlop={6}>
+            <St color={P==="latest"?e.brandPurple:e.grayTextStrong}size={16}/>
+          </We>
         </C>
 
         <C style={o.headerSubRow}>
           <S style={o.resultCount}>
-            Showing {P.length} of {$.length} state slices
+            Showing {D.length} of {$.length} state slices
           </S>
           <C style={{flexDirection:"row",alignItems:"center",gap:4}}>
-            {F==="latest"?<U color={e.brandPurple}size={11}/>:<Bt color={e.brandPurple}size={11}/>}
+            {P==="latest"?<U color={e.brandPurple}size={11}/>:<Bt color={e.brandPurple}size={11}/>}
             <S style={o.sortLabel}>
-              {F==="latest"?"Newest Updates First":"Alphabetical (A-Z)"}
+              {P==="latest"?"Newest Updates First":"Alphabetical (A-Z)"}
             </S>
           </C>
         </C>
       </C>
 
       
-      <Fe ref={ze}data={K}keyExtractor={t=>t.id}renderItem={ve}getItemLayout={(t,I)=>({length:126,offset:126*I,index:I})}initialNumToRender={12}maxToRenderPerBatch={8}windowSize={5}removeClippedSubviews={Y.OS==="android"}renderToHardwareTextureAndroid={!0}ListEmptyComponent={<Ue isSearch={k.trim().length>0}searchQuery={k}onClearSearch={()=>G("")}customTitle={k.trim().length>0?"No Matching Slices":"No Redux State Detected"}customSub={k.trim().length>0?`No Redux slices match "${k}"`:"Attach the Redux store or dispatch actions to see state slices."}/>}ListFooterComponent={P.length>0?<Ge count={K.length}totalCount={P.length}label="slices"hasMore={K.length<P.length}onLoadMore={()=>Ae(t=>t+10)}/>:null}contentContainerStyle={[o.listContent,P.length===0&&{flexGrow:1}]}keyboardShouldPersistTaps="handled"/>
-    </C>:<C style={E.emptyContainer}>
-        <C style={E.emptyIconWrap}>
-          <Ie color={e.purple}size={32}/>
+      <De ref={K}data={_}keyExtractor={t=>t.id}renderItem={ve}getItemLayout={(t,A)=>({length:126,offset:126*A,index:A})}initialNumToRender={12}maxToRenderPerBatch={8}windowSize={5}removeClippedSubviews={oe.OS==="android"}renderToHardwareTextureAndroid={!0}ListEmptyComponent={<Ue isSearch={k.trim().length>0}searchQuery={k}onClearSearch={()=>G("")}customTitle={k.trim().length>0?"No Matching Slices":"No Redux State Detected"}customSub={k.trim().length>0?`No Redux slices match "${k}"`:"Attach the Redux store or dispatch actions to see state slices."}/>}ListFooterComponent={D.length>0?<Ge count={_.length}totalCount={D.length}label="slices"loadMoreStep={ze}hasMore={_.length<D.length}onLoadMore={()=>J(t=>t+ze)}/>:null}contentContainerStyle={[o.listContent,D.length===0&&{flexGrow:1}]}keyboardShouldPersistTaps="handled"/>
+    </C>:<C style={O.emptyContainer}>
+        <C style={O.emptyIconWrap}>
+          <Ae color={e.purple}size={32}/>
         </C>
-        <S style={E.emptyTitle}>{L("redux.noStoreConnected","No Redux Store Connected")}</S>
-        <S style={E.emptySub}>
-          {L("redux.connectStoreTip","Call connectReduxStore(store) or use inspectorReduxMiddleware at app initialization.")}
+        <S style={O.emptyTitle}>{B("redux.noStoreConnected","No Redux Store Connected")}</S>
+        <S style={O.emptySub}>
+          {B("redux.connectStoreTip","Call connectReduxStore(store) or use inspectorReduxMiddleware at app initialization.")}
         </S>
-      </C>}),o=We.create({overviewCard:{flexDirection:"row",alignItems:"center",backgroundColor:e.white,marginHorizontal:12,marginTop:10,borderRadius:12,padding:12,borderWidth:1,borderColor:e.dividerColor,shadowColor:e.primaryBlack,shadowOffset:{width:0,height:1},shadowOpacity:.03,shadowRadius:3,elevation:1},statCol:{flex:1},statDivider:{width:1,height:28,backgroundColor:e.dividerColor,marginHorizontal:8},statHeading:{fontFamily:z.interBold,fontSize:9,color:e.grayTextWeak,letterSpacing:.5},statBigVal:{fontFamily:z.interBold,fontSize:14,color:e.primaryBlack,marginTop:2},statLastAction:{fontFamily:z.interBold,fontSize:11,color:e.purple,marginTop:2},statLastTime:{fontFamily:z.interRegular,fontSize:9.5,color:e.grayTextWeak},toolbarContainer:{backgroundColor:e.white,borderBottomWidth:1,borderBottomColor:e.dividerColor,paddingHorizontal:12,paddingTop:8,paddingBottom:6,marginTop:8},searchRow:{flexDirection:"row",alignItems:"center",gap:8},headerSubRow:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",marginTop:6,paddingHorizontal:2},resultCount:{fontFamily:z.interMedium,fontSize:11,color:e.grayTextWeak},sortLabel:{fontFamily:z.interMedium,fontSize:10.5,color:e.brandPurple},listContent:{paddingVertical:8,paddingBottom:36},cardContainer:{paddingHorizontal:10,paddingVertical:4,height:126},card:{backgroundColor:e.white,borderRadius:10,borderWidth:1,borderColor:e.grayBorderSecondary,shadowColor:e.shadowColorString,shadowOffset:{width:0,height:1},shadowOpacity:.05,shadowRadius:2.5,elevation:1.5,height:118,overflow:"hidden"},cardRecentlyUpdated:{borderColor:`${e.brandPurple}66`,backgroundColor:e.purpleTintBg},cardBody:{paddingHorizontal:12,paddingTop:9,paddingBottom:7,flex:1,justifyContent:"space-between"},cardHeaderRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",height:22,minHeight:22,maxHeight:22,gap:6},cardHeaderLeft:{flexDirection:"row",alignItems:"center",gap:6,flex:1,minWidth:0},cardHeaderRight:{flexDirection:"row",alignItems:"center",gap:6,flexShrink:0},serialNumber:{fontFamily:z.interBold,fontSize:10.5,lineHeight:13,color:e.grayTextWeak},methodBadge:{paddingHorizontal:5.5,paddingVertical:2,borderRadius:4,alignItems:"center",justifyContent:"center"},methodBadgeText:{fontFamily:z.interBold,color:e.white,fontSize:9,lineHeight:12,letterSpacing:.4},chip:{flexDirection:"row",alignItems:"center",gap:3,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4,borderWidth:1},chipText:{fontFamily:z.interBold,fontSize:8.5,lineHeight:11,letterSpacing:.3},statusPill:{flexDirection:"row",alignItems:"center",gap:3.5,paddingHorizontal:6,paddingVertical:2,borderRadius:4,borderWidth:1},liveDot:{width:6,height:6,borderRadius:3,backgroundColor:e.emerald500},statusPillText:{fontFamily:z.interBold,fontSize:9.5,lineHeight:12},cardMainRow:{height:48,minHeight:48,maxHeight:48,justifyContent:"space-between",gap:3},sliceNameRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",gap:6},sliceNameText:{fontFamily:z.interBold,fontSize:12.5,lineHeight:16,color:e.primaryBlack,flex:1},actionCountChip:{flexDirection:"row",alignItems:"center",gap:2.5,backgroundColor:`${e.violet600}14`,borderColor:`${e.violet600}2E`,borderWidth:1,paddingHorizontal:4.5,paddingVertical:1,borderRadius:3.5},actionCountChipText:{fontFamily:z.interBold,fontSize:8.5,lineHeight:11,color:e.violet600},actionPreviewRow:{flexDirection:"row",alignItems:"center",gap:4.5,minHeight:15},actionPreviewText:{fontFamily:Y.select({ios:"Menlo",default:"monospace"}),fontSize:10,lineHeight:13,color:e.grayTextWeak,flex:1},actionPreviewEmptyText:{fontFamily:z.interRegular,fontSize:10,lineHeight:13,color:e.slate400,fontStyle:"italic",flex:1},cardFooterRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",height:18,minHeight:18,maxHeight:18,gap:6},footerLeft:{flexDirection:"row",alignItems:"center",gap:5,flex:1,minWidth:0,overflow:"hidden"},footerRight:{flexDirection:"row",alignItems:"center",gap:5,flexShrink:0},footerTimestampText:{fontFamily:z.interRegular,fontSize:10,lineHeight:13,color:e.slate400},callerChip:{flexDirection:"row",alignItems:"center",gap:2.5,backgroundColor:e.sky100,paddingHorizontal:4.5,paddingVertical:1,borderRadius:3,borderWidth:.5,borderColor:e.sky400,marginLeft:4},callerChipText:{fontFamily:z.interMedium,fontSize:8.5,lineHeight:11,color:e.sky600},metaStatChip:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:e.violetSoftBg,borderColor:e.violetSoftBorder,borderWidth:1,paddingHorizontal:5.5,paddingVertical:1.5,borderRadius:4},metaStatText:{fontFamily:z.interBold,color:e.violetSoftText,fontSize:9,lineHeight:12},waterfallContainer:{height:2.5,width:"100%",backgroundColor:e.graySurface,borderRadius:1.5,overflow:"hidden"},waterfallBar:{height:"100%",borderRadius:1.5},highlight:{backgroundColor:e.yellowHighlight,color:e.primaryBlack,borderRadius:2}});export default Lt;
+      </C>}),o=Fe.create({overviewCard:{flexDirection:"row",alignItems:"center",backgroundColor:e.white,marginHorizontal:12,marginTop:10,borderRadius:12,padding:12,borderWidth:1,borderColor:e.dividerColor,shadowColor:e.primaryBlack,shadowOffset:{width:0,height:1},shadowOpacity:.03,shadowRadius:3,elevation:1},statCol:{flex:1},statDivider:{width:1,height:28,backgroundColor:e.dividerColor,marginHorizontal:8},statHeading:{fontFamily:R.interBold,fontSize:9,color:e.grayTextWeak,letterSpacing:.5},statBigVal:{fontFamily:R.interBold,fontSize:14,color:e.primaryBlack,marginTop:2},statLastAction:{fontFamily:R.interBold,fontSize:11,color:e.purple,marginTop:2},statLastTime:{fontFamily:R.interRegular,fontSize:9.5,color:e.grayTextWeak},toolbarContainer:{backgroundColor:e.white,borderBottomWidth:1,borderBottomColor:e.dividerColor,paddingHorizontal:12,paddingTop:8,paddingBottom:6,marginTop:8},searchRow:{flexDirection:"row",alignItems:"center",gap:8},headerSubRow:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",marginTop:6,paddingHorizontal:2},resultCount:{fontFamily:R.interMedium,fontSize:11,color:e.grayTextWeak},sortLabel:{fontFamily:R.interMedium,fontSize:10.5,color:e.brandPurple},listContent:{paddingVertical:8,paddingBottom:36},cardContainer:{paddingHorizontal:10,paddingVertical:4,height:126},card:{backgroundColor:e.white,borderRadius:10,borderWidth:1,borderColor:e.grayBorderSecondary,shadowColor:e.shadowColorString,shadowOffset:{width:0,height:1},shadowOpacity:.05,shadowRadius:2.5,elevation:1.5,height:118,overflow:"hidden"},cardRecentlyUpdated:{borderColor:`${e.brandPurple}66`,backgroundColor:e.purpleTintBg},cardBody:{paddingHorizontal:12,paddingTop:9,paddingBottom:7,flex:1,justifyContent:"space-between"},cardHeaderRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",height:22,minHeight:22,maxHeight:22,gap:6},cardHeaderLeft:{flexDirection:"row",alignItems:"center",gap:6,flex:1,minWidth:0},cardHeaderRight:{flexDirection:"row",alignItems:"center",gap:6,flexShrink:0},serialNumber:{fontFamily:R.interBold,fontSize:10.5,lineHeight:13,color:e.grayTextWeak},methodBadge:{paddingHorizontal:5.5,paddingVertical:2,borderRadius:4,alignItems:"center",justifyContent:"center"},methodBadgeText:{fontFamily:R.interBold,color:e.white,fontSize:9,lineHeight:12,letterSpacing:.4},chip:{flexDirection:"row",alignItems:"center",gap:3,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4,borderWidth:1},chipText:{fontFamily:R.interBold,fontSize:8.5,lineHeight:11,letterSpacing:.3},statusPill:{flexDirection:"row",alignItems:"center",gap:3.5,paddingHorizontal:6,paddingVertical:2,borderRadius:4,borderWidth:1},liveDot:{width:6,height:6,borderRadius:3,backgroundColor:e.emerald500},statusPillText:{fontFamily:R.interBold,fontSize:9.5,lineHeight:12},cardMainRow:{height:48,minHeight:48,maxHeight:48,justifyContent:"space-between",gap:3},sliceNameRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",gap:6},sliceNameText:{fontFamily:R.interBold,fontSize:12.5,lineHeight:16,color:e.primaryBlack,flex:1},actionCountChip:{flexDirection:"row",alignItems:"center",gap:2.5,backgroundColor:`${e.violet600}14`,borderColor:`${e.violet600}2E`,borderWidth:1,paddingHorizontal:4.5,paddingVertical:1,borderRadius:3.5},actionCountChipText:{fontFamily:R.interBold,fontSize:8.5,lineHeight:11,color:e.violet600},actionPreviewRow:{flexDirection:"row",alignItems:"center",gap:4.5,minHeight:15},actionPreviewText:{fontFamily:oe.select({ios:"Menlo",default:"monospace"}),fontSize:10,lineHeight:13,color:e.grayTextWeak,flex:1},actionPreviewEmptyText:{fontFamily:R.interRegular,fontSize:10,lineHeight:13,color:e.slate400,fontStyle:"italic",flex:1},cardFooterRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",height:18,minHeight:18,maxHeight:18,gap:6},footerLeft:{flexDirection:"row",alignItems:"center",gap:5,flex:1,minWidth:0,overflow:"hidden"},footerRight:{flexDirection:"row",alignItems:"center",gap:5,flexShrink:0},footerTimestampText:{fontFamily:R.interRegular,fontSize:10,lineHeight:13,color:e.slate400},callerChip:{flexDirection:"row",alignItems:"center",gap:2.5,backgroundColor:e.sky100,paddingHorizontal:4.5,paddingVertical:1,borderRadius:3,borderWidth:.5,borderColor:e.sky400,marginLeft:4},callerChipText:{fontFamily:R.interMedium,fontSize:8.5,lineHeight:11,color:e.sky600},metaStatChip:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:e.violetSoftBg,borderColor:e.violetSoftBorder,borderWidth:1,paddingHorizontal:5.5,paddingVertical:1.5,borderRadius:4},metaStatText:{fontFamily:R.interBold,color:e.violetSoftText,fontSize:9,lineHeight:12},waterfallContainer:{height:2.5,width:"100%",backgroundColor:e.graySurface,borderRadius:1.5,overflow:"hidden"},waterfallBar:{height:"100%",borderRadius:1.5},highlight:{backgroundColor:e.yellowHighlight,color:e.primaryBlack,borderRadius:2}});export default Pt;

package/dist/esm/components/Inspector/StorageTab.js

@@ -1,4 +1,4 @@
-import we,{useState as z,useEffect as je,useMemo as N,useCallback as oe,useRef as Je}from"react";import{View as S,Text as C,ScrollView as Ge,FlatList as Ue,TextInput as Se,Modal as Ye,Alert as ke,StyleSheet as _e,ActivityIndicator as Qe,Platform as ve}from"react-native";import V from"../TouchableScale";import Xe from"../EndOfListFooter";import{AppColors as e}from"../../styles/AppColors";import{AppFonts as T}from"../../styles/AppFonts";import{useTranslation as Ze}from"../../i18n";import{DatabaseIcon as Ve,SearchIcon as St,ClearIcon as Ie,PlusIcon as Tt,PencilIcon as Ct,TrashIcon as Pe,CopyIcon as Bt,CheckIcon as Vt,LayersIcon as It,ResetIcon as Pt,ChevronIcon as At,WarningTriangleIcon as Ft}from"../NetworkIcons";import{fetchStorageEntries as Mt,setStorageEntry as Lt,removeStorageEntry as $t,clearStorageDriver as Dt,getRegisteredMMKVInstanceIds as Rt,subscribeToStorageChanges as Wt}from"../../customHooks/storageInspector";import{copyToClipboard as Kt}from"../../helpers";import{showToast as $}from"../../helpers/toast";const Et=w=>{switch(w){case"json":return{label:"JSON",color:e.purple,bg:`${e.purple}16`};case"number":return{label:"NUM",color:e.warningIconGold,bg:`${e.warningIconGold}16`};case"boolean":return{label:"BOOL",color:e.emerald500,bg:`${e.emerald500}16`};case"null":return{label:"NULL",color:e.grayTextWeak,bg:`${e.grayTextWeak}16`};default:return{label:"STR",color:e.blue500,bg:`${e.blue500}16`}}},Ot=we.memo(function({entry:B,isExpanded:r,onToggleExpand:J,onCopy:F,onEdit:q,onDelete:I,badge:D}){const Q=N(()=>B.byteSize<1024?`${B.byteSize.toLocaleString()} B`:`${(B.byteSize/1024).toLocaleString(void 0,{minimumFractionDigits:1,maximumFractionDigits:1})} KB`,[B.byteSize]),G=N(()=>{if(!r)return B.value.length>250?B.value.slice(0,250)+"...":B.value;if(B.type==="json")try{const A=B.parsedValue??JSON.parse(B.value);return JSON.stringify(A,null,2)}catch{return B.value}return B.value},[r,B.value,B.type,B.parsedValue]);return<S style={t.entryCard}>
+import ke,{useState as z,useEffect as ve,useMemo as N,useCallback as oe,useRef as Ue}from"react";import{View as S,Text as C,ScrollView as _e,FlatList as Ye,TextInput as Se,Modal as Qe,Alert as Ve,StyleSheet as Ze,ActivityIndicator as Xe,Platform as Ie}from"react-native";import V from"../TouchableScale";import St from"../EndOfListFooter";import{AppColors as e}from"../../styles/AppColors";import{AppFonts as T}from"../../styles/AppFonts";import{useTranslation as Tt}from"../../i18n";import{DatabaseIcon as Pe,SearchIcon as Ct,ClearIcon as Ae,PlusIcon as Bt,PencilIcon as Vt,TrashIcon as Me,CopyIcon as It,CheckIcon as Pt,LayersIcon as At,ResetIcon as Mt,ChevronIcon as Ft,WarningTriangleIcon as Lt}from"../NetworkIcons";import{fetchStorageEntries as Dt,setStorageEntry as $t,removeStorageEntry as Rt,clearStorageDriver as Wt,getRegisteredMMKVInstanceIds as Et,subscribeToStorageChanges as Kt}from"../../customHooks/storageInspector";import{copyToClipboard as Ot}from"../../helpers";import{showToast as D}from"../../helpers/toast";const Nt=w=>{switch(w){case"json":return{label:"JSON",color:e.purple,bg:`${e.purple}16`};case"number":return{label:"NUM",color:e.warningIconGold,bg:`${e.warningIconGold}16`};case"boolean":return{label:"BOOL",color:e.emerald500,bg:`${e.emerald500}16`};case"null":return{label:"NULL",color:e.grayTextWeak,bg:`${e.grayTextWeak}16`};default:return{label:"STR",color:e.blue500,bg:`${e.blue500}16`}}},Ht=ke.memo(function({entry:B,isExpanded:r,onToggleExpand:J,onCopy:M,onEdit:q,onDelete:I,badge:$}){const Q=N(()=>B.byteSize<1024?`${B.byteSize.toLocaleString()} B`:`${(B.byteSize/1024).toLocaleString(void 0,{minimumFractionDigits:1,maximumFractionDigits:1})} KB`,[B.byteSize]),G=N(()=>{if(!r)return B.value.length>250?B.value.slice(0,250)+"...":B.value;if(B.type==="json")try{const P=B.parsedValue??JSON.parse(B.value);return JSON.stringify(P,null,2)}catch{return B.value}return B.value},[r,B.value,B.type,B.parsedValue]);return<S style={t.entryCard}>
       
       <S style={t.entryHeader}>
         <S style={{flex:1,marginRight:8}}>
@@ -6,9 +6,9 @@ import we,{useState as z,useEffect as je,useMemo as N,useCallback as oe,useRef a
             <C style={t.entryKey}numberOfLines={1}selectable>
               {B.key}
             </C>
-            <S style={[t.typeBadge,{backgroundColor:D.bg,borderColor:`${D.color}33`}]}>
-              <C style={[t.typeBadgeText,{color:D.color}]}>
-                {D.label}
+            <S style={[t.typeBadge,{backgroundColor:$.bg,borderColor:`${$.color}33`}]}>
+              <C style={[t.typeBadgeText,{color:$.color}]}>
+                {$.label}
               </C>
             </S>
             <C style={t.sizeText}>{Q}</C>
@@ -17,16 +17,16 @@ import we,{useState as z,useEffect as je,useMemo as N,useCallback as oe,useRef a
 
         
         <S style={t.entryActions}>
-          <V hitSlop={6}onPress={()=>F(B)}style={t.entryActionBtn}>
-            <Bt size={12}color={e.grayText}/>
+          <V hitSlop={6}onPress={()=>M(B)}style={t.entryActionBtn}>
+            <It size={12}color={e.grayText}/>
           </V>
 
           <V hitSlop={6}onPress={()=>q(B)}style={t.entryActionBtn}>
-            <Ct size={12}color={e.purple}/>
+            <Vt size={12}color={e.purple}/>
           </V>
 
           <V hitSlop={6}onPress={()=>I(B.key)}style={[t.entryActionBtn,{backgroundColor:`${e.errorColor}12`}]}>
-            <Pe size={12}color={e.errorColor}/>
+            <Me size={12}color={e.errorColor}/>
           </V>
         </S>
       </S>
@@ -40,15 +40,15 @@ import we,{useState as z,useEffect as je,useMemo as N,useCallback as oe,useRef a
             <C style={t.expandHint}>
               {r?"Collapse":"Expand"}
             </C>
-            <At direction={r?"up":"down"}size={10}color={e.purple}/>
+            <Ft direction={r?"up":"down"}size={10}color={e.purple}/>
           </S>}
       </V>
-    </S>});export const StorageTab=we.memo(()=>{const{t:w}=Ze(),B=Je(null),[r,J]=z("asyncStorage"),[F,q]=z("default"),[I,D]=z([]),[Q,G]=z(!0),[A,X]=z(""),[Z,Ae]=z(100),[Te,Fe]=z({}),[Me,K]=z(!1),[U,xe]=z("create"),[E,ee]=z(""),[H,Y]=z(""),[R,_]=z("string"),[te,M]=z(null),Ce=N(()=>Rt(),[]),W=oe(async()=>{G(!0);try{const o=await Mt(r,r==="mmkv"?F:void 0);D(o)}catch{D([])}finally{G(!1)}},[r,F]);je(()=>(W(),Wt(W)),[W]);const Le=o=>{Fe(P=>({...P,[o]:!P[o]}))},$e=()=>{xe("create"),ee(""),Y(""),_("string"),M(null),K(!0)},De=o=>{xe("edit"),ee(o.key),Y(o.value),_(o.type==="json"?"json":o.type==="number"?"number":o.type==="boolean"?"boolean":"string"),M(null),K(!0)},Re=o=>{ke.alert(w("storage.deleteKeyTitle","Delete Key"),w("storage.deleteKeyMessage",{key:o,defaultValue:`Are you sure you want to delete key "${o}"?`}),[{text:w("common.cancel","Cancel"),style:"cancel"},{text:w("common.clear","Delete"),style:"destructive",onPress:async()=>{await $t(r,o,r==="mmkv"?F:void 0)?($(`Deleted "${o}"`),W()):$(`Failed to delete "${o}"`)}}])},We=()=>{ke.alert(w("storage.clearTitle","Clear Storage Driver"),w("storage.clearMessage",{driver:r==="asyncStorage"?"AsyncStorage":"MMKV",defaultValue:`Are you sure you want to delete all keys in ${r==="asyncStorage"?"AsyncStorage":"MMKV"}?`}),[{text:w("common.cancel","Cancel"),style:"cancel"},{text:w("storage.clearConfirm","Clear All"),style:"destructive",onPress:async()=>{await Dt(r,r==="mmkv"?F:void 0)&&($("All storage keys wiped"),W())}}])},Ke=async()=>{if(!E.trim()){$("Key name cannot be empty");return}let o=H;if(R==="json")try{const j=JSON.parse(H);o=JSON.stringify(j)}catch(j){M("Invalid JSON: "+j.message);return}else if(R==="number"&&isNaN(Number(H))){M("Value must be a valid number");return}await Lt(r,E.trim(),o,r==="mmkv"?F:void 0)?($(U==="create"?`Added "${E.trim()}"`:`Updated "${E.trim()}"`),K(!1),W()):$("Error saving storage key")},Ee=()=>{try{const o=JSON.parse(H);Y(JSON.stringify(o,null,2)),M(null),_("json"),$("Formatted JSON")}catch{M("Cannot format: invalid JSON syntax")}},L=N(()=>{if(!A.trim())return I;const o=A.toLowerCase().trim().split(/\s+/).filter(Boolean);return I.filter(P=>{const j=`${P.key} ${P.value}`.toLowerCase();return o.every(He=>j.includes(He))})},[I,A]),O=N(()=>I.reduce((o,P)=>o+P.byteSize,0),[I]),Oe=N(()=>O<1024?`${O.toLocaleString()} B`:O<1024*1024?`${(O/1024).toLocaleString(void 0,{minimumFractionDigits:1,maximumFractionDigits:1})} KB`:`${(O/(1024*1024)).toLocaleString(void 0,{minimumFractionDigits:2,maximumFractionDigits:2})} MB`,[O]),Be=oe(o=>{Kt(o.value,o.key),$(`Copied value of "${o.key}"`)},[]),Ne=oe(({item:o})=><Ot entry={o}isExpanded={!!Te[o.key]}onToggleExpand={Le}onCopy={Be}onEdit={De}onDelete={Re}badge={Et(o.type)}/>,[Te,Be]);return<S style={t.container}>
+    </S>}),Fe=50,Le=10;export const StorageTab=ke.memo(()=>{const{t:w}=Tt(),B=Ue(null),[r,J]=z("asyncStorage"),[M,q]=z("default"),[I,$]=z([]),[Q,G]=z(!0),[P,Z]=z(""),[X,Te]=z(Fe),[xe,De]=z({});ve(()=>{Te(Fe),B.current?.scrollToOffset({offset:0,animated:!1})},[P,r,M]);const[$e,E]=z(!1),[U,Ce]=z("create"),[K,ee]=z(""),[H,_]=z(""),[R,Y]=z("string"),[te,F]=z(null),Be=N(()=>Et(),[]),W=oe(async()=>{G(!0);try{const o=await Dt(r,r==="mmkv"?M:void 0);$(o)}catch{$([])}finally{G(!1)}},[r,M]);ve(()=>(W(),Kt(W)),[W]);const Re=o=>{De(A=>({...A,[o]:!A[o]}))},We=()=>{Ce("create"),ee(""),_(""),Y("string"),F(null),E(!0)},Ee=o=>{Ce("edit"),ee(o.key),_(o.value),Y(o.type==="json"?"json":o.type==="number"?"number":o.type==="boolean"?"boolean":"string"),F(null),E(!0)},Ke=o=>{Ve.alert(w("storage.deleteKeyTitle","Delete Key"),w("storage.deleteKeyMessage",{key:o,defaultValue:`Are you sure you want to delete key "${o}"?`}),[{text:w("common.cancel","Cancel"),style:"cancel"},{text:w("common.clear","Delete"),style:"destructive",onPress:async()=>{await Rt(r,o,r==="mmkv"?M:void 0)?(D(`Deleted "${o}"`),W()):D(`Failed to delete "${o}"`)}}])},Oe=()=>{Ve.alert(w("storage.clearTitle","Clear Storage Driver"),w("storage.clearMessage",{driver:r==="asyncStorage"?"AsyncStorage":"MMKV",defaultValue:`Are you sure you want to delete all keys in ${r==="asyncStorage"?"AsyncStorage":"MMKV"}?`}),[{text:w("common.cancel","Cancel"),style:"cancel"},{text:w("storage.clearConfirm","Clear All"),style:"destructive",onPress:async()=>{await Wt(r,r==="mmkv"?M:void 0)&&(D("All storage keys wiped"),W())}}])},Ne=async()=>{if(!K.trim()){D("Key name cannot be empty");return}let o=H;if(R==="json")try{const j=JSON.parse(H);o=JSON.stringify(j)}catch(j){F("Invalid JSON: "+j.message);return}else if(R==="number"&&isNaN(Number(H))){F("Value must be a valid number");return}await $t(r,K.trim(),o,r==="mmkv"?M:void 0)?(D(U==="create"?`Added "${K.trim()}"`:`Updated "${K.trim()}"`),E(!1),W()):D("Error saving storage key")},He=()=>{try{const o=JSON.parse(H);_(JSON.stringify(o,null,2)),F(null),Y("json"),D("Formatted JSON")}catch{F("Cannot format: invalid JSON syntax")}},L=N(()=>{if(!P.trim())return I;const o=P.toLowerCase().trim().split(/\s+/).filter(Boolean);return I.filter(A=>{const j=`${A.key} ${A.value}`.toLowerCase();return o.every(Ge=>j.includes(Ge))})},[I,P]),O=N(()=>I.reduce((o,A)=>o+A.byteSize,0),[I]),je=N(()=>O<1024?`${O.toLocaleString()} B`:O<1024*1024?`${(O/1024).toLocaleString(void 0,{minimumFractionDigits:1,maximumFractionDigits:1})} KB`:`${(O/(1024*1024)).toLocaleString(void 0,{minimumFractionDigits:2,maximumFractionDigits:2})} MB`,[O]),we=oe(o=>{Ot(o.value,o.key),D(`Copied value of "${o.key}"`)},[]),Je=oe(({item:o})=><Ht entry={o}isExpanded={!!xe[o.key]}onToggleExpand={Re}onCopy={we}onEdit={Ee}onDelete={Ke}badge={Nt(o.type)}/>,[xe,we]);return<S style={t.container}>
       
       <S style={t.driverTabsWrapper}>
-        <Ge horizontal showsHorizontalScrollIndicator={!1}contentContainerStyle={t.driverTabsContainer}>
+        <_e horizontal showsHorizontalScrollIndicator={!1}contentContainerStyle={t.driverTabsContainer}>
           <V onPress={()=>J("asyncStorage")}style={[t.driverTabPill,r==="asyncStorage"&&{backgroundColor:e.brandPurple,borderColor:e.brandPurple},r!=="asyncStorage"&&{backgroundColor:`${e.brandPurple}12`,borderColor:`${e.brandPurple}30`}]}>
-            <Ve size={11}color={r==="asyncStorage"?e.white:e.brandPurple}/>
+            <Pe size={11}color={r==="asyncStorage"?e.white:e.brandPurple}/>
             <C style={[t.driverTabText,{color:r==="asyncStorage"?e.white:e.primaryBlack}]}>
               {w("storage.subTabs.asyncStorage","AsyncStorage")}
             </C>
@@ -60,7 +60,7 @@ import we,{useState as z,useEffect as je,useMemo as N,useCallback as oe,useRef a
           </V>
 
           <V onPress={()=>J("mmkv")}style={[t.driverTabPill,r==="mmkv"&&{backgroundColor:e.teal600,borderColor:e.teal600},r!=="mmkv"&&{backgroundColor:`${e.teal600}12`,borderColor:`${e.teal600}30`}]}>
-            <It size={11}color={r==="mmkv"?e.white:e.teal600}/>
+            <At size={11}color={r==="mmkv"?e.white:e.teal600}/>
             <C style={[t.driverTabText,{color:r==="mmkv"?e.white:e.primaryBlack}]}>
               {w("storage.subTabs.mmkv","MMKV")}
             </C>
@@ -72,111 +72,111 @@ import we,{useState as z,useEffect as je,useMemo as N,useCallback as oe,useRef a
           </V>
 
           
-          {r==="mmkv"&&Ce.length>1&&<S style={{flexDirection:"row",alignItems:"center",gap:4,marginLeft:6}}>
-              {Ce.map(o=><V key={o}onPress={()=>q(o)}style={[t.instancePill,F===o&&t.instancePillActive]}>
-                  <C style={[t.instancePillText,F===o&&t.instancePillTextActive]}>
+          {r==="mmkv"&&Be.length>1&&<S style={{flexDirection:"row",alignItems:"center",gap:4,marginLeft:6}}>
+              {Be.map(o=><V key={o}onPress={()=>q(o)}style={[t.instancePill,M===o&&t.instancePillActive]}>
+                  <C style={[t.instancePillText,M===o&&t.instancePillTextActive]}>
                     {o}
                   </C>
                 </V>)}
             </S>}
-        </Ge>
+        </_e>
       </S>
 
       
       <S style={t.actionBar}>
         <S style={t.searchBar}>
-          <St size={14}color={e.grayTextWeak}/>
-          <Se value={A}onChangeText={X}placeholder={w("storage.searchPlaceholder","Search keys, values, types...")}placeholderTextColor={e.grayTextWeak}style={t.searchInput}clearButtonMode="while-editing"/>
-          {A.length>0&&<S style={{flexDirection:"row",alignItems:"center",gap:4}}>
+          <Ct size={14}color={e.grayTextWeak}/>
+          <Se value={P}onChangeText={Z}placeholder={w("storage.searchPlaceholder","Search keys, values, types...")}placeholderTextColor={e.grayTextWeak}style={t.searchInput}clearButtonMode="while-editing"/>
+          {P.length>0&&<S style={{flexDirection:"row",alignItems:"center",gap:4}}>
               <S style={{backgroundColor:`${e.purple}20`,borderRadius:10,paddingHorizontal:6,paddingVertical:1.5}}>
                 <C style={{color:e.purple,fontSize:9.5,fontFamily:T.interBold}}>
                   {L.length}
                 </C>
               </S>
-              <V onPress={()=>X("")}hitSlop={8}>
-                <Ie size={13}color={e.grayTextWeak}/>
+              <V onPress={()=>Z("")}hitSlop={8}>
+                <Ae size={13}color={e.grayTextWeak}/>
               </V>
             </S>}
         </S>
 
         
-        <V onPress={$e}style={t.addKeyBtn}hitSlop={6}>
-          <Tt size={13}color={e.white}/>
+        <V onPress={We}style={t.addKeyBtn}hitSlop={6}>
+          <Bt size={13}color={e.white}/>
           <C style={t.addKeyBtnText}>{w("storage.add","Add")}</C>
         </V>
 
         <V onPress={W}style={t.actionIconBtn}hitSlop={6}>
-          <Pt size={13}color={e.grayText}/>
+          <Mt size={13}color={e.grayText}/>
         </V>
 
-        {I.length>0&&<V onPress={We}style={[t.actionIconBtn,{borderColor:`${e.errorColor}33`,backgroundColor:`${e.errorColor}12`}]}hitSlop={6}>
-            <Pe size={13}color={e.errorColor}/>
+        {I.length>0&&<V onPress={Oe}style={[t.actionIconBtn,{borderColor:`${e.errorColor}33`,backgroundColor:`${e.errorColor}12`}]}hitSlop={6}>
+            <Me size={13}color={e.errorColor}/>
           </V>}
       </S>
 
       
       <S style={t.statsStrip}>
         <C style={t.statsText}>
-          {L.length.toLocaleString()} of {I.length.toLocaleString()} Keys • {Oe}
+          {L.length.toLocaleString()} of {I.length.toLocaleString()} Keys • {je}
         </C>
         <C style={t.statsSubtext}>
-          {r==="asyncStorage"?"SQLite Key-Value":`MMKV (${F})`}
+          {r==="asyncStorage"?"SQLite Key-Value":`MMKV (${M})`}
         </C>
       </S>
 
       
       {Q?<S style={t.loadingContainer}>
-          <Qe size="small"color={e.purple}/>
+          <Xe size="small"color={e.purple}/>
           <C style={t.loadingText}>{w("storage.loading","Loading storage entries...")}</C>
         </S>:<>
-          <Ue ref={B}data={L.slice(0,Z)}keyExtractor={o=>o.key}renderItem={Ne}initialNumToRender={10}maxToRenderPerBatch={10}windowSize={5}removeClippedSubviews={ve.OS==="android"}style={t.scrollArea}contentContainerStyle={L.length===0?t.emptyScrollContent:t.scrollContent}showsVerticalScrollIndicator={!1}ListEmptyComponent={<S style={t.emptyContainer}>
+          <Ye ref={B}data={L.slice(0,X)}keyExtractor={o=>o.key}renderItem={Je}initialNumToRender={10}maxToRenderPerBatch={10}windowSize={5}removeClippedSubviews={Ie.OS==="android"}style={t.scrollArea}contentContainerStyle={L.length===0?t.emptyScrollContent:t.scrollContent}showsVerticalScrollIndicator={!1}ListEmptyComponent={<S style={t.emptyContainer}>
                 <S style={t.emptyIconWrap}>
-                  <Ve size={28}color={e.grayTextWeak}/>
+                  <Pe size={28}color={e.grayTextWeak}/>
                 </S>
                 <C style={t.emptyTitle}>
-                  {A.trim().length>0?"No matching keys found":`No ${r==="asyncStorage"?"AsyncStorage":"MMKV"} Keys`}
+                  {P.trim().length>0?"No matching keys found":`No ${r==="asyncStorage"?"AsyncStorage":"MMKV"} Keys`}
                 </C>
                 <C style={t.emptySubtitle}>
-                  {A.trim().length>0?`No keys or values match "${A}"`:`Storage is auto-detected. Tap "+ Add" above to create your first ${r==="asyncStorage"?"AsyncStorage":"MMKV"} key!`}
+                  {P.trim().length>0?`No keys or values match "${P}"`:`Storage is auto-detected. Tap "+ Add" above to create your first ${r==="asyncStorage"?"AsyncStorage":"MMKV"} key!`}
                 </C>
-                {A.trim().length>0&&<V onPress={()=>X("")}style={{marginTop:12,paddingHorizontal:14,paddingVertical:6,borderRadius:8,backgroundColor:e.grayBackground,borderWidth:1,borderColor:e.grayBorderSecondary}}>
+                {P.trim().length>0&&<V onPress={()=>Z("")}style={{marginTop:12,paddingHorizontal:14,paddingVertical:6,borderRadius:8,backgroundColor:e.grayBackground,borderWidth:1,borderColor:e.grayBorderSecondary}}>
                     <C style={{color:e.brandPurple,fontSize:12,fontFamily:T.interBold}}>
                       Clear Search
                     </C>
                   </V>}
-              </S>}ListFooterComponent={L.length>0?<Xe count={Math.min(Z,L.length)}totalCount={L.length}label="keys"hasMore={L.length>Z}onLoadMore={()=>Ae(o=>o+10)}/>:<S style={{height:60}}/>}/>
+              </S>}ListFooterComponent={L.length>0?<St count={Math.min(X,L.length)}totalCount={L.length}label="keys"loadMoreStep={Le}hasMore={L.length>X}onLoadMore={()=>Te(o=>o+Le)}/>:<S style={{height:60}}/>}/>
         </>}
 
       
-      <Ye visible={Me}transparent animationType="fade"onRequestClose={()=>K(!1)}>
+      <Qe visible={$e}transparent animationType="fade"onRequestClose={()=>E(!1)}>
         <S style={t.modalOverlay}>
           <S style={t.modalCard}>
             <S style={t.modalHeader}>
               <C style={t.modalTitle}>
-                {U==="create"?"Add Storage Key":`Edit: ${E}`}
+                {U==="create"?"Add Storage Key":`Edit: ${K}`}
               </C>
-              <V onPress={()=>K(!1)}hitSlop={8}>
-                <Ie size={16}color={e.grayText}/>
+              <V onPress={()=>E(!1)}hitSlop={8}>
+                <Ae size={16}color={e.grayText}/>
               </V>
             </S>
 
             
             <S style={t.inputGroup}>
               <C style={t.inputLabel}>{w("storage.keyName","KEY NAME").toUpperCase()}</C>
-              <Se value={E}onChangeText={ee}placeholder="e.g. user_session, auth_token"placeholderTextColor={e.grayTextWeak}editable={U==="create"}style={[t.textInput,U==="edit"&&t.textInputDisabled]}autoCapitalize="none"/>
+              <Se value={K}onChangeText={ee}placeholder="e.g. user_session, auth_token"placeholderTextColor={e.grayTextWeak}editable={U==="create"}style={[t.textInput,U==="edit"&&t.textInputDisabled]}autoCapitalize="none"/>
             </S>
 
             
             <S style={t.inputGroup}>
               <S style={{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginBottom:4}}>
                 <C style={t.inputLabel}>{w("storage.type","VALUE TYPE").toUpperCase()}</C>
-                {R==="json"&&<V onPress={Ee}hitSlop={6}>
+                {R==="json"&&<V onPress={He}hitSlop={6}>
                     <C style={t.formatJsonBtn}>{w("storage.beautifyJson","Beautify JSON")}</C>
                   </V>}
               </S>
               <S style={t.typeSelectorStrip}>
-                {["string","json","number","boolean"].map(o=>{const P=R===o;return<V key={o}onPress={()=>{_(o),M(null)}}style={[t.typePill,P&&t.typePillActive]}>
-                      <C style={[t.typePillText,P&&t.typePillTextActive]}>
+                {["string","json","number","boolean"].map(o=>{const A=R===o;return<V key={o}onPress={()=>{Y(o),F(null)}}style={[t.typePill,A&&t.typePillActive]}>
+                      <C style={[t.typePillText,A&&t.typePillTextActive]}>
                         {o.toUpperCase()}
                       </C>
                     </V>})}
@@ -186,24 +186,24 @@ import we,{useState as z,useEffect as je,useMemo as N,useCallback as oe,useRef a
             
             <S style={t.inputGroup}>
               <C style={t.inputLabel}>{w("storage.valueContent","VALUE CONTENT").toUpperCase()}</C>
-              <Se value={H}onChangeText={o=>{Y(o),te&&M(null)}}placeholder={R==="json"?'{"userId": 123, "isLoggedIn": true}':R==="number"?"42":R==="boolean"?"true":"String value..."}placeholderTextColor={e.grayTextWeak}style={[t.textInput,t.textAreaInput]}multiline textAlignVertical="top"autoCapitalize="none"/>
+              <Se value={H}onChangeText={o=>{_(o),te&&F(null)}}placeholder={R==="json"?'{"userId": 123, "isLoggedIn": true}':R==="number"?"42":R==="boolean"?"true":"String value..."}placeholderTextColor={e.grayTextWeak}style={[t.textInput,t.textAreaInput]}multiline textAlignVertical="top"autoCapitalize="none"/>
               {te&&<S style={{flexDirection:"row",alignItems:"center",gap:5,marginTop:4}}>
-                  <Ft size={12}color={e.errorColor}/>
+                  <Lt size={12}color={e.errorColor}/>
                   <C style={t.errorText}>{te}</C>
                 </S>}
             </S>
 
             
             <S style={t.modalActions}>
-              <V onPress={()=>K(!1)}style={t.cancelBtn}>
+              <V onPress={()=>E(!1)}style={t.cancelBtn}>
                 <C style={t.cancelBtnText}>{w("common.cancel","Cancel")}</C>
               </V>
-              <V onPress={Ke}style={t.saveBtn}>
-                <Vt size={14}color={e.white}/>
+              <V onPress={Ne}style={t.saveBtn}>
+                <Pt size={14}color={e.white}/>
                 <C style={t.saveBtnText}>{w("storage.saveKey","Save Key")}</C>
               </V>
             </S>
           </S>
         </S>
-      </Ye>
-    </S>});const t=_e.create({container:{flex:1,backgroundColor:e.grayBackground},driverTabsWrapper:{backgroundColor:e.primaryLight,borderBottomWidth:1,borderBottomColor:e.dividerColor,paddingVertical:8},driverTabsContainer:{paddingHorizontal:12,flexDirection:"row",alignItems:"center",gap:6},driverTabPill:{flexDirection:"row",alignItems:"center",gap:5,paddingHorizontal:9,paddingVertical:4.5,borderRadius:8,backgroundColor:e.grayBackground,borderWidth:1,borderColor:e.grayBorderSecondary},driverTabPillActive:{backgroundColor:e.purple,borderColor:e.purple},driverTabText:{fontFamily:T.interBold,fontSize:10.5,color:e.grayText},driverTabTextActive:{color:e.white},driverCountBadge:{backgroundColor:"rgba(255, 255, 255, 0.25)",paddingHorizontal:5,paddingVertical:1,borderRadius:8},driverCountText:{fontFamily:T.interBold,fontSize:9.5,color:e.white},instancePill:{paddingHorizontal:7,paddingVertical:3,borderRadius:6,backgroundColor:`${e.purple}14`,borderWidth:1,borderColor:`${e.purple}30`},instancePillActive:{backgroundColor:e.purple,borderColor:e.purple},instancePillText:{fontFamily:T.interBold,fontSize:10,color:e.purple},instancePillTextActive:{color:e.white},actionBar:{flexDirection:"row",alignItems:"center",paddingHorizontal:12,paddingVertical:8,backgroundColor:e.primaryLight,borderBottomWidth:1,borderBottomColor:e.dividerColor,gap:6},searchBar:{flex:1,flexDirection:"row",alignItems:"center",backgroundColor:e.grayBackground,borderRadius:8,paddingHorizontal:9,paddingVertical:ve.OS==="ios"?6:2,borderWidth:1,borderColor:e.grayBorderSecondary,gap:6},searchInput:{flex:1,fontFamily:T.interMedium,fontSize:12,color:e.primaryBlack,padding:0},addKeyBtn:{flexDirection:"row",alignItems:"center",gap:4,paddingHorizontal:10,paddingVertical:6,borderRadius:8,backgroundColor:e.purple},addKeyBtnText:{fontFamily:T.interBold,fontSize:11,color:e.white},actionIconBtn:{width:30,height:30,borderRadius:8,alignItems:"center",justifyContent:"center",backgroundColor:e.grayBackground,borderWidth:1,borderColor:e.grayBorderSecondary},statsStrip:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:12,paddingVertical:5,backgroundColor:`${e.grayBorderSecondary}40`},statsText:{fontFamily:T.interMedium,fontSize:10,color:e.grayText},statsSubtext:{fontFamily:T.interBold,fontSize:9.5,color:e.grayTextWeak},scrollArea:{flex:1},scrollContent:{padding:12,gap:10,paddingBottom:100},emptyScrollContent:{flexGrow:1,justifyContent:"center",alignItems:"center",padding:24,paddingBottom:60},entryCard:{backgroundColor:e.primaryLight,borderRadius:10,borderWidth:1,borderColor:e.grayBorderSecondary,padding:10,gap:8,shadowColor:e.black,shadowOpacity:.02,shadowRadius:3,shadowOffset:{width:0,height:1},elevation:1},entryHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},entryKey:{fontFamily:T.interBold,fontSize:12.5,color:e.primaryBlack},typeBadge:{paddingHorizontal:5,paddingVertical:1,borderRadius:4,borderWidth:1},typeBadgeText:{fontFamily:T.interBold,fontSize:8.5},sizeText:{fontFamily:T.interRegular,fontSize:10,color:e.grayTextWeak},entryActions:{flexDirection:"row",alignItems:"center",gap:5},entryActionBtn:{padding:5,borderRadius:5,backgroundColor:e.grayBackground},valuePreviewBox:{backgroundColor:e.grayBackground,borderRadius:6,padding:8,borderWidth:1,borderColor:`${e.grayBorderSecondary}80`},valuePreviewText:{fontFamily:T.interRegular,fontSize:11,color:e.primaryBlack,lineHeight:16},expandHint:{fontFamily:T.interBold,fontSize:9.5,color:e.purple,marginTop:4},loadingContainer:{flex:1,alignItems:"center",justifyContent:"center",gap:8},loadingText:{fontFamily:T.interMedium,fontSize:12,color:e.grayText},emptyContainer:{padding:24,alignItems:"center",justifyContent:"center"},emptyIconWrap:{width:56,height:56,borderRadius:28,backgroundColor:`${e.grayBorderSecondary}40`,alignItems:"center",justifyContent:"center",marginBottom:12},emptyTitle:{fontFamily:T.interBold,fontSize:14,color:e.primaryBlack,marginBottom:4},emptySubtitle:{fontFamily:T.interRegular,fontSize:11.5,color:e.grayText,textAlign:"center",maxWidth:280},connectGuideCard:{marginTop:20,width:"100%",backgroundColor:e.primaryLight,borderRadius:10,borderWidth:1,borderColor:e.grayBorderSecondary,padding:12,gap:6},connectGuideTitle:{fontFamily:T.interBold,fontSize:11,color:e.purple},connectGuideCode:{fontFamily:T.interRegular,fontSize:10,color:e.grayText,lineHeight:15},modalOverlay:{flex:1,backgroundColor:"rgba(0, 0, 0, 0.5)",justifyContent:"center",alignItems:"center",padding:16},modalCard:{width:"100%",maxWidth:400,backgroundColor:e.primaryLight,borderRadius:14,padding:16,gap:12,shadowColor:e.black,shadowOpacity:.2,shadowRadius:10,shadowOffset:{width:0,height:4},elevation:5},modalHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",borderBottomWidth:1,borderBottomColor:e.dividerColor,paddingBottom:10},modalTitle:{fontFamily:T.interBold,fontSize:14,color:e.primaryBlack},inputGroup:{gap:4},inputLabel:{fontFamily:T.interBold,fontSize:9.5,color:e.grayTextWeak,letterSpacing:.5},textInput:{backgroundColor:e.grayBackground,borderRadius:8,paddingHorizontal:10,paddingVertical:8,fontFamily:T.interMedium,fontSize:12,color:e.primaryBlack,borderWidth:1,borderColor:e.grayBorderSecondary},textInputDisabled:{backgroundColor:`${e.grayBorderSecondary}40`,color:e.grayText},textAreaInput:{minHeight:90,maxHeight:160,fontFamily:T.interRegular,fontSize:11},typeSelectorStrip:{flexDirection:"row",alignItems:"center",gap:6},typePill:{flex:1,alignItems:"center",paddingVertical:6,borderRadius:6,backgroundColor:e.grayBackground,borderWidth:1,borderColor:e.grayBorderSecondary},typePillActive:{backgroundColor:e.purple,borderColor:e.purple},typePillText:{fontFamily:T.interBold,fontSize:10,color:e.grayText},typePillTextActive:{color:e.white},formatJsonBtn:{fontFamily:T.interBold,fontSize:10,color:e.purple},errorText:{fontFamily:T.interMedium,fontSize:10,color:e.errorColor,marginTop:2},modalActions:{flexDirection:"row",alignItems:"center",gap:10,marginTop:4},cancelBtn:{flex:1,alignItems:"center",paddingVertical:10,borderRadius:8,backgroundColor:e.grayBackground,borderWidth:1,borderColor:e.grayBorderSecondary},cancelBtnText:{fontFamily:T.interBold,fontSize:12,color:e.grayText},saveBtn:{flex:1.5,flexDirection:"row",alignItems:"center",justifyContent:"center",gap:5,paddingVertical:10,borderRadius:8,backgroundColor:e.purple},saveBtnText:{fontFamily:T.interBold,fontSize:12,color:e.white}});export default StorageTab;
+      </Qe>
+    </S>});const t=Ze.create({container:{flex:1,backgroundColor:e.grayBackground},driverTabsWrapper:{backgroundColor:e.primaryLight,borderBottomWidth:1,borderBottomColor:e.dividerColor,paddingVertical:8},driverTabsContainer:{paddingHorizontal:12,flexDirection:"row",alignItems:"center",gap:6},driverTabPill:{flexDirection:"row",alignItems:"center",gap:5,paddingHorizontal:9,paddingVertical:4.5,borderRadius:8,backgroundColor:e.grayBackground,borderWidth:1,borderColor:e.grayBorderSecondary},driverTabPillActive:{backgroundColor:e.purple,borderColor:e.purple},driverTabText:{fontFamily:T.interBold,fontSize:10.5,color:e.grayText},driverTabTextActive:{color:e.white},driverCountBadge:{backgroundColor:"rgba(255, 255, 255, 0.25)",paddingHorizontal:5,paddingVertical:1,borderRadius:8},driverCountText:{fontFamily:T.interBold,fontSize:9.5,color:e.white},instancePill:{paddingHorizontal:7,paddingVertical:3,borderRadius:6,backgroundColor:`${e.purple}14`,borderWidth:1,borderColor:`${e.purple}30`},instancePillActive:{backgroundColor:e.purple,borderColor:e.purple},instancePillText:{fontFamily:T.interBold,fontSize:10,color:e.purple},instancePillTextActive:{color:e.white},actionBar:{flexDirection:"row",alignItems:"center",paddingHorizontal:12,paddingVertical:8,backgroundColor:e.primaryLight,borderBottomWidth:1,borderBottomColor:e.dividerColor,gap:6},searchBar:{flex:1,flexDirection:"row",alignItems:"center",backgroundColor:e.grayBackground,borderRadius:8,paddingHorizontal:9,paddingVertical:Ie.OS==="ios"?6:2,borderWidth:1,borderColor:e.grayBorderSecondary,gap:6},searchInput:{flex:1,fontFamily:T.interMedium,fontSize:12,color:e.primaryBlack,padding:0},addKeyBtn:{flexDirection:"row",alignItems:"center",gap:4,paddingHorizontal:10,paddingVertical:6,borderRadius:8,backgroundColor:e.purple},addKeyBtnText:{fontFamily:T.interBold,fontSize:11,color:e.white},actionIconBtn:{width:30,height:30,borderRadius:8,alignItems:"center",justifyContent:"center",backgroundColor:e.grayBackground,borderWidth:1,borderColor:e.grayBorderSecondary},statsStrip:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:12,paddingVertical:5,backgroundColor:`${e.grayBorderSecondary}40`},statsText:{fontFamily:T.interMedium,fontSize:10,color:e.grayText},statsSubtext:{fontFamily:T.interBold,fontSize:9.5,color:e.grayTextWeak},scrollArea:{flex:1},scrollContent:{padding:12,gap:10,paddingBottom:100},emptyScrollContent:{flexGrow:1,justifyContent:"center",alignItems:"center",padding:24,paddingBottom:60},entryCard:{backgroundColor:e.primaryLight,borderRadius:10,borderWidth:1,borderColor:e.grayBorderSecondary,padding:10,gap:8,shadowColor:e.black,shadowOpacity:.02,shadowRadius:3,shadowOffset:{width:0,height:1},elevation:1},entryHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},entryKey:{fontFamily:T.interBold,fontSize:12.5,color:e.primaryBlack},typeBadge:{paddingHorizontal:5,paddingVertical:1,borderRadius:4,borderWidth:1},typeBadgeText:{fontFamily:T.interBold,fontSize:8.5},sizeText:{fontFamily:T.interRegular,fontSize:10,color:e.grayTextWeak},entryActions:{flexDirection:"row",alignItems:"center",gap:5},entryActionBtn:{padding:5,borderRadius:5,backgroundColor:e.grayBackground},valuePreviewBox:{backgroundColor:e.grayBackground,borderRadius:6,padding:8,borderWidth:1,borderColor:`${e.grayBorderSecondary}80`},valuePreviewText:{fontFamily:T.interRegular,fontSize:11,color:e.primaryBlack,lineHeight:16},expandHint:{fontFamily:T.interBold,fontSize:9.5,color:e.purple,marginTop:4},loadingContainer:{flex:1,alignItems:"center",justifyContent:"center",gap:8},loadingText:{fontFamily:T.interMedium,fontSize:12,color:e.grayText},emptyContainer:{padding:24,alignItems:"center",justifyContent:"center"},emptyIconWrap:{width:56,height:56,borderRadius:28,backgroundColor:`${e.grayBorderSecondary}40`,alignItems:"center",justifyContent:"center",marginBottom:12},emptyTitle:{fontFamily:T.interBold,fontSize:14,color:e.primaryBlack,marginBottom:4},emptySubtitle:{fontFamily:T.interRegular,fontSize:11.5,color:e.grayText,textAlign:"center",maxWidth:280},connectGuideCard:{marginTop:20,width:"100%",backgroundColor:e.primaryLight,borderRadius:10,borderWidth:1,borderColor:e.grayBorderSecondary,padding:12,gap:6},connectGuideTitle:{fontFamily:T.interBold,fontSize:11,color:e.purple},connectGuideCode:{fontFamily:T.interRegular,fontSize:10,color:e.grayText,lineHeight:15},modalOverlay:{flex:1,backgroundColor:"rgba(0, 0, 0, 0.5)",justifyContent:"center",alignItems:"center",padding:16},modalCard:{width:"100%",maxWidth:400,backgroundColor:e.primaryLight,borderRadius:14,padding:16,gap:12,shadowColor:e.black,shadowOpacity:.2,shadowRadius:10,shadowOffset:{width:0,height:4},elevation:5},modalHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",borderBottomWidth:1,borderBottomColor:e.dividerColor,paddingBottom:10},modalTitle:{fontFamily:T.interBold,fontSize:14,color:e.primaryBlack},inputGroup:{gap:4},inputLabel:{fontFamily:T.interBold,fontSize:9.5,color:e.grayTextWeak,letterSpacing:.5},textInput:{backgroundColor:e.grayBackground,borderRadius:8,paddingHorizontal:10,paddingVertical:8,fontFamily:T.interMedium,fontSize:12,color:e.primaryBlack,borderWidth:1,borderColor:e.grayBorderSecondary},textInputDisabled:{backgroundColor:`${e.grayBorderSecondary}40`,color:e.grayText},textAreaInput:{minHeight:90,maxHeight:160,fontFamily:T.interRegular,fontSize:11},typeSelectorStrip:{flexDirection:"row",alignItems:"center",gap:6},typePill:{flex:1,alignItems:"center",paddingVertical:6,borderRadius:6,backgroundColor:e.grayBackground,borderWidth:1,borderColor:e.grayBorderSecondary},typePillActive:{backgroundColor:e.purple,borderColor:e.purple},typePillText:{fontFamily:T.interBold,fontSize:10,color:e.grayText},typePillTextActive:{color:e.white},formatJsonBtn:{fontFamily:T.interBold,fontSize:10,color:e.purple},errorText:{fontFamily:T.interMedium,fontSize:10,color:e.errorColor,marginTop:2},modalActions:{flexDirection:"row",alignItems:"center",gap:10,marginTop:4},cancelBtn:{flex:1,alignItems:"center",paddingVertical:10,borderRadius:8,backgroundColor:e.grayBackground,borderWidth:1,borderColor:e.grayBorderSecondary},cancelBtnText:{fontFamily:T.interBold,fontSize:12,color:e.grayText},saveBtn:{flex:1.5,flexDirection:"row",alignItems:"center",justifyContent:"center",gap:5,paddingVertical:10,borderRadius:8,backgroundColor:e.purple},saveBtnText:{fontFamily:T.interBold,fontSize:12,color:e.white}});export default StorageTab;