react-native-inapp-inspector 2.4.0 → 2.4.2

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

@@ -0,0 +1,125 @@
+import"react";import{Modal as D,View as T,Text as C,StyleSheet as V,Pressable as H,Platform as j,Linking as R,ScrollView as P}from"react-native";import S from"../TouchableScale";import{AppColors as t}from"../../styles/AppColors";import{AppFonts as I}from"../../styles/AppFonts";import{SupportIcon as F,CloseWhite as O,ExternalLinkIcon as W,StarIcon as L,BugIcon as $,BookOpenIcon as A}from"../NetworkIcons";import{triggerNativeHaptic as N}from"../../native/NativeInspector";import{useTranslation as E}from"../../i18n";export const SupportModal=({visible:z,onClose:B})=>{const{t:f}=E();if(!z)return null;const k=async v=>{try{N("light"),await R.canOpenURL(v)&&await R.openURL(v)}catch{}};return<D visible={z}transparent={!0}animationType="fade"onRequestClose={B}>
+      <T style={e.overlay}>
+        <H style={e.backdrop}onPress={B}/>
+
+        <T style={e.card}>
+          
+          <T style={e.header}>
+            <T style={e.headerLeft}>
+              <T style={e.headerIconBadge}>
+                <F size={20}color={t.purple}/>
+              </T>
+              <T>
+                <C style={e.title}>
+                  {f("support.title","Support & Community")}
+                </C>
+                <C style={e.subtitle}>
+                  {f("support.subtitle","React Native In-App Inspector")}
+                </C>
+              </T>
+            </T>
+
+            <S onPress={B}hitSlop={10}style={e.closeBtn}>
+              <O size={12}color={t.grayText}/>
+            </S>
+          </T>
+
+          
+          <P style={e.scrollList}contentContainerStyle={e.scrollContent}showsVerticalScrollIndicator={!1}>
+            
+            <S onPress={()=>k("https://github.com/sponsors/vengatmacuser")}style={[e.itemCard,e.itemCardHighlight]}>
+              <T style={[e.itemIconWrap,e.sponsorIconWrap]}>
+                <C style={e.emojiIcon}>💖</C>
+              </T>
+              <T style={e.itemTextCol}>
+                <T style={e.itemTitleRow}>
+                  <C style={[e.itemTitle,e.sponsorTitle]}>
+                    {f("support.sponsor","Sponsor on GitHub")}
+                  </C>
+                  <T style={e.heartBadge}>
+                    <C style={e.heartBadgeText}>
+                      {f("support.sponsorBadge","SPONSOR")}
+                    </C>
+                  </T>
+                </T>
+                <C style={e.itemDesc}>
+                  {f("support.sponsorDesc","Support ongoing maintenance, new features and release improvements.")}
+                </C>
+              </T>
+              <W size={14}color={t.pink600}/>
+            </S>
+
+            
+            <S onPress={()=>k("https://github.com/vengatmacuser/react-native-inapp-inspector")}style={e.itemCard}>
+              <T style={[e.itemIconWrap,e.starIconWrap]}>
+                <L size={18}color={t.amber600}/>
+              </T>
+              <T style={e.itemTextCol}>
+                <C style={e.itemTitle}>
+                  {f("support.star","Star on GitHub")}
+                </C>
+                <C style={e.itemDesc}>
+                  {f("support.starDesc","Star our repo to help more React Native developers discover this tool.")}
+                </C>
+              </T>
+              <W size={14}color={t.grayTextWeak}/>
+            </S>
+
+            
+            <S onPress={()=>k("https://github.com/vengatmacuser/react-native-inapp-inspector/issues")}style={e.itemCard}>
+              <T style={[e.itemIconWrap,e.bugIconWrap]}>
+                <$ size={18}color={t.purple}/>
+              </T>
+              <T style={e.itemTextCol}>
+                <C style={e.itemTitle}>
+                  {f("support.issues","Report Issue / Suggestion")}
+                </C>
+                <C style={e.itemDesc}>
+                  {f("support.issuesDesc","Found a bug or have an idea? Open an issue on GitHub.")}
+                </C>
+              </T>
+              <W size={14}color={t.grayTextWeak}/>
+            </S>
+
+            
+            <S onPress={()=>k("https://vengatmacuser.github.io/react-native-inapp-inspector/")}style={e.itemCard}>
+              <T style={[e.itemIconWrap,e.docsIconWrap]}>
+                <A size={18}color={t.sky600}/>
+              </T>
+              <T style={e.itemTextCol}>
+                <C style={e.itemTitle}>
+                  {f("support.docs","Official Documentation")}
+                </C>
+                <C style={e.itemDesc}>
+                  {f("support.docsDesc","Interactive feature tour, search syntax & configuration guides.")}
+                </C>
+              </T>
+              <W size={14}color={t.grayTextWeak}/>
+            </S>
+
+            
+            <S onPress={()=>k("mailto:vengatmacuser@gmail.com")}style={e.itemCard}>
+              <T style={[e.itemIconWrap,e.contactIconWrap]}>
+                <C style={e.mailEmoji}>✉️</C>
+              </T>
+              <T style={e.itemTextCol}>
+                <C style={e.itemTitle}>
+                  {f("support.contact","Contact Author")}
+                </C>
+                <C style={e.itemDesc}>
+                  {f("support.contactDesc","vengatmacuser@gmail.com \u2022 Direct support & enterprise inquiries.")}
+                </C>
+              </T>
+              <W size={14}color={t.grayTextWeak}/>
+            </S>
+          </P>
+
+          
+          <T style={e.footer}>
+            <S onPress={B}style={e.doneBtn}>
+              <C style={e.doneBtnText}>{f("common.close","Close")}</C>
+            </S>
+          </T>
+        </T>
+      </T>
+    </D>};const e=V.create({overlay:{flex:1,backgroundColor:`${t.slate900}B0`,justifyContent:"center",alignItems:"center",paddingHorizontal:18},backdrop:{...V.absoluteFillObject},card:{width:"100%",maxWidth:380,maxHeight:"82%",backgroundColor:t.white,borderRadius:24,overflow:"hidden",borderWidth:1,borderColor:`${t.white}CC`,...j.select({ios:{shadowColor:t.slate900,shadowOffset:{width:0,height:16},shadowOpacity:.3,shadowRadius:28},android:{elevation:16}})},header:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:18,paddingTop:18,paddingBottom:14,borderBottomWidth:V.hairlineWidth,borderBottomColor:t.grayBorderSecondary},headerLeft:{flexDirection:"row",alignItems:"center",gap:12},headerIconBadge:{width:38,height:38,borderRadius:12,backgroundColor:t.purple50,borderWidth:1,borderColor:t.purple200,alignItems:"center",justifyContent:"center"},title:{fontFamily:I.interBold,fontSize:15.5,color:t.slate900},subtitle:{fontFamily:I.interRegular,fontSize:11.5,color:t.grayTextWeak,marginTop:1},closeBtn:{width:28,height:28,borderRadius:14,backgroundColor:t.graySurface,alignItems:"center",justifyContent:"center"},scrollList:{maxHeight:380},scrollContent:{padding:16,gap:10},itemCard:{flexDirection:"row",alignItems:"center",padding:12,borderRadius:14,backgroundColor:t.grayBackground,borderWidth:1,borderColor:t.grayBorderSecondary,gap:12},itemCardHighlight:{backgroundColor:`${t.pink100}55`,borderColor:`${t.pink400}66`},itemIconWrap:{width:36,height:36,borderRadius:10,borderWidth:1,alignItems:"center",justifyContent:"center"},sponsorIconWrap:{backgroundColor:t.pink100,borderColor:`${t.pink400}80`},starIconWrap:{backgroundColor:t.amber100,borderColor:t.amber200},bugIconWrap:{backgroundColor:t.purple50,borderColor:t.purple200},docsIconWrap:{backgroundColor:t.sky100,borderColor:`${t.sky600}40`},contactIconWrap:{backgroundColor:t.graySurface,borderColor:t.grayBorderSecondary},emojiIcon:{fontSize:18},mailEmoji:{fontSize:16},itemTextCol:{flex:1},itemTitleRow:{flexDirection:"row",alignItems:"center",gap:6},itemTitle:{fontFamily:I.interBold,fontSize:13,color:t.slate900},sponsorTitle:{color:t.pink600},itemDesc:{fontFamily:I.interRegular,fontSize:11,color:t.grayTextWeak,marginTop:2,lineHeight:15},heartBadge:{paddingHorizontal:6,paddingVertical:1,borderRadius:6,backgroundColor:t.pink100,borderWidth:.5,borderColor:t.pink400},heartBadgeText:{fontFamily:I.interBold,fontSize:9,color:t.pink600},footer:{paddingHorizontal:16,paddingVertical:12,borderTopWidth:V.hairlineWidth,borderTopColor:t.grayBorderSecondary,backgroundColor:t.white},doneBtn:{height:42,borderRadius:12,backgroundColor:t.purple,alignItems:"center",justifyContent:"center"},doneBtnText:{fontFamily:I.interBold,fontSize:13.5,color:t.white}});

