Estoy usando el diseño de hormigas y tengo 2 campos de entrada Enter Example y Select Value ahora cuando selecciono texto de Ingresar ejemplo, el texto seleccionado debe aparecer dentro del campo Seleccionar valor

Para seleccionar el texto resaltado, estoy usando window.getSelection().toString() y cuando me consuelo obtengo el valor de texto seleccionado, pero ¿cómo puedo mostrarlo dentro del campo de entrada Seleccionar valor?

Problema : - Cómo representar el texto seleccionado de Ingresar campo de entrada de ejemplo dentro de Seleccionar campo de entrada de valor

Lo que he probado: -

 const ExampleComponent = (props) => { const [exampleValue,setExampleValue] = useState('') const handleMouseUp = () => { const selectedTextValue = window.getSelection().toString() setExampleValue(selectedTextValue) console.log(selectedTextValue) } return ( <Form form={form} labelCol={{ span: 7 }} wrapperCol={{ span: 10 }} layout="horizontal" colon={true} onFinish={onFinish} size="large" > <Form.Item label="Enter Example" name="example_name" className="csi-ant-form-item" hasFeedback rules={[ { required: true, message: "This Field Cannot be Empty!" }, ({ getFieldValue }) => ({ validator(_, value) { if (value.length < 4) { return Promise.reject("Length too short"); } return Promise.resolve(); }, }), ]} > <AutoComplete> <Input allowClear onMouseUp={handleMouseUp}/> </AutoComplete> </Form.Item> <Form.Item label="Select Value" name="entity_value" className="csi-ant-form-item" hasFeedback rules={[ { required: true, message: "This Field Cannot be Empty!" }, ]} > <AutoComplete> <Input placeholder="Select Value from Example" value={exampleValue}/> </AutoComplete> </Form.Item> </Form> ) }

Estoy tratando de mostrar el texto resaltado usando el valor prop like value ={exampleValue}