How do I provide a container for popover component?

I decided to use react-simple-popover for my popover needs. Documentation is here: https://github.com/dbtek/react-popover. The problem is that the documentation is for stateful components (class components). The container prop takes in this of the current class component, but I am using stateless component with hooks. What do I pass in place of the "this" keyword in this way?

import React, { useRef, useState } from "react";  import styled from "styled-components";  import Popover from "react-simple-popover";  import { HelpQuestion } from "../UI/Common";    const Wrapper = styled.div`    margin-bottom: 1rem;  `;    export const TextInput = styled.input`    border: 1px solid      ${(props) => (props.dark ? "#37394B" : props.theme.lightGray)};    padding: 0.5rem 1rem;    width: 100%;    border-radius: 10px;    color: ${(props) => (props.dark ? "white" : "black")};    background-color: ${(props) => (props.dark ? "#37394B" : "white")};  `;        export default function TextField({    label,    value,    onChange,    onClick,    error,    type,    placeholder,    help,    dark,    disabled,  }) {    const [isPopoverOpen, setPopoverOpen] = useState(false);    const popoverRef = useRef(null);    const componentRef = useRef(null);      return (      <Wrapper ref={componentRef}>            <div style=>          <TextInput            value={value}            onChange={!disabled ? onChange : () => {}}            onClick={onClick}            placeholder={placeholder}            type={type}            dark={dark}            disabled={disabled}          />          {help && (            <div              style=              onClick={() => setPopoverOpen(!isPopoverOpen)}              ref={popoverRef}            >              <HelpQuestion className="fas fa-question" />            </div>          )}        </div>        {error && <Error>{error}</Error>}        <Popover          placement="left"          container={componentRef.current} //doesnt work          target={popoverRef}          show={isPopoverOpen}          onHide={() => setPopoverOpen(false)}        >          <p>{help}</p>        </Popover>      </Wrapper>    );  }  

https://stackoverflow.com/questions/65605728/how-do-i-provide-a-container-for-popover-component January 07, 2021 at 10:05AM