react-native-inapp-inspector 2.4.1 → 2.5.0

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

@@ -1,84 +1,81 @@
-import{useCallback as W,useEffect as H,useRef as M,useState as k}from"react";import{Animated as v,PanResponder as le,Platform as X,StyleSheet as ce,Text as A,TouchableOpacity as Se,useWindowDimensions as xe,View as S}from"react-native";import _ from"react-native-linear-gradient";import{useInspector as Re}from"./InspectorContext";import $ from"../TouchableScale";import Ce from"../AppHeaderLogo";import Te from"../BrandCircleIcon";import{AndroidIcon as Ie,AppleIcon as Ve,CameraIcon as Pe,CloseWhite as Be,MaximizeIcon as Me,NpmIcon as Ae,VideoCameraIcon as $e}from"../NetworkIcons";import{ScreenCapture as z}from"../../capture";import{triggerNativeHaptic as x}from"../../native/NativeInspector";import{showToast as C}from"../../helpers/toast";import{getAppName as Ee,getAppVersionAndBuild as Le}from"../../helpers";import{LIB_VERSION as Oe}from"../../constants";import{AppColors as i}from"../../styles/AppColors";import{AppFonts as G}from"../../styles/AppFonts";import D from"../../styles";import{useTranslation as We}from"../../i18n";import{MediaPreviewModal as De}from"./MediaPreviewModal";const Fe=()=>{const{setVisible:P,isMinimized:Y,setIsMinimized:E,appIcon:J,fabPan:K,fabPanResponder:Q,fabDraggedRef:U,pulseAnim:Z,fabShineAnim:N,refreshMediaCount:T}=Re(),{width:ee}=xe(),{t:o}=We(),[te]=k(()=>Le().formatted),[a,L]=k(!1),[re,F]=k(0),I=M(null),[j,B]=k(null),n=M(new v.ValueXY({x:0,y:0})).current,O=M({x:0,y:0});H(()=>{const e=n.x.addListener(V=>O.current.x=V.value),r=n.y.addListener(V=>O.current.y=V.value);return()=>{n.x.removeListener(e),n.y.removeListener(r)}},[n]);const R=M(!1),ie=M(le.create({onStartShouldSetPanResponder:()=>!1,onMoveShouldSetPanResponder:(e,r)=>Math.abs(r.dx)>4||Math.abs(r.dy)>4,onPanResponderGrant:()=>{R.current=!0,n.setOffset({x:O.current.x,y:O.current.y}),n.setValue({x:0,y:0})},onPanResponderMove:v.event([null,{dx:n.x,dy:n.y}],{useNativeDriver:!1}),onPanResponderRelease:()=>{n.flattenOffset(),setTimeout(()=>{R.current=!1},50)},onPanResponderTerminate:()=>{n.flattenOffset(),R.current=!1}})).current;H(()=>{z.isRecording().then(e=>{L(!!e)}).catch(()=>{})},[]),H(()=>(a?(F(0),I.current=setInterval(()=>{F(e=>e+1)},1e3)):(I.current&&(clearInterval(I.current),I.current=null),F(0)),()=>{I.current&&clearInterval(I.current)}),[a]);const oe=W(async()=>{if(!R.current)try{x("light");const e=await z.takeScreenshot({format:"png",quality:.9,hideInspector:!0});if(e){x("success");const r={id:`screenshot_${e.timestamp}.png`,type:"image",format:e.format,uri:e.uri,filename:e.uri.split("/").pop()||`screenshot_${e.timestamp}.png`,sizeBytes:e.sizeBytes,timestamp:e.timestamp,width:e.width,height:e.height};B(r),T?.().catch(()=>{}),C(o("header.screenshotCaptured","Screenshot captured"))}else C(o("header.screenshotFailed","Failed to capture screenshot"))}catch{C(o("header.screenshotError","Error capturing screenshot"))}},[T,o]),ne=W(async()=>{if(!R.current)try{if(a){x("medium");const e=await z.stopRecording();if(L(!1),e){x("success");const r={id:`video_${e.timestamp}.${e.format}`,type:e.format==="gif"?"gif":"video",format:e.format,uri:e.uri,filename:e.uri.split("/").pop()||`video_${e.timestamp}.${e.format}`,sizeBytes:e.sizeBytes,timestamp:e.timestamp,durationMs:e.durationMs,width:e.width,height:e.height,hasAudio:e.hasAudio};B(r),T?.().catch(()=>{}),C(o("header.recordingSaved",{duration:(e.durationMs/1e3).toFixed(1),defaultValue:`Recording saved (${(e.durationMs/1e3).toFixed(1)}s)`}))}}else x("medium"),await z.startRecording({fps:24,audioSource:"none"})?(L(!0),C(o("header.recordingStarted","Recording started"))):C(o("header.recordingStartFailed","Failed to start recording"))}catch{C(o("header.recordingError","Error during screen recording")),L(!1)}},[a,T,o]),q=W(()=>{R.current||(x("light"),E?.(!1),P(!0))},[E,P]),ae=W(()=>{R.current||(x("light"),E?.(!1),P(!1))},[E,P]),se=e=>{const r=Math.floor(e/60),V=e%60;return`${r}:${V<10?"0":""}${V}`};return<>
+import{useCallback as E,useEffect as G,useRef as d,useState as I}from"react";import{Animated as s,PanResponder as ae,Platform as b,StyleSheet as $e,Text as V,TouchableOpacity as We,useWindowDimensions as ke,View as S}from"react-native";import Ne from"react-native-linear-gradient";import{useInspector as _e}from"./InspectorContext";import F from"../TouchableScale";import Se from"../AppHeaderLogo";import{AndroidIcon as He,AppleIcon as Ye,ScreenshotCaptureIcon as Ge,ScreenRecordIcon as Xe,CloseWhite as Re,MaximizeIcon as Ze,NpmIcon as Ue}from"../NetworkIcons";import{ScreenCapture as P}from"../../capture";import{triggerNativeHaptic as u}from"../../native/NativeInspector";import{showToast as f}from"../../helpers/toast";import{getAppName as Je,getAppVersionAndBuild as Ke}from"../../helpers";import{LIB_VERSION as Qe}from"../../constants";import{AppColors as r}from"../../styles/AppColors";import{AppFonts as $}from"../../styles/AppFonts";import Ce from"../../styles";import{useTranslation as et}from"../../i18n";import{MediaPreviewModal as St}from"./MediaPreviewModal";const vt=()=>{const{setVisible:D,isMinimized:Te,setIsMinimized:W,dismissInspector:Ie,appIcon:K,fabPan:a,fabPanResponder:xt,fabDraggedRef:k,pulseAnim:Ve,fabShineAnim:Rt,refreshMediaCount:v,captureFps:Q,captureScale:ee,captureBitrate:X,captureMaxDurationSeconds:te,captureAudioMode:re}=_e(),{width:M,height:x}=ke(),{t:o}=et(),[Pe]=I(()=>Ke().formatted),[m,N]=I(!1),[De,Z]=I(0),R=d(null),[ie,O]=I(null),[Me,j]=I(!1),[q,z]=I(!1),p=d(!1),B=d(new s.Value(0)).current,_=d(new s.Value(1)).current,C=d({x:0,y:0});G(()=>{const e=a.x.addListener(n=>C.current.x=n.value),t=a.y.addListener(n=>C.current.y=n.value);return()=>{a.x.removeListener(e),a.y.removeListener(t)}},[a]);const l=68,H=8,Oe=E(()=>{const e=C.current.x,t=C.current.y,n=20,A=180,g=M-n-l/2+e,Y=x-A-l/2+t;let U=e,J=t,L=!1;g<H+l/2?(U=e+(H+l/2-g),L=!0):g>M-H-l/2&&(U=e-(g-(M-H-l/2)),L=!0);const ne=b.OS==="ios"?60:40,se=b.OS==="ios"?40:24;Y<ne+l/2?(J=t+(ne+l/2-Y),L=!0):Y>x-se-l/2&&(J=t-(Y-(x-se-l/2)),L=!0),L&&s.spring(a,{toValue:{x:U,y:J},useNativeDriver:!1,tension:80,friction:8}).start()},[a,M,x]),ze=d(ae.create({onStartShouldSetPanResponder:()=>!1,onMoveShouldSetPanResponder:(e,t)=>Math.abs(t.dx)>4||Math.abs(t.dy)>4,onPanResponderGrant:()=>{k.current=!0,a.setOffset({x:C.current.x,y:C.current.y}),a.setValue({x:0,y:0}),p.current=!1,z(!1),j(!0),_.setValue(1),s.spring(B,{toValue:1,useNativeDriver:!0,tension:80,friction:8}).start()},onPanResponderMove:(e,t)=>{a.setValue({x:t.dx,y:t.dy});const n=t.moveY,A=t.moveX,g=n>x-140&&Math.abs(A-M/2)<85;g&&!p.current?(p.current=!0,z(!0),u("medium"),s.spring(_,{toValue:1.25,useNativeDriver:!0,tension:100,friction:6}).start()):!g&&p.current&&(p.current=!1,z(!1),s.spring(_,{toValue:1,useNativeDriver:!0,tension:100,friction:6}).start())},onPanResponderRelease:()=>{const e=p.current;a.flattenOffset(),s.timing(B,{toValue:0,duration:180,useNativeDriver:!0}).start(()=>{j(!1),z(!1),p.current=!1}),e?(u("heavy"),Ie(),f(o("common.inspectorDismissed","In-App Inspector closed for this session"))):Oe(),setTimeout(()=>{k.current=!1},100)},onPanResponderTerminate:()=>{a.flattenOffset(),k.current=!1,s.timing(B,{toValue:0,duration:180,useNativeDriver:!0}).start(()=>{j(!1),z(!1),p.current=!1})}})).current,c=d(new s.ValueXY({x:0,y:0})).current,T=d({x:0,y:0});G(()=>{const e=c.x.addListener(n=>T.current.x=n.value),t=c.y.addListener(n=>T.current.y=n.value);return()=>{c.x.removeListener(e),c.y.removeListener(t)}},[c]);const h=d(!1),Be=d(ae.create({onStartShouldSetPanResponder:()=>!1,onMoveShouldSetPanResponder:(e,t)=>Math.abs(t.dx)>4||Math.abs(t.dy)>4,onPanResponderGrant:()=>{h.current=!0,c.setOffset({x:T.current.x,y:T.current.y}),c.setValue({x:0,y:0})},onPanResponderMove:s.event([null,{dx:c.x,dy:c.y}],{useNativeDriver:!1}),onPanResponderRelease:()=>{c.flattenOffset();const e=T.current.y,t=-(x-(b.OS==="ios"?34:18)-70),n=b.OS==="ios"?34:18;if(e<t||e>n){const A=Math.max(t,Math.min(n,e));s.spring(c,{toValue:{x:T.current.x,y:A},useNativeDriver:!1,tension:80,friction:8}).start()}setTimeout(()=>{h.current=!1},50)},onPanResponderTerminate:()=>{c.flattenOffset(),h.current=!1}})).current;G(()=>{P.isRecording().then(e=>{N(!!e)}).catch(()=>{})},[]),G(()=>(m?(Z(0),R.current=setInterval(()=>{Z(e=>e+1)},1e3)):(R.current&&(clearInterval(R.current),R.current=null),Z(0)),()=>{R.current&&clearInterval(R.current)}),[m]);const Ae=E(async()=>{if(!h.current)try{u("light");const e=await P.takeScreenshot({format:"png",quality:.9,hideInspector:!0});if(e){u("success");const t={id:`screenshot_${e.timestamp}.png`,type:"image",format:e.format,uri:e.uri,filename:e.uri.split("/").pop()||`screenshot_${e.timestamp}.png`,sizeBytes:e.sizeBytes,timestamp:e.timestamp,width:e.width,height:e.height};O(t),v?.().catch(()=>{}),f(o("header.screenshotCaptured","Screenshot captured"))}else f(o("header.screenshotFailed","Failed to capture screenshot"))}catch{f(o("header.screenshotError","Error capturing screenshot"))}},[v,o]),Le=E(async()=>{if(!h.current)try{if(m){u("medium");const e=await P.stopRecording();if(N(!1),e){u("success");const t={id:`video_${e.timestamp}.${e.format}`,type:e.format==="gif"?"gif":"video",format:e.format,uri:e.uri,filename:e.uri.split("/").pop()||`video_${e.timestamp}.${e.format}`,sizeBytes:e.sizeBytes,timestamp:e.timestamp,durationMs:e.durationMs,width:e.width,height:e.height,hasAudio:e.hasAudio,thumbnailUri:e.thumbnailUri};O(t),v?.().catch(()=>{}),f(o("header.recordingSaved",{duration:(e.durationMs/1e3).toFixed(1),defaultValue:`Recording saved (${(e.durationMs/1e3).toFixed(1)}s)`}))}}else u("medium"),await P.startRecording({fps:Q,scale:ee,audioSource:re,bitrate:X>0?X:void 0,maxDurationSeconds:te})?(N(!0),f(o("header.recordingStarted","Recording started"))):f(o("header.recordingStartFailed","Failed to start recording"))}catch{f(o("header.recordingError","Error during screen recording")),N(!1)}},[m,Q,ee,X,te,re,v,o]),oe=E(()=>{h.current||(u("light"),W?.(!1),D(!0))},[W,D]),Ee=E(()=>{h.current||(u("light"),W?.(!1),D(!1))},[W,D]),Fe=e=>{const t=Math.floor(e/60),n=e%60;return`${t}:${n<10?"0":""}${n}`};return<>
       
-      {Y?<v.View style={[t.playerContainer,{transform:n.getTranslateTransform()}]}{...ie.panHandlers}>
+      {Te?<s.View style={[i.playerContainer,{transform:c.getTranslateTransform()}]}{...Be.panHandlers}>
           
-          <_ colors={[i.indigo600,i.violet600]}start={{x:0,y:0}}end={{x:1,y:1}}style={t.gradientBg}pointerEvents="none"/>
+          <Ne colors={[r.indigo600,r.violet600]}start={{x:0,y:0}}end={{x:1,y:1}}style={i.gradientBg}pointerEvents="none"/>
 
           
-          <S pointerEvents="none"style={t.playerShineClip}>
-            <v.View style={[t.playerShineStreak,{transform:[{translateX:N.interpolate({inputRange:[0,1],outputRange:[-80,ee+80]})},{rotate:"28deg"}]}]}>
-              <_ colors={["rgba(255, 255, 255, 0)","rgba(255, 255, 255, 0.18)","rgba(255, 255, 255, 0.70)","rgba(255, 255, 255, 1)","rgba(255, 255, 255, 0.70)","rgba(255, 255, 255, 0.18)","rgba(255, 255, 255, 0)"]}locations={[0,.22,.44,.5,.56,.78,1]}start={{x:0,y:.5}}end={{x:1,y:.5}}style={{flex:1}}/>
-            </v.View>
-          </S>
-
-          
-          <Se activeOpacity={.75}onPress={q}style={t.brandSection}accessibilityRole="button"accessibilityLabel={o("mediaGallery.expand","Expand Inspector")}>
-            <Ce size={36}customIcon={J}/>
-            <S style={t.titleWrapper}>
-              <A style={t.appTitle}numberOfLines={1}>
-                {Ee()}
-              </A>
-              <S style={t.versionRow}>
+          <We activeOpacity={.75}onPress={oe}style={i.brandSection}accessibilityRole="button"accessibilityLabel={o("mediaGallery.expand","Expand Inspector")}>
+            <Se size={36}customIcon={K}shape="circle"/>
+            <S style={i.titleWrapper}>
+              <V style={i.appTitle}numberOfLines={1}>
+                {Je()}
+              </V>
+              <S style={i.versionRow}>
                 
-                <S style={t.versionChip}>
-                  {X.OS==="ios"?<Ve color={`${i.white}E6`}size={9}/>:<Ie color={`${i.white}E6`}size={9}/>}
-                  <A style={t.versionChipText}numberOfLines={1}>
-                    {te}
-                  </A>
+                <S style={i.versionChip}>
+                  {b.OS==="ios"?<Ye color={`${r.white}E6`}size={9}/>:<He color={`${r.white}E6`}size={9}/>}
+                  <V style={i.versionChipText}numberOfLines={1}>
+                    {Pe}
+                  </V>
                 </S>
 
                 
-                <S style={t.versionChip}>
-                  <Ae size={9}color={i.npmRedLight}/>
-                  <A style={t.versionChipText}numberOfLines={1}>
-                    v{Oe}
-                  </A>
+                <S style={i.versionChip}>
+                  <Ue size={9}color={r.npmRedLight}/>
+                  <V style={i.versionChipText}numberOfLines={1}>
+                    v{Qe}
+                  </V>
                 </S>
               </S>
             </S>
-          </Se>
+          </We>
 
           
-          <S style={t.actionsRow}>
+          <S style={i.actionsRow}>
             
-            <$ onPress={oe}hitSlop={{top:6,bottom:6,left:4,right:4}}style={t.actionBtn}>
-              <Pe size={12}color={i.white}/>
-              <A style={t.actionText}>
+            <F onPress={Ae}hitSlop={{top:6,bottom:6,left:4,right:4}}style={i.actionBtn}>
+              <Ge size={12}color={r.white}/>
+              <V style={i.actionText}>
                 {o("header.photo","Photo")}
-              </A>
-            </$>
+              </V>
+            </F>
 
             
-            <$ onPress={ne}hitSlop={{top:6,bottom:6,left:4,right:4}}style={[t.actionBtn,a&&t.recordingBtnActive]}>
-              {a?<S style={t.recordingDot}/>:<$e size={12}color={i.white}/>}
-              <A style={[t.actionText,a&&{color:i.red300}]}>
-                {a?`${o("header.rec","REC")} ${se(re)}`:o("header.record","Record")}
-              </A>
-            </$>
+            <F onPress={Le}hitSlop={{top:6,bottom:6,left:4,right:4}}style={[i.actionBtn,m&&i.recordingBtnActive]}>
+              {m?<S style={i.recordingDot}/>:<Xe size={12}color={r.white}/>}
+              <V style={[i.actionText,m&&{color:r.red300}]}>
+                {m?`${o("header.rec","REC")} ${Fe(De)}`:o("header.record","Record")}
+              </V>
+            </F>
 
             
-            <$ onPress={q}hitSlop={{top:6,bottom:6,left:4,right:4}}accessibilityRole="button"accessibilityLabel={o("common.expand","Expand")}style={t.actionBtnSquare}>
-              <Me size={12}color={i.white}/>
-            </$>
+            <F onPress={oe}hitSlop={{top:6,bottom:6,left:4,right:4}}accessibilityRole="button"accessibilityLabel={o("common.expand","Expand")}style={i.actionBtnSquare}>
+              <Ze size={12}color={r.white}/>
+            </F>
 
             
-            <$ onPress={ae}hitSlop={{top:6,bottom:6,left:4,right:6}}accessibilityRole="button"accessibilityLabel={o("common.close","Close")}style={t.actionBtnSquare}>
-              <Be size={10}color={i.white}/>
-            </$>
+            <F onPress={Ee}hitSlop={{top:6,bottom:6,left:4,right:6}}accessibilityRole="button"accessibilityLabel={o("common.close","Close")}style={i.actionBtnSquare}>
+              <Re size={10}color={r.white}/>
+            </F>
           </S>
-        </v.View>:<v.View style={[D.fabWrapper,{transform:K.getTranslateTransform()}]}{...Q.panHandlers}>
-          <$ style={{alignItems:"center",justifyContent:"center"}}onPress={()=>{U.current||(x("light"),P(!0))}}hitSlop={10}>
-            <v.View style={[D.fabPulseRing,{transform:[{scale:Z}]}]}/>
-            <Te size={62}/>
-            
-            <S pointerEvents="none"style={D.fabShineClip}>
-              <v.View style={[D.fabShineStreak,{transform:[{translateX:N.interpolate({inputRange:[0,1],outputRange:[-48,96]})},{rotate:"25deg"}]}]}>
-                <_ colors={["rgba(255, 255, 255, 0)","rgba(255, 255, 255, 0.25)","rgba(255, 255, 255, 0.95)","rgba(255, 255, 255, 0.25)","rgba(255, 255, 255, 0)"]}locations={[0,.25,.5,.75,1]}start={{x:0,y:.5}}end={{x:1,y:.5}}style={{flex:1}}/>
-              </v.View>
-            </S>
-          </$>
-        </v.View>}
+        </s.View>:<s.View style={[Ce.fabWrapper,{transform:a.getTranslateTransform()}]}{...ze.panHandlers}>
+          <F style={{alignItems:"center",justifyContent:"center"}}onPress={()=>{k.current||(u("light"),D(!0))}}hitSlop={10}>
+            <s.View style={[Ce.fabPulseRing,{transform:[{scale:Ve}]}]}/>
+            <Se size={68}customIcon={K}shape="circle"/>
+          </F>
+        </s.View>}
+
+      
+      {Me&&<s.View pointerEvents="none"style={[i.dismissTargetContainer,{opacity:B,transform:[{translateY:B.interpolate({inputRange:[0,1],outputRange:[30,0]})},{scale:_}]}]}>
+          <S style={[i.dismissTargetCircle,q&&i.dismissTargetCircleActive]}>
+            <Re size={18}color={r.white}/>
+          </S>
+          <V style={[i.dismissTargetLabel,q&&i.dismissTargetLabelActive]}>
+            {q?o("common.releaseToHide","Release to hide"):o("common.dragToHide","Drag here to hide")}
+          </V>
+        </s.View>}
 
       
-      <De item={j}visible={!!j}onClose={()=>B(null)}onDelete={async e=>{await z.deleteMedia(e.uri),T?.().catch(()=>{}),B(null)}}onConvertToGif={async e=>{const r=await z.convertToGif(e.uri,{fps:12,width:480});r&&(T?.().catch(()=>{}),B({id:`anim_${r.timestamp}.gif`,type:"gif",format:"gif",uri:r.uri,filename:r.uri.split("/").pop()||`anim_${r.timestamp}.gif`,sizeBytes:r.sizeBytes,timestamp:r.timestamp,durationMs:r.durationMs}))}}/>
-    </>},t=ce.create({playerContainer:{position:"absolute",bottom:X.OS==="ios"?34:18,left:12,right:12,minHeight:58,flexDirection:"row",alignItems:"center",justifyContent:"space-between",borderRadius:16,borderWidth:1,borderColor:"rgba(255, 255, 255, 0.28)",paddingHorizontal:12,paddingVertical:7,gap:8,zIndex:99999,elevation:25,shadowColor:i.indigo600,shadowOffset:{width:0,height:8},shadowOpacity:.45,shadowRadius:14,overflow:"hidden"},gradientBg:{position:"absolute",top:0,left:0,right:0,bottom:0,borderRadius:16},playerShineClip:{position:"absolute",top:0,left:0,right:0,bottom:0,borderRadius:16,overflow:"hidden"},playerShineStreak:{position:"absolute",top:-60,width:75,height:200},brandSection:{flexDirection:"row",alignItems:"center",gap:9,flex:1,minWidth:0,paddingVertical:2},titleWrapper:{flex:1,minWidth:0,justifyContent:"center",gap:2},appTitle:{fontFamily:G.interBold,fontSize:13.5,color:i.white,letterSpacing:-.2},versionRow:{flexDirection:"row",alignItems:"center",gap:4,minWidth:0},versionChip:{flexDirection:"row",alignItems:"center",backgroundColor:`${i.white}1F`,borderRadius:5,paddingHorizontal:5,paddingVertical:1.5,gap:3,borderWidth:1,borderColor:`${i.white}2E`,flexShrink:1,minWidth:0},versionChipText:{fontFamily:G.interMedium,fontSize:8.5,color:`${i.white}EB`,letterSpacing:.1},actionsRow:{flexDirection:"row",alignItems:"center",gap:4.5,flexShrink:0},actionBtn:{flexDirection:"row",alignItems:"center",gap:4,backgroundColor:"rgba(255, 255, 255, 0.22)",paddingHorizontal:8,paddingVertical:5.5,borderRadius:7,borderWidth:1,borderColor:"rgba(255, 255, 255, 0.32)"},actionBtnSquare:{alignItems:"center",justifyContent:"center",width:27,height:27,backgroundColor:"rgba(255, 255, 255, 0.22)",borderRadius:7,borderWidth:1,borderColor:"rgba(255, 255, 255, 0.32)"},recordingBtnActive:{backgroundColor:"rgba(239, 68, 68, 0.32)",borderColor:i.red500},recordingDot:{width:6,height:6,borderRadius:3,backgroundColor:i.red500},actionText:{fontFamily:G.interSemiBold,fontSize:10.5,color:i.white}});export default Fe;
+      <St item={ie}visible={!!ie}onClose={()=>O(null)}onDelete={async e=>{await P.deleteMedia(e.uri),v?.().catch(()=>{}),O(null)}}onConvertToGif={async e=>{const t=await P.convertToGif(e.uri,{fps:12,width:480});t&&(v?.().catch(()=>{}),O({id:`anim_${t.timestamp}.gif`,type:"gif",format:"gif",uri:t.uri,filename:t.uri.split("/").pop()||`anim_${t.timestamp}.gif`,sizeBytes:t.sizeBytes,timestamp:t.timestamp,durationMs:t.durationMs}))}}/>
+    </>},i=$e.create({dismissTargetContainer:{position:"absolute",bottom:b.OS==="ios"?42:26,left:0,right:0,alignItems:"center",justifyContent:"center",zIndex:999998},dismissTargetCircle:{width:54,height:54,borderRadius:27,backgroundColor:"rgba(23, 23, 37, 0.82)",borderWidth:1.5,borderColor:"rgba(255, 255, 255, 0.28)",alignItems:"center",justifyContent:"center",shadowColor:r.black,shadowOffset:{width:0,height:6},shadowOpacity:.4,shadowRadius:10,elevation:16},dismissTargetCircleActive:{backgroundColor:r.red600,borderColor:r.red300,shadowColor:r.red600,shadowOpacity:.65,shadowRadius:18,transform:[{scale:1.06}]},dismissTargetLabel:{marginTop:6,fontFamily:$.interSemiBold,fontSize:11,color:"rgba(255, 255, 255, 0.85)",textShadowColor:"rgba(0, 0, 0, 0.6)",textShadowOffset:{width:0,height:1},textShadowRadius:3},dismissTargetLabelActive:{color:r.red300,fontFamily:$.interBold},playerContainer:{position:"absolute",bottom:b.OS==="ios"?34:18,left:12,right:12,minHeight:58,flexDirection:"row",alignItems:"center",justifyContent:"space-between",borderRadius:16,borderWidth:1,borderColor:"rgba(255, 255, 255, 0.28)",paddingHorizontal:12,paddingVertical:7,gap:8,zIndex:99999,elevation:25,shadowColor:r.indigo600,shadowOffset:{width:0,height:8},shadowOpacity:.45,shadowRadius:14,overflow:"hidden"},gradientBg:{position:"absolute",top:0,left:0,right:0,bottom:0,borderRadius:16},playerShineClip:{position:"absolute",top:0,left:0,right:0,bottom:0,borderRadius:16,overflow:"hidden"},playerShineStreak:{position:"absolute",top:-60,width:75,height:200},brandSection:{flexDirection:"row",alignItems:"center",gap:9,flex:1,minWidth:0,paddingVertical:2,overflow:"hidden"},titleWrapper:{flex:1,minWidth:0,justifyContent:"center",gap:2},appTitle:{fontFamily:$.interBold,fontSize:13.5,color:r.white,letterSpacing:-.2},versionRow:{flexDirection:"row",alignItems:"center",gap:4,minWidth:0},versionChip:{flexDirection:"row",alignItems:"center",backgroundColor:`${r.white}1F`,borderRadius:5,paddingHorizontal:5,paddingVertical:1.5,gap:3,borderWidth:1,borderColor:`${r.white}2E`,flexShrink:1,minWidth:0},versionChipText:{fontFamily:$.interMedium,fontSize:8.5,color:`${r.white}EB`,letterSpacing:.1},actionsRow:{flexDirection:"row",alignItems:"center",gap:4.5,flexShrink:0},actionBtn:{flexDirection:"row",alignItems:"center",gap:4,backgroundColor:"rgba(255, 255, 255, 0.22)",paddingHorizontal:8,paddingVertical:5.5,borderRadius:7,borderWidth:1,borderColor:"rgba(255, 255, 255, 0.32)"},actionBtnSquare:{alignItems:"center",justifyContent:"center",width:27,height:27,backgroundColor:"rgba(255, 255, 255, 0.22)",borderRadius:7,borderWidth:1,borderColor:"rgba(255, 255, 255, 0.32)"},recordingBtnActive:{backgroundColor:"rgba(239, 68, 68, 0.32)",borderColor:r.red500},recordingDot:{width:6,height:6,borderRadius:3,backgroundColor:r.red500},actionText:{fontFamily:$.interSemiBold,fontSize:10.5,color:r.white}});export default vt;

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

