<div id="root"></div>

.droptab {
  display: block;
  position: fixed;
  background-color: #f90;
  width: 120px;
  padding: 4px;
  border-radius: 5px;
}

const { useState } = React;

const Tabber = props => {
  const { children } = props;
  const [ isDropdown, setIsDropdown ] = useState(false);
  
  const dropStyle = { top: `${isDropdown ? 48 : 0}px` };
  
  return <>
    <h2>{ children }</h2>
    <button onClick={() => setIsDropdown(!isDropdown)}>click me</button>
    <div style={dropStyle} class="droptab">Drop me down</div>
  </>;
};

const root = ReactDOM.createRoot(
  document.getElementById('root')
);
root.render(<Tabber>QnA Habr</Tabber>);