react点击某个元素，active状态如何给父元素加背景色？

<div className='control-direction-wrapper'>
    <div className="item left"}>
        item1
      </div>
    <div className="item right">
       item2
    </div>
</div>

如上，想在.item:active状态的情况下，给父元素.control-direction-wrapper加个背景色，有什么办法

:has属性目前大多数低版本浏览器不支持，不太适用

control-direction-wrapper:has(.item:active){
    background: red
}

本来想通过给item加onKeyDown, onKeyUp来给父元素加class，才知道keyDown keyUp只是响应键盘，而不响应鼠标