{"version":3,"file":"js/scripts_react_mls-horizontal-scoreboard_utils_js.js?_t=815e375ab75ae3497f1b","mappings":";;;;;;;;;;;;;;;;;;AAAA;AACA;AACA;AACA;AAEA;AAAA;AACA;AAEA;AAEA;AAAA;AACA;AACA;AAEA;AACA;AAIA;AAAA;AAGA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAKA;AAIA;;;;;;;;;;;;;;;;;ACnCA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACdA;AACA;AACA;AACA;AAEA;AAAA;AACA;AAEA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAGA;AAAA;AAGA;AAAA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAGA;AACA;AAGA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAAA;AAEA;AAEA;AAAA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAGA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAGA;AACA;AAEA;AACA;AAAA;AAEA;AAAA;AAGA;AACA;AAAA;AAEA;AAAA;AAEA;AAEA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAGA;AAKA;AAEA;AACA;AACA;AAAA;AAGA;AAEA;AAKA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AAGA;AACA;AACA;AAAA;AAEA;AAEA;AACA;AAAA;AACA;AAGA;AAIA;AAGA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAKA;AACA;AACA;AAAA;AACA;AAGA;AACA;AAEA;AACA;AAAA;AAEA;AAEA;AACA;AAAA;AACA;AAEA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AACA;AACA;AAGA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAAA;AAEA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAEA;;;;;;;;;;;;;;;;ACtQA;AAEA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAIA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAGA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AAKA;AAIA;;;;;;;;;;;;;;;;AClCA;AAEA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAIA","sources":["webpack://@mlssoccer/netcore/./scripts/react/mls-horizontal-scoreboard/HorizontalScoreboardNavigator/HorizontalScoreboardNavigator.js","webpack://@mlssoccer/netcore/./scripts/react/mls-horizontal-scoreboard/HorizontalScoreboardNavigator/StyledHorizontalScoreboardNavigator.js","webpack://@mlssoccer/netcore/./scripts/react/mls-horizontal-scoreboard/utils.js","webpack://@mlssoccer/netcore/./scripts/react/shared/svg/LeftArrowIcon/LeftArrowIcon.js","webpack://@mlssoccer/netcore/./scripts/react/shared/svg/RightArrowIcon/RightArrowIcon.js"],"sourcesContent":["import React from \"react\";\nimport { LeftArrowIcon } from \"../../shared/svg/LeftArrowIcon/LeftArrowIcon\";\nimport { RightArrowIcon } from \"../../shared/svg/RightArrowIcon/RightArrowIcon\";\nimport { StyledHorizontalScoreboardNavigator } from \"./StyledHorizontalScoreboardNavigator\";\n\nexport const HorizontalScoreboardNavigatorTypes = {\n  left: \"left\",\n  right: \"right\",\n};\n\nexport const HorizontalScoreboardNavigator = ({\n  innerRef,\n  position = \"\",\n  onClick = () => null,\n}) => {\n  if (\n    position !== HorizontalScoreboardNavigatorTypes.left &&\n    position !== HorizontalScoreboardNavigatorTypes.right\n  ) {\n    return null;\n  }\n\n  return (\n    <StyledHorizontalScoreboardNavigator\n      ref={innerRef}\n      onClick={onClick}\n      className={`mls-c-horizontal-scoreboard__navigator--${position}`}\n    >\n      {position == HorizontalScoreboardNavigatorTypes.right ? (\n        <RightArrowIcon width={5} height={10} maskId=\"horizontal-scoreboard__navigator\"/>\n      ) : (\n        <LeftArrowIcon width={5} height={10} />\n      )}\n    </StyledHorizontalScoreboardNavigator>\n  );\n};\n","import styled from \"styled-components\";\nimport { themeTypes } from \"../../shared/styled/Theme\";\n\nexport const StyledHorizontalScoreboardNavigator = styled.div`\n  width: 40px;\n  height: 40px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 50%;\n  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.16);\n  background: ${(props) =>\n    props.theme.type == themeTypes.light\n      ? props.theme.rgba.white_100\n      : props.theme.rgba.black_33};\n  opacity: 0.9;\n  cursor: pointer;\n  visibility: hidden;\n\n  &.--show {\n    visibility: visible;\n  }\n`;\n","import { HorizontalScoreboardNavigatorTypes } from \"./HorizontalScoreboardNavigator/HorizontalScoreboardNavigator\";\nimport { addDays, format, isValid, parse, subDays } from \"date-fns\";\nimport { enUS } from \"date-fns/locale\";\nimport { getCultureLocalizer } from \"../shared/utils\";\n\nconst datePositionTypes = {\n  from: \"from\",\n  to: \"to\",\n};\n\nconst FULL_SCHEDULE_DEFAULT_WIDTH = 176;\nexport const SCROLL_DEBOUNCE_TIME = 300;\nconst ELEMENT_GAP = 16;\n\nconst getDateOrDefault = (dateString, dateDirectionType = null) => {\n  if (!dateString) {\n    const now = Date.now();\n    const sixDaysAgo = subDays(now, 10);\n    const sixDaysLater = addDays(now, 10);\n    const dateObj =\n      dateDirectionType === datePositionTypes.from\n        ? { date: sixDaysAgo, dateString: format(sixDaysAgo, \"yyyy-MM-dd\") }\n        : {\n          date: sixDaysLater,\n          dateString: format(sixDaysLater, \"yyyy-MM-dd\"),\n        };\n\n    return dateObj;\n  }\n\n  return {\n    date: parse(dateString, \"yyyy-MM-dd\", new Date()),\n    dateString,\n  };\n};\n\nexport const getMatchInitialDate = (dateFrom, dateTo) => {\n  const from = getDateOrDefault(dateFrom, datePositionTypes.from);\n  const to = getDateOrDefault(dateTo, datePositionTypes.to);\n  const formattedDateString =\n    from.dateString === to.dateString\n      ? format(from.date, \"PPPP\", { locale: getCultureLocalizer() })\n      : `${format(from.date, \"PPPP\", {\n        locale: getCultureLocalizer(),\n      })} - ${format(to.date, \"PPPP\", { locale: getCultureLocalizer() })}`;\n\n  return { from: from.dateString, to: to.dateString, formattedDateString };\n};\n\nexport const handleInitialPosition = ({ scoreboardRef }) => {\n  const currentScoreboardRef = scoreboardRef?.current;\n\n  if (currentScoreboardRef) {\n    currentScoreboardRef.scroll({ left: 1920 });\n    currentScoreboardRef.scrollLeft = 1920;\n  }\n};\n\nexport const handleNavigators = ({\n  navigatorLeftRef,\n  navigatorRightRef,\n  scoreboardRef,\n}) => {\n  if (!scoreboardRef?.current) {\n    return;\n  }\n\n  const scoreboard = scoreboardRef?.current;\n\n  const fullScheduleButtonWidth = getScheduleButtonWidth(scoreboard);\n  const leftPosition = scoreboard.scrollLeft;\n  const scrollWidth = scoreboard.scrollWidth;\n  const wrapperWidth = scoreboard.offsetWidth;\n\n  const hideLeftArrow = leftPosition < fullScheduleButtonWidth;\n  const hideRightArrow =\n    leftPosition + ELEMENT_GAP >= scrollWidth - wrapperWidth;\n\n  const currentNavigatorLeftRef = navigatorLeftRef?.current;\n  const currentNavigatorRightRef = navigatorRightRef?.current;\n\n  if (hideLeftArrow) {\n    currentNavigatorLeftRef.classList.remove(\"--show\");\n  } else {\n    currentNavigatorLeftRef.classList.add(\"--show\");\n  }\n\n  if (hideRightArrow) {\n    currentNavigatorRightRef.classList.remove(\"--show\");\n  } else {\n    currentNavigatorRightRef.classList.add(\"--show\");\n  }\n};\n\nexport const moveHorizontalScoreboard = ({\n  e,\n  position,\n  scoreboardRef,\n  navigatorLeftRef,\n  navigatorRightRef,\n}) => {\n  e.preventDefault();\n  const currentRef = scoreboardRef?.current;\n  const currentNavigatorLeftRef = navigatorLeftRef?.current;\n  const currentNavigatorRightRef = navigatorRightRef?.current;\n\n  if (currentRef?.scrollLeft >= 0) {\n    currentNavigatorLeftRef.classList.add(\"--show\");\n  }\n\n  if (\n    (position !== HorizontalScoreboardNavigatorTypes.left &&\n      position !== HorizontalScoreboardNavigatorTypes.right) ||\n    !currentRef\n  )\n    return null;\n\n  if (currentNavigatorLeftRef && currentNavigatorRightRef) {\n    currentNavigatorLeftRef.style.pointerEvents = \"none\";\n    currentNavigatorRightRef.style.pointerEvents = \"none\";\n  }\n\n  const wrapperWidth = currentRef?.offsetWidth;\n\n  const nextLeft =\n    position === HorizontalScoreboardNavigatorTypes.left\n      ? currentRef.scrollLeft - wrapperWidth\n      : currentRef.scrollLeft + wrapperWidth;\n\n  const nextPosition = getNextScrollPosition({\n    currentRef,\n    position,\n    nextLeft,\n  });\n\n  if (nextPosition) {\n    const fullScheduleButtonWidth = getScheduleButtonWidth(currentRef);\n    const left =\n      nextPosition > fullScheduleButtonWidth + ELEMENT_GAP ? nextPosition : 0;\n    currentRef.scroll({\n      left,\n      behavior: \"smooth\",\n    });\n  }\n\n  if (currentNavigatorLeftRef && currentNavigatorRightRef) {\n    currentNavigatorLeftRef.style.pointerEvents = \"auto\";\n    currentNavigatorRightRef.style.pointerEvents = \"auto\";\n  }\n};\n\nfunction getScheduleButtonWidth(currentRef) {\n  const fullScheduleButtons = currentRef.querySelectorAll(\n    \".mls-c-horizontal-scoreboard__full-schedule\"\n  );\n\n  const fullScheduleButton = Array.isArray(fullScheduleButtons)\n    ? fullScheduleButtons[0]\n    : null;\n\n  const fullScheduleButtonWidth =\n    fullScheduleButton?.offsetWidth || FULL_SCHEDULE_DEFAULT_WIDTH;\n\n  return fullScheduleButtonWidth;\n}\n\nfunction getNextScrollPosition({ currentRef, position, nextLeft }) {\n  const elements = currentRef.querySelectorAll(\".mls-c-horizontal-match\");\n  let nextPosition = null;\n\n  for (let index = 0; index < elements.length; index++) {\n    const element = elements[index];\n    const elementLeftPosition =\n      position === HorizontalScoreboardNavigatorTypes.left\n        ? element.offsetLeft\n        : element.offsetLeft + element.offsetWidth;\n\n    if (elementLeftPosition > nextLeft) {\n      nextPosition = element.offsetLeft;\n      break;\n    }\n  }\n\n  return nextPosition;\n}\n\nexport const getDateTranslation = (date, t) => {\n  if (!date || !t) return null;\n\n  const dayObj = new Date(date);\n\n  if (isValid(dayObj)) {\n    const weekdayLabelFormat = format(dayObj, \"cccc\", {\n      locale: getCultureLocalizer(),\n    })?.toLowerCase();\n    const dayLabelFormat = format(dayObj, \"d\");\n    const monthLabelFormat = format(dayObj, \"MMMM\", {\n      locale: getCultureLocalizer(),\n    })?.toLowerCase();\n\n    if (getCultureLocalizer() !== enUS) {\n      return `${t(weekdayLabelFormat)} ${dayLabelFormat} ${t(\n        monthLabelFormat\n      )}`;\n    }\n\n    if (getCultureLocalizer() == enUS) {\n      return `${t(weekdayLabelFormat)} ${t(\n        monthLabelFormat\n      )} ${dayLabelFormat}`;\n    }\n  } else {\n    return date;\n  }\n};\n\nexport function formatStatsAPIMatches(matches) {\n  return matches?.map((match) => {\n    return {\n      ...match,\n      match_information: {\n        ...match,\n        kickoff_time: match?.planned_kickoff_time,\n        competition: formatStatsAPICompetition(match),\n      },\n      home: formatStatsAPIMatch({ match, role: \"home\" }),\n      away: formatStatsAPIMatch({ match, role: \"away\" }),\n      environment: {\n        country: match?.stadium_country,\n        stadium_id: match?.stadium_id,\n        stadium_name: match?.stadium_name,\n        stadium_address: match?.stadium_address,\n        city: match?.stadium_city,\n      }\n    };\n  });\n}\n\nfunction formatStatsAPIMatch({ match, role }) {\n  const isHome = role === \"home\";\n\n  return {\n    team_id: isHome ? match?.home_team_id : match?.away_team_id,\n    team_name: isHome ? match?.home_team_name : match?.away_team_name,\n    role,\n    team_three_letter_code: isHome ? match?.home_team_three_letter_code : match?.away_team_three_letter_code,\n    team_short_name: isHome ? match?.home_team_short_name : match?.away_team_short_name,\n    player_shirt_main_color: isHome ? match?.home_team_shirt_main_color : match?.away_team_shirt_main_color,\n    player_shirt_secondary_color: isHome ? match?.home_team_shirt_secondary_color : match?.away_team_shirt_secondary_color,\n    player_shirt_number_color: isHome ? match?.home_team_shirt_number_color : match?.away_team_shirt_number_color,\n    player_shirt_type: isHome ? match?.home_team_shirt_type : match?.away_team_shirt_type,\n    initial_line_up: isHome ? match?.home_team_initial_line_up : match?.away_team_initial_line_up,\n    latest_line_up: isHome ? match?.home_team_latest_line_up : match?.away_team_latest_line_up,\n  };\n}\n\nfunction formatStatsAPICompetition(match) {\n  return {\n    competition_id: match?.competition_id,\n    competition_name: match?.competition_name,\n    competition_type: match?.competition_type,\n  };\n}","import React from \"react\";\n\nexport const LeftArrowIcon = ({ width, height, extraClasses }) => {\n  return (\n    <span role=\"img\" className={extraClasses}>\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width={width || \"100%\"}\n        height={height || \"100%\"}\n        viewBox=\"0 0 5 10\"\n        fill=\"none\"\n      >\n        <g clipPath=\"url(#clip0_619_4608)\">\n          <mask id=\"path-1-inside-1_619_4608\" fill=\"white\">\n            <path\n              fillRule=\"evenodd\"\n              clipRule=\"evenodd\"\n              d=\"M5.38477 10.0996L0.384766 5.10048L5.38477 0.0996094\"\n            />\n          </mask>\n          <path\n            d=\"M6.09181 9.39244C6.48237 9.78293 6.48242 10.4161 6.09193 10.8067C5.70144 11.1972 5.06828 11.1973 4.67772 10.8068L6.09181 9.39244ZM0.384766 5.10048L-0.32228 5.80764L-1.02945 5.1006L-0.322402 4.39343L0.384766 5.10048ZM4.6776 -0.607436C5.06809 -0.997994 5.70125 -0.998049 6.09181 -0.607559C6.48237 -0.217069 6.48242 0.416097 6.09193 0.806655L4.6776 -0.607436ZM4.67772 10.8068L-0.32228 5.80764L1.09181 4.39331L6.09181 9.39244L4.67772 10.8068ZM-0.322402 4.39343L4.6776 -0.607436L6.09193 0.806655L1.09193 5.80752L-0.322402 4.39343Z\"\n            fill=\"#AAAAAA\"\n            mask=\"url(#path-1-inside-1_619_4608)\"\n          />\n        </g>\n        <defs>\n          <clipPath id=\"clip0_619_4608\">\n            <rect width=\"5\" height=\"10\" fill=\"white\" />\n          </clipPath>\n        </defs>\n      </svg>\n    </span>\n  );\n};\n","import React from \"react\";\n\nexport const RightArrowIcon = ({\n  width,\n  height,\n  extraClasses,\n  maskId = \"path-1-inside-1_584_528\",\n}) => {\n  return (\n    <span role=\"img\" className={extraClasses}>\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width={width || \"100%\"}\n        height={height || \"100%\"}\n        viewBox=\"0 0 5 10\"\n        fill=\"none\"\n      >\n        <mask id={maskId} fill=\"white\">\n          <path\n            fillRule=\"evenodd\"\n            clipRule=\"evenodd\"\n            d=\"M0.384644 0.0999756L5.38464 5.09911L0.384644 10.1\"\n          />\n        </mask>\n        <path\n          d=\"M-0.322402 0.807144C-0.71296 0.416653 -0.713015 -0.216512 -0.322525 -0.60707C0.0679659 -0.997628 0.701131 -0.997683 1.09169 -0.607193L-0.322402 0.807144ZM5.38464 5.09911L6.09169 4.39194L6.79886 5.09899L6.09181 5.80615L5.38464 5.09911ZM1.09181 10.807C0.701321 11.1976 0.0681563 11.1976 -0.322402 10.8071C-0.71296 10.4167 -0.713015 9.78349 -0.322525 9.39293L1.09181 10.807ZM1.09169 -0.607193L6.09169 4.39194L4.6776 5.80628L-0.322402 0.807144L1.09169 -0.607193ZM6.09181 5.80615L1.09181 10.807L-0.322525 9.39293L4.67748 4.39206L6.09181 5.80615Z\"\n          fill=\"#AAAAAA\"\n          mask={`url(#${maskId})`}\n        />\n      </svg>\n    </span>\n  );\n};\n"],"names":[],"sourceRoot":""}