@@ -1,13 +1,13 @@
-import{useState as R}from"react";import{StyleSheet as S,Text as I,View as T,Pressable as B}from"react-native";import{AppColors as t}from"../../styles/AppColors";import{AppFonts as C}from"../../styles/AppFonts";import{WarningTriangleIcon as W,ClearIcon as E}from"../NetworkIcons";export const FeatureUnderDevNotice=({featureName:w,compact:V=!1})=>{const[z,D]=R(!1);return z?null:<T style={[e.container,V&&e.containerCompact]}>
+import{useState as z}from"react";import{StyleSheet as R,Text as I,View as T,Pressable as S}from"react-native";import{AppColors as t}from"../../styles/AppColors";import{AppFonts as C}from"../../styles/AppFonts";import{WarningTriangleIcon as B,ClearIcon as W}from"../NetworkIcons";import{t as A}from"../../i18n";export const FeatureUnderDevNotice=({featureName:w,compact:D=!1})=>{const[V,v]=z(!1);return V?null:<T style={[e.container,D&&e.containerCompact]}>
       <T style={e.contentRow}>
         <T style={e.badgeWrap}>
-          <W color={t.warningIconGold}size={12}/>
-          <I style={e.badgeText}>IN ACTIVE DEVELOPMENT</I>
+          <B color={t.warningIconGold}size={12}/>
+          <I style={e.badgeText}>{A("common.inActiveDevelopment","IN ACTIVE DEVELOPMENT")}</I>
         </T>
 
-        <B onPress={()=>D(!0)}hitSlop={8}style={e.dismissBtn}accessible={!0}accessibilityRole="button"accessibilityLabel="Dismiss notice">
-          <E color={t.grayTextWeak}size={11}/>
-        </B>
+        <S onPress={()=>v(!0)}hitSlop={8}style={e.dismissBtn}accessible={!0}accessibilityRole="button"accessibilityLabel="Dismiss notice">
+          <W color={t.grayTextWeak}size={11}/>
+        </S>
       </T>
 
       <I style={e.messageText}>
@@ -15,4 +15,4 @@ import{useState as R}from"react";import{StyleSheet as S,Text as I,View as T,Pres
         development. Results and metrics may vary in accuracy. We are continuously
         improving this feature for upcoming releases.
       </I>
-    </T>};const e=S.create({container:{marginHorizontal:12,marginTop:8,marginBottom:6,paddingHorizontal:12,paddingVertical:9,borderRadius:8,backgroundColor:`${t.warningIconGold}12`,borderWidth:1,borderColor:`${t.warningIconGold}30`},containerCompact:{marginTop:4,marginBottom:4,paddingVertical:7,paddingHorizontal:10},contentRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginBottom:4},badgeWrap:{flexDirection:"row",alignItems:"center",gap:4.5},badgeText:{fontFamily:C.interBold,fontSize:9.5,color:t.warningIconGold,letterSpacing:.4},dismissBtn:{padding:2},messageText:{fontFamily:C.interRegular,fontSize:10.5,color:t.grayText,lineHeight:15}});export default FeatureUnderDevNotice;
+    </T>};const e=R.create({container:{marginHorizontal:12,marginTop:8,marginBottom:6,paddingHorizontal:12,paddingVertical:9,borderRadius:8,backgroundColor:`${t.warningIconGold}12`,borderWidth:1,borderColor:`${t.warningIconGold}30`},containerCompact:{marginTop:4,marginBottom:4,paddingVertical:7,paddingHorizontal:10},contentRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",marginBottom:4},badgeWrap:{flexDirection:"row",alignItems:"center",gap:4.5},badgeText:{fontFamily:C.interBold,fontSize:9.5,color:t.warningIconGold,letterSpacing:.4},dismissBtn:{padding:2},messageText:{fontFamily:C.interRegular,fontSize:10.5,color:t.grayText,lineHeight:15}});export default FeatureUnderDevNotice;

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

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const FloatingCaptureWidget: React.FC;
+export default FloatingCaptureWidget;

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

@@ -0,0 +1,54 @@
+import{useCallback as Z,useEffect as G,useRef as x,useState as E}from"react";import{Animated as o,Dimensions as Be,PanResponder as De,Platform as _,StyleSheet as ee,Text as W,View as S}from"react-native";import Se from"react-native-linear-gradient";import{useInspector as ze}from"./InspectorContext";import N from"../TouchableScale";import{GripVerticalIcon as Ee,ScreenshotCaptureIcon as Fe,ScreenRecordIcon as $e}from"../NetworkIcons";import{ScreenCapture as V}from"../../capture";import{triggerNativeHaptic as B}from"../../native/NativeInspector";import{showToast as v}from"../../helpers/toast";import{AppColors as s}from"../../styles/AppColors";import{AppFonts as xe}from"../../styles/AppFonts";import{useTranslation as Ae}from"../../i18n";import{MediaPreviewModal as Le}from"./MediaPreviewModal";export const FloatingCaptureWidget=()=>{const{refreshMediaCount:R,captureFps:X,captureScale:Y,captureBitrate:F,captureMaxDurationSeconds:j,captureAudioMode:q,activeTab:ve,settingsPage:Re,peekMode:Oe}=ze(),{t:n}=Ae(),[M,D]=E(!1),[Ie,$]=E(!1),[Ce,A]=E(0),I=x(null),[H,T]=E(null),k=x(new o.Value(1)).current,z=x(new o.Value(0)).current,i=x(new o.ValueXY({x:0,y:0})).current,C=x({x:0,y:0});G(()=>{const e=i.x.addListener(a=>C.current.x=a.value),t=i.y.addListener(a=>C.current.y=a.value);return()=>{i.x.removeListener(e),i.y.removeListener(t)}},[i]);const P=x(!1),Ve=x(De.create({onStartShouldSetPanResponder:()=>!1,onStartShouldSetPanResponderCapture:()=>!1,onMoveShouldSetPanResponder:(e,t)=>Math.abs(t.dx)>2||Math.abs(t.dy)>2,onMoveShouldSetPanResponderCapture:(e,t)=>Math.abs(t.dx)>2||Math.abs(t.dy)>2,onPanResponderGrant:()=>{P.current=!0,i.setOffset({x:C.current.x,y:C.current.y}),i.setValue({x:0,y:0})},onPanResponderMove:(e,t)=>{i.setValue({x:t.dx,y:t.dy})},onPanResponderTerminationRequest:()=>!1,onShouldBlockNativeResponder:()=>!0,onPanResponderRelease:()=>{i.flattenOffset(),setTimeout(()=>{P.current=!1},150);const{width:e,height:t}=Be.get("window"),a=e/2-30,J=-a,K=20,Q=-(t-120),L=C.current.x,O=C.current.y;if(L<J||L>a||O<Q||O>K){const ke=Math.min(Math.max(L,J),a),Pe=Math.min(Math.max(O,Q),K);o.spring(i,{toValue:{x:ke,y:Pe},friction:7,tension:50,useNativeDriver:!1}).start()}},onPanResponderTerminate:()=>{i.flattenOffset(),P.current=!1}})).current;G(()=>{V.isRecording().then(e=>{D(e)}).catch(()=>{})},[]),G(()=>{let e=null;return M?(A(0),I.current=setInterval(()=>{A(t=>t+1)},1e3),e=o.loop(o.sequence([o.timing(k,{toValue:1.15,duration:500,useNativeDriver:!0}),o.timing(k,{toValue:1,duration:500,useNativeDriver:!0})])),e.start()):(I.current&&(clearInterval(I.current),I.current=null),A(0),k.setValue(1)),()=>{I.current&&clearInterval(I.current),e&&e.stop()}},[M,k]);const Me=Z(async()=>{if(!P.current)try{B("light"),$(!0),await new Promise(t=>setTimeout(t,60));const e=await V.takeScreenshot({format:"png",quality:.9,hideInspector:!1});if($(!1),o.sequence([o.timing(z,{toValue:.65,duration:70,useNativeDriver:!0}),o.timing(z,{toValue:0,duration:200,useNativeDriver:!0})]).start(),e){B("success");const t={id:`screenshot_${e.timestamp}.png`,type:"image",format:e.format,uri:e.uri,filename:e.uri.split("/").pop()||`screenshot_${e.timestamp}.png`,sizeBytes:e.sizeBytes,timestamp:e.timestamp,width:e.width,height:e.height};T(t),R?.().catch(()=>{}),v(n("header.screenshotCaptured","Screenshot captured"))}else v(n("header.screenshotFailed","Failed to capture screenshot"))}catch{$(!1),v(n("header.screenshotError","Error capturing screenshot"))}},[R,z,n]),U=Z(async()=>{if(!P.current)try{if(M){B("medium");const e=await V.stopRecording();if(D(!1),e){B("success");const t={id:`video_${e.timestamp}.${e.format}`,type:e.format==="gif"?"gif":"video",format:e.format,uri:e.uri,filename:e.uri.split("/").pop()||`video_${e.timestamp}.${e.format}`,sizeBytes:e.sizeBytes,timestamp:e.timestamp,durationMs:e.durationMs,width:e.width,height:e.height,hasAudio:e.hasAudio,thumbnailUri:e.thumbnailUri};T(t),R?.().catch(()=>{}),v(n("header.recordingSaved",{duration:(e.durationMs/1e3).toFixed(1),defaultValue:`Recording saved (${(e.durationMs/1e3).toFixed(1)}s)`}))}}else B("medium"),await V.startRecording({fps:X,scale:Y,audioSource:q,bitrate:F>0?F:void 0,maxDurationSeconds:j})?(D(!0),v(n("header.recordingStarted","Recording started"))):v(n("header.recordingStartFailed","Failed to start recording"))}catch{v(n("header.recordingError","Error during screen recording")),D(!1)}},[M,X,Y,F,j,q,R,n]),Te=e=>{const t=Math.floor(e/60),a=e%60;return`${t<10?"0":""}${t}:${a<10?"0":""}${a}`};return ve==="media"||Re==="media"?null:<>
+      
+      <o.View pointerEvents="none"style={[r.flashOverlay,{opacity:z}]}/>
+
+      {!Ie&&<o.View{...Ve.panHandlers}style={[r.container,{transform:[{translateX:i.x},{translateY:i.y}]}]}>
+          
+          {M?<S style={r.recordingShadowWrapper}>
+              <N onPress={U}style={r.recordingPillWrapper}>
+                <Se colors={["#E11D48","#BE123C"]}start={{x:0,y:0}}end={{x:1,y:0}}style={r.recordingPill}>
+                  <o.View style={[r.recordingDot,{transform:[{scale:k}]}]}/>
+                  <W style={r.recordingText}>
+                    REC {Te(Ce)}
+                  </W>
+                  <S style={r.stopIconBadge}>
+                    <S style={r.stopIconSquare}/>
+                  </S>
+                </Se>
+              </N>
+            </S>:<S style={r.dockShadowWrapper}>
+              <Se colors={["#0E1326","#1A1E38","#0E1326"]}start={{x:0,y:0}}end={{x:1,y:0}}style={r.dockBar}>
+                
+                <S style={r.dragGripArea}pointerEvents="none">
+                  <Ee size={13}color="rgba(255, 255, 255, 0.45)"/>
+                </S>
+
+                
+                <N onPress={Me}style={r.menuItemBtn}accessible={!0}accessibilityLabel="Take Screenshot">
+                  <S style={[r.menuItemIconCircle,{backgroundColor:"rgba(56, 189, 248, 0.22)"}]}>
+                    <Fe size={14}color={s.sky400}/>
+                  </S>
+                  <W style={r.menuItemText}>
+                    {n("header.screenshot","Screenshot")}
+                  </W>
+                </N>
+
+                
+                <S style={r.dockDivider}/>
+
+                
+                <N onPress={U}style={r.menuItemBtn}accessible={!0}accessibilityLabel={n("header.recordScreen","Record Screen")}>
+                  <S style={[r.menuItemIconCircle,{backgroundColor:"rgba(244, 63, 94, 0.24)"}]}>
+                    <$e size={14}color={s.rose400||"#FB7185"}/>
+                  </S>
+                  <W style={r.menuItemText}>
+                    {n("header.record","Record")}
+                  </W>
+                </N>
+              </Se>
+            </S>}
+        </o.View>}
+
+      
+      <Le item={H}visible={!!H}onClose={()=>T(null)}onDelete={async e=>{await V.deleteMedia(e.uri),R?.().catch(()=>{}),T(null)}}onConvertToGif={async e=>{const t=await V.convertToGif(e.uri,{fps:12,width:480});t&&(R?.().catch(()=>{}),T({id:`anim_${t.timestamp}.gif`,type:"gif",format:"gif",uri:t.uri,filename:t.uri.split("/").pop()||`anim_${t.timestamp}.gif`,sizeBytes:t.sizeBytes,timestamp:t.timestamp,durationMs:t.durationMs}))}}/>
+    </>};const r=ee.create({flashOverlay:{...ee.absoluteFillObject,backgroundColor:s.white,zIndex:999999},container:{position:"absolute",bottom:_.OS==="ios"?22:16,alignSelf:"center",alignItems:"center",justifyContent:"center",zIndex:999999,elevation:999999},dockShadowWrapper:{borderRadius:24,backgroundColor:"#0D1120",..._.select({ios:{shadowColor:s.black,shadowOffset:{width:0,height:6},shadowOpacity:.45,shadowRadius:14},android:{elevation:16}})},dockBar:{flexDirection:"row",alignItems:"center",borderRadius:24,width:272,paddingVertical:0,paddingHorizontal:0,overflow:"hidden"},dragGripArea:{paddingLeft:10,paddingRight:2,paddingVertical:10,alignItems:"center",justifyContent:"center"},dockDivider:{width:1,height:20,backgroundColor:"rgba(255, 255, 255, 0.12)"},menuItemBtn:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center",gap:7,paddingVertical:9,paddingHorizontal:10},menuItemIconCircle:{width:24,height:24,borderRadius:12,alignItems:"center",justifyContent:"center"},menuItemText:{fontFamily:xe.interSemiBold,fontSize:12,color:s.white,letterSpacing:.1},recordingShadowWrapper:{borderRadius:20,..._.select({ios:{shadowColor:s.black,shadowOffset:{width:0,height:4},shadowOpacity:.4,shadowRadius:10},android:{elevation:12}})},recordingPillWrapper:{borderRadius:20,overflow:"hidden"},recordingPill:{flexDirection:"row",alignItems:"center",gap:7,paddingVertical:6.5,paddingHorizontal:12,borderRadius:20,borderWidth:1.5,borderColor:"rgba(255, 255, 255, 0.35)"},recordingDot:{width:7,height:7,borderRadius:3.5,backgroundColor:s.white},recordingText:{fontFamily:xe.interBold,fontSize:11,color:s.white,letterSpacing:.3},stopIconBadge:{width:16,height:16,borderRadius:8,backgroundColor:"rgba(255, 255, 255, 0.28)",alignItems:"center",justifyContent:"center",marginLeft:2},stopIconSquare:{width:5.5,height:5.5,borderRadius:1,backgroundColor:s.white}});export default FloatingCaptureWidget;

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

@@ -0,0 +1,11 @@
+import React from 'react';
+import { CrashRecord } from '../../types';
+interface GlobalCrashScreenModalProps {
+    visible: boolean;
+    crash: CrashRecord | null;
+    onDismiss: () => void;
+    onOpenInspector: () => void;
+    onRetry?: () => void;
+}
+export declare const GlobalCrashScreenModal: React.FC<GlobalCrashScreenModalProps>;
+export default GlobalCrashScreenModal;

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

@@ -0,0 +1,234 @@
+import j,{useMemo as G}from"react";import{Modal as U,StyleSheet as J,Text as T,View as C,ScrollView as Y,SafeAreaView as K,Platform as X}from"react-native";import E from"react-native-linear-gradient";import F from"../TouchableScale";import{AppColors as e}from"../../styles/AppColors";import{AppFonts as S}from"../../styles/AppFonts";import{exportCrashReport as Q}from"../../customHooks/crashHandler";import{copyToClipboard as Z}from"../../helpers";import{showToast as _}from"../../helpers/toast";import{useTranslation as ee}from"../../i18n";import{WarningTriangleIcon as Te,CopyIcon as Ce,RefreshCcwIcon as Se,CloseWhite as Be,CircleAlertIcon as Ve,TerminalIcon as Re,CodeBracketsIcon as Ie,RepeatIcon as Fe,ShieldAlertIcon as W,FlameIcon as He,ChipIcon as Le,LayoutIcon as D,HourglassIcon as Ae,JsIcon as Me}from"../NetworkIcons";export const GlobalCrashScreenModal=j.memo(({visible:H,crash:h,onDismiss:L,onOpenInspector:O,onRetry:A})=>{const{t:B}=ee(),M=G(()=>h?Q(h,"markdown"):"",[h]);if(!H||!h)return null;const z=h.isFatal,P=h.type||"js",R=h.parsedStack&&h.parsedStack.length>0?h.parsedStack.find(V=>V.isAppCode)||h.parsedStack[0]:null,N=()=>{M&&(Z(M,B("errors.errorReport","Crash Report")),_(B("common.copied","Copied crash diagnostics to clipboard")))},v=()=>{switch(P){case"native":return<Le size={12}color={e.cyan600}/>;case"render":return<D size={12}color={e.purple400}/>;case"promise":return<Ae size={12}color={e.amber400}/>;default:return<Me size={12}color={e.yellow400}/>}};return<U visible={H}transparent={!1}animationType="fade"statusBarTranslucent={!0}onRequestClose={L}>
+        <K style={t.safeArea}>
+          <C style={t.container}>
+            
+            <C style={t.header}>
+              <E colors={[e.red600,e.rose600]}start={{x:0,y:0}}end={{x:1,y:1}}style={t.iconGlowWrap}>
+                <Te color={e.white}size={24}/>
+              </E>
+
+              <C style={t.headerTextCol}>
+                <C style={t.badgeRow}>
+                  <C style={[t.crashBadge,z&&t.crashBadgeFatal]}>
+                    {z?<He size={10}color={e.red500}/>:v()}
+                    <T style={[t.crashBadgeText,z&&t.crashBadgeTextFatal]}>
+                      {z?B("crash.fatalBadge","FATAL CRASH"):`${P.toUpperCase()} ERROR`}
+                    </T>
+                  </C>
+
+                  <C style={t.shieldBadge}>
+                    <W size={10}color={e.emerald400}/>
+                    <T style={t.shieldBadgeText}>
+                      {B("errors.protected","SHIELD PROTECTED")}
+                    </T>
+                  </C>
+                </C>
+
+                <T style={t.title}>
+                  {B("errors.rootCauseTitle","Crash Intercepted")}
+                </T>
+                <T style={t.subtitle}numberOfLines={1}>
+                  {B("errors.rootCauseSubtitle","Native crash prevented \u2022 Diagnostics captured")}
+                </T>
+              </C>
+
+              <F onPress={L}hitSlop={10}style={t.closeBtn}>
+                <Be size={12}color={e.slate400}/>
+              </F>
+            </C>
+
+            
+            <Y style={t.scrollArea}contentContainerStyle={t.scrollContent}showsVerticalScrollIndicator={!0}>
+              
+              <C style={t.errorBox}>
+                <C style={t.errorBoxHeader}>
+                  <Ve size={14}color={e.red500}/>
+                  <T style={t.errorBoxTitle}>
+                    {h.name||B("crash.unknownException","Exception")}
+                  </T>
+                </C>
+                <T style={t.errorMessage}selectable={!0}>
+                  {h.message||B("crash.unknownException","Unknown Exception")}
+                </T>
+              </C>
+
+              
+              {R&&<C style={t.locationCard}>
+                  <C style={t.cardHeaderRow}>
+                    <Re size={13}color={e.sky400}/>
+                    <T style={t.cardHeaderTitle}>
+                      {B("errors.exactLocation","EXACT ROOT CAUSE")}
+                    </T>
+                  </C>
+
+                  <C style={t.locRow}>
+                    <T style={t.locLabel}>
+                      {B("errors.file","File:")}
+                    </T>
+                    <T style={t.locValFile}numberOfLines={1}selectable={!0}>
+                      {R.file}
+                    </T>
+                  </C>
+
+                  <C style={t.locRow}>
+                    <T style={t.locLabel}>
+                      {B("errors.lineCol","Line / Col:")}
+                    </T>
+                    <T style={t.locValNum}>
+                      {R.lineNumber}:{R.column}
+                    </T>
+                  </C>
+
+                  <C style={t.locRow}>
+                    <T style={t.locLabel}>
+                      {B("errors.function","Function:")}
+                    </T>
+                    <T style={t.locValMethod}numberOfLines={1}>
+                      {R.method}()
+                    </T>
+                  </C>
+
+                  {R.raw&&<T style={t.fullPathText}numberOfLines={2}selectable={!0}>
+                      {R.raw}
+                    </T>}
+                </C>}
+
+              
+              {h.parsedStack&&h.parsedStack.length>0&&<C style={t.stackCard}>
+                  <C style={t.cardHeaderRow}>
+                    <Ie size={13}color={e.purple400}/>
+                    <T style={t.cardHeaderTitle}>
+                      {B("errors.callStack","CALL STACK")}
+                    </T>
+                    <T style={t.cardHeaderCount}>
+                      {h.parsedStack.length} frames
+                    </T>
+                  </C>
+
+                  {h.parsedStack.slice(0,10).map((V,I)=><C key={I}style={[t.frameItem,V.isAppCode&&t.frameItemProject]}>
+                      <C style={t.frameNumBadge}>
+                        <T style={[t.frameNumText,V.isAppCode&&{color:e.sky400}]}>
+                          #{I+1}
+                        </T>
+                      </C>
+                      <C style={{flex:1}}>
+                        <T style={[t.frameMethod,V.isAppCode&&t.frameMethodProject]}numberOfLines={1}>
+                          {V.method}
+                        </T>
+                        <T style={t.frameLoc}numberOfLines={1}>
+                          {V.file}:{V.lineNumber}
+                        </T>
+                      </C>
+                      {V.isAppCode&&<C style={t.appTag}>
+                          <T style={t.appTagText}>APP</T>
+                        </C>}
+                    </C>)}
+                </C>}
+
+              
+              {h.componentStack&&<C style={t.stackCard}>
+                  <C style={t.cardHeaderRow}>
+                    <D size={13}color={e.purple400}/>
+                    <T style={t.cardHeaderTitle}>
+                      {B("crash.componentHierarchy","COMPONENT HIERARCHY")}
+                    </T>
+                  </C>
+                  <T style={t.rawStackText}selectable={!0}>
+                    {h.componentStack}
+                  </T>
+                </C>}
+
+              
+              {h.breadcrumbs&&h.breadcrumbs.length>0&&<C style={t.stackCard}>
+                  <C style={t.cardHeaderRow}>
+                    <Fe size={13}color={e.amber400}/>
+                    <T style={t.cardHeaderTitle}>
+                      {B("crash.breadcrumbTrail","RECENT TRAIL")}
+                    </T>
+                    <T style={t.cardHeaderCount}>
+                      {h.breadcrumbs.length} events
+                    </T>
+                  </C>
+
+                  {h.breadcrumbs.slice(0,6).map((V,I)=>{const $=new Date(V.timestamp).toLocaleTimeString();return<C key={I}style={t.breadcrumbItem}>
+                        <C style={t.breadcrumbTag}>
+                          <T style={t.breadcrumbTagText}>
+                            {V.type.toUpperCase()}
+                          </T>
+                        </C>
+                        <T style={t.breadcrumbMsg}numberOfLines={2}>
+                          {V.message}
+                        </T>
+                        <T style={t.breadcrumbTime}>{$}</T>
+                      </C>})}
+                </C>}
+
+              
+              {h.deviceInfo&&<C style={t.telemetryCard}>
+                  <T style={t.telemetryTitle}>
+                    {B("crash.deviceDiagnostics","HARDWARE & RUNTIME TELEMETRY")}
+                  </T>
+                  <C style={t.telemetryGrid}>
+                    <C style={t.telemetryPill}>
+                      <T style={t.telemetryLabel}>OS</T>
+                      <T style={t.telemetryValue}>
+                        {h.deviceInfo.platform?.toUpperCase()}{" "}
+                        {h.deviceInfo.osVersion}
+                      </T>
+                    </C>
+                    <C style={t.telemetryPill}>
+                      <T style={t.telemetryLabel}>RN Version</T>
+                      <T style={t.telemetryValue}>
+                        {h.deviceInfo.rnVersion||"N/A"}
+                      </T>
+                    </C>
+                    <C style={t.telemetryPill}>
+                      <T style={t.telemetryLabel}>Engine</T>
+                      <T style={t.telemetryValue}>
+                        {h.deviceInfo.isHermes?"Hermes":"JSC"}
+                      </T>
+                    </C>
+                    <C style={t.telemetryPill}>
+                      <T style={t.telemetryLabel}>Architecture</T>
+                      <T style={t.telemetryValue}>
+                        {h.deviceInfo.isFabric?"Fabric (New)":"Paper"}
+                      </T>
+                    </C>
+                    {h.memoryInfo&&<C style={t.telemetryPill}>
+                        <T style={t.telemetryLabel}>JS Heap</T>
+                        <T style={t.telemetryValue}>
+                          {h.memoryInfo.usedJSHeapSize} / {h.memoryInfo.totalJSHeapSize} MB
+                        </T>
+                      </C>}
+                  </C>
+                </C>}
+            </Y>
+
+            
+            <C style={t.footer}>
+              {A&&<F onPress={A}style={t.retryBtn}>
+                  <Se size={14}color={e.white}/>
+                  <T style={t.retryBtnText}>
+                    {B("errors.retry","Try Again")}
+                  </T>
+                </F>}
+
+              <F onPress={O}style={t.inspectorBtn}>
+                <E colors={[e.indigo600,e.violet600]}start={{x:0,y:0}}end={{x:1,y:1}}style={t.inspectorBtnGradient}>
+                  <W size={14}color={e.white}/>
+                  <T style={t.inspectorBtnText}>
+                    {B("crash.openInInspector","Open in Inspector")}
+                  </T>
+                </E>
+              </F>
+
+              <F onPress={N}style={t.copyBtn}>
+                <Ce size={14}color={e.slate200}/>
+                <T style={t.copyBtnText}>
+                  {B("errors.copy","Copy")}
+                </T>
+              </F>
+            </C>
+          </C>
+        </K>
+      </U>});const t=J.create({safeArea:{flex:1,backgroundColor:e.slate900},container:{flex:1,backgroundColor:e.slate900},header:{flexDirection:"row",alignItems:"center",paddingHorizontal:16,paddingTop:X.OS==="android"?24:12,paddingBottom:12,backgroundColor:e.slate850,borderBottomWidth:1,borderBottomColor:e.slate800,gap:12},iconGlowWrap:{width:42,height:42,borderRadius:12,alignItems:"center",justifyContent:"center",shadowColor:e.red500,shadowOffset:{width:0,height:4},shadowOpacity:.35,shadowRadius:8,elevation:4},headerTextCol:{flex:1},badgeRow:{flexDirection:"row",alignItems:"center",gap:6,marginBottom:3},crashBadge:{flexDirection:"row",alignItems:"center",gap:4,backgroundColor:`${e.red500}22`,paddingHorizontal:6,paddingVertical:2,borderRadius:5,borderWidth:1,borderColor:`${e.red500}44`},crashBadgeFatal:{backgroundColor:`${e.red500}33`,borderColor:e.red500},crashBadgeText:{fontFamily:S.interBold,fontSize:9.5,color:e.red500,letterSpacing:.4},crashBadgeTextFatal:{color:e.red500},shieldBadge:{flexDirection:"row",alignItems:"center",gap:4,backgroundColor:`${e.emerald500}20`,paddingHorizontal:6,paddingVertical:2,borderRadius:5,borderWidth:1,borderColor:`${e.emerald500}44`},shieldBadgeText:{fontFamily:S.interBold,fontSize:9,color:e.emerald400,letterSpacing:.4},title:{fontFamily:S.interBold,fontSize:16,color:e.white,letterSpacing:-.2},subtitle:{fontFamily:S.interRegular,fontSize:11,color:e.slate400,marginTop:1},closeBtn:{width:30,height:30,borderRadius:15,backgroundColor:e.slate800,alignItems:"center",justifyContent:"center"},scrollArea:{flex:1},scrollContent:{padding:16,gap:12,paddingBottom:24},errorBox:{backgroundColor:`${e.red500}16`,borderRadius:12,borderWidth:1,borderColor:`${e.red500}40`,padding:14,gap:6},errorBoxHeader:{flexDirection:"row",alignItems:"center",gap:6},errorBoxTitle:{fontFamily:S.interBold,fontSize:12,color:e.red500,letterSpacing:.4},errorMessage:{fontFamily:S.interBold,fontSize:13.5,color:e.red100,lineHeight:19},locationCard:{backgroundColor:e.slate850,borderRadius:12,padding:14,borderWidth:1,borderColor:e.slate800,gap:8},cardHeaderRow:{flexDirection:"row",alignItems:"center",gap:6,marginBottom:4},cardHeaderTitle:{fontFamily:S.interBold,fontSize:10.5,color:e.slate200,letterSpacing:.6,flex:1},cardHeaderCount:{fontFamily:S.interMedium,fontSize:10,color:e.slate400},locRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",gap:8},locLabel:{fontFamily:S.interMedium,fontSize:11.5,color:e.slate400,minWidth:80},locValFile:{fontFamily:S.interBold,fontSize:12,color:e.sky400,flex:1,textAlign:"right"},locValNum:{fontFamily:S.interBold,fontSize:12,color:e.white},locValMethod:{fontFamily:S.interMedium,fontSize:12,color:e.purple400},fullPathText:{fontFamily:S.interRegular,fontSize:10,color:e.slate400,marginTop:4,paddingTop:6,borderTopWidth:1,borderTopColor:e.slate800},stackCard:{backgroundColor:e.slate850,borderRadius:12,padding:14,borderWidth:1,borderColor:e.slate800,gap:6},frameItem:{flexDirection:"row",alignItems:"center",backgroundColor:e.slate900,padding:9,borderRadius:8,gap:8,borderWidth:1,borderColor:e.slate800},frameItemProject:{borderColor:`${e.sky400}44`,backgroundColor:`${e.sky400}0F`},frameNumBadge:{width:22,alignItems:"center"},frameNumText:{fontFamily:S.interBold,fontSize:10,color:e.slate400},frameMethod:{fontFamily:S.interBold,fontSize:11.5,color:e.slate200},frameMethodProject:{color:e.white},frameLoc:{fontFamily:S.interRegular,fontSize:10,color:e.slate400,marginTop:1},appTag:{backgroundColor:`${e.sky400}26`,paddingHorizontal:5,paddingVertical:2,borderRadius:4},appTagText:{fontFamily:S.interBold,fontSize:8.5,color:e.sky400},rawStackText:{fontFamily:S.interRegular,fontSize:10.5,color:e.slate200,lineHeight:16,backgroundColor:e.slate900,padding:10,borderRadius:8},breadcrumbItem:{flexDirection:"row",alignItems:"center",gap:8,backgroundColor:e.slate900,padding:8,borderRadius:7,borderWidth:1,borderColor:e.slate800},breadcrumbTag:{backgroundColor:`${e.indigo600}20`,paddingHorizontal:5,paddingVertical:2,borderRadius:4},breadcrumbTagText:{fontFamily:S.interBold,fontSize:8.5,color:e.purple400},breadcrumbMsg:{flex:1,fontFamily:S.interRegular,fontSize:11,color:e.slate200},breadcrumbTime:{fontFamily:S.interMedium,fontSize:9.5,color:e.slate400},telemetryCard:{backgroundColor:e.slate850,borderRadius:12,padding:14,borderWidth:1,borderColor:e.slate800,gap:8},telemetryTitle:{fontFamily:S.interBold,fontSize:10,color:e.slate400,letterSpacing:.6},telemetryGrid:{flexDirection:"row",flexWrap:"wrap",gap:8},telemetryPill:{backgroundColor:e.slate900,paddingHorizontal:10,paddingVertical:6,borderRadius:8,borderWidth:1,borderColor:e.slate800},telemetryLabel:{fontFamily:S.interMedium,fontSize:9.5,color:e.slate400},telemetryValue:{fontFamily:S.interBold,fontSize:11,color:e.white,marginTop:2},footer:{flexDirection:"row",padding:14,backgroundColor:e.slate850,borderTopWidth:1,borderTopColor:e.slate800,gap:10,alignItems:"center"},retryBtn:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,backgroundColor:e.red600,paddingHorizontal:14,height:42,borderRadius:10},retryBtnText:{fontFamily:S.interBold,fontSize:12.5,color:e.white},inspectorBtn:{flex:1,height:42,borderRadius:10,overflow:"hidden"},inspectorBtnGradient:{flex:1,flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,paddingHorizontal:12},inspectorBtnText:{fontFamily:S.interBold,fontSize:12.5,color:e.white},copyBtn:{flexDirection:"row",alignItems:"center",justifyContent:"center",gap:6,backgroundColor:e.slate800,borderWidth:1,borderColor:e.slate700,paddingHorizontal:14,height:42,borderRadius:10},copyBtnText:{fontFamily:S.interBold,fontSize:12.5,color:e.slate200}});export default GlobalCrashScreenModal;