package/dist/esm/components/Inspector/SupportPage.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export interface SupportPageProps {
+    onClose?: () => void;
+}
+export declare const SupportPage: React.FC<SupportPageProps>;

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

@@ -0,0 +1,227 @@
+import"react";import{Linking as O,Platform as V,ScrollView as $,Share as N,StyleSheet as L,Text as C,View as T}from"react-native";import{AppColors as o}from"../../styles/AppColors";import{AppFonts as R}from"../../styles/AppFonts";import B from"../TouchableScale";import{LIB_VERSION as j}from"../../constants/version";import{copyToClipboard as k,showToast as D}from"../../helpers";import{useTranslation as M}from"../../i18n";import{triggerNativeHaptic as F}from"../../native/NativeInspector";import{BookOpenIcon as U,BugIcon as G,CopyIcon as A,ExternalLinkIcon as W,GitHubIcon as Y,HeartIcon as H,NpmIcon as J,ShareIcon as Q,StarIcon as Z}from"../NetworkIcons";export const SupportPage=()=>{const{t:S}=M(),I=async P=>{try{F("light"),await O.canOpenURL(P)&&await O.openURL(P)}catch{}},E=async()=>{try{F("medium"),await N.share({title:"React Native In-App Inspector",message:`Check out react-native-inapp-inspector \u2014 the zero-config in-app debugger for React Native & Expo:
+https://github.com/vengatmacuser/react-native-inapp-inspector`,url:"https://github.com/vengatmacuser/react-native-inapp-inspector"})}catch{}};return<T style={e.container}>
+      <$ style={e.scrollView}contentContainerStyle={e.scrollContent}showsVerticalScrollIndicator={!1}>
+        
+        <T style={e.heroCard}>
+          <T style={e.heroHeaderRow}>
+            <T style={e.heroIconBox}>
+              <H color={o.red500}size={28}/>
+            </T>
+            <T style={e.heroTitleCol}>
+              <T style={e.heroTitleRow}>
+                <C style={e.heroTitle}>
+                  {S("support.title","Support & Community")}
+                </C>
+                <T style={e.versionBadge}>
+                  <C style={e.versionBadgeText}>v{j}</C>
+                </T>
+              </T>
+              <C style={e.heroSubTitle}>
+                {S("support.subtitle","React Native In-App Inspector")}
+              </C>
+            </T>
+          </T>
+
+          <C style={e.heroDescription}>
+            {S("support.heroDescription","Crafted with passion to provide an all-in-one on-device debugging suite for mobile teams worldwide. Your sponsorship, stars, and feedback directly fuel continuous improvements, native architecture support, and rapid releases.")}
+          </C>
+
+          
+          <T style={e.pillRow}>
+            <T style={e.pillBadge}>
+              <C style={e.pillBadgeText}>MIT LICENSE</C>
+            </T>
+            <T style={e.pillBadge}>
+              <C style={e.pillBadgeText}>ZERO CONFIG</C>
+            </T>
+            <T style={e.pillBadge}>
+              <C style={e.pillBadgeText}>FABRIC & TURBO</C>
+            </T>
+          </T>
+        </T>
+
+        
+        <T style={e.sponsorCard}>
+          <T style={e.sponsorTopRow}>
+            <T style={e.sponsorIconWrap}>
+              <H color={o.red500}size={22}/>
+            </T>
+            <T style={e.sponsorTextWrap}>
+              <T style={e.sponsorTitleRow}>
+                <C style={e.sponsorTitle}>
+                  {S("support.sponsor","Sponsor on GitHub")}
+                </C>
+                <T style={e.sponsorPill}>
+                  <C style={e.sponsorPillText}>
+                    {S("support.sponsorBadge","SPONSOR")}
+                  </C>
+                </T>
+              </T>
+              <C style={e.sponsorDesc}>
+                {S("support.sponsorDesc","Support ongoing maintenance, new features and release improvements.")}
+              </C>
+            </T>
+          </T>
+
+          <T style={e.sponsorActionsRow}>
+            <B onPress={()=>I("https://github.com/sponsors/vengatmacuser")}style={e.primarySponsorBtn}>
+              <H color={o.white}size={15}/>
+              <C style={e.primarySponsorBtnText}>
+                {S("support.sponsorBtn","Become a Sponsor")}
+              </C>
+              <W size={12}color={o.white}/>
+            </B>
+
+            <B onPress={()=>{k("https://github.com/sponsors/vengatmacuser","Sponsor URL"),D(S("support.copiedSponsor","Copied GitHub Sponsors link!"))}}style={e.secondaryBtn}>
+              <A size={14}color={o.grayText}/>
+              <C style={e.secondaryBtnText}>
+                {S("common.copy","Copy Link")}
+              </C>
+            </B>
+          </T>
+        </T>
+
+        
+        <T style={e.sectionCard}>
+          <C style={e.sectionHeader}>
+            {S("support.waysToSupport","WAYS TO CONTRIBUTE & SUPPORT")}
+          </C>
+
+          <T style={e.actionsList}>
+            
+            <B onPress={()=>I("https://github.com/vengatmacuser/react-native-inapp-inspector")}style={e.itemCard}>
+              <T style={[e.itemIconWrap,e.starIconWrap]}>
+                <Z size={18}color={o.amber600}/>
+              </T>
+              <T style={e.itemTextCol}>
+                <T style={e.itemTitleRow}>
+                  <C style={e.itemTitle}>
+                    {S("support.star","Star on GitHub")}
+                  </C>
+                  <T style={e.badgeAmber}>
+                    <C style={e.badgeAmberText}>RECOMMENDED</C>
+                  </T>
+                </T>
+                <C style={e.itemDesc}>
+                  {S("support.starDesc","Star our repo to help more React Native developers discover this tool.")}
+                </C>
+              </T>
+              <W size={14}color={o.grayTextWeak}/>
+            </B>
+
+            
+            <B onPress={()=>I("https://github.com/vengatmacuser/react-native-inapp-inspector/issues")}style={e.itemCard}>
+              <T style={[e.itemIconWrap,e.bugIconWrap]}>
+                <G size={18}color={o.purple}/>
+              </T>
+              <T style={e.itemTextCol}>
+                <C style={e.itemTitle}>
+                  {S("support.issues","Report Issue / Suggestion")}
+                </C>
+                <C style={e.itemDesc}>
+                  {S("support.issuesDesc","Found a bug or have an idea? Open an issue on GitHub.")}
+                </C>
+              </T>
+              <W size={14}color={o.grayTextWeak}/>
+            </B>
+
+            
+            <B onPress={()=>I("https://vengatmacuser.github.io/react-native-inapp-inspector/")}style={e.itemCard}>
+              <T style={[e.itemIconWrap,e.docsIconWrap]}>
+                <U size={18}color={o.sky600}/>
+              </T>
+              <T style={e.itemTextCol}>
+                <C style={e.itemTitle}>
+                  {S("support.docs","Official Documentation")}
+                </C>
+                <C style={e.itemDesc}>
+                  {S("support.docsDesc","Interactive feature tour, search syntax & configuration guides.")}
+                </C>
+              </T>
+              <W size={14}color={o.grayTextWeak}/>
+            </B>
+
+            
+            <B onPress={()=>I("https://www.npmjs.com/package/react-native-inapp-inspector")}style={e.itemCard}>
+              <T style={[e.itemIconWrap,e.npmIconWrap]}>
+                <J size={18}color={o.red500}/>
+              </T>
+              <T style={e.itemTextCol}>
+                <C style={e.itemTitle}>
+                  {S("support.npmRegistry","NPM Package Registry")}
+                </C>
+                <C style={e.itemDesc}>
+                  {S("support.npmRegistryDesc","Explore published version release notes, tarball sizes, and install stats.")}
+                </C>
+              </T>
+              <W size={14}color={o.grayTextWeak}/>
+            </B>
+          </T>
+        </T>
+
+        
+        <T style={e.sectionCard}>
+          <C style={e.sectionHeader}>
+            {S("support.shareTitle","SPREAD THE WORD")}
+          </C>
+          <C style={e.shareSubtitle}>
+            {S("support.shareDesc","Help your engineering teammates and QA specialists debug network, console logs, and Redux faster.")}
+          </C>
+          <T style={e.shareButtonsRow}>
+            <B onPress={E}style={e.sharePrimaryBtn}>
+              <Q size={15}color={o.white}/>
+              <C style={e.sharePrimaryBtnText}>
+                {S("support.shareWithTeam","Share with Teammates")}
+              </C>
+            </B>
+
+            <B onPress={()=>{k("https://github.com/vengatmacuser/react-native-inapp-inspector","Repository Link"),D(S("support.copiedRepo","Copied repository link!"))}}style={e.shareSecondaryBtn}>
+              <A size={14}color={o.grayText}/>
+              <C style={e.shareSecondaryBtnText}>
+                {S("support.copyRepo","Copy Repo URL")}
+              </C>
+            </B>
+          </T>
+        </T>
+
+        
+        <T style={e.authorCard}>
+          <C style={e.sectionHeader}>
+            {S("support.maintainer","PROJECT MAINTAINER")}
+          </C>
+          <T style={e.authorRow}>
+            <T style={e.authorAvatar}>
+              <C style={e.authorAvatarText}>VB</C>
+            </T>
+            <T style={e.authorTextCol}>
+              <C style={e.authorName}>Vengateswaran Balakrishnan</C>
+              <C style={e.authorRole}>
+                Creator & Core Maintainer • @vengatmacuser
+              </C>
+              <C style={e.authorEmail}>vengatmacuser@gmail.com</C>
+            </T>
+          </T>
+
+          <T style={e.authorActionsRow}>
+            <B onPress={()=>I("mailto:vengatmacuser@gmail.com")}style={e.authorActionBtn}>
+              <C style={e.authorActionEmoji}>✉️</C>
+              <C style={e.authorActionText}>
+                {S("support.sendEmail","Send Email")}
+              </C>
+            </B>
+
+            <B onPress={()=>{k("vengatmacuser@gmail.com","Author Email"),D(S("support.copiedEmail","Copied email address!"))}}style={e.authorActionBtn}>
+              <A size={13}color={o.grayText}/>
+              <C style={e.authorActionText}>
+                {S("support.copyEmail","Copy Email")}
+              </C>
+            </B>
+
+            <B onPress={()=>I("https://github.com/vengatmacuser")}style={e.authorActionBtn}>
+              <Y size={14}color={o.grayText}/>
+              <C style={e.authorActionText}>GitHub</C>
+            </B>
+          </T>
+        </T>
+      </$>
+    </T>};const e=L.create({container:{flex:1,backgroundColor:o.primaryLight},scrollView:{flex:1},scrollContent:{padding:16,paddingBottom:V.OS==="ios"?44:24,gap:16},heroCard:{backgroundColor:o.white,borderRadius:16,padding:16,borderWidth:1,borderColor:`${o.red500}25`,...V.select({ios:{shadowColor:o.red500,shadowOffset:{width:0,height:4},shadowOpacity:.08,shadowRadius:10},android:{elevation:3}})},heroHeaderRow:{flexDirection:"row",alignItems:"center",gap:12,marginBottom:12},heroIconBox:{width:48,height:48,borderRadius:14,backgroundColor:`${o.red500}15`,borderWidth:1,borderColor:`${o.red500}30`,alignItems:"center",justifyContent:"center"},heroTitleCol:{flex:1},heroTitleRow:{flexDirection:"row",alignItems:"center",gap:8},heroTitle:{fontFamily:R.interBold,fontSize:18,color:o.slate900,letterSpacing:-.3},versionBadge:{backgroundColor:o.primaryLight,paddingHorizontal:7,paddingVertical:2,borderRadius:6,borderWidth:1,borderColor:o.grayBorderSecondary},versionBadgeText:{fontFamily:R.interBold,fontSize:10,color:o.grayText},heroSubTitle:{fontFamily:R.interMedium,fontSize:12,color:o.grayTextWeak,marginTop:2},heroDescription:{fontFamily:R.interRegular,fontSize:12.5,lineHeight:18,color:o.grayText,marginBottom:12},pillRow:{flexDirection:"row",alignItems:"center",gap:6,flexWrap:"wrap"},pillBadge:{backgroundColor:o.graySurface,paddingHorizontal:8,paddingVertical:3,borderRadius:6,borderWidth:1,borderColor:o.grayBorderSecondary},pillBadgeText:{fontFamily:R.interBold,fontSize:9.5,letterSpacing:.4,color:o.grayTextWeak},sponsorCard:{backgroundColor:o.white,borderRadius:16,padding:16,borderWidth:1,borderColor:`${o.red500}35`,...V.select({ios:{shadowColor:o.red500,shadowOffset:{width:0,height:4},shadowOpacity:.1,shadowRadius:12},android:{elevation:3}})},sponsorTopRow:{flexDirection:"row",alignItems:"flex-start",gap:12},sponsorIconWrap:{width:42,height:42,borderRadius:12,backgroundColor:`${o.red500}18`,borderWidth:1,borderColor:`${o.red500}35`,alignItems:"center",justifyContent:"center"},sponsorTextWrap:{flex:1},sponsorTitleRow:{flexDirection:"row",alignItems:"center",gap:8},sponsorTitle:{fontFamily:R.interBold,fontSize:15,color:o.slate900},sponsorPill:{backgroundColor:`${o.red500}20`,paddingHorizontal:6,paddingVertical:2,borderRadius:6,borderWidth:1,borderColor:`${o.red500}40`},sponsorPillText:{fontFamily:R.interBold,fontSize:9,letterSpacing:.5,color:o.red500},sponsorDesc:{fontFamily:R.interRegular,fontSize:12,lineHeight:17,color:o.grayText,marginTop:4},sponsorActionsRow:{flexDirection:"row",alignItems:"center",gap:8,marginTop:14},primarySponsorBtn:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,backgroundColor:o.red500,paddingVertical:10,paddingHorizontal:12,borderRadius:10,...V.select({ios:{shadowColor:o.red500,shadowOffset:{width:0,height:3},shadowOpacity:.35,shadowRadius:6},android:{elevation:3}})},primarySponsorBtnText:{fontFamily:R.interBold,fontSize:12.5,color:o.white},secondaryBtn:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:5,backgroundColor:o.graySurface,borderWidth:1,borderColor:o.grayBorderSecondary,paddingVertical:10,paddingHorizontal:12,borderRadius:10},secondaryBtnText:{fontFamily:R.interSemiBold,fontSize:12,color:o.grayText},sectionCard:{backgroundColor:o.white,borderRadius:16,padding:16,borderWidth:1,borderColor:o.grayBorderSecondary,...V.select({ios:{shadowColor:o.slate900,shadowOffset:{width:0,height:2},shadowOpacity:.04,shadowRadius:6},android:{elevation:2}})},sectionHeader:{fontFamily:R.interBold,fontSize:11,letterSpacing:.6,color:o.grayTextWeak,marginBottom:12},actionsList:{gap:10},itemCard:{flexDirection:"row",alignItems:"center",gap:12,padding:12,borderRadius:12,backgroundColor:o.graySurface,borderWidth:1,borderColor:o.grayBorderSecondary},itemIconWrap:{width:38,height:38,borderRadius:10,alignItems:"center",justifyContent:"center"},starIconWrap:{backgroundColor:`${o.amber500}18`,borderWidth:1,borderColor:`${o.amber500}35`},bugIconWrap:{backgroundColor:`${o.purple}18`,borderWidth:1,borderColor:`${o.purple}35`},docsIconWrap:{backgroundColor:`${o.sky500}18`,borderWidth:1,borderColor:`${o.sky500}35`},npmIconWrap:{backgroundColor:`${o.red500}18`,borderWidth:1,borderColor:`${o.red500}35`},itemTextCol:{flex:1},itemTitleRow:{flexDirection:"row",alignItems:"center",gap:8},itemTitle:{fontFamily:R.interBold,fontSize:13,color:o.slate900},badgeAmber:{backgroundColor:`${o.amber500}20`,paddingHorizontal:5,paddingVertical:1.5,borderRadius:5,borderWidth:1,borderColor:`${o.amber500}45`},badgeAmberText:{fontFamily:R.interBold,fontSize:8.5,letterSpacing:.3,color:o.amber600},itemDesc:{fontFamily:R.interRegular,fontSize:11.5,lineHeight:16,color:o.grayTextWeak,marginTop:2},shareSubtitle:{fontFamily:R.interRegular,fontSize:12,lineHeight:17,color:o.grayText,marginBottom:12},shareButtonsRow:{flexDirection:"row",alignItems:"center",gap:8},sharePrimaryBtn:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,backgroundColor:o.indigo600,paddingVertical:10,paddingHorizontal:12,borderRadius:10},sharePrimaryBtnText:{fontFamily:R.interBold,fontSize:12,color:o.white},shareSecondaryBtn:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:5,backgroundColor:o.graySurface,borderWidth:1,borderColor:o.grayBorderSecondary,paddingVertical:10,paddingHorizontal:12,borderRadius:10},shareSecondaryBtnText:{fontFamily:R.interSemiBold,fontSize:12,color:o.grayText},authorCard:{backgroundColor:o.white,borderRadius:16,padding:16,borderWidth:1,borderColor:o.grayBorderSecondary,...V.select({ios:{shadowColor:o.slate900,shadowOffset:{width:0,height:2},shadowOpacity:.04,shadowRadius:6},android:{elevation:2}})},authorRow:{flexDirection:"row",alignItems:"center",gap:12,marginBottom:14},authorAvatar:{width:44,height:44,borderRadius:22,backgroundColor:o.indigo600,alignItems:"center",justifyContent:"center"},authorAvatarText:{fontFamily:R.interBold,fontSize:15,color:o.white},authorTextCol:{flex:1},authorName:{fontFamily:R.interBold,fontSize:14,color:o.slate900},authorRole:{fontFamily:R.interRegular,fontSize:11.5,color:o.grayTextWeak,marginTop:1},authorEmail:{fontFamily:R.interMedium,fontSize:11,color:o.indigo600,marginTop:2},authorActionsRow:{flexDirection:"row",alignItems:"center",gap:8},authorActionBtn:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center",gap:5,backgroundColor:o.graySurface,borderWidth:1,borderColor:o.grayBorderSecondary,paddingVertical:8,paddingHorizontal:8,borderRadius:8},authorActionEmoji:{fontSize:12},authorActionText:{fontFamily:R.interSemiBold,fontSize:11,color:o.grayText}});

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

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

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

