@sbaiahmed1/react-native-blur 3.2.0 → 4.0.0

package/ios/Views/LiquidGlassContainerView.swift

@@ -0,0 +1,173 @@
+import UIKit
+
+// MARK: - UIKit-only Wrapper for Liquid Glass (following Expo's approach)
+
+@objc public class LiquidGlassContainerView: UIView {
+  private var glassEffectView: UIVisualEffectView?
+  private var glassEffect: Any?
+  private var currentGlassStyle: String = "clear" // Track current style
+
+  @objc public var glassTintColor: UIColor = .clear {
+    didSet {
+      updateEffect()
+    }
+  }
+
+  @objc public var glassOpacity: Double = 1.0 {
+    didSet {
+      updateEffect()
+    }
+  }
+
+  @objc public var glassType: String = "clear" {
+    didSet {
+      updateEffect()
+    }
+  }
+
+  @objc public var reducedTransparencyFallbackColor: UIColor = .white {
+    didSet {
+      updateFallback()
+    }
+  }
+
+  @objc public var isInteractive: Bool = true {
+    didSet {
+      updateEffect()
+    }
+  }
+
+  @objc public var ignoreSafeArea: Bool = false {
+    didSet {
+      // Not used in UIKit approach
+    }
+  }
+
+  // Border radius storage for React Native's style system
+  private var topLeftRadius: CGFloat = 0
+  private var topRightRadius: CGFloat = 0
+  private var bottomLeftRadius: CGFloat = 0
+  private var bottomRightRadius: CGFloat = 0
+  private var allBorderRadius: CGFloat = 0
+
+  public override init(frame: CGRect) {
+    super.init(frame: frame)
+    setupView()
+  }
+
+  required init?(coder: NSCoder) {
+    super.init(coder: coder)
+    setupView()
+  }
+
+  private func setupView() {
+    let effectView = UIVisualEffectView()
+    effectView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
+    effectView.frame = bounds
+    addSubview(effectView)
+    self.glassEffectView = effectView
+    
+    updateEffect()
+  }
+
+  // MARK: - Border Radius Methods (called by React Native's style system)
+  
+  @objc public func setBorderRadius(_ radius: CGFloat) {
+    allBorderRadius = radius
+    topLeftRadius = radius
+    topRightRadius = radius
+    bottomLeftRadius = radius
+    bottomRightRadius = radius
+    updateBorderRadius()
+  }
+  
+  @objc public func setBorderTopLeftRadius(_ radius: CGFloat) {
+    topLeftRadius = radius
+    updateBorderRadius()
+  }
+  
+  @objc public func setBorderTopRightRadius(_ radius: CGFloat) {
+    topRightRadius = radius
+    updateBorderRadius()
+  }
+  
+  @objc public func setBorderBottomLeftRadius(_ radius: CGFloat) {
+    bottomLeftRadius = radius
+    updateBorderRadius()
+  }
+  
+  @objc public func setBorderBottomRightRadius(_ radius: CGFloat) {
+    bottomRightRadius = radius
+    updateBorderRadius()
+  }
+
+  private func updateEffect() {
+    if #available(iOS 26.0, *) {
+      #if compiler(>=6.2)
+      let style: UIGlassEffect.Style = glassType == "regular" ? .regular : .clear
+      
+      // Always create a new effect to ensure proper rendering
+      let effect = UIGlassEffect(style: style)
+      effect.tintColor = glassTintColor.withAlphaComponent(glassOpacity)
+      effect.isInteractive = isInteractive
+      
+      glassEffectView?.effect = effect
+      glassEffect = effect
+      currentGlassStyle = glassType
+      
+      updateBorderRadius()
+      #endif
+    } else {
+      // Fallback for iOS < 26
+      updateFallback()
+    }
+  }
+
+  private func updateFallback() {
+    if #available(iOS 26.0, *) {
+      // Do nothing if iOS 26+
+    } else {
+      backgroundColor = reducedTransparencyFallbackColor
+      layer.cornerRadius = allBorderRadius
+      layer.masksToBounds = true
+    }
+  }
+
+  private func updateBorderRadius() {
+    if #available(iOS 26.0, *) {
+      #if compiler(>=6.2)
+      let topLeft = UICornerRadius(floatLiteral: Double(topLeftRadius))
+      let topRight = UICornerRadius(floatLiteral: Double(topRightRadius))
+      let bottomLeft = UICornerRadius(floatLiteral: Double(bottomLeftRadius))
+      let bottomRight = UICornerRadius(floatLiteral: Double(bottomRightRadius))
+      
+      glassEffectView?.cornerConfiguration = .corners(
+        topLeftRadius: topLeft,
+        topRightRadius: topRight,
+        bottomLeftRadius: bottomLeft,
+        bottomRightRadius: bottomRight
+      )
+      #else
+      layer.cornerRadius = allBorderRadius
+      layer.masksToBounds = true
+      #endif
+    } else {
+      layer.cornerRadius = allBorderRadius
+      layer.masksToBounds = true
+    }
+  }
+
+  public override func layoutSubviews() {
+    super.layoutSubviews()
+    glassEffectView?.frame = bounds
+  }
+  
+  // For child view mounting
+  @objc public func getContentView() -> UIView? {
+    if #available(iOS 26.0, *) {
+      return glassEffectView?.contentView
+    } else {
+      return self
+    }
+  }
+}

