react-native-inapp-inspector 2.4.2 → 2.5.0

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

@@ -1,104 +1,104 @@
-import j,{useCallback as se,useMemo as H,useRef as qe}from"react";import{FlatList as De,Pressable as He,ScrollView as We,Text as V,TextInput as Ge,View as C}from"react-native";import{useInspector as _e}from"./InspectorContext";import O from"../TouchableScale";import Te from"../AnimatedEntrance";import Qe from"../DomainHeader";import Ue from"../LogCard";import Ke from"../EmptyState";import Xe from"../EndOfListFooter";import Je from"./NetworkFilterModal";import b from"../../styles";import{AppColors as o}from"../../styles/AppColors";import{AppFonts as I}from"../../styles/AppFonts";import{METHOD_COLORS as ze}from"../../constants";import{useTranslation as Ye}from"../../i18n";import{SearchIcon as Ze,ClearIcon as Co,TrashIcon as So,SortArrowIcon as To,FilterIcon as Vo,ChevronIcon as Io,CheckIcon as Fo,CircleCheckIcon as Ro,CircleXIcon as Lo,LayersIcon as Ve,ClockIcon as Bo,RequestIcon as Po,ResponseIcon as Eo,AtomIcon as Mo}from"../NetworkIcons";const No=j.memo(()=>{const{groupedData:Q,loadMoreSection:ne,search:F,setSearch:U,setSearchScope:de,quickFilter:K,setQuickFilter:le,handleDelete:Ie,isGroupByPageEnabled:k,setIsGroupByPageEnabled:ke,selectedLogs:X,sortOrder:Fe,setSortOrder:J,statusFilters:R,setStatusFilters:v,methodFilters:L,setMethodFilters:W,latencyFilter:$,setLatencyFilter:Y,protocolFilter:A,setProtocolFilter:Z,networkSortBy:q,setNetworkSortBy:ee,filteredLogs:B,logs:G,toggleSectionFilter:ce,toggleSectionCollapse:ue,minStart:ge,totalRange:pe,newLogIds:he,toggleSelect:me,setSelected:ye,maxNetworkLogs:ae}=_e(),{t:oe}=Ye(),Re=qe(null),[Le,fe]=j.useState(!1),[we,Ce]=j.useState(!1),[te,Se]=j.useState(ae||50);j.useEffect(()=>{Se(ae||50)},[F,K,ae]);const Be=H(()=>k?Q:Q.slice(0,te),[k,Q,te]),Pe=se(e=>e?.id?String(e.id):"",[]),M=H(()=>R.size>0&&!R.has("all")||L.size>0&&!L.has("all")||$!=="all"||A!=="all"||q!=="time_desc",[R,L,$,A,q]),Ee=H(()=>{let e=0;return R.size>0&&!R.has("all")&&(e+=R.size),L.size>0&&!L.has("all")&&(e+=L.size),$!=="all"&&e++,A!=="all"&&e++,q!=="time_desc"&&e++,e},[R,L,$,A,q]),Me=H(()=>({statusCodes:R.size>0?new Set(R):new Set(["all"]),methods:L.size>0?new Set(L):new Set(["all"]),latency:$,protocol:A,sortBy:q}),[R,L,$,A,q]),Ne=se(e=>{e.statusCodes.has("all")||e.statusCodes.size===0?v(new Set):v(new Set(e.statusCodes)),e.methods.has("all")||e.methods.size===0?W(new Set):W(new Set([...e.methods].map(T=>T))),Y(e.latency||"all"),Z(e.protocol||"all"),ee(e.sortBy||"time_desc"),e.sortBy==="time_asc"?J("oldest"):J("newest")},[v,W,Y,Z,ee,J]),P=H(()=>{let e=0,T=0,z=0,x=0,_=0,re=0;return G.forEach(S=>{const N=typeof S.status=="number"?S.status:parseInt(String(S.status),10);S.status===0||S.status==null||!isNaN(N)&&N>=400?e++:!isNaN(N)&&N>=200&&N<400&&T++,(S.duration||0)>=500&&z++;const E=(S.method||"").toUpperCase();E==="POST"&&x++,E==="GET"&&_++;const ie=(S.url||"").toLowerCase(),D=(S.client||"").toLowerCase();(ie.includes("graphql")||D.includes("graphql")||D.includes("apollo"))&&re++}),{all:G.length,errors:e,success:T,slow:z,post:x,get:_,graphql:re}},[G]),Oe=H(()=>[{id:"all",label:"All",count:P.all,color:o.purple},{id:"errors",label:"Errors",count:P.errors,color:o.errorColor},{id:"success",label:"2xx OK",count:P.success,color:o.greenColor},{id:"slow",label:"Slow >500ms",count:P.slow,color:o.warningIconGold},{id:"POST",label:"POST",count:P.post,color:ze.POST||o.blue500},{id:"GET",label:"GET",count:P.get,color:ze.GET||o.emerald500},{id:"graphql",label:"GraphQL",count:P.graphql,color:o.graphqlPink}],[P]),$e=se(({item:e,index:T})=>{if(e.type==="header")return<Te index={T}distance={8}>
+import j,{useCallback as se,useMemo as H,useRef as qe}from"react";import{FlatList as De,Pressable as He,ScrollView as We,Text as V,TextInput as Ge,View as S}from"react-native";import{useInspector as _e}from"./InspectorContext";import O from"../TouchableScale";import Te from"../AnimatedEntrance";import Qe from"../DomainHeader";import Ue from"../LogCard";import Ke from"../EmptyState";import Xe from"../EndOfListFooter";import Je from"./NetworkFilterModal";import b from"../../styles";import{AppColors as o}from"../../styles/AppColors";import{AppFonts as I}from"../../styles/AppFonts";import{METHOD_COLORS as ze}from"../../constants";import{useTranslation as Ye}from"../../i18n";import{SearchIcon as Ze,ClearIcon as So,TrashIcon as Co,SortArrowIcon as To,FilterIcon as Vo,ChevronIcon as Io,CheckIcon as Fo,CircleCheckIcon as Ro,CircleXIcon as Lo,LayersIcon as Ve,ClockIcon as Bo,RequestIcon as Po,ResponseIcon as Eo,AtomIcon as Mo}from"../NetworkIcons";const No=j.memo(()=>{const{groupedData:Q,loadMoreSection:ne,search:F,setSearch:U,setSearchScope:de,quickFilter:K,setQuickFilter:le,handleDelete:Ie,isGroupByPageEnabled:k,setIsGroupByPageEnabled:ke,selectedLogs:X,sortOrder:Fe,setSortOrder:J,statusFilters:R,setStatusFilters:v,methodFilters:L,setMethodFilters:W,latencyFilter:$,setLatencyFilter:Y,protocolFilter:A,setProtocolFilter:Z,networkSortBy:q,setNetworkSortBy:ee,filteredLogs:E,logs:G,toggleSectionFilter:ce,toggleSectionCollapse:ue,minStart:ge,totalRange:pe,newLogIds:he,toggleSelect:me,setSelected:ye,maxNetworkLogs:ae}=_e(),{t:oe}=Ye(),Re=qe(null),[Le,fe]=j.useState(!1),[we,Se]=j.useState(!1),[te,Ce]=j.useState(ae||50);j.useEffect(()=>{Ce(ae||50)},[F,K,ae]);const Be=H(()=>k?Q:Q.slice(0,te),[k,Q,te]),Pe=se(e=>e?.id?String(e.id):"",[]),M=H(()=>R.size>0&&!R.has("all")||L.size>0&&!L.has("all")||$!=="all"||A!=="all"||q!=="time_desc",[R,L,$,A,q]),Ee=H(()=>{let e=0;return R.size>0&&!R.has("all")&&(e+=R.size),L.size>0&&!L.has("all")&&(e+=L.size),$!=="all"&&e++,A!=="all"&&e++,q!=="time_desc"&&e++,e},[R,L,$,A,q]),Me=H(()=>({statusCodes:R.size>0?new Set(R):new Set(["all"]),methods:L.size>0?new Set(L):new Set(["all"]),latency:$,protocol:A,sortBy:q}),[R,L,$,A,q]),Ne=se(e=>{e.statusCodes.has("all")||e.statusCodes.size===0?v(new Set):v(new Set(e.statusCodes)),e.methods.has("all")||e.methods.size===0?W(new Set):W(new Set([...e.methods].map(T=>T))),Y(e.latency||"all"),Z(e.protocol||"all"),ee(e.sortBy||"time_desc"),e.sortBy==="time_asc"?J("oldest"):J("newest")},[v,W,Y,Z,ee,J]),B=H(()=>{let e=0,T=0,z=0,x=0,_=0,re=0;return G.forEach(C=>{const N=typeof C.status=="number"?C.status:parseInt(String(C.status),10);C.status===0||C.status==null||!isNaN(N)&&N>=400?e++:!isNaN(N)&&N>=200&&N<400&&T++,(C.duration||0)>=500&&z++;const P=(C.method||"").toUpperCase();P==="POST"&&x++,P==="GET"&&_++;const ie=(C.url||"").toLowerCase(),D=(C.client||"").toLowerCase();(ie.includes("graphql")||D.includes("graphql")||D.includes("apollo"))&&re++}),{all:G.length,errors:e,success:T,slow:z,post:x,get:_,graphql:re}},[G]),Oe=H(()=>[{id:"all",label:"All",count:B.all,color:o.purple},{id:"errors",label:"Errors",count:B.errors,color:o.errorColor},{id:"success",label:"2xx OK",count:B.success,color:o.greenColor},{id:"slow",label:"Slow >500ms",count:B.slow,color:o.warningIconGold},{id:"POST",label:"POST",count:B.post,color:ze.POST||o.blue500},{id:"GET",label:"GET",count:B.get,color:ze.GET||o.emerald500},{id:"graphql",label:"GraphQL",count:B.graphql,color:o.graphqlPink}],[B]),$e=se(({item:e,index:T})=>{if(e.type==="header")return<Te index={T}distance={8}>
             <Qe pageName={e.pageName}color={e.color}stats={e.stats}activeFilters={e.activeFilters}onToggleFilter={ce}isCollapsed={e.isCollapsed}onToggleCollapse={ue}isFirst={e.isFirst}timestamp={e.timestamp}/>
-          </Te>;if(e.type==="loadMore"){const{pageName:re,color:S,remainingCount:N,totalCount:E,loadedCount:ie,loadMoreStep:D,hasMore:Ae}=e;return<C style={[b.treeNodeRow,b.treeNodeRowLast]}>
-            <C style={b.treeLines}>
-              <C style={[b.modernTreeLine,{borderColor:S},b.modernTreeLineLast]}/>
-            </C>
-            <C style={b.treeCardWrapper}>
-              {Ae?<O onPress={()=>ne(re,D||10)}hitSlop={6}style={{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingVertical:9,paddingHorizontal:12,marginVertical:3,marginRight:2,borderRadius:10,backgroundColor:`${S}14`,borderWidth:1.5,borderColor:`${S}40`,shadowColor:S,shadowOffset:{width:0,height:1.5},shadowOpacity:.1,shadowRadius:3,elevation:2}}>
-                  <C style={{flexDirection:"row",alignItems:"center",gap:8}}>
-                    <C style={{width:22,height:22,borderRadius:11,backgroundColor:S,alignItems:"center",justifyContent:"center",shadowColor:S,shadowOffset:{width:0,height:1},shadowOpacity:.25,shadowRadius:2,elevation:1}}>
+          </Te>;if(e.type==="loadMore"){const{pageName:re,color:C,remainingCount:N,totalCount:P,loadedCount:ie,loadMoreStep:D,hasMore:Ae}=e;return<S style={[b.treeNodeRow,b.treeNodeRowLast]}>
+            <S style={b.treeLines}>
+              <S style={[b.modernTreeLine,{borderColor:C},b.modernTreeLineLast]}/>
+            </S>
+            <S style={b.treeCardWrapper}>
+              {Ae?<O onPress={()=>ne(re,D||10)}hitSlop={6}style={{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingVertical:9,paddingHorizontal:12,marginVertical:3,marginRight:2,borderRadius:10,backgroundColor:`${C}14`,borderWidth:1.5,borderColor:`${C}40`,shadowColor:C,shadowOffset:{width:0,height:1.5},shadowOpacity:.1,shadowRadius:3,elevation:2}}>
+                  <S style={{flexDirection:"row",alignItems:"center",gap:8}}>
+                    <S style={{width:22,height:22,borderRadius:11,backgroundColor:C,alignItems:"center",justifyContent:"center",shadowColor:C,shadowOffset:{width:0,height:1},shadowOpacity:.25,shadowRadius:2,elevation:1}}>
                       <Io color={o.white}size={9}direction="down"/>
-                    </C>
-                    <C>
-                      <V style={{fontFamily:I.interBold,fontSize:12,color:S}}>
+                    </S>
+                    <S>
+                      <V style={{fontFamily:I.interBold,fontSize:12,color:C}}>
                         {oe("footer.loadMoreRequests",{count:D,defaultValue:`Load ${D} More Requests`})}
                       </V>
                       <V style={{fontFamily:I.interRegular,fontSize:9.5,color:o.grayTextWeak,marginTop:1}}>
-                        Showing {ie} of {E} requests
+                        Showing {ie} of {P} requests
                       </V>
-                    </C>
-                  </C>
+                    </S>
+                  </S>
 
-                  <C style={{flexDirection:"row",alignItems:"center",backgroundColor:`${S}25`,paddingHorizontal:8,paddingVertical:4,borderRadius:8,borderWidth:1,borderColor:`${S}40`,gap:3}}>
-                    <V style={{fontFamily:I.interBold,fontSize:10.5,color:S}}>
+                  <S style={{flexDirection:"row",alignItems:"center",backgroundColor:`${C}25`,paddingHorizontal:8,paddingVertical:4,borderRadius:8,borderWidth:1,borderColor:`${C}40`,gap:3}}>
+                    <V style={{fontFamily:I.interBold,fontSize:10.5,color:C}}>
                       +{N}
                     </V>
-                    <V style={{fontFamily:I.interRegular,fontSize:9,color:S}}>
+                    <V style={{fontFamily:I.interRegular,fontSize:9,color:C}}>
                       more
                     </V>
-                  </C>
-                </O>:<C style={{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingVertical:7,paddingHorizontal:11,marginVertical:3,marginRight:2,borderRadius:9,backgroundColor:`${S}0A`,borderWidth:1,borderColor:`${S}25`}}>
-                  <C style={{flexDirection:"row",alignItems:"center",gap:7}}>
-                    <C style={{width:17,height:17,borderRadius:8.5,backgroundColor:`${S}25`,alignItems:"center",justifyContent:"center"}}>
-                      <Fo color={S}size={8}/>
-                    </C>
+                  </S>
+                </O>:<S style={{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingVertical:7,paddingHorizontal:11,marginVertical:3,marginRight:2,borderRadius:9,backgroundColor:`${C}0A`,borderWidth:1,borderColor:`${C}25`}}>
+                  <S style={{flexDirection:"row",alignItems:"center",gap:7}}>
+                    <S style={{width:17,height:17,borderRadius:8.5,backgroundColor:`${C}25`,alignItems:"center",justifyContent:"center"}}>
+                      <Fo color={C}size={8}/>
+                    </S>
                     <V style={{fontFamily:I.interMedium,fontSize:11,color:o.grayTextStrong}}>
-                      {oe("footer.allLoaded",{count:E,defaultValue:`All ${E} requests loaded`})}
+                      {oe("footer.allLoaded",{count:P,defaultValue:`All ${P} requests loaded`})}
                     </V>
-                  </C>
+                  </S>
 
-                  <C style={{backgroundColor:`${S}18`,paddingHorizontal:7,paddingVertical:2,borderRadius:6}}>
-                    <V style={{fontFamily:I.interBold,fontSize:9.5,color:S}}>
-                      {E}/{E}
+                  <S style={{backgroundColor:`${C}18`,paddingHorizontal:7,paddingVertical:2,borderRadius:6}}>
+                    <V style={{fontFamily:I.interBold,fontSize:9.5,color:C}}>
+                      {P}/{P}
                     </V>
-                  </C>
-                </C>}
-            </C>
-          </C>}const{log:z,isLast:x,color:_}=e;return<Te index={T}distance={8}style={k?[b.treeNodeRow,x&&b.treeNodeRowLast]:{marginBottom:6,marginHorizontal:2}}>
-          {k&&<C style={b.treeLines}>
-              <C style={[b.modernTreeLine,{borderColor:_},x&&b.modernTreeLineLast]}/>
-              {!x&&<C style={[b.modernTreeBranch,{borderColor:_}]}/>}
-            </C>}
-          <C style={k?b.treeCardWrapper:{flex:1}}>
+                  </S>
+                </S>}
+            </S>
+          </S>}const{log:z,isLast:x,color:_}=e;return<Te index={T}distance={8}style={k?[b.treeNodeRow,x&&b.treeNodeRowLast]:{marginBottom:5,marginHorizontal:5}}>
+          {k&&<S style={b.treeLines}>
+              <S style={[b.modernTreeLine,{borderColor:_},x&&b.modernTreeLineLast]}/>
+              {!x&&<S style={[b.modernTreeBranch,{borderColor:_}]}/>}
+            </S>}
+          <S style={k?b.treeCardWrapper:{flex:1}}>
             <Ue item={z}isSelected={X.has(z.id)}onToggleSelect={me}onPress={()=>{ye(z)}}timelineMinStart={ge}timelineTotalRange={pe}isNew={he.has(z.id)}searchStr={F}/>
-          </C>
-        </Te>},[k,ge,pe,he,X,me,F,ce,ue,ne,ye,oe]);return<C style={{flex:1}}>
-      <C style={{marginTop:6}}>
+          </S>
+        </Te>},[k,ge,pe,he,X,me,F,ce,ue,ne,ye,oe]);return<S style={{flex:1}}>
+      <S style={{marginTop:6}}>
             
-            <C style={b.toolbarRow}>
-              <C style={[b.searchContainer,we&&{borderColor:o.purple,borderWidth:1.5}]}>
+            <S style={b.toolbarRow}>
+              <S style={[b.searchContainer,we&&{borderColor:o.purple,borderWidth:1.5}]}>
                 <Ze color={we?o.purple:o.grayTextWeak}size={15}/>
-                <Ge placeholder="Search URL, status, method, headers, body..."placeholderTextColor={o.grayTextWeak}value={F}onChangeText={U}onFocus={()=>Ce(!0)}onBlur={()=>Ce(!1)}style={b.searchInput}autoCorrect={!1}autoCapitalize="none"/>
+                <Ge placeholder="Search URL, status, method, headers, body..."placeholderTextColor={o.grayTextWeak}value={F}onChangeText={U}onFocus={()=>Se(!0)}onBlur={()=>Se(!1)}style={b.searchInput}autoCorrect={!1}autoCapitalize="none"/>
 
-                {F.length>0&&<C style={{flexDirection:"row",alignItems:"center",gap:4}}>
-                    <C style={{backgroundColor:`${o.purple}20`,borderRadius:10,paddingHorizontal:6,paddingVertical:1.5}}>
+                {F.length>0&&<S style={{flexDirection:"row",alignItems:"center",gap:4}}>
+                    <S style={{backgroundColor:`${o.purple}20`,borderRadius:10,paddingHorizontal:6,paddingVertical:1.5}}>
                       <V style={{color:o.purple,fontSize:9.5,fontFamily:I.interBold}}>
-                        {B.length}
+                        {E.length}
                       </V>
-                    </C>
+                    </S>
                     <He onPress={()=>U("")}hitSlop={10}style={b.clearBtn}>
-                      <Co color={o.grayTextWeak}size={13}/>
+                      <So color={o.grayTextWeak}size={13}/>
                     </He>
-                  </C>}
-              </C>
+                  </S>}
+              </S>
 
-              <C style={b.toolbarRight}>
+              <S style={b.toolbarRight}>
                 <O style={[b.toolbarBtn,{borderColor:`${o.errorColor}38`,backgroundColor:`${o.errorColor}0F`}]}onPress={Ie}hitSlop={6}>
-                  <So color={o.errorColor}size={15}/>
-                  {X.size>0&&<C style={b.trashBadge}>
+                  <Co color={o.errorColor}size={15}/>
+                  {X.size>0&&<S style={b.trashBadge}>
                       <V style={b.trashBadgeText}>
                         {X.size}
                       </V>
-                    </C>}
+                    </S>}
                 </O>
 
                 <O style={[b.toolbarBtn,k&&{borderColor:o.purple,backgroundColor:`${o.purple}15`}]}onPress={()=>ke(e=>!e)}hitSlop={6}accessibilityLabel={k?"Page Accordion Grouping Enabled (Tap for Plain List)":"Plain List Enabled (Tap for Page Accordion)"}accessibilityRole="button">
                   <Ve color={k?o.purple:o.grayTextStrong}size={16}/>
-                  {k&&<C style={b.activeFilterDot}/>}
+                  {k&&<S style={b.activeFilterDot}/>}
                 </O>
 
                 <O style={b.toolbarBtn}onPress={()=>J(e=>e==="newest"?"oldest":"newest")}hitSlop={10}>
                   <To direction={Fe==="newest"?"down":"up"}color={o.grayTextStrong}size={18}/>
                 </O>
-              </C>
-            </C>
+              </S>
+            </S>
 
             
-            <C style={{flexDirection:"row",alignItems:"center",marginBottom:8,paddingHorizontal:12,gap:6}}>
+            <S style={{flexDirection:"row",alignItems:"center",marginBottom:8,paddingHorizontal:8,gap:6}}>
               <We horizontal showsHorizontalScrollIndicator={!1}style={{flex:1}}contentContainerStyle={{flexDirection:"row",alignItems:"center",gap:6,paddingRight:6}}>
                 {Oe.map(e=>{const T=K===e.id,z=e.color||o.purple,x=T?o.white:z;return<O key={e.id}onPress={()=>{le(T?"all":e.id)}}>
-                      <C style={{flexDirection:"row",alignItems:"center",paddingHorizontal:9,paddingVertical:4.5,borderRadius:8,backgroundColor:T?z:`${z}12`,borderWidth:1,borderColor:T?z:`${z}30`,gap:5}}>
+                      <S style={{flexDirection:"row",alignItems:"center",paddingHorizontal:9,paddingVertical:4.5,borderRadius:8,backgroundColor:T?z:`${z}12`,borderWidth:1,borderColor:T?z:`${z}30`,gap:5}}>
                         {e.id==="all"&&<Ve size={11}color={x}/>}
                         {e.id==="errors"&&<Lo size={11}color={x}/>}
                         {e.id==="success"&&<Ro size={11}color={x}/>}
@@ -109,45 +109,45 @@ import j,{useCallback as se,useMemo as H,useRef as qe}from"react";import{FlatLis
                         <V style={{fontFamily:I.interBold,fontSize:10.5,color:T?o.white:o.primaryBlack}}>
                           {e.label}
                         </V>
-                        <C style={{backgroundColor:T?"rgba(255,255,255,0.25)":`${z}20`,paddingHorizontal:5,paddingVertical:1,borderRadius:8}}>
+                        <S style={{backgroundColor:T?"rgba(255,255,255,0.25)":`${z}20`,paddingHorizontal:5,paddingVertical:1,borderRadius:8}}>
                           <V style={{fontFamily:I.interBold,fontSize:9,color:T?o.white:z}}>
                             {e.count}
                           </V>
-                        </C>
-                      </C>
+                        </S>
+                      </S>
                     </O>})}
               </We>
 
               <O onPress={()=>fe(!0)}style={{flexShrink:0}}>
-                <C style={{flexDirection:"row",alignItems:"center",paddingHorizontal:10,paddingVertical:4.5,borderRadius:8,backgroundColor:M?`${o.purple}20`:o.grayBackground,borderWidth:1,borderColor:M?o.purple:o.grayBorderSecondary,gap:5,shadowColor:o.black,shadowOpacity:.04,shadowRadius:2,shadowOffset:{width:0,height:1},elevation:1}}>
+                <S style={{flexDirection:"row",alignItems:"center",paddingHorizontal:10,paddingVertical:4.5,borderRadius:8,backgroundColor:M?`${o.purple}20`:o.grayBackground,borderWidth:1,borderColor:M?o.purple:o.grayBorderSecondary,gap:5,shadowColor:o.black,shadowOpacity:.04,shadowRadius:2,shadowOffset:{width:0,height:1},elevation:1}}>
                   <Vo size={11}color={M?o.purple:o.grayText}/>
                   <V style={{fontFamily:I.interBold,fontSize:10.5,color:M?o.purple:o.grayText}}>
                     {oe("network.moreFilters","More Filters")}
                   </V>
-                  {M&&<C style={{backgroundColor:o.purple,paddingHorizontal:4.5,paddingVertical:1,borderRadius:6}}>
+                  {M&&<S style={{backgroundColor:o.purple,paddingHorizontal:4.5,paddingVertical:1,borderRadius:6}}>
                       <V style={{fontFamily:I.interBold,fontSize:8.5,color:o.white}}>
                         {Ee}
                       </V>
-                    </C>}
-                </C>
+                    </S>}
+                </S>
               </O>
-            </C>
+            </S>
 
             
-            {(K!=="all"||F.trim().length>0||M||B.length!==G.length)&&<C style={{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginHorizontal:12,marginBottom:8,paddingHorizontal:10,paddingVertical:5.5,backgroundColor:`${o.purple}10`,borderRadius:8,borderWidth:1,borderColor:`${o.purple}25`}}>
+            {(K!=="all"||F.trim().length>0||M||E.length!==G.length)&&<S style={{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginHorizontal:8,marginBottom:8,paddingHorizontal:8,paddingVertical:5.5,backgroundColor:`${o.purple}10`,borderRadius:8,borderWidth:1,borderColor:`${o.purple}25`}}>
                 <V style={{fontFamily:I.interMedium,fontSize:10.5,color:o.purple}}>
-                  Showing {B.length} of {G.length} requests
+                  Showing {E.length} of {G.length} requests
                 </V>
                 <O onPress={()=>{U(""),le("all"),v(new Set),W(new Set),Y("all"),Z("all"),ee("time_desc"),de("all")}}>
                   <V style={{fontFamily:I.interBold,fontSize:10.5,color:o.errorColor}}>
                     Clear All Filters
                   </V>
                 </O>
-              </C>}
-          </C>
+              </S>}
+          </S>
 
-        <De ref={Re}data={Be}keyExtractor={Pe}renderItem={$e}initialNumToRender={10}maxToRenderPerBatch={8}windowSize={5}updateCellsBatchingPeriod={40}removeClippedSubviews={!0}renderToHardwareTextureAndroid={!0}showsVerticalScrollIndicator={!1}ListEmptyComponent={<Ke isSearch={F.length>0||M||K!=="all"}searchQuery={F}customTitle={F.length>0?"No matching API requests":"No network activity"}onClearSearch={()=>{U(""),v(new Set),W(new Set),Y("all"),Z("all"),ee("time_desc"),le("all"),de("all")}}/>}ListFooterComponent={Q.length>0?<Xe count={k?B.length:Math.min(te,B.length)}totalCount={B.length}label="requests"hasMore={!k&&B.length>te}loadMoreStep={30}onLoadMore={()=>Se(e=>e+30)}/>:null}contentContainerStyle={[b.listContent,B.length===0&&{flexGrow:1}]}keyboardShouldPersistTaps="handled"/>
+        <De ref={Re}data={Be}keyExtractor={Pe}renderItem={$e}initialNumToRender={10}maxToRenderPerBatch={8}windowSize={5}updateCellsBatchingPeriod={40}removeClippedSubviews={!0}renderToHardwareTextureAndroid={!0}showsVerticalScrollIndicator={!1}nestedScrollEnabled={!0}ListEmptyComponent={<Ke isSearch={F.length>0||M||K!=="all"}searchQuery={F}customTitle={F.length>0?"No matching API requests":"No network activity"}onClearSearch={()=>{U(""),v(new Set),W(new Set),Y("all"),Z("all"),ee("time_desc"),le("all"),de("all")}}/>}ListFooterComponent={Q.length>0?<Xe count={k?E.length:Math.min(te,E.length)}totalCount={E.length}label="requests"hasMore={!k&&E.length>te}loadMoreStep={30}onLoadMore={()=>Ce(e=>e+30)}/>:null}style={{flex:1}}contentContainerStyle={[b.listContent,{flexGrow:1}]}keyboardShouldPersistTaps="handled"/>
 
       
       <Je visible={Le}onClose={()=>fe(!1)}filters={Me}onApply={Ne}searchQuery={F}/>
-    </C>});export default No;
+    </S>});export default No;

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

@@ -87,4 +87,4 @@ import O,{useMemo as R}from"react";import{StyleSheet as F,Text as T,View as C}fr
           </C>
         </C>
       </C>
-    </J>}const o=F.create({card:{height:140,alignSelf:"stretch",borderRadius:10,overflow:"hidden",borderWidth:1,borderColor:e.dividerColor,shadowColor:e.shadowColorString,marginBottom:6},cardBody:{height:"100%",paddingHorizontal:12,paddingTop:10,paddingBottom:8,justifyContent:"space-between"},cardHeaderRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",height:22,minHeight:22,maxHeight:22},cardHeaderLeft:{flexDirection:"row",alignItems:"center",flex:1,marginRight:8,gap:6,minWidth:0,overflow:"hidden"},cardHeaderRight:{flexDirection:"row",alignItems:"center",gap:6,flexShrink:0},serialNumber:{fontFamily:S.interBold,color:e.grayTextWeak,fontSize:10},methodBadge:{paddingHorizontal:7,paddingVertical:2.5,borderRadius:5,alignItems:"center",justifyContent:"center"},methodBadgeText:{fontFamily:S.interBold,fontSize:9.5,lineHeight:12,letterSpacing:.5,color:e.white},chip:{paddingHorizontal:6,paddingVertical:2,borderRadius:4,borderWidth:1},chipText:{fontFamily:S.interBold,fontSize:9,lineHeight:12},statusPill:{flexDirection:"row",alignItems:"center",gap:4,paddingHorizontal:7,paddingVertical:2.5,borderRadius:6,borderWidth:1,flexShrink:0},statusPillText:{fontFamily:S.interBold,fontSize:10,lineHeight:13},messageBox:{backgroundColor:e.grayBackground,borderRadius:7,borderWidth:1,borderColor:e.dividerColor,paddingHorizontal:10,paddingVertical:6,height:68,minHeight:68,maxHeight:68,justifyContent:"center",gap:2,overflow:"hidden"},messageTitle:{fontFamily:S.interBold,fontSize:12,color:e.primaryBlack,lineHeight:16},messageBody:{fontFamily:S.interRegular,fontSize:11,color:e.grayText,lineHeight:15},highlight:{backgroundColor:e.yellowHighlight,color:e.primaryBlack,borderRadius:2},cardFooterRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",height:18,minHeight:18,maxHeight:18,gap:6},footerLeft:{flexDirection:"row",alignItems:"center",gap:6,flex:1,minWidth:0,overflow:"hidden"},footerRight:{flexDirection:"row",alignItems:"center",gap:5,flexShrink:0},cardDateRow:{flexDirection:"row",alignItems:"center",gap:3.5},cardDateText:{fontFamily:S.interRegular,fontSize:10,lineHeight:13,color:e.slate400},callerChip:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:e.skySoftBg,borderColor:e.skySoftBorder,borderWidth:1,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4,flexShrink:1,minWidth:0},callerChipText:{color:e.skySoftText,fontSize:9,lineHeight:12,fontFamily:S.interBold},metaStatChip:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:`${e.purple}14`,borderColor:`${e.purple}2B`,borderWidth:1,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4},metaStatText:{color:e.purple,fontSize:9,lineHeight:12,fontFamily:S.interBold}});function ee(r,t){return r.item===t.item&&r.searchStr===t.searchStr&&r.onPress===t.onPress}export default O.memo(Z,ee);
+    </J>}const o=F.create({card:{height:140,alignSelf:"stretch",borderRadius:10,overflow:"hidden",borderWidth:1,borderColor:e.dividerColor,shadowColor:e.shadowColorString,marginBottom:6},cardBody:{height:"100%",paddingHorizontal:8,paddingTop:8,paddingBottom:6,justifyContent:"space-between"},cardHeaderRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",height:22,minHeight:22,maxHeight:22},cardHeaderLeft:{flexDirection:"row",alignItems:"center",flex:1,marginRight:4,gap:4.5,minWidth:0,overflow:"hidden"},cardHeaderRight:{flexDirection:"row",alignItems:"center",gap:4,flexShrink:0},serialNumber:{fontFamily:S.interBold,color:e.grayTextWeak,fontSize:10},methodBadge:{paddingHorizontal:6,paddingVertical:2,borderRadius:5,alignItems:"center",justifyContent:"center"},methodBadgeText:{fontFamily:S.interBold,fontSize:9.5,lineHeight:12,letterSpacing:.5,color:e.white},chip:{paddingHorizontal:5.5,paddingVertical:1.5,borderRadius:4,borderWidth:1},chipText:{fontFamily:S.interBold,fontSize:9,lineHeight:12},statusPill:{flexDirection:"row",alignItems:"center",gap:3.5,paddingHorizontal:6,paddingVertical:2,borderRadius:6,borderWidth:1,flexShrink:0},statusPillText:{fontFamily:S.interBold,fontSize:9.5,lineHeight:12},messageBox:{backgroundColor:e.grayBackground,borderRadius:7,borderWidth:1,borderColor:e.dividerColor,paddingHorizontal:7,paddingVertical:5,height:68,minHeight:68,maxHeight:68,justifyContent:"center",gap:2,overflow:"hidden"},messageTitle:{fontFamily:S.interBold,fontSize:12,color:e.primaryBlack,lineHeight:16},messageBody:{fontFamily:S.interRegular,fontSize:11,color:e.grayText,lineHeight:15},highlight:{backgroundColor:e.yellowHighlight,color:e.primaryBlack,borderRadius:2},cardFooterRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",height:18,minHeight:18,maxHeight:18,gap:4},footerLeft:{flexDirection:"row",alignItems:"center",gap:4.5,flex:1,minWidth:0,overflow:"hidden"},footerRight:{flexDirection:"row",alignItems:"center",gap:4,flexShrink:0},cardDateRow:{flexDirection:"row",alignItems:"center",gap:3.5},cardDateText:{fontFamily:S.interRegular,fontSize:10,lineHeight:13,color:e.slate400},callerChip:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:e.skySoftBg,borderColor:e.skySoftBorder,borderWidth:1,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4,flexShrink:1,minWidth:0},callerChipText:{color:e.skySoftText,fontSize:9,lineHeight:12,fontFamily:S.interBold},metaStatChip:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:`${e.purple}14`,borderColor:`${e.purple}2B`,borderWidth:1,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4},metaStatText:{color:e.purple,fontSize:9,lineHeight:12,fontFamily:S.interBold}});function ee(r,t){return r.item===t.item&&r.searchStr===t.searchStr&&r.onPress===t.onPress}export default O.memo(Z,ee);

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

