react-native-inapp-inspector 2.4.0 → 2.4.2

package/dist/esm/components/JsonViewer.js

@@ -1,19 +1,19 @@
-import Q,{useState as D,useEffect as le,useMemo as G,useCallback as He}from"react";import{ScrollView as O,View as T,Text as V,StyleSheet as Ie,TouchableOpacity as Te,Platform as We}from"react-native";import{useTranslation as Ae}from"../i18n";import Pe from"./TreeNode";import X from"./HighlightText";import E from"./TouchableScale";import{PrettyIcon as Ne,RawIcon as Oe,TableIcon as De,ChevronIcon as Ee,CopyIcon as Le,CheckIcon as Ke}from"./NetworkIcons";import{AppColors as t}from"../styles/AppColors";import{AppFonts as N}from"../styles/AppFonts";import{getSize as Me,copyToClipboard as ve}from"../helpers";import{triggerNativeHaptic as Je}from"../native/NativeInspector";const I=We.select({ios:"Menlo",android:"monospace",default:"monospace"}),$e=o=>o===null?{label:"null",color:t.errorColor,bg:t.errorCardBg,border:t.errorBorder}:o===void 0?{label:"undef",color:t.errorColor,bg:t.errorCardBg,border:t.errorBorder}:Array.isArray(o)?{label:`arr[${o.length}]`,color:t.blue600,bg:t.blueBg,border:t.sky100}:typeof o=="object"?{label:`obj{${Object.keys(o).length}}`,color:t.violet600,bg:t.purple50,border:t.purple200}:typeof o=="number"?{label:"num",color:t.amber600,bg:t.amber100,border:t.amber200}:typeof o=="boolean"?{label:"bool",color:t.pink600,bg:t.roseBg,border:t.roseBorder}:{label:"str",color:t.emerald600,bg:t.emeraldBg,border:t.emeraldBorder},Se=Q.memo(({text:o,search:S,detectLinks:A})=>{const B=o.trim();let F=e.rawMonospaceText;return B.startsWith('"')?F=e.syntaxString:B==="null"||B.startsWith("null,")||B==="undefined"?F=e.syntaxNull:B==="true"||B.startsWith("true,")||B==="false"||B.startsWith("false,")?F=e.syntaxBoolean:/^-?\d+(?:\.\d+)?(?:[eE][+-]?\d+)?,?$/.test(B)&&(F=e.syntaxNumber),<X text={o}search={S}detectLinks={A}style={F}selectable={!0}highlightStyle={e.highlight}/>}),Ge=Q.memo(({line:o,search:S,detectLinks:A})=>{const B=o.match(/^(\s+)(.*)$/),F=B?B[1]:"",P=B?B[2]:o,j=F?F.replace(/  /g,"\xB7 ").replace(/ /g,"\xB7"):"",z=P.match(/^("(?:[^"\\]|\\.)*")(\s*:\s*)(.*)$/);if(z){const k=z[1],K=z[2],H=z[3];return<T style={e.rawLineContentRow}>
+import Q,{useState as L,useEffect as le,useMemo as G,useCallback as Ie}from"react";import{ScrollView as O,View as T,Text as V,StyleSheet as We,TouchableOpacity as Te,Platform as Fe}from"react-native";import{useTranslation as Ae}from"../i18n";import Pe from"./TreeNode";import X from"./HighlightText";import D from"./TouchableScale";import{PrettyIcon as Ne,RawIcon as Oe,TableIcon as Le,ChevronIcon as De,CopyIcon as Ee,CheckIcon as Ke}from"./NetworkIcons";import{AppColors as t}from"../styles/AppColors";import{AppFonts as N}from"../styles/AppFonts";import{getSize as Me,copyToClipboard as ve}from"../helpers";import{triggerNativeHaptic as Je}from"../native/NativeInspector";const W=Fe.select({ios:"Menlo",android:"monospace",default:"monospace"}),$e=o=>o===null?{label:"null",color:t.errorColor,bg:t.errorCardBg,border:t.errorBorder}:o===void 0?{label:"undef",color:t.errorColor,bg:t.errorCardBg,border:t.errorBorder}:Array.isArray(o)?{label:`arr[${o.length}]`,color:t.blue600,bg:t.blueBg,border:t.sky100}:typeof o=="object"?{label:`obj{${Object.keys(o).length}}`,color:t.violet600,bg:t.purple50,border:t.purple200}:typeof o=="number"?{label:"num",color:t.amber600,bg:t.amber100,border:t.amber200}:typeof o=="boolean"?{label:"bool",color:t.pink600,bg:t.roseBg,border:t.roseBorder}:{label:"str",color:t.emerald600,bg:t.emeraldBg,border:t.emeraldBorder},Se=Q.memo(({text:o,search:S,detectLinks:A})=>{const B=o.trim();let z=e.rawMonospaceText;return B.startsWith('"')?z=e.syntaxString:B==="null"||B.startsWith("null,")||B==="undefined"?z=e.syntaxNull:B==="true"||B.startsWith("true,")||B==="false"||B.startsWith("false,")?z=e.syntaxBoolean:/^-?\d+(?:\.\d+)?(?:[eE][+-]?\d+)?,?$/.test(B)&&(z=e.syntaxNumber),<X text={o}search={S}detectLinks={A}style={z}selectable={!0}highlightStyle={e.highlight}/>}),Ge=Q.memo(({line:o,search:S,detectLinks:A})=>{const B=o.match(/^(\s+)(.*)$/),z=B?B[1]:"",P=B?B[2]:o,j=z?z.replace(/  /g,"\xB7 ").replace(/ /g,"\xB7"):"",R=P.match(/^("(?:[^"\\]|\\.)*")(\s*:\s*)(.*)$/);if(R){const H=R[1],K=R[2],I=R[3];return<T style={e.rawLineContentRow}>
           {j.length>0&&<V style={e.indentDots}>{j}</V>}
-          <X text={k}search={S}style={e.syntaxKey}selectable={!0}highlightStyle={e.highlight}/>
+          <X text={H}search={S}style={e.syntaxKey}selectable={!0}highlightStyle={e.highlight}/>
           <V style={e.syntaxColon}>{K}</V>
-          <Se text={H}search={S}detectLinks={A}/>
+          <Se text={I}search={S}detectLinks={A}/>
         </T>}return<T style={e.rawLineContentRow}>
         {j.length>0&&<V style={e.indentDots}>{j}</V>}
         <Se text={P}search={S}detectLinks={A}/>
-      </T>}),Ye=Q.memo(({itemKey:o,val:S,search:A,index:B})=>{const[F,P]=D(!1),j=S!==null&&typeof S=="object",z=$e(S);let k="";if(S===null)k="null";else if(S===void 0)k="undefined";else if(j)try{k=JSON.stringify(S,null,2)}catch{k=String(S)}else k=String(S);const K=k.includes(`
-`)||k.length>80;return<T style={[e.tableRow,B%2===1&&e.tableRowAlt]}>
+      </T>}),Ye=Q.memo(({itemKey:o,val:S,search:A,index:B})=>{const[z,P]=L(!1),j=S!==null&&typeof S=="object",R=$e(S);let H="";if(S===null)H="null";else if(S===void 0)H="undefined";else if(j)try{H=JSON.stringify(S,null,2)}catch{H=String(S)}else H=String(S);const K=H.includes(`
+`)||H.length>80;return<T style={[e.tableRow,B%2===1&&e.tableRowAlt]}>
         
         <T style={e.tableColKey}>
           <X text={o}search={A}style={e.tableCellKey}highlightStyle={e.highlight}/>
-          <T style={[e.typePill,{backgroundColor:z.bg,borderColor:z.border}]}>
-            <V style={[e.typePillText,{color:z.color}]}>
-              {z.label}
+          <T style={[e.typePill,{backgroundColor:R.bg,borderColor:R.border}]}>
+            <V style={[e.typePillText,{color:R.color}]}>
+              {R.label}
             </V>
           </T>
         </T>
@@ -21,29 +21,29 @@ import Q,{useState as D,useEffect as le,useMemo as G,useCallback as He}from"reac
         
         <T style={e.tableColVal}>
           <T style={j?e.tableCodeBox:void 0}>
-            <X text={k}search={A}style={[e.tableCellValue,S==null?e.syntaxNull:void 0,typeof S=="number"?e.syntaxNumber:void 0,typeof S=="boolean"?e.syntaxBoolean:void 0,typeof S=="string"?e.syntaxString:void 0]}highlightStyle={e.highlight}numberOfLines={F?void 0:3}selectable={!0}/>
+            <X text={H}search={A}style={[e.tableCellValue,S==null?e.syntaxNull:void 0,typeof S=="number"?e.syntaxNumber:void 0,typeof S=="boolean"?e.syntaxBoolean:void 0,typeof S=="string"?e.syntaxString:void 0]}highlightStyle={e.highlight}numberOfLines={z?void 0:3}selectable={!0}/>
           </T>
-          {K&&<Te onPress={()=>P(H=>!H)}hitSlop={6}style={e.showMoreBtn}>
+          {K&&<Te onPress={()=>P(I=>!I)}hitSlop={6}style={e.showMoreBtn}>
               <V style={e.showMoreText}>
-                {F?"Collapse":"Expand"}
+                {z?"Collapse":"Expand"}
               </V>
-              <Ee direction={F?"up":"down"}size={9}color="#4F46E5"/>
+              <De direction={z?"up":"down"}size={9}color="#4F46E5"/>
             </Te>}
         </T>
-      </T>}),qe=Q.memo(({data:o,search:S,forceOpen:A,defaultExpandDepth:B=1,wrap:F,fullHeight:P=!1,maxHeight:j,mode:z,onModeChange:k,hideTabs:K=!1})=>{const{t:H}=Ae(),[Ce,ne]=D(z??"raw"),[ie,ae]=D(!1),[M,se]=D(F??!0),[v,Ve]=D("compact"),[J,ce]=D(A),[Be,Fe]=D(!1),R=k&&z?z:Ce,Z=C=>{ne(C),k&&k(C)};le(()=>{F!==void 0&&se(F)},[F]),le(()=>{A!==void 0&&ce(A)},[A]),le(()=>{z&&ne(z)},[z]);const L=G(()=>{if(o==null)return"";if(typeof o=="string"){const C=o.trim();try{const W=JSON.parse(C);return JSON.stringify(W,null,2)}catch{return o}}try{return JSON.stringify(o,null,2)??""}catch{return String(o)||""}},[o]),ee=G(()=>{if(typeof o=="string"){const C=o.trim();try{const W=JSON.parse(C);return JSON.stringify(W)}catch{return o}}try{return JSON.stringify(o)??""}catch{return String(o)||""}},[o]),de=v==="formatted"?L:ee,ge=5e4,$=typeof de=="string"?de:"",ye=$.length>ge&&!Be,te=ye?$.slice(0,ge):$,oe=G(()=>te?te.split(`
-`):[""],[te]),Ue=G(()=>R==="raw"?oe.length:L?L.split(`
-`).length:1,[R,oe.length,L]),_e=G(()=>Me(o),[o]),ze=He(()=>{Je("success"),ve(v==="compact"?ee:L,"JSON"),ae(!0),setTimeout(()=>ae(!1),1200)},[v,ee,L]),re=typeof o=="object"&&o!==null,Re=o==null||re&&Object.keys(o).length===0,pe=()=>{if(!re)return<T style={e.tableRow}>
+      </T>}),qe=Q.memo(({data:o,search:S,forceOpen:A,defaultExpandDepth:B=1,wrap:z,fullHeight:P=!1,maxHeight:j,mode:R,onModeChange:H,hideTabs:K=!1})=>{const{t:I}=Ae(),[Ce,ne]=L(R??"raw"),[ie,ae]=L(!1),[M,se]=L(z??!0),[v,Ve]=L("compact"),[J,ce]=L(A),[Be,ze]=L(!1),k=H&&R?R:Ce,Z=C=>{ne(C),H&&H(C)};le(()=>{z!==void 0&&se(z)},[z]),le(()=>{A!==void 0&&ce(A)},[A]),le(()=>{R&&ne(R)},[R]);const E=G(()=>{if(o==null)return"";if(typeof o=="string"){const C=o.trim();try{const F=JSON.parse(C);return JSON.stringify(F,null,2)}catch{return o}}try{return JSON.stringify(o,null,2)??""}catch{return String(o)||""}},[o]),ee=G(()=>{if(typeof o=="string"){const C=o.trim();try{const F=JSON.parse(C);return JSON.stringify(F)}catch{return o}}try{return JSON.stringify(o)??""}catch{return String(o)||""}},[o]),de=v==="formatted"?E:ee,ge=5e4,$=typeof de=="string"?de:"",ye=$.length>ge&&!Be,te=ye?$.slice(0,ge):$,oe=G(()=>te?te.split(`
+`):[""],[te]),Ue=G(()=>k==="raw"?oe.length:E?E.split(`
+`).length:1,[k,oe.length,E]),_e=G(()=>Me(o),[o]),Re=Ie(()=>{Je("success"),ve(v==="compact"?ee:E,"JSON"),ae(!0),setTimeout(()=>ae(!1),1200)},[v,ee,E]),re=typeof o=="object"&&o!==null,ke=o==null||re&&Object.keys(o).length===0,pe=()=>{if(!re)return<T style={e.tableRow}>
             <T style={e.tableColKey}>
               <V style={e.tableCellKey}>
-                {H("network.jsonViewer.value")}
+                {I("network.jsonViewer.value")}
               </V>
             </T>
             <T style={e.tableColVal}>
               <V style={e.tableCellValue}>{String(o)}</V>
             </T>
-          </T>;let C=Object.keys(o);if(S&&S.trim().length>0){const W=S.trim().toLowerCase();C=C.filter(U=>{const _=o[U],ke=typeof _=="object"&&_!==null?JSON.stringify(_):String(_);return U.toLowerCase().includes(W)||ke.toLowerCase().includes(W)})}return C.length===0?<T style={e.emptyContainer}>
+          </T>;let C=Object.keys(o);if(S&&S.trim().length>0){const F=S.trim().toLowerCase();C=C.filter(U=>{const _=o[U],He=typeof _=="object"&&_!==null?JSON.stringify(_):String(_);return U.toLowerCase().includes(F)||He.toLowerCase().includes(F)})}return C.length===0?<T style={e.emptyContainer}>
             <V style={e.emptyText}>
-              {S&&S.trim().length>0?"No matching keys or values found":H("network.jsonViewer.emptyTable")}
+              {S&&S.trim().length>0?"No matching keys or values found":I("network.jsonViewer.emptyTable")}
             </V>
           </T>:<T style={e.tableView}>
           
@@ -53,13 +53,13 @@ import Q,{useState as D,useEffect as le,useMemo as G,useCallback as He}from"reac
             </V>
             <V style={[e.tableHeaderCell,{flex:3}]}>VALUE</V>
           </T>
-          {C.map((W,U)=><Ye key={W}index={U}itemKey={W}val={o[W]}search={S}/>)}
+          {C.map((F,U)=><Ye key={F}index={U}itemKey={F}val={o[F]}search={S}/>)}
         </T>},Y=<Pe data={o}search={S}forceOpen={J}defaultExpandDepth={J?99:B}/>,q=()=><T style={e.rawLinesWrapper}>
-          {oe.map((C,W)=><T key={W}style={e.rawCodeLineRow}>
+          {oe.map((C,F)=><T key={F}style={e.rawCodeLineRow}>
               
               <T style={e.gutterCell}>
                 <V style={e.gutterNumber}selectable={!1}>
-                  {W+1}
+                  {F+1}
                 </V>
               </T>
 
@@ -68,7 +68,7 @@ import Q,{useState as D,useEffect as le,useMemo as G,useCallback as He}from"reac
                 <Ge line={C}search={S}detectLinks={$.length<2e4}/>
               </T>
             </T>)}
-        </T>,ue=()=>ye?<Te onPress={()=>Fe(!0)}activeOpacity={.8}style={e.truncationBanner}>
+        </T>,ue=()=>ye?<Te onPress={()=>ze(!0)}activeOpacity={.8}style={e.truncationBanner}>
           <V style={e.truncationText}>
             Showing first 50 KB ({Math.round($.length/1024)} KB
             total) · Tap to load full payload
@@ -78,65 +78,65 @@ import Q,{useState as D,useEffect as le,useMemo as G,useCallback as He}from"reac
         <T style={e.snippetHeader}>
           
           {!K&&<T style={e.snippetTabs}>
-              <E onPress={()=>Z("raw")}style={[e.snippetTabBtn,R==="raw"&&e.snippetTabBtnActive]}>
-                <Oe color={R==="raw"?t.white:t.grayText}size={11.5}/>
-                <V style={[e.snippetTabText,R==="raw"&&e.snippetTabTextActive]}>
-                  {H("network.jsonViewer.raw","Raw")}
+              <D onPress={()=>Z("raw")}style={[e.snippetTabBtn,k==="raw"&&e.snippetTabBtnActive]}>
+                <Oe color={k==="raw"?t.white:t.grayText}size={11.5}/>
+                <V style={[e.snippetTabText,k==="raw"&&e.snippetTabTextActive]}>
+                  {I("network.jsonViewer.raw","Raw")}
                 </V>
-              </E>
+              </D>
 
-              <E onPress={()=>Z("pretty")}style={[e.snippetTabBtn,R==="pretty"&&e.snippetTabBtnActive]}>
-                <Ne color={R==="pretty"?t.white:t.grayText}size={11.5}/>
-                <V style={[e.snippetTabText,R==="pretty"&&e.snippetTabTextActive]}>
-                  {H("network.jsonViewer.pretty","Pretty")}
+              <D onPress={()=>Z("pretty")}style={[e.snippetTabBtn,k==="pretty"&&e.snippetTabBtnActive]}>
+                <Ne color={k==="pretty"?t.white:t.grayText}size={11.5}/>
+                <V style={[e.snippetTabText,k==="pretty"&&e.snippetTabTextActive]}>
+                  {I("network.jsonViewer.pretty","Pretty")}
                 </V>
-              </E>
+              </D>
 
-              <E onPress={()=>Z("table")}style={[e.snippetTabBtn,R==="table"&&e.snippetTabBtnActive]}>
-                <De color={R==="table"?t.white:t.grayText}size={11.5}/>
-                <V style={[e.snippetTabText,R==="table"&&e.snippetTabTextActive]}>
-                  {H("network.jsonViewer.table","Table")}
+              <D onPress={()=>Z("table")}style={[e.snippetTabBtn,k==="table"&&e.snippetTabBtnActive]}>
+                <Le color={k==="table"?t.white:t.grayText}size={11.5}/>
+                <V style={[e.snippetTabText,k==="table"&&e.snippetTabTextActive]}>
+                  {I("network.jsonViewer.table","Table")}
                 </V>
-              </E>
+              </D>
             </T>}
 
           
           <T style={e.headerRight}>
             
-            {R==="raw"&&<>
-                <E onPress={()=>Ve(C=>C==="compact"?"formatted":"compact")}style={[e.toolToggleBtn,v==="compact"&&e.toolToggleBtnActive]}>
+            {k==="raw"&&<>
+                <D onPress={()=>Ve(C=>C==="compact"?"formatted":"compact")}style={[e.toolToggleBtn,v==="compact"&&e.toolToggleBtnActive]}>
                   <V style={[e.toolToggleText,v==="compact"&&e.toolToggleTextActive]}>
-                    {H("jsonViewer.min","Min")}
+                    {I("jsonViewer.min","Min")}
                   </V>
-                </E>
+                </D>
 
-                <E onPress={()=>se(C=>!C)}style={[e.toolToggleBtn,M&&e.toolToggleBtnActive]}>
+                <D onPress={()=>se(C=>!C)}style={[e.toolToggleBtn,M&&e.toolToggleBtnActive]}>
                   <V style={[e.toolToggleText,M&&e.toolToggleTextActive]}>
-                    {H("jsonViewer.wrap","Wrap")}
+                    {I("jsonViewer.wrap","Wrap")}
                   </V>
-                </E>
+                </D>
               </>}
 
             
-            {R==="pretty"&&re&&<E onPress={()=>ce(C=>!C)}style={[e.toolToggleBtn,J&&e.toolToggleBtnActive]}>
+            {k==="pretty"&&re&&<D onPress={()=>ce(C=>!C)}style={[e.toolToggleBtn,J&&e.toolToggleBtnActive]}>
                 <V style={[e.toolToggleText,J&&e.toolToggleTextActive]}>
-                  {J?H("jsonViewer.fold","Fold"):H("jsonViewer.expand","Expand")}
+                  {J?I("jsonViewer.fold","Fold"):I("jsonViewer.expand","Expand")}
                 </V>
-              </E>}
+              </D>}
 
             
-            <E onPress={ze}hitSlop={6}style={[e.copyBtn,ie&&e.copyBtnSuccess]}>
-              {ie?<Ke color={t.emerald500}size={13}/>:<Le color={t.grayText}size={13}/>}
-            </E>
+            <D onPress={Re}hitSlop={6}style={[e.copyBtn,ie&&e.copyBtnSuccess]}>
+              {ie?<Ke color={t.emerald500}size={13}/>:<Ee color={t.grayText}size={13}/>}
+            </D>
           </T>
         </T>
 
         
         <T style={[e.editorBody,P&&{flex:1,maxHeight:void 0},!P&&j!=null&&{maxHeight:j}]}>
           
-          {R==="pretty"&&(Re?<T style={e.emptyContainer}>
+          {k==="pretty"&&(ke?<T style={e.emptyContainer}>
                 <V style={e.emptyText}>
-                  {H("network.jsonViewer.emptyPayload")}
+                  {I("network.jsonViewer.emptyPayload")}
                 </V>
               </T>:M?P?<O style={{flex:1}}contentContainerStyle={e.prettyContainer}showsVerticalScrollIndicator={!0}>
                   {Y}
@@ -149,7 +149,7 @@ import Q,{useState as D,useEffect as le,useMemo as G,useCallback as He}from"reac
               </O>)}
 
           
-          {R==="raw"&&(P?<O style={e.fullHeightScrollView}contentContainerStyle={e.fullHeightScrollContent}showsVerticalScrollIndicator={!0}showsHorizontalScrollIndicator={!1}>
+          {k==="raw"&&(P?<O style={e.fullHeightScrollView}contentContainerStyle={e.fullHeightScrollContent}showsVerticalScrollIndicator={!0}showsHorizontalScrollIndicator={!1}>
                 {M?<T style={e.rawEditorFullWidth}>
                     {q()}
                   </T>:<O horizontal showsHorizontalScrollIndicator={!0}contentContainerStyle={e.rawHorizontalContent}>
@@ -170,8 +170,8 @@ import Q,{useState as D,useEffect as le,useMemo as G,useCallback as He}from"reac
               </T>)}
 
           
-          {R==="table"&&(P?<O style={{flex:1}}contentContainerStyle={{flexGrow:1}}showsVerticalScrollIndicator={!0}>
+          {k==="table"&&(P?<O style={{flex:1}}contentContainerStyle={{flexGrow:1}}showsVerticalScrollIndicator={!0}>
                 {pe()}
               </O>:<T style={e.tableView}>{pe()}</T>)}
         </T>
-      </T>}),e=Ie.create({container:{backgroundColor:t.white,borderRadius:12,borderWidth:1,borderColor:t.grayBorderSecondary,overflow:"hidden",shadowColor:t.brandPurple,shadowOpacity:.04,shadowRadius:6,shadowOffset:{width:0,height:2},elevation:2,width:"100%"},snippetHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",backgroundColor:t.grayBackground,borderBottomWidth:1,borderBottomColor:t.grayBorderSecondary,paddingHorizontal:8,paddingVertical:5,gap:6,minHeight:38},headerLeft:{flexDirection:"row",alignItems:"center",gap:5,flexShrink:1,minWidth:0},langBadge:{flexDirection:"row",alignItems:"center",backgroundColor:t.white,borderRadius:6,borderWidth:1,borderColor:t.grayBorderSecondary,paddingHorizontal:6,paddingVertical:2.5,gap:4.5},langDot:{width:5,height:5,borderRadius:2.5,backgroundColor:t.emerald500},langBadgeText:{fontFamily:I,fontSize:9.5,color:t.primaryBlack,fontWeight:"700",letterSpacing:.3},metaBadge:{backgroundColor:t.white,borderRadius:6,borderWidth:1,borderColor:t.grayBorderSecondary,paddingHorizontal:6,paddingVertical:2.5,flexShrink:1},metaBadgeText:{fontFamily:I,fontSize:9.5,color:t.grayTextWeak,fontWeight:"600"},headerRight:{flexDirection:"row",alignItems:"center",gap:4.5,flexShrink:0},snippetTabs:{flexDirection:"row",alignItems:"center",backgroundColor:`${t.slate200}80`,borderRadius:8,padding:2.5,borderWidth:1,borderColor:t.dividerColor,gap:2},snippetTabBtn:{flexDirection:"row",alignItems:"center",gap:4,paddingVertical:3.5,paddingHorizontal:8,borderRadius:6},snippetTabBtnActive:{backgroundColor:t.brandPurple,shadowColor:t.brandPurple,shadowOffset:{width:0,height:1},shadowOpacity:.25,shadowRadius:2,elevation:1},snippetTabText:{fontFamily:N.interSemiBold,fontSize:10.5,color:t.grayText},snippetTabTextActive:{color:t.white,fontFamily:N.interBold},toolToggleBtn:{paddingHorizontal:8,paddingVertical:3.5,borderRadius:6,backgroundColor:t.white,borderWidth:1,borderColor:t.grayBorderSecondary,alignItems:"center",justifyContent:"center"},toolToggleBtnActive:{backgroundColor:t.purpleShade50,borderColor:`${t.brandPurple}60`},toolToggleText:{fontFamily:N.interSemiBold,fontSize:10.5,color:t.grayText},toolToggleTextActive:{color:t.brandPurple,fontFamily:N.interBold},copyBtn:{width:27,height:27,borderRadius:6,backgroundColor:t.white,borderWidth:1,borderColor:t.grayBorderSecondary,alignItems:"center",justifyContent:"center"},copyBtnSuccess:{borderColor:t.greenMintBorder,backgroundColor:t.greenMintBg},editorBody:{backgroundColor:"#FFFFFF",minHeight:80},prettyContainer:{padding:10,minWidth:"100%",backgroundColor:"#FFFFFF"},fullHeightScrollView:{flex:1},fullHeightScrollContent:{flexGrow:1},rawEditorAutoHeight:{width:"100%"},rawEditorFullWidth:{width:"100%"},rawHorizontalContent:{minWidth:"100%"},rawLinesWrapper:{paddingVertical:6,backgroundColor:"#FFFFFF",width:"100%"},rawCodeLineRow:{flexDirection:"row",alignItems:"flex-start",minHeight:20,width:"100%"},gutterCell:{width:38,paddingRight:8,paddingTop:1,alignItems:"flex-end",justifyContent:"flex-start",borderRightWidth:1,borderRightColor:"#E2E8F0",backgroundColor:"#F8FAFC",userSelect:"none"},gutterNumber:{fontFamily:I,fontSize:11,lineHeight:18,color:"#94A3B8",textAlign:"right"},rawTextCell:{flex:1,paddingLeft:8,paddingRight:8,paddingTop:1,alignItems:"flex-start"},rawLineContentRow:{flexDirection:"row",alignItems:"flex-start",flexWrap:"wrap",minHeight:18},indentDots:{fontFamily:I,fontSize:11.5,lineHeight:18,color:"#CBD5E1",letterSpacing:.5},rawMonospaceText:{fontFamily:I,fontSize:11.5,lineHeight:18,color:t.slate900},syntaxKey:{fontFamily:I,fontSize:11.5,lineHeight:18,color:t.syntaxKey,fontWeight:"700"},syntaxColon:{fontFamily:I,fontSize:11.5,lineHeight:18,color:t.syntaxColon,marginRight:4},syntaxString:{fontFamily:I,fontSize:11.5,lineHeight:18,color:t.syntaxString},syntaxNumber:{fontFamily:I,fontSize:11.5,lineHeight:18,color:t.syntaxNumber},syntaxBoolean:{fontFamily:I,fontSize:11.5,lineHeight:18,color:t.syntaxBoolean},syntaxNull:{fontFamily:I,fontSize:11.5,lineHeight:18,color:t.syntaxNull,fontStyle:"italic"},truncationBanner:{margin:10,backgroundColor:t.purple50,paddingVertical:8,paddingHorizontal:12,borderRadius:6,alignItems:"center",borderWidth:1,borderColor:t.purple200},truncationText:{fontFamily:N.interSemiBold,fontSize:11,color:t.brandPurple},tableView:{flex:1,width:"100%"},tableHeaderRow:{flexDirection:"row",backgroundColor:t.slate100,borderBottomWidth:1,borderBottomColor:t.slate200,paddingVertical:7,paddingHorizontal:12},tableHeaderCell:{fontFamily:N.interBold,fontSize:10.5,color:t.slate600,letterSpacing:.5,textTransform:"uppercase"},tableRow:{flexDirection:"row",borderBottomWidth:1,borderBottomColor:t.slate100,paddingVertical:8,paddingHorizontal:12,alignItems:"flex-start",backgroundColor:t.white},tableRowAlt:{backgroundColor:t.slate50},tableColKey:{flex:2,paddingRight:8},tableColVal:{flex:3},tableCellKey:{fontFamily:I,fontSize:11.5,fontWeight:"700",color:t.brandPurple},typePill:{alignSelf:"flex-start",borderRadius:4,borderWidth:1,paddingHorizontal:4,paddingVertical:1,marginTop:3},typePillText:{fontFamily:N.interBold,fontSize:9},tableCellValue:{fontFamily:I,fontSize:11.5,color:t.slate900,lineHeight:17},tableCodeBox:{backgroundColor:t.slate100,borderRadius:6,borderWidth:1,borderColor:t.slate200,padding:6},showMoreBtn:{flexDirection:"row",alignItems:"center",gap:4,alignSelf:"flex-start",marginTop:4,paddingVertical:2,paddingHorizontal:4},showMoreText:{fontFamily:N.interSemiBold,fontSize:10.5,color:t.brandPurple},emptyContainer:{padding:24,alignItems:"center",justifyContent:"center"},emptyText:{fontFamily:N.interMedium,fontSize:12,color:t.slate500},highlight:{backgroundColor:t.yellow200,color:t.yellow800,fontFamily:I,fontWeight:"700",borderRadius:2,paddingHorizontal:2}});export default qe;
+      </T>}),e=We.create({container:{backgroundColor:t.white,borderRadius:12,borderWidth:1,borderColor:t.grayBorderSecondary,overflow:"hidden",shadowColor:t.brandPurple,shadowOpacity:.04,shadowRadius:6,shadowOffset:{width:0,height:2},elevation:2,width:"100%"},snippetHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",backgroundColor:t.grayBackground,borderBottomWidth:1,borderBottomColor:t.grayBorderSecondary,paddingHorizontal:8,paddingVertical:5,gap:6,minHeight:38},headerLeft:{flexDirection:"row",alignItems:"center",gap:5,flexShrink:1,minWidth:0},langBadge:{flexDirection:"row",alignItems:"center",backgroundColor:t.white,borderRadius:6,borderWidth:1,borderColor:t.grayBorderSecondary,paddingHorizontal:6,paddingVertical:2.5,gap:4.5},langDot:{width:5,height:5,borderRadius:2.5,backgroundColor:t.emerald500},langBadgeText:{fontFamily:W,fontSize:9.5,color:t.primaryBlack,fontWeight:"700",letterSpacing:.3},metaBadge:{backgroundColor:t.white,borderRadius:6,borderWidth:1,borderColor:t.grayBorderSecondary,paddingHorizontal:6,paddingVertical:2.5,flexShrink:1},metaBadgeText:{fontFamily:W,fontSize:9.5,color:t.grayTextWeak,fontWeight:"600"},headerRight:{flexDirection:"row",alignItems:"center",gap:4.5,flexShrink:0},snippetTabs:{flexDirection:"row",alignItems:"center",backgroundColor:`${t.slate200}80`,borderRadius:8,padding:2.5,borderWidth:1,borderColor:t.dividerColor,gap:2},snippetTabBtn:{flexDirection:"row",alignItems:"center",gap:4,paddingVertical:3.5,paddingHorizontal:8,borderRadius:6},snippetTabBtnActive:{backgroundColor:t.brandPurple,shadowColor:t.brandPurple,shadowOffset:{width:0,height:1},shadowOpacity:.25,shadowRadius:2,elevation:1},snippetTabText:{fontFamily:N.interSemiBold,fontSize:10.5,color:t.grayText},snippetTabTextActive:{color:t.white,fontFamily:N.interBold},toolToggleBtn:{paddingHorizontal:8,paddingVertical:3.5,borderRadius:6,backgroundColor:t.white,borderWidth:1,borderColor:t.grayBorderSecondary,alignItems:"center",justifyContent:"center"},toolToggleBtnActive:{backgroundColor:t.purpleShade50,borderColor:`${t.brandPurple}60`},toolToggleText:{fontFamily:N.interSemiBold,fontSize:10.5,color:t.grayText},toolToggleTextActive:{color:t.brandPurple,fontFamily:N.interBold},copyBtn:{width:27,height:27,borderRadius:6,backgroundColor:t.white,borderWidth:1,borderColor:t.grayBorderSecondary,alignItems:"center",justifyContent:"center"},copyBtnSuccess:{borderColor:t.greenMintBorder,backgroundColor:t.greenMintBg},editorBody:{backgroundColor:t.white,minHeight:80},prettyContainer:{padding:10,minWidth:"100%",backgroundColor:t.white},fullHeightScrollView:{flex:1},fullHeightScrollContent:{flexGrow:1},rawEditorAutoHeight:{width:"100%"},rawEditorFullWidth:{width:"100%"},rawHorizontalContent:{minWidth:"100%"},rawLinesWrapper:{paddingVertical:6,backgroundColor:t.white,width:"100%"},rawCodeLineRow:{flexDirection:"row",alignItems:"flex-start",minHeight:20,width:"100%"},gutterCell:{width:38,paddingRight:8,paddingTop:1,alignItems:"flex-end",justifyContent:"flex-start",borderRightWidth:1,borderRightColor:t.grayBorderSecondary,backgroundColor:t.grayBackground,userSelect:"none"},gutterNumber:{fontFamily:W,fontSize:11,lineHeight:18,color:t.slate400,textAlign:"right"},rawTextCell:{flex:1,paddingLeft:8,paddingRight:8,paddingTop:1,alignItems:"flex-start"},rawLineContentRow:{flexDirection:"row",alignItems:"flex-start",flexWrap:"wrap",minHeight:18},indentDots:{fontFamily:W,fontSize:11.5,lineHeight:18,color:t.gray300,letterSpacing:.5},rawMonospaceText:{fontFamily:W,fontSize:11.5,lineHeight:18,color:t.slate900},syntaxKey:{fontFamily:W,fontSize:11.5,lineHeight:18,color:t.syntaxKey,fontWeight:"700"},syntaxColon:{fontFamily:W,fontSize:11.5,lineHeight:18,color:t.syntaxColon,marginRight:4},syntaxString:{fontFamily:W,fontSize:11.5,lineHeight:18,color:t.syntaxString},syntaxNumber:{fontFamily:W,fontSize:11.5,lineHeight:18,color:t.syntaxNumber},syntaxBoolean:{fontFamily:W,fontSize:11.5,lineHeight:18,color:t.syntaxBoolean},syntaxNull:{fontFamily:W,fontSize:11.5,lineHeight:18,color:t.syntaxNull,fontStyle:"italic"},truncationBanner:{margin:10,backgroundColor:t.purple50,paddingVertical:8,paddingHorizontal:12,borderRadius:6,alignItems:"center",borderWidth:1,borderColor:t.purple200},truncationText:{fontFamily:N.interSemiBold,fontSize:11,color:t.brandPurple},tableView:{flex:1,width:"100%"},tableHeaderRow:{flexDirection:"row",backgroundColor:t.slate100,borderBottomWidth:1,borderBottomColor:t.slate200,paddingVertical:7,paddingHorizontal:12},tableHeaderCell:{fontFamily:N.interBold,fontSize:10.5,color:t.slate600,letterSpacing:.5,textTransform:"uppercase"},tableRow:{flexDirection:"row",borderBottomWidth:1,borderBottomColor:t.slate100,paddingVertical:8,paddingHorizontal:12,alignItems:"flex-start",backgroundColor:t.white},tableRowAlt:{backgroundColor:t.slate50},tableColKey:{flex:2,paddingRight:8},tableColVal:{flex:3},tableCellKey:{fontFamily:W,fontSize:11.5,fontWeight:"700",color:t.brandPurple},typePill:{alignSelf:"flex-start",borderRadius:4,borderWidth:1,paddingHorizontal:4,paddingVertical:1,marginTop:3},typePillText:{fontFamily:N.interBold,fontSize:9},tableCellValue:{fontFamily:W,fontSize:11.5,color:t.slate900,lineHeight:17},tableCodeBox:{backgroundColor:t.slate100,borderRadius:6,borderWidth:1,borderColor:t.slate200,padding:6},showMoreBtn:{flexDirection:"row",alignItems:"center",gap:4,alignSelf:"flex-start",marginTop:4,paddingVertical:2,paddingHorizontal:4},showMoreText:{fontFamily:N.interSemiBold,fontSize:10.5,color:t.brandPurple},emptyContainer:{padding:24,alignItems:"center",justifyContent:"center"},emptyText:{fontFamily:N.interMedium,fontSize:12,color:t.slate500},highlight:{backgroundColor:t.yellow200,color:t.yellow800,fontFamily:W,fontWeight:"700",borderRadius:2,paddingHorizontal:2}});export default qe;

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

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

package/dist/esm/components/LogCard.js

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

package/dist/esm/components/LogSyntaxHighlighter.js

@@ -1,11 +1,11 @@
-import F from"react";import{StyleSheet as G,Text as T}from"react-native";import{AppColors as r}from"../styles/AppColors";import{AppFonts as w}from"../styles/AppFonts";import{escapeRegex as U,handleOpenExternalLink as H}from"../helpers";const M=/("(?:\\.|[^"\\])*"(?=\s*:))|("(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*')|(\b-?\d+(?:\.\d+)?(?:[eE][+-]?\d+)?\b)|(\b(?:true|false)\b)|(\b(?:null|undefined|NaN)\b)|(https?:\/\/[^\s"',]+)|(\[[\w\s_-]+\])|([{}[\],:])|([^"'\d\s{}[\],:]+|[ \t\r\n]+)/g;export const tokenizeText=l=>{if(!l)return[];const t=[];let e;for(M.lastIndex=0;(e=M.exec(l))!==null;)e[1]?t.push({type:"key",value:e[1]}):e[2]?t.push({type:"string",value:e[2]}):e[3]?t.push({type:"number",value:e[3]}):e[4]?t.push({type:"boolean",value:e[4]}):e[5]?t.push({type:"null",value:e[5]}):e[6]?t.push({type:"url",value:e[6]}):e[7]?t.push({type:"tag",value:e[7]}):e[8]?t.push({type:"bracket",value:e[8]}):e[9]&&t.push({type:"plain",value:e[9]});return t};const X=l=>{switch(l){case"key":return r.sky600;case"string":return r.emerald600;case"number":return r.amber600;case"boolean":return r.purple;case"null":return r.red600;case"url":return r.sky600;case"tag":return r.violet600;case"bracket":return r.slate500;default:return r.primaryBlack}};export const LogSyntaxHighlighter=F.memo(({text:l,search:t,numberOfLines:e,style:O,detectLinks:L=!0})=>{if(!l)return null;const z=F.useMemo(()=>tokenizeText(l),[l]),A=(n,S)=>{const K=X(n.type),C=n.type==="url",P=n.type==="key",R={color:K,fontFamily:P?w.interBold:w.interRegular,textDecorationLine:C?"underline":"none"};if(!t||t.trim().length===0)return<T key={S}style={R}onPress={C&&L?()=>H(n.value):void 0}>
+import F from"react";import{StyleSheet as G,Text as T}from"react-native";import{AppColors as r}from"../styles/AppColors";import{AppFonts as R}from"../styles/AppFonts";import{escapeRegex as U,handleOpenExternalLink as H}from"../helpers";const M=/("(?:\\.|[^"\\])*"(?=\s*:))|("(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*')|(\b-?\d+(?:\.\d+)?(?:[eE][+-]?\d+)?\b)|(\b(?:true|false)\b)|(\b(?:null|undefined|NaN)\b)|(https?:\/\/[^\s"',]+)|(\[[\w\s_-]+\])|([{}[\],:])|([^"'\d\s{}[\],:]+|[ \t\r\n]+)/g;export const tokenizeText=l=>{if(!l)return[];const t=[];let e;for(M.lastIndex=0;(e=M.exec(l))!==null;)e[1]?t.push({type:"key",value:e[1]}):e[2]?t.push({type:"string",value:e[2]}):e[3]?t.push({type:"number",value:e[3]}):e[4]?t.push({type:"boolean",value:e[4]}):e[5]?t.push({type:"null",value:e[5]}):e[6]?t.push({type:"url",value:e[6]}):e[7]?t.push({type:"tag",value:e[7]}):e[8]?t.push({type:"bracket",value:e[8]}):e[9]&&t.push({type:"plain",value:e[9]});return t};const X=l=>{switch(l){case"key":return r.sky600;case"string":return r.emerald600;case"number":return r.amber600;case"boolean":return r.purple;case"null":return r.red600;case"url":return r.sky600;case"tag":return r.violet600;case"bracket":return r.slate500;default:return r.primaryBlack}};export const LogSyntaxHighlighter=F.memo(({text:l,search:t,numberOfLines:e,style:O,detectLinks:L=!0})=>{if(!l)return null;const z=F.useMemo(()=>tokenizeText(l),[l]),A=(n,S)=>{const K=X(n.type),C=n.type==="url",P=n.type==="key",w={color:K,fontFamily:P?R.interBold:R.interRegular,textDecorationLine:C?"underline":"none"};if(!t||t.trim().length===0)return<T key={S}style={w}onPress={C&&L?()=>H(n.value):void 0}>
             {n.value}
-          </T>;const _=new RegExp(`(${U(t.trim())})`,"gi"),D=n.value.split(_);return<T key={S}style={R}>
-          {D.map((E,B)=>E.toLowerCase()===t.trim().toLowerCase()?<T key={B}style={[R,N.searchHighlight]}>
+          </T>;const _=new RegExp(`(${U(t.trim())})`,"gi"),D=n.value.split(_);return<T key={S}style={w}>
+          {D.map((E,B)=>E.toLowerCase()===t.trim().toLowerCase()?<T key={B}style={[w,N.searchHighlight]}>
                 {E}
-              </T>:<T key={B}style={R}onPress={C&&L?()=>H(n.value):void 0}>
+              </T>:<T key={B}style={w}onPress={C&&L?()=>H(n.value):void 0}>
                 {E}
               </T>)}
         </T>};return<T style={[N.containerText,O]}numberOfLines={e}>
         {z.map(A)}
-      </T>});const N=G.create({containerText:{fontFamily:w.interRegular,fontSize:12,lineHeight:18,color:r.primaryBlack},searchHighlight:{backgroundColor:"#fef08a",color:"#854d0e",fontFamily:w.interBold,borderRadius:2}});export default LogSyntaxHighlighter;
+      </T>});const N=G.create({containerText:{fontFamily:R.interRegular,fontSize:12,lineHeight:18,color:r.primaryBlack},searchHighlight:{backgroundColor:r.yellow200,color:r.yellow800,fontFamily:R.interBold,borderRadius:2}});export default LogSyntaxHighlighter;

package/dist/esm/components/ModuleErrorBoundary.js

@@ -1,33 +1,33 @@
-import{Component as E}from"react";import{StyleSheet as S,Text as F,View as C,TouchableOpacity as T,Platform as D}from"react-native";import{AppFonts as w}from"../styles/AppFonts";import{copyToClipboard as k}from"../helpers";import{WarningTriangleIcon as B,RefreshCcwIcon as I,CopyIcon as O}from"./NetworkIcons";import{handleInterceptedCrash as V}from"../customHooks/crashHandler";import{CrashType as W}from"../types/enums";export class ModuleErrorBoundary extends E{constructor(){super(...arguments),this.state={hasError:!1,error:null,copied:!1},this.handleRetry=()=>{this.setState({hasError:!1,error:null,copied:!1}),this.props.onRetry&&this.props.onRetry()},this.handleCopy=()=>{if(!this.state.error)return;const e=`[Module Error: ${this.props.moduleName||"Micro-Feature"}]
+import{Component as k}from"react";import{StyleSheet as z,Text as T,View as C,TouchableOpacity as F,Platform as D}from"react-native";import{AppFonts as S}from"../styles/AppFonts";import{AppColors as e}from"../styles/AppColors";import{copyToClipboard as I}from"../helpers";import{WarningTriangleIcon as O,RefreshCcwIcon as V,CopyIcon as B}from"./NetworkIcons";import{handleInterceptedCrash as W}from"../customHooks/crashHandler";import{CrashType as M}from"../types/enums";export class ModuleErrorBoundary extends k{constructor(){super(...arguments),this.state={hasError:!1,error:null,copied:!1},this.handleRetry=()=>{this.setState({hasError:!1,error:null,copied:!1}),this.props.onRetry&&this.props.onRetry()},this.handleCopy=()=>{if(!this.state.error)return;const t=`[Module Error: ${this.props.moduleName||"Micro-Feature"}]
 Message: ${this.state.error.message}
-Stack: ${this.state.error.stack||"N/A"}`;k(e),this.setState({copied:!0}),setTimeout(()=>{this.setState({copied:!1})},2e3)}}static getDerivedStateFromError(e){return{hasError:!0,error:e}}componentDidCatch(e,b){try{V(e,e?.stack,!1,W.Js,b.componentStack||void 0)}catch{}this.props.onError&&this.props.onError(e,b)}render(){if(this.state.hasError&&this.state.error){const{fallback:e,moduleName:b="UI Module",containerStyle:R}=this.props;return typeof e=="function"?e(this.state.error,this.handleRetry):e||<C style={[t.card,R]}>
-          <C style={t.headerRow}>
-            <C style={t.titleRow}>
-              <B color="#DC2626"size={16}/>
-              <F style={t.moduleName}numberOfLines={1}>
-                {b}
-              </F>
+Stack: ${this.state.error.stack||"N/A"}`;I(t),this.setState({copied:!0}),setTimeout(()=>{this.setState({copied:!1})},2e3)}}static getDerivedStateFromError(t){return{hasError:!0,error:t}}componentDidCatch(t,R){try{W(t,t?.stack,!1,M.Js,R.componentStack||void 0)}catch{}this.props.onError&&this.props.onError(t,R)}render(){if(this.state.hasError&&this.state.error){const{fallback:t,moduleName:R="UI Module",containerStyle:E}=this.props;return typeof t=="function"?t(this.state.error,this.handleRetry):t||<C style={[r.card,E]}>
+          <C style={r.headerRow}>
+            <C style={r.titleRow}>
+              <O color="#DC2626"size={16}/>
+              <T style={r.moduleName}numberOfLines={1}>
+                {R}
+              </T>
             </C>
-            <C style={t.badge}>
-              <F style={t.badgeText}>FAULT ISOLATED</F>
+            <C style={r.badge}>
+              <T style={r.badgeText}>FAULT ISOLATED</T>
             </C>
           </C>
 
-          <F style={t.message}numberOfLines={2}>
+          <T style={r.message}numberOfLines={2}>
             {this.state.error.message||"An unexpected rendering error occurred in this module."}
-          </F>
+          </T>
 
-          <C style={t.actionsRow}>
-            <T style={t.retryButton}onPress={this.handleRetry}activeOpacity={.7}>
-              <I color="#FFFFFF"size={12}/>
-              <F style={t.retryText}>Retry Module</F>
-            </T>
+          <C style={r.actionsRow}>
+            <F style={r.retryButton}onPress={this.handleRetry}activeOpacity={.7}>
+              <V color="#FFFFFF"size={12}/>
+              <T style={r.retryText}>Retry Module</T>
+            </F>
 
-            <T style={t.copyButton}onPress={this.handleCopy}activeOpacity={.7}>
-              <O color="#475569"size={12}/>
-              <F style={t.copyText}>
+            <F style={r.copyButton}onPress={this.handleCopy}activeOpacity={.7}>
+              <B color="#475569"size={12}/>
+              <T style={r.copyText}>
                 {this.state.copied?"Copied":"Copy Error"}
-              </F>
-            </T>
+              </T>
+            </F>
           </C>
-        </C>}return this.props.children}}export default ModuleErrorBoundary;const t=S.create({card:{backgroundColor:"#FEF2F2",borderColor:"#FECDD3",borderWidth:1.2,borderRadius:16,padding:14,marginVertical:6,gap:10,...D.select({ios:{shadowColor:"#DC2626",shadowOffset:{width:0,height:2},shadowOpacity:.06,shadowRadius:6},android:{elevation:2}})},headerRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",gap:6},titleRow:{flexDirection:"row",alignItems:"center",gap:6,flexShrink:1},moduleName:{fontSize:12.5,fontWeight:"800",color:"#991B1B",fontFamily:w.interBold,flexShrink:1},badge:{backgroundColor:"#FEE2E2",paddingHorizontal:6,paddingVertical:2,borderRadius:6,borderWidth:1,borderColor:"#FCA5A5"},badgeText:{fontSize:8.5,fontWeight:"800",color:"#B91C1C",letterSpacing:.4},message:{fontSize:11.5,color:"#7F1D1D",lineHeight:16,fontFamily:w.interRegular},actionsRow:{flexDirection:"row",alignItems:"center",gap:8,marginTop:2},retryButton:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,backgroundColor:"#DC2626",paddingVertical:7,paddingHorizontal:12,borderRadius:9},retryText:{fontSize:11,fontWeight:"700",color:"#FFFFFF",fontFamily:w.interBold},copyButton:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:4,backgroundColor:"#F1F5F9",paddingVertical:7,paddingHorizontal:12,borderRadius:9,borderWidth:1,borderColor:"#E2E8F0"},copyText:{fontSize:11,fontWeight:"600",color:"#475569",fontFamily:w.interMedium}});
+        </C>}return this.props.children}}export default ModuleErrorBoundary;const r=z.create({card:{backgroundColor:e.red50,borderColor:`${e.red500}33`,borderWidth:1.2,borderRadius:16,padding:14,marginVertical:6,gap:10,...D.select({ios:{shadowColor:e.red600,shadowOffset:{width:0,height:2},shadowOpacity:.06,shadowRadius:6},android:{elevation:2}})},headerRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",gap:6},titleRow:{flexDirection:"row",alignItems:"center",gap:6,flexShrink:1},moduleName:{fontSize:12.5,fontWeight:"800",color:e.redErrorText,fontFamily:S.interBold,flexShrink:1},badge:{backgroundColor:e.red100,paddingHorizontal:6,paddingVertical:2,borderRadius:6,borderWidth:1,borderColor:`${e.red500}4D`},badgeText:{fontSize:8.5,fontWeight:"800",color:e.rose700,letterSpacing:.4},message:{fontSize:11.5,color:e.redErrorText,lineHeight:16,fontFamily:S.interRegular},actionsRow:{flexDirection:"row",alignItems:"center",gap:8,marginTop:2},retryButton:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,backgroundColor:e.red600,paddingVertical:7,paddingHorizontal:12,borderRadius:9},retryText:{fontSize:11,fontWeight:"700",color:e.white,fontFamily:S.interBold},copyButton:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:4,backgroundColor:e.graySurface,paddingVertical:7,paddingHorizontal:12,borderRadius:9,borderWidth:1,borderColor:e.grayBorderSecondary},copyText:{fontSize:11,fontWeight:"600",color:e.grayText,fontFamily:S.interMedium}});