Skip to content

Commit

Permalink
[fix] SafeAreaView types
Browse files Browse the repository at this point in the history
  • Loading branch information
necolas committed Jun 2, 2020
1 parent 94ecc46 commit b28d2a8
Showing 1 changed file with 15 additions and 14 deletions.
29 changes: 15 additions & 14 deletions packages/react-native-web/src/exports/SafeAreaView/index.js
Expand Up @@ -9,13 +9,26 @@
*/

import type { ViewProps } from '../View';
import type { Node } from 'react';

import { canUseDOM } from 'fbjs/lib/ExecutionEnvironment';
import React from 'react';
import StyleSheet from '../StyleSheet';
import View from '../View';
import React, { forwardRef } from 'react';

const SafeAreaView = React.forwardRef<View, ViewProps>((props: ViewProps, ref) => {
const cssFunction: 'constant' | 'env' = (function() {
if (
canUseDOM &&
window.CSS &&
window.CSS.supports &&
window.CSS.supports('top: constant(safe-area-inset-top)')
) {
return 'constant';
}
return 'env';
})();

const SafeAreaView = forwardRef<ViewProps, Node>((props, ref) => {
const { style, ...rest } = props;

return (
Expand All @@ -32,18 +45,6 @@ const SafeAreaView = React.forwardRef<View, ViewProps>((props: ViewProps, ref) =

SafeAreaView.displayName = 'SafeAreaView';

const cssFunction: 'constant' | 'env' = (function() {
if (
canUseDOM &&
window.CSS &&
window.CSS.supports &&
window.CSS.supports('top: constant(safe-area-inset-top)')
) {
return 'constant';
}
return 'env';
})();

const styles = StyleSheet.create({
root: {
paddingTop: `${cssFunction}(safe-area-inset-top)`,
Expand Down

0 comments on commit b28d2a8

Please sign in to comment.