@@ -1,37 +1,37 @@
-import{useState as M,useEffect as F}from"react";import{Modal as G,View as C,Text as S,TouchableOpacity as O,StyleSheet as Y,Animated as T,Linking as J}from"react-native";import B,{Path as L}from"react-native-svg";import{BrandCircleIcon as K}from"../BrandCircleIcon";import{NpmIcon as Q}from"../NetworkIcons";import{LIB_VERSION as X}from"../../constants";import{copyToClipboard as Z}from"../../helpers";import{showToast as $}from"../../helpers/toast";import{AppFonts as P}from"../../styles/AppFonts";import{AppColors as e}from"../../styles/AppColors";const Ce=({size:o=14,color:r=e.grayTextWeak})=><B width={o}height={o}viewBox="0 0 24 24"fill="none">
+import{useState as D,useEffect as F}from"react";import{Modal as G,View as C,Text as S,TouchableOpacity as O,StyleSheet as Y,Animated as T,Linking as J}from"react-native";import W,{Path as L}from"react-native-svg";import K from"../AppHeaderLogo";import{NpmIcon as Q}from"../NetworkIcons";import{LIB_VERSION as X}from"../../constants";import{copyToClipboard as Z}from"../../helpers";import{showToast as $}from"../../helpers/toast";import{AppFonts as N}from"../../styles/AppFonts";import{AppColors as e}from"../../styles/AppColors";import{t as B}from"../../i18n";const Ce=({size:o=14,color:r=e.grayTextWeak})=><W width={o}height={o}viewBox="0 0 24 24"fill="none">
     <L d="M8 4v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2h-8a2 2 0 0 0-2 2z"stroke={r}strokeWidth="2"strokeLinecap="round"strokeLinejoin="round"/>
     <L d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"stroke={r}strokeWidth="2"strokeLinecap="round"strokeLinejoin="round"/>
