@granite-js/react-native 0.1.34 → 1.0.0

package/src/native-modules/natives/closeView.ts

@@ -1,4 +1,4 @@
-import { GraniteModule } from './GraniteModule';
+import { GraniteModule } from './GraniteBrownfieldModule.brick';
 
 /**
  * @public
@@ -21,5 +21,5 @@ import { GraniteModule } from './GraniteModule';
  * ```
  */
 export async function closeView() {
-  return GraniteModule.closeView();
+  return GraniteModule?.closeView();
 }

package/src/native-modules/natives/getSchemeUri.ts

@@ -1,4 +1,4 @@
-import { GraniteModule } from './GraniteModule';
+import { GraniteModule } from './GraniteBrownfieldModule.brick';
 
 /**
  * @public
@@ -23,5 +23,5 @@ import { GraniteModule } from './GraniteModule';
  * ```
  */
 export function getSchemeUri() {
-  return GraniteModule.schemeUri;
+  return GraniteModule.getConstants().schemeUri;
 }

package/src/router/Router.tsx

@@ -7,16 +7,24 @@ import {
   RouteProp,
 } from '@granite-js/native/@react-navigation/native';
 import { NativeStackNavigationOptions } from '@granite-js/native/@react-navigation/native-stack';
-import { ComponentProps, ComponentType, Fragment, PropsWithChildren, ReactElement, useCallback, useMemo } from 'react';
+import {
+  ComponentProps,
+  ComponentType,
+  Fragment,
+  PropsWithChildren,
+  ReactElement,
+  useCallback,
+  useMemo,
+  useState,
+} from 'react';
 import { InitialProps } from '..';
 import { closeView } from '../native-modules';
 import { BackButton } from './components/BackButton';
 import { CanGoBackGuard } from './components/CanGoBackGuard';
 import { StackNavigator } from './components/StackNavigator';
 import { useInternalRouterBackHandler } from './components/useRouterBackHandler';
-import { useInitialRouteName } from './hooks/useInitialRouteName';
 import { useRouterControls, type RouterControlsConfig } from './hooks/useRouterControls';
-import { RequireContext } from './types';
+import type { ErrorComponent, RequireContext } from './types';
 import { BASE_STACK_NAVIGATOR_STYLE } from './types/screen-option';
 
 /**
@@ -68,7 +76,7 @@ interface StackNavigatorProps {
    * @description
    * You can create and pass a NavigationContainerRef from @react-navigation/native externally. This allows external control of the router.
    */
-  navigationContainerRef?: NavigationContainerRefWithCurrent<any>;
+  navigationContainerRef?: NavigationContainerRefWithCurrent<never>;
   /**
    * @name defaultScreenOption
    * @description
@@ -83,6 +91,12 @@ interface StackNavigatorProps {
    * Container component that wraps each Screen component.
    */
   screenContainer?: ComponentType<PropsWithChildren<any>>;
+  /**
+   * @name defaultErrorComponent
+   * @description
+   * Error boundary component used when a route does not provide its own error component.
+   */
+  defaultErrorComponent?: ErrorComponent;
 }
 
 type NavigationContainerProps = Pick<
@@ -101,11 +115,12 @@ type NavigationContainerProps = Pick<
  *
  * @param {string} prefix Prefix to use when the scheme is executed. For example, to enter 'scheme://my-service/intro', you need to set 'scheme://my-service' as the prefix.
  * @param {RequireContext} context Object containing information about screens for file-based routing.
- * @param {NavigationContainerRefWithCurrent<any>} [navigationContainerRef] You can create and pass a NavigationContainerRef from @react-navigation/native externally. This allows external control of the router.
+ * @param {NavigationContainerRefWithCurrent<never>} [navigationContainerRef] You can create and pass a NavigationContainerRef from @react-navigation/native externally. This allows external control of the router.
  * @param {NativeStackNavigationOptions | ((props: { route: RouteProp<ParamListBase>; navigation: any }) => NativeStackNavigationOptions)} [defaultScreenOption] Default options for screens. You can set options to be applied commonly to screens, such as title or headerStyle.
  * @param {boolean} [canGoBack=true] Whether navigation back is possible. Default is true, and when set to true, you can use the back gesture or back button from @react-navigation/native.
  * @param {() => void} [onBack] Callback function called when the user presses the back button or uses the back gesture. For example, you can set it to log when the user presses the back button.
  * @param {ComponentType<{ children: ReactNode }>} [container=Fragment] Container component that wraps the Navigator from @react-navigation/native.
