\n {\n matchPromo?.headline || matchPromo?.description\n ? (\n
\n )\n : null\n );\n};\n\nexport default MatchPromo;\n","export { default } from './MatchPromo';\n","import React from 'react';\nimport { listTypes, useMatchData } from \"../../utils\";\nimport ToggleButton from \"../../../shared/components/ToggleButton\";\nimport Sponsor from \"../../../shared/components/Sponsor\";\nimport MatchPromo from \"../MatchPromo\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\n\nconst MatchPromoGroup = () => {\n const { t } = useReactAppState();\n const { listType, promoInfo } = useMatchData();\n if (listType !== listTypes.matches || promoInfo == null) {\n return null;\n }\n\n const {\n matchPromo,\n sponsorImage,\n promotionalStay,\n promotionalFly,\n promotionalRide,\n promotionalSponsor\n } = promoInfo;\n const { assetUrl } = sponsorImage || {};\n\n const promoSponsor = (promotionalSponsor && promotionalSponsor?.displayText && promotionalSponsor?.displayText !== \"\") || (promotionalSponsor?.displayText === \"\" && assetUrl);\n const promoStay = promotionalStay && promotionalStay?.displayText && promotionalStay?.displayText !== \"\";\n const promoFly = promotionalFly && promotionalFly?.displayText && promotionalFly?.displayText !== \"\";\n const promoRide = promotionalRide && promotionalRide?.displayText && promotionalRide?.displayText !== \"\";\n const noPromos = !matchPromo && !promoStay && !promoRide && !promoFly && !promoSponsor && !assetUrl;\n\n return (\n \n {\n matchPromo?.headline\n ?
\n )\n : null\n }\n {\n matchPromo?.callToAction1 || matchPromo?.callToAction2 || promotionalMisc1?.displayText !== \"\" || promotionalMisc2.displayText !== \"\"\n ? (\n {matchPromo.headline}
\n : null\n }\n {\n matchPromo?.description\n ? (\n \n
\n )\n : null\n }\n \n {\n matchPromo?.callToAction1?.displayText && matchPromo?.callToAction1?.url && matchPromo?.callToAction1?.url !== \"\" ?\n (\n \n {matchPromo?.callToAction1?.displayText}\n \n {matchPromo?.callToAction2?.displayText}\n \n {promotionalMisc1?.displayText}\n \n {promotionalMisc2?.displayText}\n
\n )\n : null\n }\n \n
\n );\n};\n\nexport default MatchPromoGroup;\n","export { default } from './MatchPromoGroup';\n","import { formatScores, useMatchData, composeAggregate } from \"../../utils\";\nimport React from \"react\";\nimport { d3AggregateAPI } from \"../../../shared/api/variables\";\nimport { useQuery } from \"react-query\";\nimport { fetchClient } from \"../../../shared/api/fetching\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\n\nfunction MatchShootout() {\n const { apiList } = useReactAppState();\n const { d3SportsAPI } = apiList || {};\n const { homeClubData, awayClubData, period, resultType, queryConfig, matchOptaId, competition } = useMatchData();\n\n const d3AggregateEndpoint = d3AggregateAPI({ matchOptaId });\n const { data: aggregateData, isLoading } = useQuery({\n queryKey: [`d3-aggregate`, { matchOptaId }],\n queryFn: () => fetchClient({ endpoint: d3AggregateEndpoint, apiURL: d3SportsAPI }),\n ...queryConfig,\n enabled: !!(matchOptaId) && (competition?.optaId == 549 || (competition?.optaId == 98 && competition?.matchType === \"Cup\"))\n });\n\n const { aggregate, date } = aggregateData || {};\n\n const composedAggregate = composeAggregate(aggregate, date);\n\n const { shootoutResult } = formatScores({\n homeClubData,\n awayClubData,\n period,\n resultType\n });\n\n if (isLoading) {\n return null;\n }\n\n return (\n composedAggregate || shootoutResult\n ? \n {\n (promoSponsor)\n ?
\n ) : null\n }\n \n {\n (promoStay)\n ? (\n
\n )\n : null\n }\n \n {t(\"match_promo_hotel\")}\n {(promotionalStay?.url) ? (\n \n {promotionalStay?.displayText}\n \n )\n :\n (\n {promotionalStay?.displayText}\n )\n }\n
\n )\n : null\n }\n {\n (promoFly)\n ? (\n \n {t(\"match_promo_fly\")}\n {(promotionalFly?.url) ? (\n \n {promotionalFly?.displayText}\n )\n :\n (\n {promotionalFly?.displayText}\n )\n }\n
\n )\n : null\n }\n {\n (promoRide)\n ? (\n \n {t(\"match_promo_travel\")}\n {(promotionalRide?.url) ? (\n \n {promotionalRide?.displayText}\n )\n :\n (\n {promotionalRide?.displayText}\n )\n }\n
\n )\n : null\n }\n {composedAggregate || shootoutResult}
\n : null\n );\n}\n\nexport default MatchShootout;\n","/* eslint-disable no-func-assign */\nimport React from 'react';\nimport { listTypes, statusTypes, useMatchData, getMatchListOdds } from \"../../utils\";\nimport ToggleButton from \"../../../shared/components/ToggleButton\";\nimport BettingLines from \"../BettingLines/BettingLines\";\nimport ExternalLinkIcon from \"../../../shared/svg/ExternalLinkIcon\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\nimport { d3BettingAPI } from \"../../../shared/api/variables\";\nimport { fetchClient } from '../../../shared/api/fetching';\nimport { useQuery } from 'react-query';\n\nfunction Odds({ betMgmCompetitionIds = null }) {\n const { mediaQueries, t, apiList, betMgmUrl } = useReactAppState();\n const { d3SportsAPI } = apiList || {};\n const { isMediumLargeMin } = mediaQueries || {};\n const { listType, homeClubData, awayClubData, status, mgmId } = useMatchData();\n if (listType !== listTypes.odds) {\n return null;\n }\n\n const d3BettingEndpoint = mgmId ? d3BettingAPI({ mgmId, mgmCompetitionId: betMgmCompetitionIds }) : null;\n\n const {\n data: oddsData,\n } = useQuery({\n queryKey: [`mls-match-odds`, { mgmId }],\n queryFn: () => fetchClient({ endpoint: d3BettingEndpoint, apiURL: d3SportsAPI }),\n enabled: status?.abbreviation === statusTypes.pre && d3BettingEndpoint !== null\n });\n\n const regularMatchResults = oddsData?.length ? getMatchListOdds(oddsData) : {};\n\n return (\n \n {\n status?.abbreviation === statusTypes.pre && Object.keys(regularMatchResults)?.length\n ? (\n <>\n \n \n \n )\n : null\n }\n
\n );\n}\n\nOdds = React.memo(Odds);\n\nexport default Odds;\n","export { default } from './Odds';\n","import React from 'react';\nimport { listTypes, useMatchData } from \"../../utils\";\nimport { composeGeoLocatedProviders } from \"../../../shared/utils\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\n\nconst TvStreaming = () => {\n const { location } = useReactAppState();\n const { mediaProviders, listType } = useMatchData();\n if (listType !== listTypes.tv || !mediaProviders) {\n return null;\n }\n\n const { country } = location || {};\n const { streaming, national, radio } = composeGeoLocatedProviders(mediaProviders, country);\n\n const { homeLinear, awayLinear, homeStreaming, awayStreaming, clubLinear, clubStreaming, clubRadio } = mediaProviders || {};\n\n const mergedProviders = [\n ...national,\n ...streaming,\n ...radio,\n ...(homeLinear != null ? homeLinear : []),\n ...(awayLinear != null ? awayLinear : []),\n ...(homeStreaming != null ? homeStreaming : []),\n ...(awayStreaming != null ? awayStreaming : []),\n ...(clubLinear != null ? clubLinear : []),\n ...(clubStreaming != null ? clubStreaming : []),\n ...(clubRadio != null ? clubRadio : []),\n ];\n\n const showBroadcasters = mergedProviders && mergedProviders.length > 0;\n\n return (\n \n {\n homeClubData?.abbreviation\n ?
\n {\n isMediumLargeMin\n ? (\n \n
\n )\n : null\n }\n \n
\n {t(\"match_bet_now\")}
\n {t(\"match_bet_mgm\")}
\n - \n {\n showBroadcasters\n ? mergedProviders.map((provider, index) => {\n const { broadcasterName, broadcasterTypeLabel } = provider || {};\n\n return (\n broadcasterName != null && broadcasterTypeLabel != null\n ? (\n
- \n {provider.broadcasterTypeLabel}\n {provider.broadcasterName}\n \n ) : null\n );\n })\n : null\n }\n
\n
\n );\n}\n\n// eslint-disable-next-line no-func-assign\nMatchList = React.memo(MatchList);\n\nexport default MatchList;\n","import React from \"react\";\nimport ExplainerBar from \"../../../shared/components/ExplainerBar/ExplainerBar\";\nimport { Link } from \"../../../shared/components/Link/Link\";\nimport MatchTile from \"../../../shared/components/MatchTile/MatchTile\";\nimport { slugifyMatch, statusTypes, useMatchData } from \"../../utils\";\nimport { MatchBroadcaster } from \"../MatchBroadcaster/MatchBroadcaster\";\nimport { MatchInfo } from \"../MatchInfo/MatchInfo\";\nimport { MatchTime } from \"../MatchTime/MatchTime\";\nimport { MatchWatch } from \"../MatchWatch/MatchWatch\";\nimport {\n StyledBroadcastersWrapper,\n StyledExplainerBar,\n StyledExplainerBarCompetition,\n StyledMatch,\n StyledMatchContainer,\n} from \"./StyledMatch\";\nimport useIsMobile from \"../../../shared/hooks/useIsMobile\";\nimport useShootoutScore from \"./useShootoutScore\";\nimport MatchListPromo from \"../MatchPromo/MatchPromo\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\n\nexport const Match = ({\n position = null,\n hideMatchPromos,\n showClubRanks = false,\n showCompetitionStage = false,\n showRoundDetail = false,\n showGroupInformation = false,\n}) => {\n const {\n homeClubData,\n awayClubData,\n homeClubRank,\n awayClubRank,\n status,\n winnerStatus,\n matchPageUrl,\n competition,\n leagueMatchTitle,\n mediaProviders,\n matchOptaId,\n competitionPhase,\n roundName,\n roundGroup,\n hotelBooking,\n } = useMatchData();\n const { t } = useReactAppState();\n const { isHomeWinner, isAwayWinner } = winnerStatus || {};\n\n const isMobile = useIsMobile();\n\n const { homeScore, awayScore, shootoutResult } = useShootoutScore();\n\n const isFriendlyMatch = matchOptaId <= 0;\n\n const handleMatchClick = (event) => {\n if (isFriendlyMatch) {\n event.stopPropagation();\n }\n };\n\n const roundInfo = [\n showCompetitionStage ? t(slugifyMatch(competitionPhase)) : null,\n showRoundDetail ? t(slugifyMatch(roundName)) : null,\n showGroupInformation ? t(slugifyMatch(roundGroup)) : null,\n ];\n const composedInfo = roundInfo.filter((x) => x).join(\" • \");\n\n return (\n \n {\n isLoadingClubs\n ? \n
\n \n \n
\n {\n isMediumLargeMin && listType !== listTypes.odds && calendarUrl\n ? (\n \n \n \n \n
\n {\n hideCompetitionsDropdown\n ? null\n : (\n \n {isCalendarOpen\n ?\n (\n \n \n )\n : null\n }\n
\n \n {\n isLoadingMatches || isLoadingClubs || isLoadingNextMatch\n ? \n \n :\n
\n {isLoadingNextMatch || currentDatePoint === null ? null :\n \n
\n )\n }\n {t(\"match_no_matches\")}
\n \n
\n }\n \n \n \n {dateRangeType === dateRangeTypes.week ? nextRangeWeek?.formattedDateRangeString : (dateRangeType === dateRangeTypes.year ? getYear(nextRangeYear?.dateRangeStart) : nextRangeMonth?.formattedDateRangeString)}\n
\n \n {activeMonths.map(month => {\n return (\n view === calendarViews.days\n ? (\n
\n \n );\n}\n\nexport default Calendar;\n","import React, { useRef } from \"react\";\nimport { useDay } from \"@datepicker-react/hooks\";\nimport { useCalendarData } from \"../../utils\";\n\nfunction Day({ day, date, isMatchDay, isCurrentWeek }) {\n const dayRef = useRef(null);\n const {\n focusedDate,\n isDateFocused,\n isDateSelected,\n isDateHovered,\n isDateBlocked,\n isFirstOrLastSelectedDate,\n onDateSelect,\n onDateFocus,\n onDateHover\n } = useCalendarData();\n const {\n isSelected,\n onClick,\n onKeyDown,\n onMouseEnter,\n tabIndex,\n } = useDay({\n date,\n focusedDate,\n isDateFocused,\n isDateSelected,\n isDateHovered,\n isDateBlocked,\n isFirstOrLastSelectedDate,\n onDateFocus,\n onDateSelect,\n onDateHover,\n dayRef,\n });\n\n if (!day) {\n return ;\n }\n\n return (\n \n
\n );\n}\n\nexport default Month;\n","export { default } from './Month';\n","import React, { useMemo } from \"react\";\nimport { subYears, addYears, format, eachMonthOfInterval } from \"date-fns\";\nimport { useCalendarData, getStartAndEndOfYear, calendarViews } from \"../../utils\";\nimport { getCultureLocalizer } from '../../../../utils';\nimport CalendarIcon from \"../../../../svg/CalendarIcon/CalendarIcon\";\nimport { Chevron } from \"../../../../svg\";\nimport { chevronDirection } from \"../../../../svg/Svg\";\n\nimport { useReactAppState } from \"../../../../../shared/containers/utils\";\n\nfunction Months() {\n const { t } = useReactAppState();\n const {\n currentDate,\n onTodaySelect,\n setCurrentDate,\n onDateSelect,\n setView\n } = useCalendarData();\n const toYear = format(currentDate, 'y');\n const currentMonth = format(currentDate, 'MMM', { locale: getCultureLocalizer() });\n const startAndEndOfYear = getStartAndEndOfYear(currentDate);\n const monthsList = eachMonthOfInterval(startAndEndOfYear);\n\n const monthList = useMemo(() => {\n return (\n monthsList.map(month => {\n const formattedMonth = format(month, 'MMM', { locale: getCultureLocalizer() });\n\n return ;\n })\n );\n }, [startAndEndOfYear]);\n\n return (\n \n \n \n \n
\n \n {weekdayLabels.map((dayLabel, index) => {\n return (\n
\n \n {dayLabel}\n
\n );\n })}\n \n {\n days.map((day, index) => {\n const matchDay = day?.date;\n const isMatchDay = isSameMatchDay(items, matchDay);\n const isCurrentWeek = currentRange\n ? isWithinInterval(matchDay, {\n start: dateRangeStart,\n end: dateRangeEnd\n })\n : null;\n\n return
\n \n \n
\n );\n}\n\nexport default Months;\n","export { default } from './Months';\n","import React from \"react\";\nimport { addYears, format, subYears } from \"date-fns\";\nimport { useCalendarData, calendarViews } from \"../../utils\";\nimport CalendarIcon from \"../../../../svg/CalendarIcon/CalendarIcon\";\nimport { Chevron } from \"../../../../svg\";\nimport { chevronDirection } from \"../../../../svg/Svg\";\nimport { useReactAppState } from \"../../../../../shared/containers/utils\";\n\nfunction Years() {\n const {\n setView,\n setCurrentDate,\n currentDate,\n onTodaySelect,\n yearsData,\n onDateSelect,\n } = useCalendarData();\n\n const { t } = useReactAppState();\n const currentYear = format(currentDate, 'y');\n const { yearsRange, yearsLabel } = yearsData || {};\n\n return (\n \n \n \n \n
\n\n \n {monthList}\n
\n \n \n
\n );\n}\n\nexport default Years;\n","export { default } from './Years';\n","export { default } from './Calendar';\n","import { createContext, useContext, useMemo } from \"react\";\nimport { isSameDay, parseISO, startOfYear, endOfYear, subYears, addYears, startOfToday, format } from \"date-fns\";\n\nexport const CalendarContext = createContext();\nCalendarContext.displayName = 'Calendar';\n\nexport function useCalendarData() {\n const context = useContext(CalendarContext);\n if (context === undefined) {\n throw new Error('useCalendarData must be used within a \n \n \n \n
\n\n \n {\n yearsRange\n ? yearsRange.map(year => {\n const formattedYear = format(year, 'y');\n\n return ;\n })\n : null\n }\n
\n \n \n \n {\n displayKey && selectedOption && selectedOption[displayKey]\n ? translateTypes(t, selectedOption[displayKey])\n : translateTypes(t, selectedOption)\n }\n \n
\n \n );\n};\n\nexport default Dropdown;\n","export { default } from './Dropdown';\n","import React from 'react';\nimport { loadingTypes } from \"./utils\";\n\nconst LoadingDisplay = (props) => {\n const { width = \"100\", type = loadingTypes.line, ...otherProps } = props || {};\n\n return ;\n};\n\nexport default LoadingDisplay;\n","export { default } from './LoadingDisplay';\n","export const loadingTypes = {\n line: 'line'\n};\n","import React from \"react\";\nimport Scorebug from \"../Scorebug/Scorebug\";\nimport ClubV2 from \"../ClubV2\";\nimport { StyledEmptyScorebug, StyledMatchTile } from \"./StyledMatchTile\";\n\nfunction MatchTile({\n status,\n homeClubData,\n awayClubData,\n isHomeWinner = false,\n isAwayWinner = false,\n hasFullName = false,\n hasShortName = false,\n hasAbbreviation = false,\n homeScore,\n awayScore,\n homeClubRank = null,\n awayClubRank = null,\n hideScorebug = false,\n abbreviateStatus = false,\n}) {\n return (\n {displayText ? displayText : \"Presented By\"}
\n : null\n }\n {displayText ? displayText : \"Presented By\"}
\n : null\n }\n