react-native-inapp-inspector 2.4.1 → 2.4.2

package/dist/esm/components/ConsoleLogCard.js

@@ -1,111 +1,95 @@
-import z from"react";import{useTranslation as G}from"../i18n";import{Pressable as K,StyleSheet as Y,Text as E,View as T}from"react-native";import{AppColors as r}from"../styles/AppColors";import{AppFonts as B}from"../styles/AppFonts";import{formatTime as X,getJsonContent as J,getJsonPreviewText as Q,parseStackLine as Z,openInVSCode as q,getSize as _,getCleanCallerDisplay as ee}from"../helpers";import Te from"./TouchableScale";import N from"./LogSyntaxHighlighter";import{ForwardChevronIcon as Ce,ExternalLinkIcon as Ie,FlaskIcon as he,ZapIcon as V,GlobeIcon as xe,DiceIcon as ye,AtomIcon as M,BarChartIcon as Se,KeyIcon as me,SmartphoneIcon as Ee,AlertTriangleIcon as Be,BugIcon as Re,TagIcon as Ae,MapPinIcon as $,StorageIcon as Oe,SignalIcon as Pe,FlameIcon as we,MoneyIcon as ke,CircleCheckIcon as U,CircleAlertIcon as Ne,CircleXIcon as Le,RefreshCcwIcon as He,PerformanceIcon as Ve,ChipIcon as Fe,SettingsIcon as De,TerminalIcon as ze,InfoCircleIcon as W,ShieldAlertIcon as Me,LayoutIcon as $e,ClockIcon as Ue,SizeIcon as We}from"./NetworkIcons";import{useInspector as Ge}from"./Inspector/InspectorContext";const ve=(w,C,O,F,L)=>{if(!w)return null;const x=/^((?:\[[^\]]+\]\s*)+)/,k=w.match(x);if(k){const I=k[1],D=w.substring(I.length),h=I.match(/\[[^\]]+\]/g)||[],H=P=>{const e=P.replace(/[\[\]]/g,"").trim().toUpperCase();return e==="AXIOS"?{color:r.emerald600,Icon:V,label:"AXIOS"}:e==="API"||e==="FETCH"||e==="HTTP"||e==="REST"||e==="NETWORK"?{color:r.sky600,Icon:xe,label:e}:e==="GRAPHQL"||e==="GQL"||e==="APOLLO"||e==="MUTATION"||e==="QUERY"?{color:r.pink500,Icon:M,label:e}:e==="WS"||e==="WEBSOCKET"||e==="SOCKET"||e==="SOCKET.IO"||e==="REALTIME"?{color:r.cyan600,Icon:Pe,label:e}:e==="REDUX"||e==="STORE"||e==="STATE"||e==="ZUSTAND"||e==="MOBX"||e==="RECOIL"||e==="ACTION"||e==="DISPATCH"?{color:r.violet600,Icon:M,label:e}:e==="ANALYTICS"||e==="FIREBASE"||e==="GA4"||e==="GA"||e==="SEGMENT"||e==="MIXPANEL"||e==="POSTHOG"||e==="TRACK"||e==="EVENT"?{color:r.teal600,Icon:Se,label:e}:e==="AUTH"||e==="TOKEN"||e==="SESSION"||e==="JWT"||e==="LOGIN"||e==="LOGOUT"||e==="USER"?{color:r.amber600,Icon:me,label:e}:e==="SECURITY"||e==="SHIELD"||e==="PERMISSION"||e==="PERMISSIONS"?{color:r.indigo600Alt,Icon:Me,label:e}:e==="NAV"||e==="NAVIGATION"||e==="ROUTE"||e==="SCREEN"||e==="ROUTER"||e==="DEEPLINK"?{color:r.indigo600Alt,Icon:$,label:e}:e==="STORAGE"||e==="ASYNCSTORAGE"||e==="MMKV"||e==="SQLITE"||e==="DB"||e==="DATABASE"||e==="REALM"||e==="CACHE"?{color:r.purple500,Icon:Oe,label:e}:e==="PERF"||e==="RENDER"||e==="PERFORMANCE"||e==="FPS"||e==="MEMORY"?{color:r.violet500,Icon:Ve,label:e}:e==="INIT"||e==="BOOT"||e==="STARTUP"||e==="LIFECYCLE"||e==="MOUNT"||e==="UNMOUNT"?{color:r.blue600,Icon:V,label:e}:e==="SYNC"||e==="REFRESH"||e==="BACKGROUND"||e==="JOB"||e==="WORKER"?{color:r.sky600,Icon:He,label:e}:e==="PUSH"||e==="NOTIF"||e==="NOTIFICATION"||e==="FCM"||e==="APNS"?{color:r.darkOrange,Icon:we,label:e}:e==="PAY"||e==="PAYMENT"||e==="STRIPE"||e==="IAP"||e==="BILLING"||e==="CHECKOUT"||e==="CART"?{color:r.emerald600,Icon:ke,label:e}:e==="DEVICE"||e==="HARDWARE"||e==="BLE"||e==="BLUETOOTH"||e==="NFC"||e==="SENSOR"?{color:r.slate600,Icon:Fe,label:e}:e==="LOCATION"||e==="GPS"||e==="GEO"?{color:r.emerald600,Icon:$,label:e}:e==="APP"?{color:r.indigo600Alt,Icon:Ee,label:"APP"}:e==="UI"||e==="VIEW"||e==="THEME"||e==="STYLE"||e==="LAYOUT"?{color:r.pink600,Icon:$e,label:e}:e==="TEST"||e==="MOCK"||e==="SPEC"?{color:r.emerald500,Icon:he,label:"TEST"}:e==="SAMPLE"||e==="BATCH"?{color:r.indigo600Alt,Icon:ye,label:e}:e==="CONFIG"||e==="ENV"||e==="SETTINGS"?{color:r.slate700,Icon:De,label:e}:e==="DEBUG"||e==="TRACE"?{color:r.purpleText,Icon:ze,label:e}:e==="INFO"?{color:r.sky600,Icon:W,label:"INFO"}:e==="SUCCESS"||e==="OK"||e==="DONE"||e==="PASSED"?{color:r.green600,Icon:U,label:e}:e==="WARN"||e==="WARNING"?{color:r.amber600,Icon:Be,label:"WARN"}:e==="ERROR"||e==="CRASH"||e==="BUG"||e==="FATAL"||e==="EXCEPTION"||e==="FAIL"?{color:r.red600,Icon:Re,label:e==="CRASH"||e==="BUG"||e==="FATAL"||e==="EXCEPTION"||e==="FAIL"?e:"ERROR"}:{color:r.slate600,Icon:Ae,label:e}};return<T style={{flexDirection:"column",gap:2}}>
-        <T style={{flexDirection:"row",gap:4,overflow:"hidden"}}>
-          {h.slice(0,2).map((P,e)=>{const R=H(P),S=R.Icon;return<T key={e}style={[o.prefixTag,{backgroundColor:`${R.color}12`,borderColor:`${R.color}30`}]}>
-                <S color={R.color}size={8.5}/>
-                <E style={[o.prefixTagText,{color:R.color}]}>
-                  {R.label}
+import F from"react";import{useTranslation as v}from"../i18n";import{Pressable as K,StyleSheet as Y,Text as E,View as I}from"react-native";import{AppColors as r}from"../styles/AppColors";import{AppFonts as S}from"../styles/AppFonts";import{formatTime as X,getJsonContent as J,getJsonPreviewText as Q,parseStackLine as Z,openInVSCode as q,getSize as _,getCleanCallerDisplay as ee}from"../helpers";import Ie from"./TouchableScale";import L from"./LogSyntaxHighlighter";import{ForwardChevronIcon as Te,ExternalLinkIcon as Ce,FlaskIcon as he,ZapIcon as D,GlobeIcon as Se,DiceIcon as me,AtomIcon as U,BarChartIcon as xe,KeyIcon as ye,SmartphoneIcon as Ee,AlertTriangleIcon as Re,BugIcon as Be,TagIcon as Ae,MapPinIcon as $,StorageIcon as Oe,SignalIcon as Pe,FlameIcon as we,MoneyIcon as Ne,CircleCheckIcon as W,CircleAlertIcon as Le,CircleXIcon as ke,RefreshCcwIcon as He,PerformanceIcon as Ve,ChipIcon as Fe,SettingsIcon as De,TerminalIcon as ze,InfoCircleIcon as G,ShieldAlertIcon as Me,LayoutIcon as Ue,ClockIcon as $e,SizeIcon as We}from"./NetworkIcons";import{useInspector as Ge}from"./Inspector/InspectorContext";const ve=(R,t,P,k,H)=>{if(!R)return null;const V=/^((?:\[[^\]]+\]\s*)+)/,C=R.match(V);if(C){const w=C[1],T=R.substring(w.length),z=w.match(/\[[^\]]+\]/g)||[],O=N=>{const e=N.replace(/[\[\]]/g,"").trim().toUpperCase();return e==="AXIOS"?{color:r.emerald600,Icon:D,label:"AXIOS"}:e==="API"||e==="FETCH"||e==="HTTP"||e==="REST"||e==="NETWORK"?{color:r.sky600,Icon:Se,label:e}:e==="GRAPHQL"||e==="GQL"||e==="APOLLO"||e==="MUTATION"||e==="QUERY"?{color:r.pink500,Icon:U,label:e}:e==="WS"||e==="WEBSOCKET"||e==="SOCKET"||e==="SOCKET.IO"||e==="REALTIME"?{color:r.cyan600,Icon:Pe,label:e}:e==="REDUX"||e==="STORE"||e==="STATE"||e==="ZUSTAND"||e==="MOBX"||e==="RECOIL"||e==="ACTION"||e==="DISPATCH"?{color:r.violet600,Icon:U,label:e}:e==="ANALYTICS"||e==="FIREBASE"||e==="GA4"||e==="GA"||e==="SEGMENT"||e==="MIXPANEL"||e==="POSTHOG"||e==="TRACK"||e==="EVENT"?{color:r.teal600,Icon:xe,label:e}:e==="AUTH"||e==="TOKEN"||e==="SESSION"||e==="JWT"||e==="LOGIN"||e==="LOGOUT"||e==="USER"?{color:r.amber600,Icon:ye,label:e}:e==="SECURITY"||e==="SHIELD"||e==="PERMISSION"||e==="PERMISSIONS"?{color:r.indigo600Alt,Icon:Me,label:e}:e==="NAV"||e==="NAVIGATION"||e==="ROUTE"||e==="SCREEN"||e==="ROUTER"||e==="DEEPLINK"?{color:r.indigo600Alt,Icon:$,label:e}:e==="STORAGE"||e==="ASYNCSTORAGE"||e==="MMKV"||e==="SQLITE"||e==="DB"||e==="DATABASE"||e==="REALM"||e==="CACHE"?{color:r.purple500,Icon:Oe,label:e}:e==="PERF"||e==="RENDER"||e==="PERFORMANCE"||e==="FPS"||e==="MEMORY"?{color:r.violet500,Icon:Ve,label:e}:e==="INIT"||e==="BOOT"||e==="STARTUP"||e==="LIFECYCLE"||e==="MOUNT"||e==="UNMOUNT"?{color:r.blue600,Icon:D,label:e}:e==="SYNC"||e==="REFRESH"||e==="BACKGROUND"||e==="JOB"||e==="WORKER"?{color:r.sky600,Icon:He,label:e}:e==="PUSH"||e==="NOTIF"||e==="NOTIFICATION"||e==="FCM"||e==="APNS"?{color:r.darkOrange,Icon:we,label:e}:e==="PAY"||e==="PAYMENT"||e==="STRIPE"||e==="IAP"||e==="BILLING"||e==="CHECKOUT"||e==="CART"?{color:r.emerald600,Icon:Ne,label:e}:e==="DEVICE"||e==="HARDWARE"||e==="BLE"||e==="BLUETOOTH"||e==="NFC"||e==="SENSOR"?{color:r.slate600,Icon:Fe,label:e}:e==="LOCATION"||e==="GPS"||e==="GEO"?{color:r.emerald600,Icon:$,label:e}:e==="APP"?{color:r.indigo600Alt,Icon:Ee,label:"APP"}:e==="UI"||e==="VIEW"||e==="THEME"||e==="STYLE"||e==="LAYOUT"?{color:r.pink600,Icon:Ue,label:e}:e==="TEST"||e==="MOCK"||e==="SPEC"?{color:r.emerald500,Icon:he,label:"TEST"}:e==="SAMPLE"||e==="BATCH"?{color:r.indigo600Alt,Icon:me,label:e}:e==="CONFIG"||e==="ENV"||e==="SETTINGS"?{color:r.slate700,Icon:De,label:e}:e==="DEBUG"||e==="TRACE"?{color:r.purpleText,Icon:ze,label:e}:e==="INFO"?{color:r.sky600,Icon:G,label:"INFO"}:e==="SUCCESS"||e==="OK"||e==="DONE"||e==="PASSED"?{color:r.green600,Icon:W,label:e}:e==="WARN"||e==="WARNING"?{color:r.amber600,Icon:Re,label:"WARN"}:e==="ERROR"||e==="CRASH"||e==="BUG"||e==="FATAL"||e==="EXCEPTION"||e==="FAIL"?{color:r.red600,Icon:Be,label:e==="CRASH"||e==="BUG"||e==="FATAL"||e==="EXCEPTION"||e==="FAIL"?e:"ERROR"}:{color:r.slate600,Icon:Ae,label:e}};return<I style={{flexDirection:"column",gap:2}}>
+        <I style={{flexDirection:"row",gap:4,overflow:"hidden"}}>
+          {z.slice(0,2).map((N,e)=>{const B=O(N),M=B.Icon;return<I key={e}style={[o.prefixTag,{backgroundColor:`${B.color}12`,borderColor:`${B.color}30`}]}>
+                <M color={B.color}size={8.5}/>
+                <E style={[o.prefixTagText,{color:B.color}]}>
+                  {B.label}
                 </E>
-              </T>})}
-        </T>
-        <N text={D}search={C}style={O}numberOfLines={1}detectLinks={!1}/>
-      </T>}return<N text={w}search={C}style={O}numberOfLines={L||2}detectLinks={!1}/>};export const ConsoleLogCard=z.memo(function({item:C,searchStr:O=""}){const{setSelectedLog:F}=Ge(),{t:L}=G(),x=J(C.message),k=C.message.toLowerCase().includes("[analytics error]"),I=z.useMemo(()=>{const S=ee(C.caller);if(!S)return null;const A=Z(C.caller,!0);return{...A,display:S.display,fileName:S.fileName,lineNumber:S.lineNumber||A.lineNumber}},[C.caller]),h=(()=>{const S=(C.type||"log").toLowerCase(),A=(C.sourceMethod||S).toLowerCase();return k||S==="error"||A==="error"?{badgeColor:r.errorColor,border:r.errorColor,badgeBg:`${r.errorColor}18`,badgeText:r.errorColor,label:"ERROR",cardBg:r.errorCardBg,statusPillBg:`${r.errorColor}14`,statusPillBorder:`${r.errorColor}33`,statusPillText:r.errorColor,StatusIcon:Le}:S==="warn"||A==="warn"?{badgeColor:r.darkOrange,border:r.darkOrange,badgeBg:`${r.darkOrange}18`,badgeText:r.darkOrange,label:"WARN",cardBg:r.warnCardBg,statusPillBg:`${r.darkOrange}14`,statusPillBorder:`${r.darkOrange}33`,statusPillText:r.darkOrange,StatusIcon:Ne}:S==="debug"||A==="debug"?{badgeColor:r.purple,border:r.purple,badgeBg:`${r.purple}18`,badgeText:r.purple,label:"DEBUG",cardBg:r.purpleTintBg,statusPillBg:`${r.purple}14`,statusPillBorder:`${r.purple}33`,statusPillText:r.purple,StatusIcon:V}:A==="info"||S==="info"&&A!=="log"?{badgeColor:r.sky600,border:r.sky600,badgeBg:`${r.sky600}18`,badgeText:r.sky600,label:"INFO",cardBg:r.blueTintBg,statusPillBg:`${r.sky600}14`,statusPillBorder:`${r.sky600}33`,statusPillText:r.sky600,StatusIcon:W}:{badgeColor:r.brandPurple,border:r.brandPurple,badgeBg:`${r.brandPurple}15`,badgeText:r.brandPurple,label:"LOG",cardBg:r.white,statusPillBg:`${r.brandPurple}12`,statusPillBorder:`${r.brandPurple}2E`,statusPillText:r.brandPurple,StatusIcon:U}})(),H=h.StatusIcon,P=x?Q(x.data):null,e=()=>{F(C)},R=("sourceMethod"in C?C.sourceMethod:void 0)||C.type||"log";return<T style={o.container}>
-      <Te onPress={e}style={[o.card,{borderLeftWidth:3.5,borderLeftColor:h.border,backgroundColor:h.cardBg}]}>
-        <T style={o.cardBody}>
+              </I>})}
+        </I>
+        <L text={T}search={t}style={P}numberOfLines={1}detectLinks={!1}/>
+      </I>}return<L text={R}search={t}style={P}numberOfLines={H||2}detectLinks={!1}/>};export const ConsoleLogCard=F.memo(function({item:t,searchStr:P="",onPress:k}){const{setSelectedLog:H}=Ge(),{t:V}=v(),C=J(t.message),w=t.message.toLowerCase().includes("[analytics error]"),T=F.useMemo(()=>{const h=ee(t.caller);if(!h)return null;const A=Z(t.caller,!0);return{...A,display:h.display,fileName:h.fileName,lineNumber:h.lineNumber||A.lineNumber}},[t.caller]),O=(()=>{const h=(t.type||"log").toLowerCase(),A=(t.sourceMethod||h).toLowerCase();return w||h==="error"||A==="error"?{badgeColor:r.errorColor,border:r.errorColor,badgeBg:`${r.errorColor}18`,badgeText:r.errorColor,label:"ERROR",cardBg:r.errorCardBg,statusPillBg:`${r.errorColor}14`,statusPillBorder:`${r.errorColor}33`,statusPillText:r.errorColor,StatusIcon:ke}:h==="warn"||A==="warn"?{badgeColor:r.darkOrange,border:r.darkOrange,badgeBg:`${r.darkOrange}18`,badgeText:r.darkOrange,label:"WARN",cardBg:r.warnCardBg,statusPillBg:`${r.darkOrange}14`,statusPillBorder:`${r.darkOrange}33`,statusPillText:r.darkOrange,StatusIcon:Le}:h==="debug"||A==="debug"?{badgeColor:r.purple,border:r.purple,badgeBg:`${r.purple}18`,badgeText:r.purple,label:"DEBUG",cardBg:r.purpleTintBg,statusPillBg:`${r.purple}14`,statusPillBorder:`${r.purple}33`,statusPillText:r.purple,StatusIcon:D}:A==="info"||h==="info"&&A!=="log"?{badgeColor:r.sky600,border:r.sky600,badgeBg:`${r.sky600}18`,badgeText:r.sky600,label:"INFO",cardBg:r.blueTintBg,statusPillBg:`${r.sky600}14`,statusPillBorder:`${r.sky600}33`,statusPillText:r.sky600,StatusIcon:G}:{badgeColor:r.brandPurple,border:r.brandPurple,badgeBg:`${r.brandPurple}15`,badgeText:r.brandPurple,label:"LOG",cardBg:r.white,statusPillBg:`${r.brandPurple}12`,statusPillBorder:`${r.brandPurple}2E`,statusPillText:r.brandPurple,StatusIcon:W}})(),N=O.StatusIcon,e=C?Q(C.data):null,B=()=>{k?k(t):H(t)},M=("sourceMethod"in t?t.sourceMethod:void 0)||t.type||"log";return<I style={o.container}>
+      <Ie onPress={B}style={[o.card,{borderLeftWidth:3.5,borderLeftColor:O.border,backgroundColor:O.cardBg}]}>
+        <I style={o.cardBody}>
           
-          <T style={o.cardHeaderRow}>
-            <T style={o.cardHeaderLeft}>
+          <I style={o.cardHeaderRow}>
+            <I style={o.cardHeaderLeft}>
               <E style={o.serialNumber}>
-                #{C.id!=null?C.id+1:1}
+                #{t.id!=null?t.id+1:1}
               </E>
 
               
-              <T style={[o.methodBadge,{backgroundColor:h.badgeColor}]}>
-                <E style={o.methodBadgeText}>{h.label}</E>
-              </T>
+              <I style={[o.methodBadge,{backgroundColor:O.badgeColor}]}>
+                <E style={o.methodBadgeText}>{O.label}</E>
+              </I>
 
               
-              <T style={[o.chip,{backgroundColor:`${h.badgeColor}12`,borderColor:`${h.badgeColor}2E`}]}>
-                <E style={[o.chipText,{color:h.badgeColor}]}numberOfLines={1}>
-                  console.{R}
-                </E>
-              </T>
-
-              
-              {x&&<T style={[o.chip,{backgroundColor:`${r.teal600}14`,borderColor:`${r.teal600}33`}]}>
+              {C&&<I style={[o.chip,{backgroundColor:`${r.teal600}12`,borderColor:`${r.teal600}2E`}]}>
                   <E style={[o.chipText,{color:r.teal600}]}>
-                    {Array.isArray(x.data)?`Array[${x.data.length}]`:`Object{${Object.keys(x.data).length}}`}
+                    {Array.isArray(C.data)?`Array[${C.data.length}]`:`Object{${Object.keys(C.data).length}}`}
                   </E>
-                </T>}
+                </I>}
 
               
-              {"duplicateCount"in C&&C.duplicateCount!=null&&C.duplicateCount>1&&<T style={o.dupBadge}>
+              {"duplicateCount"in t&&t.duplicateCount!=null&&t.duplicateCount>1&&<I style={o.dupBadge}>
                     <E style={o.dupBadgeText}>
-                      ×{C.duplicateCount}
+                      ×{t.duplicateCount}
                     </E>
-                  </T>}
-            </T>
+                  </I>}
+            </I>
 
             
-            <T style={o.cardHeaderRight}>
-              <T style={[o.statusPill,{backgroundColor:h.statusPillBg,borderColor:h.statusPillBorder}]}>
-                <H color={h.statusPillText}size={9.5}/>
-                <E style={[o.statusPillText,{color:h.statusPillText}]}>
-                  {h.label}
-                </E>
-              </T>
-              <Ce color={r.grayTextWeak}size={13}/>
-            </T>
-          </T>
+            <I style={o.cardHeaderRight}>
+              <Te color={r.slate400}size={13}/>
+            </I>
+          </I>
 
           
-          <T style={o.messageBox}>
-            {x?<T style={o.jsonPreviewRow}>
-                {x.header?<N text={x.header}search={O}style={o.messageText}detectLinks={!1}numberOfLines={1}/>:null}
-                {P&&<N text={P.text.replace(/\s+/g," ")}search={O}style={o.jsonPreviewText}detectLinks={!1}numberOfLines={x.header?2:3}/>}
-              </T>:ve(C.message,O,o.messageText,o.highlight,3)}
-          </T>
+          <I style={o.messageBox}>
+            {C?<I style={o.jsonPreviewRow}>
+                {C.header?<L text={C.header}search={P}style={o.messageText}detectLinks={!1}numberOfLines={1}/>:null}
+                {e&&<L text={e.text.replace(/\s+/g," ")}search={P}style={o.jsonPreviewText}detectLinks={!1}numberOfLines={C.header?2:3}/>}
+              </I>:ve(t.message,P,o.messageText,o.highlight,3)}
+          </I>
 
           
-          <T style={o.cardFooterRow}>
-            <T style={o.footerLeft}>
-              <T style={o.cardDateRow}>
-                <Ue color={r.grayTextWeak}size={10}/>
+          <I style={o.cardFooterRow}>
+            <I style={o.footerLeft}>
+              <I style={o.cardDateRow}>
+                <$e color={r.grayTextWeak}size={10}/>
                 <E style={o.cardDateText}numberOfLines={1}>
-                  {X(C.timestamp)}
+                  {X(t.timestamp)}
                 </E>
-              </T>
+              </I>
 
-              {I&&<K onPress={S=>{S.stopPropagation?.(),q(I.rawFilePath||I.fullPath||I.fileName,I.lineNumber,I.columnNumber)}}hitSlop={8}style={o.callerChip}>
-                  {I.fileExt&&I.fileExt!=="other"&&<T style={[o.extBadge,{backgroundColor:I.fileExt==="tsx"||I.fileExt==="ts"?`${r.brandPurple}22`:`${r.teal600}22`}]}>
-                      <E style={[o.extBadgeText,{color:I.fileExt==="tsx"||I.fileExt==="ts"?r.brandPurple:r.teal600}]}>
-                        {I.fileExt.toUpperCase()}
+              {T&&<K onPress={h=>{h.stopPropagation?.(),q(T.rawFilePath||T.fullPath||T.fileName,T.lineNumber,T.columnNumber)}}hitSlop={8}style={o.callerChip}>
+                  {T.fileExt&&T.fileExt!=="other"&&<I style={[o.extBadge,{backgroundColor:T.fileExt==="tsx"||T.fileExt==="ts"?`${r.brandPurple}22`:`${r.teal600}22`}]}>
+                      <E style={[o.extBadgeText,{color:T.fileExt==="tsx"||T.fileExt==="ts"?r.brandPurple:r.teal600}]}>
+                        {T.fileExt.toUpperCase()}
                       </E>
-                    </T>}
+                    </I>}
                   <E style={o.callerChipText}numberOfLines={1}ellipsizeMode="middle">
-                    {I.display}
+                    {T.display}
                   </E>
-                  <Ie color={r.sky600}size={8}/>
+                  <Ce color={r.sky600}size={8}/>
                 </K>}
-            </T>
+            </I>
 
-            <T style={o.footerRight}>
-              {x&&<T style={o.metaStatChip}>
+            <I style={o.footerRight}>
+              {C&&<I style={o.metaStatChip}>
                   <We color={r.purple}size={8.5}/>
                   <E style={o.metaStatText}>
-                    {_(x.data)}
+                    {_(C.data)}
                   </E>
-                </T>}
+                </I>}
 
-              {k&&<T style={[o.chip,{backgroundColor:`${r.skyBlue}15`,borderColor:`${r.skyBlue}30`}]}>
+              {w&&<I style={[o.chip,{backgroundColor:`${r.skyBlue}15`,borderColor:`${r.skyBlue}30`}]}>
                   <E style={[o.chipText,{color:r.skyBlue}]}>
-                    {L("console.analyticsBadge")||"ANALYTICS"}
+                    {V("console.analyticsBadge")||"ANALYTICS"}
                   </E>
-                </T>}
-            </T>
-          </T>
-
-          
-          <T style={[o.bottomAccentBar,{backgroundColor:`${h.border}35`}]}/>
-        </T>
-      </Te>
-    </T>});const o=Y.create({container:{paddingHorizontal:8,paddingVertical:4,height:148,justifyContent:"center"},card:{height:140,alignSelf:"stretch",borderRadius:10,overflow:"hidden",borderWidth:1,borderColor:r.dividerColor,shadowColor:r.shadowColorString},cardBody:{height:"100%",paddingHorizontal:12,paddingTop:10,paddingBottom:8,justifyContent:"space-between"},cardHeaderRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",height:22,minHeight:22,maxHeight:22},cardHeaderLeft:{flexDirection:"row",alignItems:"center",flex:1,marginRight:8,gap:6,minWidth:0,overflow:"hidden"},cardHeaderRight:{flexDirection:"row",alignItems:"center",gap:6,flexShrink:0},serialNumber:{fontFamily:B.interBold,color:r.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:r.white},chip:{paddingHorizontal:6,paddingVertical:2,borderRadius:4,borderWidth:1},chipText:{fontFamily:B.interBold,fontSize:9,lineHeight:12},dupBadge:{backgroundColor:`${r.purple}14`,borderColor:`${r.purple}2E`,borderWidth:1,paddingHorizontal:4.5,paddingVertical:1,borderRadius:3.5},dupBadgeText:{fontFamily:B.interBold,fontSize:8.5,color:r.purple},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},messageBox:{backgroundColor:r.grayBackground,borderRadius:7,borderWidth:1,borderColor:r.dividerColor,paddingHorizontal:10,paddingVertical:6,height:68,minHeight:68,maxHeight:68,justifyContent:"center",gap:2,overflow:"hidden"},messageText:{fontFamily:B.interMedium,fontSize:12,color:r.primaryBlack,lineHeight:17},highlight:{backgroundColor:r.yellowHighlight,color:r.primaryBlack,borderRadius:2},jsonPreviewRow:{flexDirection:"column",justifyContent:"center",gap:2},jsonPreviewText:{fontFamily:B.interMedium,fontSize:11,color:r.teal700,lineHeight:15},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:r.slate400},callerChip:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:r.skySoftBg,borderColor:r.skySoftBorder,borderWidth:1,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4,flexShrink:1,minWidth:0},extBadge:{borderRadius:3,paddingHorizontal:3,paddingVertical:.5},extBadgeText:{fontFamily:B.interBold,fontSize:7.5},callerChipText:{color:r.skySoftText,fontSize:9,lineHeight:12,fontFamily:B.interBold},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:B.interBold,color:r.violetSoftText,fontSize:9,lineHeight:12},prefixTag:{flexDirection:"row",alignItems:"center",gap:2.5,paddingHorizontal:5,paddingVertical:1.5,borderRadius:3.5,borderWidth:1},prefixTagText:{fontFamily:B.interBold,fontSize:8.5,letterSpacing:.3},bottomAccentBar:{height:2.5,width:"100%",borderRadius:1.5,marginTop:2}});export default ConsoleLogCard;
+                </I>}
+            </I>
+          </I>
+        </I>
+      </Ie>
+    </I>});const o=Y.create({container:{paddingHorizontal:8,paddingVertical:4,height:148,justifyContent:"center"},card:{height:140,alignSelf:"stretch",borderRadius:10,overflow:"hidden",borderWidth:1,borderColor:r.dividerColor,shadowColor:r.shadowColorString},cardBody:{height:"100%",paddingHorizontal:12,paddingTop:10,paddingBottom:8,justifyContent:"space-between"},cardHeaderRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",height:22,minHeight:22,maxHeight:22},cardHeaderLeft:{flexDirection:"row",alignItems:"center",flex:1,marginRight:8,gap:6,minWidth:0,overflow:"hidden"},cardHeaderRight:{flexDirection:"row",alignItems:"center",gap:6,flexShrink:0},serialNumber:{fontFamily:S.interBold,color: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},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},statusPill:{flexDirection:"row",alignItems:"center",gap:4,paddingHorizontal:7,paddingVertical:2.5,borderRadius:6,borderWidth:1,flexShrink:0},statusPillText:{fontFamily:S.interBold,fontSize:10,lineHeight:13},messageBox:{backgroundColor:r.grayBackground,borderRadius:7,borderWidth:1,borderColor:r.dividerColor,paddingHorizontal:10,paddingVertical:6,height:68,minHeight:68,maxHeight:68,justifyContent:"center",gap:2,overflow:"hidden"},messageText:{fontFamily:S.interMedium,fontSize:12,color:r.primaryBlack,lineHeight:17},highlight:{backgroundColor:r.yellowHighlight,color:r.primaryBlack,borderRadius:2},jsonPreviewRow:{flexDirection:"column",justifyContent:"center",gap:2},jsonPreviewText:{fontFamily:S.interMedium,fontSize:11,color:r.teal700,lineHeight:15},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},callerChip:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:r.skySoftBg,borderColor:r.skySoftBorder,borderWidth:1,paddingHorizontal:5,paddingVertical:1.5,borderRadius:4,flexShrink:1,minWidth:0},extBadge:{borderRadius:3,paddingHorizontal:3,paddingVertical:.5},extBadgeText:{fontFamily:S.interBold,fontSize:7.5},callerChipText:{color:r.skySoftText,fontSize:9,lineHeight:12,fontFamily:S.interBold},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},prefixTag:{flexDirection:"row",alignItems:"center",gap:2.5,paddingHorizontal:5,paddingVertical:1.5,borderRadius:3.5,borderWidth:1},prefixTagText:{fontFamily:S.interBold,fontSize:8.5,letterSpacing:.3},bottomAccentBar:{height:2.5,width:"100%",borderRadius:1.5,marginTop:2}});function je(R,t){return R.item===t.item&&R.searchStr===t.searchStr&&R.onPress===t.onPress}export const MemoizedConsoleLogCard=F.memo(ConsoleLogCard,je);export default MemoizedConsoleLogCard;

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

@@ -1,25 +1,23 @@
-import"react";import{Platform as z,Linking as B,ScrollView as H,StyleSheet as A,Text as C,View as T}from"react-native";import{AppColors as t}from"../../styles/AppColors";import{AppFonts as V}from"../../styles/AppFonts";import I from"../TouchableScale";import{useInspector as W}from"./InspectorContext";import{LIB_VERSION as F}from"../../constants/version";import{getAppName as L,getBundleIdentifier as $,getAppVersionAndBuild as _,copyToClipboard as v,showToast as P}from"../../helpers";import{PackageIcon as N,GitHubIcon as O,NpmIcon as E,BoltIcon as D,StarIcon as M,BookOpenIcon as U,BugIcon as G,TagIcon as Q,WifiIcon as Z,TerminalIcon as J,AnalyticsIcon as K,DatabaseIcon as X,CameraIcon as Y,CrashIcon as Te,ExternalLinkIcon as S,CopyIcon as Ce}from"../NetworkIcons";export const AboutModal=({onClose:Ve})=>{const{updateAvailable:k,latestNpmVersion:R}=W();return<T style={e.container}>
-      <H style={e.scrollView}contentContainerStyle={e.scrollContent}showsVerticalScrollIndicator={!1}>
+import"react";import{Platform as P,Linking as B,ScrollView as L,StyleSheet as F,Text as C,View as T}from"react-native";import{AppColors as t}from"../../styles/AppColors";import{AppFonts as I}from"../../styles/AppFonts";import S from"../TouchableScale";import{useInspector as N}from"./InspectorContext";import{t as V}from"../../i18n";import{LIB_VERSION as $}from"../../constants/version";import _ from"../AppHeaderLogo";import{getAppName as O,getBundleIdentifier as E,getAppVersionAndBuild as M,copyToClipboard as H,showToast as A}from"../../helpers";import{GitHubIcon as U,NpmIcon as G,BoltIcon as W,StarIcon as Q,BookOpenIcon as Z,BugIcon as J,TagIcon as K,WifiIcon as X,TerminalIcon as Y,AnalyticsIcon as Te,DatabaseIcon as Ce,CameraIcon as Ve,CrashIcon as Ie,ExternalLinkIcon as R,CopyIcon as Se}from"../NetworkIcons";export const AboutModal=({onClose:Be})=>{const{updateAvailable:z,latestNpmVersion:D}=N();return<T style={e.container}>
+      <L style={e.scrollView}contentContainerStyle={e.scrollContent}showsVerticalScrollIndicator={!1}>
         
         <T style={e.heroCard}>
           <T style={e.heroHeaderRow}>
             <T style={e.heroBrandRow}>
-              <T style={e.heroIconBox}>
-                <N color={t.brandPurple}size={24}/>
-              </T>
+              <_ size={46}shape="circle"/>
               <T style={{flex:1}}>
                 <T style={e.heroTitleRow}>
-                  <C style={e.heroTitle}>In-App Inspector</C>
+                  <C style={e.heroTitle}>{V("about.heroTitle","In-App Inspector")}</C>
                   <T style={e.versionBadge}>
-                    <C style={e.versionBadgeText}>v{F}</C>
+                    <C style={e.versionBadgeText}>v{$}</C>
                   </T>
-                  {k?<T style={e.updateBadge}>
+                  {z?<T style={e.updateBadge}>
                       <C style={e.updateBadgeText}>
-                        v{R} Available
+                        {V("about.versionAvailable","v{{version}} Available").replace("{{version}}",D||"")}
                       </C>
-                      <D size={9}color={t.amber600}/>
+                      <W size={9}color={t.amber600}/>
                     </T>:<T style={e.upToDateBadge}>
-                      <C style={e.upToDateBadgeText}>Up to date</C>
+                      <C style={e.upToDateBadgeText}>{V("about.upToDate","Up to date")}</C>
                     </T>}
                 </T>
                 <C style={e.heroPackageName}>
@@ -30,55 +28,53 @@ import"react";import{Platform as z,Linking as B,ScrollView as H,StyleSheet as A,
           </T>
 
           <C style={e.heroDescription}>
-            The all-in-one on-device debugging, logging, and QA companion for
-            React Native & Expo applications. Designed for developers, QA
-            testers, and product teams.
+            {V("about.heroDescription","The all-in-one on-device debugging, logging, and QA companion for React Native & Expo applications. Designed for developers, QA testers, and product teams.")}
           </C>
 
-          {k&&<I onPress={()=>{v("npm install react-native-inapp-inspector@latest","Install Command"),P("Copied npm upgrade command!")}}style={e.upgradeBtn}>
-              <D size={12}color={t.white}/>
+          {z&&<S onPress={()=>{H("npm install react-native-inapp-inspector@latest","Install Command"),A(V("about.copiedUpgradeCommand","Copied npm upgrade command!"))}}style={e.upgradeBtn}>
+              <W size={12}color={t.white}/>
               <C style={e.upgradeBtnText}>
-                Copy Upgrade Command (v{R})
+                {V("about.copyUpgradeCommand","Copy Upgrade Command (v{{version}})").replace("{{version}}",D||"")}
               </C>
-            </I>}
+            </S>}
         </T>
 
         
         <T style={e.sectionCard}>
-          <C style={e.sectionHeader}>APP INFORMATION</C>
+          <C style={e.sectionHeader}>{V("about.appInformation","APP INFORMATION")}</C>
 
           <T style={{gap:8}}>
             <T style={e.row}>
-              <C style={e.rowLabel}>App Name</C>
-              <C style={e.rowValueBold}>{L()}</C>
+              <C style={e.rowLabel}>{V("about.appName","App Name")}</C>
+              <C style={e.rowValueBold}>{O()}</C>
             </T>
 
             <T style={e.row}>
-              <C style={e.rowLabel}>Package Identifier</C>
-              <C style={e.rowValueRegular}>{$()}</C>
+              <C style={e.rowLabel}>{V("about.packageIdentifier","Package Identifier")}</C>
+              <C style={e.rowValueRegular}>{E()}</C>
             </T>
 
             <T style={e.row}>
-              <C style={e.rowLabel}>App Version</C>
+              <C style={e.rowLabel}>{V("about.appVersion","App Version")}</C>
               <C style={e.rowValueBold}>
-                {_().formatted}
+                {M().formatted}
               </C>
             </T>
 
             <T style={e.row}>
-              <C style={e.rowLabel}>Environment</C>
+              <C style={e.rowLabel}>{V("about.environment","Environment")}</C>
               <T style={[e.statusTag,{backgroundColor:__DEV__?`${t.amber500}20`:`${t.emerald500}20`,borderColor:__DEV__?`${t.amber500}50`:`${t.emerald500}50`}]}>
                 <C style={[e.statusTagText,{color:__DEV__?t.amber600:t.emerald600}]}>
-                  {__DEV__?"Development (Debug)":"Production (Release)"}
+                  {__DEV__?V("about.developmentDebug","Development (Debug)"):V("about.productionRelease","Production (Release)")}
                 </C>
               </T>
             </T>
 
             <T style={e.row}>
-              <C style={e.rowLabel}>Platform</C>
+              <C style={e.rowLabel}>{V("about.platform","Platform")}</C>
               <C style={e.rowValueRegular}>
-                {z.OS==="ios"?"Apple iOS":"Google Android"}{" "}
-                (v{z.Version})
+                {P.OS==="ios"?V("about.appleIos","Apple iOS"):V("about.googleAndroid","Google Android")}{" "}
+                (v{P.Version})
               </C>
             </T>
           </T>
@@ -86,85 +82,79 @@ import"react";import{Platform as z,Linking as B,ScrollView as H,StyleSheet as A,
 
         
         <T style={e.sectionCard}>
-          <C style={e.sectionHeader}>WHAT IN-APP INSPECTOR DOES</C>
+          <C style={e.sectionHeader}>{V("about.features","WHAT IN-APP INSPECTOR DOES")}</C>
 
           <T style={e.featuresList}>
             <T style={e.featureItem}>
               <T style={[e.featureIconBox,{backgroundColor:`${t.brandPurple}15`}]}>
-                <Z color={t.brandPurple}size={18}/>
+                <X color={t.brandPurple}size={18}/>
               </T>
               <T style={e.featureTextBox}>
-                <C style={e.featureTitle}>Network Traffic Monitor</C>
+                <C style={e.featureTitle}>{V("about.featureNetwork","Network Traffic Monitor")}</C>
                 <C style={e.featureDesc}>
-                  Inspect HTTP and HTTPS API requests, responses, headers, and
-                  server latency with waterfall timing charts.
+                  {V("about.featureNetworkDesc","Inspect HTTP and HTTPS API requests, responses, headers, and server latency with waterfall timing charts.")}
                 </C>
               </T>
             </T>
 
             <T style={e.featureItem}>
               <T style={[e.featureIconBox,{backgroundColor:`${t.blue500}15`}]}>
-                <J color={t.blue500}size={18}/>
+                <Y color={t.blue500}size={18}/>
               </T>
               <T style={e.featureTextBox}>
-                <C style={e.featureTitle}>Console Logger</C>
+                <C style={e.featureTitle}>{V("about.featureConsole","Console Logger")}</C>
                 <C style={e.featureDesc}>
-                  View real-time console logs, warnings, and errors with source
-                  file origins and formatted stack traces.
+                  {V("about.featureConsoleDesc","View real-time console logs, warnings, and errors with source file origins and formatted stack traces.")}
                 </C>
               </T>
             </T>
 
             <T style={e.featureItem}>
               <T style={[e.featureIconBox,{backgroundColor:`${t.firebaseOrange}15`}]}>
-                <K color={t.firebaseOrange}size={18}/>
+                <Te color={t.firebaseOrange}size={18}/>
               </T>
               <T style={e.featureTextBox}>
-                <C style={e.featureTitle}>Analytics Telemetry</C>
+                <C style={e.featureTitle}>{V("about.featureAnalytics","Analytics Telemetry")}</C>
                 <C style={e.featureDesc}>
-                  Track Firebase and custom analytics events, screen views, and
-                  user properties live on the device.
+                  {V("about.featureAnalyticsDesc","Track Firebase and custom analytics events, screen views, and user properties live on the device.")}
                 </C>
               </T>
             </T>
 
             <T style={e.featureItem}>
               <T style={[e.featureIconBox,{backgroundColor:`${t.violet600}15`}]}>
-                <X color={t.violet600}size={18}/>
+                <Ce color={t.violet600}size={18}/>
               </T>
               <T style={e.featureTextBox}>
-                <C style={e.featureTitle}>Redux State & Actions</C>
+                <C style={e.featureTitle}>{V("about.featureRedux","Redux State & Actions")}</C>
                 <C style={e.featureDesc}>
-                  Inspect dispatched actions, payloads, and state tree diffs
-                  without connecting desktop companion tools.
+                  {V("about.featureReduxDesc","Inspect dispatched actions, payloads, and state tree diffs without connecting desktop companion tools.")}
                 </C>
               </T>
             </T>
 
             <T style={e.featureItem}>
               <T style={[e.featureIconBox,{backgroundColor:`${t.teal600}15`}]}>
-                <Y color={t.teal600}size={18}/>
+                <Ve color={t.teal600}size={18}/>
               </T>
               <T style={e.featureTextBox}>
-                <C style={e.featureTitle}>Screen & Video Capture</C>
+                <C style={e.featureTitle}>{V("about.featureCapture","Screen & Video Capture")}</C>
                 <C style={e.featureDesc}>
-                  Take screenshots and record test sessions to share with QA and
-                  engineering teams instantly.
+                  {V("about.featureCaptureDesc","Take screenshots and record test sessions to share with QA and engineering teams instantly.")}
                 </C>
               </T>
             </T>
 
             <T style={e.featureItem}>
               <T style={[e.featureIconBox,{backgroundColor:`${t.emerald600}15`}]}>
-                <Te color={t.emerald600}size={18}/>
+                <Ie color={t.emerald600}size={18}/>
               </T>
               <T style={e.featureTextBox}>
                 <C style={e.featureTitle}>
-                  Crash Catcher & Diagnostics
+                  {V("about.featureCrash","Crash Catcher & Diagnostics")}
                 </C>
                 <C style={e.featureDesc}>
-                  Protects against native crashes and provides device health
-                  metrics including RAM, battery, and storage.
+                  {V("about.featureCrashDesc","Protects against native crashes and provides device health metrics including RAM, battery, and storage.")}
                 </C>
               </T>
             </T>
@@ -173,71 +163,71 @@ import"react";import{Platform as z,Linking as B,ScrollView as H,StyleSheet as A,
 
         
         <T style={e.gridContainer}>
-          <I onPress={()=>{B.openURL("https://github.com/vengatmacuser/react-native-inapp-inspector").catch(()=>{})}}style={[e.gridCard,{backgroundColor:`${t.brandPurple}0F`,borderColor:`${t.brandPurple}30`}]}>
-            <O color={t.brandPurple}size={18}/>
+          <S onPress={()=>{B.openURL("https://github.com/vengatmacuser/react-native-inapp-inspector").catch(()=>{})}}style={[e.gridCard,{backgroundColor:`${t.brandPurple}0F`,borderColor:`${t.brandPurple}30`}]}>
+            <U color={t.brandPurple}size={18}/>
             <T style={{flex:1}}>
               <T style={{flexDirection:"row",alignItems:"center",gap:5}}>
-                <M color={t.amber500}size={13}/>
-                <C style={e.gridCardTitle}>GitHub</C>
+                <Q color={t.amber500}size={13}/>
+                <C style={e.gridCardTitle}>{V("about.github","GitHub")}</C>
               </T>
-              <C style={e.gridCardSub}>Star & source code</C>
+              <C style={e.gridCardSub}>{V("about.githubSub","Star & source code")}</C>
             </T>
-            <S size={12}color={t.grayTextWeak}/>
-          </I>
+            <R size={12}color={t.grayTextWeak}/>
+          </S>
 
-          <I onPress={()=>{B.openURL("https://www.npmjs.com/package/react-native-inapp-inspector").catch(()=>{})}}style={e.gridCard}>
-            <E color={t.npmRed}size={18}/>
+          <S onPress={()=>{B.openURL("https://www.npmjs.com/package/react-native-inapp-inspector").catch(()=>{})}}style={e.gridCard}>
+            <G color={t.npmRed}size={18}/>
             <T style={{flex:1}}>
-              <C style={e.gridCardTitle}>NPM Registry</C>
-              <C style={e.gridCardSub}>Package updates</C>
+              <C style={e.gridCardTitle}>{V("about.npmRegistry","NPM Registry")}</C>
+              <C style={e.gridCardSub}>{V("about.npmRegistrySub","Package updates")}</C>
             </T>
-            <S size={12}color={t.grayTextWeak}/>
-          </I>
+            <R size={12}color={t.grayTextWeak}/>
+          </S>
 
-          <I onPress={()=>{B.openURL("https://github.com/vengatmacuser/react-native-inapp-inspector#readme").catch(()=>{})}}style={e.gridCard}>
-            <U color={t.brandPurple}size={18}/>
+          <S onPress={()=>{B.openURL("https://github.com/vengatmacuser/react-native-inapp-inspector#readme").catch(()=>{})}}style={e.gridCard}>
+            <Z color={t.brandPurple}size={18}/>
             <T style={{flex:1}}>
-              <C style={e.gridCardTitle}>Documentation</C>
-              <C style={e.gridCardSub}>Integration guide</C>
+              <C style={e.gridCardTitle}>{V("about.documentation","Documentation")}</C>
+              <C style={e.gridCardSub}>{V("about.documentationSub","Integration guide")}</C>
             </T>
-            <S size={12}color={t.grayTextWeak}/>
-          </I>
+            <R size={12}color={t.grayTextWeak}/>
+          </S>
 
-          <I onPress={()=>{B.openURL("https://github.com/vengatmacuser/react-native-inapp-inspector/issues").catch(()=>{})}}style={e.gridCard}>
-            <G color={t.errorColor}size={18}/>
+          <S onPress={()=>{B.openURL("https://github.com/vengatmacuser/react-native-inapp-inspector/issues").catch(()=>{})}}style={e.gridCard}>
+            <J color={t.errorColor}size={18}/>
             <T style={{flex:1}}>
-              <C style={e.gridCardTitle}>Report Issue</C>
-              <C style={e.gridCardSub}>Help & support</C>
+              <C style={e.gridCardTitle}>{V("about.reportIssue","Report Issue")}</C>
+              <C style={e.gridCardSub}>{V("about.reportIssueSub","Help & support")}</C>
             </T>
-            <S size={12}color={t.grayTextWeak}/>
-          </I>
+            <R size={12}color={t.grayTextWeak}/>
+          </S>
 
-          <I onPress={()=>{B.openURL("https://github.com/vengatmacuser/react-native-inapp-inspector/releases").catch(()=>{})}}style={e.gridCard}>
-            <Q color={t.successGreen}size={18}/>
+          <S onPress={()=>{B.openURL("https://github.com/vengatmacuser/react-native-inapp-inspector/releases").catch(()=>{})}}style={e.gridCard}>
+            <K color={t.successGreen}size={18}/>
             <T style={{flex:1}}>
-              <C style={e.gridCardTitle}>Release Notes</C>
-              <C style={e.gridCardSub}>What's new</C>
+              <C style={e.gridCardTitle}>{V("about.releaseNotes","Release Notes")}</C>
+              <C style={e.gridCardSub}>{V("about.releaseNotesSub","What's new")}</C>
             </T>
-            <S size={12}color={t.grayTextWeak}/>
-          </I>
+            <R size={12}color={t.grayTextWeak}/>
+          </S>
 
-          <I onPress={()=>{v("npm install react-native-inapp-inspector","NPM Command"),P("Copied package install command!")}}style={e.gridCard}>
-            <Ce color={t.brandPurple}size={16}/>
+          <S onPress={()=>{H("npm install react-native-inapp-inspector","NPM Command"),A(V("about.copiedInstallCommand","Copied package install command!"))}}style={e.gridCard}>
+            <Se color={t.brandPurple}size={16}/>
             <T style={{flex:1}}>
-              <C style={e.gridCardTitle}>Copy Install</C>
-              <C style={e.gridCardSub}>npm / yarn command</C>
+              <C style={e.gridCardTitle}>{V("about.copyInstall","Copy Install")}</C>
+              <C style={e.gridCardSub}>{V("about.copyInstallSub","npm / yarn command")}</C>
             </T>
-          </I>
+          </S>
         </T>
 
         
         <T style={e.footer}>
           <C style={e.footerText}>
-            React Native In-App Inspector · MIT License
+            {V("about.footerLicense","React Native In-App Inspector \xB7 MIT License")}
           </C>
           <C style={e.footerSubText}>
-            Zero-config on-device debugging tool
+            {V("about.footerTagline","Zero-config on-device debugging tool")}
           </C>
         </T>
-      </H>
-    </T>};const e=A.create({container:{flex:1,backgroundColor:t.grayBackground},scrollView:{flex:1},scrollContent:{padding:14,paddingBottom:32,gap:12},heroCard:{backgroundColor:t.primaryLight,borderRadius:14,padding:16,borderWidth:1,borderColor:t.dividerColor,shadowColor:t.shadowColorString,shadowOffset:{width:0,height:2},shadowOpacity:.05,shadowRadius:8,elevation:2,gap:12},heroHeaderRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},heroBrandRow:{flexDirection:"row",alignItems:"center",gap:12,flex:1},heroIconBox:{width:44,height:44,borderRadius:12,backgroundColor:`${t.brandPurple}15`,alignItems:"center",justifyContent:"center",borderWidth:1,borderColor:`${t.brandPurple}30`},heroTitleRow:{flexDirection:"row",alignItems:"center",gap:6,flexWrap:"wrap"},heroTitle:{fontFamily:V.interBold,fontSize:17,lineHeight:22,color:t.primaryBlack,letterSpacing:-.3},versionBadge:{backgroundColor:`${t.brandPurple}18`,paddingHorizontal:7,paddingVertical:2,borderRadius:6,borderWidth:1,borderColor:`${t.brandPurple}30`},versionBadgeText:{fontFamily:V.interBold,fontSize:10,lineHeight:13,color:t.brandPurple},updateBadge:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:`${t.amber500}20`,paddingHorizontal:6,paddingVertical:2,borderRadius:6,borderWidth:1,borderColor:`${t.amber500}50`},updateBadgeText:{fontFamily:V.interBold,fontSize:9.5,lineHeight:12,color:t.amber600},upToDateBadge:{backgroundColor:`${t.emerald500}18`,paddingHorizontal:6,paddingVertical:2,borderRadius:6,borderWidth:1,borderColor:`${t.emerald500}35`},upToDateBadgeText:{fontFamily:V.interMedium,fontSize:9.5,lineHeight:12,color:t.emerald600},heroPackageName:{fontFamily:V.interRegular,fontSize:12,lineHeight:16,color:t.grayTextWeak,marginTop:2},heroDescription:{fontFamily:V.interRegular,fontSize:13,lineHeight:18,color:t.grayText},upgradeBtn:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,backgroundColor:t.brandPurple,paddingVertical:9,paddingHorizontal:12,borderRadius:8},upgradeBtnText:{fontFamily:V.interBold,fontSize:12,color:t.white},sectionCard:{backgroundColor:t.primaryLight,borderRadius:14,padding:14,borderWidth:1,borderColor:t.dividerColor,gap:10},sectionHeader:{fontFamily:V.interBold,fontSize:11,lineHeight:15,color:t.grayTextWeak,letterSpacing:.6},row:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",paddingVertical:3},rowLabel:{fontFamily:V.interRegular,fontSize:12.5,lineHeight:17,color:t.grayTextWeak},rowValueBold:{fontFamily:V.interBold,fontSize:12.5,lineHeight:17,color:t.primaryBlack},rowValueRegular:{fontFamily:V.interRegular,fontSize:12.5,lineHeight:17,color:t.grayTextStrong},statusTag:{paddingHorizontal:7,paddingVertical:2,borderRadius:6,borderWidth:1},statusTagText:{fontFamily:V.interSemiBold,fontSize:10.5,lineHeight:14},featuresList:{gap:10},featureItem:{flexDirection:"row",alignItems:"flex-start",gap:12,paddingVertical:4},featureIconBox:{width:36,height:36,borderRadius:10,alignItems:"center",justifyContent:"center"},featureTextBox:{flex:1,gap:2},featureTitle:{fontFamily:V.interBold,fontSize:13,lineHeight:17,color:t.primaryBlack},featureDesc:{fontFamily:V.interRegular,fontSize:11.5,lineHeight:16,color:t.grayTextWeak},gridContainer:{flexDirection:"row",flexWrap:"wrap",gap:8},gridCard:{width:"48.5%",flexGrow:1,backgroundColor:t.primaryLight,borderRadius:10,padding:12,flexDirection:"row",alignItems:"center",gap:9,borderWidth:1,borderColor:t.dividerColor},gridCardTitle:{fontFamily:V.interBold,fontSize:12,lineHeight:16,color:t.primaryBlack},gridCardSub:{fontFamily:V.interRegular,fontSize:10,lineHeight:13,color:t.grayTextWeak},footer:{alignItems:"center",justifyContent:"center",paddingVertical:14,gap:3},footerText:{fontFamily:V.interMedium,fontSize:11,lineHeight:15,color:t.grayTextWeak},footerSubText:{fontFamily:V.interRegular,fontSize:10,lineHeight:14,color:t.slate400}});export default AboutModal;
+      </L>
+    </T>};const e=F.create({container:{flex:1,backgroundColor:t.grayBackground},scrollView:{flex:1},scrollContent:{padding:14,paddingBottom:32,gap:12},heroCard:{backgroundColor:t.primaryLight,borderRadius:14,padding:16,borderWidth:1,borderColor:t.dividerColor,shadowColor:t.shadowColorString,shadowOffset:{width:0,height:2},shadowOpacity:.05,shadowRadius:8,elevation:2,gap:12},heroHeaderRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between"},heroBrandRow:{flexDirection:"row",alignItems:"center",gap:12,flex:1},heroIconBox:{width:44,height:44,borderRadius:12,backgroundColor:`${t.brandPurple}15`,alignItems:"center",justifyContent:"center",borderWidth:1,borderColor:`${t.brandPurple}30`},heroTitleRow:{flexDirection:"row",alignItems:"center",gap:6,flexWrap:"wrap"},heroTitle:{fontFamily:I.interBold,fontSize:17,lineHeight:22,color:t.primaryBlack,letterSpacing:-.3},versionBadge:{backgroundColor:`${t.brandPurple}18`,paddingHorizontal:7,paddingVertical:2,borderRadius:6,borderWidth:1,borderColor:`${t.brandPurple}30`},versionBadgeText:{fontFamily:I.interBold,fontSize:10,lineHeight:13,color:t.brandPurple},updateBadge:{flexDirection:"row",alignItems:"center",gap:3,backgroundColor:`${t.amber500}20`,paddingHorizontal:6,paddingVertical:2,borderRadius:6,borderWidth:1,borderColor:`${t.amber500}50`},updateBadgeText:{fontFamily:I.interBold,fontSize:9.5,lineHeight:12,color:t.amber600},upToDateBadge:{backgroundColor:`${t.emerald500}18`,paddingHorizontal:6,paddingVertical:2,borderRadius:6,borderWidth:1,borderColor:`${t.emerald500}35`},upToDateBadgeText:{fontFamily:I.interMedium,fontSize:9.5,lineHeight:12,color:t.emerald600},heroPackageName:{fontFamily:I.interRegular,fontSize:12,lineHeight:16,color:t.grayTextWeak,marginTop:2},heroDescription:{fontFamily:I.interRegular,fontSize:13,lineHeight:18,color:t.grayText},upgradeBtn:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,backgroundColor:t.brandPurple,paddingVertical:9,paddingHorizontal:12,borderRadius:8},upgradeBtnText:{fontFamily:I.interBold,fontSize:12,color:t.white},sectionCard:{backgroundColor:t.primaryLight,borderRadius:14,padding:14,borderWidth:1,borderColor:t.dividerColor,gap:10},sectionHeader:{fontFamily:I.interBold,fontSize:11,lineHeight:15,color:t.grayTextWeak,letterSpacing:.6},row:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",paddingVertical:3},rowLabel:{fontFamily:I.interRegular,fontSize:12.5,lineHeight:17,color:t.grayTextWeak},rowValueBold:{fontFamily:I.interBold,fontSize:12.5,lineHeight:17,color:t.primaryBlack},rowValueRegular:{fontFamily:I.interRegular,fontSize:12.5,lineHeight:17,color:t.grayTextStrong},statusTag:{paddingHorizontal:7,paddingVertical:2,borderRadius:6,borderWidth:1},statusTagText:{fontFamily:I.interSemiBold,fontSize:10.5,lineHeight:14},featuresList:{gap:10},featureItem:{flexDirection:"row",alignItems:"flex-start",gap:12,paddingVertical:4},featureIconBox:{width:36,height:36,borderRadius:10,alignItems:"center",justifyContent:"center"},featureTextBox:{flex:1,gap:2},featureTitle:{fontFamily:I.interBold,fontSize:13,lineHeight:17,color:t.primaryBlack},featureDesc:{fontFamily:I.interRegular,fontSize:11.5,lineHeight:16,color:t.grayTextWeak},gridContainer:{flexDirection:"row",flexWrap:"wrap",gap:8},gridCard:{width:"48.5%",flexGrow:1,backgroundColor:t.primaryLight,borderRadius:10,padding:12,flexDirection:"row",alignItems:"center",gap:9,borderWidth:1,borderColor:t.dividerColor},gridCardTitle:{fontFamily:I.interBold,fontSize:12,lineHeight:16,color:t.primaryBlack},gridCardSub:{fontFamily:I.interRegular,fontSize:10,lineHeight:13,color:t.grayTextWeak},footer:{alignItems:"center",justifyContent:"center",paddingVertical:14,gap:3},footerText:{fontFamily:I.interMedium,fontSize:11,lineHeight:15,color:t.grayTextWeak},footerSubText:{fontFamily:I.interRegular,fontSize:10,lineHeight:14,color:t.slate400}});export default AboutModal;