@@ -1,4 +1,4 @@
-import U,{useMemo as j,useState as J}from"react";import{Image as K,ScrollView as P,StyleSheet as E,Text as T,View as C}from"react-native";import I from"../../styles";import{AppColors as e}from"../../styles/AppColors";import{AppFonts as V}from"../../styles/AppFonts";import{useTranslation as _}from"../../i18n";import{formatDateTime as Y}from"../../helpers";import{sharePushReport as q}from"../../helpers/shareFormatter";import G from"../ShareButton";import R from"../CopyButton";import F from"../JsonViewer";import Q from"../SegmentedTabs";import{BellIcon as X,ClockIcon as Z,CloudPushIcon as Te,EyeIcon as Ce,LayersIcon as Ve,MetadataIcon as Se,RawJsonIcon as Be,LinkChainIcon as Ie,VolumeIcon as De,BoltIcon as Pe,BuildingIcon as Re,SettingsIcon as Fe}from"../NetworkIcons";const A=U.memo(function({item:o}){const{t:B}=_(),[z,N]=J("preview"),v=j(()=>o?Y(o.timestamp):"",[o]);if(!o)return null;const W=async()=>{await q(o)},H=[{key:"preview",label:B("push.preview","Preview"),themeColor:e.brandPurple,icon:S=><Ce size={12}color={S?e.white:e.grayText}/>},{key:"payload",label:B("push.payload","Custom Payload"),themeColor:e.violet600,icon:S=><Ve size={12}color={S?e.white:e.grayText}/>},{key:"headers",label:B("push.deliveryMetadata","Delivery Metadata"),themeColor:e.teal600,icon:S=><Se size={12}color={S?e.white:e.grayText}/>},{key:"raw",label:B("push.rawPayload","Raw Payload"),themeColor:e.sky600,icon:S=><Be size={12}color={S?e.white:e.grayText}/>}],O=(o.source||"PUSH").toUpperCase(),L=(o.appState||"STATE").toUpperCase(),$=!!(o.data?.deepLink||o.data?.openDirectUrl||o.data?._od||o.customDomainAttributes?.openDirectUrl),M=o.data?.deepLink||o.data?.openDirectUrl||o.data?._od||o.customDomainAttributes?.openDirectUrl||"";return<C style={{flex:1}}>
+import U,{useMemo as j,useState as J}from"react";import{Image as K,ScrollView as P,StyleSheet as E,Text as T,View as C}from"react-native";import I from"../../styles";import{AppColors as e}from"../../styles/AppColors";import{AppFonts as V}from"../../styles/AppFonts";import{useTranslation as _}from"../../i18n";import{formatDateTime as Y}from"../../helpers";import{sharePushReport as q}from"../../helpers/shareFormatter";import G from"../ShareButton";import R from"../CopyButton";import F from"../JsonViewer";import Q from"../SegmentedTabs";import{BellIcon as X,ClockIcon as Z,CloudPushIcon as Te,EyeIcon as Ce,LayersIcon as Ve,MetadataIcon as Se,RawJsonIcon as Be,LinkChainIcon as Ie,VolumeIcon as De,BoltIcon as Pe,BuildingIcon as Re,SettingsIcon as Fe}from"../NetworkIcons";const A=U.memo(function({item:o}){const{t:S}=_(),[z,N]=J("preview"),v=j(()=>o?Y(o.timestamp):"",[o]);if(!o)return null;const W=async()=>{await q(o)},H=[{key:"preview",label:S("push.preview","Preview"),themeColor:e.brandPurple,icon:B=><Ce size={12}color={B?e.white:e.grayText}/>},{key:"payload",label:S("push.payload","Custom Payload"),themeColor:e.violet600,icon:B=><Ve size={12}color={B?e.white:e.grayText}/>},{key:"headers",label:S("push.deliveryMetadata","Delivery Metadata"),themeColor:e.teal600,icon:B=><Se size={12}color={B?e.white:e.grayText}/>},{key:"raw",label:S("push.rawPayload","Raw Payload"),themeColor:e.sky600,icon:B=><Be size={12}color={B?e.white:e.grayText}/>}],O=(o.source||"PUSH").toUpperCase(),L=(o.appState||"STATE").toUpperCase(),$=!!(o.data?.deepLink||o.data?.openDirectUrl||o.data?._od||o.customDomainAttributes?.openDirectUrl),M=o.data?.deepLink||o.data?.openDirectUrl||o.data?._od||o.customDomainAttributes?.openDirectUrl||"";return<C style={{flex:1}}>
       
       <C style={{paddingHorizontal:8,paddingTop:4}}>
         <C style={I.detailInfoBar}>
@@ -66,7 +66,7 @@ import U,{useMemo as j,useState as J}from"react";import{Image as K,ScrollView as
               {$?<C style={{flexDirection:"row",alignItems:"center",gap:4,marginTop:2}}>
                   <Ie size={11}color={e.brandPurple}/>
                   <T style={{fontSize:10,fontFamily:V.interBold,color:e.brandPurple}}>
-                    {B("push.link","LINK")}:
+                    {S("push.link","LINK")}:
                   </T>
                   <T style={{fontSize:10.5,fontFamily:V.interRegular,color:e.sky600}}numberOfLines={1}>
                     {M}
@@ -79,7 +79,7 @@ import U,{useMemo as j,useState as J}from"react";import{Image as K,ScrollView as
 
       
       <C style={{paddingHorizontal:8,paddingVertical:6}}>
-        <Q tabs={H}activeKey={z}onChange={S=>N(S)}scrollable={!0}/>
+        <Q tabs={H}activeKey={z}onChange={B=>N(B)}scrollable={!0}/>
       </C>
 
       
@@ -92,9 +92,9 @@ import U,{useMemo as j,useState as J}from"react";import{Image as K,ScrollView as
                   <X size={12}color={e.white}/>
                 </C>
                 <T style={t.mockupAppName}>
-                  {o.domain||B("push.appNotification","App Notification")}
+                  {o.domain||S("push.appNotification","App Notification")}
                 </T>
-                <T style={t.mockupTime}>• {B("push.now","now")}</T>
+                <T style={t.mockupTime}>• {S("push.now","now")}</T>
               </C>
 
               
@@ -136,10 +136,10 @@ import U,{useMemo as j,useState as J}from"react";import{Image as K,ScrollView as
             {o.customDomainAttributes&&Object.keys(o.customDomainAttributes).length>0&&<C style={t.sectionCard}>
                 <C style={{flexDirection:"row",alignItems:"center",gap:6,marginBottom:8}}>
                   <Re size={13}color={e.blue600}/>
-                  <T style={t.sectionTitle}>{B("push.domainFields","Domain Specific Fields")}</T>
+                  <T style={t.sectionTitle}>{S("push.domainFields","Domain Specific Fields")}</T>
                 </C>
-                {Object.entries(o.customDomainAttributes).map(([S,D])=><C key={S}style={t.keyValRow}>
-                    <T style={t.keyText}>{S}:</T>
+                {Object.entries(o.customDomainAttributes).map(([B,D])=><C key={B}style={t.keyValRow}>
+                    <T style={t.keyText}>{B}:</T>
                     <T style={t.valText}numberOfLines={2}>
                       {typeof D=="object"?JSON.stringify(D):String(D)}
                     </T>
@@ -153,42 +153,42 @@ import U,{useMemo as j,useState as J}from"react";import{Image as K,ScrollView as
             <C style={t.sectionCard}>
               <C style={{flexDirection:"row",alignItems:"center",gap:6,marginBottom:8}}>
                 <Fe size={13}color={e.slate600}/>
-                <T style={t.sectionTitle}>{B("push.deliveryMetadata","Delivery & Message Metadata")}</T>
+                <T style={t.sectionTitle}>{S("push.deliveryMetadata","Delivery & Message Metadata")}</T>
               </C>
               <C style={t.keyValRow}>
-                <T style={t.keyText}>Message ID:</T>
+                <T style={t.keyText}>{S("push.messageId","Message ID:")}</T>
                 <T style={t.valText}selectable>{o.id||"N/A"}</T>
               </C>
               <C style={t.keyValRow}>
-                <T style={t.keyText}>Source / Domain:</T>
+                <T style={t.keyText}>{S("push.sourceDomain","Source / Domain:")}</T>
                 <T style={t.valText}>{o.domain||o.source||"N/A"}</T>
               </C>
               <C style={t.keyValRow}>
-                <T style={t.keyText}>App State:</T>
+                <T style={t.keyText}>{S("push.appState","App State:")}</T>
                 <T style={t.valText}>{o.appState}</T>
               </C>
               <C style={t.keyValRow}>
-                <T style={t.keyText}>Action Type:</T>
+                <T style={t.keyText}>{S("push.actionType","Action Type:")}</T>
                 <T style={t.valText}>{o.action}</T>
               </C>
               <C style={t.keyValRow}>
-                <T style={t.keyText}>Timestamp:</T>
+                <T style={t.keyText}>{S("push.timestamp","Timestamp:")}</T>
                 <T style={t.valText}>{v}</T>
               </C>
               <C style={t.keyValRow}>
-                <T style={t.keyText}>Channel ID:</T>
+                <T style={t.keyText}>{S("push.channelId","Channel ID:")}</T>
                 <T style={t.valText}>{o.channelId||"default"}</T>
               </C>
               <C style={t.keyValRow}>
-                <T style={t.keyText}>Sound:</T>
+                <T style={t.keyText}>{S("push.sound","Sound:")}</T>
                 <T style={t.valText}>{o.sound||"default"}</T>
               </C>
               <C style={t.keyValRow}>
-                <T style={t.keyText}>Badge Count:</T>
+                <T style={t.keyText}>{S("push.badgeCount","Badge Count:")}</T>
                 <T style={t.valText}>{o.badge!=null?o.badge:"None"}</T>
               </C>
               <C style={t.keyValRow}>
-                <T style={t.keyText}>Collapse Key:</T>
+                <T style={t.keyText}>{S("push.collapseKey","Collapse Key:")}</T>
                 <T style={t.valText}>{o.collapseKey||"None"}</T>
               </C>
             </C>

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

@@ -41,5 +41,5 @@ import K,{useCallback as B,useMemo as F,useRef as ne,useState as U}from"react";i
       </C>
 
       
-      <Ce ref={W}data={V}renderItem={re}keyExtractor={le}contentContainerStyle={k.listContent}initialNumToRender={10}maxToRenderPerBatch={8}windowSize={5}updateCellsBatchingPeriod={40}removeClippedSubviews={!0}renderToHardwareTextureAndroid={!0}showsVerticalScrollIndicator={!1}ListEmptyComponent={<Ee isSearch={!!(r||T!=="all")}searchQuery={r}customTitle={r||T!=="all"?x("push.noMatching","No matching push notifications"):x("push.noNotifications","No push notifications captured yet")}customSub={r||T!=="all"?x("push.adjustSearchFilter","Try adjusting your search query or filter chips."):x("push.noNotificationsDesc","Incoming or opened push payloads from any domain (Salesforce, FCM, APNs, etc.) will appear here automatically.")}onClearSearch={()=>{R(""),M("all")}}showReload={!1}/>}ListFooterComponent={P.length>0?<Fe count={V.length}totalCount={P.length}label="push notifications"loadMoreStep={J}hasMore={V.length<P.length}onLoadMore={()=>$(e=>e+J)}/>:null}/>
+      <Ce ref={W}data={V}renderItem={re}keyExtractor={le}style={{flex:1}}contentContainerStyle={[k.listContent,{flexGrow:1}]}initialNumToRender={10}maxToRenderPerBatch={8}windowSize={5}updateCellsBatchingPeriod={40}removeClippedSubviews={!0}renderToHardwareTextureAndroid={!0}showsVerticalScrollIndicator={!1}nestedScrollEnabled={!0}keyboardShouldPersistTaps="handled"ListEmptyComponent={<Ee isSearch={!!(r||T!=="all")}searchQuery={r}customTitle={r||T!=="all"?x("push.noMatching","No matching push notifications"):x("push.noNotifications","No push notifications captured yet")}customSub={r||T!=="all"?x("push.adjustSearchFilter","Try adjusting your search query or filter chips."):x("push.noNotificationsDesc","Incoming or opened push payloads from any domain (Salesforce, FCM, APNs, etc.) will appear here automatically.")}onClearSearch={()=>{R(""),M("all")}}showReload={!1}/>}ListFooterComponent={P.length>0?<Fe count={V.length}totalCount={P.length}label="push notifications"loadMoreStep={J}hasMore={V.length<P.length}onLoadMore={()=>$(e=>e+J)}/>:null}/>
     </C>}),k=we.create({carouselWrapper:{paddingVertical:6,borderBottomWidth:1,borderBottomColor:t.dividerColor,backgroundColor:t.white},carouselContent:{paddingHorizontal:8,gap:6,flexDirection:"row",alignItems:"center"},filterPill:{flexDirection:"row",alignItems:"center",gap:5,paddingHorizontal:9,paddingVertical:4.5,borderRadius:20,backgroundColor:t.grayBackground,borderWidth:1,borderColor:t.dividerColor},filterPillText:{fontSize:11,fontFamily:G.interMedium,color:t.primaryBlack},countBadge:{paddingHorizontal:5,paddingVertical:1,borderRadius:10},countBadgeText:{fontSize:9.5,fontFamily:G.interBold},listContent:{padding:8,paddingBottom:24}});X.displayName="PushTab";export default X;

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

@@ -1,13 +1,15 @@
-import ee,{useCallback as Le,useMemo as N,useRef as Pe,useState as te}from"react";import{FlatList as De,Platform as Fe,Pressable as Ce,StyleSheet as Ee,Text as S,TextInput as We,TouchableOpacity as Oe,View as C}from"react-native";import{useTranslation as Me}from"../../i18n";import{useInspector as je}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 Ie,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 It,ScreenIcon as At,ListenerIcon as Rt,DocIcon as Vt,LoadingSpinnerIcon as Bt,CircleAlertIcon as Ht,TextAaIcon as Lt}from"../NetworkIcons";const Ae=L=>{switch(L){case"saga":return{label:"SAGA",renderIcon:(A,z=9)=><U color={A}size={z}/>,bg:e.purple100,text:e.brandPurple,border:e.purple200};case"thunk":return{label:"THUNK",renderIcon:(A,z=9)=><It color={A}size={z}/>,bg:e.amber100,text:e.amber800Warm,border:e.amber200};case"ui":return{label:"UI",renderIcon:(A,z=9)=><At color={A}size={z}/>,bg:e.sky100,text:e.sky600,border:e.sky400};case"listener":return{label:"LISTENER",renderIcon:(A,z=9)=><Rt color={A}size={z}/>,bg:e.teal100,text:e.teal700,border:e.teal400};default:return{label:"DIRECT",renderIcon:(A,z=9)=><U color={A}size={z}/>,bg:e.slate100,text:e.slate700,border:e.slate200}}},Re=50,ze=10,Pt=ee.memo(()=>{const{t:L}=Me(),{reduxState:A,reduxLastActionMap:z,reduxSearch:k,setReduxSearch:G,setSelectedReduxSlice:Z}=je(),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(A),[A]),Q=N(()=>Ke(),[z]),$=N(()=>!A||typeof A!="object"?[]:Object.keys(A).map(I=>{const T=A[I],B=Array.isArray(T),j=T&&typeof T=="object";let F="Primitive",H=0;B?(H=T.length,F=`Array [${H}]`):j?(H=Object.keys(T).length,F=`Object {${H}}`):typeof T<"u"&&(H=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"):H===0&&(E="empty",v="Empty"));const V=z[I],Be=V?.updatedAt||0,He=Q.filter(W=>!W.affectedSlices||W.affectedSlices.length===0?!0:W.affectedSlices.includes(I)).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-${I}`,name:I,keysCount:H,sizeStr:Se(T),typeLabel:F,status:E,statusMessage:v,timelineCount:He,lastAction:X,updatedAt:Be}}),[A,z,Q]),D=N(()=>{let t=$;if(k&&k.trim().length>0){const I=k.trim().toLowerCase().split(/\s+/).filter(Boolean);t=t.filter(T=>{const B=A?A[T.name]:null,j=[T.name||"",T.lastAction?.type||"",T.lastAction?.payloadPreview||"",T.lastAction?.originType||"",T.status||"",T.statusMessage||"",B?typeof B=="string"?B:JSON.stringify(B):""].join(" ").toLowerCase();return I.every(F=>j.includes(F))})}return[...t].sort((I,T)=>P==="latest"&&T.updatedAt!==I.updatedAt?T.updatedAt-I.updatedAt:I.name.localeCompare(T.name))},[$,k,P,A]),_=N(()=>D.slice(0,q),[D,q]),M=N(()=>{const t=Object.values(z);return t.length===0?null:t.reduce((I,T)=>I?(T.updatedAt||0)>(I.updatedAt||0)?T:I:T,null)},[z]),ve=Le(({item:t,index:I})=>{const T=t.updatedAt>0&&Date.now()-t.updatedAt<5e3,B=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,H=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={I}distance={8}>
+import ee,{useCallback as Le,useMemo as N,useRef as Pe,useState as te}from"react";import{FlatList as De,Platform as Fe,Pressable as Ce,StyleSheet as Ee,Text as S,TextInput as We,TouchableOpacity as Oe,View as C}from"react-native";import{useTranslation as Me}from"../../i18n";import{useInspector as je}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 Ie,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 It,ScreenIcon as At,ListenerIcon as Rt,DocIcon as Vt,LoadingSpinnerIcon as Bt,CircleAlertIcon as Ht,TextAaIcon as Lt}from"../NetworkIcons";const Ae=B=>{switch(B){case"saga":return{label:"SAGA",renderIcon:(A,z=9)=><U color={A}size={z}/>,bg:e.purple100,text:e.brandPurple,border:e.purple200};case"thunk":return{label:"THUNK",renderIcon:(A,z=9)=><It color={A}size={z}/>,bg:e.amber100,text:e.amber800Warm,border:e.amber200};case"ui":return{label:"UI",renderIcon:(A,z=9)=><At color={A}size={z}/>,bg:e.sky100,text:e.sky600,border:e.sky400};case"listener":return{label:"LISTENER",renderIcon:(A,z=9)=><Rt color={A}size={z}/>,bg:e.teal100,text:e.teal700,border:e.teal400};default:return{label:"DIRECT",renderIcon:(A,z=9)=><U color={A}size={z}/>,bg:e.slate100,text:e.slate700,border:e.slate200}}},Re=50,ze=10,Pt=ee.memo(()=>{const{t:B}=Me(),{reduxState:A,reduxLastActionMap:z,reduxSearch:k,setReduxSearch:G,setSelectedReduxSlice:Z}=je(),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(A),[A]),Q=N(()=>Ke(),[z]),$=N(()=>!A||typeof A!="object"?[]:Object.keys(A).map(I=>{const T=A[I],H=Array.isArray(T),j=T&&typeof T=="object";let D="Primitive",L=0;H?(L=T.length,D=`Array [${L}]`):j?(L=Object.keys(T).length,D=`Object {${L}}`):typeof T<"u"&&(L=1,D=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[I],Be=V?.updatedAt||0,He=Q.filter(W=>!W.affectedSlices||W.affectedSlices.length===0?!0:W.affectedSlices.includes(I)).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-${I}`,name:I,keysCount:L,sizeStr:Se(T),typeLabel:D,status:E,statusMessage:v,timelineCount:He,lastAction:X,updatedAt:Be}}),[A,z,Q]),F=N(()=>{let t=$;if(k&&k.trim().length>0){const I=k.trim().toLowerCase().split(/\s+/).filter(Boolean);t=t.filter(T=>{const H=A?A[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 I.every(D=>j.includes(D))})}return[...t].sort((I,T)=>P==="latest"&&T.updatedAt!==I.updatedAt?T.updatedAt-I.updatedAt:I.name.localeCompare(T.name))},[$,k,P,A]),_=N(()=>F.slice(0,q),[F,q]),M=N(()=>{const t=Object.values(z);return t.length===0?null:t.reduce((I,T)=>I?(T.updatedAt||0)>(I.updatedAt||0)?T:I:T,null)},[z]),ve=Le(({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,j=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,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={I}distance={8}>
           <C style={o.cardContainer}>
-            <Ne onPress={()=>{Z(t.name)}}style={[o.card,{borderLeftWidth:3.5,borderLeftColor:B,backgroundColor:t.status==="error"?e.errorCardBg:e.white},T&&o.cardRecentlyUpdated]}>
+            <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>
                     <C style={[o.methodBadge,{backgroundColor:e.violet600}]}>
-                      <S style={o.methodBadgeText}>REDUX</S>
+                      <S style={o.methodBadgeText}>
+                        {B("redux.title","REDUX").toUpperCase()}
+                      </S>
                     </C>
                     <C style={[o.chip,{backgroundColor:`${e.violet600}14`,borderColor:`${e.violet600}2E`}]}>
                       <S style={[o.chipText,{color:e.violet600}]}>
@@ -24,9 +26,9 @@ import ee,{useCallback as Le,useMemo as N,useRef as Pe,useState as te}from"react
                   </C>
 
                   <C style={o.cardHeaderRight}>
-                    <C style={[o.statusPill,{backgroundColor:j,borderColor:F}]}>
+                    <C style={[o.statusPill,{backgroundColor:j,borderColor:D}]}>
                       {t.status==="loading"?<Bt 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:H}]}>
+                      <S style={[o.statusPillText,{color:L}]}>
                         {t.status==="loading"?"Loading":t.status==="error"?t.statusMessage||"Error":t.status==="empty"?"Empty":"Live"}
                       </S>
                     </C>
@@ -87,7 +89,7 @@ import ee,{useCallback as Le,useMemo as N,useRef as Pe,useState as te}from"react
 
               
               <C style={o.waterfallContainer}>
-                <C style={[o.waterfallBar,{backgroundColor:B,width:T?"100%":"35%"}]}/>
+                <C style={[o.waterfallBar,{backgroundColor:H,width:T?"100%":"35%"}]}/>
               </C>
             </Ne>
           </C>
@@ -95,18 +97,18 @@ import ee,{useCallback as Le,useMemo as N,useRef as Pe,useState as te}from"react
       
       <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>
+            <S style={o.statHeading}>{B("redux.lastActionHeader","LAST ACTION")}</S>
             {M?.originType&&(()=>{const t=Ae(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:R.interBold,fontSize:7.5,color:t.text}}>
@@ -128,11 +130,11 @@ import ee,{useCallback as Le,useMemo as N,useRef as Pe,useState as te}from"react
         <C style={o.searchRow}>
           <C style={O.searchContainer}>
             <Je color={e.grayTextWeak}size={15}/>
-            <We 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={O.searchInput}autoCorrect={!1}autoCapitalize="none"/>
+            <We 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:R.interBold}}>
-                    {D.length}
+                    {F.length}
                   </S>
                 </C>
                 <Ce accessible={!0}accessibilityRole="button"accessibilityLabel="Clear search input"onPress={()=>G("")}hitSlop={10}>
@@ -149,7 +151,7 @@ import ee,{useCallback as Le,useMemo as N,useRef as Pe,useState as te}from"react
 
         <C style={o.headerSubRow}>
           <S style={o.resultCount}>
-            Showing {D.length} of {$.length} state slices
+            Showing {F.length} of {$.length} state slices
           </S>
           <C style={{flexDirection:"row",alignItems:"center",gap:4}}>
             {P==="latest"?<U color={e.brandPurple}size={11}/>:<Lt color={e.brandPurple}size={11}/>}
@@ -161,13 +163,13 @@ import ee,{useCallback as Le,useMemo as N,useRef as Pe,useState as te}from"react
       </C>
 
       
-      <De ref={K}data={_}keyExtractor={t=>t.id}renderItem={ve}getItemLayout={(t,I)=>({length:126,offset:126*I,index:I})}initialNumToRender={10}maxToRenderPerBatch={8}windowSize={5}updateCellsBatchingPeriod={40}removeClippedSubviews={!0}renderToHardwareTextureAndroid={!0}showsVerticalScrollIndicator={!1}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"/>
+      <De ref={K}data={_}keyExtractor={t=>t.id}renderItem={ve}getItemLayout={(t,I)=>({length:126,offset:126*I,index:I})}initialNumToRender={10}maxToRenderPerBatch={8}windowSize={5}updateCellsBatchingPeriod={40}removeClippedSubviews={!0}renderToHardwareTextureAndroid={!0}showsVerticalScrollIndicator={!1}nestedScrollEnabled={!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={F.length>0?<Ge count={_.length}totalCount={F.length}label="slices"loadMoreStep={ze}hasMore={_.length<F.length}onLoadMore={()=>J(t=>t+ze)}/>:null}style={{flex:1}}contentContainerStyle={[o.listContent,{flexGrow:1}]}keyboardShouldPersistTaps="handled"/>
     </C>:<C style={O.emptyContainer}>
         <C style={O.emptyIconWrap}>
           <Ie color={e.purple}size={32}/>
         </C>
-        <S style={O.emptyTitle}>{L("redux.noStoreConnected","No Redux Store Connected")}</S>
+        <S style={O.emptyTitle}>{B("redux.noStoreConnected","No Redux Store Connected")}</S>
         <S style={O.emptySub}>
-          {L("redux.connectStoreTip","Call connectReduxStore(store) or use inspectorReduxMiddleware at app initialization.")}
+          {B("redux.connectStoreTip","Call connectReduxStore(store) or use inspectorReduxMiddleware at app initialization.")}
         </S>
-      </C>}),o=Ee.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:Fe.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;
+      </C>}),o=Ee.create({overviewCard:{flexDirection:"row",alignItems:"center",backgroundColor:e.white,marginHorizontal:8,marginTop:8,borderRadius:12,padding:10,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:6},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:8,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:5,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:8,paddingTop:8,paddingBottom:6,flex:1,justifyContent:"space-between"},cardHeaderRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",height:22,minHeight:22,maxHeight:22,gap:4.5},cardHeaderLeft:{flexDirection:"row",alignItems:"center",gap:4.5,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:Fe.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/SecondaryTelemetryStrip.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SecondaryTelemetryStrip: React.FC;