pass state to parent component

const ColorsList = ({}) => {
    const [selectedColor, selectColor] = useState(null);
    
    
    ///// const selectedColor wanna send in AddToList component !!!!!!!!!1
     
    
    
    return (
        
        <div>
            <ul className="colors-items">
                {colors.map((color, index) => (
                        
                    <li onClick = {()=> selectColor(color.id)}  key={index} style={{ backgroundColor: color.name }} className= {selectedColor === color.id ? ' dots-choose active' : 'dots-choose' } > </li>
                ))}

            </ul>
        </div>
    );

}

===================================================================
const AddToList = () => {
    const [visiblePopup, setVisiblePopup] = useState(false);
    const [inputValue, setinputValue] = useState('');
  

        let varify = () => {
            !inputValue ? alert('Add plan'):  console.log({
                "id": 
                
                
                
                ///wanna send const here,!!!!!!!!!!!!!!!!
                
                
                
                "name": inputValue,
                "colorId": 5,
                "active": "",
                "color" : "red"
            })
  
        }
       
  
    return (
        <div className="add-to-list-wrapp">
            <List
                onClick={() => setVisiblePopup(!visiblePopup)}
                items={[

                    {
                        name: 'Добавить',
                        icon: addSvg,
                        active: '',
                        className: 'adding_plan'
                    }
                ]
                } />
            {visiblePopup && <div className="functional-popup"> 
            <span> <img alt= 'icon' onClick={() => setVisiblePopup(!visiblePopup)} src={closeSvg} />  </span>
            <input onChange = {e => {setinputValue(e.target.value)}} value = {inputValue} placeholder="Что планируешь?" type="text" /> 
            <div className='add-list-colors'>
            
            <ColorsList   />  //////////////  child component  !!!!!!!!!!
            
            
            </div>
             <button  onClick = {() => setinputValue('') || varify() } className="btn primary"> Добавить план</button>  
             </div>}
        </div>
    )
    
}