Fixed overlay when animation is set to false

Author: ontech7

CHANGELOG.md

@@ -1,11 +1,15 @@
+## v1.1.1
+
+- Fix overlay when `animation` is set to false
+
 ## v1.1.0
 
-- Added `onPressOut` event on `Dialog` component
-- Added `animation` prop on `Dialog` component
-- Removed blur library (the user can import whatever blur library), no Expo necessary
-- Changed portal library
-- Removed `react-native-reanimated` and used `react-native` library for animations
-- Moved from `dist` to `build`
+- Add `onPressOut` event on `Dialog` component
+- Add `animation` prop on `Dialog` component
+- Remove blur library (the user can import whatever blur library), no Expo necessary
+- Change portal library
+- Remove `react-native-reanimated` and used `react-native` library for animations
+- Move from `dist` to `build`
 
 ## v1.0.0
 

build/Dialog.js

@@ -8,6 +8,7 @@ export function Dialog({ open, onPressOut, tint = "dark", animation = true, dura
     const progress = useRef(new Animated.Value(open ? 1 : 0)).current;
     useEffect(() => {
         if (!animation) {
+            progress.setValue(open ? 1 : 0);
             setMounted(open);
             return;
         }

example/app/index.tsx

@@ -42,6 +42,12 @@ export default function IndexPage() {
             slideFrom="none"
             BlurComponent={BlurView}
           />
+          <DefaultDialog
+            buttonLabel="OPEN NO ANIM DIALOG"
+            buttonColor="brown"
+            slideFrom="none"
+            animation={false}
+          />
           <InputDialog
             buttonLabel="OPEN INPUT DIALOG"
             buttonColor="midnightblue"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ontech7/react-native-dialog",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "description": "Dialog component for React Native, structure similar to shadcn/ui. Compatible with Android & iOS.",
   "main": "build/index.js",
   "types": "build/index.d.ts",

src/Dialog.tsx

@@ -39,6 +39,7 @@ export function Dialog({
 
   useEffect(() => {
     if (!animation) {
+      progress.setValue(open ? 1 : 0);
       setMounted(open);
       return;
     }