| 
				
			 | 
			
			
				@@ -22,34 +22,26 @@ export default function NativeSafeAreaView({ 
			 | 
		
	
		
			
			| 
				22
			 | 
			
				22
			 | 
			
			
				   style, 
			 | 
		
	
		
			
			| 
				23
			 | 
			
				23
			 | 
			
			
				   onInsetsChange, 
			 | 
		
	
		
			
			| 
				24
			 | 
			
				24
			 | 
			
			
				 }: NativeSafeAreaViewProps) { 
			 | 
		
	
		
			
			| 
				25
			 | 
			
				
			 | 
			
			
				-  const element = createContextElement(); 
			 | 
		
	
		
			
			| 
				26
			 | 
			
				
			 | 
			
			
				-  document.body.appendChild(element); 
			 | 
		
	
		
			
			| 
				27
			 | 
			
				
			 | 
			
			
				- 
			 | 
		
	
		
			
			| 
				28
			 | 
			
				
			 | 
			
			
				-  const onEnd = () => { 
			 | 
		
	
		
			
			| 
				29
			 | 
			
				
			 | 
			
			
				-    const { 
			 | 
		
	
		
			
			| 
				30
			 | 
			
				
			 | 
			
			
				-      paddingTop, 
			 | 
		
	
		
			
			| 
				31
			 | 
			
				
			 | 
			
			
				-      paddingBottom, 
			 | 
		
	
		
			
			| 
				32
			 | 
			
				
			 | 
			
			
				-      paddingLeft, 
			 | 
		
	
		
			
			| 
				33
			 | 
			
				
			 | 
			
			
				-      paddingRight, 
			 | 
		
	
		
			
			| 
				34
			 | 
			
				
			 | 
			
			
				-    } = getComputedStyle(element); 
			 | 
		
	
		
			
			| 
				
			 | 
			
				25
			 | 
			
			
				+  React.useEffect(() => { 
			 | 
		
	
		
			
			| 
				
			 | 
			
				26
			 | 
			
			
				+    const element = createContextElement(); 
			 | 
		
	
		
			
			| 
				
			 | 
			
				27
			 | 
			
			
				+    document.body.appendChild(element); 
			 | 
		
	
		
			
			| 
				
			 | 
			
				28
			 | 
			
			
				+    const onEnd = () => { 
			 | 
		
	
		
			
			| 
				
			 | 
			
				29
			 | 
			
			
				+      const { 
			 | 
		
	
		
			
			| 
				
			 | 
			
				30
			 | 
			
			
				+        paddingTop, 
			 | 
		
	
		
			
			| 
				
			 | 
			
				31
			 | 
			
			
				+        paddingBottom, 
			 | 
		
	
		
			
			| 
				
			 | 
			
				32
			 | 
			
			
				+        paddingLeft, 
			 | 
		
	
		
			
			| 
				
			 | 
			
				33
			 | 
			
			
				+        paddingRight, 
			 | 
		
	
		
			
			| 
				
			 | 
			
				34
			 | 
			
			
				+      } = getComputedStyle(element); 
			 | 
		
	
		
			
			| 
				35
			 | 
			
				35
			 | 
			
			
				  
			 | 
		
	
		
			
			| 
				36
			 | 
			
				
			 | 
			
			
				-    const insets = { 
			 | 
		
	
		
			
			| 
				37
			 | 
			
				
			 | 
			
			
				-      top: paddingTop ? parseInt(paddingTop, 10) : 0, 
			 | 
		
	
		
			
			| 
				38
			 | 
			
				
			 | 
			
			
				-      bottom: paddingBottom ? parseInt(paddingBottom, 10) : 0, 
			 | 
		
	
		
			
			| 
				39
			 | 
			
				
			 | 
			
			
				-      left: paddingLeft ? parseInt(paddingLeft, 10) : 0, 
			 | 
		
	
		
			
			| 
				40
			 | 
			
				
			 | 
			
			
				-      right: paddingRight ? parseInt(paddingRight, 10) : 0, 
			 | 
		
	
		
			
			| 
				
			 | 
			
				36
			 | 
			
			
				+      const insets = { 
			 | 
		
	
		
			
			| 
				
			 | 
			
				37
			 | 
			
			
				+        top: paddingTop ? parseInt(paddingTop, 10) : 0, 
			 | 
		
	
		
			
			| 
				
			 | 
			
				38
			 | 
			
			
				+        bottom: paddingBottom ? parseInt(paddingBottom, 10) : 0, 
			 | 
		
	
		
			
			| 
				
			 | 
			
				39
			 | 
			
			
				+        left: paddingLeft ? parseInt(paddingLeft, 10) : 0, 
			 | 
		
	
		
			
			| 
				
			 | 
			
				40
			 | 
			
			
				+        right: paddingRight ? parseInt(paddingRight, 10) : 0, 
			 | 
		
	
		
			
			| 
				
			 | 
			
				41
			 | 
			
			
				+      }; 
			 | 
		
	
		
			
			| 
				
			 | 
			
				42
			 | 
			
			
				+      // @ts-ignore: missing properties 
			 | 
		
	
		
			
			| 
				
			 | 
			
				43
			 | 
			
			
				+      onInsetsChange({ nativeEvent: { insets } }); 
			 | 
		
	
		
			
			| 
				41
			 | 
			
				44
			 | 
			
			
				     }; 
			 | 
		
	
		
			
			| 
				42
			 | 
			
				
			 | 
			
			
				- 
			 | 
		
	
		
			
			| 
				43
			 | 
			
				
			 | 
			
			
				-    console.log('onEnd'); 
			 | 
		
	
		
			
			| 
				44
			 | 
			
				
			 | 
			
			
				-    // @ts-ignore: missing properties 
			 | 
		
	
		
			
			| 
				45
			 | 
			
				
			 | 
			
			
				-    onInsetsChange({ nativeEvent: { insets } }); 
			 | 
		
	
		
			
			| 
				46
			 | 
			
				
			 | 
			
			
				-  }; 
			 | 
		
	
		
			
			| 
				47
			 | 
			
				
			 | 
			
			
				-  React.useEffect(() => { 
			 | 
		
	
		
			
			| 
				48
			 | 
			
				
			 | 
			
			
				-    console.log( 
			 | 
		
	
		
			
			| 
				49
			 | 
			
				
			 | 
			
			
				-      'SUPPORTED_TRANSITION_EVENT', 
			 | 
		
	
		
			
			| 
				50
			 | 
			
				
			 | 
			
			
				-      SUPPORTED_TRANSITION_EVENT, 
			 | 
		
	
		
			
			| 
				51
			 | 
			
				
			 | 
			
			
				-      SUPPORTED_ENV, 
			 | 
		
	
		
			
			| 
				52
			 | 
			
				
			 | 
			
			
				-    ); 
			 | 
		
	
		
			
			| 
				53
			 | 
			
				45
			 | 
			
			
				     element.addEventListener(SUPPORTED_TRANSITION_EVENT, onEnd); 
			 | 
		
	
		
			
			| 
				54
			 | 
			
				46
			 | 
			
			
				     onEnd(); 
			 | 
		
	
		
			
			| 
				55
			 | 
			
				47
			 | 
			
			
				     return () => { 
			 |