react-native-inapp-inspector 2.3.24 → 2.3.25

package/dist/commonjs/components/JsonViewer.js

@@ -1,185 +1,190 @@
-"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(e,t,r,i){i===void 0&&(i=r);var o=Object.getOwnPropertyDescriptor(t,r);(!o||("get"in o?!t.__esModule:o.writable||o.configurable))&&(o={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,i,o)}):(function(e,t,r,i){i===void 0&&(i=r),e[i]=t[r]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}):function(e,t){e.default=t}),__importStar=this&&this.__importStar||(function(){var e=function(t){return e=Object.getOwnPropertyNames||function(r){var i=[];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(i[i.length]=o);return i},e(t)};return function(t){if(t&&t.__esModule)return t;var r={};if(t!=null)for(var i=e(t),o=0;o<i.length;o++)i[o]!=="default"&&__createBinding(r,t,i[o]);return __setModuleDefault(r,t),r}})(),__importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importStar(require("react")),react_native_1=require("react-native"),i18n_1=require("../i18n"),TreeNode_1=__importDefault(require("./TreeNode")),HighlightText_1=__importDefault(require("./HighlightText")),TouchableScale_1=__importDefault(require("./TouchableScale")),NetworkIcons_1=require("./NetworkIcons"),helpers_1=require("../helpers"),NativeInspector_1=require("../native/NativeInspector"),monoFont=react_native_1.Platform.select({ios:"Menlo",android:"monospace",default:"monospace"}),getTypeDetails=e=>e===null?{label:"null",color:"#E11D48",bg:"#FFF1F2",border:"#FECDD3"}:e===void 0?{label:"undef",color:"#E11D48",bg:"#FFF1F2",border:"#FECDD3"}:Array.isArray(e)?{label:`arr[${e.length}]`,color:"#2563EB",bg:"#EFF6FF",border:"#BFDBFE"}:typeof e=="object"?{label:`obj{${Object.keys(e).length}}`,color:"#7C3AED",bg:"#F5F3FF",border:"#DDD6FE"}:typeof e=="number"?{label:"num",color:"#D97706",bg:"#FEF3C7",border:"#FDE68A"}:typeof e=="boolean"?{label:"bool",color:"#DB2777",bg:"#FDF2F8",border:"#FBCFE8"}:{label:"str",color:"#059669",bg:"#ECFDF5",border:"#A7F3D0"},JsonTableRow=react_1.default.memo(({itemKey:e,val:t,search:r,index:i})=>{const[o,g]=(0,react_1.useState)(!1),f=t!==null&&typeof t=="object",d=getTypeDetails(t);let c="";if(t===null)c="null";else if(t===void 0)c="undefined";else if(f)try{c=JSON.stringify(t,null,2)}catch{c=String(t)}else c=String(t);const F=c.includes(`
-`)||c.length>80;return<react_native_1.View style={[localStyles.tableRow,i%2===1&&localStyles.tableRowAlt]}>
-      
-      <react_native_1.View style={localStyles.tableColKey}>
-        <HighlightText_1.default text={e}search={r}style={localStyles.tableCellKey}highlightStyle={localStyles.highlight}/>
-        <react_native_1.View style={[localStyles.typePill,{backgroundColor:d.bg,borderColor:d.border}]}>
-          <react_native_1.Text style={[localStyles.typePillText,{color:d.color}]}>
-            {d.label}
-          </react_native_1.Text>
-        </react_native_1.View>
-      </react_native_1.View>
-
-      
-      <react_native_1.View style={localStyles.tableColVal}>
-        <react_native_1.View style={f?localStyles.tableCodeBox:void 0}>
-          <HighlightText_1.default text={c}search={r}style={[localStyles.tableCellValue,t==null?localStyles.syntaxNull:void 0,typeof t=="number"?localStyles.syntaxNumber:void 0,typeof t=="boolean"?localStyles.syntaxBoolean:void 0,typeof t=="string"?localStyles.syntaxString:void 0]}highlightStyle={localStyles.highlight}numberOfLines={o?void 0:3}selectable={!0}/>
-        </react_native_1.View>
-        {F&&<react_native_1.TouchableOpacity onPress={()=>g(y=>!y)}hitSlop={6}style={localStyles.showMoreBtn}>
-            <react_native_1.Text style={localStyles.showMoreText}>
-              {o?"Collapse":"Expand"}
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(e,t,l,o){o===void 0&&(o=l);var r=Object.getOwnPropertyDescriptor(t,l);(!r||("get"in r?!t.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return t[l]}}),Object.defineProperty(e,o,r)}):(function(e,t,l,o){o===void 0&&(o=l),e[o]=t[l]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}):function(e,t){e.default=t}),__importStar=this&&this.__importStar||(function(){var e=function(t){return e=Object.getOwnPropertyNames||function(l){var o=[];for(var r in l)Object.prototype.hasOwnProperty.call(l,r)&&(o[o.length]=r);return o},e(t)};return function(t){if(t&&t.__esModule)return t;var l={};if(t!=null)for(var o=e(t),r=0;r<o.length;r++)o[r]!=="default"&&__createBinding(l,t,o[r]);return __setModuleDefault(l,t),l}})(),__importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importStar(require("react")),react_native_1=require("react-native"),i18n_1=require("../i18n"),TreeNode_1=__importDefault(require("./TreeNode")),HighlightText_1=__importDefault(require("./HighlightText")),TouchableScale_1=__importDefault(require("./TouchableScale")),NetworkIcons_1=require("./NetworkIcons"),AppColors_1=require("../styles/AppColors"),helpers_1=require("../helpers"),NativeInspector_1=require("../native/NativeInspector"),monoFont=react_native_1.Platform.select({ios:"Menlo",android:"monospace",default:"monospace"}),getTypeDetails=e=>e===null?{label:"null",color:AppColors_1.AppColors.errorColor,bg:AppColors_1.AppColors.errorCardBg,border:AppColors_1.AppColors.errorBorder}:e===void 0?{label:"undef",color:AppColors_1.AppColors.errorColor,bg:AppColors_1.AppColors.errorCardBg,border:AppColors_1.AppColors.errorBorder}:Array.isArray(e)?{label:`arr[${e.length}]`,color:AppColors_1.AppColors.blue600,bg:AppColors_1.AppColors.blueBg,border:AppColors_1.AppColors.sky100}:typeof e=="object"?{label:`obj{${Object.keys(e).length}}`,color:AppColors_1.AppColors.violet600,bg:AppColors_1.AppColors.purple50,border:AppColors_1.AppColors.purple200}:typeof e=="number"?{label:"num",color:AppColors_1.AppColors.amber600,bg:AppColors_1.AppColors.amber100,border:AppColors_1.AppColors.amber200}:typeof e=="boolean"?{label:"bool",color:AppColors_1.AppColors.pink600,bg:AppColors_1.AppColors.roseBg,border:AppColors_1.AppColors.roseBorder}:{label:"str",color:AppColors_1.AppColors.emerald600,bg:AppColors_1.AppColors.emeraldBg,border:AppColors_1.AppColors.emeraldBorder},RawValueText=react_1.default.memo(({text:e,search:t,detectLinks:l})=>{const o=e.trim();let r=localStyles.rawMonospaceText;return o.startsWith('"')?r=localStyles.syntaxString:o==="null"||o.startsWith("null,")||o==="undefined"?r=localStyles.syntaxNull:o==="true"||o.startsWith("true,")||o==="false"||o.startsWith("false,")?r=localStyles.syntaxBoolean:/^-?\d+(?:\.\d+)?(?:[eE][+-]?\d+)?,?$/.test(o)&&(r=localStyles.syntaxNumber),<HighlightText_1.default text={e}search={t}detectLinks={l}style={r}selectable={!0}highlightStyle={localStyles.highlight}/>}),RawJsonLine=react_1.default.memo(({line:e,search:t,detectLinks:l})=>{const o=e.match(/^(\s+)(.*)$/),r=o?o[1]:"",d=o?o[2]:e,u=r?r.replace(/  /g,"\xB7 ").replace(/ /g,"\xB7"):"",s=d.match(/^("(?:[^"\\]|\\.)*")(\s*:\s*)(.*)$/);if(s){const c=s[1],f=s[2],i=s[3];return<react_native_1.View style={localStyles.rawLineContentRow}>
+          {u.length>0&&<react_native_1.Text style={localStyles.indentDots}>{u}</react_native_1.Text>}
+          <HighlightText_1.default text={c}search={t}style={localStyles.syntaxKey}selectable={!0}highlightStyle={localStyles.highlight}/>
+          <react_native_1.Text style={localStyles.syntaxColon}>{f}</react_native_1.Text>
+          <RawValueText text={i}search={t}detectLinks={l}/>
+        </react_native_1.View>}return<react_native_1.View style={localStyles.rawLineContentRow}>
+        {u.length>0&&<react_native_1.Text style={localStyles.indentDots}>{u}</react_native_1.Text>}
+        <RawValueText text={d}search={t}detectLinks={l}/>
+      </react_native_1.View>}),JsonTableRow=react_1.default.memo(({itemKey:e,val:t,search:l,index:o})=>{const[r,d]=(0,react_1.useState)(!1),u=t!==null&&typeof t=="object",s=getTypeDetails(t);let c="";if(t===null)c="null";else if(t===void 0)c="undefined";else if(u)try{c=JSON.stringify(t,null,2)}catch{c=String(t)}else c=String(t);const f=c.includes(`
+`)||c.length>80;return<react_native_1.View style={[localStyles.tableRow,o%2===1&&localStyles.tableRowAlt]}>
+        
+        <react_native_1.View style={localStyles.tableColKey}>
+          <HighlightText_1.default text={e}search={l}style={localStyles.tableCellKey}highlightStyle={localStyles.highlight}/>
+          <react_native_1.View style={[localStyles.typePill,{backgroundColor:s.bg,borderColor:s.border}]}>
+            <react_native_1.Text style={[localStyles.typePillText,{color:s.color}]}>
+              {s.label}
             </react_native_1.Text>
-            <NetworkIcons_1.ChevronIcon direction={o?"up":"down"}size={9}color="#4F46E5"/>
-          </react_native_1.TouchableOpacity>}
-      </react_native_1.View>
-    </react_native_1.View>}),JsonViewer=react_1.default.memo(({data:e,search:t,forceOpen:r,defaultExpandDepth:i=1,wrap:o,fullHeight:g=!1,maxHeight:f,mode:d,onModeChange:c,hideTabs:F=!1})=>{const{t:y}=(0,i18n_1.useTranslation)(),[A,B]=(0,react_1.useState)(d??"raw"),[E,D]=(0,react_1.useState)(!1),[b,O]=(0,react_1.useState)(o??!1),[T,z]=(0,react_1.useState)(r),a=c&&d?d:A,x=n=>{B(n),c&&c(n)};(0,react_1.useEffect)(()=>{o!==void 0&&O(o)},[o]),(0,react_1.useEffect)(()=>{r!==void 0&&z(r)},[r]);const R=(0,react_1.useMemo)(()=>{if(e==null)return"";if(typeof e=="string")return e;try{return JSON.stringify(e,null,2)??""}catch{return String(e)||""}},[e]),u=(0,react_1.useMemo)(()=>{if(typeof e=="string")return e;try{return JSON.stringify(e)??""}catch{return String(e)||""}},[e]),H=u,[P,k]=(0,react_1.useState)(!1),I=5e4,V=typeof u=="string"?u:"",C=V.length>I&&!P,S=C?V.slice(0,I):V,K=typeof R=="string"?R:"",h=(0,react_1.useMemo)(()=>S?S.split(`
-`):[""],[S]),W=h.length,N=(0,react_1.useMemo)(()=>(0,helpers_1.getSize)(e),[e]);(0,react_1.useEffect)(()=>{d&&B(d)},[d]);const M=()=>{(0,NativeInspector_1.triggerNativeHaptic)("success"),(0,helpers_1.copyToClipboard)(H||u,"JSON"),D(!0),setTimeout(()=>D(!1),1200)},m=typeof e=="object"&&e!==null,L=e==null||m&&Object.keys(e).length===0,j=()=>{if(!m)return<react_native_1.View style={localStyles.tableRow}>
-          <react_native_1.View style={localStyles.tableColKey}>
-            <react_native_1.Text style={localStyles.tableCellKey}>{y("network.jsonViewer.value")}</react_native_1.Text>
-          </react_native_1.View>
-          <react_native_1.View style={localStyles.tableColVal}>
-            <react_native_1.Text style={localStyles.tableCellValue}>{String(e)}</react_native_1.Text>
           </react_native_1.View>
-        </react_native_1.View>;let n=Object.keys(e);if(t&&t.trim().length>0){const l=t.trim().toLowerCase();n=n.filter(s=>{const p=e[s],w=typeof p=="object"&&p!==null?JSON.stringify(p):String(p);return s.toLowerCase().includes(l)||w.toLowerCase().includes(l)})}return n.length===0?<react_native_1.View style={localStyles.emptyContainer}>
-          <react_native_1.Text style={localStyles.emptyText}>
-            {t&&t.trim().length>0?"No matching keys or values found":y("network.jsonViewer.emptyTable")}
-          </react_native_1.Text>
-        </react_native_1.View>:<react_native_1.View style={localStyles.tableView}>
-        
-        <react_native_1.View style={localStyles.tableHeaderRow}>
-          <react_native_1.Text style={[localStyles.tableHeaderCell,{flex:2}]}>KEY / PROPERTY</react_native_1.Text>
-          <react_native_1.Text style={[localStyles.tableHeaderCell,{flex:3}]}>VALUE</react_native_1.Text>
         </react_native_1.View>
-        {n.map((l,s)=><JsonTableRow key={l}index={s}itemKey={l}val={e[l]}search={t}/>)}
-      </react_native_1.View>},_=<TreeNode_1.default data={e}search={t}forceOpen={T}defaultExpandDepth={T?99:i}/>;return<react_native_1.View style={[localStyles.container,g&&{flex:1}]}>
-      
-      <react_native_1.View style={localStyles.snippetHeader}>
+
         
-        <react_native_1.View style={localStyles.headerLeft}>
-          <react_native_1.View style={localStyles.langBadge}>
-            <react_native_1.Text style={localStyles.langBadgeText}>JSON</react_native_1.Text>
+        <react_native_1.View style={localStyles.tableColVal}>
+          <react_native_1.View style={u?localStyles.tableCodeBox:void 0}>
+            <HighlightText_1.default text={c}search={l}style={[localStyles.tableCellValue,t==null?localStyles.syntaxNull:void 0,typeof t=="number"?localStyles.syntaxNumber:void 0,typeof t=="boolean"?localStyles.syntaxBoolean:void 0,typeof t=="string"?localStyles.syntaxString:void 0]}highlightStyle={localStyles.highlight}numberOfLines={r?void 0:3}selectable={!0}/>
           </react_native_1.View>
-          <react_native_1.View style={localStyles.metaBadge}>
-            <react_native_1.Text style={localStyles.metaBadgeText}numberOfLines={1}ellipsizeMode="tail">
-              {W} {W===1?"line":"lines"} · {N}
+          {f&&<react_native_1.TouchableOpacity onPress={()=>d(i=>!i)}hitSlop={6}style={localStyles.showMoreBtn}>
+              <react_native_1.Text style={localStyles.showMoreText}>
+                {r?"Collapse":"Expand"}
+              </react_native_1.Text>
+              <NetworkIcons_1.ChevronIcon direction={r?"up":"down"}size={9}color="#4F46E5"/>
+            </react_native_1.TouchableOpacity>}
+        </react_native_1.View>
+      </react_native_1.View>}),JsonViewer=react_1.default.memo(({data:e,search:t,forceOpen:l,defaultExpandDepth:o=1,wrap:r,fullHeight:d=!1,maxHeight:u,mode:s,onModeChange:c,hideTabs:f=!1})=>{const{t:i}=(0,i18n_1.useTranslation)(),[D,k]=(0,react_1.useState)(s??"pretty"),[F,z]=(0,react_1.useState)(!1),[w,R]=(0,react_1.useState)(r??!0),[g,M]=(0,react_1.useState)("compact"),[b,W]=(0,react_1.useState)(l),[E,L]=(0,react_1.useState)(!1),a=c&&s?s:D,A=n=>{k(n),c&&c(n)};(0,react_1.useEffect)(()=>{r!==void 0&&R(r)},[r]),(0,react_1.useEffect)(()=>{l!==void 0&&W(l)},[l]),(0,react_1.useEffect)(()=>{s&&k(s)},[s]);const y=(0,react_1.useMemo)(()=>{if(e==null)return"";if(typeof e=="string"){const n=e.trim();try{const p=JSON.parse(n);return JSON.stringify(p,null,2)}catch{return e}}try{return JSON.stringify(e,null,2)??""}catch{return String(e)||""}},[e]),S=(0,react_1.useMemo)(()=>{if(typeof e=="string"){const n=e.trim();try{const p=JSON.parse(n);return JSON.stringify(p)}catch{return e}}try{return JSON.stringify(e)??""}catch{return String(e)||""}},[e]),H=g==="formatted"?y:S,I=5e4,C=typeof H=="string"?H:"",j=C.length>I&&!E,V=j?C.slice(0,I):C,v=(0,react_1.useMemo)(()=>V?V.split(`
+`):[""],[V]),O=(0,react_1.useMemo)(()=>a==="raw"?v.length:y?y.split(`
+`).length:1,[a,v.length,y]),K=(0,react_1.useMemo)(()=>(0,helpers_1.getSize)(e),[e]),J=(0,react_1.useCallback)(()=>{(0,NativeInspector_1.triggerNativeHaptic)("success"),(0,helpers_1.copyToClipboard)(g==="compact"?S:y,"JSON"),z(!0),setTimeout(()=>z(!1),1200)},[g,S,y]),B=typeof e=="object"&&e!==null,$=e==null||B&&Object.keys(e).length===0,P=()=>{if(!B)return<react_native_1.View style={localStyles.tableRow}>
+            <react_native_1.View style={localStyles.tableColKey}>
+              <react_native_1.Text style={localStyles.tableCellKey}>
+                {i("network.jsonViewer.value")}
+              </react_native_1.Text>
+            </react_native_1.View>
+            <react_native_1.View style={localStyles.tableColVal}>
+              <react_native_1.Text style={localStyles.tableCellValue}>{String(e)}</react_native_1.Text>
+            </react_native_1.View>
+          </react_native_1.View>;let n=Object.keys(e);if(t&&t.trim().length>0){const p=t.trim().toLowerCase();n=n.filter(T=>{const m=e[T],q=typeof m=="object"&&m!==null?JSON.stringify(m):String(m);return T.toLowerCase().includes(p)||q.toLowerCase().includes(p)})}return n.length===0?<react_native_1.View style={localStyles.emptyContainer}>
+            <react_native_1.Text style={localStyles.emptyText}>
+              {t&&t.trim().length>0?"No matching keys or values found":i("network.jsonViewer.emptyTable")}
+            </react_native_1.Text>
+          </react_native_1.View>:<react_native_1.View style={localStyles.tableView}>
+          
+          <react_native_1.View style={localStyles.tableHeaderRow}>
+            <react_native_1.Text style={[localStyles.tableHeaderCell,{flex:2}]}>
+              KEY / PROPERTY
             </react_native_1.Text>
+            <react_native_1.Text style={[localStyles.tableHeaderCell,{flex:3}]}>VALUE</react_native_1.Text>
           </react_native_1.View>
-        </react_native_1.View>
-
-        
-        <react_native_1.View style={localStyles.headerRight}>
-          {!F&&<react_native_1.View style={localStyles.snippetTabs}>
-              <react_native_1.TouchableOpacity onPress={()=>x("pretty")}activeOpacity={.7}hitSlop={{top:8,bottom:8,left:4,right:4}}style={[localStyles.snippetTabBtn,a==="pretty"&&localStyles.snippetTabBtnActive]}>
-                <NetworkIcons_1.PrettyIcon color={a==="pretty"?"#FFFFFF":"#64748B"}size={11}/>
-                <react_native_1.Text style={[localStyles.snippetTabText,a==="pretty"&&localStyles.snippetTabTextActive]}>
-                  {y("network.jsonViewer.pretty")}
-                </react_native_1.Text>
-              </react_native_1.TouchableOpacity>
-
-              <react_native_1.TouchableOpacity onPress={()=>x("raw")}activeOpacity={.7}hitSlop={{top:8,bottom:8,left:4,right:4}}style={[localStyles.snippetTabBtn,a==="raw"&&localStyles.snippetTabBtnActive]}>
-                <NetworkIcons_1.RawIcon color={a==="raw"?"#FFFFFF":"#64748B"}size={11}/>
-                <react_native_1.Text style={[localStyles.snippetTabText,a==="raw"&&localStyles.snippetTabTextActive]}>
-                  {y("network.jsonViewer.raw")}
+          {n.map((p,T)=><JsonTableRow key={p}index={T}itemKey={p}val={e[p]}search={t}/>)}
+        </react_native_1.View>},_=<TreeNode_1.default data={e}search={t}forceOpen={b}defaultExpandDepth={b?99:o}/>,x=()=><react_native_1.View style={localStyles.rawLinesWrapper}>
+          {v.map((n,p)=><react_native_1.View key={p}style={localStyles.rawCodeLineRow}>
+              
+              <react_native_1.View style={localStyles.gutterCell}>
+                <react_native_1.Text style={localStyles.gutterNumber}selectable={!1}>
+                  {p+1}
                 </react_native_1.Text>
-              </react_native_1.TouchableOpacity>
-
-              <react_native_1.TouchableOpacity onPress={()=>x("table")}activeOpacity={.7}hitSlop={{top:8,bottom:8,left:4,right:4}}style={[localStyles.snippetTabBtn,a==="table"&&localStyles.snippetTabBtnActive]}>
-                <NetworkIcons_1.TableIcon color={a==="table"?"#FFFFFF":"#64748B"}size={11}/>
-                <react_native_1.Text style={[localStyles.snippetTabText,a==="table"&&localStyles.snippetTabTextActive]}>
-                  {y("network.jsonViewer.table")}
-                </react_native_1.Text>
-              </react_native_1.TouchableOpacity>
-            </react_native_1.View>}
+              </react_native_1.View>
 
+              
+              <react_native_1.View style={localStyles.rawTextCell}>
+                <RawJsonLine line={n}search={t}detectLinks={C.length<2e4}/>
+              </react_native_1.View>
+            </react_native_1.View>)}
+        </react_native_1.View>,N=()=>j?<react_native_1.TouchableOpacity onPress={()=>L(!0)}activeOpacity={.8}style={localStyles.truncationBanner}>
+          <react_native_1.Text style={localStyles.truncationText}>
+            Showing first 50 KB ({Math.round(C.length/1024)} KB
+            total) · Tap to load full payload
+          </react_native_1.Text>
+        </react_native_1.TouchableOpacity>:null,h=(0,react_1.useMemo)(()=>Array.isArray(e)?{label:`ARRAY [${e.length}]`,color:AppColors_1.AppColors.blue600,bg:`${AppColors_1.AppColors.blue600}12`,border:`${AppColors_1.AppColors.blue600}30`}:e&&typeof e=="object"?{label:`OBJECT {${Object.keys(e).length}}`,color:AppColors_1.AppColors.violet600,bg:`${AppColors_1.AppColors.violet600}12`,border:`${AppColors_1.AppColors.violet600}30`}:{label:"JSON",color:AppColors_1.AppColors.slate700,bg:`${AppColors_1.AppColors.slate700}10`,border:`${AppColors_1.AppColors.slate700}25`},[e]);return<react_native_1.View style={[localStyles.container,d&&{flex:1}]}>
+        
+        <react_native_1.View style={localStyles.snippetHeader}>
           
-          {a==="pretty"&&m&&<react_native_1.TouchableOpacity onPress={()=>z(n=>!n)}hitSlop={{top:6,bottom:6,left:4,right:4}}style={localStyles.toolToggleBtn}>
-              <react_native_1.Text style={localStyles.toolToggleText}>
-                {T?"Fold":"Expand"}
+          <react_native_1.View style={localStyles.headerLeft}>
+            <react_native_1.View style={[localStyles.langBadge,{backgroundColor:h.bg,borderColor:h.border}]}>
+              <react_native_1.View style={[localStyles.langDot,{backgroundColor:h.color}]}/>
+              <react_native_1.Text style={[localStyles.langBadgeText,{color:h.color}]}>
+                {h.label}
               </react_native_1.Text>
-            </react_native_1.TouchableOpacity>}
-
-          
-          {a==="raw"&&<react_native_1.TouchableOpacity onPress={()=>O(n=>!n)}hitSlop={{top:6,bottom:6,left:4,right:4}}style={[localStyles.toolToggleBtn,b&&localStyles.toolToggleBtnActive]}>
-              <react_native_1.Text style={[localStyles.toolToggleText,b&&localStyles.toolToggleTextActive]}>
-                Wrap
+            </react_native_1.View>
+            <react_native_1.View style={localStyles.metaBadge}>
+              <react_native_1.Text style={localStyles.metaBadgeText}numberOfLines={1}ellipsizeMode="tail">
+                {K} · {O} {O===1?i("jsonViewer.line","line"):i("jsonViewer.lines","lines")}
               </react_native_1.Text>
-            </react_native_1.TouchableOpacity>}
+            </react_native_1.View>
+          </react_native_1.View>
 
           
-          <TouchableScale_1.default onPress={M}hitSlop={8}style={[localStyles.copyBtn,E&&localStyles.copyBtnSuccess]}>
-            {E?<NetworkIcons_1.CheckIcon color="#10B981"size={13}/>:<NetworkIcons_1.CopyIcon color="#64748B"size={13}/>}
-          </TouchableScale_1.default>
-        </react_native_1.View>
-      </react_native_1.View>
-      
-      <react_native_1.View style={[localStyles.editorBody,g&&{flex:1,maxHeight:void 0},!g&&f!=null&&{maxHeight:f}]}>
-        
-        {a==="pretty"&&(L?<react_native_1.View style={localStyles.emptyContainer}>
-              <react_native_1.Text style={localStyles.emptyText}>
-                {y("network.jsonViewer.emptyPayload")}
-              </react_native_1.Text>
-            </react_native_1.View>:b?g?<react_native_1.ScrollView style={{flex:1}}contentContainerStyle={localStyles.prettyContainer}>
-                {_}
-              </react_native_1.ScrollView>:<react_native_1.View style={localStyles.prettyContainer}>{_}</react_native_1.View>:g?<react_native_1.ScrollView style={{flex:1}}contentContainerStyle={{flexGrow:1}}>
-              <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={!0}contentContainerStyle={localStyles.prettyContainer}>
-                {_}
-              </react_native_1.ScrollView>
-            </react_native_1.ScrollView>:<react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={!0}contentContainerStyle={localStyles.prettyContainer}>
-              {_}
-            </react_native_1.ScrollView>)}
-
-        
-        {a==="raw"&&(g?<react_native_1.ScrollView style={{flex:1}}contentContainerStyle={{flexGrow:1}}showsVerticalScrollIndicator={!0}>
-              <react_native_1.View style={localStyles.rawEditorRow}>
-                
-                <react_native_1.View style={localStyles.gutter}>
-                  {h.map((n,l)=><react_native_1.Text key={l}style={localStyles.gutterNumber}>
-                      {l+1}
-                    </react_native_1.Text>)}
-                </react_native_1.View>
+          <react_native_1.View style={localStyles.headerRight}>
+            {!f&&<react_native_1.View style={localStyles.snippetTabs}>
+                <TouchableScale_1.default onPress={()=>A("pretty")}style={[localStyles.snippetTabBtn,a==="pretty"&&[localStyles.snippetTabBtnActive,{backgroundColor:AppColors_1.AppColors.brandPurple,shadowColor:AppColors_1.AppColors.brandPurple}]]}>
+                  <NetworkIcons_1.PrettyIcon color={a==="pretty"?AppColors_1.AppColors.white:AppColors_1.AppColors.grayTextWeak}size={11}/>
+                  <react_native_1.Text style={[localStyles.snippetTabText,a==="pretty"&&localStyles.snippetTabTextActive]}>
+                    {i("network.jsonViewer.pretty","Pretty")}
+                  </react_native_1.Text>
+                </TouchableScale_1.default>
 
-                
-                <react_native_1.ScrollView horizontal={!b}showsHorizontalScrollIndicator={!0}style={{flex:1}}>
-                  <react_native_1.View style={localStyles.rawTextContainer}>
-                    {h.map((n,l)=>{const s=n.match(/^(\s+)(.*)$/);if(s){const p=s[1],w=s[2],v=p.replace(/  /g,"\xB7 ").replace(/ /g,"\xB7");return<react_native_1.View key={l}style={localStyles.rawCodeLineRow}>
-                            <react_native_1.Text style={localStyles.indentDots}>{v}</react_native_1.Text>
-                            <HighlightText_1.default text={w}search={t}detectLinks={u.length<2e4}style={localStyles.rawMonospaceText}selectable={!0}highlightStyle={localStyles.highlight}/>
-                          </react_native_1.View>}return<react_native_1.View key={l}style={localStyles.rawCodeLineRow}>
-                          <HighlightText_1.default text={n}search={t}detectLinks={u.length<2e4}style={localStyles.rawMonospaceText}selectable={!0}highlightStyle={localStyles.highlight}/>
-                        </react_native_1.View>})}
-                  </react_native_1.View>
-                </react_native_1.ScrollView>
-              </react_native_1.View>
+                <TouchableScale_1.default onPress={()=>A("raw")}style={[localStyles.snippetTabBtn,a==="raw"&&[localStyles.snippetTabBtnActive,{backgroundColor:AppColors_1.AppColors.sky600,shadowColor:AppColors_1.AppColors.sky600}]]}>
+                  <NetworkIcons_1.RawIcon color={a==="raw"?AppColors_1.AppColors.white:AppColors_1.AppColors.grayTextWeak}size={11}/>
+                  <react_native_1.Text style={[localStyles.snippetTabText,a==="raw"&&localStyles.snippetTabTextActive]}>
+                    {i("network.jsonViewer.raw","Raw")}
+                  </react_native_1.Text>
+                </TouchableScale_1.default>
 
-              {C&&<react_native_1.TouchableOpacity onPress={()=>k(!0)}style={localStyles.truncationBanner}>
-                  <react_native_1.Text style={localStyles.truncationText}>
-                    Showing first 50 KB ({Math.round(u.length/1024)} KB total) · Tap to load full payload
+                <TouchableScale_1.default onPress={()=>A("table")}style={[localStyles.snippetTabBtn,a==="table"&&[localStyles.snippetTabBtnActive,{backgroundColor:AppColors_1.AppColors.teal600,shadowColor:AppColors_1.AppColors.teal600}]]}>
+                  <NetworkIcons_1.TableIcon color={a==="table"?AppColors_1.AppColors.white:AppColors_1.AppColors.grayTextWeak}size={11}/>
+                  <react_native_1.Text style={[localStyles.snippetTabText,a==="table"&&localStyles.snippetTabTextActive]}>
+                    {i("network.jsonViewer.table","Table")}
                   </react_native_1.Text>
-                </react_native_1.TouchableOpacity>}
-            </react_native_1.ScrollView>:<react_native_1.View>
-              <react_native_1.View style={localStyles.rawEditorRow}>
-                
-                <react_native_1.View style={localStyles.gutter}>
-                  {h.map((n,l)=><react_native_1.Text key={l}style={localStyles.gutterNumber}>
-                      {l+1}
-                    </react_native_1.Text>)}
-                </react_native_1.View>
+                </TouchableScale_1.default>
+              </react_native_1.View>}
 
-                
-                <react_native_1.ScrollView horizontal={!b}showsHorizontalScrollIndicator={!0}style={{flex:1}}>
-                  <react_native_1.View style={localStyles.rawTextContainer}>
-                    {h.map((n,l)=>{const s=n.match(/^(\s+)(.*)$/);if(s){const p=s[1],w=s[2],v=p.replace(/  /g,"\xB7 ").replace(/ /g,"\xB7");return<react_native_1.View key={l}style={localStyles.rawCodeLineRow}>
-                            <react_native_1.Text style={localStyles.indentDots}>{v}</react_native_1.Text>
-                            <HighlightText_1.default text={w}search={t}detectLinks={u.length<2e4}style={localStyles.rawMonospaceText}selectable={!0}highlightStyle={localStyles.highlight}/>
-                          </react_native_1.View>}return<react_native_1.View key={l}style={localStyles.rawCodeLineRow}>
-                          <HighlightText_1.default text={n}search={t}detectLinks={u.length<2e4}style={localStyles.rawMonospaceText}selectable={!0}highlightStyle={localStyles.highlight}/>
-                        </react_native_1.View>})}
-                  </react_native_1.View>
-                </react_native_1.ScrollView>
-              </react_native_1.View>
+            
+            {a==="pretty"&&B&&<TouchableScale_1.default onPress={()=>W(n=>!n)}style={[localStyles.toolToggleBtn,b&&localStyles.toolToggleBtnActive]}>
+                <react_native_1.Text style={[localStyles.toolToggleText,b&&localStyles.toolToggleTextActive]}>
+                  {b?i("jsonViewer.fold","Fold"):i("jsonViewer.expand","Expand")}
+                </react_native_1.Text>
+              </TouchableScale_1.default>}
 
-              {C&&<react_native_1.TouchableOpacity onPress={()=>k(!0)}style={localStyles.truncationBanner}>
-                  <react_native_1.Text style={localStyles.truncationText}>
-                    Showing first 50 KB ({Math.round(u.length/1024)} KB total) · Tap to load full payload
-                  </react_native_1.Text>
-                </react_native_1.TouchableOpacity>}
-            </react_native_1.View>)}
+            
+            {a==="raw"&&<TouchableScale_1.default onPress={()=>M(n=>n==="compact"?"formatted":"compact")}style={[localStyles.toolToggleBtn,g==="compact"&&localStyles.toolToggleBtnActive]}>
+                <react_native_1.Text style={[localStyles.toolToggleText,g==="compact"&&localStyles.toolToggleTextActive]}>
+                  {g==="compact"?i("jsonViewer.min","Min"):i("jsonViewer.indent","Indent")}
+                </react_native_1.Text>
+              </TouchableScale_1.default>}
+
+            
+            {a==="raw"&&<TouchableScale_1.default onPress={()=>R(n=>!n)}style={[localStyles.toolToggleBtn,w&&localStyles.toolToggleBtnActive]}>
+                <react_native_1.Text style={[localStyles.toolToggleText,w&&localStyles.toolToggleTextActive]}>
+                  {i("jsonViewer.wrap","Wrap")}
+                </react_native_1.Text>
+              </TouchableScale_1.default>}
+
+            
+            <TouchableScale_1.default onPress={J}hitSlop={6}style={[localStyles.copyBtn,F&&localStyles.copyBtnSuccess]}>
+              {F?<NetworkIcons_1.CheckIcon color={AppColors_1.AppColors.emerald500}size={12}/>:<NetworkIcons_1.CopyIcon color={AppColors_1.AppColors.grayTextWeak}size={12}/>}
+            </TouchableScale_1.default>
+          </react_native_1.View>
+        </react_native_1.View>
 
         
-        {a==="table"&&(g?<react_native_1.ScrollView style={{flex:1}}>
-              {j()}
-            </react_native_1.ScrollView>:<react_native_1.View style={localStyles.tableView}>
-              {j()}
-            </react_native_1.View>)}
-      </react_native_1.View>
-    </react_native_1.View>}),localStyles=react_native_1.StyleSheet.create({container:{backgroundColor:"#FFFFFF",borderRadius:12,borderWidth:1.5,borderColor:"#E2E8F0",overflow:"hidden",shadowColor:"#4F46E5",shadowOpacity:.05,shadowRadius:6,shadowOffset:{width:0,height:2},elevation:2,width:"100%"},snippetHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",backgroundColor:"#F1F5F9",borderBottomWidth:1,borderBottomColor:"#E2E8F0",paddingHorizontal:8,paddingVertical:6,gap:6},headerLeft:{flexDirection:"row",alignItems:"center",gap:5,flexShrink:1,minWidth:0},langBadge:{backgroundColor:"#FFFFFF",borderRadius:4,borderWidth:1,borderColor:"#CBD5E1",paddingHorizontal:5,paddingVertical:2},langBadgeText:{fontFamily:monoFont,fontSize:9.5,color:"#475569",fontWeight:"700",letterSpacing:.4},metaBadge:{backgroundColor:"#FFFFFF",borderRadius:4,borderWidth:1,borderColor:"#CBD5E1",paddingHorizontal:5,paddingVertical:2,flexShrink:1},metaBadgeText:{fontFamily:monoFont,fontSize:9.5,color:"#64748B",fontWeight:"600"},metaStats:{fontFamily:monoFont,fontSize:9.5,color:"#64748B",flexShrink:1},headerRight:{flexDirection:"row",alignItems:"center",gap:5},snippetTabs:{flexDirection:"row",alignItems:"center",backgroundColor:"#E2E8F0",borderRadius:6,padding:2,borderWidth:1,borderColor:"#CBD5E1",gap:2},snippetTabBtn:{flexDirection:"row",alignItems:"center",gap:3.5,paddingVertical:2.5,paddingHorizontal:6,borderRadius:4},snippetTabBtnActive:{backgroundColor:"#4F46E5",shadowColor:"#4F46E5",shadowOffset:{width:0,height:1},shadowOpacity:.2,shadowRadius:2,elevation:1},snippetTabText:{fontFamily:monoFont,fontSize:9.5,color:"#64748B",fontWeight:"600"},snippetTabTextActive:{color:"#FFFFFF",fontWeight:"700"},toolToggleBtn:{paddingHorizontal:6,paddingVertical:2.5,borderRadius:5,backgroundColor:"#FFFFFF",borderWidth:1,borderColor:"#CBD5E1",alignItems:"center",justifyContent:"center"},toolToggleBtnActive:{backgroundColor:"#EEF2FF",borderColor:"#C7D2FE"},toolToggleText:{fontFamily:monoFont,fontSize:9.5,color:"#64748B",fontWeight:"600"},toolToggleTextActive:{color:"#4F46E5",fontWeight:"700"},copyBtn:{width:24,height:24,borderRadius:5,backgroundColor:"#FFFFFF",borderWidth:1,borderColor:"#CBD5E1",alignItems:"center",justifyContent:"center"},copyBtnSuccess:{borderColor:"#10B981",backgroundColor:"#ECFDF5"},editorBody:{backgroundColor:"#FFFFFF",minHeight:100},prettyContainer:{padding:12,minWidth:"100%",backgroundColor:"#FFFFFF"},rawEditorRow:{flexDirection:"row",alignItems:"stretch",minHeight:100},gutter:{backgroundColor:"#F1F5F9",borderRightWidth:1,borderRightColor:"#E2E8F0",paddingVertical:10,paddingHorizontal:8,alignItems:"flex-end",userSelect:"none"},gutterNumber:{fontFamily:monoFont,fontSize:11.5,height:18,lineHeight:18,color:"#94A3B8",textAlign:"right"},rawTextContainer:{paddingVertical:10,paddingHorizontal:12,backgroundColor:"#FFFFFF"},rawCodeLineRow:{flexDirection:"row",alignItems:"center",height:18},indentDots:{fontFamily:monoFont,fontSize:11.5,lineHeight:18,color:"#CBD5E1",letterSpacing:.5},rawMonospaceText:{fontFamily:monoFont,fontSize:11.5,lineHeight:18,color:"#0F172A"},truncationBanner:{margin:10,backgroundColor:"#EEF2FF",paddingVertical:8,paddingHorizontal:12,borderRadius:6,alignItems:"center",borderWidth:1,borderColor:"#C7D2FE"},truncationText:{fontFamily:monoFont,fontSize:10.5,color:"#4F46E5",fontWeight:"600"},tableView:{flex:1},tableHeaderRow:{flexDirection:"row",backgroundColor:"#F1F5F9",borderBottomWidth:1,borderBottomColor:"#E2E8F0",paddingVertical:7,paddingHorizontal:12},tableHeaderCell:{fontFamily:monoFont,fontSize:10,color:"#475569",fontWeight:"700",letterSpacing:.5},tableRow:{flexDirection:"row",borderBottomWidth:1,borderBottomColor:"#F1F5F9",paddingVertical:8,paddingHorizontal:12,alignItems:"flex-start",backgroundColor:"#FFFFFF"},tableRowAlt:{backgroundColor:"#F8FAFC"},tableColKey:{flex:2,paddingRight:8},tableColVal:{flex:3},tableCellKey:{fontFamily:monoFont,fontSize:11.5,fontWeight:"700",color:"#4F46E5"},typePill:{alignSelf:"flex-start",borderRadius:4,borderWidth:1,paddingHorizontal:4,paddingVertical:1,marginTop:3},typePillText:{fontFamily:monoFont,fontSize:9,fontWeight:"700"},tableCellValue:{fontFamily:monoFont,fontSize:11.5,color:"#0F172A",lineHeight:17},tableCodeBox:{backgroundColor:"#F1F5F9",borderRadius:6,borderWidth:1,borderColor:"#E2E8F0",padding:6},showMoreBtn:{flexDirection:"row",alignItems:"center",gap:4,alignSelf:"flex-start",marginTop:4,paddingVertical:2,paddingHorizontal:4},showMoreText:{fontFamily:monoFont,fontSize:10,color:"#4F46E5",fontWeight:"600"},emptyContainer:{padding:24,alignItems:"center",justifyContent:"center"},emptyText:{fontFamily:monoFont,fontSize:11.5,color:"#64748B"},highlight:{backgroundColor:"#FEF08A",color:"#854D0E",fontFamily:monoFont,fontWeight:"700",borderRadius:2,paddingHorizontal:2},syntaxNull:{color:"#E11D48",fontStyle:"italic"},syntaxNumber:{color:"#D97706"},syntaxBoolean:{color:"#DB2777"},syntaxString:{color:"#059669"}});exports.default=JsonViewer;
+        <react_native_1.View style={[localStyles.editorBody,d&&{flex:1,maxHeight:void 0},!d&&u!=null&&{maxHeight:u}]}>
+          
+          {a==="pretty"&&($?<react_native_1.View style={localStyles.emptyContainer}>
+                <react_native_1.Text style={localStyles.emptyText}>
+                  {i("network.jsonViewer.emptyPayload")}
+                </react_native_1.Text>
+              </react_native_1.View>:w?d?<react_native_1.ScrollView style={{flex:1}}contentContainerStyle={localStyles.prettyContainer}showsVerticalScrollIndicator={!0}>
+                  {_}
+                </react_native_1.ScrollView>:<react_native_1.View style={localStyles.prettyContainer}>{_}</react_native_1.View>:d?<react_native_1.ScrollView style={{flex:1}}contentContainerStyle={{flexGrow:1}}showsVerticalScrollIndicator={!0}>
+                <react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={!0}contentContainerStyle={localStyles.prettyContainer}>
+                  {_}
+                </react_native_1.ScrollView>
+              </react_native_1.ScrollView>:<react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={!0}contentContainerStyle={localStyles.prettyContainer}>
+                {_}
+              </react_native_1.ScrollView>)}
+
+          
+          {a==="raw"&&(d?<react_native_1.ScrollView style={localStyles.fullHeightScrollView}contentContainerStyle={localStyles.fullHeightScrollContent}showsVerticalScrollIndicator={!0}showsHorizontalScrollIndicator={!1}>
+                {w?<react_native_1.View style={localStyles.rawEditorFullWidth}>
+                    {x()}
+                  </react_native_1.View>:<react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={!0}contentContainerStyle={localStyles.rawHorizontalContent}>
+                    <react_native_1.View style={{flexDirection:"column"}}>
+                      {x()}
+                    </react_native_1.View>
+                  </react_native_1.ScrollView>}
+                {N()}
+              </react_native_1.ScrollView>:<react_native_1.View style={localStyles.rawEditorAutoHeight}>
+                {w?<react_native_1.View style={localStyles.rawEditorFullWidth}>
+                    {x()}
+                  </react_native_1.View>:<react_native_1.ScrollView horizontal showsHorizontalScrollIndicator={!0}contentContainerStyle={localStyles.rawHorizontalContent}>
+                    <react_native_1.View style={{flexDirection:"column"}}>
+                      {x()}
+                    </react_native_1.View>
+                  </react_native_1.ScrollView>}
+                {N()}
+              </react_native_1.View>)}
+
+          
+          {a==="table"&&(d?<react_native_1.ScrollView style={{flex:1}}contentContainerStyle={{flexGrow:1}}showsVerticalScrollIndicator={!0}>
+                {P()}
+              </react_native_1.ScrollView>:<react_native_1.View style={localStyles.tableView}>{P()}</react_native_1.View>)}
+        </react_native_1.View>
+      </react_native_1.View>}),localStyles=react_native_1.StyleSheet.create({container:{backgroundColor:AppColors_1.AppColors.white,borderRadius:12,borderWidth:1,borderColor:AppColors_1.AppColors.grayBorderSecondary,overflow:"hidden",shadowColor:AppColors_1.AppColors.brandPurple,shadowOpacity:.04,shadowRadius:6,shadowOffset:{width:0,height:2},elevation:2,width:"100%"},snippetHeader:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",backgroundColor:AppColors_1.AppColors.grayBackground,borderBottomWidth:1,borderBottomColor:AppColors_1.AppColors.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:AppColors_1.AppColors.white,borderRadius:6,borderWidth:1,borderColor:AppColors_1.AppColors.grayBorderSecondary,paddingHorizontal:6,paddingVertical:2.5,gap:4.5},langDot:{width:5,height:5,borderRadius:2.5,backgroundColor:AppColors_1.AppColors.emerald500},langBadgeText:{fontFamily:monoFont,fontSize:9.5,color:AppColors_1.AppColors.primaryBlack,fontWeight:"700",letterSpacing:.3},metaBadge:{backgroundColor:AppColors_1.AppColors.white,borderRadius:6,borderWidth:1,borderColor:AppColors_1.AppColors.grayBorderSecondary,paddingHorizontal:6,paddingVertical:2.5,flexShrink:1},metaBadgeText:{fontFamily:monoFont,fontSize:9.5,color:AppColors_1.AppColors.grayTextWeak,fontWeight:"600"},headerRight:{flexDirection:"row",alignItems:"center",gap:4.5,flexShrink:0},snippetTabs:{flexDirection:"row",alignItems:"center",backgroundColor:`${AppColors_1.AppColors.grayBorderSecondary}66`,borderRadius:7,padding:2,borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor,gap:2},snippetTabBtn:{flexDirection:"row",alignItems:"center",gap:3.5,paddingVertical:2.5,paddingHorizontal:6,borderRadius:5},snippetTabBtnActive:{backgroundColor:AppColors_1.AppColors.brandPurple,shadowColor:AppColors_1.AppColors.brandPurple,shadowOffset:{width:0,height:1},shadowOpacity:.25,shadowRadius:2,elevation:1},snippetTabText:{fontFamily:monoFont,fontSize:9.5,color:AppColors_1.AppColors.grayTextWeak,fontWeight:"600"},snippetTabTextActive:{color:AppColors_1.AppColors.white,fontWeight:"700"},toolToggleBtn:{paddingHorizontal:6,paddingVertical:3,borderRadius:6,backgroundColor:AppColors_1.AppColors.white,borderWidth:1,borderColor:AppColors_1.AppColors.grayBorderSecondary,alignItems:"center",justifyContent:"center"},toolToggleBtnActive:{backgroundColor:AppColors_1.AppColors.purple50,borderColor:AppColors_1.AppColors.purple200},toolToggleText:{fontFamily:monoFont,fontSize:9.5,color:AppColors_1.AppColors.grayTextWeak,fontWeight:"600"},toolToggleTextActive:{color:AppColors_1.AppColors.brandPurple,fontWeight:"700"},copyBtn:{width:25,height:25,borderRadius:6,backgroundColor:AppColors_1.AppColors.white,borderWidth:1,borderColor:AppColors_1.AppColors.grayBorderSecondary,alignItems:"center",justifyContent:"center"},copyBtnSuccess:{borderColor:AppColors_1.AppColors.greenMintBorder,backgroundColor:AppColors_1.AppColors.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:monoFont,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:monoFont,fontSize:11.5,lineHeight:18,color:"#CBD5E1",letterSpacing:.5},rawMonospaceText:{fontFamily:monoFont,fontSize:11.5,lineHeight:18,color:AppColors_1.AppColors.slate900},syntaxKey:{fontFamily:monoFont,fontSize:11.5,lineHeight:18,color:AppColors_1.AppColors.syntaxKey,fontWeight:"700"},syntaxColon:{fontFamily:monoFont,fontSize:11.5,lineHeight:18,color:AppColors_1.AppColors.syntaxColon,marginRight:4},syntaxString:{fontFamily:monoFont,fontSize:11.5,lineHeight:18,color:AppColors_1.AppColors.syntaxString},syntaxNumber:{fontFamily:monoFont,fontSize:11.5,lineHeight:18,color:AppColors_1.AppColors.syntaxNumber},syntaxBoolean:{fontFamily:monoFont,fontSize:11.5,lineHeight:18,color:AppColors_1.AppColors.syntaxBoolean},syntaxNull:{fontFamily:monoFont,fontSize:11.5,lineHeight:18,color:AppColors_1.AppColors.syntaxNull,fontStyle:"italic"},truncationBanner:{margin:10,backgroundColor:AppColors_1.AppColors.purple50,paddingVertical:8,paddingHorizontal:12,borderRadius:6,alignItems:"center",borderWidth:1,borderColor:AppColors_1.AppColors.purple200},truncationText:{fontFamily:monoFont,fontSize:10.5,color:AppColors_1.AppColors.brandPurple,fontWeight:"600"},tableView:{flex:1,width:"100%"},tableHeaderRow:{flexDirection:"row",backgroundColor:AppColors_1.AppColors.slate100,borderBottomWidth:1,borderBottomColor:AppColors_1.AppColors.slate200,paddingVertical:7,paddingHorizontal:12},tableHeaderCell:{fontFamily:monoFont,fontSize:10,color:AppColors_1.AppColors.slate600,fontWeight:"700",letterSpacing:.5},tableRow:{flexDirection:"row",borderBottomWidth:1,borderBottomColor:AppColors_1.AppColors.slate100,paddingVertical:8,paddingHorizontal:12,alignItems:"flex-start",backgroundColor:AppColors_1.AppColors.white},tableRowAlt:{backgroundColor:AppColors_1.AppColors.slate50},tableColKey:{flex:2,paddingRight:8},tableColVal:{flex:3},tableCellKey:{fontFamily:monoFont,fontSize:11.5,fontWeight:"700",color:AppColors_1.AppColors.brandPurple},typePill:{alignSelf:"flex-start",borderRadius:4,borderWidth:1,paddingHorizontal:4,paddingVertical:1,marginTop:3},typePillText:{fontFamily:monoFont,fontSize:9,fontWeight:"700"},tableCellValue:{fontFamily:monoFont,fontSize:11.5,color:AppColors_1.AppColors.slate900,lineHeight:17},tableCodeBox:{backgroundColor:AppColors_1.AppColors.slate100,borderRadius:6,borderWidth:1,borderColor:AppColors_1.AppColors.slate200,padding:6},showMoreBtn:{flexDirection:"row",alignItems:"center",gap:4,alignSelf:"flex-start",marginTop:4,paddingVertical:2,paddingHorizontal:4},showMoreText:{fontFamily:monoFont,fontSize:10,color:AppColors_1.AppColors.brandPurple,fontWeight:"600"},emptyContainer:{padding:24,alignItems:"center",justifyContent:"center"},emptyText:{fontFamily:monoFont,fontSize:11.5,color:AppColors_1.AppColors.slate500},highlight:{backgroundColor:AppColors_1.AppColors.yellow200,color:AppColors_1.AppColors.yellow800,fontFamily:monoFont,fontWeight:"700",borderRadius:2,paddingHorizontal:2}});exports.default=JsonViewer;

package/dist/commonjs/components/LogCard.js

@@ -1,20 +1,20 @@
-"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(t,e,a,o){o===void 0&&(o=a);var l=Object.getOwnPropertyDescriptor(e,a);(!l||("get"in l?!e.__esModule:l.writable||l.configurable))&&(l={enumerable:!0,get:function(){return e[a]}}),Object.defineProperty(t,o,l)}):(function(t,e,a,o){o===void 0&&(o=a),t[o]=e[a]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}):function(t,e){t.default=e}),__importStar=this&&this.__importStar||(function(){var t=function(e){return t=Object.getOwnPropertyNames||function(a){var o=[];for(var l in a)Object.prototype.hasOwnProperty.call(a,l)&&(o[o.length]=l);return o},t(e)};return function(e){if(e&&e.__esModule)return e;var a={};if(e!=null)for(var o=t(e),l=0;l<o.length;l++)o[l]!=="default"&&__createBinding(a,e,o[l]);return __setModuleDefault(a,e),a}})(),__importDefault=this&&this.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importStar(require("react")),react_native_1=require("react-native"),react_native_svg_1=__importStar(require("react-native-svg")),AppColors_1=require("../styles/AppColors"),constants_1=require("../constants"),helpers_1=require("../helpers"),NetworkIcons_1=require("./NetworkIcons"),AppFonts_1=require("../styles/AppFonts"),HighlightText_1=__importDefault(require("./HighlightText")),TouchableScale_1=__importDefault(require("./TouchableScale")),i18n_1=require("../i18n"),LogCard=react_1.default.memo(function({item:e,onPress:a,timelineMinStart:o,timelineTotalRange:l,isNew:u,isSelected:C,onToggleSelect:b,searchStr:x}){const{t:c}=(0,i18n_1.useTranslation)(),h=constants_1.METHOD_COLORS[e.method]??constants_1.METHOD_COLORS.ALL,n=(0,react_1.useMemo)(()=>{try{const r=new URL(e.url),p=r.host,w=r.pathname+(r.search?r.search:""),B=r.protocol==="https:";return{host:p,path:w||"/",isHttps:B}}catch{const r=e.url.toLowerCase().startsWith("https:"),p=(0,helpers_1.getPath)(e.url);return{host:(0,helpers_1.getBaseUrl)(e.url).replace(/^https?:\/\//,""),path:p||e.url,isHttps:r}}},[e.url]),f=(0,react_1.useMemo)(()=>{if(!e.caller||e.caller==="Unknown")return null;const r=e.caller.split(/[\/\\]/);return(r[r.length-1]||e.caller).replace(/\?.*$/,"").replace(/^[a-zA-Z0-9_$]+@/,"")},[e.caller]),y=r=>{r?.stopPropagation?.(),react_native_1.Alert.alert(c("common.openInBrowser")||"Open in Browser",`${c("common.openInBrowserPrompt")||"Are you sure you want to open this URL in your external browser?"}
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(r,e,n,o){o===void 0&&(o=n);var a=Object.getOwnPropertyDescriptor(e,n);(!a||("get"in a?!e.__esModule:a.writable||a.configurable))&&(a={enumerable:!0,get:function(){return e[n]}}),Object.defineProperty(r,o,a)}):(function(r,e,n,o){o===void 0&&(o=n),r[o]=e[n]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(r,e){Object.defineProperty(r,"default",{enumerable:!0,value:e})}):function(r,e){r.default=e}),__importStar=this&&this.__importStar||(function(){var r=function(e){return r=Object.getOwnPropertyNames||function(n){var o=[];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(o[o.length]=a);return o},r(e)};return function(e){if(e&&e.__esModule)return e;var n={};if(e!=null)for(var o=r(e),a=0;a<o.length;a++)o[a]!=="default"&&__createBinding(n,e,o[a]);return __setModuleDefault(n,e),n}})(),__importDefault=this&&this.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(exports,"__esModule",{value:!0});const react_1=__importStar(require("react")),react_native_1=require("react-native"),react_native_svg_1=__importStar(require("react-native-svg")),AppColors_1=require("../styles/AppColors"),constants_1=require("../constants"),helpers_1=require("../helpers"),NetworkIcons_1=require("./NetworkIcons"),AppFonts_1=require("../styles/AppFonts"),HighlightText_1=__importDefault(require("./HighlightText")),TouchableScale_1=__importDefault(require("./TouchableScale")),i18n_1=require("../i18n"),LogCard=react_1.default.memo(function({item:e,onPress:n,timelineMinStart:o,timelineTotalRange:a,isNew:u,isSelected:h,onToggleSelect:w,searchStr:b}){const{t:p}=(0,i18n_1.useTranslation)(),C=constants_1.METHOD_COLORS[e.method]??constants_1.METHOD_COLORS.ALL,i=(0,react_1.useMemo)(()=>{try{const t=new URL(e.url),d=t.host,_=t.pathname+(t.search?t.search:""),k=t.protocol==="https:";return{host:d,path:_||"/",isHttps:k}}catch{const t=e.url.toLowerCase().startsWith("https:"),d=(0,helpers_1.getPath)(e.url);return{host:(0,helpers_1.getBaseUrl)(e.url).replace(/^https?:\/\//,""),path:d||e.url,isHttps:t}}},[e.url]),x=t=>{t?.stopPropagation?.(),react_native_1.Alert.alert(p("common.openInBrowser")||"Open in Browser",`${p("common.openInBrowserPrompt")||"Are you sure you want to open this URL in your external browser?"}
 
-${e.url}`,[{text:c("common.cancel")||"Cancel",style:"cancel"},{text:c("common.open")||"Open",onPress:()=>{react_native_1.Linking.canOpenURL(e.url).then(p=>{p?react_native_1.Linking.openURL(e.url):react_native_1.Linking.openURL(e.url).catch(()=>{})}).catch(()=>{})}}])},i=e.status===0||e.status!=null&&e.status>=400,s=e.status==null,g=(0,helpers_1.getStatusColor)(e.status),d=(0,helpers_1.getDurationColor)(e.duration),A=s?AppColors_1.AppColors.darkOrange:i?AppColors_1.AppColors.errorColor:AppColors_1.AppColors.greenColor,_=(0,react_1.useRef)(new react_native_1.Animated.Value(u?.35:0)).current;(0,react_1.useEffect)(()=>{u&&react_native_1.Animated.timing(_,{toValue:0,duration:1200,useNativeDriver:!1}).start()},[u]);const T=()=>{if(s)return"...";if(e.status===0||e.status==null)return c("network.statusFailed")||"FAILED";const r=typeof e.status=="number"?e.status:parseInt(String(e.status||0),10);return r===200?"200 OK":r===201?"201 Created":r===204?"204 No Content":r===304?"304 Not Modified":r===400?"400 Bad Req":r===401?"401 Unauth":r===403?"403 Forbidden":r===404?"404 Not Found":r===500?"500 Error":String(e.status)},v=()=>{if(s)return<NetworkIcons_1.ClockIcon color={AppColors_1.AppColors.darkOrange}size={10}/>;const r=typeof e.status=="number"?e.status:parseInt(String(e.status||0),10);return r>=200&&r<300?<NetworkIcons_1.CircleCheckIcon color={AppColors_1.AppColors.greenColor}size={10}/>:r>=300&&r<400?<NetworkIcons_1.RepeatIcon color={AppColors_1.AppColors.amber700}size={10}/>:r>=400&&r<500?<NetworkIcons_1.CircleAlertIcon color={AppColors_1.AppColors.darkOrange}size={10}/>:<NetworkIcons_1.CircleXIcon color={AppColors_1.AppColors.errorColor}size={10}/>},k=(0,helpers_1.formatDateTime)(e.startTime),V=e.url.split("?")[0].toLowerCase().endsWith(".json");return<react_native_1.View style={styles.container}>
-      <TouchableScale_1.default onPress={a}style={[styles.card,{borderLeftWidth:3.5,borderLeftColor:A,backgroundColor:i?AppColors_1.AppColors.errorCardBg:AppColors_1.AppColors.white}]}>
+${e.url}`,[{text:p("common.cancel")||"Cancel",style:"cancel"},{text:p("common.open")||"Open",onPress:()=>{react_native_1.Linking.canOpenURL(e.url).then(d=>{d?react_native_1.Linking.openURL(e.url):react_native_1.Linking.openURL(e.url).catch(()=>{})}).catch(()=>{})}}])},l=e.status===0||e.status!=null&&e.status>=400,s=e.status==null,g=(0,helpers_1.getStatusColor)(e.status),c=(0,helpers_1.getDurationColor)(e.duration),y=s?AppColors_1.AppColors.darkOrange:l?AppColors_1.AppColors.errorColor:AppColors_1.AppColors.greenColor,f=(0,react_1.useRef)(new react_native_1.Animated.Value(u?.35:0)).current;(0,react_1.useEffect)(()=>{u&&react_native_1.Animated.timing(f,{toValue:0,duration:1200,useNativeDriver:!1}).start()},[u]);const A=()=>{if(s)return"...";if(e.status===0||e.status==null)return p("network.statusFailed")||"FAILED";const t=typeof e.status=="number"?e.status:parseInt(String(e.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(e.status)},v=()=>{if(s)return<NetworkIcons_1.ClockIcon color={AppColors_1.AppColors.darkOrange}size={10}/>;const t=typeof e.status=="number"?e.status:parseInt(String(e.status||0),10);return t>=200&&t<300?<NetworkIcons_1.CircleCheckIcon color={AppColors_1.AppColors.greenColor}size={10}/>:t>=300&&t<400?<NetworkIcons_1.RepeatIcon color={AppColors_1.AppColors.amber700}size={10}/>:t>=400&&t<500?<NetworkIcons_1.CircleAlertIcon color={AppColors_1.AppColors.darkOrange}size={10}/>:<NetworkIcons_1.CircleXIcon color={AppColors_1.AppColors.errorColor}size={10}/>},T=(0,helpers_1.formatDateTime)(e.startTime),V=e.url.split("?")[0].toLowerCase().endsWith(".json");return<react_native_1.View style={styles.container}>
+      <TouchableScale_1.default onPress={n}style={[styles.card,{borderLeftWidth:3.5,borderLeftColor:y,backgroundColor:l?AppColors_1.AppColors.errorCardBg:AppColors_1.AppColors.white}]}>
         <react_native_1.View style={styles.cardBody}>
           
           <react_native_1.View style={styles.cardHeaderRow}>
             <react_native_1.View style={styles.cardHeaderLeft}>
-              <react_native_1.Pressable onPress={()=>b(e.id)}hitSlop={12}style={[styles.smallCheckbox,C&&styles.smallCheckboxChecked]}>
-                {C&&<react_native_svg_1.default width={9}height={9}viewBox="0 0 24 24"fill="none">
+              <react_native_1.Pressable onPress={()=>w(e.id)}hitSlop={12}style={[styles.smallCheckbox,h&&styles.smallCheckboxChecked]}>
+                {h&&<react_native_svg_1.default width={9}height={9}viewBox="0 0 24 24"fill="none">
                     <react_native_svg_1.Path d="M20 6L9 17l-5-5"stroke={AppColors_1.AppColors.white}strokeWidth="4"strokeLinecap="round"strokeLinejoin="round"/>
                   </react_native_svg_1.default>}
               </react_native_1.Pressable>
 
               <react_native_1.Text style={styles.serialNumber}>#{e.id+1}</react_native_1.Text>
 
-              <react_native_1.View style={[styles.methodBadge,{backgroundColor:h}]}>
+              <react_native_1.View style={[styles.methodBadge,{backgroundColor:C}]}>
                 <react_native_1.Text style={styles.methodBadgeText}>
                   {e.method}
                 </react_native_1.Text>
@@ -34,18 +34,21 @@ ${e.url}`,[{text:c("common.cancel")||"Cancel",style:"cancel"},{text:c("common.op
                 </react_native_1.View>}
             </react_native_1.View>
 
-            <react_native_1.View style={[styles.statusPill,{backgroundColor:i?`${AppColors_1.AppColors.errorColor}14`:s?`${AppColors_1.AppColors.darkOrange}14`:`${g}14`,borderColor:i?`${AppColors_1.AppColors.errorColor}33`:s?`${AppColors_1.AppColors.darkOrange}33`:`${g}33`}]}>
-              {v()}
-              <react_native_1.Text style={[styles.statusPillText,{color:i?AppColors_1.AppColors.errorColor:s?AppColors_1.AppColors.darkOrange:g}]}>
-                {T()}
-              </react_native_1.Text>
+            <react_native_1.View style={styles.cardHeaderRight}>
+              <react_native_1.View style={[styles.statusPill,{backgroundColor:l?`${AppColors_1.AppColors.errorColor}14`:s?`${AppColors_1.AppColors.darkOrange}14`:`${g}14`,borderColor:l?`${AppColors_1.AppColors.errorColor}33`:s?`${AppColors_1.AppColors.darkOrange}33`:`${g}33`}]}>
+                {v()}
+                <react_native_1.Text style={[styles.statusPillText,{color:l?AppColors_1.AppColors.errorColor:s?AppColors_1.AppColors.darkOrange:g}]}>
+                  {A()}
+                </react_native_1.Text>
+              </react_native_1.View>
+              <NetworkIcons_1.ForwardChevronIcon color={AppColors_1.AppColors.grayTextWeak}size={13}/>
             </react_native_1.View>
           </react_native_1.View>
 
           
-          <react_native_1.Pressable onPress={y}hitSlop={6}style={styles.urlBox}>
+          <react_native_1.Pressable onPress={x}hitSlop={6}style={styles.urlBox}>
             <react_native_1.View style={styles.urlMainRow}>
-              <HighlightText_1.default text={n.path}search={x}style={styles.pathText}highlightStyle={styles.highlight}numberOfLines={2}ellipsizeMode="middle"/>
+              <HighlightText_1.default text={i.path}search={b}style={styles.pathText}highlightStyle={styles.highlight}numberOfLines={1}ellipsizeMode="middle"/>
               <react_native_1.View style={styles.urlBadgeRow}>
                 {V&&<react_native_1.View style={styles.jsonBadge}>
                     <react_native_1.Text style={styles.jsonBadgeText}>.json</react_native_1.Text>
@@ -56,16 +59,16 @@ ${e.url}`,[{text:c("common.cancel")||"Cancel",style:"cancel"},{text:c("common.op
               </react_native_1.View>
             </react_native_1.View>
 
-            {n.host?<react_native_1.View style={styles.hostRow}>
-                <react_native_1.View style={[styles.protoBadge,{backgroundColor:n.isHttps?`${AppColors_1.AppColors.emerald600}12`:`${AppColors_1.AppColors.amber600}12`,borderColor:n.isHttps?`${AppColors_1.AppColors.emerald600}2B`:`${AppColors_1.AppColors.amber600}2B`}]}>
-                  <react_native_1.Text style={[styles.protoBadgeText,{color:n.isHttps?AppColors_1.AppColors.emerald600:AppColors_1.AppColors.amber700}]}>
-                    {n.isHttps?"HTTPS":"HTTP"}
-                  </react_native_1.Text>
-                </react_native_1.View>
-                <react_native_1.Text style={styles.hostText}numberOfLines={1}ellipsizeMode="tail">
-                  {n.host}
+            <react_native_1.View style={styles.hostRow}>
+              <react_native_1.View style={[styles.protoBadge,{backgroundColor:i.isHttps?`${AppColors_1.AppColors.emerald600}12`:`${AppColors_1.AppColors.amber600}12`,borderColor:i.isHttps?`${AppColors_1.AppColors.emerald600}2B`:`${AppColors_1.AppColors.amber600}2B`}]}>
+                <react_native_1.Text style={[styles.protoBadgeText,{color:i.isHttps?AppColors_1.AppColors.emerald600:AppColors_1.AppColors.amber700}]}>
+                  {i.isHttps?"HTTPS":"HTTP"}
                 </react_native_1.Text>
-              </react_native_1.View>:null}
+              </react_native_1.View>
+              <react_native_1.Text style={styles.hostText}numberOfLines={1}ellipsizeMode="tail">
+                {i.host||e.url}
+              </react_native_1.Text>
+            </react_native_1.View>
           </react_native_1.Pressable>
 
           
@@ -73,15 +76,8 @@ ${e.url}`,[{text:c("common.cancel")||"Cancel",style:"cancel"},{text:c("common.op
             <react_native_1.View style={styles.footerLeft}>
               <react_native_1.View style={styles.cardDateRow}>
                 <NetworkIcons_1.CalendarIcon color={AppColors_1.AppColors.grayTextWeak}size={10}/>
-                <react_native_1.Text style={styles.cardDateText}>{k}</react_native_1.Text>
+                <react_native_1.Text style={styles.cardDateText}numberOfLines={1}>{T}</react_native_1.Text>
               </react_native_1.View>
-
-              {f&&<react_native_1.View style={styles.callerChip}>
-                  <NetworkIcons_1.PinIcon color={AppColors_1.AppColors.sky600}size={8.5}/>
-                  <react_native_1.Text style={styles.callerChipText}numberOfLines={1}ellipsizeMode="middle">
-                    {f}
-                  </react_native_1.Text>
-                </react_native_1.View>}
             </react_native_1.View>
 
             <react_native_1.View style={styles.footerRight}>
@@ -92,9 +88,9 @@ ${e.url}`,[{text:c("common.cancel")||"Cancel",style:"cancel"},{text:c("common.op
                   </react_native_1.Text>
                 </react_native_1.View>}
 
-              {e.duration!=null&&!i&&<react_native_1.View style={[styles.metaStatChip,{backgroundColor:`${d}12`,borderColor:`${d}2E`}]}>
-                  <NetworkIcons_1.ClockIcon color={d}size={9}/>
-                  <react_native_1.Text style={[styles.metaStatText,{color:d}]}>
+              {e.duration!=null&&!l&&<react_native_1.View style={[styles.metaStatChip,{backgroundColor:`${c}12`,borderColor:`${c}2E`}]}>
+                  <NetworkIcons_1.ClockIcon color={c}size={9}/>
+                  <react_native_1.Text style={[styles.metaStatText,{color:c}]}>
                     {e.duration}ms
                   </react_native_1.Text>
                 </react_native_1.View>}
@@ -102,11 +98,11 @@ ${e.url}`,[{text:c("common.cancel")||"Cancel",style:"cancel"},{text:c("common.op
           </react_native_1.View>
 
           
-          {typeof e.duration=="number"&&e.duration>0&&!i&&<react_native_1.View style={styles.waterfallContainer}>
-              <react_native_1.View style={[styles.waterfallBar,{width:`${Math.min(100,Math.max(6,e.duration/1200*100))}%`,backgroundColor:d}]}/>
-            </react_native_1.View>}
+          <react_native_1.View style={styles.waterfallContainer}>
+            {typeof e.duration=="number"&&e.duration>0&&!l&&<react_native_1.View style={[styles.waterfallBar,{width:`${Math.min(100,Math.max(6,e.duration/1200*100))}%`,backgroundColor:c}]}/>}
+          </react_native_1.View>
         </react_native_1.View>
 
-        {u&&<react_native_1.Animated.View pointerEvents="none"style={[react_native_1.StyleSheet.absoluteFill,{backgroundColor:h,opacity:_}]}/>}
+        {u&&<react_native_1.Animated.View pointerEvents="none"style={[react_native_1.StyleSheet.absoluteFill,{backgroundColor:C,opacity:f}]}/>}
       </TouchableScale_1.default>
-    </react_native_1.View>}),styles=react_native_1.StyleSheet.create({container:{paddingHorizontal:8,paddingVertical:3},card:{alignSelf:"stretch",borderRadius:10,overflow:"hidden",borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor,shadowColor:AppColors_1.AppColors.shadowColorString},cardBody:{paddingHorizontal:11,paddingTop:8,paddingBottom:7},cardHeaderRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginBottom:5,minHeight:20},cardHeaderLeft:{flexDirection:"row",alignItems:"center",flex:1,marginRight:6,gap:5,minWidth:0,flexWrap:"wrap"},smallCheckbox:{width:14,height:14,borderRadius:3.5,borderWidth:1.5,borderColor:AppColors_1.AppColors.grayTextWeak,alignItems:"center",justifyContent:"center",backgroundColor:AppColors_1.AppColors.white},smallCheckboxChecked:{backgroundColor:AppColors_1.AppColors.purple,borderColor:AppColors_1.AppColors.purple},serialNumber:{fontFamily:AppFonts_1.AppFonts.interBold,color:AppColors_1.AppColors.grayTextWeak,fontSize:9.5},methodBadge:{paddingHorizontal:6,paddingVertical:2,borderRadius:5,alignItems:"center",justifyContent:"center"},methodBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9,lineHeight:11,letterSpacing:.5,color:AppColors_1.AppColors.white},chip:{paddingHorizontal:5,paddingVertical:1.5,borderRadius:4,borderWidth:1},chipText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8.5,lineHeight:11},statusPill:{flexDirection:"row",alignItems:"center",gap:3.5,paddingHorizontal:6.5,paddingVertical:2,borderRadius:6,borderWidth:1,flexShrink:0},statusPillText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9.5,lineHeight:12},urlBox:{backgroundColor:AppColors_1.AppColors.grayBackground,borderRadius:7,borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor,paddingHorizontal:8,paddingVertical:5,marginVertical:3,gap:3},urlMainRow:{flexDirection:"row",alignItems:"flex-start",justifyContent:"space-between",gap:6},pathText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:12,lineHeight:16,color:AppColors_1.AppColors.primaryBlack,flex:1},urlBadgeRow:{flexDirection:"row",alignItems:"center",gap:4,flexShrink:0},jsonBadge:{backgroundColor:`${AppColors_1.AppColors.darkOrange}14`,borderColor:`${AppColors_1.AppColors.darkOrange}2E`,borderWidth:1,paddingHorizontal:4,paddingVertical:1,borderRadius:3},jsonBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8.5,color:AppColors_1.AppColors.darkOrange},dupBadge:{backgroundColor:`${AppColors_1.AppColors.purple}14`,borderColor:`${AppColors_1.AppColors.purple}2E`,borderWidth:1,paddingHorizontal:4,paddingVertical:1,borderRadius:3},dupBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8.5,color:AppColors_1.AppColors.purple},hostRow:{flexDirection:"row",alignItems:"center",gap:4.5},protoBadge:{paddingHorizontal:4,paddingVertical:1,borderRadius:3,borderWidth:1},protoBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:7.5,lineHeight:9},hostText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10,lineHeight:13,color:AppColors_1.AppColors.grayTextWeak,flex:1},highlight:{backgroundColor:AppColors_1.AppColors.yellowHighlight,color:AppColors_1.AppColors.primaryBlack,borderRadius:2},cardFooterRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginTop:3,gap:6},footerLeft:{flexDirection:"row",alignItems:"center",gap:5,flex:1,minWidth:0},footerRight:{flexDirection:"row",alignItems:"center",gap:4,flexShrink:0},cardDateRow:{flexDirection:"row",alignItems:"center",gap:3},cardDateText:{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:9.5,lineHeight:12,color:AppColors_1.AppColors.slate400},callerChip:{flexDirection:"row",alignItems:"center",gap:2.5,backgroundColor:AppColors_1.AppColors.skySoftBg,borderColor:AppColors_1.AppColors.skySoftBorder,borderWidth:1,paddingHorizontal:4.5,paddingVertical:1,borderRadius:4,flexShrink:1,minWidth:0},callerChipText:{color:AppColors_1.AppColors.skySoftText,fontSize:8.5,lineHeight:11,fontFamily:AppFonts_1.AppFonts.interBold},metaStatChip:{flexDirection:"row",alignItems:"center",gap:2.5,backgroundColor:AppColors_1.AppColors.violetSoftBg,borderColor:AppColors_1.AppColors.violetSoftBorder,borderWidth:1,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4},metaStatText:{fontFamily:AppFonts_1.AppFonts.interBold,color:AppColors_1.AppColors.violetSoftText,fontSize:9,lineHeight:11},waterfallContainer:{height:2,width:"100%",backgroundColor:AppColors_1.AppColors.graySurface,borderRadius:1,overflow:"hidden",marginTop:5},waterfallBar:{height:"100%",borderRadius:1}});exports.default=LogCard;
+    </react_native_1.View>}),styles=react_native_1.StyleSheet.create({container:{paddingHorizontal:8,paddingVertical:4,height:126,justifyContent:"center"},card:{height:118,alignSelf:"stretch",borderRadius:10,overflow:"hidden",borderWidth:1,borderColor:AppColors_1.AppColors.dividerColor,shadowColor:AppColors_1.AppColors.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:AppColors_1.AppColors.grayTextWeak,alignItems:"center",justifyContent:"center",backgroundColor:AppColors_1.AppColors.white},smallCheckboxChecked:{backgroundColor:AppColors_1.AppColors.purple,borderColor:AppColors_1.AppColors.purple},serialNumber:{fontFamily:AppFonts_1.AppFonts.interBold,color:AppColors_1.AppColors.grayTextWeak,fontSize:10},methodBadge:{paddingHorizontal:7,paddingVertical:2.5,borderRadius:5,alignItems:"center",justifyContent:"center"},methodBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:9.5,lineHeight:12,letterSpacing:.5,color:AppColors_1.AppColors.white},chip:{paddingHorizontal:6,paddingVertical:2,borderRadius:4,borderWidth:1},chipText:{fontFamily:AppFonts_1.AppFonts.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:AppFonts_1.AppFonts.interBold,fontSize:10,lineHeight:13},urlBox:{backgroundColor:AppColors_1.AppColors.grayBackground,borderRadius:7,borderWidth:1,borderColor:AppColors_1.AppColors.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:AppFonts_1.AppFonts.interBold,fontSize:12,lineHeight:16,color:AppColors_1.AppColors.primaryBlack,flex:1},urlBadgeRow:{flexDirection:"row",alignItems:"center",gap:4,flexShrink:0},jsonBadge:{backgroundColor:`${AppColors_1.AppColors.darkOrange}14`,borderColor:`${AppColors_1.AppColors.darkOrange}2E`,borderWidth:1,paddingHorizontal:4.5,paddingVertical:1,borderRadius:3.5},jsonBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8.5,color:AppColors_1.AppColors.darkOrange},dupBadge:{backgroundColor:`${AppColors_1.AppColors.purple}14`,borderColor:`${AppColors_1.AppColors.purple}2E`,borderWidth:1,paddingHorizontal:4.5,paddingVertical:1,borderRadius:3.5},dupBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8.5,color:AppColors_1.AppColors.purple},hostRow:{flexDirection:"row",alignItems:"center",gap:5,minHeight:15},protoBadge:{paddingHorizontal:4.5,paddingVertical:1,borderRadius:3.5,borderWidth:1},protoBadgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:8,lineHeight:10},hostText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10,lineHeight:13,color:AppColors_1.AppColors.grayTextWeak,flex:1},highlight:{backgroundColor:AppColors_1.AppColors.yellowHighlight,color:AppColors_1.AppColors.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:AppFonts_1.AppFonts.interRegular,fontSize:10,lineHeight:13,color:AppColors_1.AppColors.slate400},metaStatChip:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:AppColors_1.AppColors.violetSoftBg,borderColor:AppColors_1.AppColors.violetSoftBorder,borderWidth:1,paddingHorizontal:5.5,paddingVertical:1.5,borderRadius:4},metaStatText:{fontFamily:AppFonts_1.AppFonts.interBold,color:AppColors_1.AppColors.violetSoftText,fontSize:9,lineHeight:12},waterfallContainer:{height:2.5,width:"100%",backgroundColor:AppColors_1.AppColors.graySurface,borderRadius:1.5,overflow:"hidden",marginTop:2},waterfallBar:{height:"100%",borderRadius:1.5}});exports.default=LogCard;