From 3eb80e4b592ebcf5e29251df41cd2a294c5c8f4c Mon Sep 17 00:00:00 2001
From: johelder <johelder.arj@gmail.com>
Date: Mon, 11 Aug 2025 20:22:30 -0300
Subject: [PATCH] fix: use React ref to create Animated.Value instead of
 useAnimatedValue to support react-native-web

---
 src/components/caret.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/caret.tsx b/src/components/caret.tsx
index a41354f..6a56278 100644
--- a/src/components/caret.tsx
+++ b/src/components/caret.tsx
@@ -1,10 +1,10 @@
-import { useEffect } from 'react';
-import { StyleSheet, Animated, useAnimatedValue } from 'react-native';
+import { useEffect, useRef } from 'react';
+import { StyleSheet, Animated } from 'react-native';
 import { DEFAULT_DARK_COLOR } from '../constants';
 import { useTextInputOTP } from '../hooks/use-text-input-otp';
 
 export function Caret() {
-  const opacity = useAnimatedValue(0);
+  const opacity = useRef(new Animated.Value(0)).current;
   const { caretColor } = useTextInputOTP();
 
   useEffect(() => {