@sbaiahmed1/react-native-blur 4.5.2-alpha.0 → 4.5.2-alpha.2

package/lib/module/ReactNativeBlurViewNativeComponent.ts

@@ -4,29 +4,10 @@ import type {
   WithDefault,
   Double,
 } from 'react-native/Libraries/Types/CodegenTypes';
+import type { BlurType } from './types';
 
-export type BlurType =
-  | 'xlight'
-  | 'light'
-  | 'dark'
-  | 'extraDark'
-  | 'regular'
-  | 'prominent'
-  | 'systemUltraThinMaterial'
-  | 'systemThinMaterial'
-  | 'systemMaterial'
-  | 'systemThickMaterial'
-  | 'systemChromeMaterial'
-  | 'systemUltraThinMaterialLight'
-  | 'systemThinMaterialLight'
-  | 'systemMaterialLight'
-  | 'systemThickMaterialLight'
-  | 'systemChromeMaterialLight'
-  | 'systemUltraThinMaterialDark'
-  | 'systemThinMaterialDark'
-  | 'systemMaterialDark'
-  | 'systemThickMaterialDark'
-  | 'systemChromeMaterialDark';
+// Re-export for backward compatibility
+export type { BlurType };
 
 interface NativeProps extends ViewProps {
   blurAmount?: WithDefault<Double, 10.0>;

package/lib/module/ReactNativeLiquidGlassViewNativeComponent.ts

@@ -4,8 +4,10 @@ import type {
   WithDefault,
   Double,
 } from 'react-native/Libraries/Types/CodegenTypes';
+import type { GlassType } from './types';
 
-export type GlassType = 'clear' | 'regular';
+// Re-export for backward compatibility
+export type { GlassType };
 
 interface NativeProps extends ViewProps {
   /**

package/lib/module/ReactNativeProgressiveBlurViewNativeComponent.ts

@@ -4,34 +4,10 @@ import type {
   WithDefault,
   Double,
 } from 'react-native/Libraries/Types/CodegenTypes';
+import type { BlurType, ProgressiveBlurDirection } from './types';
 
-export type BlurType =
-  | 'xlight'
-  | 'light'
-  | 'dark'
-  | 'extraDark'
-  | 'regular'
-  | 'prominent'
-  | 'systemUltraThinMaterial'
-  | 'systemThinMaterial'
-  | 'systemMaterial'
-  | 'systemThickMaterial'
-  | 'systemChromeMaterial'
-  | 'systemUltraThinMaterialLight'
-  | 'systemThinMaterialLight'
-  | 'systemMaterialLight'
-  | 'systemThickMaterialLight'
-  | 'systemChromeMaterialLight'
-  | 'systemUltraThinMaterialDark'
-  | 'systemThinMaterialDark'
-  | 'systemMaterialDark'
-  | 'systemThickMaterialDark'
-  | 'systemChromeMaterialDark';
-
-export type ProgressiveBlurDirection =
-  | 'blurredTopClearBottom'
-  | 'blurredBottomClearTop'
-  | 'blurredCenterClearTopAndBottom';
+// Re-export for backward compatibility
+export type { BlurType, ProgressiveBlurDirection };
 
 interface NativeProps extends ViewProps {
   blurAmount?: WithDefault<Double, 20.0>;

package/lib/module/index.web.js

@@ -0,0 +1,19 @@
+"use strict";
+
+// Web-specific exports
+// Only exports components that have web implementations
+
+export { BlurView as default, BlurView } from "./BlurView.web.js";
+
+// Re-export types (these don't import native code)
+
+// Note: The following components are not yet supported on web:
+// - VibrancyView (iOS-specific)
+// - ProgressiveBlurView (requires native gradient blur)
+// - LiquidGlassView (iOS 26+ specific)
+// - LiquidGlassContainer (iOS 26+ specific)
+// - BlurSwitch (Android-specific)
+//
+// Attempting to use these on web will result in import errors.
+// Consider using BlurView as a fallback for web platforms.
+//# sourceMappingURL=index.web.js.map

package/lib/module/index.web.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BlurView","default"],"sourceRoot":"../../src","sources":["index.web.tsx"],"mappings":";;AAAA;AACA;;AAEA,SAASA,QAAQ,IAAIC,OAAO,EAAED,QAAQ,QAAQ,mBAAgB;;AAG9D;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","ignoreList":[]}

package/lib/module/types.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=types.js.map

package/lib/module/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../src","sources":["types.ts"],"mappings":"","ignoreList":[]}

package/lib/typescript/src/ReactNativeBlurViewNativeComponent.d.ts

@@ -1,6 +1,7 @@
 import type { ViewProps } from 'react-native';
 import type { WithDefault, Double } from 'react-native/Libraries/Types/CodegenTypes';
-export type BlurType = 'xlight' | 'light' | 'dark' | 'extraDark' | 'regular' | 'prominent' | 'systemUltraThinMaterial' | 'systemThinMaterial' | 'systemMaterial' | 'systemThickMaterial' | 'systemChromeMaterial' | 'systemUltraThinMaterialLight' | 'systemThinMaterialLight' | 'systemMaterialLight' | 'systemThickMaterialLight' | 'systemChromeMaterialLight' | 'systemUltraThinMaterialDark' | 'systemThinMaterialDark' | 'systemMaterialDark' | 'systemThickMaterialDark' | 'systemChromeMaterialDark';
+import type { BlurType } from './types';
+export type { BlurType };
 interface NativeProps extends ViewProps {
     blurAmount?: WithDefault<Double, 10.0>;
     blurType?: WithDefault<BlurType, 'xlight'>;

package/lib/typescript/src/ReactNativeBlurViewNativeComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ReactNativeBlurViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/ReactNativeBlurViewNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,KAAK,EACV,WAAW,EACX,MAAM,EACP,MAAM,2CAA2C,CAAC;AAEnD,MAAM,MAAM,QAAQ,GAChB,QAAQ,GACR,OAAO,GACP,MAAM,GACN,WAAW,GACX,SAAS,GACT,WAAW,GACX,yBAAyB,GACzB,oBAAoB,GACpB,gBAAgB,GAChB,qBAAqB,GACrB,sBAAsB,GACtB,8BAA8B,GAC9B,yBAAyB,GACzB,qBAAqB,GACrB,0BAA0B,GAC1B,2BAA2B,GAC3B,6BAA6B,GAC7B,wBAAwB,GACxB,oBAAoB,GACpB,yBAAyB,GACzB,0BAA0B,CAAC;AAE/B,UAAU,WAAY,SAAQ,SAAS;IACrC,UAAU,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IACvC,QAAQ,CAAC,EAAE,WAAW,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;IAC3C,gCAAgC,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IAClE,cAAc,CAAC,EAAE,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;CAC9C;;AAED,wBAA0E"}
+{"version":3,"file":"ReactNativeBlurViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/ReactNativeBlurViewNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,KAAK,EACV,WAAW,EACX,MAAM,EACP,MAAM,2CAA2C,CAAC;AACnD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAGxC,YAAY,EAAE,QAAQ,EAAE,CAAC;AAEzB,UAAU,WAAY,SAAQ,SAAS;IACrC,UAAU,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IACvC,QAAQ,CAAC,EAAE,WAAW,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;IAC3C,gCAAgC,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IAClE,cAAc,CAAC,EAAE,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;CAC9C;;AAED,wBAA0E"}

package/lib/typescript/src/ReactNativeLiquidGlassViewNativeComponent.d.ts

@@ -1,6 +1,7 @@
 import type { ViewProps } from 'react-native';
 import type { WithDefault, Double } from 'react-native/Libraries/Types/CodegenTypes';
-export type GlassType = 'clear' | 'regular';
+import type { GlassType } from './types';
+export type { GlassType };
 interface NativeProps extends ViewProps {
     /**
      * The type of glass effect to apply

package/lib/typescript/src/ReactNativeLiquidGlassViewNativeComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ReactNativeLiquidGlassViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/ReactNativeLiquidGlassViewNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,KAAK,EACV,WAAW,EACX,MAAM,EACP,MAAM,2CAA2C,CAAC;AAEnD,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;AAE5C,UAAU,WAAY,SAAQ,SAAS;IACrC;;;;OAIG;IACH,SAAS,CAAC,EAAE,WAAW,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;IAE5C;;;;OAIG;IACH,cAAc,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAE9C;;;;OAIG;IACH,YAAY,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAExC;;;;OAIG;IACH,gCAAgC,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IAElE;;;;OAIG;IACH,aAAa,CAAC,EAAE,WAAW,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;IAE3C;;;;OAIG;IACH,cAAc,CAAC,EAAE,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;CAC9C;;AAED,wBAGE"}
+{"version":3,"file":"ReactNativeLiquidGlassViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/ReactNativeLiquidGlassViewNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,KAAK,EACV,WAAW,EACX,MAAM,EACP,MAAM,2CAA2C,CAAC;AACnD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGzC,YAAY,EAAE,SAAS,EAAE,CAAC;AAE1B,UAAU,WAAY,SAAQ,SAAS;IACrC;;;;OAIG;IACH,SAAS,CAAC,EAAE,WAAW,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;IAE5C;;;;OAIG;IACH,cAAc,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAE9C;;;;OAIG;IACH,YAAY,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAExC;;;;OAIG;IACH,gCAAgC,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IAElE;;;;OAIG;IACH,aAAa,CAAC,EAAE,WAAW,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;IAE3C;;;;OAIG;IACH,cAAc,CAAC,EAAE,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;CAC9C;;AAED,wBAGE"}

package/lib/typescript/src/ReactNativeProgressiveBlurViewNativeComponent.d.ts

@@ -1,7 +1,7 @@
 import type { ViewProps } from 'react-native';
 import type { WithDefault, Double } from 'react-native/Libraries/Types/CodegenTypes';
-export type BlurType = 'xlight' | 'light' | 'dark' | 'extraDark' | 'regular' | 'prominent' | 'systemUltraThinMaterial' | 'systemThinMaterial' | 'systemMaterial' | 'systemThickMaterial' | 'systemChromeMaterial' | 'systemUltraThinMaterialLight' | 'systemThinMaterialLight' | 'systemMaterialLight' | 'systemThickMaterialLight' | 'systemChromeMaterialLight' | 'systemUltraThinMaterialDark' | 'systemThinMaterialDark' | 'systemMaterialDark' | 'systemThickMaterialDark' | 'systemChromeMaterialDark';
-export type ProgressiveBlurDirection = 'blurredTopClearBottom' | 'blurredBottomClearTop' | 'blurredCenterClearTopAndBottom';
+import type { BlurType, ProgressiveBlurDirection } from './types';
+export type { BlurType, ProgressiveBlurDirection };
 interface NativeProps extends ViewProps {
     blurAmount?: WithDefault<Double, 20.0>;
     blurType?: WithDefault<BlurType, 'regular'>;

package/lib/typescript/src/ReactNativeProgressiveBlurViewNativeComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ReactNativeProgressiveBlurViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/ReactNativeProgressiveBlurViewNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,KAAK,EACV,WAAW,EACX,MAAM,EACP,MAAM,2CAA2C,CAAC;AAEnD,MAAM,MAAM,QAAQ,GAChB,QAAQ,GACR,OAAO,GACP,MAAM,GACN,WAAW,GACX,SAAS,GACT,WAAW,GACX,yBAAyB,GACzB,oBAAoB,GACpB,gBAAgB,GAChB,qBAAqB,GACrB,sBAAsB,GACtB,8BAA8B,GAC9B,yBAAyB,GACzB,qBAAqB,GACrB,0BAA0B,GAC1B,2BAA2B,GAC3B,6BAA6B,GAC7B,wBAAwB,GACxB,oBAAoB,GACpB,yBAAyB,GACzB,0BAA0B,CAAC;AAE/B,MAAM,MAAM,wBAAwB,GAChC,uBAAuB,GACvB,uBAAuB,GACvB,gCAAgC,CAAC;AAErC,UAAU,WAAY,SAAQ,SAAS;IACrC,UAAU,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IACvC,QAAQ,CAAC,EAAE,WAAW,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;IAC5C,SAAS,CAAC,EAAE,WAAW,CAAC,wBAAwB,EAAE,uBAAuB,CAAC,CAAC;IAC3E,WAAW,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACvC,gCAAgC,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;CACnE;;AAED,wBAEE"}
+{"version":3,"file":"ReactNativeProgressiveBlurViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/ReactNativeProgressiveBlurViewNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,KAAK,EACV,WAAW,EACX,MAAM,EACP,MAAM,2CAA2C,CAAC;AACnD,OAAO,KAAK,EAAE,QAAQ,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAC;AAGlE,YAAY,EAAE,QAAQ,EAAE,wBAAwB,EAAE,CAAC;AAEnD,UAAU,WAAY,SAAQ,SAAS;IACrC,UAAU,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IACvC,QAAQ,CAAC,EAAE,WAAW,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;IAC5C,SAAS,CAAC,EAAE,WAAW,CAAC,wBAAwB,EAAE,uBAAuB,CAAC,CAAC;IAC3E,WAAW,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACvC,gCAAgC,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;CACnE;;AAED,wBAEE"}

package/lib/typescript/src/index.web.d.ts

@@ -0,0 +1,4 @@
+export { BlurView as default, BlurView } from './BlurView.web';
+export type { BlurViewProps } from './BlurView';
+export type { BlurType, GlassType, ProgressiveBlurDirection } from './types';
+//# sourceMappingURL=index.web.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.web.d.ts","sourceRoot":"","sources":["../../../src/index.web.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,QAAQ,IAAI,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC/D,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAGhD,YAAY,EAAE,QAAQ,EAAE,SAAS,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAC"}

package/lib/typescript/src/types.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Shared types for @sbaiahmed1/react-native-blur
+ * These types are platform-agnostic and can be used on iOS, Android, and Web
+ */
+export type BlurType = 'xlight' | 'light' | 'dark' | 'extraDark' | 'regular' | 'prominent' | 'systemUltraThinMaterial' | 'systemThinMaterial' | 'systemMaterial' | 'systemThickMaterial' | 'systemChromeMaterial' | 'systemUltraThinMaterialLight' | 'systemThinMaterialLight' | 'systemMaterialLight' | 'systemThickMaterialLight' | 'systemChromeMaterialLight' | 'systemUltraThinMaterialDark' | 'systemThinMaterialDark' | 'systemMaterialDark' | 'systemThickMaterialDark' | 'systemChromeMaterialDark';
+export type GlassType = 'clear' | 'regular';
+export type ProgressiveBlurDirection = 'blurredTopClearBottom' | 'blurredBottomClearTop' | 'blurredCenterClearTopAndBottom';
+//# sourceMappingURL=types.d.ts.map

package/lib/typescript/src/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,MAAM,MAAM,QAAQ,GAChB,QAAQ,GACR,OAAO,GACP,MAAM,GACN,WAAW,GACX,SAAS,GACT,WAAW,GACX,yBAAyB,GACzB,oBAAoB,GACpB,gBAAgB,GAChB,qBAAqB,GACrB,sBAAsB,GACtB,8BAA8B,GAC9B,yBAAyB,GACzB,qBAAqB,GACrB,0BAA0B,GAC1B,2BAA2B,GAC3B,6BAA6B,GAC7B,wBAAwB,GACxB,oBAAoB,GACpB,yBAAyB,GACzB,0BAA0B,CAAC;AAE/B,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;AAE5C,MAAM,MAAM,wBAAwB,GAChC,uBAAuB,GACvB,uBAAuB,GACvB,gCAAgC,CAAC"}

package/package.json

@@ -1,14 +1,16 @@
 {
   "name": "@sbaiahmed1/react-native-blur",
-  "version": "4.5.2-alpha.0",
+  "version": "4.5.2-alpha.2",
   "description": "React native modern blur view",
   "main": "./lib/module/index.js",
   "types": "./lib/typescript/src/index.d.ts",
+  "react-native": "./lib/module/index.js",
   "exports": {
     ".": {
-      "source": "./src/index.tsx",
       "types": "./lib/typescript/src/index.d.ts",
-      "default": "./lib/module/index.js"
+      "react-native": "./lib/module/index.js",
+      "browser": "./lib/module/index.web.js",
+      "default": "./lib/module/index.web.js"
     },
     "./package.json": "./package.json"
   },

package/src/BlurView.web.tsx

@@ -2,7 +2,7 @@ import { forwardRef, useImperativeHandle, useRef } from 'react';
 import { View } from 'react-native';
 import type { ViewStyle } from 'react-native';
 import type { BlurViewProps } from './BlurView';
-import type { BlurType } from './ReactNativeBlurViewNativeComponent';
+import type { BlurType } from './types';
 
 /**
  * Maps blur types to background colors with opacity based on intensity

package/src/ReactNativeBlurViewNativeComponent.ts

@@ -4,29 +4,10 @@ import type {
   WithDefault,
   Double,
 } from 'react-native/Libraries/Types/CodegenTypes';
+import type { BlurType } from './types';
 
-export type BlurType =
-  | 'xlight'
-  | 'light'
-  | 'dark'
-  | 'extraDark'
-  | 'regular'
-  | 'prominent'
-  | 'systemUltraThinMaterial'
-  | 'systemThinMaterial'
-  | 'systemMaterial'
-  | 'systemThickMaterial'
-  | 'systemChromeMaterial'
-  | 'systemUltraThinMaterialLight'
-  | 'systemThinMaterialLight'
-  | 'systemMaterialLight'
-  | 'systemThickMaterialLight'
-  | 'systemChromeMaterialLight'
-  | 'systemUltraThinMaterialDark'
-  | 'systemThinMaterialDark'
-  | 'systemMaterialDark'
-  | 'systemThickMaterialDark'
-  | 'systemChromeMaterialDark';
+// Re-export for backward compatibility
+export type { BlurType };
 
 interface NativeProps extends ViewProps {
   blurAmount?: WithDefault<Double, 10.0>;

package/src/ReactNativeLiquidGlassViewNativeComponent.ts

@@ -4,8 +4,10 @@ import type {
   WithDefault,
   Double,
 } from 'react-native/Libraries/Types/CodegenTypes';
+import type { GlassType } from './types';
 
-export type GlassType = 'clear' | 'regular';
+// Re-export for backward compatibility
+export type { GlassType };
 
 interface NativeProps extends ViewProps {
   /**

package/src/ReactNativeProgressiveBlurViewNativeComponent.ts

@@ -4,34 +4,10 @@ import type {
   WithDefault,
   Double,
 } from 'react-native/Libraries/Types/CodegenTypes';
+import type { BlurType, ProgressiveBlurDirection } from './types';
 
-export type BlurType =
-  | 'xlight'
-  | 'light'
-  | 'dark'
-  | 'extraDark'
-  | 'regular'
-  | 'prominent'
-  | 'systemUltraThinMaterial'
-  | 'systemThinMaterial'
-  | 'systemMaterial'
-  | 'systemThickMaterial'
-  | 'systemChromeMaterial'
-  | 'systemUltraThinMaterialLight'
-  | 'systemThinMaterialLight'
-  | 'systemMaterialLight'
-  | 'systemThickMaterialLight'
-  | 'systemChromeMaterialLight'
-  | 'systemUltraThinMaterialDark'
-  | 'systemThinMaterialDark'
-  | 'systemMaterialDark'
-  | 'systemThickMaterialDark'
-  | 'systemChromeMaterialDark';
-
-export type ProgressiveBlurDirection =
-  | 'blurredTopClearBottom'
-  | 'blurredBottomClearTop'
-  | 'blurredCenterClearTopAndBottom';
+// Re-export for backward compatibility
+export type { BlurType, ProgressiveBlurDirection };
 
 interface NativeProps extends ViewProps {
   blurAmount?: WithDefault<Double, 20.0>;

package/src/index.web.tsx

@@ -0,0 +1,18 @@
+// Web-specific exports
+// Only exports components that have web implementations
+
+export { BlurView as default, BlurView } from './BlurView.web';
+export type { BlurViewProps } from './BlurView';
+
+// Re-export types (these don't import native code)
+export type { BlurType, GlassType, ProgressiveBlurDirection } from './types';
+
+// Note: The following components are not yet supported on web:
+// - VibrancyView (iOS-specific)
+// - ProgressiveBlurView (requires native gradient blur)
+// - LiquidGlassView (iOS 26+ specific)
+// - LiquidGlassContainer (iOS 26+ specific)
+// - BlurSwitch (Android-specific)
+//
+// Attempting to use these on web will result in import errors.
+// Consider using BlurView as a fallback for web platforms.

package/src/types.ts

@@ -0,0 +1,34 @@
+/**
+ * Shared types for @sbaiahmed1/react-native-blur
+ * These types are platform-agnostic and can be used on iOS, Android, and Web
+ */
+
+export type BlurType =
+  | 'xlight'
+  | 'light'
+  | 'dark'
+  | 'extraDark'
+  | 'regular'
+  | 'prominent'
+  | 'systemUltraThinMaterial'
+  | 'systemThinMaterial'
+  | 'systemMaterial'
+  | 'systemThickMaterial'
+  | 'systemChromeMaterial'
+  | 'systemUltraThinMaterialLight'
+  | 'systemThinMaterialLight'
+  | 'systemMaterialLight'
+  | 'systemThickMaterialLight'
+  | 'systemChromeMaterialLight'
+  | 'systemUltraThinMaterialDark'
+  | 'systemThinMaterialDark'
+  | 'systemMaterialDark'
+  | 'systemThickMaterialDark'
+  | 'systemChromeMaterialDark';
+
+export type GlassType = 'clear' | 'regular';
+
+export type ProgressiveBlurDirection =
+  | 'blurredTopClearBottom'
+  | 'blurredBottomClearTop'
+  | 'blurredCenterClearTopAndBottom';