JSPM

  • Created
  • Published
  • Downloads 47
  • Score
    100M100P100Q49538F
  • License MIT

React component to visualize TODS `matchUps`

Package Exports

  • tods-score-grid

Readme

tods-score-grid

React draw display for TODS tournament draw structures / brackets

yarn install
yarn storybook

Online Documentation

Interactive Storybook documentation/demos.

Example

alt text

Use

ScoreGrid requires eventData which is produced by Competition Factory. Examples of ScoreGrid can be see in the Factory documentation.

import { ScoreGrid } from 'tods-score-grid';

const Draw = () => {
  const { eventData } =
    tournamentEngine.getEventData({
      participantsProfile: { withIOC: true, withISO2: true },
      eventId
    }) || {};

  const compositionName = utilities.randomMember(['Australian', 'Wimbledon', 'National', 'US Open', 'French', 'ITF']);

  return (
    <div style={{ zoom: 0.9 }}>
      <ScoreGrid compositionName={compositionName} eventData={eventData} events={{}} />
    </div>
  );
};