PeopleElement

import { WhopElements, Tracking, PeopleElement } from "@whop/elements-react";
import { loadWhop } from "@whop/elements";

function Example() {
  return (
    <WhopElements elements={loadWhop()}>
      <Tracking /* options */>
        <PeopleElement onPeriodChanged={(e) => console.log(e)} onAttributionModelChanged={(e) => console.log(e)} onFiltersChanged={(e) => console.log(e)} onSortChanged={(e) => console.log(e)} onPersonOpened={(e) => console.log(e)} />
      </Tracking>
    </WhopElements>
  );
}

<script src="https://js.whop.cloud/elements/amber/elements.js" data-whop-elements></script>
<script type="module">
  const tracking = window.WhopElements().tracking.create({ /* options */ });
  tracking.create('people', {
    onPeriodChanged: (e) => console.log(e),
    onAttributionModelChanged: (e) => console.log(e),
    onFiltersChanged: (e) => console.log(e),
    onSortChanged: (e) => console.log(e),
    onPersonOpened: (e) => console.log(e)
  }).mount('#tracking-people');
</script>