title: What are the curly braces inside html element in jsx?
body: <p>I came across a code sample that had the following syntax:</p>
  
  <pre><code>function createListing(groups, className) {
  
      const sharedProps = {
        title: (
          &lt;InfoButton
            className="margin-left-1"
            data-qa={"info-button"}
          &gt;
            {target =&gt; (
              &lt;Toooltip
                placement="bottom"
                target={target}
              &gt;
                {toolTipText}
              &lt;/Tooltip&gt;
            )}
          &lt;/InfoButton&gt;
        )
      }
  
        &lt;ItemBlock key={group.title} {...sharedProps}&gt;
          Not Available
        &lt;/ItemBlock&gt;
  }
  </code></pre>
  
  <p>I don't quite understand something that's going on with the <code>{target =&gt; ()}</code> section. What is the target variable that's passed inside <code>&lt;InfoButton /&gt;</code>. I google searched this but can't find reference to what that syntax is. Would someone be able to explain what it is or provide a link for further reading? </p>