-  </B>,N=({size:o=14,color:r=e.emerald500})=><B width={o}height={o}viewBox="0 0 24 24"fill="none">
+  </W>,P=({size:o=14,color:r=e.emerald500})=><W width={o}height={o}viewBox="0 0 24 24"fill="none">
     <L d="M20 6L9 17l-5-5"stroke={r}strokeWidth="2.4"strokeLinecap="round"strokeLinejoin="round"/>
-  </B>,Se=({size:o=13,color:r=e.white})=><B width={o}height={o}viewBox="0 0 24 24"fill="none">
+  </W>,Se=({size:o=13,color:r=e.white})=><W width={o}height={o}viewBox="0 0 24 24"fill="none">
     <L d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"stroke={r}strokeWidth="2"strokeLinecap="round"strokeLinejoin="round"/>
     <L d="M15 3h6v6"stroke={r}strokeWidth="2"strokeLinecap="round"strokeLinejoin="round"/>
     <L d="M10 14L21 3"stroke={r}strokeWidth="2"strokeLinecap="round"strokeLinejoin="round"/>
-  </B>,Te=({size:o=13,color:r=e.grayTextWeak})=><B width={o}height={o}viewBox="0 0 24 24"fill="none">
+  </W>,Te=({size:o=13,color:r=e.grayTextWeak})=><W width={o}height={o}viewBox="0 0 24 24"fill="none">
     <L d="M18 6L6 18M6 6l12 12"stroke={r}strokeWidth="2.2"strokeLinecap="round"strokeLinejoin="round"/>
