CompanyOwnershipProvider

The CompanyOwnershipProvider component is a context provider, granting external access to the company ownership chart beyond the CompanyOwnership component itself.

This functionality proves particularly valuable when there’s a toolbar or sidebar housing elements that require interaction with the company ownership chart. Examples would include buttons for zooming in and out or fitting the graph into the viewport.

The snippet below illustrates how to leverage the CompanyOwnershipProvider, enabling a component featuring both a CompanyOwnership and a sidebar to utilize the useCompanyOwnershipContext hook.

function CompanyOwnershipWrapper() {
  const { fitContent, zoomTo } = useCompanyOwnershipContext()

  return (
    <>
      <CompanyOwnership data={data} contextMenuItems={item => {
          if (item) {
            return [{ title: 'Zoom to Item', action: () => zoomTo([item]) }]
          }
          return []
        }}>
      </CompanyOwnership>
      <div style={{position: 'absolute', top: '20px', left: '20px'}}>
        <button onClick={() => fitContent()}>Fit Content</button>
      </div>
    </>
  )
}

function CompanyOwnershipComponent () {
  return (
    <CompanyOwnershipProvider>
      <CompanyOwnershipWrapper></CompanyOwnershipWrapper>
    </CompanyOwnershipProvider>
  )
}