{"version":3,"file":"js/react/mls-stats-comparison-app.js?_t=acbaa5ff421dc9ad12f1","mappings":";;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;ACAA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AAGA;AAAA;AACA;AACA;AACA;AACA;AAGA;AAQA;AAGA;AAEA;;;;;;;;;;;;;;;;;;ACnCA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AAGA;AAAA;AACA;AACA;AACA;AACA;AACA;AAGA;AASA;AAGA;AAEA;;;;;;;;;;;;;;;;;;ACtCA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AAGA;AAOA;AAGA;AAEA;;;;;;;;;;;;;;;;;;;;AC/BA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAGA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AAoBA;AAGA;AAEA;;;;;;;;;;;;;;;;;;ACnFA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAGA;AAAA;AACA;AACA;AACA;AACA;AAGA;AAQA;AAGA;AAEA;;;;;;;;;;;;;;;;;;AClCA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAGA;AACA;AAAA;AAGA;AAEA;AAGA;AAYA;AAGA;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AAGA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAAA;AAGA;AACA;AAAA;AAIA;AAAA;AACA;AAGA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAAA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AACA;AAAA;AAGA;AAWA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAQA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAwFA;AACA;AAGA;AAmBA;AAGA;AAEA;;;;;;;;;;;;;;;;;;AC9TA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AAGA;AAAA;AACA;AACA;AAGA;AACA;AAEA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAAA;AAGA;AAAA;AACA;AAGA;AACA;AAEA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAEA;AACA;AAEA;AAEA;AACA;;;;;;;;;;;;;;;ACjJA;AAGA;;;;;;;;;;;;;;;;ACJA;;;;;;;;;;;;;;;;ACAA;AAEA;AACA;AAAA;AAEA;AAOA;AAEA;;;;;;;;;;;;;;;;ACdA;;;;;;;;;;;;;;;;;;;;;;ACAA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;AAEA;AAEA;AACA;AAAA;AAEA;AAAA;AACA;AAEA;AAAA;AACA;AAGA;AAAA;AACA;AAEA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAIA;AAMA;AAGA;AAAA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AACA;AACA;AAAA;AAEA;AACA;AAEA;AAIA;AAAA;AAGA;AAGA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;;;;;;;;;;;;;;;;AC1FA;AAEA;AACA;AAUA;AAGA;AAEA;;;;;;;;;;;;;;;;;;;;;;AClBA;AAEA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AAAA;AAAA;AACA;AAEA;AAAA;AAGA;AAAA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AACA;AAAA;AAEA;AACA;AAEA;AASA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAiBA;AAGA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAKA;AAGA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AAAA;AAKA;AAAA;AAAA;AACA;AACA;AAAA;AAIA;AAAA;AAAA;AACA;AACA;AAAA;AAIA;AAEA;AAGA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAYA;AAMA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAIA;AAIA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAOA","sources":["webpack://@mlssoccer/netcore/./scripts/react/mls-stats-comparison/app.js","webpack://@mlssoccer/netcore/./scripts/react/mls-stats-comparison/components/AttackingChart/AttackingChart.js","webpack://@mlssoccer/netcore/./scripts/react/mls-stats-comparison/components/DefendingChart/DefendingChart.js","webpack://@mlssoccer/netcore/./scripts/react/mls-stats-comparison/components/ExpectedGoalsChart/ExpectedGoalsChart.js","webpack://@mlssoccer/netcore/./scripts/react/mls-stats-comparison/components/GeneralChart/GeneralChart.js","webpack://@mlssoccer/netcore/./scripts/react/mls-stats-comparison/components/PassingChart/PassingChart.js","webpack://@mlssoccer/netcore/./scripts/react/mls-stats-comparison/components/StatChart/StatChart.js","webpack://@mlssoccer/netcore/./scripts/react/mls-stats-comparison/main.js","webpack://@mlssoccer/netcore/./scripts/react/mls-stats-comparison/utils.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/ConditionalWrapper/ConditionalWrapper.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/ConditionalWrapper/index.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/ErrorDisplay/ErrorDisplay.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/ErrorDisplay/index.js","webpack://@mlssoccer/netcore/./scripts/react/shared/hooks/useMatchStatus.js","webpack://@mlssoccer/netcore/./scripts/react/shared/svg/StatChartSvg/StatChartSvg.js","webpack://@mlssoccer/netcore/./scripts/react/shared/svg/Svg.js"],"sourcesContent":["export { default } from './main';\n","import React from \"react\";\nimport StatChart from \"../StatChart/StatChart\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\n\nfunction AttackingChart({ homeClub, awayClub, homeBackgroundColor, awayBackgroundColor }) {\n const { mediaQueries, t } = useReactAppState();\n const { isMediumMin } = mediaQueries || {};\n\n const {\n goals: home_goals,\n shot_off_target: home_shot_off_target,\n shots_on_target: home_shots_on_target,\n blocked_scoring_att: home_blocked_scoring_att,\n } = homeClub || {};\n\n const {\n goals: away_goals,\n shot_off_target: away_shot_off_target,\n shots_on_target: away_shots_on_target,\n blocked_scoring_att: away_blocked_scoring_att,\n } = awayClub || {};\n\n return (\n
\n \n \n \n \n
\n );\n}\n\n// eslint-disable-next-line no-func-assign\nAttackingChart = React.memo(AttackingChart);\n\nexport default AttackingChart;\n","import React from \"react\";\nimport StatChart from \"../StatChart/StatChart\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\n\nfunction DefendingChart({ homeClub, awayClub, homeBackgroundColor, awayBackgroundColor }) {\n const { mediaQueries, t } = useReactAppState();\n const { isMediumMin } = mediaQueries || {};\n\n const {\n goals_conceded: home_goals_conceded,\n clean_sheet: home_clean_sheet,\n expected_goals_conceded: home_expected_goals_conceded,\n interception: home_interception,\n shots_against: home_shots_against\n } = homeClub || {};\n\n const {\n goals_conceded: away_goals_conceded,\n clean_sheet: away_clean_sheet,\n expected_goals_conceded: away_expected_goals_conceded,\n interception: away_interception,\n shots_against: away_shots_against\n } = awayClub || {};\n\n return (\n
\n \n \n \n \n \n
\n );\n}\n\n// eslint-disable-next-line no-func-assign\nDefendingChart = React.memo(DefendingChart);\n\nexport default DefendingChart;\n","import React from \"react\";\nimport StatChart from \"../StatChart/StatChart\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\n\nfunction ExpectedGoalsChart({ homeClub, awayClub, homeBackgroundColor, awayBackgroundColor }) {\n const { mediaQueries, t } = useReactAppState();\n const { isMediumMin } = mediaQueries || {};\n\n const {\n shots: home_shots,\n shots_on_target: home_shots_on_target,\n total_team_xg: home_total_team_xg\n } = homeClub || {};\n const {\n shots: away_shots,\n shots_on_target: away_shots_on_target,\n total_team_xg: away_total_team_xg\n } = awayClub || {};\n\n return (\n
\n \n \n \n
\n );\n}\n\n// eslint-disable-next-line no-func-assign\nExpectedGoalsChart = React.memo(ExpectedGoalsChart);\n\nexport default ExpectedGoalsChart;\n","import React from \"react\";\nimport StatChart from \"../StatChart/StatChart\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\nimport { statusTypes } from \"../../../mls-match-list/utils\";\nimport { isMlsCompetitionMatch } from \"../../utils\";\n\nfunction GeneralChart({ homeClub, awayClub, homeBackgroundColor, awayBackgroundColor, statusMatch }) {\n const { mediaQueries, t, match } = useReactAppState();\n const { isMediumMin } = mediaQueries || {};\n const isPreMatch = statusMatch === statusTypes.pre;\n\n\n const {\n possession_percentage: home_possession_percentage,\n shots: home_shots,\n shot_on_goal_percentage: home_shot_on_goal_percentage,\n passing_accuracy_percentage: home_passing_accuracy_percentage,\n corner_taken: home_corner_taken,\n fk_foul_lost: home_fk_foul_lost,\n total_yel_card: home_total_yel_card,\n total_red_card: home_total_red_card,\n shots_on_target: home_shots_on_target,\n blocked_scoring_att: home_blocked_scoring_att,\n total_cross: home_total_cross,\n total_offside: home_total_offside,\n duel_won: home_duel_won,\n won_tackle: home_won_tackle,\n saves: home_saves,\n total_clearance: home_total_clearance,\n total_pass: home_total_pass,\n aerial_won: home_aerial_won,\n expected_goals: home_expected_goals,\n } = homeClub || {};\n\n const {\n possession_percentage: away_possession_percentage,\n shots: away_shots,\n shot_on_goal_percentage: away_shot_on_goal_percentage,\n passing_accuracy_percentage: away_passing_accuracy_percentage,\n corner_taken: away_corner_taken,\n fk_foul_lost: away_fk_foul_lost,\n total_yel_card: away_total_yel_card,\n total_red_card: away_total_red_card,\n shots_on_target: away_shots_on_target,\n blocked_scoring_att: away_blocked_scoring_att,\n total_cross: away_total_cross,\n total_offside: away_total_offside,\n duel_won: away_duel_won,\n won_tackle: away_won_tackle,\n saves: away_saves,\n total_clearance: away_total_clearance,\n total_pass: away_total_pass,\n aerial_won: away_aerial_won,\n expected_goals: away_expected_goals,\n } = awayClub || {};\n\n const showAllStats = isMlsCompetitionMatch(match?.competitionOptaId);\n\n return (\n
\n {showAllStats && }\n \n \n \n \n \n \n \n \n {showAllStats && }\n {showAllStats && }\n \n \n \n \n \n
\n );\n}\n\n// eslint-disable-next-line no-func-assign\nGeneralChart = React.memo(GeneralChart);\n\nexport default GeneralChart;\n","import React from \"react\";\nimport StatChart from \"../StatChart/StatChart\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\n\nfunction PassingChart({ homeClub, awayClub, homeBackgroundColor, awayBackgroundColor }) {\n const { mediaQueries, t } = useReactAppState();\n const { isMediumMin } = mediaQueries || {};\n const {\n overall: home_overall,\n open_play_cross_per: home_open_play_cross_per,\n open_play_pass_per: home_open_play_pass_per,\n set_piece_cross_per: home_set_piece_cross_per,\n } = homeClub || {};\n\n const {\n overall: away_overall,\n open_play_cross_per: away_open_play_cross_per,\n open_play_pass_per: away_open_play_pass_per,\n set_piece_cross_per: away_set_piece_cross_per,\n } = awayClub || {};\n\n return (\n
\n \n \n \n \n
\n );\n}\n\n// eslint-disable-next-line no-func-assign\nPassingChart = React.memo(PassingChart);\n\nexport default PassingChart;\n","import React, { useMemo } from 'react';\nimport StatChartSvg from \"../../../shared/svg/StatChartSvg/StatChartSvg\";\nimport { percentDiff, calculateDistanceBetweenTwoNumbers, calculateDistanceBetweenTwoDecimals } from '../../../../libraries/_helpers/index';\n\nfunction StatChart({ firstValue = 0, secondValue = 0, title, leftColor, rightColor, chartHeight, isPercentage = false, isAverage = false }) {\n const isFirstValueGreater = isAverage && firstValue && secondValue ? Number(firstValue) > Number(secondValue) : firstValue > secondValue;\n const isSecondValueGreater = isAverage && firstValue && secondValue ? Number(secondValue) > Number(firstValue) : secondValue > firstValue;\n\n const percentage = useMemo(() => {\n if (!firstValue && !secondValue) {\n return null;\n }\n\n if (firstValue === secondValue) {\n return 50;\n }\n\n return isPercentage ? percentDiff(firstValue, secondValue, true) :\n isAverage ? calculateDistanceBetweenTwoDecimals(firstValue, secondValue)\n : calculateDistanceBetweenTwoNumbers(firstValue, secondValue);\n }, [firstValue, secondValue, title]);\n\n return (\n
\n
{title}
\n
\n
{firstValue ? firstValue : 0}
\n
\n \n
\n
{secondValue ? secondValue : 0}
\n
\n
\n );\n}\n\n// eslint-disable-next-line no-func-assign\nStatChart = React.memo(StatChart);\n\nexport default StatChart;\n","import React, { useState } from 'react';\nimport { useQuery } from \"react-query\";\nimport { Tabs, TabList, Tab, TabPanels, TabPanel } from \"@reach/tabs\";\nimport { capitalize } from 'lodash';\nimport { apiURL, mlsSeasonStatsComparisonAPI, mlsStatsComparisonAPI } from \"../shared/api/variables\";\nimport { fetchClient } from \"../shared/api/fetching\";\nimport ErrorDisplay from \"../shared/components/ErrorDisplay\";\nimport { formatStatsComparisonData, statsComparisonTypes } from \"./utils\";\nimport Picture from \"../shared/components/Picture\";\nimport { statusTypes } from \"../mls-match-list/utils\";\nimport { useMatchStatus } from \"../shared/hooks/useMatchStatus\";\nimport { formatImageUrl } from \"../shared/utils\";\nimport GeneralChart from \"./components/GeneralChart/GeneralChart\";\nimport PassingChart from \"./components/PassingChart/PassingChart\";\nimport AttackingChart from \"./components/AttackingChart/AttackingChart\";\nimport DefendingChart from \"./components/DefendingChart/DefendingChart\";\nimport ExpectedGoalsChart from \"./components/ExpectedGoalsChart/ExpectedGoalsChart\";\nimport { NoResults } from \"../shared/svg/Svg\";\nimport { useReactAppState } from \"../shared/containers/utils\";\nimport ConditionalWrapper from \"../shared/components/ConditionalWrapper\";\n\nfunction StatsComparison({ options }) {\n const { match: appMatch, competitionOptaId: appCompetitionOptaId, mediaQueries, t, matchStatusOverride, urlList, isLeague } = useReactAppState();\n const { baseUrl } = urlList || {};\n\n const { isMediumLargeMin } = mediaQueries || {};\n\n const [competitionOptaId] = useState(options.competitionOptaId || appCompetitionOptaId);\n const [matchOptaId] = useState(options.matchOptaId || appMatch?.optaId);\n const [home] = useState(options.home);\n const [away] = useState(options.away);\n const [season] = useState(options.season);\n const [enableStatsComparisonTabs] = useState(options.enableStatsComparisonTabs);\n const [statsComparisonType] = useState(options.statsComparisonType || statsComparisonTypes.general);\n const { logoColorUrl: homeLogoColorUrl, backgroundColor: homeBackgroundColor, optaId: homeOptaId, abbreviation: homeAbbrev, fullName: homeFullName, shortName: homeShortName, slug: homeSlug } = home || {};\n const { logoColorUrl: awayLogoColorUrl, backgroundColor: awayBackgroundColor, optaId: awayOptaId, abbreviation: awayAbbrev, fullName: awayFullName, shortName: awayShortName, slug: awaySlug } = away || {};\n\n const { isLoading, status: matchStatus, queryConfig } = useMatchStatus({\n initialState: {\n matchOptaId\n }\n });\n\n const status = matchStatusOverride?.abbreviation ? matchStatusOverride : matchStatus;\n const statsComparisonEndpoint = mlsStatsComparisonAPI({ matchOptaId });\n\n const {\n isLoading: isLoadingStats,\n isError: isErrorStats,\n data: statsData,\n error: statsError\n } = useQuery({\n queryKey: [`mls-stats-comparison`, { matchOptaId }],\n queryFn: () => fetchClient({ endpoint: statsComparisonEndpoint, apiURL: apiURL.statsAPI }),\n ...queryConfig,\n enabled: status?.abbreviation !== statusTypes.pre,\n });\n\n const seasonStatsComparisonEndpoint = mlsSeasonStatsComparisonAPI({ homeOptaId, awayOptaId, season, competitionOptaId });\n const {\n isLoading: isLoadingSeasonStats,\n isError: isErrorSeasonStats,\n data: seasonStatsData,\n error: seasonStatsError\n } = useQuery({\n queryKey: [`mls-season-stats-comparison`, { homeOptaId, awayOptaId, season, competitionOptaId }],\n queryFn: () => fetchClient({ endpoint: seasonStatsComparisonEndpoint, apiURL: apiURL.statsAPI }),\n ...queryConfig,\n enabled: status?.abbreviation === statusTypes.pre,\n notifyOnChangeProps: ['data', 'error']\n });\n\n const { homeClub, awayClub } = React.useMemo(() => {\n if (!status) {\n return { homeClub: null, awayClub: null };\n }\n\n if (status?.abbreviation === statusTypes.pre) {\n return formatStatsComparisonData(seasonStatsData, home?.optaId, away?.optaId, true) || { homeClub: null, awayClub: null };\n }\n\n else {\n return formatStatsComparisonData(statsData, home?.optaId, away?.optaId) || { homeClub: null, awayClub: null };\n }\n }, [status, seasonStatsData, statsData]);\n\n const { highQuality: homeClubLogoSrc } = homeLogoColorUrl ? formatImageUrl(homeLogoColorUrl, { format: \"w_128,h_128,c_pad\", extension: \"f_png\" }) : {};\n const { highQuality: awayClubLogoSrc } = awayLogoColorUrl ? formatImageUrl(awayLogoColorUrl, { format: \"w_128,h_128,c_pad\", extension: \"f_png\" }) : {};\n\n const availableHomeShortName = homeShortName ? homeShortName : homeFullName;\n const availableAwayShortName = awayShortName ? awayShortName : awayFullName;\n\n const tabConfig = React.useMemo(() => {\n const defaultArray = [\n {\n value: statsComparisonTypes.general,\n label: t(\"stats_general\"),\n Component: GeneralChart,\n },\n {\n value: statsComparisonTypes.passing,\n label: t(\"stats_passing\"),\n Component: PassingChart,\n },\n {\n value: statsComparisonTypes.attacking,\n label: t(\"stats_attacking\"),\n Component: AttackingChart,\n },\n {\n value: statsComparisonTypes.defending,\n label: t(\"stats_defending\"),\n Component: DefendingChart,\n }\n ];\n\n if (statsComparisonType === statsComparisonTypes.passingBreakdown) {\n return {\n defaultIndex: 0,\n tabsArray: [\n {\n value: statsComparisonTypes.passing,\n label: statsComparisonTypes.passing,\n Component: PassingChart,\n }\n ]\n };\n }\n\n switch (statsComparisonType) {\n case statsComparisonTypes.passingBreakdown: {\n return {\n defaultIndex: 0,\n tabsArray: [\n {\n value: statsComparisonType,\n label: statsComparisonType,\n Component: PassingChart,\n }\n ]\n };\n }\n case statsComparisonTypes.shootingBreakdown: {\n return {\n defaultIndex: 0,\n tabsArray: [\n {\n value: statsComparisonType,\n label: statsComparisonType,\n Component: AttackingChart,\n }\n ]\n };\n }\n case statsComparisonTypes.expectedGoals: {\n return {\n defaultIndex: 0,\n tabsArray: [\n {\n value: statsComparisonType,\n label: statsComparisonType,\n Component: ExpectedGoalsChart,\n }\n ]\n };\n }\n default: {\n return {\n defaultIndex: defaultArray.findIndex(tab => tab.value === statsComparisonType),\n tabsArray: defaultArray\n };\n }\n }\n }, []);\n\n const { defaultIndex, tabsArray } = tabConfig;\n\n if (!matchOptaId) {\n return null;\n }\n\n return (\n\n
\n \n
{`${status?.abbreviation === statusTypes.pre ? t(\"season_stats\") : t(\"match_stats\")}`}
\n {\n isLoading || isLoadingStats || isLoadingSeasonStats\n ? (\n
\n
\n
\n \n
\n \n
\n \n
\n
\n
\n \n
\n \n
\n \n
\n
\n )\n : seasonStatsData?.length || statsData?.length ?\n (\n
\n
\n
\n \n {children}}>\n \n \n
\n {\n isMediumLargeMin\n ? (\n \n \n {children}}>\n {availableHomeShortName}\n \n \n )\n :\n (\n \n \n {children}}>\n {homeAbbrev}\n \n \n )\n }\n
\n {\n enableStatsComparisonTabs ? (\n \n {\n tabsArray.map(tab => {capitalize(tab.label)})\n }\n \n ) : null\n }\n
\n
\n \n {children}}>\n \n \n
\n {\n isMediumLargeMin\n ? (\n \n \n {children}}>\n {availableAwayShortName}\n \n \n )\n :\n (\n \n \n {children}}>\n {awayAbbrev}\n \n \n )\n }\n
\n
\n )\n : <>\n }\n {\n isErrorStats || isErrorSeasonStats\n ? \n : seasonStatsData?.length || statsData?.length ?\n (\n \n {\n tabsArray.map(tab => {\n const { Component, label } = tab;\n return (\n \n \n \n );\n })\n }\n \n )\n :\n <>\n
\n
\n \n
{t(\"match_no_matches\")}
\n
\n
\n \n }\n \n
\n );\n}\n\n// eslint-disable-next-line no-func-assign\nStatsComparison = React.memo(StatsComparison);\n\nexport default StatsComparison;\n","import { calculatePercentage, round, decimalRound } from \"../../libraries/_helpers\";\n\nexport const statsComparisonTypes = {\n general: 'general',\n passing: 'passing',\n attacking: 'attacking',\n defending: 'defending',\n shootingBreakdown: 'shooting-breakdown',\n passingBreakdown: 'passing-breakdown',\n expectedGoals: 'expected-goals'\n};\n\nexport function formatStatsComparisonData(data, homeClubOptaId, awayClubOptaId, isSeasonStats) {\n if (!data || data.length !== 2) {\n return {\n homeClub: {},\n awayClub: {},\n };\n }\n\n const clubs = {\n homeClub: {},\n awayClub: {},\n };\n\n for (let i = 0; i < data.length; i++) {\n const current = data[i];\n\n const { statistics, club } = current || {};\n\n const {\n games_played,\n goals_conceded,\n clean_sheet,\n expected_goals,\n expected_goals_conceded,\n interception,\n attempts_conceded_ibox,\n attempts_conceded_obox,\n possession_percentage,\n total_scoring_att,\n ontarget_scoring_att,\n accurate_pass,\n total_pass,\n corner_taken,\n fk_foul_lost,\n total_yel_card,\n total_red_card,\n yellow_card,\n goals,\n shot_off_target,\n blocked_scoring_att,\n accurate_fwd_zone_pass,\n total_fwd_zone_pass,\n successful_final_third_passes,\n total_final_third_passes,\n accurate_cross,\n total_cross,\n total_cross_nocorner,\n total_offside,\n duel_won,\n won_tackle,\n saves,\n total_clearance,\n aerial_won,\n accurate_pass_per,\n accurate_cross_per,\n successful_open_play_pass,\n open_play_pass,\n accurate_freekick_cross,\n freekick_cross,\n accurate_cross_nocorner,\n } = statistics || {};\n\n const attempts_conceded = (attempts_conceded_ibox ? attempts_conceded_ibox : 0) + (attempts_conceded_obox ? attempts_conceded_obox : 0);\n\n const isAverageValue = isSeasonStats && games_played > 0;\n\n const currentClub = {\n total_team_xg: round(expected_goals ? expected_goals : 0, 1),\n possession_percentage: round(possession_percentage, 1),\n shots: getStatsValue(isAverageValue, total_scoring_att, games_played),\n shot_on_goal_percentage: calculatePercentage(ontarget_scoring_att, total_scoring_att),\n passing_accuracy_percentage: calculatePercentage(accurate_pass, total_pass),\n goals_conceded,\n clean_sheet,\n expected_goals_conceded: round(expected_goals_conceded, 1),\n interception,\n shots_against: round(attempts_conceded, 1),\n corner_taken: getStatsValue(isAverageValue, corner_taken, games_played),\n fk_foul_lost: getStatsValue(isAverageValue, fk_foul_lost, games_played),\n total_yel_card: getStatsValue(isAverageValue, total_yel_card ? total_yel_card : yellow_card, games_played),\n total_red_card: getStatsValue(isAverageValue, total_red_card, games_played),\n opta_id: club.opta_id,\n club,\n goals: goals ? goals : 0,\n shot_off_target: shot_off_target ? shot_off_target : 0,\n shots_on_target: getStatsValue(isAverageValue, ontarget_scoring_att, games_played),\n blocked_scoring_att: getStatsValue(isAverageValue, blocked_scoring_att, games_played),\n overall: calculatePercentage(accurate_pass, total_pass),\n attacking: calculatePercentage(accurate_fwd_zone_pass, total_fwd_zone_pass),\n finalThird: calculatePercentage(successful_final_third_passes, total_final_third_passes),\n crosses: calculatePercentage(accurate_cross, total_cross),\n total_pass: getStatsValue(isAverageValue, total_pass, games_played),\n total_cross: getStatsValue(isAverageValue, total_cross_nocorner, games_played),\n total_offside: getStatsValue(isAverageValue, total_offside, games_played),\n duel_won: getStatsValue(isAverageValue, duel_won, games_played),\n won_tackle: getStatsValue(isAverageValue, won_tackle, games_played),\n saves: getStatsValue(isAverageValue, saves, games_played),\n total_clearance: getStatsValue(isAverageValue, total_clearance, games_played),\n expected_goals: decimalRound(expected_goals, 1) || 0,\n aerial_won: aerial_won || 0,\n accurate_pass_per: decimalRound(accurate_pass_per) || 0,\n accurate_cross_per: decimalRound(accurate_cross_per) || 0,\n open_play_pass_per: calculatePercentage(successful_open_play_pass, open_play_pass),\n set_piece_cross_per: calculatePercentage(accurate_freekick_cross, freekick_cross),\n open_play_cross_per: calculatePercentage(accurate_cross_nocorner, total_cross_nocorner),\n };\n\n if (homeClubOptaId === club?.opta_id) {\n clubs.homeClub = currentClub;\n }\n else if (awayClubOptaId === club?.opta_id) {\n clubs.awayClub = currentClub;\n }\n }\n\n return clubs;\n}\n\nfunction getStatsValue(isAverageValue, statsValue, gamesPlayed) {\n if (!statsValue) {\n return 0;\n }\n if (isAverageValue && gamesPlayed > 0) {\n return decimalRound(statsValue / gamesPlayed, 1);\n }\n return statsValue;\n}\n\nexport function isMlsCompetitionMatch(competitionId = \"\") {\n const { mlsCompetitionIds = \"\" } = window.forgeVariables.match;\n\n const mlsCompetitionIdsArray = mlsCompetitionIds.split(\",\");\n\n return mlsCompetitionIdsArray.includes(competitionId.toString());\n}\n","/*This will render a wrapper around a children based on a condition */\nconst ConditionalWrapper = ({ condition, wrapper, children }) =>\n condition ? wrapper(children) : children;\n\nexport default ConditionalWrapper;\n","export { default } from './ConditionalWrapper';\n","import React from 'react';\n\nconst ErrorDisplay = ({ error }) => {\n if (!error || !error.message) return null;\n\n return (\n
\n