-  </B>,Le=({size:o=14,color:r=e.amber500})=><B width={o}height={o}viewBox="0 0 24 24"fill="none">
+  </W>,Le=({size:o=14,color:r=e.amber500})=><W width={o}height={o}viewBox="0 0 24 24"fill="none">
     <L d="M12 2l2.4 6.6L21 11l-6.6 2.4L12 20l-2.4-6.6L3 11l6.6-2.4L12 2z"fill={r}/>
-  </B>,Ve=({size:o=14,color:r=e.slate400})=><B width={o}height={o}viewBox="0 0 24 24"fill="none">
+  </W>,Ve=({size:o=14,color:r=e.slate400})=><W width={o}height={o}viewBox="0 0 24 24"fill="none">
     <L d="M5 12h14M12 5l7 7-7 7"stroke={r}strokeWidth="2.2"strokeLinecap="round"strokeLinejoin="round"/>
-  </B>;export const UpdateAvailableModal=({visible:o,latestVersion:r,onClose:_})=>{const[A,D]=M(!1),W=M(new T.Value(0))[0],R=M(new T.Value(.92))[0],H="npm install react-native-inapp-inspector@latest";if(typeof __DEV__>"u"||!__DEV__)return null;F(()=>{o&&(D(!1),T.parallel([T.timing(W,{toValue:1,duration:220,useNativeDriver:!0}),T.spring(R,{toValue:1,friction:8,tension:50,useNativeDriver:!0})]).start())},[o,W,R]);const I=()=>{T.parallel([T.timing(W,{toValue:0,duration:160,useNativeDriver:!0}),T.timing(R,{toValue:.92,duration:160,useNativeDriver:!0})]).start(()=>{_()})},E=()=>{Z(H,"Install Command"),D(!0),$("Copied npm install command to clipboard!"),setTimeout(()=>{D(!1)},2500)},U=()=>{J.openURL("https://www.npmjs.com/package/react-native-inapp-inspector").catch(()=>{}),I()};return o?<G transparent visible={o}animationType="none"statusBarTranslucent onRequestClose={I}>
+  </W>;export const UpdateAvailableModal=({visible:o,latestVersion:r,onClose:_})=>{const[H,A]=D(!1),R=D(new T.Value(0))[0],I=D(new T.Value(.92))[0],M="npm install react-native-inapp-inspector@latest";if(typeof __DEV__>"u"||!__DEV__)return null;F(()=>{o&&(A(!1),T.parallel([T.timing(R,{toValue:1,duration:220,useNativeDriver:!0}),T.spring(I,{toValue:1,friction:8,tension:50,useNativeDriver:!0})]).start())},[o,R,I]);const z=()=>{T.parallel([T.timing(R,{toValue:0,duration:160,useNativeDriver:!0}),T.timing(I,{toValue:.92,duration:160,useNativeDriver:!0})]).start(()=>{_()})},E=()=>{Z(M,"Install Command"),A(!0),$(B("about.copiedInstallCommand","Copied npm install command to clipboard!")),setTimeout(()=>{A(!1)},2500)},U=()=>{J.openURL("https://www.npmjs.com/package/react-native-inapp-inspector").catch(()=>{}),z()};return o?<G transparent visible={o}animationType="none"statusBarTranslucent onRequestClose={z}>
       <C style={t.overlay}>
-        <T.View style={[t.card,{opacity:W,transform:[{scale:R}]}]}>
+        <T.View style={[t.card,{opacity:R,transform:[{scale:I}]}]}>
           
-          <O style={t.topCloseButton}onPress={I}hitSlop={10}activeOpacity={.7}>
+          <O style={t.topCloseButton}onPress={z}hitSlop={10}activeOpacity={.7}>
             <Te size={13}color={e.grayTextWeak}/>
           </O>
 
           
           <C style={t.headerSection}>
             <C style={t.iconHaloRing}>
-              <K size={38}/>
+              <K size={38}shape="circle"/>
               <C style={t.sparkleBadge}>
                 <Le size={13}color={e.amber500}/>
               </C>
             </C>
-            <S style={t.title}>Update Available</S>
+            <S style={t.title}>{B("header.updateAvailableTitle","Update Available")}</S>
             <S style={t.subtitle}>
-              A new version of react-native-inapp-inspector is ready to install
+              {B("header.updateAvailableSubtitle","A new version of react-native-inapp-inspector is ready to install")}
             </S>
           </C>
 
@@ -60,34 +60,34 @@ import{useState as M,useEffect as F}from"react";import{Modal as G,View as C,Text
           
           <C style={t.codeSnippetBox}>
             <C style={t.codeSnippetHeader}>
-              <S style={t.codeSnippetLabel}>UPGRADE COMMAND</S>
-              {A&&<C style={t.copiedIndicator}>
-                  <N size={11}color={e.emerald500}/>
-                  <S style={t.copiedText}>Copied</S>
+              <S style={t.codeSnippetLabel}>{B("header.upgradeCommand","UPGRADE COMMAND")}</S>
+              {H&&<C style={t.copiedIndicator}>
+                  <P size={11}color={e.emerald500}/>
+                  <S style={t.copiedText}>{B("common.copied","Copied")}</S>
                 </C>}
             </C>
 
             <O activeOpacity={.75}onPress={E}style={t.commandRow}>
               <S style={t.commandText}numberOfLines={1}>
-                {H}
+                {M}
               </S>
               <C style={t.copyIconWrapper}>
-                {A?<N size={14}color={e.emerald500}/>:<Ce size={14}color={e.grayTextWeak}/>}
+                {H?<P size={14}color={e.emerald500}/>:<Ce size={14}color={e.grayTextWeak}/>}
               </C>
             </O>
           </C>
 
           
           <C style={t.buttonRow}>
-            <O activeOpacity={.7}onPress={I}style={t.secondaryButton}>
-              <S style={t.secondaryButtonText}>Later</S>
+            <O activeOpacity={.7}onPress={z}style={t.secondaryButton}>
+              <S style={t.secondaryButtonText}>{B("common.later","Later")}</S>
             </O>
 
             <O activeOpacity={.8}onPress={U}style={t.primaryButton}>
-              <S style={t.primaryButtonText}>View on NPM</S>
+              <S style={t.primaryButtonText}>{B("common.viewOnNpm","View on NPM")}</S>
               <Se size={12}color={e.white}/>
             </O>
           </C>
         </T.View>
       </C>
-    </G>:null};const V={fontFamily:P.interRegular},t=Y.create({overlay:{flex:1,backgroundColor:e.overlayDark,justifyContent:"center",alignItems:"center",paddingHorizontal:20,zIndex:999999},card:{width:"100%",maxWidth:360,backgroundColor:e.primaryLight,borderRadius:24,borderWidth:1,borderColor:e.dividerColor,paddingHorizontal:20,paddingTop:22,paddingBottom:20,alignItems:"center",shadowColor:e.shadowColorString,shadowOffset:{width:0,height:18},shadowOpacity:.24,shadowRadius:36,elevation:24},topCloseButton:{position:"absolute",top:14,right:14,width:28,height:28,borderRadius:14,backgroundColor:e.grayBackground,justifyContent:"center",alignItems:"center",borderWidth:1,borderColor:e.dividerColor,zIndex:10},headerSection:{alignItems:"center",width:"100%",marginBottom:12},iconHaloRing:{width:66,height:66,borderRadius:20,backgroundColor:e.purple50,justifyContent:"center",alignItems:"center",borderWidth:1.5,borderColor:e.purple100,marginBottom:8,shadowColor:e.offerPurple,shadowOffset:{width:0,height:4},shadowOpacity:.16,shadowRadius:10,elevation:4},sparkleBadge:{position:"absolute",top:-4,right:-4,width:22,height:22,borderRadius:11,backgroundColor:e.paleYellow,justifyContent:"center",alignItems:"center",borderWidth:1.5,borderColor:e.white},title:{fontSize:17.5,fontWeight:"800",color:e.primaryBlack,letterSpacing:-.4,textAlign:"center",lineHeight:22,marginBottom:2,...V},subtitle:{fontSize:12,fontWeight:"500",color:e.grayTextWeak,textAlign:"center",lineHeight:16,paddingHorizontal:8,...V},versionComparisonCard:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",backgroundColor:e.grayBackground,borderRadius:14,borderWidth:1,borderColor:e.dividerColor,paddingVertical:10,paddingHorizontal:14,marginBottom:12,width:"100%"},versionColumn:{alignItems:"center",gap:4},versionLabel:{fontSize:9.5,fontWeight:"700",color:e.slate400,letterSpacing:.6,...V},installedChip:{backgroundColor:e.grayBorderSecondary,paddingHorizontal:8,paddingVertical:3,borderRadius:6},installedText:{fontSize:12,fontWeight:"700",color:e.grayText,...V},arrowContainer:{paddingHorizontal:6},arrowText:{fontSize:14,color:e.slate400,fontWeight:"700"},latestChip:{flexDirection:"row",alignItems:"center",gap:4,backgroundColor:e.violetSoftBg,paddingHorizontal:8,paddingVertical:3,borderRadius:6,borderWidth:1,borderColor:e.violetSoftBorder},latestText:{fontSize:12,fontWeight:"800",color:e.offerPurple,...V},codeSnippetBox:{backgroundColor:e.slate900,borderRadius:12,padding:10,width:"100%",marginBottom:14,borderWidth:1,borderColor:e.slate800},codeSnippetHeader:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",marginBottom:6},codeSnippetLabel:{fontSize:9.5,fontWeight:"700",color:e.grayTextWeak,letterSpacing:.6,...V},copiedIndicator:{flexDirection:"row",alignItems:"center",gap:3},copiedText:{fontSize:9.5,fontWeight:"600",color:e.emerald500,...V},commandRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",backgroundColor:e.slate800,borderRadius:8,paddingVertical:7,paddingHorizontal:9,gap:8},commandText:{flex:1,fontSize:11,fontFamily:P.interRegular,color:e.sky400},copyIconWrapper:{width:22,height:22,borderRadius:6,backgroundColor:e.slate700,justifyContent:"center",alignItems:"center"},buttonRow:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",gap:10,width:"100%"},secondaryButton:{flex:1,alignItems:"center",justifyContent:"center",paddingVertical:11,borderRadius:12,backgroundColor:e.graySurface,borderWidth:1,borderColor:e.dividerColor},secondaryButtonText:{fontSize:13,fontWeight:"600",color:e.grayText,...V},primaryButton:{flex:1.3,flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,paddingVertical:11,borderRadius:12,backgroundColor:e.offerPurple,shadowColor:e.offerPurple,shadowOffset:{width:0,height:3},shadowOpacity:.28,shadowRadius:6,elevation:4},primaryButtonText:{fontSize:13,fontWeight:"700",color:e.white,...V}});export default UpdateAvailableModal;
+    </G>:null};const V={fontFamily:N.interRegular},t=Y.create({overlay:{flex:1,backgroundColor:e.overlayDark,justifyContent:"center",alignItems:"center",paddingHorizontal:20,zIndex:999999},card:{width:"100%",maxWidth:360,backgroundColor:e.primaryLight,borderRadius:24,borderWidth:1,borderColor:e.dividerColor,paddingHorizontal:20,paddingTop:22,paddingBottom:20,alignItems:"center",shadowColor:e.shadowColorString,shadowOffset:{width:0,height:18},shadowOpacity:.24,shadowRadius:36,elevation:24},topCloseButton:{position:"absolute",top:14,right:14,width:28,height:28,borderRadius:14,backgroundColor:e.grayBackground,justifyContent:"center",alignItems:"center",borderWidth:1,borderColor:e.dividerColor,zIndex:10},headerSection:{alignItems:"center",width:"100%",marginBottom:12},iconHaloRing:{width:66,height:66,borderRadius:20,backgroundColor:e.purple50,justifyContent:"center",alignItems:"center",borderWidth:1.5,borderColor:e.purple100,marginBottom:8,shadowColor:e.offerPurple,shadowOffset:{width:0,height:4},shadowOpacity:.16,shadowRadius:10,elevation:4},sparkleBadge:{position:"absolute",top:-4,right:-4,width:22,height:22,borderRadius:11,backgroundColor:e.paleYellow,justifyContent:"center",alignItems:"center",borderWidth:1.5,borderColor:e.white},title:{fontSize:17.5,fontWeight:"800",color:e.primaryBlack,letterSpacing:-.4,textAlign:"center",lineHeight:22,marginBottom:2,...V},subtitle:{fontSize:12,fontWeight:"500",color:e.grayTextWeak,textAlign:"center",lineHeight:16,paddingHorizontal:8,...V},versionComparisonCard:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",backgroundColor:e.grayBackground,borderRadius:14,borderWidth:1,borderColor:e.dividerColor,paddingVertical:10,paddingHorizontal:14,marginBottom:12,width:"100%"},versionColumn:{alignItems:"center",gap:4},versionLabel:{fontSize:9.5,fontWeight:"700",color:e.slate400,letterSpacing:.6,...V},installedChip:{backgroundColor:e.grayBorderSecondary,paddingHorizontal:8,paddingVertical:3,borderRadius:6},installedText:{fontSize:12,fontWeight:"700",color:e.grayText,...V},arrowContainer:{paddingHorizontal:6},arrowText:{fontSize:14,color:e.slate400,fontWeight:"700"},latestChip:{flexDirection:"row",alignItems:"center",gap:4,backgroundColor:e.violetSoftBg,paddingHorizontal:8,paddingVertical:3,borderRadius:6,borderWidth:1,borderColor:e.violetSoftBorder},latestText:{fontSize:12,fontWeight:"800",color:e.offerPurple,...V},codeSnippetBox:{backgroundColor:e.slate900,borderRadius:12,padding:10,width:"100%",marginBottom:14,borderWidth:1,borderColor:e.slate800},codeSnippetHeader:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",marginBottom:6},codeSnippetLabel:{fontSize:9.5,fontWeight:"700",color:e.grayTextWeak,letterSpacing:.6,...V},copiedIndicator:{flexDirection:"row",alignItems:"center",gap:3},copiedText:{fontSize:9.5,fontWeight:"600",color:e.emerald500,...V},commandRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",backgroundColor:e.slate800,borderRadius:8,paddingVertical:7,paddingHorizontal:9,gap:8},commandText:{flex:1,fontSize:11,fontFamily:N.interRegular,color:e.sky400},copyIconWrapper:{width:22,height:22,borderRadius:6,backgroundColor:e.slate700,justifyContent:"center",alignItems:"center"},buttonRow:{flexDirection:"row",justifyContent:"space-between",alignItems:"center",gap:10,width:"100%"},secondaryButton:{flex:1,alignItems:"center",justifyContent:"center",paddingVertical:11,borderRadius:12,backgroundColor:e.graySurface,borderWidth:1,borderColor:e.dividerColor},secondaryButtonText:{fontSize:13,fontWeight:"600",color:e.grayText,...V},primaryButton:{flex:1.3,flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,paddingVertical:11,borderRadius:12,backgroundColor:e.offerPurple,shadowColor:e.offerPurple,shadowOffset:{width:0,height:3},shadowOpacity:.28,shadowRadius:6,elevation:4},primaryButtonText:{fontSize:13,fontWeight:"700",color:e.white,...V}});export default UpdateAvailableModal;