@amazon-devices/react-native-safe-area-context 2.0.1758683737 → 8.0.9000000000

package/lib/typescript/{src/SafeAreaContext.d.ts → SafeAreaContext.d.ts}

@@ -1,21 +1,23 @@
 import * as React from 'react';
-import { StyleProp, ViewStyle } from 'react-native';
-import { EdgeInsets, Metrics, Rect } from './SafeArea.types';
+import { type ViewProps } from 'react-native';
+import type { EdgeInsets, Metrics, Rect } from './SafeArea.types';
 export declare const SafeAreaInsetsContext: React.Context<EdgeInsets | null>;
 export declare const SafeAreaFrameContext: React.Context<Rect | null>;
-export interface SafeAreaViewProps {
+export interface SafeAreaProviderProps extends ViewProps {
     children?: React.ReactNode;
     initialMetrics?: Metrics | null;
     /**
      * @deprecated
      */
     initialSafeAreaInsets?: EdgeInsets | null;
-    style?: StyleProp<ViewStyle>;
 }
-export declare function SafeAreaProvider({ children, initialMetrics, initialSafeAreaInsets, style, }: SafeAreaViewProps): JSX.Element;
+export declare function SafeAreaProvider({ children, initialMetrics, initialSafeAreaInsets, style, ...others }: SafeAreaProviderProps): React.JSX.Element;
 export declare function useSafeAreaInsets(): EdgeInsets;
 export declare function useSafeAreaFrame(): Rect;
-export declare function withSafeAreaInsets<T>(WrappedComponent: React.ComponentType<T>): React.ForwardRefExoticComponent<React.PropsWithoutRef<T> & React.RefAttributes<T>>;
+export type WithSafeAreaInsetsProps = {
+    insets: EdgeInsets;
+};
+export declare function withSafeAreaInsets<T>(WrappedComponent: React.ComponentType<(React.PropsWithoutRef<T> | T) & WithSafeAreaInsetsProps>): React.ForwardRefExoticComponent<React.PropsWithoutRef<T> & React.RefAttributes<unknown>>;
 /**
  * @deprecated
  */
@@ -28,3 +30,4 @@ export declare const SafeAreaConsumer: React.Consumer<EdgeInsets | null>;
  * @deprecated
  */
 export declare const SafeAreaContext: React.Context<EdgeInsets | null>;
+//# sourceMappingURL=SafeAreaContext.d.ts.map

package/lib/typescript/SafeAreaContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SafeAreaContext.d.ts","sourceRoot":"","sources":["../../src/SafeAreaContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAA0B,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAEtE,OAAO,KAAK,EACV,UAAU,EAEV,OAAO,EACP,IAAI,EACL,MAAM,kBAAkB,CAAC;AAI1B,eAAO,MAAM,qBAAqB,kCAEjC,CAAC;AAKF,eAAO,MAAM,oBAAoB,4BAAyC,CAAC;AAK3E,MAAM,WAAW,qBAAsB,SAAQ,SAAS;IACtD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,cAAc,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAChC;;OAEG;IACH,qBAAqB,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;CAC3C;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,cAAc,EACd,qBAAqB,EACrB,KAAK,EACL,GAAG,MAAM,EACV,EAAE,qBAAqB,qBAkEvB;AAiBD,wBAAgB,iBAAiB,IAAI,UAAU,CAM9C;AAED,wBAAgB,gBAAgB,IAAI,IAAI,CAMvC;AAED,MAAM,MAAM,uBAAuB,GAAG;IACpC,MAAM,EAAE,UAAU,CAAC;CACpB,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,CAAC,EAClC,gBAAgB,EAAE,KAAK,CAAC,aAAa,CACnC,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,uBAAuB,CACzD,GACA,KAAK,CAAC,yBAAyB,CAChC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,OAAO,CAAC,CACxD,CAKA;AAED;;GAEG;AACH,wBAAgB,WAAW,IAAI,UAAU,CAExC;AAED;;GAEG;AACH,eAAO,MAAM,gBAAgB,mCAAiC,CAAC;AAE/D;;GAEG;AACH,eAAO,MAAM,eAAe,kCAAwB,CAAC"}

package/lib/typescript/SafeAreaView.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+import type { NativeSafeAreaViewProps } from './SafeArea.types';
+export type SafeAreaViewProps = NativeSafeAreaViewProps;
+export declare const SafeAreaView: React.ForwardRefExoticComponent<NativeSafeAreaViewProps & React.RefAttributes<React.Component<import("./specs/NativeSafeAreaView").NativeProps, {}, any> & import("react-native").NativeMethods>>;
+//# sourceMappingURL=SafeAreaView.d.ts.map

package/lib/typescript/SafeAreaView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SafeAreaView.d.ts","sourceRoot":"","sources":["../../src/SafeAreaView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAKV,uBAAuB,EACxB,MAAM,kBAAkB,CAAC;AAW1B,MAAM,MAAM,iBAAiB,GAAG,uBAAuB,CAAC;AAExD,eAAO,MAAM,YAAY,mMA6BvB,CAAC"}

package/lib/typescript/{src/SafeAreaView.kepler.d.ts → SafeAreaView.kepler.d.ts}

@@ -1,2 +1,3 @@
 import { View } from 'react-native';
 export declare const SafeAreaView: typeof View;
+//# sourceMappingURL=SafeAreaView.kepler.d.ts.map

package/lib/typescript/SafeAreaView.kepler.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SafeAreaView.kepler.d.ts","sourceRoot":"","sources":["../../src/SafeAreaView.kepler.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AAEpC,eAAO,MAAM,YAAY,aAAO,CAAC"}

package/lib/typescript/SafeAreaView.web.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { NativeSafeAreaViewProps } from './SafeArea.types';
+export declare const SafeAreaView: React.ForwardRefExoticComponent<NativeSafeAreaViewProps & React.RefAttributes<React.Component<import("./specs/NativeSafeAreaView").NativeProps, {}, any> & import("react-native").NativeMethods>>;
+//# sourceMappingURL=SafeAreaView.web.d.ts.map

package/lib/typescript/SafeAreaView.web.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SafeAreaView.web.d.ts","sourceRoot":"","sources":["../../src/SafeAreaView.web.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAKL,uBAAuB,EACxB,MAAM,kBAAkB,CAAC;AA0B1B,eAAO,MAAM,YAAY,mMAwFvB,CAAC"}

package/lib/typescript/SafeAreaView.windows.d.ts

@@ -0,0 +1,3 @@
+import type { NativeSafeAreaViewInstance } from './SafeArea.types';
+export declare const SafeAreaView: NativeSafeAreaViewInstance;
+//# sourceMappingURL=SafeAreaView.windows.d.ts.map

package/lib/typescript/SafeAreaView.windows.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SafeAreaView.windows.d.ts","sourceRoot":"","sources":["../../src/SafeAreaView.windows.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,kBAAkB,CAAC;AAEnE,eAAO,MAAM,YAAY,EAAsB,0BAA0B,CAAC"}

package/lib/typescript/{src/index.d.ts → index.d.ts}

@@ -2,3 +2,4 @@ export * from './SafeAreaContext';
 export * from './SafeAreaView';
 export * from './InitialWindow';
 export * from './SafeArea.types';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAEA,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC"}

package/lib/typescript/specs/NativeSafeAreaContext.d.ts

@@ -0,0 +1,23 @@
+import { TurboModule } from 'react-native';
+import type { Double } from 'react-native/Libraries/Types/CodegenTypes';
+export interface Spec extends TurboModule {
+    getConstants: () => {
+        initialWindowMetrics?: {
+            insets: {
+                top: Double;
+                right: Double;
+                bottom: Double;
+                left: Double;
+            };
+            frame: {
+                x: Double;
+                y: Double;
+                width: Double;
+                height: Double;
+            };
+        };
+    };
+}
+declare const _default: Spec | null;
+export default _default;
+//# sourceMappingURL=NativeSafeAreaContext.d.ts.map

package/lib/typescript/specs/NativeSafeAreaContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NativeSafeAreaContext.d.ts","sourceRoot":"","sources":["../../../src/specs/NativeSafeAreaContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAuB,MAAM,cAAc,CAAC;AAChE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,2CAA2C,CAAC;AAExE,MAAM,WAAW,IAAK,SAAQ,WAAW;IACvC,YAAY,EAAE,MAAM;QAClB,oBAAoB,CAAC,EAAE;YACrB,MAAM,EAAE;gBACN,GAAG,EAAE,MAAM,CAAC;gBACZ,KAAK,EAAE,MAAM,CAAC;gBACd,MAAM,EAAE,MAAM,CAAC;gBACf,IAAI,EAAE,MAAM,CAAC;aACd,CAAC;YACF,KAAK,EAAE;gBACL,CAAC,EAAE,MAAM,CAAC;gBACV,CAAC,EAAE,MAAM,CAAC;gBACV,KAAK,EAAE,MAAM,CAAC;gBACd,MAAM,EAAE,MAAM,CAAC;aAChB,CAAC;SACH,CAAC;KACH,CAAC;CACH;;AAED,wBAAmE"}

package/lib/typescript/specs/NativeSafeAreaProvider.d.ts

@@ -0,0 +1,22 @@
+import type { DirectEventHandler, Double } from 'react-native/Libraries/Types/CodegenTypes';
+import type { ViewProps, HostComponent } from 'react-native';
+export type Event = Readonly<{
+    insets: Readonly<{
+        top: Double;
+        right: Double;
+        bottom: Double;
+        left: Double;
+    }>;
+    frame: Readonly<{
+        x: Double;
+        y: Double;
+        width: Double;
+        height: Double;
+    }>;
+}>;
+export interface NativeProps extends ViewProps {
+    onInsetsChange?: DirectEventHandler<Event>;
+}
+declare const _default: HostComponent<NativeProps>;
+export default _default;
+//# sourceMappingURL=NativeSafeAreaProvider.d.ts.map

package/lib/typescript/specs/NativeSafeAreaProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NativeSafeAreaProvider.d.ts","sourceRoot":"","sources":["../../../src/specs/NativeSafeAreaProvider.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,kBAAkB,EAClB,MAAM,EACP,MAAM,2CAA2C,CAAC;AAEnD,OAAO,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7D,MAAM,MAAM,KAAK,GAAG,QAAQ,CAAC;IAC3B,MAAM,EAAE,QAAQ,CAAC;QACf,GAAG,EAAE,MAAM,CAAC;QACZ,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,MAAM,CAAC;QACf,IAAI,EAAE,MAAM,CAAC;KACd,CAAC,CAAC;IACH,KAAK,EAAE,QAAQ,CAAC;QACd,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;QACV,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC,CAAC;CACJ,CAAC,CAAC;AAEH,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C,cAAc,CAAC,EAAE,kBAAkB,CAAC,KAAK,CAAC,CAAC;CAC5C;wBAII,aAAa,CAAC,WAAW,CAAC;AAF/B,wBAEgC"}

package/lib/typescript/specs/NativeSafeAreaView.d.ts

@@ -0,0 +1,14 @@
+import type { WithDefault } from 'react-native/Libraries/Types/CodegenTypes';
+import type { ViewProps, HostComponent } from 'react-native';
+export interface NativeProps extends ViewProps {
+    mode?: WithDefault<'padding' | 'margin', 'padding'>;
+    edges?: Readonly<{
+        top: string;
+        right: string;
+        bottom: string;
+        left: string;
+    }>;
+}
+declare const _default: HostComponent<NativeProps>;
+export default _default;
+//# sourceMappingURL=NativeSafeAreaView.d.ts.map

package/lib/typescript/specs/NativeSafeAreaView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NativeSafeAreaView.d.ts","sourceRoot":"","sources":["../../../src/specs/NativeSafeAreaView.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2CAA2C,CAAC;AAC7E,OAAO,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAE7D,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C,IAAI,CAAC,EAAE,WAAW,CAAC,SAAS,GAAG,QAAQ,EAAE,SAAS,CAAC,CAAC;IACpD,KAAK,CAAC,EAAE,QAAQ,CAAC;QACf,GAAG,EAAE,MAAM,CAAC;QACZ,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,MAAM,CAAC;QACf,IAAI,EAAE,MAAM,CAAC;KACd,CAAC,CAAC;CACJ;wBAIK,aAAa,CAAC,WAAW,CAAC;AAFhC,wBAEiC"}

package/package.json

@@ -1 +1 @@
-{"name": "@amazon-devices/react-native-safe-area-context", "version": "2.0.1758683737+3.2.0", "description": "A flexible way to handle safe area, also works on Android and web.", "main": "lib/commonjs/index.js", "module": "lib/module/index.js", "react-native": "src/index.tsx", "types": "lib/typescript/src/index.d.ts", "sideEffects": false, "files": ["src", "lib", "android", "ios", "*.podspec", "react-native.config.js", "!**/__tests__", "kepler-compatibility.json", "!example", "SystemModules", "SystemBundles", "THIRD_PARTY_NOTICES.txt", "kepler-transformed-package-info.json"], "author": "Janic Duplessis <janicduplessis@gmail.com>", "contributors": ["Evan Bacon <bacon@expo.io> (https://github.com/evanbacon)"], "homepage": "https://github.com/th3rdwave/react-native-safe-area-context#readme", "license": "See license in LICENSE", "scripts": {"start": "react-native start", "test": "yarn validate:prettier && yarn validate:eslint && yarn validate:typescript && yarn validate:jest", "validate:eslint": "eslint \"src/**/*.{js,ts,tsx}\" \"example/**/*.{js,ts,tsx}\"", "validate:typescript": "tsc --project ./ --noEmit", "validate:prettier": "prettier \"src/**/*.{js,ts,tsx}\" \"example/**/*.{js,ts,tsx}\" --check", "validate:jest": "jest", "example:ios": "cd ./example && react-native run-ios", "example:android": "cd ./example && react-native run-android --no-jetifier", "example:expo": "expo start --config example/app.json"}, "keywords": ["react-native", "react native", "react-native-web", "expo-web", "safe area", "view"], "kepler": {"temporary-alias-for-package": {"name": "react-native-safe-area-context", "version": "3.2.0"}}, "peerDependencies": {"react": "*", "react-native": "*"}, "dependencies": {}, "devDependencies": {"@react-native-community/async-storage": "1.11.0", "@react-native-community/bob": "0.14.5", "@react-native-community/eslint-config": "2.0.0", "@react-native-community/masked-view": "0.1.10", "@react-navigation/bottom-tabs": "5.5.2", "@react-navigation/native": "5.5.1", "@react-navigation/stack": "5.5.1", "@types/jest": "^27.0.3", "@types/react": "17.0.2", "@types/react-dom": "~17.0.2", "@types/react-test-renderer": "^16.9.2", "@typescript-eslint/eslint-plugin": "^4.33.0", "@typescript-eslint/parser": "^4.33.0", "babel-plugin-module-resolver": "4.0.0", "eslint": "7.2.0", "eslint-config-prettier": "6.11.0", "eslint-plugin-prettier": "3.1.3", "jest": "26.0.1", "metro-react-native-babel-preset": "0.59.0", "prettier": "2.0.5", "react": "17.0.2", "react-dom": "17.0.2", "react-native": "0.72.0", "react-native-gesture-handler": "~2.13.0", "@amazon-devices/keplerscript-react-native-reanimated": "^2.0.0+2.1.0", "react-native-safe-area-view": "1.1.1", "react-native-screens": "~3.20.0", "react-native-web": "0.12.3", "react-navigation": "4.3.9", "react-navigation-stack": "2.7.0", "react-navigation-tabs": "2.8.13", "react-test-renderer": "16.13.1", "typescript": "^4.9.4"}, "repository": {"type": "git", "url": "https://github.com/th3rdwave/react-native-safe-area-context.git"}, "jest": {"preset": "react-native", "testEnvironment": "node", "clearMocks": true, "modulePathIgnorePatterns": ["<rootDir>/lib/"]}, "@react-native-community/bob": {"source": "src", "output": "lib", "targets": ["commonjs", "module", "typescript"]}}
+{"name": "@amazon-devices/react-native-safe-area-context", "version": "8.0.9000000000+5.2.0", "description": "A flexible way to handle safe area, also works on Android and web.", "main": "lib/commonjs/index.js", "module": "lib/module/index.js", "react-native": "src/index.tsx", "types": "lib/typescript/index.d.ts", "source": "src/index.tsx", "sideEffects": false, "files": ["src", "lib", "android", "ios", "common", "jest", "*.podspec", "react-native.config.js", "!**/__tests__", "!example", "kepler-compatibility.json", "SystemModules", "SystemBundles", "kepler-transformed-package-info.json"], "author": "Janic Duplessis <janicduplessis@gmail.com>", "contributors": ["Evan Bacon <bacon@expo.io> (https://github.com/evanbacon)"], "homepage": "https://github.com/th3rdwave/react-native-safe-area-context#readme", "license": "See license in LICENSE", "scripts": {"start": "react-native start", "test": "yarn format:check && yarn validate:eslint && yarn validate:typescript && yarn validate:jest", "validate:eslint": "eslint \"src/**/*.{js,ts,tsx}\" \"example/**/*.{js,ts,tsx}\"", "validate:typescript": "tsc --project ./ --noEmit", "validate:jest": "jest", "format:prettier:check": "prettier \"src/**/*.{js,ts,tsx}\" \"example/**/*.{js,ts,tsx}\" --check", "format:prettier:write": "yarn format:prettier:check --write", "format:clang:check": "clang-format --dry-run --Werror --glob='{ios,android/src,common}/**/*.{h,cpp,m,mm}'", "format:clang:write": "clang-format -i --glob='{ios,android/src,common}/**/*.{h,hpp,cpp,m,mm}'", "format:spotless:check": "cd android && ./gradlew spotlessCheck", "format:spotless:write": "cd android && ./gradlew spotlessApply", "format:check": "yarn format:prettier:check && yarn format:clang:check && yarn format:spotless:check", "format:write": "yarn format:prettier:write && yarn format:clang:write && yarn format:spotless:write"}, "keywords": ["react-native", "react native", "react-native-web", "expo-web", "safe area", "view"], "kepler": {"temporary-alias-for-package": {"name": "react-native-safe-area-context", "version": "5.2.0"}}, "peerDependencies": {"react": "*", "react-native": "*"}, "devDependencies": {"@commitlint/config-conventional": "^19.2.2", "@jest/globals": "^30.0.0", "@react-native/babel-preset": "^0.74.84", "@react-native/eslint-config": "^0.74.84", "@react-native/eslint-plugin-specs": "^0.74.84", "@release-it/conventional-changelog": "^8.0.1", "@types/react": "~19.0.10", "@types/react-dom": "~19.1.3", "@types/react-test-renderer": "^18.3.0", "@typescript-eslint/eslint-plugin": "^7.14.1", "@typescript-eslint/parser": "^7.14.1", "babel-plugin-module-resolver": "^5.0.2", "clang-format": "^1.8.0", "commitlint": "19.6.1", "eslint": "^8.57.0", "eslint-plugin-jest": "^28.6.0", "eslint-config-prettier": "^9.1.0", "eslint-plugin-prettier": "^5.1.3", "husky": "^9.0.11", "jest": "^29.7.0", "prettier": "^3.3.2", "react": "19.0.0", "react-dom": "19.0.0", "react-native": "0.79.3", "react-native-builder-bob": "^0.40.12", "react-test-renderer": "19.0.0", "release-it": "^17.4.0", "typescript": "^5.8.3"}, "repository": {"type": "git", "url": "https://github.com/th3rdwave/react-native-safe-area-context.git"}, "jest": {"preset": "react-native", "testEnvironment": "node", "clearMocks": true, "modulePathIgnorePatterns": ["<rootDir>/lib/"]}, "commitlint": {"extends": ["@commitlint/config-conventional"]}, "react-native-builder-bob": {"source": "src", "output": "lib", "targets": ["commonjs", "module", "typescript"]}, "codegenConfig": {"android": {"javaPackageName": "com.th3rdwave.safeareacontext"}, "ios": {"componentProvider": {"RNCSafeAreaProvider": "RNCSafeAreaProviderComponentView", "RNCSafeAreaView": "RNCSafeAreaViewComponentView"}}, "name": "safeareacontext", "type": "all", "jsSrcsDir": "./src/specs"}}

package/react-native-safe-area-context.podspec

@@ -1,19 +1,41 @@
 require 'json'
 
+fabric_enabled = ENV['RCT_NEW_ARCH_ENABLED'] == '1'
+
 package = JSON.parse(File.read(File.join(__dir__, 'package.json')))
 
 Pod::Spec.new do |s|
-  s.name         = "@amazon-devices/react-native-safe-area-context"
+  s.name         = "react-native-safe-area-context"
   s.version      = package['version']
   s.summary      = package['description']
   s.license      = package['license']
 
   s.authors      = package['author']
   s.homepage     = package['homepage']
-  s.platforms    = { :ios => "9.0", :tvos => "9.2" }
+  s.ios.deployment_target = "12.4"
+  s.osx.deployment_target = "10.15"
+  s.tvos.deployment_target = "12.4"
+  s.visionos.deployment_target = "1.0"
 
   s.source       = { :git => "https://github.com/th3rdwave/react-native-safe-area-context.git", :tag => "v#{s.version}" }
-  s.source_files  = "ios/**/*.{h,m}"
+  s.source_files  = "ios/**/*.{h,m,mm}"
+  s.exclude_files = "ios/Fabric"
+
+  s.dependency "React-Core"
+
+  if fabric_enabled
+    install_modules_dependencies(s)
+
+    s.subspec "common" do |ss|
+      ss.source_files         = "common/cpp/**/*.{cpp,h}"
+      ss.header_dir           = "react/renderer/components/safeareacontext"
+      ss.pod_target_xcconfig  = { "HEADER_SEARCH_PATHS" => "\"$(PODS_TARGET_SRCROOT)/common/cpp\"" }
+    end
 
-  s.dependency 'React-Core'
+    s.subspec "fabric" do |ss|
+      ss.dependency "react-native-safe-area-context/common"
+      ss.source_files         = "ios/Fabric/**/*.{h,m,mm}"
+      ss.pod_target_xcconfig  = { "HEADER_SEARCH_PATHS" => "\"$(PODS_TARGET_SRCROOT)/common/cpp\"" }
+    end
+  end
 end

package/react-native.config.js

@@ -1,6 +1,14 @@
 module.exports = {
   dependency: {
     platforms: {
+      android: {
+        libraryName: 'safeareacontext',
+        componentDescriptors: [
+          'RNCSafeAreaProviderComponentDescriptor',
+          'RNCSafeAreaViewComponentDescriptor',
+        ],
+        cmakeListsPath: 'src/main/jni/CMakeLists.txt',
+      },
       macos: null,
       windows: null,
     },

package/src/CompatNativeSafeAreaProvider.tsx

@@ -1,7 +1,6 @@
 import * as React from 'react';
-import { View } from 'react-native';
-import { NativeSafeAreaProviderProps } from './SafeArea.types';
-import useWindowDimensions from './useWindowDimensions';
+import { useWindowDimensions, View } from 'react-native';
+import type { NativeSafeAreaProviderProps } from './SafeArea.types';
 
 export function CompatNativeSafeAreaProvider({
   children,

package/src/InitialWindow.kepler.ts

@@ -7,4 +7,4 @@ export const initialWindowMetrics = null as Metrics | null;
 /**
  * @deprecated
  */
-export const initialWindowSafeAreaInsets = initialWindowMetrics?.insets;
+export const initialWindowSafeAreaInsets = initialWindowMetrics?.insets;

package/src/InitialWindow.native.ts

@@ -1,16 +1,10 @@
-import { UIManager } from 'react-native';
-import { Metrics } from './SafeArea.types';
+import type { Metrics } from './SafeArea.types';
+import NativeSafeAreaContext from './specs/NativeSafeAreaContext';
 
-const RNCSafeAreaProviderConfig = UIManager.getViewManagerConfig(
-    'RNCSafeAreaProvider',
-) as any;
-
-export const initialWindowMetrics = (RNCSafeAreaProviderConfig != null &&
-    RNCSafeAreaProviderConfig.Constants != null
-    ? RNCSafeAreaProviderConfig.Constants.initialWindowMetrics
-    : null) as Metrics | null;
+export const initialWindowMetrics = (NativeSafeAreaContext?.getConstants?.()
+  ?.initialWindowMetrics ?? null) as Metrics | null;
 
 /**
  * @deprecated
  */
-export const initialWindowSafeAreaInsets = initialWindowMetrics?.insets;
+export const initialWindowSafeAreaInsets = initialWindowMetrics?.insets;

package/src/InitialWindow.ts

@@ -1,4 +1,4 @@
-import { EdgeInsets, Metrics } from './SafeArea.types';
+import type { EdgeInsets, Metrics } from './SafeArea.types';
 
 export const initialWindowMetrics: Metrics | null = null;
 

package/src/NativeSafeAreaProvider.kepler.tsx

@@ -1,3 +1 @@
-import { CompatNativeSafeAreaProvider } from './CompatNativeSafeAreaProvider';
-
-export default CompatNativeSafeAreaProvider;
+export { CompatNativeSafeAreaProvider as NativeSafeAreaProvider } from './CompatNativeSafeAreaProvider';

package/src/NativeSafeAreaProvider.tsx

@@ -1,129 +1,3 @@
-import * as React from 'react';
-import { View } from 'react-native';
-import { NativeSafeAreaProviderProps } from './SafeArea.types';
+import NativeSafeAreaProvider from './specs/NativeSafeAreaProvider';
 
-/**
- * TODO:
- * Currently insets and frame are based on the window and are not
- * relative to the provider view. This is inconsistent with iOS and Android.
- * However in most cases if the provider view covers the screen this is not
- * an issue.
- */
-
-const CSSTransitions: Record<string, string> = {
-    WebkitTransition: 'webkitTransitionEnd',
-    Transition: 'transitionEnd',
-    MozTransition: 'transitionend',
-    MSTransition: 'msTransitionEnd',
-    OTransition: 'oTransitionEnd',
-};
-
-export default function NativeSafeAreaView({
-       children,
-       style,
-       onInsetsChange,
-}: NativeSafeAreaProviderProps) {
-    React.useEffect(() => {
-        // Skip for SSR.
-        if (typeof document === 'undefined') {
-            return;
-        }
-
-        const element = createContextElement();
-        document.body.appendChild(element);
-        const onEnd = () => {
-            const {
-                paddingTop,
-                paddingBottom,
-                paddingLeft,
-                paddingRight,
-            } = window.getComputedStyle(element);
-
-            const insets = {
-                top: paddingTop ? parseInt(paddingTop, 10) : 0,
-                bottom: paddingBottom ? parseInt(paddingBottom, 10) : 0,
-                left: paddingLeft ? parseInt(paddingLeft, 10) : 0,
-                right: paddingRight ? parseInt(paddingRight, 10) : 0,
-            };
-            const frame = {
-                x: 0,
-                y: 0,
-                width: document.documentElement.offsetWidth,
-                height: document.documentElement.offsetHeight,
-            };
-            // @ts-ignore: missing properties
-            onInsetsChange({ nativeEvent: { insets, frame } });
-        };
-        element.addEventListener(getSupportedTransitionEvent(), onEnd);
-        onEnd();
-        return () => {
-            document.body.removeChild(element);
-            element.removeEventListener(getSupportedTransitionEvent(), onEnd);
-        };
-    }, [onInsetsChange]);
-
-    return <View style={style}>{children}</View>;
-}
-
-let _supportedTransitionEvent: string | null = null;
-function getSupportedTransitionEvent(): string {
-    if (_supportedTransitionEvent !== null) {
-        return _supportedTransitionEvent;
-    }
-    const element = document.createElement('invalidtype');
-
-    _supportedTransitionEvent = CSSTransitions.Transition;
-    for (const key in CSSTransitions) {
-        if (element.style[key as keyof CSSStyleDeclaration] !== undefined) {
-            _supportedTransitionEvent = CSSTransitions[key];
-            break;
-        }
-    }
-    return _supportedTransitionEvent;
-}
-
-type CssEnv = 'constant' | 'env';
-
-let _supportedEnv: CssEnv | null = null;
-function getSupportedEnv(): CssEnv {
-    if (_supportedEnv !== null) {
-        return _supportedEnv;
-    }
-    const { CSS } = window;
-    if (
-        CSS &&
-        CSS.supports &&
-        CSS.supports('top: constant(safe-area-inset-top)')
-    ) {
-        _supportedEnv = 'constant';
-    } else {
-        _supportedEnv = 'env';
-    }
-    return _supportedEnv;
-}
-
-function getInset(side: string): string {
-    return `${getSupportedEnv()}(safe-area-inset-${side})`;
-}
-
-function createContextElement(): HTMLElement {
-    const element = document.createElement('div');
-    const { style } = element;
-    style.position = 'fixed';
-    style.left = '0';
-    style.top = '0';
-    style.width = '0';
-    style.height = '0';
-    style.zIndex = '-1';
-    style.overflow = 'hidden';
-    style.visibility = 'hidden';
-    // Bacon: Anything faster than this and the callback will be invoked too early with the wrong insets
-    style.transitionDuration = '0.05s';
-    style.transitionProperty = 'padding';
-    style.transitionDelay = '0s';
-    style.paddingTop = getInset('top');
-    style.paddingBottom = getInset('bottom');
-    style.paddingLeft = getInset('left');
-    style.paddingRight = getInset('right');
-    return element;
-}
+export { NativeSafeAreaProvider };

package/src/NativeSafeAreaProvider.web.tsx

@@ -0,0 +1,127 @@
+/* eslint-env browser */
+
+import * as React from 'react';
+import { View } from 'react-native';
+import type { NativeSafeAreaProviderProps } from './SafeArea.types';
+
+/**
+ * TODO:
+ * Currently insets and frame are based on the window and are not
+ * relative to the provider view. This is inconsistent with iOS and Android.
+ * However in most cases if the provider view covers the screen this is not
+ * an issue.
+ */
+
+const CSSTransitions: Record<string, string> = {
+  WebkitTransition: 'webkitTransitionEnd',
+  Transition: 'transitionEnd',
+  MozTransition: 'transitionend',
+  MSTransition: 'msTransitionEnd',
+  OTransition: 'oTransitionEnd',
+};
+
+export function NativeSafeAreaProvider({
+  children,
+  style,
+  onInsetsChange,
+}: NativeSafeAreaProviderProps) {
+  React.useEffect(() => {
+    // Skip for SSR.
+    if (typeof document === 'undefined') {
+      return;
+    }
+
+    const element = createContextElement();
+    document.body.appendChild(element);
+    const onEnd = () => {
+      const { paddingTop, paddingBottom, paddingLeft, paddingRight } =
+        window.getComputedStyle(element);
+
+      const insets = {
+        top: paddingTop ? parseInt(paddingTop, 10) : 0,
+        bottom: paddingBottom ? parseInt(paddingBottom, 10) : 0,
+        left: paddingLeft ? parseInt(paddingLeft, 10) : 0,
+        right: paddingRight ? parseInt(paddingRight, 10) : 0,
+      };
+      const frame = {
+        x: 0,
+        y: 0,
+        width: document.documentElement.offsetWidth,
+        height: document.documentElement.offsetHeight,
+      };
+      // @ts-ignore: missing properties
+      onInsetsChange({ nativeEvent: { insets, frame } });
+    };
+    element.addEventListener(getSupportedTransitionEvent(), onEnd);
+    onEnd();
+    return () => {
+      document.body.removeChild(element);
+      element.removeEventListener(getSupportedTransitionEvent(), onEnd);
+    };
+  }, [onInsetsChange]);
+
+  return <View style={style}>{children}</View>;
+}
+
+let _supportedTransitionEvent: string | null | undefined = null;
+function getSupportedTransitionEvent(): string {
+  if (_supportedTransitionEvent != null) {
+    return _supportedTransitionEvent;
+  }
+  const element = document.createElement('invalidtype');
+
+  _supportedTransitionEvent = CSSTransitions.Transition;
+  for (const key in CSSTransitions) {
+    if (element.style[key as keyof CSSStyleDeclaration] !== undefined) {
+      _supportedTransitionEvent = CSSTransitions[key];
+      break;
+    }
+  }
+  return _supportedTransitionEvent as string;
+}
+
+type CssEnv = 'constant' | 'env';
+
+let _supportedEnv: CssEnv | null = null;
+function getSupportedEnv(): CssEnv {
+  if (_supportedEnv !== null) {
+    return _supportedEnv;
+  }
+  const { CSS } = window;
+  if (
+    CSS &&
+    CSS.supports &&
+    CSS.supports('top: constant(safe-area-inset-top)')
+  ) {
+    _supportedEnv = 'constant';
+  } else {
+    _supportedEnv = 'env';
+  }
+  return _supportedEnv;
+}
+
+function getInset(side: string): string {
+  return `${getSupportedEnv()}(safe-area-inset-${side})`;
+}
+
+function createContextElement(): HTMLElement {
+  const element = document.createElement('div');
+  const { style } = element;
+  style.position = 'fixed';
+  style.left = '0';
+  style.top = '0';
+  style.width = '0';
+  style.height = '0';
+  style.zIndex = '-1';
+  style.overflow = 'hidden';
+  style.visibility = 'hidden';
+  // Bacon: Anything faster than this and the callback will be invoked too early with the wrong insets
+  style.transitionDuration = '0.05s';
+  style.transitionProperty = 'padding';
+  style.transitionDelay = '0s';
+  style.paddingTop = getInset('top');
+  style.paddingBottom = getInset('bottom');
+  style.paddingLeft = getInset('left');
+  style.paddingRight = getInset('right');
+  return element;
+}

package/src/NativeSafeAreaProvider.windows.tsx

@@ -1,3 +1 @@
-import { CompatNativeSafeAreaProvider } from './CompatNativeSafeAreaProvider';
-
-export default CompatNativeSafeAreaProvider;
+export { CompatNativeSafeAreaProvider as NativeSafeAreaProvider } from './CompatNativeSafeAreaProvider';

package/src/SafeArea.types.ts

@@ -1,11 +1,12 @@
-import {
-  NativeSyntheticEvent,
-  StyleProp,
-  ViewProps,
-  ViewStyle,
-} from 'react-native';
+import type * as React from 'react';
+import type { NativeSyntheticEvent, ViewProps } from 'react-native';
+import NativeSafeAreaView from './specs/NativeSafeAreaView';
 
 export type Edge = 'top' | 'right' | 'bottom' | 'left';
+export type EdgeMode = 'off' | 'additive' | 'maximum';
+
+export type EdgeRecord = Partial<Record<Edge, EdgeMode>>;
+export type Edges = readonly Edge[] | Readonly<EdgeRecord>;
 
 export interface EdgeInsets {
   top: number;
@@ -30,14 +31,17 @@ export type InsetChangedEvent = NativeSyntheticEvent<Metrics>;
 
 export type InsetChangeNativeCallback = (event: InsetChangedEvent) => void;
 
-export interface NativeSafeAreaProviderProps {
+export interface NativeSafeAreaProviderProps extends ViewProps {
   children?: React.ReactNode;
-  style?: StyleProp<ViewStyle>;
   onInsetsChange: InsetChangeNativeCallback;
 }
 
-export type NativeSafeAreaViewProps = ViewProps & {
+export interface NativeSafeAreaViewProps extends ViewProps {
   children?: React.ReactNode;
   mode?: 'padding' | 'margin';
-  edges?: ReadonlyArray<Edge>;
-};
+  edges?: Edges;
+}
+
+export type NativeSafeAreaViewInstance = InstanceType<
+  typeof NativeSafeAreaView
+>;