+ * @param {ComponentType<{ error: unknown; reset: () => void }>} [defaultErrorComponent] Default error component for screens without a route-specific error component.
  * @param {NavigationContainerProps} [navigationContainerProps] - You can set props to be passed to NavigationContainer from @react-navigation/native.
  *
  * @returns {ReactElement} - Returns the router component.
@@ -130,21 +145,22 @@ export function Router({
   navigationContainerRef,
   defaultScreenOption,
   screenContainer,
+  defaultErrorComponent,
   // Public props (StackNavigator)
   setIosSwipeGestureEnabled,
   getInitialUrl,
   ...navigationContainerProps
 }: InternalRouterProps & RouterProps): ReactElement {
-  const initialRouteName = useInitialRouteName({ prefix, initialScheme });
   const { Screens, linkingOptions } = useRouterControls({
     prefix,
     context,
     screenContainer,
     initialScheme,
     getInitialUrl,
+    defaultErrorComponent,
   });
 
-  const ref = useMemo(() => navigationContainerRef ?? createNavigationContainerRef<any>(), [navigationContainerRef]);
+  const ref = useMemo(() => navigationContainerRef ?? createNavigationContainerRef<never>(), [navigationContainerRef]);
 
   const { handler, canGoBack, onBack } = useInternalRouterBackHandler({
     navigationContainerRef: ref,
@@ -166,13 +182,25 @@ export function Router({
     [canGoBack, defaultScreenOption, headerLeft]
   );
 
+  const [isInitialScreen, setIsInitialScreen] = useState(true);
+
   return (
-    <NavigationContainer ref={ref} {...navigationContainerProps} linking={linkingOptions}>
-      <CanGoBackGuard canGoBack={canGoBack} onBack={onBack} setIosSwipeGestureEnabled={setIosSwipeGestureEnabled}>
+    <NavigationContainer
+      onStateChange={(state) => {
+        setIsInitialScreen(state ? state?.index === 0 : true);
+      }}
+      ref={ref}
+      {...navigationContainerProps}
+      linking={linkingOptions}
+    >
+      <CanGoBackGuard
+        canGoBack={canGoBack}
+        isInitialScreen={isInitialScreen}
+        onBack={onBack}
+        setIosSwipeGestureEnabled={setIosSwipeGestureEnabled}
+      >
         <Container {...initialProps}>
-          <StackNavigator.Navigator initialRouteName={initialRouteName} screenOptions={screenOptions}>
-            {Screens}
-          </StackNavigator.Navigator>
+          <StackNavigator.Navigator screenOptions={screenOptions}>{Screens}</StackNavigator.Navigator>
         </Container>
       </CanGoBackGuard>
     </NavigationContainer>

package/src/router/components/CanGoBackGuard.tsx

@@ -1,20 +1,19 @@
 import { ReactNode, useEffect } from 'react';
 import { BackHandler } from 'react-native';
-import { useIsInitialScreen } from '../hooks/useIsInitialScreen';
 
 export function CanGoBackGuard({
   children,
   canGoBack,
   onBack,
+  isInitialScreen,
   setIosSwipeGestureEnabled,
 }: {
   canGoBack: boolean;
+  isInitialScreen: boolean;
   children: ReactNode;
   onBack?: () => void;
   setIosSwipeGestureEnabled?: ({ isEnabled }: { isEnabled: boolean }) => void;
 }) {
-  const isInitialScreen = useIsInitialScreen();
-
   const shouldBlockGoingBack = !canGoBack;
 
   useEffect(() => {

package/src/router/components/ErrorBoundary.tsx

@@ -0,0 +1,38 @@
+import { Component, type ReactNode } from 'react';
+import type { ErrorComponent } from '../types';
+
+interface ErrorBoundaryProps {
+  fallback: ErrorComponent;
+  children: ReactNode;
+}
+
+interface ErrorBoundaryState {
+  error: unknown | null;
+}
+
+export class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
+  state: ErrorBoundaryState = {
+    error: null,
+  };
+
+  static getDerivedStateFromError(error: unknown): ErrorBoundaryState {
+    return { error };
+  }
+
+  render() {
+    if (this.state.error != null) {
+      const Fallback = this.props.fallback;
+      return <Fallback error={this.state.error} reset={this.reset} />;
+    }
+
+    return this.props.children;
+  }
+
+  private reset = () => {
+    if (this.state.error == null) {
+      return;
+    }
+
+    this.setState({ error: null });
+  };
+}

package/src/router/components/useRouterBackHandler.tsx

@@ -9,7 +9,7 @@ import { useBackEventContext } from '../../use-back-event';
  * @description
  * A hook that provides a handler for handling back navigation actions. This can be used when you need to close a view directly when the back button is pressed in modals or independent screens where there's no navigation stack. This hook uses `NavigationContainerRef` from `@react-navigation/native` to navigate to the previous screen if there's a remaining navigation stack, or executes the user-defined `onClose` function if the stack is empty.
  *
- * @param {NavigationContainerRefWithCurrent<any>} navigationContainerRef - A `NavigationContainerRef` that can reference the current navigation state. Used when executing back navigation actions.
+ * @param {NavigationContainerRefWithCurrent<never>} navigationContainerRef - A `NavigationContainerRef` that can reference the current navigation state. Used when executing back navigation actions.
  * @param {() => void} [onClose] - A function to execute when the navigation stack is empty. For example, you can pass a function that closes a React Native View.
  *
  * @returns {{ handler: () => void }} A handler function that can be used in back buttons or similar components.
@@ -48,7 +48,7 @@ export function useRouterBackHandler({
   navigationContainerRef,
   onClose,
 }: {
-  navigationContainerRef: NavigationContainerRefWithCurrent<any>;
+  navigationContainerRef: NavigationContainerRefWithCurrent<never>;
   onClose?: () => void;
 }) {
   const { handler } = useInternalRouterBackHandler({ navigationContainerRef, onClose });
@@ -60,7 +60,7 @@ export function useInternalRouterBackHandler({
   navigationContainerRef,
   onClose,
 }: {
-  navigationContainerRef: NavigationContainerRefWithCurrent<any>;
+  navigationContainerRef: NavigationContainerRefWithCurrent<never>;
   onClose?: () => void;
 }) {
   const { hasBackEvent, onBack } = useBackEventContext();

package/src/router/createRoute.ts

@@ -10,6 +10,7 @@ import {
 import type { StandardSchemaV1 } from '@standard-schema/spec';
 import { useMemo } from 'react';
 import { RESERVED_PATHS } from './constants';
+import type { ErrorComponent } from './types';
 import { defaultParserParams } from './utils/defaultParserParams';
 import { type InferOutput, type InferInput } from './utils/standardSchema';
 import { validateRouteParams } from './utils/validateRouteParams';
@@ -18,6 +19,7 @@ export interface RouteOptions<T extends Readonly<object | undefined>> {
   parserParams?: (params: Record<string, unknown>) => Record<string, unknown>;
   validateParams?: ((params: Readonly<object | undefined>) => T) | StandardSchemaV1<any, T>;
   component: React.FC<any>;
+  errorComponent?: ErrorComponent;
   screenOptions?: NativeStackNavigationOptions | ((context: { params: T }) => NativeStackNavigationOptions);
 }
 
@@ -49,8 +51,9 @@ export type RouteHooksOptions<TScreen extends keyof RegisterScreen> =
 export const routeMap = new Map<
   keyof RegisterScreenInput,
   {
-    options: Omit<RouteOptions<any>, 'component' | 'screenOptions'>;
+    options: Omit<RouteOptions<any>, 'component' | 'screenOptions' | 'errorComponent'>;
     component: React.FC<any>;
+    errorComponent?: ErrorComponent;
     screenOptions?: NativeStackNavigationOptions | ((context: { params: any }) => NativeStackNavigationOptions);
   }
 >();
@@ -193,10 +196,11 @@ export function createRoute<T extends Readonly<object | undefined>>(
 
 // Implementation
 export function createRoute(path: keyof RegisterScreenInput, options: RouteOptions<any>) {
-  const { component, screenOptions, ...restOptions } = options;
+  const { component, screenOptions, errorComponent, ...restOptions } = options;
   routeMap.set(path, {
     options: restOptions,
     component,
+    errorComponent,
     screenOptions: screenOptions,
   });
 

package/src/router/hooks/useRouterControls.tsx

@@ -1,8 +1,9 @@
 import { NavigationContainer } from '@granite-js/native/@react-navigation/native';
 import { useMemo, type ComponentProps, type ComponentType, type PropsWithChildren } from 'react';
+import { ErrorBoundary } from '../components/ErrorBoundary';
 import { StackNavigator } from '../components/StackNavigator';
 import { RESERVED_KEYWORDS } from '../constants';
-import { RequireContext } from '../types/RequireContext';
+import type { ErrorComponent, RequireContext } from '../types';
 import { getRouteScreens, getScreenPathMapConfig } from '../utils';
 import { createParentRouteScreenMap } from '../utils/createParentRouteScreenMap';
 import { mergeParentLayoutScreen } from '../utils/mergeParentLayoutScreen';
@@ -16,6 +17,7 @@ export interface RouterControlsConfig {
   context: RequireContext;
   getInitialUrl?: (initialScheme: string) => string | undefined | Promise<string | undefined>;
   screenContainer?: ComponentType<PropsWithChildren<any>>;
+  defaultErrorComponent?: ErrorComponent;
 }
 
 export function useRouterControls({
@@ -24,6 +26,7 @@ export function useRouterControls({
   screenContainer: ScreenContainer,
   getInitialUrl = defaultGetInitialUrl,
   initialScheme,
+  defaultErrorComponent,
 }: RouterControlsConfig) {
   const routeScreens = useMemo(() => getRouteScreens(context), [context]);
 
@@ -37,16 +40,27 @@ export function useRouterControls({
 
   const Screens = useMemo(() => {
     return registerScreens.map((routeScreen) => {
+      const RouteErrorComponent = routeScreen.errorComponent;
       const Layout = mergeParentLayoutScreen(layoutScreenMap, routeScreen.path);
 
       const Component = function Component() {
-        const element = (
-          <Layout>
+        const routeElement =
+          RouteErrorComponent == null ? (
             <routeScreen.component />
-          </Layout>
-        );
+          ) : (
+            <ErrorBoundary fallback={RouteErrorComponent}>
+              <routeScreen.component />
+            </ErrorBoundary>
+          );
 
-        return ScreenContainer == null ? element : <ScreenContainer>{element}</ScreenContainer>;
+        const element = <Layout>{routeElement}</Layout>;
+        const wrappedElement = ScreenContainer == null ? element : <ScreenContainer>{element}</ScreenContainer>;
+
+        if (defaultErrorComponent == null) {
+          return wrappedElement;
+        }
+
+        return <ErrorBoundary fallback={defaultErrorComponent}>{wrappedElement}</ErrorBoundary>;
       };
 
       const routePath = routeScreen.path;
@@ -54,7 +68,7 @@ export function useRouterControls({
 
       return <StackNavigator.Screen key={routePath} name={routePath} component={Component} options={options} />;
     });
-  }, [registerScreens, layoutScreenMap, ScreenContainer]);
+  }, [registerScreens, layoutScreenMap, ScreenContainer, defaultErrorComponent]);
 
   const linkingOptions: NavigationContainerProps['linking'] = useMemo(() => {
     return {

package/src/router/types/ErrorComponent.ts

@@ -0,0 +1,8 @@
+import type { ComponentType } from 'react';
+
+export interface ErrorComponentProps {
+  error: unknown;
+  reset: () => void;
+}
+
+export type ErrorComponent = ComponentType<ErrorComponentProps>;

package/src/router/types/RouteScreen.ts

@@ -1,4 +1,5 @@
 import { NativeStackNavigationOptions } from '@granite-js/native/@react-navigation/native-stack';
+import type { ErrorComponent } from './ErrorComponent';
 import { Screen } from './Screen';
 
 /**
@@ -15,6 +16,11 @@ export interface RouteScreen {
    * @description Screen component
    */
   component: Screen;
+  /**
+   * @name errorComponent
+   * @description Error boundary component for this screen
+   */
+  errorComponent?: ErrorComponent;
   /**
    * @name screenOptions
    * @description Screen options for React Navigation (can be static or a function that receives route params)

package/src/router/types/index.ts

@@ -1,3 +1,4 @@
 export * from './RequireContext';
 export * from './RouteScreen';
 export * from './Screen';
+export * from './ErrorComponent';

package/src/router/utils/screen.tsx

@@ -36,6 +36,7 @@ export function getRouteScreens(context: RequireContext): RouteScreen[] {
 
     // Retrieve route configuration from routeMap
     const routeMapEntry = routeMap.get(context(key)?.Route?._path);
+    const errorComponent = routeMapEntry?.errorComponent;
 
     // Get screenOptions from routeMap or component (routeMap takes priority)
     const rawScreenOptions = routeMapEntry?.screenOptions ?? component.screenOptions;
@@ -64,6 +65,7 @@ export function getRouteScreens(context: RequireContext): RouteScreen[] {
     return {
       path,
       component,
+      errorComponent,
       screenOptions,
     };
   });

package/src/status-bar/utils.ts

@@ -1,9 +1,9 @@
+import { ColorSchemeName } from 'react-native';
 import type { StatusBarStyle } from './types';
-import type { ColorPreference } from '../initial-props';
 
 export function toStatusBarContentStyle(
   statusBarStyle: StatusBarStyle = 'auto',
-  colorPreference: ColorPreference = 'light'
+  colorPreference: ColorSchemeName = 'light'
 ): 'light-content' | 'dark-content' {
   const resolvedStyle = (() => {
     switch (statusBarStyle) {

package/src/types/global.ts

@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/naming-convention */
-/* eslint-disable no-var */
+
 import type { ComponentType } from 'react';
 
 export interface GraniteGlobal {

package/src/video/Video.tsx

@@ -1,10 +1,9 @@
-import type { default as VideoRef } from '@granite-js/native/react-native-video';
+import VideoBase, { type VideoRef } from '@granite-js/video';
 import { ComponentProps, forwardRef, useMemo, useState } from 'react';
 import { Animated, Platform } from 'react-native';
-import * as instance from './instance';
 import { useVisibility } from '../visibility';
 
-const AnimatedRNVideo = Animated.createAnimatedComponent(instance.Component);
+const AnimatedRNVideo = Animated.createAnimatedComponent(VideoBase);
 
 type VideoProps = ComponentProps<typeof AnimatedRNVideo>;
 
@@ -15,13 +14,8 @@ type VideoProps = ComponentProps<typeof AnimatedRNVideo>;
  * @description
  * The Video component implements audio focus control logic to prevent the sandbox app from stopping music playing in other apps. It automatically plays or pauses based on the app's state. For example, when the app transitions to the background, the video automatically pauses.
  *
- * ::: warning
- * The Video component uses [react-native-video version (6.0.0-alpha.6)](https://github.com/TheWidlarzGroup/react-native-video/tree/v6.0.0-alpha.6). Therefore, some types or features may not be compatible with the latest version.
- * :::
- *
  * @property {boolean} [isAvailable] Value to check if the `Video` component can be used. You can check this value to determine if the user can render the video or if video functionality is unavailable due to environmental constraints (e.g., network connection issues, unsupported devices). If this value is `false`, you should handle it by not rendering the video or providing alternative content.
  *
- * @param {VideoProperties} [props] Properties provided by [`react-native-video`](https://github.com/TheWidlarzGroup/react-native-video/tree/v6.0.0-alpha.6).
  * @param {string} [props.source.uri] Source of the video to play. Can be set to a file path or URL.
  * @param {boolean} [props.muted=false] Controls the mute state of the video. If `true`, the video's audio is muted; if `false`, the audio plays. Default is `false`.
  * @param {boolean} [props.paused=false] Property to control video playback. If `true`, the video is paused; if `false`, the video plays. Default is `false`, and it autoplays.
@@ -30,11 +24,6 @@ type VideoProps = ComponentProps<typeof AnimatedRNVideo>;
  *
  * @returns {JSX.Element} Returns a JSX element that renders the video. Uses `Animated` to provide smooth animation effects during video playback.
  *
- * @see [react-native-video] https://github.com/react-native-video/react-native-video
- * For detailed properties of the video component, please refer to the official documentation.
- * @see [react-native-video-6.0.0] https://github.com/TheWidlarzGroup/react-native-video/releases/tag/v6.0.0
- * This is the source code of the version currently installed in the sandbox app.
- *
  * @example
  *
  * ### Video Autoplay Example
@@ -62,7 +51,7 @@ type VideoProps = ComponentProps<typeof AnimatedRNVideo>;
  * }
  * ```
  */
-const VideoImpl = forwardRef<VideoRef, instance.VideoNativeProps>((props, ref) => {
+const VideoImpl = forwardRef<VideoRef, VideoProps>((props, ref) => {
   const [isFocused, setIsFocused] = useState(props.muted || props.paused);
   const visible = useVisibility();
 
@@ -77,11 +66,11 @@ const VideoImpl = forwardRef<VideoRef, instance.VideoNativeProps>((props, ref) =
 
   return (
     <AnimatedRNVideo
-      ref={ref as any}
+      ref={ref}
       progressUpdateInterval={16}
       disableFocus={Platform.OS === 'ios' ? false : disableFocus}
       playWhenInactive
-      onAudioFocusChanged={(event: any) => {
+      onAudioFocusChanged={(event) => {
         setIsFocused(event.hasAudioFocus);
         props.onAudioFocusChanged?.(event);
       }}
@@ -94,7 +83,7 @@ const VideoImpl = forwardRef<VideoRef, instance.VideoNativeProps>((props, ref) =
 });
 
 export const Video = Object.defineProperty(VideoImpl, 'isAvailable', {
-  get: () => instance.isAvailable,
+  get: () => VideoBase.isAvailable,
   configurable: false,
 }) as typeof VideoImpl & { isAvailable: boolean };
 

package/src/visibility/VisibilityProvider.tsx

@@ -1,7 +1,7 @@
 import { ReactElement, ReactNode, useEffect, useState } from 'react';
 import { AppStateProvider } from './useIsAppForeground';
 import { VisibilityChangedProvider } from './useVisibilityChanged';
-import { nativeEventEmitter } from '../native-event-emitter/nativeEventEmitter';
+import { GraniteModule } from '../native-modules/natives/GraniteBrownfieldModule.brick';
 
 interface Props {
   isVisible: boolean;
@@ -33,8 +33,8 @@ export function VisibilityProvider({ isVisible, children }: Props): ReactElement
   const [visible, setVisible] = useState(isVisible);
 
   useEffect(() => {
-    const subscription = nativeEventEmitter.addListener('visibilityChanged', (nextVisible) => {
-      setVisible(nextVisible);
+    const subscription = GraniteModule.onVisibilityChanged(({ visible }) => {
+      setVisible(visible);
     });
 
     return () => {

package/src/visibility/utils/usePrevious.tsx

@@ -15,7 +15,7 @@ import { useEffect, useRef } from 'react';
  * ```
  */
 export function usePrevious<T>(value: T): T {
-  const ref: any = useRef<T>();
+  const ref: any = useRef<T>(null);
   useEffect(() => {
     ref.current = value;
   }, [value]);

package/dist/blur/BlurView.d.ts

@@ -1,78 +0,0 @@
-import type { BlurViewProps as InternalBlurViewProps } from '@granite-js/native/@react-native-community/blur';
-import { ViewProps } from 'react-native';
-export type BlurType = InternalBlurViewProps['blurType'];
-export interface BlurViewProps extends ViewProps {
-    blurType?: BlurType;
-    blurAmount?: number;
-    vibrancyEffect?: boolean;
-    reducedTransparencyFallbackColor?: string;
-}
-/**
- * @public
- * @category UI
- * @name BlurView
- * @description
- * `BlurView` adds a blurred background effect, primarily on iOS. It creates a visual blur on the background view.
- *
- * This component is supported only on iOS. On Android, it simply renders a regular [`View`](https://reactnative.dev/docs/0.72/view) without any blur effect.
- *
- * You can control the blur intensity and optionally enable the [vibrancy effect](https://developer.apple.com/documentation/uikit/uivibrancyeffect?language=objc), which enhances the visual impact of content displayed over a blurred background.
- *
- * If blur is not supported or doesn't render properly, you can use the `reducedTransparencyFallbackColor` prop to set a fallback background color.
- *
- * Use the `isSupported` property to check whether the current device supports blur. Blur is available on iOS from version 5.126.0 and not supported on Android.
- *
- * @param {BlurViewProps} [props] The props you can pass to `BlurView`. It extends `react-native`'s `ViewProps`, so you can use layout and style properties. The props align with those of [`@react-native-community/blur`](https://github.com/Kureev/react-native-blur/tree/v4.3.2?tab=readme-ov-file#blurview).
- * @param {BlurType} [props.blurType] Type of blur to apply, such as `light`, `dark`, or `extraDark`.
- * @param {number} [props.blurAmount=10] Intensity of the blur effect. Higher values make the blur stronger. Accepts values from `0` to `100`. Default is `10`.
- * @param {boolean} [props.vibrancyEffect=false] Enables the vibrancy effect. This effect enhances content displayed on top of the blur. Only supported on iOS. Default is `false`.
- * @param {string} [props.reducedTransparencyFallbackColor] Fallback background color used when blur cannot be applied due to system settings or device limitations.
- *
- * @returns {JSX.Element} On iOS, returns a blurred `BlurView` or `VibrancyView` component. On Android, returns a regular `View` without blur.
- *
- * ::: warning Note
- * `BlurView` is only supported on iOS. On Android, it renders a regular `View` without any blur effect.
- * :::
- *
- * @example
- *
- * ### Blurring background behind a text
- *
- * ```tsx
- * import { BlurView } from '@granite-js/react-native';
- * import { View, Text, StyleSheet } from 'react-native';
- *
- * export function BlurViewExample() {
- *   return (
- *     <View style={styles.container}>
- *       <Text style={styles.absolute}>Blurred Text</Text>
- *       <BlurView style={styles.absolute} blurType="light" blurAmount={1} />
- *       <Text>Non Blurred Text</Text>
- *     </View>
- *   );
- * }
- *
- * const styles = StyleSheet.create({
- *   container: {
- *     justifyContent: 'center',
- *     alignItems: 'center',
- *     width: '100%',
- *     height: 300,
- *   },
- *   absolute: {
- *     position: 'absolute',
- *     top: 0,
- *     left: 0,
- *     bottom: 0,
- *     right: 0,
- *   },
- * });
- * ```
- *
- * @see [iOS Vibrancy Effect Documentation](https://developer.apple.com/documentation/uikit/uivibrancyeffect)
- * @see [Zeddios Blog Explanation](https://zeddios.tistory.com/1140)
- */
-export declare function BlurView({ blurType, blurAmount, reducedTransparencyFallbackColor, vibrancyEffect, ...viewProps }: BlurViewProps): import("react/jsx-runtime").JSX.Element;
-export declare namespace BlurView {
-    var isSupported: boolean;
-}

package/dist/blur/ReactNativeBlurModule.d.ts

@@ -1,6 +0,0 @@
-import type { BlurView, VibrancyView } from '@granite-js/native/@react-native-community/blur';
-declare const ReactNativeBlurModule: {
-    BlurView: typeof BlurView;
-    VibrancyView: typeof VibrancyView;
-} | undefined;
-export { ReactNativeBlurModule };

package/dist/blur/constants.d.ts

@@ -1 +0,0 @@
-export declare const isBlurNativeModuleSupported: boolean;

package/dist/blur/index.d.ts

@@ -1 +0,0 @@
-export * from './BlurView';

package/dist/chunk-A3JGM5OI.mjs

@@ -1,7 +0,0 @@
-// src/native-modules/natives/GraniteModule.ts
-import { TurboModuleRegistry } from "react-native";
-var GraniteModule = TurboModuleRegistry.getEnforcing("GraniteModule");
-
-export {
-  GraniteModule
-};

package/dist/native-event-emitter/eventEmitters/index.d.ts

@@ -1,2 +0,0 @@
-import { VisibilityChangedEventEmitter } from './visibilityChanged';
-export type EventEmitters = VisibilityChangedEventEmitter;

package/dist/native-event-emitter/eventEmitters/types.d.ts

@@ -1,4 +0,0 @@
-export interface EventEmitterSchema<K extends string, P extends unknown[]> {
-    name: K;
-    params: P;
-}

package/dist/native-event-emitter/eventEmitters/visibilityChanged.d.ts

@@ -1,10 +0,0 @@
-import { EventEmitterSchema } from './types';
-/**
- * @name VisibilityChangedEventEmitter
- * @kind typedef
- * @platform iOS
- * @description
- * Emits an event when the visibility state of the app changes.
- * Only available on iOS.
- */
-export type VisibilityChangedEventEmitter = EventEmitterSchema<'visibilityChanged', [boolean]>;

package/dist/native-event-emitter/index.d.ts

@@ -1 +0,0 @@
-export * from './nativeEventEmitter';