From 1bb58aa0d1dd2176cbf8c20feab23bd9919b1f51 Mon Sep 17 00:00:00 2001
From: Parvesh Monu <parvesh.dhullmonu@gmail.com>
Date: Mon, 16 Jan 2023 03:01:34 +0530
Subject: [PATCH] Allow transparent blur-type for ios

Patch from https://github.com/Kureev/react-native-blur/pull/513
---
 README.md                                 | 1 +
 example/src/App.tsx                       | 2 +-
 ios/BlurView.mm                           | 7 +++++++
 src/components/BlurView.ios.tsx           | 1 +
 src/fabric/BlurViewNativeComponent.ts     | 1 +
 src/fabric/VibrancyViewNativeComponent.ts | 1 +
 6 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 610001b..803fb38 100644
--- a/README.md
+++ b/README.md
@@ -52,6 +52,7 @@ cd ios && pod install
 | `extraDark` | extra dark blur type (tvOS only)
 | `regular` | regular blur type (iOS 10+ and tvOS only)
 | `prominent` |  prominent blur type (iOS 10+ and tvOS only)
+| `transparent` |  transparent blur type (iOS 10+ and tvOS only)
 
 #### blurType (iOS 13 only)
 
diff --git a/example/src/App.tsx b/example/src/App.tsx
index 94f592a..ad1078e 100644
--- a/example/src/App.tsx
+++ b/example/src/App.tsx
@@ -23,7 +23,7 @@ import {
 
 const blurTypeValues =
   Platform.OS === 'ios'
-    ? ['xlight', 'light', 'dark', 'regular', 'prominent']
+    ? ['xlight', 'light', 'dark', 'regular', 'prominent', 'transparent']
     : ['xlight', 'light', 'dark'];
 
 const Blurs = () => {
diff --git a/ios/BlurView.mm b/ios/BlurView.mm
index 2da97c3..2255cba 100644
--- a/ios/BlurView.mm
+++ b/ios/BlurView.mm
@@ -131,6 +131,7 @@ using namespace facebook::react;
 
 - (UIBlurEffectStyle)blurEffectStyle
 {
+  if ([self.blurType isEqual: @"transparent"]) return UIBlurEffectStyleDark;
   if ([self.blurType isEqual: @"xlight"]) return UIBlurEffectStyleExtraLight;
   if ([self.blurType isEqual: @"light"]) return UIBlurEffectStyleLight;
   if ([self.blurType isEqual: @"dark"]) return UIBlurEffectStyleDark;
@@ -183,6 +184,12 @@ using namespace facebook::react;
   UIBlurEffectStyle style = [self blurEffectStyle];
   self.blurEffect = [BlurEffectWithAmount effectWithStyle:style andBlurAmount:self.blurAmount];
   self.blurEffectView.effect = self.blurEffect;
+
+  if ([self.blurType isEqual: @"transparent"]) {
+    for (UIView *subview in self.blurEffectView.subviews) {
+      subview.backgroundColor = [UIColor clearColor];
+    }
+  }
 }
 
 - (void)updateFallbackView
diff --git a/src/components/BlurView.ios.tsx b/src/components/BlurView.ios.tsx
index 62d05ec..d413001 100644
--- a/src/components/BlurView.ios.tsx
+++ b/src/components/BlurView.ios.tsx
@@ -6,6 +6,7 @@ type BlurType =
   | 'dark'
   | 'light'
   | 'xlight'
+  | 'transparent'
   | 'prominent'
   | 'regular'
   | 'extraDark'
diff --git a/src/fabric/BlurViewNativeComponent.ts b/src/fabric/BlurViewNativeComponent.ts
index f7a8749..daa3f83 100644
--- a/src/fabric/BlurViewNativeComponent.ts
+++ b/src/fabric/BlurViewNativeComponent.ts
@@ -10,6 +10,7 @@ interface NativeProps extends ViewProps {
     | 'dark'
     | 'light'
     | 'xlight'
+    | 'transparent'
     | 'prominent'
     | 'regular'
     | 'extraDark'
diff --git a/src/fabric/VibrancyViewNativeComponent.ts b/src/fabric/VibrancyViewNativeComponent.ts
index fff6f20..03282f7 100644
--- a/src/fabric/VibrancyViewNativeComponent.ts
+++ b/src/fabric/VibrancyViewNativeComponent.ts
@@ -10,6 +10,7 @@ interface NativeProps extends ViewProps {
     | 'dark'
     | 'light'
     | 'xlight'
+    | 'transparent'
     | 'prominent'
     | 'regular'
     | 'extraDark'