package/lib/module/BlurView.js

@@ -1,7 +1,7 @@
 "use strict";
 
 import React from 'react';
-import { View } from 'react-native';
+import { StyleSheet, View } from 'react-native';
 import ReactNativeBlurView from './ReactNativeBlurViewNativeComponent';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
@@ -32,63 +32,46 @@ export const BlurView = ({
   reducedTransparencyFallbackColor = '#FFFFFF',
   style,
   children,
-  type = 'blur',
-  glassType = 'clear',
-  glassTintColor = 'clear',
-  glassOpacity = 1.0,
-  isInteractive = true,
   ignoreSafeArea = false,
   ...props
 }) => {
   // If no children, render the blur view directly (for background use)
   if (React.Children.count(children) === 0) {
     return /*#__PURE__*/_jsx(ReactNativeBlurView, {
+      ignoreSafeArea: ignoreSafeArea,
       blurType: blurType,
       blurAmount: blurAmount,
-      glassType: glassType,
-      glassTintColor: glassTintColor,
-      glassOpacity: glassOpacity,
-      type: type,
       reducedTransparencyFallbackColor: reducedTransparencyFallbackColor,
       style: style,
-      isInteractive: isInteractive,
-      ignoreSafeArea: ignoreSafeArea,
       ...props
     });
   }
 
   // If children exist, use the absolute positioning pattern
   return /*#__PURE__*/_jsxs(View, {
-    style: [{
-      position: 'relative',
-      overflow: 'hidden'
-    }, style],
+    style: [styles.container, style],
     children: [/*#__PURE__*/_jsx(ReactNativeBlurView, {
+      ignoreSafeArea: ignoreSafeArea,
       blurType: blurType,
       blurAmount: blurAmount,
-      glassType: glassType,
-      glassTintColor: glassTintColor,
-      glassOpacity: glassOpacity,
-      type: type,
-      isInteractive: isInteractive,
-      ignoreSafeArea: ignoreSafeArea,
       reducedTransparencyFallbackColor: reducedTransparencyFallbackColor,
-      style: {
-        position: 'absolute',
-        top: 0,
-        left: 0,
-        right: 0,
-        bottom: 0
-      },
+      style: StyleSheet.absoluteFill,
       ...props
     }), /*#__PURE__*/_jsx(View, {
-      style: {
-        position: 'relative',
-        zIndex: 1
-      },
+      style: styles.children,
       children: children
     })]
   });
 };
 export default BlurView;
+const styles = StyleSheet.create({
+  container: {
+    position: 'relative',
+    overflow: 'hidden'
+  },
+  children: {
+    position: 'relative',
+    zIndex: 1
+  }
+});
 //# sourceMappingURL=BlurView.js.map

