1- import { ReactNode , useEffect , useState , useCallback } from "react" ;
1+ import { ReactNode , useEffect , useState , useCallback , useRef } from "react" ;
22import { Input , Section , sectionNames } from "lowcoder-design" ;
33import { BoolControl } from "comps/controls/boolControl" ;
44import { styleControl } from "comps/controls/styleControl" ;
@@ -148,12 +148,19 @@ let AutoCompleteCompBase = (function () {
148148const [ activationFlag , setActivationFlag ] = useState ( false ) ;
149149const [ searchtext , setsearchtext ] = useState < string > ( props . value . value ) ;
150150const [ validateState , setvalidateState ] = useState ( { } ) ;
151+
152+ // Use simple refs like text input components
153+ const changeRef = useRef ( false ) ;
154+ const touchRef = useRef ( false ) ;
151155
152156// 是否中文环境
153157const [ chineseEnv , setChineseEnv ] = useState ( getDayJSLocale ( ) === "zh-cn" ) ;
154158
155159useEffect ( ( ) => {
156- setsearchtext ( props . value . value ) ;
160+ // Only update local state from props if user hasn't touched the input
161+ if ( ! touchRef . current ) {
162+ setsearchtext ( props . value . value ) ;
163+ }
157164activationFlag &&
158165setvalidateState ( textInputValidate ( getTextInputValidate ( ) ) ) ;
159166} , [
@@ -247,19 +254,27 @@ let AutoCompleteCompBase = (function () {
247254props . valueInItems . onChange ( false ) ;
248255setvalidateState ( textInputValidate ( getTextInputValidate ( ) ) ) ;
249256setsearchtext ( value ) ;
257+ changeRef . current = true ;
258+ touchRef . current = true ;
259+
260+ // Update parent value immediately to prevent sync issues
250261props . value . onChange ( value ) ;
251262props . onEvent ( "change" ) ;
263+
252264if ( ! Boolean ( value ) ) {
253265props . selectedOption . onChange ( { } ) ;
254266}
255267} , [ props . valueInItems , getTextInputValidate , props . value , props . onEvent , props . selectedOption ] ) ;
256268
257269const handleSelect = useCallback ( ( data :string , option :any ) => {
258- setsearchtext ( option [ valueOrLabel ] ) ;
270+ const selectedValue = option [ valueOrLabel ] ;
271+ setsearchtext ( selectedValue ) ;
259272props . valueInItems . onChange ( true ) ;
260- props . value . onChange ( option [ valueOrLabel ] ) ;
273+ props . value . onChange ( selectedValue ) ;
261274props . selectedOption . onChange ( option ) ;
262275props . onEvent ( "submit" ) ;
276+ changeRef . current = true ;
277+ touchRef . current = true ;
263278} , [ valueOrLabel , props . valueInItems , props . value , props . onEvent , props . selectedOption ] ) ;
264279
265280const handleFocus = useCallback ( ( ) => {
@@ -268,6 +283,7 @@ let AutoCompleteCompBase = (function () {
268283} , [ props . onEvent ] ) ;
269284
270285const handleBlur = useCallback ( ( ) => {
286+ touchRef . current = false ;
271287props . onEvent ( "blur" ) ;
272288} , [ props . onEvent ] ) ;
273289