Skip to content

Workaround for React Native < 0.80 #11

Description

@okwasniewski

Patch for using this library with React Native < 0.80

We used stable JS Stable api in this library meaning we import everything from 'react-native' package without deep imports.

This breaks codegen on older versions of React Native. If for some reason you can't upgrade to 0.80 you can temporarily include this patch in your code.

Note

This library only supports new architecture.

It's all about changing the TypeScript imports:

diff --git a/lib/module/LiquidGlassViewContainerNativeComponent.ts b/lib/module/LiquidGlassViewContainerNativeComponent.ts
index 40dae13609179afb7f785b8b92f42a97da6f297f..f074a4b03ac13139ba77e69a68122f7fa0ef7840 100644
--- a/lib/module/LiquidGlassViewContainerNativeComponent.ts
+++ b/lib/module/LiquidGlassViewContainerNativeComponent.ts
@@ -1,15 +1,15 @@
 import {
   codegenNativeComponent,
   type ViewProps,
-  type CodegenTypes,
 } from 'react-native';
+import type { Float } from 'react-native/Libraries/Types/CodegenTypes';
 
 export interface NativeProps extends ViewProps {
   /**
    * The distance between elements at which they begin to merge.
    * Defaults to 0.
    */
-  spacing?: CodegenTypes.Float;
+  spacing?: Float;
 }
 
 export default codegenNativeComponent<NativeProps>('LiquidGlassContainerView');
diff --git a/lib/module/LiquidGlassViewNativeComponent.ts b/lib/module/LiquidGlassViewNativeComponent.ts
index 7fba378efba84268500cea0e21ab857032f32ae1..b4c8172ccec7c45bb6d1699edcb2ddd146c7d052 100644
--- a/lib/module/LiquidGlassViewNativeComponent.ts
+++ b/lib/module/LiquidGlassViewNativeComponent.ts
@@ -2,8 +2,8 @@ import {
   codegenNativeComponent,
   type ViewProps,
   type ColorValue,
-  type CodegenTypes,
 } from 'react-native';
+import type { WithDefault } from 'react-native/Libraries/Types/CodegenTypes';
 
 export interface NativeProps extends ViewProps {
   /**
@@ -18,7 +18,7 @@ export interface NativeProps extends ViewProps {
    *
    * Defaults to 'regular'.
    */
-  effect?: CodegenTypes.WithDefault<'clear' | 'regular', 'regular'>;
+  effect?: WithDefault<'clear' | 'regular', 'regular'>;
   /**
    * The color of the glass effect.
    *
@@ -31,7 +31,7 @@ export interface NativeProps extends ViewProps {
    *
    * Defaults to 'system'.
    */
-  colorScheme?: CodegenTypes.WithDefault<'light' | 'dark' | 'system', 'system'>;
+  colorScheme?: WithDefault<'light' | 'dark' | 'system', 'system'>;
 }
 
 export default codegenNativeComponent<NativeProps>('LiquidGlassView');
diff --git a/src/LiquidGlassViewContainerNativeComponent.ts b/src/LiquidGlassViewContainerNativeComponent.ts
index 40dae13609179afb7f785b8b92f42a97da6f297f..402360637ba1f9e9fcc91fcf7ca3526d94512fed 100644
--- a/src/LiquidGlassViewContainerNativeComponent.ts
+++ b/src/LiquidGlassViewContainerNativeComponent.ts
@@ -1,15 +1,12 @@
-import {
-  codegenNativeComponent,
-  type ViewProps,
-  type CodegenTypes,
-} from 'react-native';
+import { codegenNativeComponent, type ViewProps } from 'react-native';
+import type { Float } from 'react-native/Libraries/Types/CodegenTypes';
 
 export interface NativeProps extends ViewProps {
   /**
    * The distance between elements at which they begin to merge.
    * Defaults to 0.
    */
-  spacing?: CodegenTypes.Float;
+  spacing?: Float;
 }
 
 export default codegenNativeComponent<NativeProps>('LiquidGlassContainerView');
diff --git a/src/LiquidGlassViewNativeComponent.ts b/src/LiquidGlassViewNativeComponent.ts
index 7fba378efba84268500cea0e21ab857032f32ae1..b4c8172ccec7c45bb6d1699edcb2ddd146c7d052 100644
--- a/src/LiquidGlassViewNativeComponent.ts
+++ b/src/LiquidGlassViewNativeComponent.ts
@@ -2,8 +2,8 @@ import {
   codegenNativeComponent,
   type ViewProps,
   type ColorValue,
-  type CodegenTypes,
 } from 'react-native';
+import type { WithDefault } from 'react-native/Libraries/Types/CodegenTypes';
 
 export interface NativeProps extends ViewProps {
   /**
@@ -18,7 +18,7 @@ export interface NativeProps extends ViewProps {
    *
    * Defaults to 'regular'.
    */
-  effect?: CodegenTypes.WithDefault<'clear' | 'regular', 'regular'>;
+  effect?: WithDefault<'clear' | 'regular', 'regular'>;
   /**
    * The color of the glass effect.
    *
@@ -31,7 +31,7 @@ export interface NativeProps extends ViewProps {
    *
    * Defaults to 'system'.
    */
-  colorScheme?: CodegenTypes.WithDefault<'light' | 'dark' | 'system', 'system'>;
+  colorScheme?: WithDefault<'light' | 'dark' | 'system', 'system'>;
 }
 
 export default codegenNativeComponent<NativeProps>('LiquidGlassView');

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions