API Overview

Component signature

const SoccerLineUp: React.FC<PitchViewProps>;

The component accepts props defined in PitchViewProps:

Prop	Type	Required	Default value	Description
`color`	`string`	No	`#588f58`	The pitch background color
`size`	`PitchSize`	No	`"normal"`	Pitch dimensions
`pattern`	`PitchPattern`	No	-	The pattern applied to the pitch grass
`orientation`	`PitchOrientation`	No	`"horizontal"`	The pitch orientation
`homeTeam`	`Team`	No	-	The home team
`awayTeam`	`Team`	No	-	The away team

Value	Description
`"horizontal"`	Landscape layout. Home team on the left, away team on the right
`"vertical"`	Portrait layout. Home team at the bottom, away team at the top

Attribute	Type	Required	Default value	Description
`squad`	`Squad`	Yes	-	The team players by role
`style`	`Style`	No	-	The team style

Attribute	Type	Required	Default value	Description
`gk`	`Player`	No	-	The squad goalkeeper
`df`	`Player[]`	No	-	The squad defenders
`cdm`	`Player[]`	No	-	The squad central defensive midfielders
`cm`	`Player[]`	No	-	The squad central midfielders
`cam`	`Player[]`	No	-	The squad central attack midfielders
`fw`	`Player[]`	No	-	The squad forwards

Attribute	Type	Required	Default value	Description
`color`	`string`	No	`#ffffff` (home) / `#333333` (away)	The team color
`borderColor`	`string`	No	`#ffffff` (home) / `#333333` (away)	The team border color
`numberColor`	`string`	No	`#333333` (home) / `#ffffff` (away)	The team number color
`numberBackgroundColor`	`string`	No	-	The team number background color
`pattern`	`string`	No	`"none"`	The team jersey pattern
`patternColor`	`string`	No	-	The team jersey pattern color
`nameColor`	`string`	No	`#333333` (home) / `#ffffff` (away)	The team players’ name color
`nameBackgroundColor`	`string`	No	-	The team players’ name background color

Attribute	Type	Required	Default value	Description
`name`	`string`	No	-	The displayed player name
`number`	`number`	No	-	The displayed player number
`style`	`Style`	No	The team style	The player style
`offset`	`PlayerOffset`	No	-	The player position offset
`onCLick`	`Function`	No	-	Callback to invoke when clicking on the player

Attribute	Type	Required	Default value	Description
`x`	`number`	No	0	The horizontal offset
`y`	`number`	No	0	The vertical offset