\n {error.message}\n

\n
\n );\n};\n\nexport default ErrorDisplay;\n","export { default } from './ErrorDisplay';\n","import React, { useEffect } from \"react\";\nimport { composeMatchStatus, periodTypes, statusTypes } from \"../../mls-match-list/utils\";\nimport { apiURL, mlsSingleMatchStatsAPI } from \"../api/variables\";\nimport { useQuery } from \"react-query\";\nimport { fetchClient } from \"../api/fetching\";\n\nexport const actionTypes = {\n status: 'status',\n matchOptaId: \"matchOptaId\"\n};\n\nexport function matchStatusReducer(state, action) {\n switch (action.type) {\n case actionTypes.status: {\n return { ...state, status: action.payload };\n }\n case actionTypes.matchOptaId: {\n return { ...state, matchOptaId: action.payload };\n }\n\n default: {\n throw new Error(`Unsupported type: ${action.type}`);\n }\n }\n}\n\nexport function useMatchStatus({ matchData = null, initialState, reducer = matchStatusReducer } = {}) {\n const { current: currentState } = React.useRef(initialState);\n const [state, dispatch] = React.useReducer(reducer, currentState);\n\n const { status: matchStatus, matchOptaId, matchStatusOverride } = state || {};\n const mlsMatchEndpoint = mlsSingleMatchStatsAPI({ matchOptaId });\n const updateMatchStatus = React.useCallback(({ type, payload }) => dispatch({ type, payload }), [dispatch]);\n\n const status = matchStatusOverride?.abbreviation ? matchStatusOverride : matchStatus;\n\n const queryConfig = status\n ? {\n enabled: true,\n refetchIntervalInBackground: true,\n staleTime:\n status?.abbreviation === statusTypes.live || status?.abbreviation === statusTypes.pre\n ? 0\n : Infinity,\n refetchInterval:\n status?.abbreviation === statusTypes.live\n ? 30000\n : status?.abbreviation === statusTypes.pre\n ? 200000\n : null\n } : { enabled: false };\n\n const { data, error, isLoading, isError, isIdle } = useQuery({\n queryKey: [`mls-match`, { matchOptaId }],\n queryFn: () => fetchClient({ endpoint: mlsMatchEndpoint, apiURL: apiURL.statsAPI }),\n select: data => data && data.length > 0 ? data[0] : null,\n ...queryConfig,\n enabled: matchOptaId > 0 && !matchData,\n });\n\n const mlsMatch = matchData ? matchData : data;\n\n useEffect(() => {\n if (!mlsMatch) {\n return;\n }\n const { period } = mlsMatch || {};\n const { delayedMatch } = initialState;\n\n const matchStatus = matchStatusOverride\n ? matchStatusOverride\n : composeMatchStatus({ period, delayedMatch });\n\n updateMatchStatus({ type: actionTypes.status, payload: matchStatus });\n }, [mlsMatch, initialState.delayedMatch]);\n\n const isShootout = status?.value === periodTypes.ShootOut;\n\n\n return {\n mlsMatch,\n error,\n isLoading,\n isIdle,\n isError,\n status,\n isShootout,\n queryConfig,\n updateMatchStatus\n };\n}\n","import React from \"react\";\n\nfunction StatChartSvg({ percentage, leftColor, rightColor, chartHeight = 1 }) {\n return (\n \n \n \n \n \n \n \n \n );\n}\n\n// eslint-disable-next-line no-func-assign\nStatChartSvg = React.memo(StatChartSvg);\n\nexport default StatChartSvg;\n","import React from \"react\";\n\nexport const chevronDirection = {\n down: \"down\",\n up: \"up\",\n left: \"left\",\n right: \"right\",\n};\n\nexport const Chevron = ({\n useEmptyClasses = false,\n extraClasses,\n direction = chevronDirection.down,\n size = \"small\",\n}) =>\n !useEmptyClasses ? (\n \n \n \n \n \n \n
\n ) : (\n
\n \n \n \n
\n );\n\nexport const Filters = ({ extraClasses, size = \"small\" }) => (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n);\n\nexport const NoResults = ({ extraClasses, size = \"large\" }) => (\n \n \n \n \n \n \n \n \n \n \n);\n\nexport const MediaPlayingSVG = ({ extraClasses, size = \"large\" }) => (\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n);\n\nexport const CardBackground = ({ extraClasses }) => (\n
\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n);\n\nexport const TriangleSVG = ({ extraClasses, size = \"small\" }) => (\n \n \n \n \n \n \n \n);\n"],"names":[],"sourceRoot":""}