@@ -13,6 +13,7 @@ import { makeFocusProps, useFocus } from '@/composables/focus'
13
13
import { useIntersectionObserver } from '@/composables/intersectionObserver'
14
14
import { useLocale } from '@/composables/locale'
15
15
import { useProxiedModel } from '@/composables/proxiedModel'
16
+ import { useToggleScope } from '@/composables/toggleScope'
16
17
17
18
// Utilities
18
19
import { computed , effectScope , nextTick , ref , toRef , watch , watchEffect } from 'vue'
@@ -98,16 +99,18 @@ export const VOtpInput = genericComponent<VOtpInputSlots>()({
98
99
const inputRef = ref < HTMLInputElement [ ] > ( [ ] )
99
100
const current = computed ( ( ) => inputRef . value [ focusIndex . value ] )
100
101
101
- const intersectScope = effectScope ( )
102
- intersectScope . run ( ( ) => {
103
- const { intersectionRef, isIntersecting } = useIntersectionObserver ( )
104
- watch ( isIntersecting , v => {
105
- if ( ! v ) return
106
- intersectionRef . value ?. focus ( )
107
- intersectScope . stop ( )
108
- } )
109
- watchEffect ( ( ) => {
110
- intersectionRef . value = inputRef . value [ 0 ]
102
+ useToggleScope ( ( ) => props . autofocus , ( ) => {
103
+ const intersectScope = effectScope ( )
104
+ intersectScope . run ( ( ) => {
105
+ const { intersectionRef, isIntersecting } = useIntersectionObserver ( )
106
+ watchEffect ( ( ) => {
107
+ intersectionRef . value = inputRef . value [ 0 ]
108
+ } )
109
+ watch ( isIntersecting , v => {
110
+ if ( ! v ) return
111
+ intersectionRef . value ?. focus ( )
112
+ intersectScope . stop ( )
113
+ } )
111
114
} )
112
115
} )
113
116
0 commit comments