{"version":3,"file":"js/react/mls-match-list-app.js?_t=8238084e3667fa1213ef","mappings":";;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;ACAA;AAEA;AACA;AAEA;AAYA;AAGA;AAEA;;;;;;;;;;;;;;;;;;;;ACtBA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAGA;AAEA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AAWA;AAEA;AAMA;AAUA;AAEA;;;;;;;;;;;;;;;;AChEA;;;;;;;;;;;;;;;;;;;;;;;;ACAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAoBA;AAEA;;;;;;;;;;;;;;;;AC9CA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAAA;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAGA;AACA;AACA;AAMA;AAAA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAGA;AAOA;AACA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAIA;AAKA;AAEA;AAGA;AAGA;AAEA;;;;;;;;;;;;;;;;AC/GA;;;;;;;;;;;;;;;;;;;ACAA;AACA;AACA;AACA;AAEA;AACA;AAMA;AAAA;AAIA;AAEA;;;;;;;;;;;;;;;;;;AClBA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAMA;AAEA;;;;;;;;;;;;;;;;AChBA;;;;;;;;;;;;;;;;;ACAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAGA;AAEA;AAMA;AAEA;;;;;;;;;;;;;;;;ACnBA;;;;;;;;;;;;;;;;;;ACAA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAGA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAEA;AAGA;AAEA;;;;;;;;;;;;;;;;AChCA;;;;;;;;;;;;;;;;;;;;;;ACAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAAA;AACA;AACA;AACA;AAGA;AAiCA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAOA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAOA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAOA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAYA;AAEA;;;;;;;;;;;;;;;;AChHA;;;;;;;;;;;;;;;;;;;;;ACAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAGA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AAEA;AASA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAcA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAkBA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAiBA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAoBA;AAEA;;;;;;;;;;;;;;;;ACtIA;;;;;;;;;;;;;;;;;;;;;ACAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AAGA;AAEA;AAEA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AAAA;AAGA;AAKA;AAEA;;;;;;;;;;;;;;;;;;;;;;;;ACzCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AA2CA;AAEA;AAEA;;;;;;;;;;;;;;;;AC/EA;;;;;;;;;;;;;;;;;;;ACAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAA;AAGA;AACA;AAEA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AAKA;AAEA;AAOA;AAOA;AAEA;;;;;;;;;;;;;;;;ACvDA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACAA;AACA;AACA;AACA;AACA;AAWA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAOA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAGA;AACA;AAEA;AAEA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAEA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAGA;AAEA;AACA;AAAA;AAEA;AAAA;AAEA;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AAGA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAGA;AAAA;AACA;AACA;AAGA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AACA;AACA;AAAA;AACA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAGA;AAEA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAAA;AAGA;AACA;AAAA;AAGA;AAAA;AAGA;AAAA;AAGA;AAAA;AACA;AAGA;AAAA;AAGA;AACA;AACA;AAAA;AACA;AAGA;AACA;AACA;AAAA;AACA;AAGA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AACA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAAA;AACA;AACA;AAGA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAAA;AACA;AAGA;AAEA;AAAA;AAGA;AAEA;AAAA;AACA;AACA;AAGA;AAAA;AACA;AAGA;AAwBA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAMA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AASA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AACA;AAaA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAkBA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAIA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAcA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AACA;AAOA;AAGA;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3hBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA;AAEA;AACA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAEA;AAEA;AAEA;AACA;AACA;AAAA;AACA;AAGA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAAA;AAAA;AAEA;AAAA;AAKA;AAAA;AAAA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAIA;AAOA;AAEA;AAIA;AACA;AAGA;;;;;;;;;;;;;;;;;;;;AC9HA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAmBA;AAAA;AAAA;AAAA;AAAA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA8DA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAaA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;AC9GA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAEA;AAAA;AACA;AAEA;AACA;AAIA;AAGA;AAEA;AAEA;AAAA;AACA;AACA;AACA;AACA;AAGA;AAAA;AACA;AACA;AACA;AAEA;AAEA;;;;;;;;;;;;;;;;;;AClDA;AACA;AAKA;AAGA;AACA;AACA;AAEA;AASA;;;;;;;;;;;;;;;;;;;ACtBA;AAEA;AAAA;AAAA;AAAA;AAKA;AAAA;AACA;AAAA;AAAA;AAGA;AAAA;AAEA;AAAA;AAIA;AAAA;AACA;AAAA;AAAA;AAGA;AAAA;AAEA;AAAA;AAAA;AAKA;AAAA;AACA;AAAA;AAAA;AAGA;AAAA;AAEA;;;;;;;;;;;;;;;;;;;AClCA;AACA;AACA;AAIA;AAGA;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAUA;;;;;;;;;;;;;;;;;;AC1BA;AAEA;AAAA;AAAA;AAAA;AAKA;AAEA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACZA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AAEA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AAEA;AAEA;AACA;AAAA;AAGA;AACA;AAAA;AAGA;AAGA;AAEA;AAEA;AAAA;AAAA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAKA;AAAA;AACA;AAEA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAGA;AAKA;;;;;;;;;;;;;;;;;;ACvFA;AAEA;AAAA;AAAA;AAAA;AAAA;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgFA;AAAA;AAAA;;;;;;;;;;;;;;;;ACxFA;AAEA;AACA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AAGA;AACA;AAEA;;;;;;;;;;;;;;;;;;;;;;;ACfA;AACA;AACA;AACA;AAOA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAEA;AAKA;AAMA;AAAA;AAGA;AACA;AAEA;AAIA;AAUA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAuBA;AAAA;AAAA;AACA;AACA;AAAA;AAIA;AAAA;AAAA;AACA;AACA;AAAA;AAIA;AAAA;AAAA;AACA;AACA;AAAA;AAOA;AAEA;;;;;;;;;;;;;;;;;;;;;ACtHA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA2BA;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AAGA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;AChEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAIA;;;;;;;;;;;;;;;;AC1BA;AAEA;AAAA;AACA;AACA;AAAA;AAEA;AAAA;AAEA;AAAA;AAAA;AAAA;AAIA;AAAA;;;;;;;;;;;;;;;;;;;;;ACZA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAAA;AACA;AACA;AAGA;AAAA;AACA;AACA;AACA;AACA;AAGA;AAAA;AAGA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAAA;AAGA;AAQA;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACxDA;AACA;AACA;AACA;AACA;AAIA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAEA;AACA;AAAA;AACA;AAGA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAKA;AAEA;AAAA;AAGA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAKA;AAEA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AAGA;AACA;AACA;AAAA;AAGA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAGA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AAAA;AACA;AAGA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAGA;AAAA;AAEA;;;;;;;;;;;;;;;;;;;;;;;ACnJA;AACA;AACA;AAGA;AAEA;AACA;AAGA;AAEA;AAEA;AACA;AACA;AAAA;AAGA;AAGA;AACA;AACA;AAAA;AAGA;AAAA;AACA;AACA;AACA;AAGA;AAEA;AAAA;AACA;AACA;AAEA;AAAA;AACA;AACA;AAEA;AAAA;AACA;AACA;AAEA;AAAA;AACA;AACA;AAEA;AAAA;AACA;AACA;AAEA;AAAA;AAGA;AACA;AACA;AACA;AAIA;AAAA;AAGA;AAQA;;;;;;;;;;;;;;;;;;;;;;;AC7EA;AACA;AACA;AACA;AACA;AAKA;AAEA;AACA;AAEA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAAA;AAEA;AAAA;AACA;AAGA;AACA;AAAA;AAGA;AAiBA;AACA;AACA;AAKA;;;;;;;;;;;;;;;;;;;;;;AC/DA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AAGA;AAGA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AACA;AAKA;;;;;;;;;;;;;;;;;;;;;;;;;AChDA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAAA;AACA;AAEA;AACA;AACA;AAGA;AAAA;AAEA;AACA;AACA;AACA;AACA;AAGA;AACA;AAAA;AAGA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGA;;;;;;;;;;;;;;;;ACpEA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACFA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAGA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAAA;AAEA;AAAA;AAGA;AACA;AAEA;AACA;AAEA;AAEA;AACA;AACA;AAEA;AAAA;AACA;AACA;AAGA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AAEA;AAAA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGA;AAGA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAKA;AAGA;AAGA;AAEA;;;;;;;;;;;;;;;;;;ACjIA;AACA;AACA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AAAA;AAGA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAGA;AAEA;;;;;;;;;;;;;;;;ACzDA;;;;;;;;;;;;;;;;;;;;;;;;;;;ACAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAAA;AACA;AAGA;AAEA;AAcA;AAAA;AAAA;AAAA;AAAA;AAGA;AAGA;AAEA;AAKA;AACA;AACA;AACA;AACA;AACA;AAIA;AAAA;AAOA;AAEA;;;;;;;;;;;;;;;;ACpFA;;;;;;;;;;;;;;;;;;;;;;;;;;ACAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAEA;AAAA;AACA;AAIA;AAqBA;AAEA;;;;;;;;;;;;;;;;ACzDA;;;;;;;;;;;;;;;;;;;;;;;;ACAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA;AACA;AACA;AAEA;AAmBA;AAEA;AAAA;AAQA;AAEA;;;;;;;;;;;;;;;;ACrDA;;;;;;;;;;;;;;;;ACAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACAA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAEA;AACA;AACA;AAAA;AAGA;AACA;AAEA;AAAA;AAEA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAGA;AAAA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAGA;AACA;AACA;AAAA;AAGA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AAEA;AAEA;AAAA;AACA;AACA;AAEA;;;;;;;;;;;;;;;;;;;;;ACvEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAGA;AACA;AACA;AAAA;AACA;AAGA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAAA;AACA;AAGA;AACA;AAEA;AACA;AAAA;AAGA;AACA;AAAA;AAGA;AAEA;AACA;AACA;AAAA;AAGA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAIA;AACA;AACA;AAAA;AAAA;AACA;AAGA;AAMA;AAAA;AAEA;AACA;AAGA;AAcA;AAEA;;;;;;;;;;;;;;;;ACrGA;;;;;;;;;;;;;;;;;ACAA;AACA;AAEA;AACA;AAEA;AACA;AAEA;;;;;;;;;;;;;;;;ACTA;;;;;;;;;;;;;;;ACAA;AAAA;AAEA;;;;;;;;;;;;;;;;;;;ACFA;AACA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAGA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAIA;AAGA;AAEA;;;;;;;;;;;;;;;;;;ACzDA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA2BA;AAAA;AAIA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;AClCA;AACA;AACA;AACA;AAEA;AACA;AAEA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAIA;AAEA;AAaA;AAEA;;;;;;;;;;;;;;;;ACnCA;;;;;;;;;;;;;;;;;;ACAA;AAIA;AAEA;AAEA;AACA;AAUA;AAEA;;;;;;;;;;;;;;;;;;ACrBA;AACA;AACA;AAEA;AACA;AACA;AAAA;AAGA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAIA;AAGA;AAEA;;;;;;;;;;;;;;;;ACvBA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAMA;;;;;;;;;;;;;;;;;;ACpBA;AAIA;AAEA;AAEA;AACA;AACA;AAAA;AAGA;AAKA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAIA;AAEA;;;;;;;;;;;;;;;;;;;AC9BA;AAEA;AAAA;AAAA;AAIA;AAAA;AAAA;AAEA;AACA;AACA;AAAA;AAGA;AAGA;AAEA;AAAA;AAAA;;;;;;;;;;;;;;;;;;AClBA;AAEA;AAAA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASA;AAAA;AAAA;AAEA;AAAA;AAEA;AAGA;AAAA;AAAA;AAEA;AAAA;AAEA;;;;;;;;;;;;;;;;;;;ACxBA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA;AAAA;AAAA;AAAA;AAGA;AAAA;AAAA;AAGA;AAEA;AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAaA;AAAA;AAAA;AAAA;AAGA;;;;;;;;;;;;;;;;;;ACpCA;AAIA;AAEA;AAEA;AACA;AAWA;AAEA;;;;;;;;;;;;;;;;;;;ACtBA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAIA;AAEA;;;;;;;;;;;;;;;;;;;;ACvBA;AACA;AACA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAGA;AAAA;AACA;AAEA;AAAA;AACA;AAEA;AACA;AAAA;AAEA;AAAA;AACA;AAEA;AACA;AAAA;AAGA;AAEA;AACA;AACA;AAAA;AACA;AAEA;AAAA;AACA;AAEA;AACA;AAAA;AAEA;AAAA;AACA;AAEA;AAIA;AAAA;AACA;AAEA;AAAA;AACA;AAEA;AACA;AAAA;AAEA;AAAA;AACA;AAEA;AACA;AAAA;AAEA;AAAA;AACA;AAEA;AACA;AAAA;AAEA;AAAA;AACA;AAEA;AACA;AAAA;AAEA;AAAA;AACA;AAEA;AACA;AAAA;AAEA;AAAA;AACA;AAEA;AACA;AAAA;AAEA;AAAA;AACA;AAEA;AAAA;AACA;AAEA;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AACA;AAAA;AAEA;AAAA;AAGA;AAAA;AACA;AACA;AAEA;AAAA;AACA;AAEA;AAAA;AACA;AAEA;AAAA;AACA;AAEA;AAAA;AACA;AAEA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AAEA;AACA;AACA;AAAA;AAGA;AACA;AAAA;AAGA;AACA;AAAA;AAGA;AACA;AAAA;AAGA;AACA;AAAA;AAGA;AACA;AAAA;AACA;AAGA;AAAA;AAGA;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;;;;;;;;;;;;;;;;;;;;AC9MA;AACA;AACA;AAEA;AACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASA;AAEA;AAAA;AAEA;AACA;AAKA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AAEA;AAAA;AAAA;AACA;AACA;AAGA;AAAA;AAIA;AAEA;AAGA;AAEA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;;;;;;;;;;;;;;;;ACxEA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AAGA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAEA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AACA;AAGA;AAGA;AAEA;;;;;;;;;;;;;;;;AC3BA;;;;;;;;;;;;;;;;ACAA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAIA;AAAA;AAAA;AACA;AACA;AAAA;AAWA;AAAA;AAAA;AACA;AACA;AAAA;AAGA;AAGA;AAEA;;;;;;;;;;;;;;;;AClCA;AAEA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAAA;AAQA;AAGA;AAEA;;;;;;;;;;;;;;;;ACpBA;;;;;;;;;;;;;;;;ACAA;AAEA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AACA;AAIA;;;;;;;;;;;;;;;;ACrBA;AAEA;AACA;AAEA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AACA;AAAA;AAAA;AACA;AACA;AAAA;AACA;AAIA","sources":["webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/app.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/BettingLines/BettingLines.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/Broadcasters/Broadcasters.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/Broadcasters/index.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/Match/Match.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/Match/index.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/MatchGroup/MatchGroup.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/MatchGroup/index.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/MatchGroup/loader.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/MatchHeader/MatchHeader.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/MatchHeader/index.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/MatchInfo/MatchInfo.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/MatchInfo/index.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/MatchLink/MatchLink.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/MatchLink/index.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/MatchPromo/MatchPromo.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/MatchPromo/index.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/MatchPromoGroup/MatchPromoGroup.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/MatchPromoGroup/index.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/MatchShootout/MatchShootout.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/Odds/Odds.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/Odds/index.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/TvStreaming/TvStreaming.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/components/TvStreaming/index.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/main.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/Match/Match.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/Match/StyledMatch.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/Match/useShootoutScore.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchInfo/MatchInfo.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchInfo/StyledMatchInfo.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchListHeader/MatchListHeader.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchListHeader/StyledMatchListHeader.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchListWrapper/MatchListWrapper.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchListWrapper/StyledMatchListWrapper.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchListWrapper/useMatchListScroll.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchPromo/MatchPromo.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchPromo/StyledMatchListPromo.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchTime/MatchTime.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchTime/StyledMatchTime.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchWatch/MatchHotelBook.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchWatch/MatchWatch.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchWatch/MatchWatchPost.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchWatch/MatchWatchPre.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchWrapper/MatchFragmentWrapper.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchWrapper/MatchWrapper.js","webpack://@mlssoccer/netcore/./scripts/react/mls-match-list/v2/MatchWrapper/StyledMatchWrapper.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/Calendar/Calendar.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/Calendar/components/Day/Day.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/Calendar/components/Day/index.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/Calendar/components/Month/Month.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/Calendar/components/Month/index.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/Calendar/components/Months/Months.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/Calendar/components/Months/index.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/Calendar/components/Years/Years.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/Calendar/components/Years/index.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/Calendar/index.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/Calendar/utils.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/Dropdown/Dropdown.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/Dropdown/index.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/LoadingDisplay/LoadingDisplay.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/LoadingDisplay/index.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/LoadingDisplay/utils.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/MatchTile/MatchTile.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/MatchTile/StyledMatchTile.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/Sponsor/Sponsor.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/Sponsor/index.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/SponsorV2/MatchPromo/MatchPromo.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/SponsorV2/MatchPromo/MatchPromoButton/MatchPromoButton.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/SponsorV2/MatchPromo/MatchPromoButton/StyledMatchPromoButton.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/SponsorV2/MatchPromo/MatchPromoLink/MatchPromoLink.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/SponsorV2/MatchPromo/MatchPromoLink/StyledMatchPromoLink.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/SponsorV2/MatchPromo/StyledMatchPromo.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/SponsorV2/SupportCopyCompact/StyledSupportCopyCompact.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/SponsorV2/SupportCopyCompact/SupportCopyCompact.js","webpack://@mlssoccer/netcore/./scripts/react/shared/components/SponsorV2/SupportCopyCompact/SupportCopyLogo.js","webpack://@mlssoccer/netcore/./scripts/react/shared/hooks/useFilters.js","webpack://@mlssoccer/netcore/./scripts/react/shared/hooks/useModal.js","webpack://@mlssoccer/netcore/./scripts/react/shared/svg/BroadcastIcon/BroadcastIcon.js","webpack://@mlssoccer/netcore/./scripts/react/shared/svg/BroadcastIcon/index.js","webpack://@mlssoccer/netcore/./scripts/react/shared/svg/CalendarIcon/CalendarIcon.js","webpack://@mlssoccer/netcore/./scripts/react/shared/svg/ExternalLinkIcon/ExternalLinkIcon.js","webpack://@mlssoccer/netcore/./scripts/react/shared/svg/ExternalLinkIcon/index.js","webpack://@mlssoccer/netcore/./scripts/react/shared/svg/TVIcon/TVIcon.js","webpack://@mlssoccer/netcore/./scripts/react/shared/svg/TicketIconV2/TicketIconV2.js"],"sourcesContent":["export { default } from './main';\n","import React from 'react';\n\nfunction BettingLines({ label, line, hasOutline = true }) {\n const hasOutlineClass = hasOutline ? \"mls-o-odds__line--outline\" : \"mls-o-odds__line--no-outline\";\n\n return (\n <div className={`mls-o-odds__line ${hasOutlineClass}`}>\n <div className=\"mls-o-odds__label\">\n {label}\n </div>\n <div className={`mls-o-odds__line-container`}>\n <div className=\"mls-o-odds__line-value\">\n {line}\n </div>\n </div>\n </div>\n );\n}\n\n// eslint-disable-next-line no-func-assign\nBettingLines = React.memo(BettingLines);\n\nexport default BettingLines;\n","import React from 'react';\nimport BroadcastIcon from \"../../../shared/svg/BroadcastIcon\";\nimport { listTypes, statusTypes, useMatchData } from \"../../utils\";\nimport { composeGeoLocatedProviders } from \"../../../shared/utils\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\n\nconst Broadcasters = () => {\n const { location } = useReactAppState();\n const { mediaProviders, listType, status } = useMatchData();\n if (listType !== listTypes.matches) {\n return null;\n }\n\n const { country } = location || {};\n\n const { homeLinear, awayLinear, homeStreaming, awayStreaming, clubLinear, clubStreaming, clubRadio } = mediaProviders || {};\n\n const { national, streaming, radio } = composeGeoLocatedProviders(mediaProviders, country);\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 = status?.abbreviation !== statusTypes.post && mergedProviders && mergedProviders.length > 0;\n\n return (\n <div className=\"mls-o-match-strip__broadcaster-list\">\n {\n showBroadcasters\n ? (\n <>\n <span className=\"mls-o-match-strip__broadcaster-icon\">\n <BroadcastIcon size=\"x-small\" />\n </span>\n {\n mergedProviders.map((provider, index) => {\n const { broadcasterName } = provider || {};\n\n return (\n broadcasterName != null\n ? (\n <span key={`${broadcasterName}-${index}`} className=\"mls-o-match-strip__broadcaster\">\n {`${broadcasterName}${index < mergedProviders.length - 1 ? \",\" : \"\"}`}\n </span>\n ) : null\n );\n })\n }\n </>\n )\n : null\n }\n </div>\n );\n};\n\nexport default Broadcasters;\n","export { default } from './Broadcasters';\n","import React from 'react';\nimport ClubSeparator from \"../ClubSeparator\";\nimport Club from '../Club';\nimport Broadcasters from \"../Broadcasters\";\nimport MatchTime from \"../MatchTime\";\nimport MatchWatch from \"../MatchWatch\";\nimport { useMatchData, formatScores, listTypes } from \"../../utils\";\nimport { trackMatchInteraction } from '../../../../libraries/_modules/tracking/helpers';\nimport MatchShootout from \"../MatchShootout/MatchShootout\";\n\nconst Match = ({ includeMatchWatch = false, includeBroadcasters = false, isFullDate = false, includeTitle = false, position }) => {\n const { homeClubData, awayClubData, listType, references, status, leagueMatchTitle, competition, winnerStatus, period, resultType } = useMatchData();\n\n const { name: competitionName } = competition || {};\n const title = leagueMatchTitle ? leagueMatchTitle : competitionName;\n\n const { homeScore, awayScore } = formatScores({\n homeClubData,\n awayClubData,\n period,\n resultType\n });\n const { isHomeWinner, isAwayWinner } = winnerStatus || {};\n\n return (\n <>\n <div className=\"mls-o-match-strip__match\">\n <div className=\"mls-o-match-strip__club-group\">\n {\n title && includeTitle\n ? <p className=\"mls-o-match-strip__match-title\">{title}</p>\n : null\n }\n <MatchTime isFullDate={isFullDate} />\n <Club isWinner={isHomeWinner} clubData={homeClubData} isHome />\n <ClubSeparator homeScore={homeScore} awayScore={awayScore} status={status} />\n <Club isWinner={isAwayWinner} clubData={awayClubData} isHome={false} />\n {includeMatchWatch ? <MatchWatch position={position} /> : null}\n {listType === listTypes.tv ? null : <MatchShootout />}\n </div>\n </div>\n {includeBroadcasters ? <Broadcasters references={references} listType={listType} /> : null}\n </>\n );\n};\n\nexport default Match;\n","export { default } from './Match';\n","import React, { useRef } from 'react';\nimport MatchStrip from \"../MatchStrip\";\nimport Match from \"../Match\";\nimport MatchInfo from \"../MatchInfo\";\nimport Broadcasters from \"../Broadcasters\";\nimport TvStreaming from \"../TvStreaming\";\nimport MatchWatch from \"../MatchWatch\";\nimport MatchLink from \"../MatchLink\";\nimport Odds from \"../Odds\";\nimport MatchHeader from \"../MatchHeader\";\nimport { listTypes, useMatchList } from \"../../utils\";\nimport MatchPromoGroup from \"../MatchPromoGroup\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\nimport { trackMatchInteraction } from '../../../../libraries/_modules/tracking/helpers';\n\nfunction MatchGroup({ matchList, listType, dateRangeType, weekRange, hideMatchPromos, showSecondaryTeams = false, betMgmCompetitionIds = null }) {\n const { mediaQueries, urlList, directoryList } = useReactAppState();\n const { baseUrl } = urlList || {};\n const { matchHubDir } = directoryList || {};\n const { isMediumLargeMin } = mediaQueries || {};\n const matchPosition = useRef(0);\n\n const formattedMatchList = useMatchList({ matchList, dateRangeType, weekRange });\n\n if (formattedMatchList == null) {\n return null;\n }\n\n const handleClick = (e, position, slug, status, competitionSlug) => {\n trackMatchInteraction({\n clickType: 'match',\n clickItem: 'match-unit',\n clickPosition: position,\n match: slug,\n matchState: status?.abbreviation,\n competition: competitionSlug,\n });\n e.stopPropagation();\n };\n\n return (\n formattedMatchList.map((matchGroup, i) => {\n return (\n <div key={`${matchGroup.date}-${i}`} className=\"mls-c-schedule__match-group\">\n <MatchHeader matchDate={matchGroup.date} dateRangeType={dateRangeType} showTimeZone={i === 0} />\n {\n matchGroup.matches && matchGroup.matches.length > 0\n ? matchGroup.matches.map((match, j) => {\n if (i === 0 && j === 0) matchPosition.current = 0;\n matchPosition.current++;\n\n const { optaId, competition, season, slug } = match || {};\n const { optaId: seasonOptaId } = season || {};\n const { slug: competitionSlug } = competition || {};\n\n const matchPageUrl = `${baseUrl}/${matchHubDir}/${competitionSlug}/${seasonOptaId}/matches/${slug}`;\n const position = matchPosition.current;\n return (\n <React.Fragment key={`${optaId}-${i}-${j}`}>\n {\n isMediumLargeMin\n ? (\n <MatchStrip\n showSecondaryTeams={showSecondaryTeams}\n matchPageUrl={matchPageUrl}\n listType={listType}\n match={match} >\n {match?.optaId > 0 ? <MatchLink matchOptaId={match.optaId} matchPageUrl={matchPageUrl} position={position} slug={slug} competitionSlug={competitionSlug} /> : null}\n <div className=\"mls-o-match-strip__left-side\">\n <Match isFullDate includeTitle={listType === listTypes.tv} position={position} />\n </div>\n <div className=\"mls-o-match-strip__right-side\">\n <MatchInfo />\n <TvStreaming />\n <Broadcasters />\n <MatchWatch position={position} />\n <Odds betMgmCompetitionIds={betMgmCompetitionIds} />\n </div>\n {hideMatchPromos ? null : <MatchPromoGroup />}\n\n </MatchStrip>\n )\n : (\n <MatchStrip\n showSecondaryTeams={showSecondaryTeams}\n listType={listType}\n match={match}\n >\n {match?.optaId > 0 ? < MatchLink matchOptaId={match.optaId} matchPageUrl={matchPageUrl} position={position} slug={slug} competitionSlug={competitionSlug} /> : null}\n <Match isFullDate includeTitle includeMatchWatch includeBroadcasters position={position} />\n <TvStreaming />\n <Odds betMgmCompetitionIds={betMgmCompetitionIds} />\n {hideMatchPromos ? null : <MatchPromoGroup />}\n </MatchStrip>\n )\n }\n </React.Fragment>\n );\n })\n : null\n }\n </div>\n );\n }\n )\n );\n}\n\n// eslint-disable-next-line no-func-assign\nMatchGroup = React.memo(MatchGroup);\n\nexport default MatchGroup;\n","export { default } from './MatchGroup';\n","import React from \"react\";\nimport Picture from \"../../../shared/components/Picture\";\nimport LoadingDisplay from \"../../../shared/components/LoadingDisplay\";\nimport MatchStripLoader from \"../MatchStrip/loader\";\n\nfunction MatchGroupLoader({ stripCount = 1, isMediumLargeMin }) {\n return (\n <div className=\"mls-c-schedule__match-group\">\n <div className=\"mls-c-schedule__match-header\">\n <LoadingDisplay width=\"10\" />\n </div>\n {[...Array(stripCount)].map((loader, index) => {\n return <MatchStripLoader key={`${loader}-${index}`} />;\n })}\n </div>\n );\n}\n\nexport default MatchGroupLoader;\n","import React from 'react';\nimport { useDateDisplay } from \"../../utils\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\n\nconst MatchHeader = ({ matchDate, dateRangeType, showTimeZone = false }) => {\n const { t } = useReactAppState();\n const dateDisplay = useDateDisplay(matchDate, dateRangeType);\n\n return (\n <div className={\"mls-c-schedule__match-header\"}>\n <span className={\"mls-c-schedule__date-display\"}>{dateDisplay}</span>\n {showTimeZone ? <span className={\"mls-c-schedule__time-zone\"}>{t(\"match_schedule_timezone\")}</span> : null}\n </div>\n );\n};\n\nexport default MatchHeader;\n","export { default } from './MatchHeader';\n","import React from 'react';\nimport { listTypes, useMatchData } from \"../../utils\";\n\nconst MatchInfo = () => {\n const { listType, venue, leagueMatchTitle, competition } = useMatchData();\n if (listType !== listTypes.matches) {\n return null;\n }\n\n const { name } = venue || {};\n\n return (\n <div className=\"mls-o-match-strip__match-info\">\n <p className=\"mls-o-match-strip__match-title\">{leagueMatchTitle ? leagueMatchTitle : competition?.name}</p>\n <p className=\"mls-o-match-strip__venue\">{name}</p>\n </div>\n );\n};\n\nexport default MatchInfo;\n","export { default } from './MatchInfo';\n","import React, { useRef } from 'react';\nimport { trackMatchInteraction } from '../../../../libraries/_modules/tracking/helpers';\nimport { useMatchStatus } from \"../../../shared/hooks/useMatchStatus\";\n\nfunction MatchLink({ matchOptaId, matchPageUrl, position, slug, competitionSlug }) {\n const { status } = useMatchStatus({\n initialState: {\n matchOptaId\n }\n });\n\n const handleClick = (e, position, slug, status, competitionSlug) => {\n trackMatchInteraction({\n clickType: 'match',\n clickItem: 'match-unit',\n clickPosition: position,\n match: slug,\n matchState: status?.abbreviation,\n competition: competitionSlug,\n });\n e.stopPropagation();\n };\n\n return (\n <a href={matchPageUrl} className=\"mls-o-match-strip__matchhub-link\"\n onClick={e => { handleClick(e, position, slug, status, competitionSlug); }} />\n );\n}\n\n// eslint-disable-next-line no-func-assign\nMatchLink = React.memo(MatchLink);\n\nexport default MatchLink;\n","export { default } from './MatchLink';\n","import React from 'react';\nimport ReactMarkdown from \"react-markdown\";\nimport { useMatchData } from \"../../utils\";\nimport { Chevron } from \"../../../shared/svg\";\nimport ToggleButton from \"../../../shared/components/ToggleButton\";\nimport { chevronDirection } from \"../../../shared/svg/Svg\";\n\nconst MatchPromo = () => {\n const { promoInfo } = useMatchData();\n\n const {\n matchPromo,\n promotionalMisc1,\n promotionalMisc2\n } = promoInfo;\n\n return (\n matchPromo\n ? (\n <div className=\"mls-o-match-strip__promo-wrapper\">\n {\n matchPromo?.headline || matchPromo?.description\n ? (\n <div className=\"mls-o-match-strip__promo\">\n {\n matchPromo?.headline\n ? <div className=\"mls-o-match-strip__promo-headline\">{matchPromo.headline}</div>\n : null\n }\n {\n matchPromo?.description\n ? (\n <div className=\"mls-o-match-strip__promo-description\">\n <ReactMarkdown source={matchPromo.description} />\n </div>\n )\n : null\n }\n </div>\n )\n : null\n }\n {\n matchPromo?.callToAction1 || matchPromo?.callToAction2 || promotionalMisc1?.displayText !== \"\" || promotionalMisc2.displayText !== \"\"\n ? (\n <div className=\"mls-o-match-strip__promo-cta-group\">\n {\n matchPromo?.callToAction1?.displayText && matchPromo?.callToAction1?.url && matchPromo?.callToAction1?.url !== \"\" ?\n (\n <ToggleButton\n target={`${matchPromo?.callToAction1?.openInNewTab ? \"_blank\" : \"_self\"}`}\n rel={`${matchPromo?.callToAction1?.openInNewTab ? \"noopener noreferrer\" : \"\"}`}\n alt={`${matchPromo?.callToAction1?.accessibleText ? matchPromo?.callToAction1?.accessibleText : \"\"}`}\n href={`${matchPromo?.callToAction1?.url ? matchPromo?.callToAction1?.url : \"#\"}`}\n className=\"mls-o-buttons__icon mls-o-buttons__icon--right\">\n {matchPromo?.callToAction1?.displayText}\n <Chevron direction={chevronDirection.right} />\n </ToggleButton>\n ) : null\n }\n {\n matchPromo?.callToAction2?.displayText && matchPromo?.callToAction2?.url && matchPromo?.callToAction2?.url !== \"\" ?\n (\n <ToggleButton\n target={`${matchPromo?.callToAction2?.openInNewTab ? \"_blank\" : \"_self\"}`}\n rel={`${matchPromo?.callToAction2?.openInNewTab ? \"noopener noreferrer\" : \"\"}`}\n alt={`${matchPromo?.callToAction2?.accessibleText ? matchPromo?.callToAction2?.accessibleText : \"\"}`}\n href={`${matchPromo?.callToAction2?.url ? matchPromo?.callToAction2?.url : \"#\"}`}\n className=\"mls-o-buttons__icon mls-o-buttons__icon--right\">\n {matchPromo?.callToAction2?.displayText}\n <Chevron direction={chevronDirection.right} />\n </ToggleButton>\n ) : null\n }\n {\n promotionalMisc1?.displayText ?\n (\n <ToggleButton\n target={`${promotionalMisc1?.openInNewTab ? \"_blank\" : \"_self\"}`}\n rel={`${promotionalMisc1?.openInNewTab ? \"noopener noreferrer\" : \"\"}`}\n alt={`${promotionalMisc1?.accessibleText ? promotionalMisc1?.accessibleText : \"\"}`}\n href={`${promotionalMisc1?.url ? promotionalMisc1?.url : \"#\"}`}\n className=\"mls-o-buttons__icon mls-o-buttons__icon--right\">\n {promotionalMisc1?.displayText}\n <Chevron direction={chevronDirection.right} />\n </ToggleButton>\n ) : null\n }\n {\n promotionalMisc2?.displayText ?\n (\n <ToggleButton\n target={`${promotionalMisc2?.openInNewTab ? \"_blank\" : \"_self\"}`}\n rel={`${promotionalMisc2?.openInNewTab ? \"noopener noreferrer\" : \"\"}`}\n alt={`${promotionalMisc2?.accessibleText ? promotionalMisc2?.accessibleText : \"\"}`}\n href={`${promotionalMisc2?.url ? promotionalMisc2?.url : \"#\"}`}\n className=\"mls-o-buttons__icon mls-o-buttons__icon--right\">\n {promotionalMisc2?.displayText}\n <Chevron direction={chevronDirection.right} />\n </ToggleButton>\n ) : null\n }\n </div>\n )\n : null\n }\n </div>\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 <div className={`mls-o-match-strip__footer ${!matchPromo ? \"mls-o-match-strip__footer--no-match-promo\" : \"\"} ${!noPromos ? \"mls-o-match-strip__footer--visible-promos\" : \"\"}`}>\n <MatchPromo />\n {\n promotionalStay || promotionalRide || promotionalFly || promotionalSponsor\n ? (\n <div className=\"mls-o-match-strip__sponsors\">\n {\n (promoSponsor)\n ? <Sponsor\n hasPresBy\n templateUrl={assetUrl}\n url={promotionalSponsor?.url}\n accessibleText={promotionalSponsor?.accessibleText}\n displayText={promotionalSponsor?.displayText}\n openInNewTab={promotionalSponsor?.openInNewTab}\n />\n : null\n }\n {\n promotionalStay || promotionalRide || promotionalFly\n ? (\n <div className=\"mls-o-match-strip__promo-links\">\n {\n (promoStay)\n ? (\n <div className=\"mls-o-match-strip__promo-stay\">\n <span className=\"mls-o-match-strip__promo-label\">{t(\"match_promo_hotel\")}</span>\n {(promotionalStay?.url) ? (\n <ToggleButton\n target={`${promotionalStay?.openInNewTab ? \"_blank\" : \"_self\"}`}\n rel={`${promotionalStay?.openInNewTab ? \"noopener noreferrer\" : \"\"}`}\n alt={`${promotionalStay?.accessibleText ? promotionalStay?.accessibleText : \"\"}`}\n href={promotionalStay?.url}\n className=\"mls-o-match-strip__promo-link\">\n {promotionalStay?.displayText}\n </ToggleButton>\n )\n :\n (<span className=\"mls-o-match-strip__promo-link\">\n {promotionalStay?.displayText}\n </span>)\n }\n </div>\n )\n : null\n }\n {\n (promoFly)\n ? (\n <div className=\"mls-o-match-strip__promo-stay\">\n <span className=\"mls-o-match-strip__promo-label\">{t(\"match_promo_fly\")}</span>\n {(promotionalFly?.url) ? (\n <ToggleButton\n target={`${promotionalFly?.openInNewTab ? \"_blank\" : \"_self\"}`}\n rel={`${promotionalFly?.openInNewTab ? \"noopener noreferrer\" : \"\"}`}\n alt={`${promotionalFly?.accessibleText ? promotionalFly?.accessibleText : \"\"}`}\n href={promotionalFly?.url}\n className=\"mls-o-match-strip__promo-link\">\n {promotionalFly?.displayText}\n </ToggleButton>)\n :\n (<span className=\"mls-o-match-strip__promo-link\">\n {promotionalFly?.displayText}\n </span>)\n }\n </div>\n )\n : null\n }\n {\n (promoRide)\n ? (\n <div className=\"mls-o-match-strip__promo-stay\">\n <span className=\"mls-o-match-strip__promo-label\">{t(\"match_promo_travel\")}</span>\n {(promotionalRide?.url) ? (\n <ToggleButton\n target={`${promotionalRide?.openInNewTab ? \"_blank\" : \"_self\"}`}\n rel={`${promotionalRide?.openInNewTab ? \"noopener noreferrer\" : \"\"}`}\n alt={`${promotionalRide?.accessibleText ? promotionalRide?.accessibleText : \"\"}`}\n href={promotionalRide?.url}\n className=\"mls-o-match-strip__promo-link\">\n {promotionalRide?.displayText}\n </ToggleButton>)\n :\n (<span className=\"mls-o-match-strip__promo-link\">\n {promotionalRide?.displayText}\n </span>)\n }\n </div>\n )\n : null\n }\n </div>\n )\n : null\n }\n </div>\n ) : null\n }\n </div>\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 ? <div className=\"mls-o-match-strip__shootout-description\">{composedAggregate || shootoutResult}</div>\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 <div className=\"mls-o-match-strip__odds mls-o-odds\">\n {\n status?.abbreviation === statusTypes.pre && Object.keys(regularMatchResults)?.length\n ? (\n <>\n <div className=\"mls-o-odds__group\">\n {\n homeClubData?.abbreviation\n ? <BettingLines label={homeClubData.abbreviation} line={regularMatchResults?.homePrice} />\n : null\n }\n <BettingLines label={t(\"tie\")} line={regularMatchResults?.tiePrice} />\n {\n awayClubData?.abbreviation\n ? <BettingLines label={awayClubData.abbreviation} line={regularMatchResults?.awayPrice} />\n : null\n }\n </div>\n {\n isMediumLargeMin\n ? (\n <div className=\"mls-o-odds__group\">\n <BettingLines label={t(\"goals\")} line={regularMatchResults?.totalGoals} hasOutline={false} />\n <BettingLines label={t(\"over\")} line={regularMatchResults?.overPrice} />\n <BettingLines label={t(\"under\")} line={regularMatchResults?.underPrice} />\n </div>\n )\n : null\n }\n <ToggleButton href={betMgmUrl ? betMgmUrl : null} target=\"_blank\" rel=\"noreferrer\" className=\"mls-o-odds__link\">\n <div className=\"mls-o-odds__link-info\">\n <div className=\"mls-o-odds__link-title\">{t(\"match_bet_now\")}</div>\n <div className=\"mls-o-odds__link-description\">{t(\"match_bet_mgm\")}</div>\n </div>\n <div className=\"mls-o-odds__icon\"><ExternalLinkIcon size={\"x-small\"} /></div>\n </ToggleButton>\n </>\n )\n : null\n }\n </div>\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 <ul className=\"mls-o-match-strip__tv-streaming-provider-list\">\n {\n showBroadcasters\n ? mergedProviders.map((provider, index) => {\n const { broadcasterName, broadcasterTypeLabel } = provider || {};\n\n return (\n broadcasterName != null && broadcasterTypeLabel != null\n ? (\n <li key={`${provider}-${index}`} className=\"mls-o-match-strip__tv-streaming-provider-item\">\n <span className=\"mls-o-match-strip__tv-streaming-provider-label\">{provider.broadcasterTypeLabel}</span>\n <span className=\"mls-o-match-strip__tv-streaming-provider\">{provider.broadcasterName}</span>\n </li>\n ) : null\n );\n })\n : null\n }\n </ul>\n );\n};\n\nexport default TvStreaming;\n","export { default } from './TvStreaming';\n","import React, { useEffect, useRef, useState } from 'react';\nimport { useQuery } from 'react-query';\nimport { fetchClient } from '../shared/api/fetching';\nimport ErrorDisplay from \"../shared/components/ErrorDisplay\";\nimport LoadingDisplay from \"../shared/components/LoadingDisplay\";\nimport {\n dateRangeTypes,\n listTypes,\n orderEnrichedMatchesByDate,\n getYear,\n composeMatchStatus,\n statusTypes,\n composeDateRangeStartAndEnd,\n getPhaseTypeFromSlug,\n useHash,\n getHashQueryObject\n} from \"./utils\";\nimport useModal from \"../shared/hooks/useModal\";\nimport ToggleButton from \"../shared/components/ToggleButton\";\nimport { Chevron } from \"../shared/svg\";\nimport MatchGroup from \"./components/MatchGroup\";\nimport Dropdown from \"../shared/components/Dropdown\";\nimport CalendarIcon from \"../shared/svg/CalendarIcon/CalendarIcon\";\nimport { d3ClubsAPI, d3DateRangeAPI, d3NextMatchAPI } from \"../shared/api/variables\";\nimport {\n directionTypes,\n filterTypes,\n mlsPhaseTypes,\n getClubsData,\n getForgeCompetitionsOptaId,\n formatForgeAllClubsData,\n} from \"../shared/utils\";\nimport { actionTypes, useFilters } from \"../shared/hooks/useFilters\";\nimport Calendar from \"../shared/components/Calendar\";\nimport { chevronDirection, NoResults } from \"../shared/svg/Svg\";\nimport { useReactAppState } from \"../shared/containers/utils\";\nimport { trackEvent, trackWeekSelector } from '../../libraries/_modules/tracking/helpers';\nimport MatchGroupLoader from \"./components/MatchGroup/loader\";\nimport { format, formatISO } from \"date-fns\";\nimport dayjs from 'dayjs';\nimport { MatchListWrapper } from './v2/MatchListWrapper/MatchListWrapper';\nimport { ThemeProvider } from 'styled-components';\nimport { Theme, themeTypes } from '../shared/styled/Theme';\n\nfunction MatchList({ options }) {\n const { mediaQueries, t, queryParams, apiList, urlList } = useReactAppState();\n const {\n d3SportsAPI\n } = apiList || {};\n\n const [hashQuery, setHashQuery] = useHash();\n const [hashes, setHashes] = useState([]);\n\n const { calendarUrl } = urlList || {};\n\n const { isMediumLargeMin } = mediaQueries || {};\n\n const {\n competitionSlug: queryCompetitionSlug,\n clubOptaId: queryClubOptaId,\n competitionOptaId: queryCompetitionOptaId,\n clubAbbreviation: queryClubAbbreviation,\n season: querySeason,\n } = queryParams || {};\n\n const [hideClubsDropdown] = useState(options.hideClubsDropdown);\n const [orderedMatchesLite, setOrderedMatchesLite] = useState([]);\n const [hideCompetitionsDropdown] = useState(options.hideCompetitionsDropdown);\n const [forgeCompetitions] = useState(getForgeCompetitionsOptaId(options.competitions, true));\n const [allClubs] = useState(formatForgeAllClubsData(options.allClubs));\n\n const initialCompetitionSlug = queryCompetitionSlug?.[0] || options.competitionSlug || forgeCompetitions?.[0]?.slug;\n\n const { state, updateFilter } = useFilters({\n initialState: {\n mlsPhaseType: options.mlsPhaseType || getPhaseTypeFromSlug(forgeCompetitions, initialCompetitionSlug) || mlsPhaseTypes.regular,\n competitions: forgeCompetitions,\n competitionSlug: initialCompetitionSlug,\n competitionOptaId: queryCompetitionOptaId?.[0] || options.competitionOptaId || filterTypes.allCompetitions,\n club: queryClubAbbreviation?.[0] || options.clubAbbreviation || filterTypes.allClubs,\n clubOptaId: queryClubOptaId?.[0] || options.clubOptaId || filterTypes.allClubs,\n clubs: allClubs,\n season: querySeason?.[0] || options.season,\n listType: options.listType || listTypes.matches\n }\n });\n\n const headerRef = useRef(null);\n const calendarRef = useRef(null);\n const { competitionOptaId, season, listType, mlsPhaseType, competitionSlug, competitions, clubs, clubOptaId } = state || {};\n const scheduleTypeClass = `mls-c-schedule--${listType}`;\n const vsmDateRangeType = options?.dateRangeType || dateRangeTypes.week;\n\n const [dateRangeType, setDateRangeType] = useState(options?.dateRangeType || dateRangeTypes.week);\n const [nextRange, setNextRange] = useState(null);\n const [prevRange, setPrevRange] = useState(null);\n const [firstForce, setFirstForce] = useState(options?.forceWeekly);\n\n const [preSelectedClub] = useState(!!(options.clubOptaId));\n const [hideMatchPromos] = useState(options.hideMatchPromos);\n const [refetchInterval, setRefetchInterval] = useState(null);\n const [currentRange, setCurrentRange] = useState(null);\n const [currentDatePoint, setCurrentDatePoint] = useState(() => Date.now());\n const [currentYear, setCurrentYear] = useState(() => getYear(currentDatePoint));\n\n const d3ClubsEndpoint = d3ClubsAPI({ competitionOptaId, season });\n\n const currentIsoDate = formatISO(Date.now(), { representation: 'date' });\n const d3NextMatchEndpoint = d3NextMatchAPI({ startDate: currentIsoDate, competitionOptaId, clubOptaId, matchType: mlsPhaseType });\n\n const isNextMatchEnabled = !(hashQuery && getHashQueryObject(hashQuery)?.date);\n\n const {\n isLoading: isLoadingNextMatch,\n isError: isErrorNextMatch,\n error: nextMatchError,\n isFetched: isNextMatchFetched\n } = useQuery({\n queryKey: [`d3-next-match`, { startDate: currentIsoDate, competitionOptaId, clubOptaId, matchType: mlsPhaseType }],\n select: dates => {\n if (!dates) {\n return new Date();\n }\n\n const { previousMatchDate, nextMatchDate } = dates;\n\n if (nextMatchDate) {\n return new Date(nextMatchDate);\n } else if (previousMatchDate) {\n return new Date(previousMatchDate);\n } else {\n return new Date();\n }\n },\n queryFn: () => fetchClient({ endpoint: d3NextMatchEndpoint, apiURL: d3SportsAPI }),\n onSuccess: nearestDate => {\n if (nearestDate && isNextMatchEnabled) {\n setCurrentDatePoint(nearestDate);\n }\n },\n enabled: isNextMatchEnabled\n });\n\n const {\n isLoading: isLoadingClubs,\n isError: isErrorClubs,\n data: clubsData,\n error: clubsError\n } = useQuery({\n queryKey: [`d3-clubs`, { season, competitionOptaId }],\n queryFn: () => competitionOptaId === filterTypes.allCompetitions ? allClubs : fetchClient({ endpoint: d3ClubsEndpoint, apiURL: d3SportsAPI }),\n select: clubData => {\n const data = competitionOptaId === filterTypes.allCompetitions ?\n clubData : clubData?.sort((a, b) => a?.shortName?.localeCompare(b?.shortName));\n\n return getClubsData(data);\n },\n enabled: !preSelectedClub,\n });\n\n const {\n currentRangeYear,\n currentRangeMonth,\n currentRangeWeek,\n nextRangeYear,\n nextRangeMonth,\n nextRangeWeek,\n prevRangeYear,\n prevRangeMonth,\n prevRangeWeek,\n isoStringRS,\n isoStringRE\n } = React.useMemo(() => composeDateRangeStartAndEnd(currentDatePoint, dateRangeType), [currentDatePoint, dateRangeType]);\n\n const d3DateEndpoint = d3DateRangeAPI({ isoStringRS, isoStringRE, competitionOptaId, clubOptaId, matchType: mlsPhaseType, excludeSecondaryTeams: !options?.showSecondaryTeams, extendDays: true });\n const {\n isLoading: isLoadingMatches,\n isError: isErrorMatches,\n data: matchesData,\n error: matchesError\n } = useQuery({\n queryKey: [`d3-matches-date-range`, {\n isoStringRS,\n isoStringRE,\n clubOptaId,\n competitionOptaId,\n matchType: mlsPhaseType\n }],\n queryFn: () => fetchClient({ endpoint: d3DateEndpoint, apiURL: d3SportsAPI }),\n refetchInterval: refetchInterval ? refetchInterval : null,\n enabled: !!(currentDatePoint) && !!(d3DateEndpoint) && options?.forceWeekly && firstForce ? dateRangeType == dateRangeTypes.week : !!(d3DateEndpoint),\n refetchOnWindowFocus: false,\n });\n\n const orderedMatches = React.useMemo(() => orderEnrichedMatchesByDate({ dateRangeType, matchesData, clubOptaId, competitionOptaId, mlsPhaseType, isoStringRS, isoStringRE }), [clubOptaId, mlsPhaseType, competitionOptaId, matchesData]);\n\n useEffect(() => {\n if (currentDatePoint) {\n setCurrentYear(getYear(currentDatePoint));\n }\n }, [currentDatePoint]);\n\n useEffect(() => {\n if (options.forceWeekly && (competitionOptaId === filterTypes.allCompetitions)) {\n setCurrentRange(currentRangeWeek);\n setDateRangeType(dateRangeTypes.week);\n setPrevRange(prevRangeWeek);\n setNextRange(nextRangeWeek);\n setFirstForce(false);\n } else {\n if (options.forceWeekly && firstForce) {\n setFirstForce(false);\n }\n\n if (vsmDateRangeType === dateRangeTypes.year) {\n setCurrentRange(currentRangeYear);\n setDateRangeType(dateRangeTypes.year);\n setPrevRange(prevRangeYear);\n setNextRange(nextRangeYear);\n }\n\n if (vsmDateRangeType === dateRangeTypes.month) {\n setCurrentRange(currentRangeMonth);\n setDateRangeType(dateRangeTypes.month);\n setPrevRange(prevRangeMonth);\n setNextRange(nextRangeMonth);\n }\n\n if (vsmDateRangeType === dateRangeTypes.week) {\n setCurrentRange(currentRangeWeek);\n setDateRangeType(dateRangeTypes.week);\n setPrevRange(prevRangeWeek);\n setNextRange(nextRangeWeek);\n }\n }\n }, [clubOptaId, currentRange, mlsPhaseType, competitionOptaId, nextRange, prevRange]);\n\n const syncToCalendarText = t(\"match_sync_to_calendar\");\n\n const interval = React.useMemo(() => {\n if (orderedMatches && orderedMatches.length > 0) {\n return orderedMatches.reduce((total, outerCurrent) => {\n if (dateRangeType !== dateRangeTypes.year && outerCurrent.matches && outerCurrent.matches.length > 0) {\n const matchesTotal = outerCurrent.matches.reduce((accum, current) => {\n const status = composeMatchStatus({ period: current?.period, delayedMatch: current?.delayedMatch });\n\n\n if (status === statusTypes.pre) {\n return Math.min(accum, 300000);\n }\n\n if (status === statusTypes.live) {\n return Math.min(30000);\n }\n\n return accum;\n }, 30000);\n\n return Math.min(total, matchesTotal);\n }\n\n return total;\n }, -1);\n }\n\n return null;\n }, [orderedMatches]);\n\n useEffect(() => {\n if (interval && interval <= 300000 && interval > 0) {\n setRefetchInterval(interval);\n }\n }, [interval]);\n\n useEffect(() => {\n if (clubsData != null) {\n updateFilter(actionTypes.clubs)(clubsData);\n }\n }, [clubsData]);\n\n const { toggleModal: toggleCalendar, isOpen: isCalendarOpen, closeModal: closeCalendarModel, Modal: CalendarModal } = useModal({\n bindTo: calendarRef.current,\n customStyle: `\n position: absolute;\n left: 0;\n background: #ffffff;\n z-index: 1000;\n `\n });\n\n const handleDateRangeSelection = React.useCallback((direction, position) => (e) => {\n if (direction === directionTypes.next || e.target.value === directionTypes.next) {\n const nextRangeDate = dateRangeType === dateRangeTypes.week ? nextRangeWeek : (dateRangeType === dateRangeTypes.year ? nextRangeYear : nextRangeMonth);\n setCurrentDatePoint(nextRangeDate.dateRangeStart);\n\n trackWeekSelector({\n selectorLocation: position,\n direction: 'forward',\n selection: nextRangeDate.formattedDateRangeStringIntl\n });\n }\n else {\n const prevRangeDate = dateRangeType === dateRangeTypes.week ? prevRangeWeek : (dateRangeType === dateRangeTypes.year ? prevRangeYear : prevRangeMonth);\n setCurrentDatePoint(prevRangeDate.dateRangeStart);\n\n trackWeekSelector({\n selectorLocation: position,\n direction: 'back',\n selection: prevRangeDate.formattedDateRangeStringIntl\n });\n }\n\n if (headerRef?.current) {\n headerRef.current.scrollIntoView({ block: 'center' });\n }\n }, [dateRangeType, currentDatePoint]);\n\n const handleCalendarSyncClick = React.useCallback(() => {\n trackEvent('sync-to-calendar-click');\n }, []);\n\n useEffect(() => {\n if (!options?.disableDeeplinking) {\n const hashQueryObject = getHashQueryObject(hashQuery);\n const competitionSlugHash = state?.competitionSlug === \"all-competitions\" ? \"all\" : state?.competitionSlug;\n const clubOptaIdHash = state?.clubOptaId === filterTypes.allClubs ? \"all\" : state?.clubOptaId;\n const competitionQuery = !hideCompetitionsDropdown ? `competition=${competitionSlugHash}&` : \"\";\n const clubQuery = !hideClubsDropdown ? `club=${clubOptaIdHash}&` : \"\";\n const dateQuery = hashQueryObject?.date && !hashes.length ? `date=${hashQueryObject.date}&`\n : currentDatePoint && (isNextMatchFetched || !isNextMatchEnabled) ? `date=${format(currentDatePoint, \"yyyy-MM-dd\")}&` : \"\";\n const fullQuery = `${competitionQuery}${clubQuery}${dateQuery}`;\n\n if (fullQuery) {\n setHashQuery(fullQuery.slice(0, fullQuery.length - 1));\n }\n }\n }, [state, currentDatePoint]);\n\n useEffect(() => {\n if (hashQuery && !options?.disableDeeplinking) {\n if (hashes?.includes(hashQuery) || !hashes.length) {\n const hashQueryObject = getHashQueryObject(hashQuery);\n\n Object.entries(hashQueryObject).forEach(([key, value]) => {\n if (key === \"date\") {\n const date = dayjs(value)?.toDate();\n\n if (date instanceof Date && !isNaN(date.valueOf())) {\n setCurrentDatePoint(date);\n }\n }\n\n if (key === \"competition\" &&\n (state?.competitions?.filter(c => c?.slug === value).length > 0 || value === \"all\")) {\n updateFilter(actionTypes[\"competitionSlug\"])(value === \"all\" ? \"all-competitions\" : value);\n }\n\n if (key === \"club\" &&\n (state?.clubs?.filter(c => c?.optaId == value).length > 0 || value === \"all\")) {\n updateFilter(actionTypes[\"clubOptaId\"])(value === \"all\" ? filterTypes.allClubs : value);\n }\n });\n }\n\n setHashes([...hashes, hashQuery]);\n }\n }, [hashQuery]);\n\n return (\n <div role=\"region\" className={`mls-c-schedule ${scheduleTypeClass}`}>\n <div ref={headerRef} className=\"mls-c-schedule__header\">\n {\n isLoadingClubs\n ? <LoadingDisplay width=\"30\" />\n : isErrorClubs\n ? <ErrorDisplay error={clubsError} />\n : (\n <>\n <div className=\"mls-c-schedule__dropdown-group\">\n <div className={`mls-o-buttons__two-way ${isCalendarOpen ? \"mls-o-buttons__two-way--focused\" : \"\"}`} role=\"group\" aria-label=\"Date selector\" tabIndex=\"0\">\n <button value=\"prev\" aria-label=\"Previous results\" onClick={handleDateRangeSelection(directionTypes.prev, 'top')}><Chevron direction={chevronDirection.left} /></button>\n <button onClick={(e) => toggleCalendar(e)}>\n {dateRangeType === dateRangeTypes.week\n ? currentRangeWeek?.formattedDateRangeString\n : (dateRangeType === dateRangeTypes.year ? getYear(currentRangeYear?.dateRangeStart) : currentRangeMonth?.formattedDateRangeString)}\n </button>\n <button value=\"next\" aria-label=\"Next results\" onClick={handleDateRangeSelection(directionTypes.next, 'top')}><Chevron direction={chevronDirection.right} /></button>\n </div>\n {\n hideCompetitionsDropdown\n ? null\n : (\n <Dropdown\n valueKey={\"slug\"}\n displayKey={\"shortName\"}\n type={\"competition\"}\n title={t(\"match_competitions_dropdown\")}\n onChangeFn={updateFilter(actionTypes.competitionSlug)}\n items={competitions}\n currentValue={competitionSlug} />\n )\n }\n {\n hideClubsDropdown\n ? null\n : <Dropdown\n onChangeFn={updateFilter(actionTypes.clubOptaId)}\n displayKey={\"shortName\"}\n type={\"club\"}\n valueKey={\"optaId\"}\n items={clubs}\n currentValue={clubOptaId} />\n }\n {\n !isMediumLargeMin && listType !== listTypes.odds && calendarUrl\n ? (\n <ToggleButton\n onClick={handleCalendarSyncClick}\n target={\"_blank\"}\n href={calendarUrl}\n className=\"mls-c-schedule__calendar-sync mls-o-buttons__icon mls-o-buttons__icon--left\">\n <CalendarIcon />\n <span className=\"mls-c-schedule__calendar-sync-text\">{syncToCalendarText}</span>\n </ToggleButton>\n )\n : null\n }\n </div>\n {\n isMediumLargeMin && listType !== listTypes.odds && calendarUrl\n ? (\n <ToggleButton\n onClick={handleCalendarSyncClick}\n target={\"_blank\"}\n href={calendarUrl}\n className=\"mls-c-schedule__calendar-sync mls-o-buttons__icon mls-o-buttons__icon--left\">\n <CalendarIcon />\n <span className=\"mls-c-schedule__calendar-sync-text\">{t(\"match_sync_to_calendar\")}</span>\n </ToggleButton>\n )\n : null\n }\n </>\n )\n }\n <div className=\"mls-c-schedule__calendar\" ref={calendarRef}>\n {isCalendarOpen\n ?\n (\n <CalendarModal>\n <Calendar\n competitionOptaId={competitionOptaId}\n clubOptaId={clubOptaId}\n mlsPhaseType={mlsPhaseType}\n setOrderedMatchesLite={setOrderedMatchesLite}\n closeModal={closeCalendarModel}\n setCurrentDatePoint={setCurrentDatePoint}\n currentYear={currentYear}\n setCurrentYear={setCurrentYear}\n currentMonth={currentRangeMonth.dateRangeStart}\n weekRange={dateRangeType === dateRangeTypes.week ? currentRangeWeek : null}\n items={orderedMatchesLite}\n />\n </CalendarModal>\n )\n : null\n }\n </div>\n </div>\n <div className=\"mls-c-schedule__matches\">\n {\n isLoadingMatches || isLoadingClubs || isLoadingNextMatch\n ? <MatchGroupLoader stripCount={3} />\n : isErrorMatches || isErrorNextMatch\n ? isErrorMatches ? <ErrorDisplay error={matchesError} /> : <ErrorDisplay error={nextMatchError} />\n : orderedMatches && orderedMatches.length > 0\n ? (\n options?.useNewMatchList ?\n <ThemeProvider theme={{ ...Theme, type: themeTypes.light }}>\n <MatchListWrapper\n showSecondaryTeams={options?.showSecondaryTeams}\n hideMatchPromos={hideMatchPromos}\n weekRange={currentRangeWeek}\n matchList={orderedMatches}\n listType={listType}\n dateRangeType={dateRangeType}\n betMgmCompetitionIds={options?.betMgmCompetitionIds}\n showClubRanks={options?.showClubRanks}\n showGroupInformation={options?.showGroupInformation}\n showRoundDetail={options?.showRoundDetail}\n showCompetitionStage={options.showCompetitionStage}\n />\n </ThemeProvider>\n :\n <MatchGroup\n showSecondaryTeams={options?.showSecondaryTeams}\n hideMatchPromos={hideMatchPromos}\n weekRange={currentRangeWeek}\n matchList={orderedMatches}\n listType={listType}\n dateRangeType={dateRangeType}\n betMgmCompetitionIds={options?.betMgmCompetitionIds}\n />\n )\n : (\n <div className=\"mls-c-schedule__no-results\">\n <NoResults size=\"large\" />\n <div className=\"mls-c-schedule__no-results-text\">{t(\"match_no_matches\")}</div>\n </div>\n )\n }\n </div>\n {isLoadingNextMatch || currentDatePoint === null ? null :\n <div className=\"mls-c-schedule__footer\">\n <div className=\"mls-c-schedule__button-group\">\n <ToggleButton\n className=\"mls-o-buttons__icon mls-o-buttons__icon--left\"\n value=\"prev\"\n onClick={handleDateRangeSelection(directionTypes.prev, 'bottom')}>\n <Chevron direction={chevronDirection.left} />\n {dateRangeType === dateRangeTypes.week ? prevRangeWeek?.formattedDateRangeString : (dateRangeType === dateRangeTypes.year ? getYear(prevRangeYear?.dateRangeStart) : prevRangeMonth?.formattedDateRangeString)}\n </ToggleButton>\n <ToggleButton\n className=\"mls-o-buttons__icon mls-o-buttons__icon--right\"\n value=\"next\"\n onClick={handleDateRangeSelection(directionTypes.next, 'bottom')}>\n {dateRangeType === dateRangeTypes.week ? nextRangeWeek?.formattedDateRangeString : (dateRangeType === dateRangeTypes.year ? getYear(nextRangeYear?.dateRangeStart) : nextRangeMonth?.formattedDateRangeString)}\n <Chevron direction={chevronDirection.right} />\n </ToggleButton>\n </div>\n </div>\n }\n </div>\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 <StyledMatchContainer\n className={`mls-c-match-list__match-container ${\n isMobile ? \"--mobile\" : \"\"\n }`}\n >\n <StyledMatch className=\"mls-c-match-list__match\">\n <MatchTime abbreviateStatus />\n <Link\n url={isFriendlyMatch ? null : matchPageUrl}\n onClick={handleMatchClick}\n >\n <StyledExplainerBarCompetition\n className=\"mls-c-match-list__match-competition\"\n style={{ marginBottom: composedInfo ? \"4px\" : \"8px\" }}\n >\n <ExplainerBar\n fontStyle=\"normal\"\n text={leagueMatchTitle ? leagueMatchTitle : competition?.name}\n />\n <ExplainerBar\n fontStyle=\"normal\"\n text={composedInfo ? composedInfo : \"\"}\n />\n </StyledExplainerBarCompetition>\n <MatchTile\n hasAbbreviation\n hasShortName\n status={status}\n homeClubData={homeClubData}\n awayClubData={awayClubData}\n isHomeWinner={isHomeWinner}\n isAwayWinner={isAwayWinner}\n homeScore={homeScore}\n awayScore={awayScore}\n homeClubRank={showClubRanks ? homeClubRank : null}\n awayClubRank={showClubRanks ? awayClubRank : null}\n />\n {shootoutResult && (\n <StyledExplainerBar>\n <ExplainerBar text={shootoutResult} />\n </StyledExplainerBar>\n )}\n {(status?.abbreviation === statusTypes.pre ||\n status?.abbreviation === statusTypes.live) &&\n mediaProviders?.allProvidersList?.length > 0 && (\n <StyledBroadcastersWrapper className=\"mls-c-match-list__match-broadcaster__wrapper\">\n <MatchBroadcaster />\n </StyledBroadcastersWrapper>\n )}\n {!isMobile && !hideMatchPromos && <MatchListPromo />}\n </Link>\n <MatchInfo roundInfo={composedInfo} />\n <MatchWatch position={position} showChevron={isMobile} />\n </StyledMatch>\n {isMobile && !hideMatchPromos && <MatchListPromo />}\n </StyledMatchContainer>\n );\n};\n","import styled from \"styled-components\";\n\nexport const StyledMatchContainer = styled.div`\n .mls-c-match-list__match-watch {\n align-self: flex-start;\n justify-content: flex-end;\n }\n\n &.--mobile {\n margin-bottom: 12px;\n\n .mls-c-match-list__strip-time,\n .mls-c-match-list__match-watch {\n align-self: auto;\n display: flex;\n flex-direction: column;\n align-items: flex-end;\n }\n }\n`;\n\nexport const StyledExplainerBar = styled.div`\n display: flex;\n justify-content: center;\n margin-top: 4px;\n`;\n\nexport const StyledExplainerBarCompetition = styled.div`\n display: flex;\n justify-content: center;\n align-items: center;\n flex-direction: column;\n margin-bottom: 8px;\n`;\n\nexport const StyledMatch = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n position: relative;\n padding: 12px 0;\n\n div,\n a {\n z-index: 2;\n }\n\n .mls-c-match-tile {\n width: 420px;\n display: flex;\n justify-content: center;\n\n .mls-c-club {\n flex-shrink: 0;\n }\n\n .--home .mls-c-club__shortname {\n text-align: right;\n }\n\n .mls-c-club__shortname {\n width: 120px;\n }\n\n picture,\n picture img,\n .mls-c-club__picture {\n width: 28px;\n height: 28px;\n margin-top: 0;\n }\n }\n\n &:before {\n content: \"\";\n top: 0;\n position: absolute;\n box-shadow: 0;\n box-sizing: content-box;\n background: none;\n width: 100%;\n height: calc(100% + 2px);\n z-index: 1;\n transition: all 200ms;\n }\n\n &:hover:before,\n &:focus:before {\n content: \"\";\n top: 0;\n position: absolute;\n box-shadow: 0px 4px 20px 4px rgba(0, 0, 0, 0.08),\n 0px 2px 10px 1px rgba(0, 0, 0, 0.1);\n box-sizing: content-box;\n padding: 0 10px;\n border-radius: 6px;\n margin: -1px -10px;\n background: ${(props) => props.theme.figma.base.color_white_100};\n width: 100%;\n height: calc(100% + 2px);\n z-index: 1;\n\n + div {\n border: none;\n }\n }\n\n\n`;\n\nexport const StyledBroadcastersWrapper = styled.div`\n height: 15px;\n margin-top: 4px;\n align-self: flex-start;\n`;\n","import { composeAggregate, formatScores, useMatchData } from \"../../utils\";\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 useShootoutScore() {\n const { apiList } = useReactAppState();\n const { d3SportsAPI } = apiList || {};\n const {\n homeClubData,\n awayClubData,\n period,\n resultType,\n queryConfig,\n matchOptaId,\n competition,\n } = useMatchData();\n\n const d3AggregateEndpoint = d3AggregateAPI({ matchOptaId });\n\n const { data: aggregateData } = useQuery({\n queryKey: [`d3-aggregate`, { matchOptaId }],\n queryFn: () =>\n fetchClient({ endpoint: d3AggregateEndpoint, apiURL: d3SportsAPI }),\n ...queryConfig,\n enabled:\n !!matchOptaId &&\n (competition?.optaId == 549 ||\n (competition?.optaId == 98 && competition?.matchType === \"Cup\")),\n });\n\n const { aggregate, date } = aggregateData || {};\n\n const composedAggregate = composeAggregate(aggregate, date);\n\n const { homeScore, awayScore, shootoutResult } = formatScores({\n homeClubData,\n awayClubData,\n period,\n resultType,\n });\n\n return {\n homeScore,\n awayScore,\n shootoutResult: composedAggregate || shootoutResult,\n };\n}\n\nexport default useShootoutScore;\n","import React from \"react\";\nimport { useMatchData } from \"../../utils\";\nimport {\n StyledMatchInfo,\n StyledMatchInfoTitle,\n StyledMatchInfoVenue,\n StyledMatchRoundInfo,\n} from \"./StyledMatchInfo\";\n\nexport const MatchInfo = ({ roundInfo }) => {\n const { venue, leagueMatchTitle, competition } = useMatchData();\n const { name } = venue || {};\n\n return (\n <StyledMatchInfo className=\"mls-c-match-list__match-info\">\n <StyledMatchInfoTitle>\n {leagueMatchTitle || competition?.name}\n </StyledMatchInfoTitle>\n <StyledMatchRoundInfo>{roundInfo}</StyledMatchRoundInfo>\n <StyledMatchInfoVenue>{name}</StyledMatchInfoVenue>\n </StyledMatchInfo>\n );\n};\n","import styled from \"styled-components\";\n\nexport const StyledMatchInfo = styled.div`\n width: 200px;\n align-self: flex-start;\n`;\n\nexport const StyledMatchInfoTitle = styled.p`\n font-family: ${(props) => props.theme.figma.base.fontfamily_mlstifo_standard};\n font-style: normal;\n font-weight: 400;\n font-size: ${(props) => props.theme.mixins.pxToRem(11)};\n line-height: 14px;\n color: ${(props) => props.theme.figma.base.color_black_100};\n opacity: 0.4;\n`;\n\nexport const StyledMatchRoundInfo = styled.p`\n font-family: ${(props) => props.theme.figma.base.fontfamily_mlstifo_standard};\n font-style: normal;\n font-weight: 400;\n font-size: ${(props) => props.theme.mixins.pxToRem(11)};\n line-height: 14px;\n color: ${(props) => props.theme.figma.base.color_black_100};\n opacity: 0.4;\n text-wrap: nowrap;\n`;\n\nexport const StyledMatchInfoVenue = styled.p`\n font-family: ${(props) => props.theme.figma.base.fontfamily_mlstifo_standard};\n font-style: normal;\n font-weight: 400;\n font-size: ${(props) => props.theme.mixins.pxToRem(11)};\n line-height: 14px;\n color: ${(props) => props.theme.figma.base.color_offblack_100};\n`;\n","import React from \"react\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\nimport { useDateDisplay } from \"../../utils\";\nimport {\n StyledMatchListHeader,\n StyledMatchListHeaderDate,\n StyledMatchListHeaderTimezone,\n} from \"./StyledMatchListHeader\";\n\nexport const MatchListHeader = ({\n matchDate,\n dateRangeType,\n showTimezone = false,\n}) => {\n const { t } = useReactAppState();\n const dateDisplay = useDateDisplay(matchDate, dateRangeType);\n return (\n <StyledMatchListHeader>\n <StyledMatchListHeaderDate>{dateDisplay}</StyledMatchListHeaderDate>\n {showTimezone && (\n <StyledMatchListHeaderTimezone>\n {t(\"match_schedule_timezone\")}\n </StyledMatchListHeaderTimezone>\n )}\n </StyledMatchListHeader>\n );\n};\n","import styled from \"styled-components\";\n\nexport const StyledMatchListHeader = styled.div`\n margin-top: 24px;\n margin-bottom: 8px;\n`;\n\nexport const StyledMatchListHeaderTimezone = styled.span``;\n\nexport const StyledMatchListHeaderDate = styled.h2`\n font-family: ${(props) => props.theme.figma.base.fontfamily_mlstifo_headline};\n font-weight: 700;\n font-size: ${(props) => props.theme.mixins.pxToRem(17)};\n line-height: 20px;\n color: rgba(45, 45, 45, 1);\n`;\n","import classNames from \"classnames\";\nimport React, { useRef } from \"react\";\nimport { useContainerQuery } from \"react-container-query\";\nimport { query } from \"../../../shared/styled/Theme\";\nimport { dateRangeTypes, useMatchList } from \"../../utils\";\nimport { MatchListHeader } from \"../MatchListHeader/MatchListHeader\";\nimport { MatchWrapper } from \"../MatchWrapper/MatchWrapper\";\nimport {\n StyledMatchGroup,\n StyledMatchListWrapper,\n StyledMatchHeaderWrapper,\n} from \"./StyledMatchListWrapper\";\nimport dayjs from \"dayjs\";\nimport useMatchListScroll from \"./useMatchListScroll\";\n\nexport const MatchListWrapper = ({\n showSecondaryTeams = false,\n hideMatchPromos = false,\n showClubRanks = false,\n showCompetitionStage = false,\n showRoundDetail = false,\n showGroupInformation = false,\n weekRange = null,\n matchList = null,\n dateRangeType = null,\n}) => {\n const [params, containerRef] = useContainerQuery(query);\n const matchPosition = useRef(0);\n const formattedMatchList = useMatchList({\n matchList,\n dateRangeType,\n weekRange,\n });\n const focusRef = React.useRef(null);\n\n const isYearly = dateRangeType === dateRangeTypes.year;\n\n useMatchListScroll(focusRef, isYearly);\n\n if (formattedMatchList == null) {\n return null;\n }\n\n const isSameMonth = (date) => {\n return dayjs().isSame(date, \"month\");\n };\n\n return (\n <StyledMatchListWrapper className={classNames(params)} ref={containerRef}>\n {formattedMatchList.map((matchGroup, i) => {\n const isCurrentMonth = isSameMonth(matchGroup.date);\n\n return (\n <StyledMatchGroup key={`${matchGroup.date}-${i}`}>\n <StyledMatchHeaderWrapper\n ref={isCurrentMonth && isYearly ? focusRef : null}\n >\n <MatchListHeader\n matchDate={matchGroup.date}\n dateRangeType={dateRangeType}\n />\n </StyledMatchHeaderWrapper>\n {matchGroup.matches &&\n matchGroup.matches.length > 0 &&\n matchGroup.matches.map((match, j) => {\n if (i === 0 && j === 0) matchPosition.current = 0;\n matchPosition.current++;\n\n return (\n <MatchWrapper\n key={`${i}-${j}`}\n showClubRanks={showClubRanks}\n showCompetitionStage={showCompetitionStage}\n showRoundDetail={showRoundDetail}\n showGroupInformation={showGroupInformation}\n showSecondaryTeams={showSecondaryTeams}\n hideMatchPromos={hideMatchPromos}\n position={matchPosition?.current}\n match={match}\n />\n );\n })}\n </StyledMatchGroup>\n );\n })}\n </StyledMatchListWrapper>\n );\n};\n","import styled from \"styled-components\";\n\nexport const StyledMatchGroup = styled.div`\n & > div:not(:first-of-type, :last-of-type) {\n border-bottom: 1px solid #dddddd;\n }\n`;\n\nexport const StyledMatchListWrapper = styled.div`\n width: 100%;\n\n .mls-c-match-list__match-competition {\n display: none;\n }\n\n .mls-c-club__abbreviation {\n display: none;\n }\n\n &.xs,\n &.xxs,\n &.sm {\n .mls-c-match-list__match-broadcaster__wrapper {\n margin-top: 8px;\n }\n\n .mls-c-match-list__match-watch-live-button {\n display: none;\n }\n\n .mls-c-match-list__match-watch-live-icon {\n display: flex;\n }\n\n .mls-c-match-list__match-competition {\n display: flex;\n }\n\n .mls-c-club__abbreviation {\n display: block;\n }\n\n .mls-c-club__shortname {\n display: none;\n }\n\n .mls-c-match-list__match-info {\n display: none;\n }\n\n .mls-c-match-list__match-watch {\n width: 72px;\n }\n\n .mls-c-match-list__match-watch-label {\n display: none;\n }\n\n .mls-c-match-list__match-cta {\n width: 24px;\n height: 24px;\n padding: 0;\n\n > img {\n margin: 0;\n }\n\n svg {\n margin: 0;\n }\n }\n\n .mls-c-match-list__match-hotel-book-label {\n display: none;\n }\n\n .mls-c-match-tile {\n width: auto;\n }\n }\n\n &.xxs {\n .mls-c-club__abbreviation {\n display: none;\n }\n }\n`;\n\nexport const StyledMatchHeaderWrapper = styled.div`\n scroll-margin-top: 80px;\n`;\n","import React from \"react\";\n\nfunction useMatchListScroll(ref, isYearly) {\n React.useEffect(() => {\n if (ref.current && isYearly) {\n ref.current.scrollIntoView({\n block: \"start\",\n behavior: \"smooth\",\n });\n }\n }, [ref, isYearly]);\n\n return null;\n}\n\nexport default useMatchListScroll;\n","import React from \"react\";\nimport { isMatchPromoValid, isPromoLinkValid, useMatchData } from \"../../utils\";\nimport SupportCopyCompact from \"../../../shared/components/SponsorV2/SupportCopyCompact/SupportCopyCompact\";\nimport MatchPromo from \"../../../shared/components/SponsorV2/MatchPromo/MatchPromo\";\nimport {\n StyledMatchListPromo,\n StyledMatchListPromoDivider,\n StyledMatchPromoLinksWrapper,\n StyledMatchPromoWrapper,\n StyledPromoMiscWrapper,\n StyledSupportCopyCompactPromoWrapper,\n} from \"./StyledMatchListPromo\";\nimport MatchPromoLink from \"../../../shared/components/SponsorV2/MatchPromo/MatchPromoLink/MatchPromoLink\";\nimport MatchPromoButton from \"../../../shared/components/SponsorV2/MatchPromo/MatchPromoButton/MatchPromoButton\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\n\nfunction MatchListPromo() {\n const { promoInfo } = useMatchData();\n const { t } = useReactAppState();\n\n const {\n matchPromo,\n promotionalSponsor,\n sponsorImage,\n promotionalStay,\n promotionalFly,\n promotionalRide,\n promotionalMisc1,\n promotionalMisc2,\n } = promoInfo || {};\n const { displayText } = promotionalSponsor || {};\n const { assetUrl } = sponsorImage || {};\n\n const hasMatchPromo = isMatchPromoValid(matchPromo);\n const hasPromotionalSponsor = assetUrl || displayText;\n const hasPromoMisc =\n isPromoLinkValid(promotionalMisc1) || isPromoLinkValid(promotionalMisc2);\n const hasExtraPromotions =\n isPromoLinkValid(promotionalStay) ||\n isPromoLinkValid(promotionalFly) ||\n isPromoLinkValid(promotionalRide);\n\n if (\n !hasMatchPromo &&\n !hasPromotionalSponsor &&\n !hasPromoMisc &&\n !hasExtraPromotions\n ) {\n return null;\n }\n\n const showMatchPromoDivider = hasMatchPromo && hasPromotionalSponsor;\n const showPromoMiscDivider =\n hasPromoMisc && (hasMatchPromo || hasPromotionalSponsor);\n const showExtraPromoDivider =\n hasExtraPromotions &&\n (hasMatchPromo || hasPromotionalSponsor || hasPromoMisc);\n\n return (\n <StyledMatchListPromo className=\"mls-c-match-list-promo\">\n {hasPromotionalSponsor && (\n <StyledSupportCopyCompactPromoWrapper>\n <SupportCopyCompact displayText={displayText} assetUrl={assetUrl} />\n </StyledSupportCopyCompactPromoWrapper>\n )}\n {showMatchPromoDivider && <StyledMatchListPromoDivider />}\n <StyledMatchPromoWrapper>\n {hasMatchPromo && (\n <MatchPromo\n headline={matchPromo.headline}\n description={matchPromo.description}\n callToAction1={matchPromo.callToAction1}\n callToAction2={matchPromo.callToAction2}\n />\n )}\n </StyledMatchPromoWrapper>\n\n {showPromoMiscDivider && <StyledMatchListPromoDivider />}\n <StyledPromoMiscWrapper>\n {hasPromoMisc && (\n <>\n {promotionalMisc1 && (\n <MatchPromoButton callToAction={promotionalMisc1} />\n )}\n {promotionalMisc2 && (\n <MatchPromoButton callToAction={promotionalMisc2} />\n )}\n </>\n )}\n </StyledPromoMiscWrapper>\n\n {showExtraPromoDivider && <StyledMatchListPromoDivider />}\n {hasExtraPromotions && (\n <StyledMatchPromoLinksWrapper>\n {promotionalStay && (\n <MatchPromoLink\n callToAction={promotionalStay}\n prefix={t(\"match_promo_hotel\")}\n />\n )}\n {promotionalFly && (\n <MatchPromoLink\n callToAction={promotionalFly}\n prefix={t(\"match_promo_fly\")}\n />\n )}\n {promotionalRide && (\n <MatchPromoLink\n callToAction={promotionalRide}\n prefix={t(\"match_promo_travel\")}\n />\n )}\n </StyledMatchPromoLinksWrapper>\n )}\n </StyledMatchListPromo>\n );\n}\n\nexport default MatchListPromo;\n","import styled from \"styled-components\";\n\nexport const StyledMatchListPromo = styled.div`\n width: 300px;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n\n font-family: ${(props) => props.theme.figma.base.fontfamily_mlstifo_standard};\n padding: 16px;\n border-radius: 5px;\n background-color: ${({ theme }) => theme.rgba.white_240};\n box-sizing: border-box;\n margin: 12px auto 0;\n\n .mls-c-match-promo__promo-link-button {\n margin-top: 12px;\n }\n\n .mls-c-match-promo__support-compact {\n width: 218px;\n\n .mls-c-match-promo__support-compact__display-text {\n width: 134px;\n }\n\n .mls-c-support-copy__sponsor-logo {\n max-width: 64px;\n max-height: 28px;\n\n img {\n width: 100%;\n height: 28px;\n }\n }\n }\n`;\n\nexport const StyledMatchPromoWrapper = styled.div`\n flex: 1;\n width: 100%;\n`;\n\nexport const StyledSupportCopyCompactPromoWrapper = styled.div`\n flex: 1;\n`;\n\nexport const StyledMatchListPromoDivider = styled.div`\n width: 100%;\n margin: 14px auto;\n border-top: 1px solid ${({ theme }) => theme.rgba.black_33_1};\n`;\n\nexport const StyledPromoMiscWrapper = styled.div`\n width: 100%;\n\n a:first-child {\n .mls-c-match-promo__promo-link-button {\n margin-top: 0px;\n }\n }\n`;\n\nexport const StyledMatchPromoLinksWrapper = styled.div`\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n\n .mls-c-match-promo__promo-link {\n margin-top: 4px;\n }\n\n .mls-c-match-promo__promo-link:first-child {\n margin-top: 0px;\n }\n`;\n","import React from \"react\";\nimport { formatMatchMinutes } from \"../../../mls-match-summary/utils\";\nimport StatusStamp from \"../../../shared/components/StatusStamp/StatusStamp\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\nimport { useMatchData } from \"../../utils\";\nimport { StyledMatchTime } from \"./StyledMatchTime\";\n\nexport const MatchTime = ({ abbreviateStatus }) => {\n const { t } = useReactAppState();\n const { matchDateTime, isTimeTbd, status, minuteDisplay } = useMatchData();\n const { date } = matchDateTime || {};\n const time = date;\n const [minutes, extraMinutes] = formatMatchMinutes(minuteDisplay);\n\n return (\n <StyledMatchTime className=\"mls-c-match-list__strip-time\">\n <StatusStamp\n time={time}\n minuteDisplay={minutes}\n extraMinutes={extraMinutes}\n date={date}\n abbreviation={status?.abbreviation}\n abbreviateStatus={abbreviateStatus}\n />\n </StyledMatchTime>\n );\n};\n","import styled from \"styled-components\";\n\nexport const StyledMatchTime = styled.div`\n font-family: ${(props) => props.theme.figma.base.fontfamily_mlstifo_micro};\n font-size: ${(props) => props.theme.mixins.pxToRem(11)};\n color: #868686;\n line-height: ${(props) => props.theme.figma.base.scale_2}px;\n font-weight: 500;\n width: ${(props) => props.theme.figma.base.scale_7_50}px;\n display: flex;\n\n .mls-c-status-stamp__status {\n max-width: ${(props) => props.theme.figma.base.scale_7}px;\n }\n`;\n","import React, { useEffect } from \"react\";\nimport { trackMatchInteraction } from \"../../../../libraries/_modules/tracking/helpers\";\nimport { statusTypes, useMatchData } from \"../../utils\";\nimport { StyledMatchCTA, StyledMatchHotelBookLabel } from \"./StyledMatchWatch\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\nimport { getHotelBookingIconUrl } from \"../../../shared/utils\";\n\nfunction MatchHotelBook() {\n const { t } = useReactAppState();\n const { promoInfo, status, slug } = useMatchData();\n const { firstPartyTickets, thirdPartyTickets, hotelBooking } = promoInfo || {};\n const { url, openInNewTab, displayText, altText } = hotelBooking || {};\n\n const hotelBookingIconUrl = getHotelBookingIconUrl({ variant: \"dark\" });\n\n const trackInteraction = (event) => {\n if (!event) return null;\n event.preventDefault();\n const { href, target } = event.currentTarget;\n\n\n trackMatchInteraction({\n event: \"cta_clicked\",\n match: slug,\n cta_button_location: \"schedule page\",\n ctaAction: \"book_hotel\",\n });\n\n window.open(href, target);\n }\n\n useEffect(() => {\n if (url) {\n trackMatchInteraction({\n event: \"cta_viewed\",\n match: slug,\n cta_button_location: \"schedule page\",\n ctaAction: \"book_hotel\",\n });\n }\n }, [url, slug]);\n\n if (!hotelBooking || status?.abbreviation !== statusTypes.pre) {\n return null;\n }\n\n return (\n <a href={url} alt={altText || displayText} target={openInNewTab ? \"_blank\" : \"_self\"} rel=\"noopener noreferrer\" onClick={(e) => trackInteraction(e)}>\n <StyledMatchCTA className=\"mls-c-match-list__match-cta\">\n <StyledMatchHotelBookLabel className=\"mls-c-match-list__match-hotel-book-label\">{t(\"hotels\")}</StyledMatchHotelBookLabel>\n <img src={hotelBookingIconUrl} height={16} width={16} />\n </StyledMatchCTA>\n </a>\n );\n}\n\nexport default MatchHotelBook;\n","import React from \"react\";\nimport { useQuery } from \"react-query\";\nimport { trackMatchInteraction } from \"../../../../libraries/_modules/tracking/helpers\";\nimport { composeVideoList, removeDuplicates } from \"../../../mls-match-feed/utils\";\nimport { fetchClient } from \"../../../shared/api/fetching\";\nimport {\n apiURL,\n forgeMatchContentVideosAPI,\n forgeMatchVideosAPI,\n} from \"../../../shared/api/variables\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\nimport { statusTypes, useMatchData } from \"../../utils\";\nimport { MatchWatchLive } from \"./MatchWatchLive\";\nimport { MatchWatchPost } from \"./MatchWatchPost\";\nimport { MatchWatchPre } from \"./MatchWatchPre\";\nimport { StyledMatchWatch } from \"./StyledMatchWatch\";\nimport MatchHotelBook from \"./MatchHotelBook\";\n\nexport const MatchWatch = ({ position = null, showChevron }) => {\n const { videoTags } = useReactAppState();\n const { slug, status, promoInfo, queryConfig, matchOptaId } = useMatchData();\n\n const { firstPartyTickets, thirdPartyTickets } = promoInfo || {};\n\n const forgeMatchVideosEndpoint = forgeMatchVideosAPI({ matchOptaId });\n const forgeMatchContentVideosEndpoint = forgeMatchContentVideosAPI({\n matchSlug: slug,\n });\n\n const { data: forgeMatchVideos } = useQuery({\n queryKey: [`forge-match-videos`, { matchOptaId }],\n queryFn: () =>\n fetchClient({\n apiURL: apiURL.forgeDAPI,\n endpoint: forgeMatchVideosEndpoint,\n }),\n ...queryConfig,\n enabled: !!matchOptaId && status?.abbreviation === statusTypes.post,\n select: (videos) => videos?.items,\n });\n\n const { data: forgeMatchContentVideos } = useQuery({\n queryKey: [`forge-match-content-videos`, { slug }],\n queryFn: () =>\n fetchClient({\n apiURL: apiURL.forgeDAPI,\n endpoint: forgeMatchContentVideosEndpoint,\n }),\n ...queryConfig,\n enabled: !!slug && status?.abbreviation === statusTypes.post,\n select: (videos) => videos?.items,\n });\n\n const videoList = React.useMemo(() => {\n const mergedMatchVideos =\n forgeMatchVideos?.length >= 0 && forgeMatchContentVideos?.length >= 0\n ? [...forgeMatchVideos, ...forgeMatchContentVideos]\n : [];\n\n const matchVideos = removeDuplicates(mergedMatchVideos, '_entityId');\n\n return composeVideoList(matchVideos, videoTags);\n }, [forgeMatchVideos, forgeMatchContentVideos, videoTags]);\n\n return (\n <StyledMatchWatch className=\"mls-c-match-list__match-watch\">\n <MatchWatchComponent\n position={position}\n videoList={videoList}\n showChevron={showChevron}\n firstPartyTickets={firstPartyTickets}\n thirdPartyTickets={thirdPartyTickets}\n />\n <MatchHotelBook position={position} />\n </StyledMatchWatch>\n );\n};\n\nfunction MatchWatchComponent({\n position,\n videoList,\n showChevron,\n firstPartyTickets,\n thirdPartyTickets,\n}) {\n const {\n slug,\n status,\n competition,\n appleStreamURL,\n matchPageUrl,\n } = useMatchData();\n const { t } = useReactAppState();\n\n\n const trackInteraction = (clickItem) => {\n if (!clickItem) {\n return null;\n }\n\n trackMatchInteraction({\n clickType: \"cta label\",\n clickItem,\n clickPosition: position,\n match: slug,\n matchState: status?.abbreviation,\n competition: competition?.shortName,\n });\n };\n\n switch (status?.abbreviation) {\n case statusTypes.post:\n return (\n <MatchWatchPost\n showChevron={showChevron}\n trackFn={() => trackInteraction(\"replay\")}\n videoList={videoList}\n matchPageUrl={matchPageUrl}\n />\n );\n case statusTypes.live:\n return (\n <MatchWatchLive\n showChevron={showChevron}\n matchPageUrl={matchPageUrl}\n appleStreamURL={appleStreamURL}\n trackFn={() =>\n trackInteraction(\n `${t(\"match_watch_on\")} ${t(\"appletv\")}`.toLowerCase()\n )\n }\n forceLightVersion\n />\n );\n case statusTypes.pre:\n return (\n <MatchWatchPre\n matchPageUrl={matchPageUrl}\n showChevron={showChevron}\n trackFn={() => trackInteraction(\"tickets\")}\n firstPartyTickets={firstPartyTickets}\n thirdPartyTickets={thirdPartyTickets}\n />\n );\n default:\n return null;\n }\n}\n","import React from \"react\";\nimport VideoModal from \"../../../shared/components/VideoModal\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\nimport {\n modalActionTypes,\n modalTypes,\n} from \"../../../shared/hooks/useModalOptions\";\nimport { TVIcon } from \"../../../shared/svg/TVIcon/TVIcon\";\nimport { highlightTypes, matchHighlightsTagSlug } from \"../../../shared/utils\";\nimport {\n StyledMatchWatchPost,\n StyledMatchWatchPostLabel,\n} from \"./StyledMatchWatch\";\nimport Chevron from \"./Chevron\";\n\nexport const MatchWatchPost = ({ videoList = [], trackFn = () => null, showChevron, matchPageUrl }) => {\n const { t, updateModalOptions } = useReactAppState();\n const gameHighlights = videoList.find(\n (video) =>\n video?.fields?.highlightType === highlightTypes.gameHighlights ||\n video?.tags.find((tag) => tag?.slug === matchHighlightsTagSlug)\n );\n\n const openVideoModal = (currentVideo) => {\n const foundVideoIndex = videoList.findIndex((video) => {\n return currentVideo._entityId === video._entityId;\n });\n\n const videos = [\n currentVideo,\n ...videoList.slice(0, foundVideoIndex),\n ...videoList.slice(foundVideoIndex + 1),\n ];\n\n trackFn();\n\n updateModalOptions({\n type: modalActionTypes.modalClassName,\n payload: \"mls-o-modal mls-o-modal--dark mls-o-modal--video-playlist\",\n });\n updateModalOptions({\n type: modalActionTypes.modalType,\n payload: modalTypes.default,\n });\n updateModalOptions({\n type: modalActionTypes.label,\n payload: t(\"match_highlights\"),\n });\n updateModalOptions({\n type: modalActionTypes.component,\n payload: VideoModal,\n });\n updateModalOptions({\n type: modalActionTypes.modalData,\n payload: { videoList: videos, video: currentVideo },\n });\n updateModalOptions({ type: modalActionTypes.show });\n };\n\n if (!gameHighlights) {\n if(showChevron) {\n return (\n <Chevron />\n );\n }\n\n return null;\n }\n\n return (\n <StyledMatchWatchPost onClick={() => openVideoModal(gameHighlights)}>\n <StyledMatchWatchPostLabel className=\"mls-c-match-list__match-watch-label\">\n {t(\"highlights\")}\n </StyledMatchWatchPostLabel>\n <TVIcon width={11} height={10} />\n </StyledMatchWatchPost>\n );\n};\n","import React, { useState } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport TicketModal from \"../../../shared/components/TicketModal/main\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\nimport Chevron from \"./Chevron\";\nimport {\n StyledMatchCTA,\n StyledMatchWatchPre,\n StyledMatchWatchPreLabel,\n StyledMatchWatchPreWrapper,\n} from \"./StyledMatchWatch\";\nimport { getTicketMasterIconUrl, getTicketMasterUrl } from \"../../../shared/utils\";\nimport { TicketIconV2 } from \"../../../shared/svg/TicketIconV2/TicketIconV2\";\n\nexport const MatchWatchPre = ({\n firstPartyTickets,\n thirdPartyTickets,\n trackFn = () => null,\n showChevron = false,\n}) => {\n const { t } = useReactAppState();\n const [renderPortal, setRenderPortal] = useState(false);\n const ticketMasterIconUrl = getTicketMasterIconUrl({ variant: \"dark\" });\n const hasTicketMasterUrl = getTicketMasterUrl([firstPartyTickets?.url, thirdPartyTickets?.url]);\n\n const handleClick = () => {\n trackFn();\n\n if (firstPartyTickets?.url && thirdPartyTickets?.url) {\n setRenderPortal(true);\n } else {\n window.open(firstPartyTickets?.url || thirdPartyTickets?.url, \"_blank\");\n }\n };\n\n const onCloseModal = () => {\n setRenderPortal(false);\n };\n\n return (\n <StyledMatchWatchPreWrapper>\n {firstPartyTickets?.url || thirdPartyTickets?.url ? (\n <StyledMatchWatchPre onClick={handleClick}>\n <StyledMatchCTA className=\"mls-c-match-list__match-cta\">\n <StyledMatchWatchPreLabel className=\"mls-c-match-list__match-watch-label\">\n {t(\"tickets\")}\n </StyledMatchWatchPreLabel>{\" \"}\n {hasTicketMasterUrl ? (\n <img src={ticketMasterIconUrl} height={16} width={16} />\n ) : <TicketIconV2 width={16} height={16} viewBox=\"-1 0 18 18\" />}\n </StyledMatchCTA>\n </StyledMatchWatchPre>\n ) : showChevron ? (\n <Chevron />\n ) : null}\n {renderPortal\n ? ReactDOM.createPortal(\n <TicketModal isOpen={renderPortal} onCloseModal={onCloseModal} />,\n document.getElementById(\"react-root\")\n )\n : null}\n </StyledMatchWatchPreWrapper>\n );\n};\n","import classNames from \"classnames\";\nimport React from \"react\";\nimport MatchDataLayer from \"../../components/MatchDataLayer\";\nimport { Match } from \"../Match/Match\";\nimport { StyledMatchWrapper } from \"./StyledMatchWrapper\";\nimport { composeMatchStatus } from \"../../utils\";\n\nexport const MatchFragmentWrapper = ({\n matchOptaId,\n params,\n containerRef,\n mergedMatch,\n matchPageUrl,\n position,\n hideMatchPromos,\n showClubRanks = false,\n showCompetitionStage = false,\n showRoundDetail = false,\n showGroupInformation = false,\n}) => {\n const matchStatus = composeMatchStatus({\n period: mergedMatch?.period,\n delayedMatch: mergedMatch?.delayedMatch,\n });\n\n return (\n <React.Fragment key={`${matchOptaId}-match-wrapper`}>\n <StyledMatchWrapper className={classNames(params)} ref={containerRef}>\n <MatchDataLayer\n match={mergedMatch}\n useEmptyClasses\n matchOptaId={matchOptaId}\n matchPageUrl={matchPageUrl}\n matchStatus={matchStatus}\n delayedMatch={mergedMatch?.delayedMatch}\n >\n <Match\n position={position}\n hideMatchPromos={hideMatchPromos}\n showClubRanks={showClubRanks}\n showCompetitionStage={showCompetitionStage}\n showRoundDetail={showRoundDetail}\n showGroupInformation={showGroupInformation}\n />\n </MatchDataLayer>\n </StyledMatchWrapper>\n </React.Fragment>\n );\n};\n","import React from \"react\";\nimport { useQuery } from \"react-query\";\nimport { fetchClient } from \"../../../shared/api/fetching\";\nimport { mlsSingleMatchStatsAPI } from \"../../../shared/api/variables\";\nimport { useReactAppState } from \"../../../shared/containers/utils\";\nimport { mergeMlsMatchAPIResults } from \"../../../shared/match/utils\";\nimport { useContainerQuery } from \"react-container-query\";\nimport { query } from \"../../../shared/styled/Theme\";\nimport { MatchFragmentWrapper } from \"./MatchFragmentWrapper\";\n\nexport const MatchWrapper = ({\n match,\n showSecondaryTeams = false,\n showClubRanks = false,\n showCompetitionStage = false,\n showRoundDetail = false,\n showGroupInformation = false,\n hideMatchPromos = false,\n position = null,\n}) => {\n const { urlList, directoryList, apiList } = useReactAppState();\n const { statsAPI } = apiList || {};\n const { baseUrl } = urlList || {};\n const { matchHubDir } = directoryList || {};\n const { optaId: matchOptaId, competition, season, slug } = match || {};\n const { optaId: seasonOptaId } = season || {};\n const { slug: competitionSlug } = competition || {};\n const matchPageUrl = `${baseUrl}/${matchHubDir}/${competitionSlug}/${seasonOptaId}/matches/${slug}`;\n\n const [params, containerRef] = useContainerQuery(query);\n\n const mlsMatchEndpoint = mlsSingleMatchStatsAPI({ matchOptaId });\n const { data: statsMatch } = useQuery({\n queryKey: [`mls-match`, { matchOptaId }],\n queryFn: () =>\n fetchClient({ endpoint: mlsMatchEndpoint, apiURL: statsAPI }),\n select: (data) => (data && data.length > 0 ? data[0] : null),\n enabled: matchOptaId > 0 && !showSecondaryTeams,\n });\n\n const mergedMatch = React.useMemo(\n () =>\n mergeMlsMatchAPIResults({\n sportAPIMatch: match,\n statsAPIMatch: statsMatch,\n }),\n [match, statsMatch]\n );\n\n if (!mergedMatch) {\n return null;\n }\n\n return (\n <MatchFragmentWrapper\n position={position}\n matchOptaId={matchOptaId}\n matchPageUrl={matchPageUrl}\n containerRef={containerRef}\n mergedMatch={mergedMatch}\n showClubRanks={showClubRanks}\n showCompetitionStage={showCompetitionStage}\n showRoundDetail={showRoundDetail}\n showGroupInformation={showGroupInformation}\n params={params}\n hideMatchPromos={hideMatchPromos}\n />\n );\n};\n","import styled from \"styled-components\";\n\nexport const StyledMatchWrapper = styled.div`\n &.xss,\n &.xs,\n &.sm {\n .mls-c-match-list__match {\n &:hover:before {\n box-shadow: none;\n background: none;\n }\n }\n\n .mls-c-match-list__match-broadcaster {\n .mls-c-match-list__match-broadcasters {\n display: none;\n }\n }\n }\n\n &.md,\n &.lg,\n &.xl,\n &.xxl,\n &.xxxl {\n .mls-c-match-list-promo {\n width: 420px;\n\n .mls-c-match-promo {\n max-width: 420px;\n }\n }\n }\n`;\n","import React, { useEffect, useState } from 'react';\nimport { useDatepicker } from \"@datepicker-react/hooks\";\nimport { format } from 'date-fns';\nimport { CalendarContext, calendarViews, getToday, getYearsData } from \"./utils\";\nimport Month from \"./components/Month\";\nimport Months from \"./components/Months\";\nimport Years from \"./components/Years\";\nimport { trackEvent } from '../../../../libraries/_modules/tracking/helpers';\nimport { fetchClient } from \"../../api/fetching\";\nimport { orderMatchesLiteByDate } from \"../../../mls-match-list/utils\";\nimport { d3MatchesLiteAPI } from \"../../api/variables\";\nimport { useQuery } from \"react-query\";\nimport { useReactAppState } from \"../../containers/utils\";\nimport { getCultureLocalizer } from '../../utils';\n\nfunction Calendar({ items, weekRange, currentMonth, setCurrentDatePoint, closeModal, setCurrentYear, currentYear, setOrderedMatchesLite, competitionOptaId, clubOptaId, mlsPhaseType }) {\n const { apiList } = useReactAppState();\n const {\n d3SportsAPI\n } = apiList || {};\n\n const yearMatchesEndPoint = d3MatchesLiteAPI({ year: currentYear, competitionOptaId, clubOptaId, matchType: mlsPhaseType });\n\n const { data: yearMatchesData } = useQuery({\n queryKey: [`d3-year-matches-year`, {\n year: currentYear,\n competitionOptaId,\n clubOptaId,\n matchType: mlsPhaseType\n }],\n queryFn: () => fetchClient({ endpoint: yearMatchesEndPoint, apiURL: d3SportsAPI }),\n });\n\n useEffect(() => {\n if (!yearMatchesData) {\n return;\n }\n setOrderedMatchesLite(orderMatchesLiteByDate({ matchesData: yearMatchesData }));\n }, [yearMatchesData]);\n\n const [view, setView] = useState(calendarViews.days);\n const [currentDate, setCurrentDate] = useState(currentMonth);\n\n const today = getToday();\n const yearsData = getYearsData(currentDate);\n\n const { currentRange } = weekRange || {};\n\n const handleDateSelect = (date) => {\n closeModal();\n setCurrentDatePoint(date);\n\n trackEvent('date-picker-click', {\n selection: format(date, 'MMM dd yyyy', { locale: getCultureLocalizer() })\n });\n };\n\n const {\n firstDayOfWeek,\n activeMonths,\n isDateSelected,\n isDateHovered,\n isFirstOrLastSelectedDate,\n isDateBlocked,\n isDateFocused,\n focusedDate,\n onDateHover,\n onDateFocus,\n goToPreviousMonths,\n goToNextMonths,\n } = useDatepicker({\n numberOfMonths: 1,\n initialVisibleMonth: currentMonth,\n });\n\n return (\n <CalendarContext.Provider\n value={{\n yearsData,\n focusedDate,\n isDateFocused,\n isDateSelected,\n isDateHovered,\n isDateBlocked,\n setView,\n setCurrentYear,\n currentYear,\n isFirstOrLastSelectedDate,\n onDateSelect: (e, date) => {\n if (e instanceof Date) {\n handleDateSelect(e);\n } else {\n handleDateSelect(date);\n }\n },\n onTodaySelect: () => {\n handleDateSelect(today);\n },\n onDateFocus,\n onDateHover,\n items,\n currentRange,\n setCurrentDate,\n currentDate\n }}>\n <div className=\"mls-o-calendar\">\n {activeMonths.map(month => {\n return (\n view === calendarViews.days\n ? (\n <Month\n goToPreviousMonths={goToPreviousMonths}\n goToNextMonths={goToNextMonths}\n key={`${month.year}-${month.month}`}\n year={month.year}\n month={month.month}\n firstDayOfWeek={firstDayOfWeek}\n />\n )\n : view === calendarViews.months\n ? <Months key={`${month.year}-${month.month}`} />\n : <Years key={`${month.year}-${month.month}`} />\n );\n })}\n </div>\n </CalendarContext.Provider>\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 <div />;\n }\n\n return (\n <button\n onClick={onClick}\n onKeyDown={onKeyDown}\n onMouseEnter={onMouseEnter}\n tabIndex={tabIndex}\n type=\"button\"\n ref={dayRef}\n className={`mls-o-calendar__day ${isCurrentWeek ? \"mls-o-calendar__day--current-week\" : \"\"} ${isSelected ? \"mls-o-calendar__day--selected\" : \"\"}`}\n >\n {day}\n {isMatchDay ? <span className=\"mls-o-calendar__match-day\" /> : null}\n </button>\n );\n}\n\nexport default Day;\n","export { default } from './Day';\n","import React, { useEffect } from \"react\";\nimport { useMonth } from \"@datepicker-react/hooks\";\nimport { format, isWithinInterval } from \"date-fns\";\nimport Day from \"../Day\";\nimport { useCalendarData, isSameMatchDay, calendarViews } from \"../../utils\";\nimport CalendarIcon from \"../../../../svg/CalendarIcon/CalendarIcon\";\nimport { Chevron } from \"../../../../svg\";\nimport { chevronDirection } from \"../../../../svg/Svg\";\nimport { getYear } from \"../../../../../mls-match-list/utils\";\nimport { useReactAppState } from \"../../../../../shared/containers/utils\";\nimport { getCultureLocalizer } from '../../../../utils';\n\nfunction Month({ year, month, firstDayOfWeek, goToPreviousMonths, goToNextMonths }) {\n const { days, weekdayLabels, monthLabel } = useMonth({\n year,\n month,\n firstDayOfWeek,\n weekdayLabelFormat: (date) => format(date, 'ccccc', { locale: getCultureLocalizer() }),\n dayLabelFormat: (date) => format(date, \"d\"),\n monthLabelFormat: (date) => format(date, 'MMMM YYY', { locale: getCultureLocalizer() })\n });\n const { t } = useReactAppState();\n const {\n items,\n currentRange,\n setView,\n onTodaySelect,\n setCurrentYear,\n currentYear\n } = useCalendarData();\n\n useEffect(() => {\n if (year !== currentYear) {\n setCurrentYear(year);\n }\n }, [year]);\n\n const { dateRangeStart, dateRangeEnd } = currentRange || {};\n\n return (\n <div className=\"mls-o-calendar__month-view\">\n <div className=\"mls-o-calendar__header\">\n <button type=\"button\" className=\"mls-o-calendar__prev-month\" onClick={goToPreviousMonths}>\n <Chevron direction={chevronDirection.left} />\n </button>\n <button type=\"button\" onClick={() => setView(calendarViews.months)} className=\"mls-o-calendar__title\">\n <CalendarIcon />\n <span className=\"mls-o-calendar__title-label\">{monthLabel}</span>\n </button>\n <button type=\"button\" className=\"mls-o-calendar__next-month\" onClick={goToNextMonths}>\n <Chevron direction={chevronDirection.right} />\n </button>\n </div>\n <div className=\"mls-o-calendar__day-labels\"\n >\n {weekdayLabels.map((dayLabel, index) => {\n return (\n <div className=\"mls-o-calendar__weekday-label\" key={`${dayLabel}-${index}`}>\n {dayLabel}\n </div>\n );\n })}\n </div>\n <div className=\"mls-o-calendar__day-grid\">\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 <Day date={day.date} key={`${day.dayLabel}-${index}`} day={day.dayLabel} isCurrentWeek={isCurrentWeek} isMatchDay={isMatchDay} />;\n })\n }\n </div>\n <button onClick={onTodaySelect} className=\"mls-o-calendar__today\">{t('today')}</button>\n </div>\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 <button onClick={(e) => onDateSelect(e, month)} className={`mls-o-calendar__month ${currentMonth === formattedMonth ? \"mls-o-calendar__month--current-month\" : \"\"}`} key={formattedMonth}>{formattedMonth}</button>;\n })\n );\n }, [startAndEndOfYear]);\n\n return (\n <div className=\"mls-o-calendar__months-view\">\n <div className=\"mls-o-calendar__header\">\n <button type=\"button\" className=\"mls-o-calendar__prev-month\" onClick={() => setCurrentDate(subYears(currentDate, 1))}>\n <Chevron direction={chevronDirection.left} />\n </button>\n <button type=\"button\" onClick={() => setView(calendarViews.years)} className=\"mls-o-calendar__title\">\n <CalendarIcon />\n <span className=\"mls-o-calendar__title-label\">{toYear}</span>\n </button>\n <button type=\"button\" className=\"mls-o-calendar__next-month\" onClick={() => setCurrentDate(addYears(currentDate, 1))}>\n <Chevron direction={chevronDirection.right} />\n </button>\n </div>\n\n <div className=\"mls-o-calendar__month-grid\">\n {monthList}\n </div>\n <button onClick={onTodaySelect} className=\"mls-o-calendar__today\">{t(\"today\")}</button>\n </div>\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 <div className=\"mls-o-calendar__years-view\">\n <div className=\"mls-o-calendar__header\">\n <button type=\"button\" className=\"mls-o-calendar__prev-month\" onClick={() => setCurrentDate(subYears(currentDate, 7))}>\n <Chevron direction={chevronDirection.left} />\n </button>\n <button type=\"button\" onClick={() => setView(calendarViews.days)} className=\"mls-o-calendar__title\">\n <CalendarIcon />\n <span className=\"mls-o-calendar__title-label\">{yearsLabel}</span>\n </button>\n <button type=\"button\" className=\"mls-o-calendar__next-month\" onClick={() => setCurrentDate(addYears(currentDate, 7))}>\n <Chevron direction={chevronDirection.right} />\n </button>\n </div>\n\n <div className=\"mls-o-calendar__month-grid\">\n {\n yearsRange\n ? yearsRange.map(year => {\n const formattedYear = format(year, 'y');\n\n return <button onClick={(e) => onDateSelect(e, year)} className={`mls-o-calendar__year ${currentYear === formattedYear ? \"mls-o-calendar__year--current-year\" : \"\"}`} key={formattedYear}>{formattedYear}</button>;\n })\n : null\n }\n </div>\n <button onClick={onTodaySelect} className=\"mls-o-calendar__today\">{t(\"today\")}</button>\n </div>\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 <Calendar />');\n }\n return context;\n}\n\nexport function isSameMatchDay(items, matchDay) {\n if (!items) {\n return null;\n }\n\n return items.find(item => {\n const date = parseISO(item.date);\n\n return isSameDay(date, matchDay);\n });\n}\n\nexport function getToday() {\n return useMemo(() => startOfToday(), []);\n}\n\nexport function getStartAndEndOfYear(currentYear) {\n if (!currentYear || !(currentYear instanceof Date)) {\n return { start: null, end: null };\n }\n\n return {\n start: startOfYear(currentYear),\n end: endOfYear(currentYear)\n };\n}\n\nexport function getYearsData(currentMonth) {\n return useMemo(() => {\n const previousYears = [];\n const nextYears = [];\n\n for (let i = 6; i > 0; i--) {\n const temp = subYears(currentMonth, i);\n previousYears.push(temp);\n }\n\n for (let i = 1; i < 6; i++) {\n const temp = addYears(currentMonth, i);\n nextYears.push(temp);\n }\n\n const yearsRange = [...previousYears, currentMonth, ...nextYears];\n const formatFirstYear = format(yearsRange[0], 'y');\n const formatLastYear = format(yearsRange[yearsRange.length - 1], 'y');\n\n return {\n yearsRange,\n yearsLabel: `${formatFirstYear} - ${formatLastYear}`\n };\n }, [currentMonth]);\n}\n\nexport const calendarViews = {\n months: 'months',\n days: 'days',\n years: 'years'\n};\n","import React, { useLayoutEffect, useMemo, useRef, useState } from \"react\";\nimport { checkIfObject } from \"../../../../libraries/_helpers\";\nimport useResize from \"../../hooks/useResize\";\nimport { trackFilterClick } from '../../../../libraries/_modules/tracking/helpers';\nimport { translateTypes } from \"../../utils\";\nimport { useReactAppState } from \"../../containers/utils\";\n\nfunction findOption({ items, value, valueKey }) {\n if (!value || !items || items.length === 0) {\n return;\n }\n\n const matchedOption = (items || []).find((item) => {\n if ((valueKey && item[valueKey] && item[valueKey].toString() === value?.toString()) || item?.toString() === value?.toString()) {\n return item;\n }\n });\n\n return matchedOption ? matchedOption : items[0];\n}\n\nconst trackClick = (statsCategory, filterType, clickItem) => {\n trackFilterClick({ statsCategory, filterType, clickItem });\n};\n\nconst Dropdown = ({ extraClass, onChangeFn, items, type, currentValue, valueKey, displayKey, autoWidth = true, disabled = false, ariaLabel = \"\", title = \"\" }) => {\n const optionFound = useMemo(() => findOption({ items, value: currentValue, valueKey }), [items, currentValue, valueKey]);\n\n const ref = useRef(null);\n const { t } = useReactAppState() || {};\n\n function handleResize() {\n if (ref?.current && autoWidth) {\n setWidth(ref.current.offsetWidth + 48);\n }\n }\n\n const [width, setWidth] = useState(\"auto\");\n const [selectedOption, setSelectedOption] = useState(optionFound);\n\n useLayoutEffect(() => {\n setSelectedOption(optionFound);\n }, [items, currentValue]);\n\n useLayoutEffect(() => {\n handleResize();\n }, [items, selectedOption]);\n\n useResize(handleResize, 1000);\n\n const handleChange = React.useCallback((e) => {\n onChangeFn(e.target.value);\n trackClick('schedule', type, e.target.options[e.target.selectedIndex].innerText);\n }, [onChangeFn], []);\n\n return (\n <>\n <select\n onChange={handleChange}\n value={currentValue}\n style={{ width }}\n aria-label={ariaLabel}\n title={title}\n className={`mls-o-buttons__dropdown-button mls-o-buttons__dropdown-button--right ${extraClass ? extraClass : \"\"}`} disabled={disabled} >\n {\n items\n ? items.map((item, index) => {\n const isObject = checkIfObject(item);\n return (\n <option\n className=\"mls-o-buttons__dropdown-item\"\n value={isObject && valueKey != null\n ? item[valueKey]\n : item}\n key={`${isObject && valueKey != null\n ? item[valueKey]\n : isObject\n ? JSON.stringify(item)\n : item\n }${index}`}\n >\n {isObject ? translateTypes(t, item[displayKey]) : translateTypes(t, item)}\n </option>\n );\n })\n : null\n }\n </select>\n <div className=\"mls-o-buttons__dropdown-hidden\">\n <span ref={ref} style={{ visibility: \"hidden\" }}>\n {\n displayKey && selectedOption && selectedOption[displayKey]\n ? translateTypes(t, selectedOption[displayKey])\n : translateTypes(t, selectedOption)\n }\n </span>\n </div>\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 <div {...otherProps} data-testid={\"loading\"} className={`mls-o-loading mls-o-loading--glow mls-o-loading--${type} mls-o-loading--${width}`} />;\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 <StyledMatchTile className={`mls-c-match-tile --${status?.abbreviation}`}>\n <ClubV2\n className={!isHomeWinner && isAwayWinner ? \"--home-loser\" : \"\"}\n clubData={homeClubData}\n isHome\n hasAbbreviation={hasAbbreviation}\n hasFullName={hasFullName}\n hasShortName={hasShortName}\n rank={homeClubRank}\n />\n {hideScorebug ? (\n <StyledEmptyScorebug />\n ) : (\n <Scorebug\n homeScore={homeScore}\n awayScore={awayScore}\n abbreviateStatus={abbreviateStatus}\n />\n )}\n <ClubV2\n className={!isAwayWinner && isHomeWinner ? \"--away-loser\" : \"\"}\n clubData={awayClubData}\n isHome={false}\n hasAbbreviation={hasAbbreviation}\n hasFullName={hasFullName}\n hasShortName={hasShortName}\n rank={awayClubRank}\n />\n </StyledMatchTile>\n );\n}\n\n// eslint-disable-next-line no-const-assign,no-func-assign\nMatchTile = React.memo(MatchTile);\n\nexport default MatchTile;\n","import styled from \"styled-components\";\nimport { themeTypes } from \"../../styled/Theme\";\n\nexport const StyledMatchTile = styled.div`\n display: flex;\n align-items: center;\n\n .mls-c-club__picture {\n margin-top: 4px;\n }\n\n .--home .mls-c-club__abbreviation {\n width: 74px;\n text-align: right;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .--away .mls-c-club__abbreviation {\n width: 74px;\n text-align: left;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n &.--post .--home-loser,\n &.--post .--away-loser {\n color: ${(props) =>\n props.theme.type == themeTypes.light\n ? props.theme.figma.base.color_offblack_50\n : props.theme.figma.base.color_offwhite_50};\n }\n`;\n\nexport const StyledEmptyScorebug = styled.div`\n width: 60px;\n`;\n","import React from 'react';\nimport ToggleButton from \"../ToggleButton\";\nimport Picture from \"../Picture\";\nimport { formatImageUrl } from \"../../utils\";\n\nfunction Sponsor({ openInNewTab, accessibleText, url, templateUrl, displayText, hasPresBy }) {\n const { highQuality } = templateUrl ? formatImageUrl(templateUrl, { format: \"w_175,c_scale\", extension: \"f_png\" }) : {};\n\n return (\n highQuality ? (\n (url) ? (<ToggleButton\n target={`${openInNewTab ? \"_blank\" : \"_self\"}`}\n rel={`${openInNewTab ? \"noopener noreferrer\" : \"\"}`}\n alt={`${accessibleText ? accessibleText : \"\"}`}\n href={url} className=\"mls-o-sponsor\">\n {\n hasPresBy\n ? <div className=\"mls-o-sponsor__label\">{displayText ? displayText : \"Presented By\"}</div>\n : null\n }\n <Picture src={highQuality} title=\"sponsor\" loadingSrc={null} fallbackSrc={null} extraClasses=\"mls-o-sponsor__image\" />\n </ToggleButton>)\n :\n (<span className=\"mls-o-sponsor\">\n {\n hasPresBy\n ? <div className=\"mls-o-sponsor__label\">{displayText ? displayText : \"Presented By\"}</div>\n : null\n }\n <Picture src={highQuality} title=\"sponsor\" loadingSrc={null} fallbackSrc={null} extraClasses=\"mls-o-sponsor__image\" />\n </span>)\n ) : null\n );\n}\n\nexport default Sponsor;\n","export { default } from './Sponsor';\n","import React from \"react\";\nimport {\n StyledMatchPromo,\n StyledMatchPromoDescription,\n StyledMatchPromoTitle,\n} from \"./StyledMatchPromo\";\nimport MatchPromoButton from \"./MatchPromoButton/MatchPromoButton\";\n\nfunction MatchPromo({ headline, description, callToAction1, callToAction2 }) {\n return (\n <StyledMatchPromo className=\"mls-c-match-promo\">\n {headline && <StyledMatchPromoTitle>{headline}</StyledMatchPromoTitle>}\n {description && (\n <StyledMatchPromoDescription>{description}</StyledMatchPromoDescription>\n )}\n {callToAction1 && <MatchPromoButton callToAction={callToAction1} />}\n {callToAction2 && <MatchPromoButton callToAction={callToAction2} />}\n </StyledMatchPromo>\n );\n}\n\nexport default MatchPromo;\n","import React from \"react\";\nimport { Link } from \"../../../Link/Link\";\nimport { StyledMatchPromoButton } from \"./StyledMatchPromoButton\";\n\nfunction MatchPromoButton({ callToAction }) {\n if (!callToAction.displayText || !callToAction.url) {\n return null;\n }\n\n return (\n <Link\n url={callToAction.url}\n alt={callToAction.accessibleText}\n target={callToAction.openInNewTab ? \"_blank\" : \"_self\"}\n rel={callToAction.openInNewTab ? \"noopener noreferrer\" : \"\"}\n >\n <StyledMatchPromoButton className=\"mls-c-match-promo__promo-link-button\">\n {callToAction.displayText}\n </StyledMatchPromoButton>\n </Link>\n );\n}\n\nexport default MatchPromoButton;\n","import styled from \"styled-components\";\n\nexport const StyledMatchPromoButton = styled.div`\n width: 100%;\n height: 26px;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n margin-left: auto;\n margin-right: auto;\n color: ${({ theme }) => theme.rgba.white_120};\n line-height: ${({ theme }) => theme.mixins.pxToRem(12)};\n font-size: ${({ theme }) => theme.mixins.pxToRem(11)};\n font-weight: 500;\n font-style: normal;\n box-shadow: 0px 1px 2px 2px rgba(0, 0, 0, 0.07),\n 0px 0px 0px 0px rgba(0, 0, 0, 0.16);\n border-radius: 4px;\n background-color: ${({ theme }) => theme.rgba.white_100};\n`;\n","import React from \"react\";\nimport {\n StyledMatchPromoLabel,\n StyledMatchPromoLabelPrefix,\n StyledMatchPromoText,\n} from \"./StyledMatchPromoLink\";\nimport { Link } from \"../../../Link/Link\";\n\nfunction MatchPromoLink({ callToAction, prefix }) {\n if (!callToAction.displayText || !callToAction.url) {\n return null;\n }\n\n return (\n <StyledMatchPromoLabel className=\"mls-c-match-promo__promo-link\">\n {prefix && (\n <StyledMatchPromoLabelPrefix>{prefix} </StyledMatchPromoLabelPrefix>\n )}\n <Link\n url={callToAction.url}\n alt={callToAction.accessibleText}\n target={callToAction.openInNewTab ? \"_blank\" : \"_self\"}\n rel={callToAction.openInNewTab ? \"noopener noreferrer\" : \"\"}\n >\n <StyledMatchPromoText>{callToAction.displayText}</StyledMatchPromoText>\n </Link>\n </StyledMatchPromoLabel>\n );\n}\n\nexport default MatchPromoLink;\n","import styled from \"styled-components\";\n\nexport const StyledMatchPromoLink = styled.div`\n text-align: center;\n`;\n\nexport const StyledMatchPromoLabel = styled.div`\n display: block;\n color: ${({ theme }) => theme.rgba.black_100_40};\n font-family: ${(props) => props.theme.figma.base.fontfamily_mlstifo_standard};\n line-height: ${({ theme }) => theme.mixins.pxToRem(16.5)};\n font-weight: 500;\n font-size: ${({ theme }) =>\n theme.mixins.pxToRem(theme.figma.base.scale_1_375)};\n`;\n\nexport const StyledMatchPromoLabelPrefix = styled.span``;\n\nexport const StyledMatchPromoText = styled.span`\n text-decoration: underline;\n`;\n","import styled from \"styled-components\";\n\nexport const StyledMatchPromo = styled.div`\n font-family: ${(props) => props.theme.figma.base.fontfamily_mlstifo_standard};\n color: ${({ theme }) => theme.rgba.black_100_50};\n\n a:first-child {\n .mls-c-match-promo__promo-link-button {\n margin-top: 0px;\n }\n }\n`;\n\nexport const StyledMatchPromoTitle = styled.span`\n display: block;\n font-size: ${({ theme }) => theme.mixins.pxToRem(12)};\n font-weight: 700;\n line-height: ${({ theme }) => theme.mixins.pxToRem(18)};\n`;\n\nexport const StyledMatchPromoDescription = styled.span`\n display: block;\n font-size: ${({ theme }) => theme.mixins.pxToRem(12)};\n font-weight: 400;\n line-height: ${({ theme }) => theme.mixins.pxToRem(18)};\n`;\n","import styled from \"styled-components\";\n\nexport const StyledSupportCopyCompact = styled.div`\n display: flex;\n align-items: center;\n justify-content: center;\n width: 191px;\n`;\n\nexport const StyledSupportCopyText = styled.div`\n display: inline-block;\n max-width: 137px;\n color: ${({ theme }) => theme.rgba.black_100_50};\n font-weight: 500;\n text-align: center;\n font-family: ${(props) => props.theme.figma.base.fontfamily_mlstifo_standard};\n font-size: ${({ theme }) =>\n theme.mixins.pxToRem(theme.figma.base.scale_1_375)};\n`;\n\nexport const StyledSponsorWrapper = styled.div`\n max-width: 64px;\n max-height: 28px;\n\n picture {\n img.mls-o-sponsor__image {\n width: 100%;\n height: 28px;\n object-fit: contain;\n }\n }\n`;\n\nexport const StyledDivider = styled.div`\n height: 30px;\n margin: 0 12px;\n border-right: 1px solid ${({ theme }) => theme.rgba.black_33_25};\n`;\n","import React from \"react\";\nimport {\n StyledDivider,\n StyledSupportCopyCompact,\n StyledSupportCopyText,\n} from \"./StyledSupportCopyCompact\";\nimport SupportCopyLogo from \"./SupportCopyLogo\";\n\nfunction SupportCopyCompact({ assetUrl, displayText }) {\n return (\n <StyledSupportCopyCompact className=\"mls-c-match-promo__support-compact\">\n {displayText && (\n <StyledSupportCopyText className=\"mls-c-match-promo__support-compact__display-text\">\n {displayText}\n </StyledSupportCopyText>\n )}\n {displayText && assetUrl && <StyledDivider />}\n {assetUrl && <SupportCopyLogo />}\n </StyledSupportCopyCompact>\n );\n}\n\nexport default SupportCopyCompact;\n","import React from \"react\";\nimport { useMatchData } from \"../../../../mls-match-list/utils\";\nimport { StyledSponsorWrapper } from \"./StyledSupportCopyCompact\";\nimport SponsorV2 from \"../SponsorV2\";\n\nfunction SupportCopyLogo() {\n const { promoInfo } = useMatchData();\n const { sponsorImage, promotionalSponsor } = promoInfo;\n const { assetUrl } = sponsorImage || {};\n\n return (\n <StyledSponsorWrapper className=\"mls-c-support-copy__sponsor-logo\">\n <SponsorV2\n hasPresBy={false}\n templateUrl={assetUrl}\n url={promotionalSponsor?.url}\n accessibleText={promotionalSponsor?.accessibleText}\n openInNewTab={promotionalSponsor?.openInNewTab}\n />\n </StyledSponsorWrapper>\n );\n}\n\nexport default SupportCopyLogo;\n","import React, { useEffect, useState } from \"react\";\nimport { statTypes, tableTypes } from \"../components/Table/utils\";\nimport { filterTypes } from \"../utils\";\n\nexport const actionTypes = {\n season: 'season',\n competitionOptaId: 'competitionOptaId',\n competitionSlug: 'competitionSlug',\n badgeCount: 'badgeCount',\n club: 'club',\n clubOptaId: 'clubOptaId',\n clubs: 'clubs',\n position: 'position',\n appearances: 'appearances',\n route: \"route\",\n dateRange: \"dateRange\",\n versus: \"versus\",\n weather: \"weather\",\n phase: \"phase\",\n reset: \"reset\",\n apply: \"apply\",\n statType: \"statType\",\n currentQueryType: \"currentQueryType\",\n page: \"page\",\n desc: \"desc\",\n round: \"round\",\n clubSlug: \"clubSlug\"\n};\n\nexport function filterReducer(state, action) {\n switch (action.type) {\n case actionTypes.season: {\n if (state.season === action.payload) {\n return { ...state, season: action.payload };\n }\n return { ...state, page: 0, season: action.payload };\n }\n case actionTypes.desc: {\n const { desc, statType } = action.payload;\n if (state.desc !== desc || state.statType !== statType) {\n return { ...state, page: 0, statType, desc };\n }\n\n return { ...state, desc, statType };\n }\n case actionTypes.page: {\n return { ...state, page: action.payload };\n }\n case actionTypes.competitionOptaId: {\n if (state.competitionOptaId === action.payload) {\n return { ...state, competitionOptaId: action.payload };\n }\n return { ...state, page: 0, competitionOptaId: action.payload };\n }\n case actionTypes.competitionSlug: {\n if (state.competitionSlug === action.payload) {\n return { ...state, competitionSlug: action.payload };\n }\n\n const matchCompetition = state?.competitions.find(competition => competition.slug === action.payload);\n\n const { optaId, mlsPhaseType } = matchCompetition || {};\n const competitionOptaId = optaId + \"\";\n return { ...state, page: 0, competitionSlug: action.payload, competitionOptaId, mlsPhaseType };\n }\n case actionTypes.badgeCount: {\n return { ...state, badgeCount: action.payload };\n }\n case actionTypes.club: {\n if (state.club === action.payload) {\n return { ...state, club: action.payload };\n }\n return { ...state, page: 0, club: action.payload };\n }\n case actionTypes.clubOptaId: {\n const clubOptaId = action.payload + \"\";\n // if (state.clubOptaId === clubOptaId) {\n // return { ...state, clubOptaId };\n // }\n return { ...state, page: 0, clubOptaId };\n }\n case actionTypes.clubs: {\n return { ...state, clubs: action.payload };\n }\n case actionTypes.position: {\n if (state.position === action.payload) {\n return { ...state, position: action.payload };\n }\n return { ...state, page: 0, position: action.payload };\n }\n case actionTypes.appearances: {\n if (state.appearances === action.payload) {\n return { ...state, appearances: action.payload };\n }\n return { ...state, page: 0, appearances: action.appearances };\n }\n case actionTypes.route: {\n if (state.route === action.payload) {\n return { ...state, route: action.payload };\n }\n return { ...state, page: 0, route: action.payload };\n }\n case actionTypes.weather: {\n if (state.weather === action.payload) {\n return { ...state, weather: action.payload };\n }\n return { ...state, page: 0, weather: action.payload };\n }\n case actionTypes.dateRange: {\n if (state.dateRange === action.payload) {\n return { ...state, dateRange: action.payload };\n }\n return { ...state, page: 0, dateRange: action.payload };\n }\n case actionTypes.versus: {\n if (state.versus === action.payload) {\n return { ...state, versus: action.payload };\n }\n return { ...state, page: 0, versus: action.payload };\n }\n case actionTypes.apply: {\n return { ...state, ...action.payload };\n }\n case actionTypes.statType: {\n return { ...state, statType: action.payload };\n }\n case actionTypes.currentQueryType: {\n const currentQueryType = action.payload;\n if (state.currentQueryType !== currentQueryType) {\n if (currentQueryType === statTypes.statsDefending) {\n return { ...state, page: 0, statType: \"goals_conceded\", currentQueryType };\n }\n if (currentQueryType === statTypes.statsPassing) {\n return { ...state, page: 0, statType: \"accurate_pass\", currentQueryType };\n }\n if (currentQueryType === statTypes.clubStatsGoalKeeping) {\n return { ...state, page: 0, statType: \"saves\", currentQueryType };\n }\n return { ...state, page: 0, statType: \"goals\", currentQueryType };\n }\n else {\n return { ...state };\n }\n }\n case actionTypes.round: {\n return { ...state, round: action.payload };\n }\n case actionTypes.clubSlug: {\n return { ...state, clubSlug: action.payload };\n }\n case actionTypes.reset: {\n return { ...state, ...action.payload };\n }\n default: {\n throw new Error(`Unsupported type: ${action.type}`);\n }\n }\n}\n\nexport function useFilters({ initialState, reducer = filterReducer } = {}) {\n const { current: initialStateRef } = React.useRef(initialState);\n const [state, dispatch] = React.useReducer(reducer, initialStateRef);\n const [badgeCount, setBadgeCount] = useState(state.badgeCount);\n\n const updateFilter = (type) => (payload) => dispatch({ type, payload });\n const reset = (payload) => dispatch({ type: 'reset', payload });\n\n useEffect(() => {\n let counter = 0;\n\n if (state.tableType === tableTypes.players) {\n if (state.weather !== filterTypes.all) {\n counter++;\n }\n\n if (state.dateRange !== filterTypes.all) {\n counter++;\n }\n\n if (state.versus !== filterTypes.all) {\n counter++;\n }\n\n if (state.appearances !== filterTypes.all) {\n counter++;\n }\n\n if (state.position !== filterTypes.all) {\n counter++;\n }\n\n if (!state.preSelectedClub && state.clubOptaId !== filterTypes.allClubs) {\n counter++;\n }\n }\n\n setBadgeCount(counter);\n }, [state]);\n\n return {\n state,\n reset,\n badgeCount,\n updateFilter,\n initialStateRef,\n };\n}\n","import React, { useRef, useCallback } from \"react\";\nimport usePortal from \"react-useportal\";\nimport { parseCSSText } from \"../../../libraries/_helpers\";\n\nexport const useModal = ({ onOpen, onClose, background, querySelector = 'body', ...config } = {}) => {\n const { customStyle } = config || {};\n\n const modalStyle = `\n position: fixed;\n left: 50%;\n top: 50%;\n transform: translate(-50%,-50%);\n z-index: 1000;\n `;\n\n const backgroundStyle = `\n position: fixed;\n background: ${background || \"transparent\"};\n\n width: 100vw;\n height: 100vh;\n top: 0;\n left: 0;\n z-index: 1000;\n `;\n\n const modal = useRef();\n\n const { isOpen, togglePortal, openPortal, closePortal, Portal, portalRef } = usePortal({\n onOpen(event) {\n const { portal } = event;\n portal.current.style.cssText = background\n ? backgroundStyle\n : customStyle\n ? customStyle\n : modalStyle;\n if (onOpen) onOpen(event);\n },\n onClose(event) {\n const { portal } = event;\n portal.current.removeAttribute(\"style\");\n if (onClose) onClose(event);\n },\n onPortalClick({ target }) {\n const clickingOutsideModal =\n modal && modal.current && !modal.current.contains(target);\n if (clickingOutsideModal) closePortal();\n },\n ...config\n });\n\n const ModalWithBackground = useCallback(\n props => (\n <Portal>\n <div ref={modal} style={parseCSSText(modalStyle)} {...props} />\n </Portal>\n ),\n [modalStyle]\n );\n\n const Modal = background ? ModalWithBackground : Portal;\n\n return Object.assign([openPortal, closePortal, isOpen, Modal, togglePortal], {\n Modal,\n toggleModal: togglePortal,\n openModal: openPortal,\n closeModal: closePortal,\n isOpen,\n portalRef\n });\n};\n\nexport default useModal;\n","import React from 'react';\n\nconst BroadcastIcon = ({ extraClasses, size = \"small\" }) => {\n return (\n <span\n role=\"img\"\n className={`mls-o-svg transform ${extraClasses ? extraClasses : \"\"}`}>\n <span className={`oc-o-icon--broadcast icon-svg fa-icon-svg fa-icon-svg--${size}`}>\n <svg viewBox=\"0 0 11 10\">\n <g\n transform=\"translate(-138 -68)\"\n fill=\"none\"\n fillRule=\"evenodd\"\n >\n <path stroke=\"#707576\" d=\"M139 68.5h9V74h-9z\" />\n <path\n stroke=\"#707576\"\n strokeLinecap=\"square\"\n d=\"M143.5 74.375v2.25m1.923 0h-3.846\"\n />\n </g>\n </svg>\n </span>\n </span>\n );\n};\n\nexport default BroadcastIcon;\n","export { default } from './BroadcastIcon';\n","import React from 'react';\n\nconst CalendarIcon = ({ extraClasses, size = \"small\", ...otherProps }) => {\n return (\n <span\n role=\"img\"\n className={`mls-o-svg transform ${extraClasses ? extraClasses : \"\"}`}\n {...otherProps}\n >\n <span className={`oc-o-icon--calendar icon-svg fa-icon-svg fa-icon-svg--${size}`}>\n <svg viewBox=\"0 0 30 30\">\n <path\n fill=\"#383632\"\n d=\"M19.93 8.66V4.35h-1v5.22l1-.91zm-9.06.05V4.35h-1v5.27l1-.91z\"\n />\n <circle fill=\"#383632\" cx={10.36} cy={12.25} r={0.96} />\n <circle fill=\"#383632\" cx={14.97} cy={12.25} r={0.96} />\n <circle fill=\"#383632\" cx={19.48} cy={12.25} r={0.96} />\n <circle fill=\"#383632\" cx={10.36} cy={15.62} r={0.96} />\n <circle fill=\"#383632\" cx={14.97} cy={15.62} r={0.96} />\n <circle fill=\"#383632\" cx={19.48} cy={15.62} r={0.96} />\n <circle fill=\"#383632\" cx={10.36} cy={18.99} r={0.96} />\n <circle fill=\"#383632\" cx={14.97} cy={18.99} r={0.96} />\n <circle fill=\"#383632\" cx={19.48} cy={18.99} r={0.96} />\n <path\n fill=\"#383632\"\n d=\"M25.1 22.22V6.61h-19L4.84 7.86v15.73H24zM5.84 7.61H24.1v15H5.84z\"\n />\n </svg>\n </span>\n </span>\n );\n};\n\nexport default CalendarIcon;\n","import React from 'react';\n\nconst ExternalLinkIcon = ({ handleClick, extraClasses, size = \"small\" }) => {\n return (\n <button\n role=\"img\"\n onClick={handleClick}\n className={`mls-o-svg transform ${extraClasses ? extraClasses : \"\"}`}>\n <span className={`oc-o-icon--external-link icon-svg fa-icon-svg fa-icon-svg--${size}`}>\n <svg viewBox=\"0 0 12 12\" xmlns=\"http://www.w3.org/2000/svg\">\n <g fill=\"#707576\" fillRule=\"nonzero\" opacity=\".6\">\n <path d=\"M.527 1.09A.518.518 0 000 1.615v9.84c0 .298.228.526.527.526h9.839a.518.518 0 00.527-.527V5.833H9.84v5.095H1.054V2.143H6.15V1.09c0 .018-5.622.018-5.622 0z\" />\n <path d=\"M5.99 6.624l4.849-4.832v1.95h1.054V0h-3.76v1.054h1.95L5.252 5.886z\" />\n </g>\n </svg>\n </span>\n </button>\n );\n};\n\nexport default ExternalLinkIcon;\n","export { default } from './ExternalLinkIcon';\n","import React from \"react\";\n\nexport const TVIcon = ({ 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 11 10\"\n fill=\"none\"\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M5.10002 9.14999V6.84999H0.150024V0.149994H10.85V6.84999H5.90002V9.14999H7.85002V9.84999H3.15002V9.14999H5.10002ZM10.05 0.949994H0.950025V6.04999H10.05V0.949994Z\"\n fill=\"#212121\"\n />\n </svg>\n </span>\n );\n};\n","import React from \"react\";\n\nexport const TicketIconV2 = ({ width, height, extraClasses = \"\", viewBox = \"0 0 17 17\" }) => {\n return (\n <span role=\"img\" className={extraClasses}>\n <svg\n width={width || \"17\"}\n height={height || \"17\"}\n viewBox={viewBox}\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M16.2068 6.70238L14.0481 4.55131L13.7745 4.81734C13.6513 4.95009 13.503 5.05707 13.3382 5.13207C13.1734 5.20707 12.9953 5.24861 12.8143 5.25426C12.6333 5.25992 12.453 5.22959 12.2838 5.16502C12.1146 5.10046 11.9599 5.00295 11.8287 4.87815C11.7032 4.74678 11.6049 4.59185 11.5396 4.4223C11.4743 4.25276 11.4432 4.07196 11.4482 3.89034C11.4531 3.70872 11.494 3.52988 11.5684 3.36414C11.6429 3.1984 11.7494 3.04905 11.8819 2.9247L12.1555 2.65867L9.99684 0.5L4.889 5.60784L0.199219 10.2976L2.35789 12.4563L2.62392 12.1903C2.85782 11.965 3.15007 11.8097 3.46763 11.7418C3.6696 11.7086 3.87667 11.7259 4.07032 11.7922C4.26398 11.8585 4.43818 11.9718 4.57737 12.1219C4.70022 12.2359 4.79912 12.3733 4.86829 12.526C4.93746 12.6787 4.97551 12.8436 4.98022 13.0112C4.96395 13.4113 4.79855 13.7909 4.51656 14.0753L4.25053 14.3489L6.40159 16.5L10.9622 11.9394L16.2068 6.70238ZM5.29946 14.3033C5.57458 13.9189 5.72814 13.4609 5.74031 12.9884C5.73642 12.7219 5.67928 12.4588 5.57224 12.2147C5.46521 11.9706 5.31043 11.7504 5.11703 11.567C4.89449 11.3264 4.61477 11.1459 4.30383 11.0422C3.9929 10.9386 3.66082 10.9151 3.33841 10.9741C2.99284 11.0387 2.66581 11.1789 2.38069 11.3846L1.27095 10.2976L5.15504 6.42114L9.99684 1.57173L11.099 2.68147C10.7826 3.07865 10.6266 3.58002 10.6617 4.08661C10.6969 4.59319 10.9207 5.06818 11.289 5.41781C11.6405 5.78341 12.1158 6.00472 12.6219 6.03846C13.1279 6.0722 13.6284 5.91594 14.0253 5.60024L15.1275 6.70238L11.2662 10.5713L10.7417 10.0468L10.2097 10.5865L10.7265 11.1033L10.5593 11.2705L10.4301 11.3998L10.2857 11.5518L6.40159 15.4283L5.29946 14.3033Z\"\n fill=\"#212121\"\n />\n <path\n d=\"M6.44787 5.74463L7.5196 6.82396L6.97994 7.34083L5.9082 6.2843L6.44787 5.74463Z\"\n fill=\"#212121\"\n />\n <path\n d=\"M8.56136 7.89551L9.6407 8.96724L9.10103 9.50691L8.0293 8.43518L8.56136 7.89551Z\"\n fill=\"#212121\"\n />\n </svg>\n </span>\n );\n};\n"],"names":[],"sourceRoot":""}