react-native-inapp-inspector 2.5.7 → 2.5.8

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

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

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

@@ -1,31 +1,31 @@
-import ce,{useRef as F,useState as U}from"react";import{Platform as de,ScrollView as Ce,Text as P,TouchableOpacity as _,View as C}from"react-native";import{useInspector as ke}from"./InspectorContext";import{useTranslation as we}from"../../i18n";import I from"../../styles";import{AppColors as o}from"../../styles/AppColors";import{AppFonts as T}from"../../styles/AppFonts";import G from"../TouchableScale";import{SignalIcon as Se,TerminalIcon as Re,AnalyticsIcon as Ie,ReduxIcon as Te,CrashIcon as Be,BellIcon as Pe,SmartphoneIcon as Le,DatabaseIcon as Ae,QrCodeIcon as Oe,ScreencastIcon as Ve,ChevronIcon as Q,WebsocketIcon as De}from"../NetworkIcons";import{isReduxConnected as Ee}from"../../customHooks/reduxLogger";import{isAnalyticsConnected as He}from"../../customHooks/analyticsLogger";import{isLocalDebugEnvironment as We}from"../../helpers";const r={themeColor:o.brandPurple,bgInactive:`${o.brandPurple}0D`,borderInactive:`${o.brandPurple}2B`,iconInactive:o.brandPurple,idBadgeBg:`${o.brandPurple}1C`,idBadgeBorder:`${o.brandPurple}3D`,idBadgeText:o.brandPurple},q={apis:r,logs:r,analytics:r,redux:r,storage:r,device:r,crash:r,push:r,socket:r,debugging:r,media:r},je=ce.memo(()=>{const{t:J}=we(),{activeTab:k,switchActiveTab:L,tabVisibility:B,logs:A,consoleLogs:O,analyticsEvents:K,crashRecords:V,pushRecords:D,socketRecords:E,unreadPushCount:N,unreadSocketCount:X,lastReadApisCount:Y,lastReadLogsCount:Z,lastReadCrashesCount:ee,lastReadSocketCount:oe,mediaCount:H}=ke(),te=Ee(),ie=He(),w=k==="media",x=(B?.media??!0)&&H>0,W=F(null),[z,ne]=U(!1),[j,re]=U(!0),$=F(0),le=e=>{const{contentOffset:t,layoutMeasurement:i,contentSize:n}=e.nativeEvent,S=t.x;$.current=S;const R=S>8,v=S<n.width-i.width-8;z!==R&&ne(R),j!==v&&re(v)},M=e=>{W.current?.scrollTo({x:Math.max(0,$.current+e),animated:!0})};return<C style={[I.tabBarContainer,{flexDirection:"row",alignItems:"center",paddingHorizontal:0}]}>
+import ce,{useRef as _,useState as F}from"react";import{Platform as de,ScrollView as Ce,Text as P,TouchableOpacity as U,View as C}from"react-native";import{useInspector as ke}from"./InspectorContext";import{useTranslation as we}from"../../i18n";import v from"../../styles";import{AppColors as o}from"../../styles/AppColors";import{AppFonts as T}from"../../styles/AppFonts";import G from"../TouchableScale";import{SignalIcon as Se,TerminalIcon as Ie,AnalyticsIcon as Re,ReduxIcon as Te,CrashIcon as Be,BellIcon as Pe,SmartphoneIcon as Le,DatabaseIcon as Ae,QrCodeIcon as Ve,ScreencastIcon as Oe,ChevronIcon as Q,WebsocketIcon as De}from"../NetworkIcons";import{isReduxConnected as Ee}from"../../customHooks/reduxLogger";import{isAnalyticsConnected as He}from"../../customHooks/analyticsLogger";import{isLocalDebugEnvironment as We}from"../../helpers";const n={themeColor:o.brandPurple,bgInactive:`${o.brandPurple}0D`,borderInactive:`${o.brandPurple}2B`,iconInactive:o.brandPurple,idBadgeBg:`${o.brandPurple}1C`,idBadgeBorder:`${o.brandPurple}3D`,idBadgeText:o.brandPurple},q={apis:n,logs:n,analytics:n,redux:n,storage:n,device:n,crash:n,push:n,socket:n,debugging:n,media:n},$e=ce.memo(()=>{const{t:J}=we(),{activeTab:w,switchActiveTab:L,tabVisibility:B,logs:A,consoleLogs:V,analyticsEvents:K,crashRecords:O,pushRecords:D,socketRecords:E,unreadPushCount:N,unreadSocketCount:X,lastReadApisCount:Y,lastReadLogsCount:Z,lastReadCrashesCount:ee,lastReadSocketCount:oe,mediaCount:H}=ke(),te=Ee(),ie=He(),k=w==="media",x=(B?.media??!0)&&(H>0||k||__DEV__),W=_(null),[z,re]=F(!1),[$,ne]=F(!0),j=_(0),le=e=>{const{contentOffset:t,layoutMeasurement:i,contentSize:r}=e.nativeEvent,S=t.x;j.current=S;const I=S>8,R=S<r.width-i.width-8;z!==I&&re(I),$!==R&&ne(R)},M=e=>{W.current?.scrollTo({x:Math.max(0,j.current+e),animated:!0})};return<C style={[v.tabBarContainer,{flexDirection:"row",alignItems:"center",paddingHorizontal:0}]}>
       
-      {z&&<_ onPress={()=>M(-160)}hitSlop={{top:6,bottom:6,left:6,right:6}}activeOpacity={.7}style={{paddingLeft:6,paddingRight:2,justifyContent:"center",alignItems:"center"}}>
+      {z&&<U onPress={()=>M(-160)}hitSlop={{top:6,bottom:6,left:6,right:6}}activeOpacity={.7}style={{paddingLeft:6,paddingRight:2,justifyContent:"center",alignItems:"center"}}>
           <C style={{width:22,height:22,borderRadius:11,backgroundColor:o.grayBorderSecondary,alignItems:"center",justifyContent:"center"}}>
             <Q direction="left"size={13}color={o.grayTextStrong}/>
           </C>
-        </_>}
+        </U>}
 
       
-      <Ce ref={W}horizontal showsHorizontalScrollIndicator={!1}onScroll={le}scrollEventThrottle={16}style={{flex:1}}contentContainerStyle={{paddingLeft:z?4:12,paddingRight:x?6:12}}>
-        {[{id:1,key:"apis",label:"APIs",count:A.length,icon:"apis"},{id:2,key:"logs",label:"Logs",count:O.length,icon:"logs"},{id:3,key:"analytics",label:"Analytics",count:K.length,icon:"analytics"},{id:4,key:"redux",label:"Redux",count:0,icon:"redux"},{id:5,key:"storage",label:"Storage",count:0,icon:"storage"},{id:6,key:"device",label:"Device",count:0,icon:"device"},{id:7,key:"crash",label:"Crash",count:V?.length||0,icon:"crash"},{id:8,key:"push",label:"Push",count:D?.length||0,icon:"push"},{id:9,key:"socket",label:"WebSocket",count:E?.length||0,icon:"socket"},{id:10,key:"debugging",label:"Debugging",count:0,icon:"debugging"}].filter(e=>e.key==="debugging"?de.OS==="android"&&We()&&!!B?.debugging:!(!B?.[e.key]||e.key==="redux"&&!te||e.key==="analytics"&&!ie)).map(e=>{const t=k===e.key,i=q[e.key]||q.apis,n=t?o.white:i.iconInactive,S=e.count>99?"99+":String(e.count),R=k!=="apis"&&A.length>Y,v=k!=="logs"&&O.length>Z,ae=k!=="crash"&&(V?.length||0)>(ee||0),se=k!=="socket"&&((E?.length||0)>(oe||0)||X>0);return<G key={e.key}onPress={()=>{L(e.key)}}style={[I.contentTabButton,{backgroundColor:t?i.themeColor:i.bgInactive,borderColor:t?i.themeColor:i.borderInactive},t&&{shadowColor:i.themeColor,shadowOffset:{width:0,height:2},shadowOpacity:.28,shadowRadius:3.5,elevation:3}]}>
+      <Ce testID="inspector.tab.scrollview"ref={W}horizontal showsHorizontalScrollIndicator={!1}onScroll={le}scrollEventThrottle={16}style={{flex:1}}contentContainerStyle={{paddingLeft:z?4:12,paddingRight:x?6:12}}>
+        {[{id:1,key:"apis",label:"APIs",count:A.length,icon:"apis"},{id:2,key:"logs",label:"Logs",count:V.length,icon:"logs"},{id:3,key:"analytics",label:"Analytics",count:K.length,icon:"analytics"},{id:4,key:"redux",label:"Redux",count:0,icon:"redux"},{id:5,key:"storage",label:"Storage",count:0,icon:"storage"},{id:6,key:"device",label:"Device",count:0,icon:"device"},{id:7,key:"crash",label:"Crash",count:O?.length||0,icon:"crash"},{id:8,key:"push",label:"Push",count:D?.length||0,icon:"push"},{id:9,key:"socket",label:"WebSocket",count:E?.length||0,icon:"socket"},{id:10,key:"debugging",label:"Debugging",count:0,icon:"debugging"}].filter(e=>e.key==="debugging"?de.OS==="android"&&We()&&!!B?.debugging:!(!B?.[e.key]||e.key==="redux"&&!te||e.key==="analytics"&&!ie)).map(e=>{const t=w===e.key,i=q[e.key]||q.apis,r=t?o.white:i.iconInactive,S=e.count>99?"99+":String(e.count),I=w!=="apis"&&A.length>Y,R=w!=="logs"&&V.length>Z,se=w!=="crash"&&(O?.length||0)>(ee||0),ae=w!=="socket"&&((E?.length||0)>(oe||0)||X>0);return<G key={e.key}testID={`inspector.tab.${e.key}`}onPress={()=>{L(e.key)}}style={[v.contentTabButton,{backgroundColor:t?i.themeColor:i.bgInactive,borderColor:t?i.themeColor:i.borderInactive},t&&{shadowColor:i.themeColor,shadowOffset:{width:0,height:2},shadowOpacity:.28,shadowRadius:3.5,elevation:3}]}>
                 <C style={{flexDirection:"row",alignItems:"center",gap:6}}>
-                  {e.icon==="apis"&&<Se color={n}size={14}/>}
-                  {e.icon==="logs"&&<Re color={n}size={14}/>}
-                  {e.icon==="analytics"&&<Ie color={n}size={14}/>}
-                  {e.icon==="redux"&&<Te color={n}size={14}/>}
-                  {e.icon==="storage"&&<Ae color={n}size={14}/>}
-                  {e.icon==="device"&&<Le color={n}size={14}/>}
-                  {e.icon==="crash"&&<Be color={n}size={14}/>}
-                  {e.icon==="push"&&<Pe color={n}size={14}/>}
-                  {e.icon==="socket"&&<De color={n}size={14}/>}
-                  {e.icon==="debugging"&&<Oe color={n}size={14}/>}
+                  {e.icon==="apis"&&<Se color={r}size={14}/>}
+                  {e.icon==="logs"&&<Ie color={r}size={14}/>}
+                  {e.icon==="analytics"&&<Re color={r}size={14}/>}
+                  {e.icon==="redux"&&<Te color={r}size={14}/>}
+                  {e.icon==="storage"&&<Ae color={r}size={14}/>}
+                  {e.icon==="device"&&<Le color={r}size={14}/>}
+                  {e.icon==="crash"&&<Be color={r}size={14}/>}
+                  {e.icon==="push"&&<Pe color={r}size={14}/>}
+                  {e.icon==="socket"&&<De color={r}size={14}/>}
+                  {e.icon==="debugging"&&<Ve color={r}size={14}/>}
                   <C style={{minWidth:20,height:20,paddingHorizontal:4,borderRadius:10,backgroundColor:t?`${o.white}33`:i.idBadgeBg,borderWidth:1,borderColor:t?`${o.white}66`:i.idBadgeBorder,alignItems:"center",justifyContent:"center"}}>
                     <P style={{fontFamily:T.interBold,fontSize:9.5,lineHeight:12,color:t?o.white:i.idBadgeText}}>
                       #{e.id}
                     </P>
                   </C>
-                  <P numberOfLines={1}ellipsizeMode="tail"style={[I.contentTabButtonText,{color:t?o.white:o.grayTextStrong,fontFamily:t?T.interBold:T.interSemiBold}]}>
+                  <P numberOfLines={1}ellipsizeMode="tail"style={[v.contentTabButtonText,{color:t?o.white:o.grayTextStrong,fontFamily:t?T.interBold:T.interSemiBold}]}>
                     {J(`tabs.${e.key}`,e.label)}
                   </P>
                   {e.count>0&&e.key!=="push"&&<C style={{paddingHorizontal:5,paddingVertical:1,borderRadius:8,backgroundColor:t?o.overlayWhite25:i.idBadgeBg,borderWidth:.5,borderColor:t?o.overlayWhite45:i.idBadgeBorder,marginLeft:1,alignItems:"center",justifyContent:"center"}}>
@@ -33,25 +33,25 @@ import ce,{useRef as F,useState as U}from"react";import{Platform as de,ScrollVie
                         {S}
                       </P>
                     </C>}
-                  {(e.key==="apis"&&R||e.key==="logs"&&v||e.key==="crash"&&ae||e.key==="push"&&((D?.length||0)>0||N>0)||e.key==="socket"&&se)&&<C style={{width:6,height:6,borderRadius:3,backgroundColor:o.errorColor,marginLeft:4,alignSelf:"center"}}/>}
+                  {(e.key==="apis"&&I||e.key==="logs"&&R||e.key==="crash"&&se||e.key==="push"&&((D?.length||0)>0||N>0)||e.key==="socket"&&ae)&&<C style={{width:6,height:6,borderRadius:3,backgroundColor:o.errorColor,marginLeft:4,alignSelf:"center"}}/>}
                 </C>
               </G>})}
       </Ce>
 
       
-      {j&&<_ onPress={()=>M(160)}hitSlop={{top:6,bottom:6,left:6,right:6}}activeOpacity={.7}style={{paddingLeft:2,paddingRight:x?4:8,justifyContent:"center",alignItems:"center"}}>
+      {$&&<U onPress={()=>M(160)}hitSlop={{top:6,bottom:6,left:6,right:6}}activeOpacity={.7}style={{paddingLeft:2,paddingRight:x?4:8,justifyContent:"center",alignItems:"center"}}>
           <C style={{width:22,height:22,borderRadius:11,backgroundColor:o.grayBorderSecondary,alignItems:"center",justifyContent:"center"}}>
             <Q direction="right"size={13}color={o.grayTextStrong}/>
           </C>
-        </_>}
+        </U>}
 
       
       {x&&<C style={{paddingLeft:6,paddingRight:10,borderLeftWidth:1,borderLeftColor:o.dividerColor,backgroundColor:o.primaryLight,justifyContent:"center",shadowColor:o.shadowColorString,shadowOffset:{width:-3,height:0},shadowOpacity:.12,shadowRadius:4,elevation:4,zIndex:10}}>
-          <G key="media"onPress={()=>{L("media")}}accessibilityRole="button"accessibilityLabel="Media Gallery"style={[I.contentTabButton,{marginRight:0,borderRadius:8,backgroundColor:w?o.brandPurple:`${o.brandPurple}0D`,borderColor:w?o.brandPurple:`${o.brandPurple}2B`,borderWidth:1,paddingHorizontal:10,paddingVertical:7,alignItems:"center",justifyContent:"center"},w&&{shadowColor:o.brandPurple,shadowOffset:{width:0,height:2},shadowOpacity:.28,shadowRadius:3.5,elevation:3}]}>
+          <G key="media"testID="inspector.tab.media"onPress={()=>{L("media")}}accessibilityRole="button"accessibilityLabel="Media Gallery"style={[v.contentTabButton,{marginRight:0,borderRadius:8,backgroundColor:k?o.brandPurple:`${o.brandPurple}0D`,borderColor:k?o.brandPurple:`${o.brandPurple}2B`,borderWidth:1,paddingHorizontal:10,paddingVertical:7,alignItems:"center",justifyContent:"center"},k&&{shadowColor:o.brandPurple,shadowOffset:{width:0,height:2},shadowOpacity:.28,shadowRadius:3.5,elevation:3}]}>
             <C style={{position:"relative",alignItems:"center",justifyContent:"center"}}>
-              <Ve color={w?o.white:o.brandPurple}size={15}/>
-              {H>0&&<C style={{position:"absolute",top:-3,right:-4,width:7,height:7,borderRadius:3.5,backgroundColor:w?o.white:o.brandPurple,borderWidth:1.2,borderColor:w?o.brandPurple:o.white}}/>}
+              <Oe color={k?o.white:o.brandPurple}size={15}/>
+              {H>0&&<C style={{position:"absolute",top:-3,right:-4,width:7,height:7,borderRadius:3.5,backgroundColor:k?o.white:o.brandPurple,borderWidth:1.2,borderColor:k?o.brandPurple:o.white}}/>}
             </C>
           </G>
         </C>}
-    </C>});export default je;
+    </C>});export default $e;

package/dist/esm/components/LogCard.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import { LogCardProps } from '../types';
-declare function LogCard({ item, onPress, timelineMinStart, timelineTotalRange, isNew, isSelected, onToggleSelect, searchStr, }: LogCardProps): React.JSX.Element;
+declare function LogCard({ item, onPress, timelineMinStart, timelineTotalRange, isNew, isSelected, onToggleSelect, searchStr, testID, }: LogCardProps): React.JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof LogCard>;
 export default _default;

package/dist/esm/components/LogCard.js

@@ -1,20 +1,20 @@
-import re,{useEffect as te,useRef as oe,useMemo as ne}from"react";import{Alert as le,Animated as W,Linking as F,View as C,Pressable as A,Text as T,StyleSheet as E}from"react-native";import Ce,{Path as Te}from"react-native-svg";import{AppColors as e}from"../styles/AppColors";import{METHOD_COLORS as U}from"../constants";import{getStatusColor as Se,getDurationColor as Be,formatDateTime as Re,getSize as He,getPath as Ve,getBaseUrl as ze}from"../helpers";import{CalendarIcon as Ie,ClockIcon as N,SizeIcon as Le,CircleCheckIcon as $e,CircleAlertIcon as De,CircleXIcon as Oe,RepeatIcon as We,ForwardChevronIcon as Fe,GlobeIcon as Pe}from"./NetworkIcons";import{AppFonts as S}from"../styles/AppFonts";import G from"./HighlightText";import Me from"./TouchableScale";import{useTranslation as ve}from"../i18n";function Ae({item:r,onPress:B,timelineMinStart:Ue,timelineTotalRange:qe,isNew:$,isSelected:P,onToggleSelect:J,searchStr:j}){const{t:z}=ve(),M=U[r.method]??U.ALL,H=ne(()=>{try{const o=new URL(r.url),L=o.host,v=o.pathname+(o.search?o.search:""),ee=o.protocol==="https:";return{host:L,path:v||"/",isHttps:ee}}catch{const o=r.url.toLowerCase().startsWith("https:"),L=Ve(r.url);return{host:ze(r.url).replace(/^https?:\/\//,""),path:L||r.url,isHttps:o}}},[r.url]),K=o=>{o?.stopPropagation?.(),le.alert(z("common.openInBrowser")||"Open in Browser",`${z("common.openInBrowserPrompt")||"Are you sure you want to open this URL in your external browser?"}
+import te,{useEffect as oe,useRef as ne,useMemo as le}from"react";import{Alert as v,Animated as W,Linking as ie,View as C,Pressable as E,Text as T,StyleSheet as A}from"react-native";import Ce,{Path as Te}from"react-native-svg";import{AppColors as e}from"../styles/AppColors";import{METHOD_COLORS as U}from"../constants";import{getStatusColor as Se,getDurationColor as Be,formatDateTime as Re,getSize as He,getPath as Ve,getBaseUrl as ze}from"../helpers";import{CalendarIcon as Ie,ClockIcon as N,SizeIcon as Le,CircleCheckIcon as $e,CircleAlertIcon as De,CircleXIcon as Oe,RepeatIcon as We,ForwardChevronIcon as Fe,GlobeIcon as Pe}from"./NetworkIcons";import{AppFonts as S}from"../styles/AppFonts";import G from"./HighlightText";import Me from"./TouchableScale";import{useTranslation as ve}from"../i18n";function Ee({item:r,onPress:B,timelineMinStart:Ue,timelineTotalRange:qe,isNew:L,isSelected:F,onToggleSelect:J,searchStr:P,testID:K}){const{t:R}=ve(),j=U[r.method]??U.ALL,V=le(()=>{try{const o=new URL(r.url),O=o.host,M=o.pathname+(o.search?o.search:""),re=o.protocol==="https:";return{host:O,path:M||"/",isHttps:re}}catch{const o=r.url.toLowerCase().startsWith("https:"),O=Ve(r.url);return{host:ze(r.url).replace(/^https?:\/\//,""),path:O||r.url,isHttps:o}}},[r.url]),Q=o=>{o?.stopPropagation?.(),v.alert(R("common.openInBrowser")||"Open in Browser",`${R("common.openInBrowserPrompt")||"Are you sure you want to open this URL in your external browser?"}
 
-${r.url}`,[{text:z("common.cancel")||"Cancel",style:"cancel"},{text:z("common.open")||"Open",onPress:()=>{F.canOpenURL(r.url).then(L=>{L?F.openURL(r.url):F.openURL(r.url).catch(()=>{})}).catch(()=>{})}}])},R=r.status===0||r.status!=null&&r.status>=400,V=r.status==null,D=Se(r.status),I=Be(r.duration),Q=V?e.darkOrange:R?e.errorColor:e.greenColor,O=oe(new W.Value($?.35:0)).current;te(()=>{$&&W.timing(O,{toValue:0,duration:1200,useNativeDriver:!0}).start()},[$,O]);const X=()=>{if(V)return"...";if(r.status===0||r.status==null)return z("network.statusFailed")||"FAILED";const o=typeof r.status=="number"?r.status:parseInt(String(r.status||0),10);return o===200?"200 OK":o===201?"201 Created":o===204?"204 No Content":o===304?"304 Not Modified":o===400?"400 Bad Req":o===401?"401 Unauth":o===403?"403 Forbidden":o===404?"404 Not Found":o===500?"500 Error":String(r.status)},_=()=>{if(V)return<N color={e.darkOrange}size={10}/>;const o=typeof r.status=="number"?r.status:parseInt(String(r.status||0),10);return o>=200&&o<300?<$e color={e.greenColor}size={10}/>:o>=300&&o<400?<We color={e.amber700}size={10}/>:o>=400&&o<500?<De color={e.darkOrange}size={10}/>:<Oe color={e.errorColor}size={10}/>},Y=Re(r.startTime),Z=r.url.split("?")[0].toLowerCase().endsWith(".json");return<C style={t.container}>
-      <Me onPress={B}style={[t.card,{borderLeftWidth:3.5,borderLeftColor:Q,backgroundColor:R?e.errorCardBg:e.white}]}>
+${r.url}`,[{text:R("common.cancel")||"Cancel",style:"cancel"},{text:R("common.open")||"Open",onPress:()=>{ie.openURL(r.url).catch(()=>{v.alert(R("common.error")||"Error",R("common.cannotOpenUrl")||"Could not open URL")})}}])},H=r.status===0||r.status!=null&&r.status>=400,z=r.status==null,$=Se(r.status),I=Be(r.duration),X=z?e.darkOrange:H?e.errorColor:e.greenColor,D=ne(new W.Value(L?.35:0)).current;oe(()=>{L&&W.timing(D,{toValue:0,duration:1200,useNativeDriver:!0}).start()},[L,D]);const _=()=>{if(z)return"...";if(r.status===0||r.status==null)return R("network.statusFailed")||"FAILED";const o=typeof r.status=="number"?r.status:parseInt(String(r.status||0),10);return o===200?"200 OK":o===201?"201 Created":o===204?"204 No Content":o===304?"304 Not Modified":o===400?"400 Bad Req":o===401?"401 Unauth":o===403?"403 Forbidden":o===404?"404 Not Found":o===500?"500 Error":String(r.status)},Y=()=>{if(z)return<N color={e.darkOrange}size={10}/>;const o=typeof r.status=="number"?r.status:parseInt(String(r.status||0),10);return o>=200&&o<300?<$e color={e.greenColor}size={10}/>:o>=300&&o<400?<We color={e.amber700}size={10}/>:o>=400&&o<500?<De color={e.darkOrange}size={10}/>:<Oe color={e.errorColor}size={10}/>},Z=Re(r.startTime),ee=r.url.split("?")[0].toLowerCase().endsWith(".json");return<C style={t.container}>
+      <Me testID={K}onPress={B}style={[t.card,{borderLeftWidth:3.5,borderLeftColor:X,backgroundColor:H?e.errorCardBg:e.white}]}>
         <C style={t.cardBody}>
           
           <C style={t.cardHeaderRow}>
             <C style={t.cardHeaderLeft}>
-              <A onPress={()=>J(r.id)}hitSlop={12}style={[t.smallCheckbox,P&&t.smallCheckboxChecked]}>
-                {P&&<Ce width={9}height={9}viewBox="0 0 24 24"fill="none">
+              <E onPress={()=>J(r.id)}hitSlop={12}style={[t.smallCheckbox,F&&t.smallCheckboxChecked]}>
+                {F&&<Ce width={9}height={9}viewBox="0 0 24 24"fill="none">
                     <Te d="M20 6L9 17l-5-5"stroke={e.white}strokeWidth="4"strokeLinecap="round"strokeLinejoin="round"/>
                   </Ce>}
-              </A>
+              </E>
 
               <T style={t.serialNumber}>#{r.id+1}</T>
 
-              <C style={[t.methodBadge,{backgroundColor:M}]}>
+              <C style={[t.methodBadge,{backgroundColor:j}]}>
                 <T style={t.methodBadgeText}>
                   {r.method}
                 </T>
@@ -35,15 +35,15 @@ ${r.url}`,[{text:z("common.cancel")||"Cancel",style:"cancel"},{text:z("common.op
             </C>
 
             <C style={t.cardHeaderRight}>
-              <C style={[t.statusPill,{backgroundColor:R?`${e.errorColor}14`:V?`${e.darkOrange}14`:`${D}14`,borderColor:R?`${e.errorColor}33`:V?`${e.darkOrange}33`:`${D}33`}]}>
-                {_()}
-                <T style={[t.statusPillText,{color:R?e.errorColor:V?e.darkOrange:D}]}>
-                  {X()}
+              <C style={[t.statusPill,{backgroundColor:H?`${e.errorColor}14`:z?`${e.darkOrange}14`:`${$}14`,borderColor:H?`${e.errorColor}33`:z?`${e.darkOrange}33`:`${$}33`}]}>
+                {Y()}
+                <T style={[t.statusPillText,{color:H?e.errorColor:z?e.darkOrange:$}]}>
+                  {_()}
                 </T>
               </C>
-              <A onPress={K}hitSlop={8}style={t.globeBtn}accessibilityRole="button"accessibilityLabel="Open in Browser">
+              <E onPress={Q}hitSlop={8}style={t.globeBtn}accessibilityRole="button"accessibilityLabel="Open in Browser">
                 <Pe color={e.grayTextWeak}size={12}/>
-              </A>
+              </E>
               <Fe color={e.grayTextWeak}size={13}/>
             </C>
           </C>
@@ -53,15 +53,15 @@ ${r.url}`,[{text:z("common.cancel")||"Cancel",style:"cancel"},{text:z("common.op
             
             <C style={t.urlMainRow}>
               <C style={t.hostRow}>
-                <C style={[t.protoBadge,{backgroundColor:H.isHttps?`${e.emerald600}12`:`${e.amber600}12`,borderColor:H.isHttps?`${e.emerald600}2B`:`${e.amber600}2B`}]}>
-                  <T style={[t.protoBadgeText,{color:H.isHttps?e.emerald600:e.amber700}]}>
-                    {H.isHttps?"HTTPS":"HTTP"}
+                <C style={[t.protoBadge,{backgroundColor:V.isHttps?`${e.emerald600}12`:`${e.amber600}12`,borderColor:V.isHttps?`${e.emerald600}2B`:`${e.amber600}2B`}]}>
+                  <T style={[t.protoBadgeText,{color:V.isHttps?e.emerald600:e.amber700}]}>
+                    {V.isHttps?"HTTPS":"HTTP"}
                   </T>
                 </C>
-                <G text={H.host||r.url}search={j}style={t.hostText}highlightStyle={t.highlight}numberOfLines={1}ellipsizeMode="tail"/>
+                <G text={V.host||r.url}search={P}style={t.hostText}highlightStyle={t.highlight}numberOfLines={1}ellipsizeMode="tail"/>
               </C>
               <C style={t.urlBadgeRow}>
-                {Z&&<C style={t.jsonBadge}>
+                {ee&&<C style={t.jsonBadge}>
                     <T style={t.jsonBadgeText}>.json</T>
                   </C>}
                 {r.duplicateCount!=null&&r.duplicateCount>1&&<C style={t.dupBadge}>
@@ -72,7 +72,7 @@ ${r.url}`,[{text:z("common.cancel")||"Cancel",style:"cancel"},{text:z("common.op
 
             
             <C style={t.slugRow}>
-              <G text={H.path}search={j}style={t.pathText}highlightStyle={t.highlight}numberOfLines={1}ellipsizeMode="middle"/>
+              <G text={V.path}search={P}style={t.pathText}highlightStyle={t.highlight}numberOfLines={1}ellipsizeMode="middle"/>
             </C>
           </C>
 
@@ -81,7 +81,7 @@ ${r.url}`,[{text:z("common.cancel")||"Cancel",style:"cancel"},{text:z("common.op
             <C style={t.footerLeft}>
               <C style={t.cardDateRow}>
                 <Ie color={e.grayTextWeak}size={10}/>
-                <T style={t.cardDateText}numberOfLines={1}>{Y}</T>
+                <T style={t.cardDateText}numberOfLines={1}>{Z}</T>
               </C>
             </C>
 
@@ -93,7 +93,7 @@ ${r.url}`,[{text:z("common.cancel")||"Cancel",style:"cancel"},{text:z("common.op
                   </T>
                 </C>}
 
-              {r.duration!=null&&!R&&<C style={[t.metaStatChip,{backgroundColor:`${I}12`,borderColor:`${I}2E`}]}>
+              {r.duration!=null&&!H&&<C style={[t.metaStatChip,{backgroundColor:`${I}12`,borderColor:`${I}2E`}]}>
                   <N color={I}size={9}/>
                   <T style={[t.metaStatText,{color:I}]}>
                     {r.duration}ms
@@ -104,10 +104,10 @@ ${r.url}`,[{text:z("common.cancel")||"Cancel",style:"cancel"},{text:z("common.op
 
           
           <C style={t.waterfallContainer}>
-            {typeof r.duration=="number"&&r.duration>0&&!R&&<C style={[t.waterfallBar,{width:`${Math.min(100,Math.max(6,r.duration/1200*100))}%`,backgroundColor:I}]}/>}
+            {typeof r.duration=="number"&&r.duration>0&&!H&&<C style={[t.waterfallBar,{width:`${Math.min(100,Math.max(6,r.duration/1200*100))}%`,backgroundColor:I}]}/>}
           </C>
         </C>
 
-        {$&&<W.View pointerEvents="none"style={[E.absoluteFill,{backgroundColor:M,opacity:O}]}/>}
+        {L&&<W.View pointerEvents="none"style={[A.absoluteFill,{backgroundColor:j,opacity:D}]}/>}
       </Me>
-    </C>}const t=E.create({container:{paddingHorizontal:8,paddingVertical:4,height:126,justifyContent:"center"},card:{height:118,alignSelf:"stretch",borderRadius:10,overflow:"hidden",borderWidth:1,borderColor:e.dividerColor,shadowColor:e.shadowColorString},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},smallCheckbox:{width:15,height:15,borderRadius:4,borderWidth:1.5,borderColor:e.grayTextWeak,alignItems:"center",justifyContent:"center",backgroundColor:e.white},smallCheckboxChecked:{backgroundColor:e.purple,borderColor:e.purple},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},globeBtn:{padding:3,borderRadius:4,backgroundColor:`${e.grayTextWeak}12`,alignItems:"center",justifyContent:"center"},urlBox:{backgroundColor:e.grayBackground,borderRadius:7,borderWidth:1,borderColor:e.dividerColor,paddingHorizontal:7,paddingVertical:4.5,height:48,minHeight:48,maxHeight:48,justifyContent:"center",gap:2.5,overflow:"hidden"},urlMainRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",gap:4,minHeight:16},hostRow:{flexDirection:"row",alignItems:"center",gap:5,flex:1,minWidth:0},protoBadge:{paddingHorizontal:4,paddingVertical:1,borderRadius:3.5,borderWidth:1},protoBadgeText:{fontFamily:S.interBold,fontSize:8,lineHeight:10},hostText:{fontFamily:S.interBold,fontSize:11.5,lineHeight:15,color:e.primaryBlack,flex:1},urlBadgeRow:{flexDirection:"row",alignItems:"center",gap:4,flexShrink:0},jsonBadge:{backgroundColor:`${e.darkOrange}14`,borderColor:`${e.darkOrange}2E`,borderWidth:1,paddingHorizontal:4.5,paddingVertical:1,borderRadius:3.5},jsonBadgeText:{fontFamily:S.interBold,fontSize:8.5,color:e.darkOrange},dupBadge:{backgroundColor:`${e.purple}14`,borderColor:`${e.purple}2E`,borderWidth:1,paddingHorizontal:4.5,paddingVertical:1,borderRadius:3.5},dupBadgeText:{fontFamily:S.interBold,fontSize:8.5,color:e.purple},slugRow:{flexDirection:"row",alignItems:"center",minHeight:15},pathText:{fontFamily:S.interMedium,fontSize:10.5,lineHeight:14,color:e.slate600||e.grayText,flex:1},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},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:S.interBold,color:e.violetSoftText,fontSize:9,lineHeight:12},waterfallContainer:{height:2.5,width:"100%",backgroundColor:e.graySurface,borderRadius:1.5,overflow:"hidden",marginTop:2},waterfallBar:{height:"100%",borderRadius:1.5}});function Ee(r,B){return r.item===B.item&&r.isSelected===B.isSelected&&r.isNew===B.isNew&&r.searchStr===B.searchStr&&r.timelineMinStart===B.timelineMinStart&&r.timelineTotalRange===B.timelineTotalRange&&r.onPress===B.onPress&&r.onToggleSelect===B.onToggleSelect}export default re.memo(Ae,Ee);
+    </C>}const t=A.create({container:{paddingHorizontal:8,paddingVertical:4,height:126,justifyContent:"center"},card:{height:118,alignSelf:"stretch",borderRadius:10,overflow:"hidden",borderWidth:1,borderColor:e.dividerColor,shadowColor:e.shadowColorString},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},smallCheckbox:{width:15,height:15,borderRadius:4,borderWidth:1.5,borderColor:e.grayTextWeak,alignItems:"center",justifyContent:"center",backgroundColor:e.white},smallCheckboxChecked:{backgroundColor:e.purple,borderColor:e.purple},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},globeBtn:{padding:3,borderRadius:4,backgroundColor:`${e.grayTextWeak}12`,alignItems:"center",justifyContent:"center"},urlBox:{backgroundColor:e.grayBackground,borderRadius:7,borderWidth:1,borderColor:e.dividerColor,paddingHorizontal:7,paddingVertical:4.5,height:48,minHeight:48,maxHeight:48,justifyContent:"center",gap:2.5,overflow:"hidden"},urlMainRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",gap:4,minHeight:16},hostRow:{flexDirection:"row",alignItems:"center",gap:5,flex:1,minWidth:0},protoBadge:{paddingHorizontal:4,paddingVertical:1,borderRadius:3.5,borderWidth:1},protoBadgeText:{fontFamily:S.interBold,fontSize:8,lineHeight:10},hostText:{fontFamily:S.interBold,fontSize:11.5,lineHeight:15,color:e.primaryBlack,flex:1},urlBadgeRow:{flexDirection:"row",alignItems:"center",gap:4,flexShrink:0},jsonBadge:{backgroundColor:`${e.darkOrange}14`,borderColor:`${e.darkOrange}2E`,borderWidth:1,paddingHorizontal:4.5,paddingVertical:1,borderRadius:3.5},jsonBadgeText:{fontFamily:S.interBold,fontSize:8.5,color:e.darkOrange},dupBadge:{backgroundColor:`${e.purple}14`,borderColor:`${e.purple}2E`,borderWidth:1,paddingHorizontal:4.5,paddingVertical:1,borderRadius:3.5},dupBadgeText:{fontFamily:S.interBold,fontSize:8.5,color:e.purple},slugRow:{flexDirection:"row",alignItems:"center",minHeight:15},pathText:{fontFamily:S.interMedium,fontSize:10.5,lineHeight:14,color:e.slate600||e.grayText,flex:1},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},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:S.interBold,color:e.violetSoftText,fontSize:9,lineHeight:12},waterfallContainer:{height:2.5,width:"100%",backgroundColor:e.graySurface,borderRadius:1.5,overflow:"hidden",marginTop:2},waterfallBar:{height:"100%",borderRadius:1.5}});function Ae(r,B){return r.item===B.item&&r.isSelected===B.isSelected&&r.isNew===B.isNew&&r.searchStr===B.searchStr&&r.timelineMinStart===B.timelineMinStart&&r.timelineTotalRange===B.timelineTotalRange&&r.onPress===B.onPress&&r.onToggleSelect===B.onToggleSelect}export default te.memo(Ee,Ae);

package/dist/esm/constants/version.d.ts

@@ -1 +1 @@
-export declare const LIB_VERSION = "2.5.7";
+export declare const LIB_VERSION = "2.5.8";