package/lib/module/BlurView.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","View","ReactNativeBlurView","jsx","_jsx","jsxs","_jsxs","BlurView","blurType","blurAmount","reducedTransparencyFallbackColor","style","children","type","glassType","glassTintColor","glassOpacity","isInteractive","ignoreSafeArea","props","Children","count","position","overflow","top","left","right","bottom","zIndex"],"sourceRoot":"../../src","sources":["BlurView.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,cAAc;AAEnC,OAAOC,mBAAmB,MAEnB,sCAAsC;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AA+E9C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,QAAiC,GAAGA,CAAC;EAChDC,QAAQ,GAAG,QAAQ;EACnBC,UAAU,GAAG,EAAE;EACfC,gCAAgC,GAAG,SAAS;EAC5CC,KAAK;EACLC,QAAQ;EACRC,IAAI,GAAG,MAAM;EACbC,SAAS,GAAG,OAAO;EACnBC,cAAc,GAAG,OAAO;EACxBC,YAAY,GAAG,GAAG;EAClBC,aAAa,GAAG,IAAI;EACpBC,cAAc,GAAG,KAAK;EACtB,GAAGC;AACL,CAAC,KAAK;EACJ;EACA,IAAInB,KAAK,CAACoB,QAAQ,CAACC,KAAK,CAACT,QAAQ,CAAC,KAAK,CAAC,EAAE;IACxC,oBACER,IAAA,CAACF,mBAAmB;MAClBM,QAAQ,EAAEA,QAAS;MACnBC,UAAU,EAAEA,UAAW;MACvBK,SAAS,EAAEA,SAAU;MACrBC,cAAc,EAAEA,cAAe;MAC/BC,YAAY,EAAEA,YAAa;MAC3BH,IAAI,EAAEA,IAAK;MACXH,gCAAgC,EAAEA,gCAAiC;MACnEC,KAAK,EAAEA,KAAM;MACbM,aAAa,EAAEA,aAAc;MAC7BC,cAAc,EAAEA,cAAe;MAAA,GAC3BC;IAAK,CACV,CAAC;EAEN;;EAEA;EACA,oBACEb,KAAA,CAACL,IAAI;IAACU,KAAK,EAAE,CAAC;MAAEW,QAAQ,EAAE,UAAU;MAAEC,QAAQ,EAAE;IAAS,CAAC,EAAEZ,KAAK,CAAE;IAAAC,QAAA,gBAEjER,IAAA,CAACF,mBAAmB;MAClBM,QAAQ,EAAEA,QAAS;MACnBC,UAAU,EAAEA,UAAW;MACvBK,SAAS,EAAEA,SAAU;MACrBC,cAAc,EAAEA,cAAe;MAC/BC,YAAY,EAAEA,YAAa;MAC3BH,IAAI,EAAEA,IAAK;MACXI,aAAa,EAAEA,aAAc;MAC7BC,cAAc,EAAEA,cAAe;MAC/BR,gCAAgC,EAAEA,gCAAiC;MACnEC,KAAK,EAAE;QACLW,QAAQ,EAAE,UAAU;QACpBE,GAAG,EAAE,CAAC;QACNC,IAAI,EAAE,CAAC;QACPC,KAAK,EAAE,CAAC;QACRC,MAAM,EAAE;MACV,CAAE;MAAA,GACER;IAAK,CACV,CAAC,eAEFf,IAAA,CAACH,IAAI;MAACU,KAAK,EAAE;QAAEW,QAAQ,EAAE,UAAU;QAAEM,MAAM,EAAE;MAAE,CAAE;MAAAhB,QAAA,EAAEA;IAAQ,CAAO,CAAC;EAAA,CAC/D,CAAC;AAEX,CAAC;AAED,eAAeL,QAAQ","ignoreList":[]}
+{"version":3,"names":["React","StyleSheet","View","ReactNativeBlurView","jsx","_jsx","jsxs","_jsxs","BlurView","blurType","blurAmount","reducedTransparencyFallbackColor","style","children","ignoreSafeArea","props","Children","count","styles","container","absoluteFill","create","position","overflow","zIndex"],"sourceRoot":"../../src","sources":["BlurView.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAE/C,OAAOC,mBAAmB,MAEnB,sCAAsC;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAgD9C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,QAAiC,GAAGA,CAAC;EAChDC,QAAQ,GAAG,QAAQ;EACnBC,UAAU,GAAG,EAAE;EACfC,gCAAgC,GAAG,SAAS;EAC5CC,KAAK;EACLC,QAAQ;EACRC,cAAc,GAAG,KAAK;EACtB,GAAGC;AACL,CAAC,KAAK;EACJ;EACA,IAAIf,KAAK,CAACgB,QAAQ,CAACC,KAAK,CAACJ,QAAQ,CAAC,KAAK,CAAC,EAAE;IACxC,oBACER,IAAA,CAACF,mBAAmB;MAClBW,cAAc,EAAEA,cAAe;MAC/BL,QAAQ,EAAEA,QAAS;MACnBC,UAAU,EAAEA,UAAW;MACvBC,gCAAgC,EAAEA,gCAAiC;MACnEC,KAAK,EAAEA,KAAM;MAAA,GACTG;IAAK,CACV,CAAC;EAEN;;EAEA;EACA,oBACER,KAAA,CAACL,IAAI;IAACU,KAAK,EAAE,CAACM,MAAM,CAACC,SAAS,EAAEP,KAAK,CAAE;IAAAC,QAAA,gBAErCR,IAAA,CAACF,mBAAmB;MAClBW,cAAc,EAAEA,cAAe;MAC/BL,QAAQ,EAAEA,QAAS;MACnBC,UAAU,EAAEA,UAAW;MACvBC,gCAAgC,EAAEA,gCAAiC;MACnEC,KAAK,EAAEX,UAAU,CAACmB,YAAa;MAAA,GAC3BL;IAAK,CACV,CAAC,eAEFV,IAAA,CAACH,IAAI;MAACU,KAAK,EAAEM,MAAM,CAACL,QAAS;MAAAA,QAAA,EAAEA;IAAQ,CAAO,CAAC;EAAA,CAC3C,CAAC;AAEX,CAAC;AAED,eAAeL,QAAQ;AAEvB,MAAMU,MAAM,GAAGjB,UAAU,CAACoB,MAAM,CAAC;EAC/BF,SAAS,EAAE;IACTG,QAAQ,EAAE,UAAU;IACpBC,QAAQ,EAAE;EACZ,CAAC;EACDV,QAAQ,EAAE;IACRS,QAAQ,EAAE,UAAU;IACpBE,MAAM,EAAE;EACV;AACF,CAAC,CAAC","ignoreList":[]}

package/lib/module/LiquidGlassView.js

@@ -0,0 +1,75 @@
+"use strict";
+
+import React from 'react';
+import { Platform } from 'react-native';
+import ReactNativeLiquidGlassView from './ReactNativeLiquidGlassViewNativeComponent';
+import BlurView from "./BlurView.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * A Liquid Glass view component that provides iOS 26+ glass effects.
+ *
+ * This component uses the new UIKit glass effect API available on iOS 26+.
+ * On older iOS versions or when reduced transparency is enabled, it falls back
+ * to a solid color background.
+ *
+ * **Platform Support:**
+ * - iOS 26+: Native glass effect with full functionality
+ * - iOS < 26 or Android: Fallback to reducedTransparencyFallbackColor
+ *
+ * This component automatically handles the proper positioning pattern where the glass
+ * effect is positioned absolutely behind the content, ensuring interactive elements
+ * work correctly.
+ *
+ * @example
+ * ```tsx
+ * import { LiquidGlassView } from '@sbaiahmed1/react-native-blur';
+ *
+ * <LiquidGlassView
+ *   glassType="clear"
+ *   glassTintColor="#007AFF"
+ *   glassOpacity={0.8}
+ *   style={{ flex: 1 }}
+ * >
+ *   <Text>Content on top of liquid glass</Text>
+ *   <Button title="Interactive Button" onPress={() => {}} />
+ * </LiquidGlassView>
+ * ```
+ *
+ * @platform ios
+ */
+export const LiquidGlassView = ({
+  glassType = 'clear',
+  glassTintColor = 'clear',
+  glassOpacity = 1.0,
+  reducedTransparencyFallbackColor = '#FFFFFF',
+  isInteractive = true,
+  ignoreSafeArea = false,
+  style,
+  children,
+  ...props
+}) => {
+  // Only render on iOS 26+ (fallback otherwise)
+  if (Platform.OS !== 'ios' || Platform.OS === 'ios' && parseInt(Platform.Version, 10) < 26) {
+    console.warn('LiquidGlassView is only supported on iOS. Rendering children without glass effect.');
+    return /*#__PURE__*/_jsx(BlurView, {
+      blurAmount: 70,
+      style: style,
+      children: children
+    });
+  }
+
+  // If children exist, use the absolute positioning pattern
+  return /*#__PURE__*/_jsx(ReactNativeLiquidGlassView, {
+    glassType: glassType,
+    glassTintColor: glassTintColor,
+    glassOpacity: glassOpacity,
+    reducedTransparencyFallbackColor: reducedTransparencyFallbackColor,
+    isInteractive: isInteractive,
+    ignoreSafeArea: ignoreSafeArea,
+    style: style,
+    ...props,
+    children: children
+  });
+};
+export default LiquidGlassView;
+//# sourceMappingURL=LiquidGlassView.js.map

package/lib/module/LiquidGlassView.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Platform","ReactNativeLiquidGlassView","BlurView","jsx","_jsx","LiquidGlassView","glassType","glassTintColor","glassOpacity","reducedTransparencyFallbackColor","isInteractive","ignoreSafeArea","style","children","props","OS","parseInt","Version","console","warn","blurAmount"],"sourceRoot":"../../src","sources":["LiquidGlassView.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,QAAQ,cAAc;AAEvC,OAAOC,0BAA0B,MAE1B,6CAA6C;AACpD,OAAOC,QAAQ,MAAM,eAAY;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAwDlC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,eAA+C,GAAGA,CAAC;EAC9DC,SAAS,GAAG,OAAO;EACnBC,cAAc,GAAG,OAAO;EACxBC,YAAY,GAAG,GAAG;EAClBC,gCAAgC,GAAG,SAAS;EAC5CC,aAAa,GAAG,IAAI;EACpBC,cAAc,GAAG,KAAK;EACtBC,KAAK;EACLC,QAAQ;EACR,GAAGC;AACL,CAAC,KAAK;EACJ;EACA,IACEd,QAAQ,CAACe,EAAE,KAAK,KAAK,IACpBf,QAAQ,CAACe,EAAE,KAAK,KAAK,IAAIC,QAAQ,CAAChB,QAAQ,CAACiB,OAAO,EAAE,EAAE,CAAC,GAAG,EAAG,EAC9D;IACAC,OAAO,CAACC,IAAI,CACV,oFACF,CAAC;IACD,oBACEf,IAAA,CAACF,QAAQ;MAACkB,UAAU,EAAE,EAAG;MAACR,KAAK,EAAEA,KAAM;MAAAC,QAAA,EACpCA;IAAQ,CACD,CAAC;EAEf;;EAEA;EACA,oBACET,IAAA,CAACH,0BAA0B;IACzBK,SAAS,EAAEA,SAAU;IACrBC,cAAc,EAAEA,cAAe;IAC/BC,YAAY,EAAEA,YAAa;IAC3BC,gCAAgC,EAAEA,gCAAiC;IACnEC,aAAa,EAAEA,aAAc;IAC7BC,cAAc,EAAEA,cAAe;IAC/BC,KAAK,EAAEA,KAAM;IAAA,GACTE,KAAK;IAAAD,QAAA,EAERA;EAAQ,CACiB,CAAC;AAEjC,CAAC;AAED,eAAeR,eAAe","ignoreList":[]}

package/lib/module/ReactNativeBlurViewNativeComponent.ts

@@ -18,17 +18,10 @@ export type BlurType =
   | 'systemThickMaterial'
   | 'systemChromeMaterial';
 
-export type GlassType = 'clear' | 'regular';
-
 interface NativeProps extends ViewProps {
-  glassTintColor?: WithDefault<string, 'clear'>;
-  glassOpacity?: WithDefault<Double, 1.0>;
   blurAmount?: WithDefault<Double, 10.0>;
-  type?: WithDefault<'blur' | 'liquidGlass', 'blur'>;
   blurType?: WithDefault<BlurType, 'xlight'>;
-  glassType?: WithDefault<GlassType, 'clear'>;
   reducedTransparencyFallbackColor?: WithDefault<string, '#FFFFFF'>;
-  isInteractive?: WithDefault<boolean, true>;
   ignoreSafeArea?: WithDefault<boolean, false>;
 }
 

package/lib/module/ReactNativeLiquidGlassViewNativeComponent.ts

@@ -0,0 +1,57 @@
+import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
+import type { ViewProps } from 'react-native';
+import type {
+  WithDefault,
+  Double,
+} from 'react-native/Libraries/Types/CodegenTypes';
+
+export type GlassType = 'clear' | 'regular';
+
+interface NativeProps extends ViewProps {
+  /**
+   * The type of glass effect to apply
+   * Platform: iOS only
+   * @default 'clear'
+   */
+  glassType?: WithDefault<GlassType, 'clear'>;
+
+  /**
+   * The tint color of the glass effect
+   * Platform: iOS only
+   * @default 'clear'
+   */
+  glassTintColor?: WithDefault<string, 'clear'>;
+
+  /**
+   * The opacity of the glass effect (0-1)
+   * Platform: iOS only
+   * @default 1.0
+   */
+  glassOpacity?: WithDefault<Double, 1.0>;
+
+  /**
+   * Fallback color when reduced transparency is enabled
+   * Platform: iOS only
+   * @default '#FFFFFF'
+   */
+  reducedTransparencyFallbackColor?: WithDefault<string, '#FFFFFF'>;
+
+  /**
+   * Whether the glass view should be interactive
+   * Platform: iOS only
+   * @default true
+   */
+  isInteractive?: WithDefault<boolean, true>;
+
+  /**
+   * Whether the glass view should ignore safe area insets
+   * Platform: iOS only
+   * @default false
+   */
+  ignoreSafeArea?: WithDefault<boolean, false>;
+}
+
+export default codegenNativeComponent<NativeProps>(
+  'ReactNativeLiquidGlassView',
+  { excludedPlatforms: ['android'] }
+);

package/lib/module/index.js

@@ -3,4 +3,6 @@
 export { default as ReactNativeBlurView } from './ReactNativeBlurViewNativeComponent';
 export * from './ReactNativeBlurViewNativeComponent';
 export { BlurView as default, BlurView } from "./BlurView.js";
+export { default as ReactNativeLiquidGlassView } from './ReactNativeLiquidGlassViewNativeComponent';
+export { LiquidGlassView } from "./LiquidGlassView.js";
 //# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["default","ReactNativeBlurView","BlurView"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AAAA,SAASA,OAAO,IAAIC,mBAAmB,QAAQ,sCAAsC;AACrF,cAAc,sCAAsC;AAEpD,SAASC,QAAQ,IAAIF,OAAO,EAAEE,QAAQ,QAAQ,eAAY","ignoreList":[]}
+{"version":3,"names":["default","ReactNativeBlurView","BlurView","ReactNativeLiquidGlassView","LiquidGlassView"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AAAA,SAASA,OAAO,IAAIC,mBAAmB,QAAQ,sCAAsC;AACrF,cAAc,sCAAsC;AAEpD,SAASC,QAAQ,IAAIF,OAAO,EAAEE,QAAQ,QAAQ,eAAY;AAG1D,SAASF,OAAO,IAAIG,0BAA0B,QAAQ,6CAA6C;AAGnG,SAASC,eAAe,QAAQ,sBAAmB","ignoreList":[]}

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

@@ -1,71 +1,45 @@
 import React from 'react';
 import type { ViewStyle, StyleProp } from 'react-native';
 import { type BlurType } from './ReactNativeBlurViewNativeComponent';
-import type { GlassType } from '../src/ReactNativeBlurViewNativeComponent';
 export interface BlurViewProps {
     /**
-     * The type of blur effect to apply
+     * @description The type of blur effect to apply
+     *
      * @default 'xlight'
      */
     blurType?: BlurType;
     /**
-     * The intensity of the blur effect (0-100)
+     * @description The intensity of the blur effect (0-100)
+     *
      * @default 10
      */
     blurAmount?: number;
     /**
-     * Fallback color when reduced transparency is enabled
-     * Accepts hex color strings like '#FFFFFF'
+     * @description Fallback color when reduced transparency is enabled
+     *
+     * Accepts hex color strings like `#FFFFFF`
+     *
      * @default '#FFFFFF'
      */
     reducedTransparencyFallbackColor?: string;
     /**
-     * Style object for the blur view
+     * @description style object for the blur view
+     *
+     * @default undefined
      */
     style?: StyleProp<ViewStyle>;
     /**
-     * Child components to render inside the blur view
-     */
-    children?: React.ReactNode;
-    /**
-     * Platform: iOS only
-     * The type of glass effect to apply
-     * @default 'clear'
-     */
-    glassType?: GlassType;
-    /**
-     * Platform: iOS only
-     * The tint color of the glass effect
-     * accepts hex color strings like '#FFFFFF'
-     * accepts color names like 'white', 'clear', 'black', 'red', 'green', 'blue', 'yellow', 'cyan', 'magenta'
-     * @default 'clear'
-     */
-    glassTintColor?: string;
-    /**
-     * Platform: iOS only
-     * The opacity of the glass effect (0-1)
-     * @default 1.0
-     */
-    glassOpacity?: number;
-    /**
-     * The type of blur effect to apply
-     * liquidGlass = iOS Only
-     * blur = Android | iOS
-     * @default 'blur'
-     */
-    type?: 'blur' | 'liquidGlass';
-    /**
-     * Platform: iOS only
-     * Whether the blur view should be interactive
-     * @default true
-     */
-    isInteractive?: boolean;
-    /**
-     * Platform: iOS only
-     * Whether the blur view should be ignore safe area insets
+     * @description style object for the blur view
+     *
      * @default false
      */
     ignoreSafeArea?: boolean;
+    /**
+     * @description Child components to render inside the blur view
+     *
+     * @default undefined
+     */
+    children?: React.ReactNode;
 }
 /**
  * A cross-platform blur view component that provides native blur effects.

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

@@ -1 +1 @@
-{"version":3,"file":"BlurView.d.ts","sourceRoot":"","sources":["../../../src/BlurView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzD,OAA4B,EAC1B,KAAK,QAAQ,EACd,MAAM,sCAAsC,CAAC;AAC9C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,2CAA2C,CAAC;AAE3E,MAAM,WAAW,aAAa;IAC5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;IAEpB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;;OAIG;IACH,gCAAgC,CAAC,EAAE,MAAM,CAAC;IAE1C;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAE7B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE3B;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,aAAa,CAAC;IAE9B;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA4D5C,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"BlurView.d.ts","sourceRoot":"","sources":["../../../src/BlurView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzD,OAA4B,EAC1B,KAAK,QAAQ,EACd,MAAM,sCAAsC,CAAC;AAE9C,MAAM,WAAW,aAAa;IAC5B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;IAEpB;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;;;;OAMG;IACH,gCAAgC,CAAC,EAAE,MAAM,CAAC;IAE1C;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAE7B;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAuC5C,CAAC;AAEF,eAAe,QAAQ,CAAC"}

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

@@ -0,0 +1,85 @@
+import React from 'react';
+import type { ViewStyle, StyleProp } from 'react-native';
+import { type GlassType } from './ReactNativeLiquidGlassViewNativeComponent';
+export interface LiquidGlassViewProps {
+    /**
+     * The type of glass effect to apply
+     * Platform: iOS 26+ only
+     * @default 'clear'
+     */
+    glassType?: GlassType /**
+     * The tint color of the glass effect
+     * Accepts hex color strings like '#FFFFFF' or color names
+     * Platform: iOS 26+ only
+     * @default 'clear'
+     */;
+    glassTintColor?: string;
+    /**
+     * The opacity of the glass effect (0-1)
+     * Platform: iOS 26+ only
+     * @default 1.0
+     */
+    glassOpacity?: number;
+    /**
+     * Fallback color when reduced transparency is enabled or on older iOS versions
+     * Accepts hex color strings like '#FFFFFF'
+     * Platform: iOS only
+     * @default '#FFFFFF'
+     */
+    reducedTransparencyFallbackColor?: string;
+    /**
+     * Whether the glass view should be interactive
+     * Platform: iOS 26+ only
+     * @default true
+     */
+    isInteractive?: boolean;
+    /**
+     * Whether the glass view should ignore safe area insets
+     * Platform: iOS 26+ only
+     * @default false
+     */
+    ignoreSafeArea?: boolean;
+    /**
+     * Style object for the liquid glass view
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Child components to render inside the liquid glass view
+     */
+    children?: React.ReactNode;
+}
+/**
+ * A Liquid Glass view component that provides iOS 26+ glass effects.
+ *
+ * This component uses the new UIKit glass effect API available on iOS 26+.
+ * On older iOS versions or when reduced transparency is enabled, it falls back
+ * to a solid color background.
+ *
+ * **Platform Support:**
+ * - iOS 26+: Native glass effect with full functionality
+ * - iOS < 26 or Android: Fallback to reducedTransparencyFallbackColor
+ *
+ * This component automatically handles the proper positioning pattern where the glass
+ * effect is positioned absolutely behind the content, ensuring interactive elements
+ * work correctly.
+ *
+ * @example
+ * ```tsx
+ * import { LiquidGlassView } from '@sbaiahmed1/react-native-blur';
+ *
+ * <LiquidGlassView
+ *   glassType="clear"
+ *   glassTintColor="#007AFF"
+ *   glassOpacity={0.8}
+ *   style={{ flex: 1 }}
+ * >
+ *   <Text>Content on top of liquid glass</Text>
+ *   <Button title="Interactive Button" onPress={() => {}} />
+ * </LiquidGlassView>
+ * ```
+ *
+ * @platform ios
+ */
+export declare const LiquidGlassView: React.FC<LiquidGlassViewProps>;
+export default LiquidGlassView;
+//# sourceMappingURL=LiquidGlassView.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"LiquidGlassView.d.ts","sourceRoot":"","sources":["../../../src/LiquidGlassView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzD,OAAmC,EACjC,KAAK,SAAS,EACf,MAAM,6CAA6C,CAAC;AAGrD,MAAM,WAAW,oBAAoB;IACnC;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;;;;;OAKnB,CAAC;IACJ,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;;;OAKG;IACH,gCAAgC,CAAC,EAAE,MAAM,CAAC;IAE1C;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAE7B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAyC1D,CAAC;AAEF,eAAe,eAAe,CAAC"}

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

@@ -1,16 +1,10 @@
 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';
-export type GlassType = 'clear' | 'regular';
 interface NativeProps extends ViewProps {
-    glassTintColor?: WithDefault<string, 'clear'>;
-    glassOpacity?: WithDefault<Double, 1.0>;
     blurAmount?: WithDefault<Double, 10.0>;
-    type?: WithDefault<'blur' | 'liquidGlass', 'blur'>;
     blurType?: WithDefault<BlurType, 'xlight'>;
-    glassType?: WithDefault<GlassType, 'clear'>;
     reducedTransparencyFallbackColor?: WithDefault<string, '#FFFFFF'>;
-    isInteractive?: WithDefault<boolean, true>;
     ignoreSafeArea?: WithDefault<boolean, false>;
 }
 declare const _default: import("react-native/Libraries/Utilities/codegenNativeComponent").NativeComponentType<NativeProps>;

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,CAAC;AAE3B,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;AAE5C,UAAU,WAAY,SAAQ,SAAS;IACrC,cAAc,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9C,YAAY,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IACxC,UAAU,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IACvC,IAAI,CAAC,EAAE,WAAW,CAAC,MAAM,GAAG,aAAa,EAAE,MAAM,CAAC,CAAC;IACnD,QAAQ,CAAC,EAAE,WAAW,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;IAC3C,SAAS,CAAC,EAAE,WAAW,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;IAC5C,gCAAgC,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IAClE,aAAa,CAAC,EAAE,WAAW,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;IAC3C,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;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,CAAC;AAE3B,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"}