;\n}\n\nexport const withUtils = () => (Component: React.ComponentType
) => {\n const WithUtils: React.SFC> = props => {\n const utils = useUtils();\n return ;\n };\n\n WithUtils.displayName = `WithUtils(${Component.displayName || Component.name})`;\n return WithUtils;\n};\n","import * as React from 'react';\nimport * as PropTypes from 'prop-types';\nimport Day from './Day';\nimport DayWrapper from './DayWrapper';\nimport CalendarHeader from './CalendarHeader';\nimport CircularProgress from '@material-ui/core/CircularProgress';\nimport SlideTransition, { SlideDirection } from './SlideTransition';\nimport { Theme } from '@material-ui/core/styles';\nimport { VariantContext } from '../../wrappers/Wrapper';\nimport { MaterialUiPickersDate } from '../../typings/date';\nimport { runKeyHandler } from '../../_shared/hooks/useKeyDown';\nimport { IconButtonProps } from '@material-ui/core/IconButton';\nimport { withStyles, WithStyles } from '@material-ui/core/styles';\nimport { findClosestEnabledDate } from '../../_helpers/date-utils';\nimport { withUtils, WithUtilsProps } from '../../_shared/WithUtils';\n\nexport interface OutterCalendarProps {\n /** Left arrow icon */\n leftArrowIcon?: React.ReactNode;\n /** Right arrow icon */\n rightArrowIcon?: React.ReactNode;\n /** Custom renderer for day @DateIOType */\n renderDay?: (\n day: MaterialUiPickersDate,\n selectedDate: MaterialUiPickersDate,\n dayInCurrentMonth: boolean,\n dayComponent: JSX.Element\n ) => JSX.Element;\n /**\n * Enables keyboard listener for moving between days in calendar\n * @default true\n */\n allowKeyboardControl?: boolean;\n /**\n * Props to pass to left arrow button\n * @type {Partial}\n */\n leftArrowButtonProps?: Partial;\n /**\n * Props to pass to right arrow button\n * @type {Partial}\n */\n rightArrowButtonProps?: Partial;\n /** Disable specific date @DateIOType */\n shouldDisableDate?: (day: MaterialUiPickersDate) => boolean;\n /** Callback firing on month change. Return promise to render spinner till it will not be resolved @DateIOType */\n onMonthChange?: (date: MaterialUiPickersDate) => void | Promise;\n /** Custom loading indicator */\n loadingIndicator?: JSX.Element;\n}\n\nexport interface CalendarProps\n extends OutterCalendarProps,\n WithUtilsProps,\n WithStyles {\n /** Calendar Date @DateIOType */\n date: MaterialUiPickersDate;\n /** Calendar onChange */\n onChange: (date: MaterialUiPickersDate, isFinish?: boolean) => void;\n /** Min date @DateIOType */\n minDate?: MaterialUiPickersDate;\n /** Max date @DateIOType */\n maxDate?: MaterialUiPickersDate;\n /** Disable past dates */\n disablePast?: boolean;\n /** Disable future dates */\n disableFuture?: boolean;\n}\n\nexport interface CalendarState {\n slideDirection: SlideDirection;\n currentMonth: MaterialUiPickersDate;\n lastDate?: MaterialUiPickersDate;\n loadingQueue: number;\n}\n\nconst KeyDownListener = ({ onKeyDown }: { onKeyDown: (e: KeyboardEvent) => void }) => {\n React.useEffect(() => {\n window.addEventListener('keydown', onKeyDown);\n return () => {\n window.removeEventListener('keydown', onKeyDown);\n };\n }, [onKeyDown]);\n\n return null;\n};\n\nexport class Calendar extends React.Component {\n static contextType = VariantContext;\n static propTypes: any = {\n renderDay: PropTypes.func,\n shouldDisableDate: PropTypes.func,\n allowKeyboardControl: PropTypes.bool,\n };\n\n static defaultProps: Partial = {\n minDate: new Date('1900-01-01'),\n maxDate: new Date('2100-01-01'),\n disablePast: false,\n disableFuture: false,\n allowKeyboardControl: true,\n };\n\n static getDerivedStateFromProps(nextProps: CalendarProps, state: CalendarState) {\n const { utils, date: nextDate } = nextProps;\n\n if (!utils.isEqual(nextDate, state.lastDate)) {\n const nextMonth = utils.getMonth(nextDate);\n const lastDate = state.lastDate || nextDate;\n const lastMonth = utils.getMonth(lastDate);\n\n return {\n lastDate: nextDate,\n currentMonth: nextProps.utils.startOfMonth(nextDate),\n // prettier-ignore\n slideDirection: nextMonth === lastMonth\n ? state.slideDirection\n : utils.isAfterDay(nextDate, lastDate)\n ? 'left'\n : 'right'\n };\n }\n\n return null;\n }\n\n state: CalendarState = {\n slideDirection: 'left',\n currentMonth: this.props.utils.startOfMonth(this.props.date),\n loadingQueue: 0,\n };\n\n componentDidMount() {\n const { date, minDate, maxDate, utils, disablePast, disableFuture } = this.props;\n\n if (this.shouldDisableDate(date)) {\n const closestEnabledDate = findClosestEnabledDate({\n date,\n utils,\n minDate: utils.date(minDate),\n maxDate: utils.date(maxDate),\n disablePast: Boolean(disablePast),\n disableFuture: Boolean(disableFuture),\n shouldDisableDate: this.shouldDisableDate,\n });\n\n this.handleDaySelect(closestEnabledDate, false);\n }\n }\n\n private pushToLoadingQueue = () => {\n const loadingQueue = this.state.loadingQueue + 1;\n this.setState({ loadingQueue });\n };\n\n private popFromLoadingQueue = () => {\n let loadingQueue = this.state.loadingQueue;\n loadingQueue = loadingQueue <= 0 ? 0 : loadingQueue - 1;\n this.setState({ loadingQueue });\n };\n\n handleChangeMonth = (newMonth: MaterialUiPickersDate, slideDirection: SlideDirection) => {\n this.setState({ currentMonth: newMonth, slideDirection });\n\n if (this.props.onMonthChange) {\n const returnVal = this.props.onMonthChange(newMonth);\n if (returnVal) {\n this.pushToLoadingQueue();\n returnVal.then(() => {\n this.popFromLoadingQueue();\n });\n }\n }\n };\n\n validateMinMaxDate = (day: MaterialUiPickersDate) => {\n const { minDate, maxDate, utils, disableFuture, disablePast } = this.props;\n const now = utils.date();\n\n return Boolean(\n (disableFuture && utils.isAfterDay(day, now)) ||\n (disablePast && utils.isBeforeDay(day, now)) ||\n (minDate && utils.isBeforeDay(day, utils.date(minDate))) ||\n (maxDate && utils.isAfterDay(day, utils.date(maxDate)))\n );\n };\n\n shouldDisablePrevMonth = () => {\n const { utils, disablePast, minDate } = this.props;\n\n const now = utils.date();\n const firstEnabledMonth = utils.startOfMonth(\n disablePast && utils.isAfter(now, utils.date(minDate)) ? now : utils.date(minDate)\n );\n\n return !utils.isBefore(firstEnabledMonth, this.state.currentMonth);\n };\n\n shouldDisableNextMonth = () => {\n const { utils, disableFuture, maxDate } = this.props;\n\n const now = utils.date();\n const lastEnabledMonth = utils.startOfMonth(\n disableFuture && utils.isBefore(now, utils.date(maxDate)) ? now : utils.date(maxDate)\n );\n\n return !utils.isAfter(lastEnabledMonth, this.state.currentMonth);\n };\n\n shouldDisableDate = (day: MaterialUiPickersDate) => {\n const { shouldDisableDate } = this.props;\n\n return this.validateMinMaxDate(day) || Boolean(shouldDisableDate && shouldDisableDate(day));\n };\n\n handleDaySelect = (day: MaterialUiPickersDate, isFinish = true) => {\n const { date, utils } = this.props;\n\n this.props.onChange(utils.mergeDateAndTime(day, date), isFinish);\n };\n\n moveToDay = (day: MaterialUiPickersDate) => {\n const { utils } = this.props;\n\n if (day && !this.shouldDisableDate(day)) {\n if (utils.getMonth(day) !== utils.getMonth(this.state.currentMonth)) {\n this.handleChangeMonth(utils.startOfMonth(day), 'left');\n }\n\n this.handleDaySelect(day, false);\n }\n };\n\n handleKeyDown = (event: KeyboardEvent) => {\n const { theme, date, utils } = this.props;\n\n runKeyHandler(event, {\n ArrowUp: () => this.moveToDay(utils.addDays(date, -7)),\n ArrowDown: () => this.moveToDay(utils.addDays(date, 7)),\n ArrowLeft: () => this.moveToDay(utils.addDays(date, theme.direction === 'ltr' ? -1 : 1)),\n ArrowRight: () => this.moveToDay(utils.addDays(date, theme.direction === 'ltr' ? 1 : -1)),\n });\n };\n\n private renderWeeks = () => {\n const { utils, classes } = this.props;\n const weeks = utils.getWeekArray(this.state.currentMonth);\n\n return weeks.map(week => (\n \n {this.renderDays(week)}\n
\n ));\n };\n\n private renderDays = (week: MaterialUiPickersDate[]) => {\n const { date, renderDay, utils } = this.props;\n\n const now = utils.date();\n const selectedDate = utils.startOfDay(date);\n const currentMonthNumber = utils.getMonth(this.state.currentMonth);\n\n return week.map(day => {\n const disabled = this.shouldDisableDate(day);\n const isDayInCurrentMonth = utils.getMonth(day) === currentMonthNumber;\n\n let dayComponent = (\n \n {utils.getDayText(day)}\n \n );\n\n if (renderDay) {\n dayComponent = renderDay(day, selectedDate, isDayInCurrentMonth, dayComponent);\n }\n\n return (\n \n {dayComponent}\n \n );\n });\n };\n\n render() {\n const { currentMonth, slideDirection } = this.state;\n const {\n classes,\n allowKeyboardControl,\n leftArrowButtonProps,\n leftArrowIcon,\n rightArrowButtonProps,\n rightArrowIcon,\n loadingIndicator,\n } = this.props;\n const loadingElement = loadingIndicator ? loadingIndicator : ;\n\n return (\n \n {allowKeyboardControl && this.context !== 'static' && (\n \n )}\n\n \n\n \n <>\n {(this.state.loadingQueue > 0 && (\n {loadingElement}
\n )) || {this.renderWeeks()}
}\n >\n \n \n );\n }\n}\n\nexport const styles = (theme: Theme) => ({\n transitionContainer: {\n minHeight: 36 * 6,\n marginTop: theme.spacing(1.5),\n },\n progressContainer: {\n width: '100%',\n height: '100%',\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n },\n week: {\n display: 'flex',\n justifyContent: 'center',\n },\n});\n\nexport default withStyles(styles, {\n name: 'MuiPickersCalendar',\n withTheme: true,\n})(withUtils()(Calendar));\n","enum ClockType {\n HOURS = 'hours',\n\n MINUTES = 'minutes',\n\n SECONDS = 'seconds',\n}\n\nexport type ClockViewType = 'hours' | 'minutes' | 'seconds';\n\nexport default ClockType;\n","import * as React from 'react';\nimport clsx from 'clsx';\nimport ClockType, { ClockViewType } from '../../constants/ClockType';\nimport { Theme } from '@material-ui/core/styles';\nimport { withStyles, createStyles, WithStyles } from '@material-ui/core/styles';\n\nexport interface ClockPointerProps extends WithStyles {\n value: number;\n hasSelected: boolean;\n isInner: boolean;\n type: ClockViewType;\n}\n\nexport class ClockPointer extends React.Component {\n public static getDerivedStateFromProps = (\n nextProps: ClockPointerProps,\n state: ClockPointer['state']\n ) => {\n if (nextProps.type !== state.previousType) {\n return {\n toAnimateTransform: true,\n previousType: nextProps.type,\n };\n }\n\n return {\n toAnimateTransform: false,\n previousType: nextProps.type,\n };\n };\n\n public state = {\n toAnimateTransform: false,\n previousType: undefined,\n };\n\n public getAngleStyle = () => {\n const { value, isInner, type } = this.props;\n\n const max = type === ClockType.HOURS ? 12 : 60;\n let angle = (360 / max) * value;\n\n if (type === ClockType.HOURS && value > 12) {\n angle -= 360; // round up angle to max 360 degrees\n }\n\n return {\n height: isInner ? '26%' : '40%',\n transform: `rotateZ(${angle}deg)`,\n };\n };\n\n public render() {\n const { classes, hasSelected } = this.props;\n\n return (\n \n );\n }\n}\n\nexport const styles = (theme: Theme) =>\n createStyles({\n pointer: {\n width: 2,\n backgroundColor: theme.palette.primary.main,\n position: 'absolute',\n left: 'calc(50% - 1px)',\n bottom: '50%',\n transformOrigin: 'center bottom 0px',\n },\n animateTransform: {\n transition: theme.transitions.create(['transform', 'height']),\n },\n thumb: {\n width: 4,\n height: 4,\n backgroundColor: theme.palette.primary.contrastText,\n borderRadius: '100%',\n position: 'absolute',\n top: -21,\n left: -15,\n border: `14px solid ${theme.palette.primary.main}`,\n boxSizing: 'content-box',\n },\n noPoint: {\n backgroundColor: theme.palette.primary.main,\n },\n });\n\nexport default withStyles(styles, {\n name: 'MuiPickersClockPointer',\n})(ClockPointer as React.ComponentType);\n","import { IUtils } from '@date-io/core/IUtils';\nimport { MaterialUiPickersDate } from '../typings/date';\n\nconst center = {\n x: 260 / 2,\n y: 260 / 2,\n};\n\nconst basePoint = {\n x: center.x,\n y: 0,\n};\n\nconst cx = basePoint.x - center.x;\nconst cy = basePoint.y - center.y;\n\nconst rad2deg = (rad: number) => rad * 57.29577951308232;\n\nconst getAngleValue = (step: number, offsetX: number, offsetY: number) => {\n const x = offsetX - center.x;\n const y = offsetY - center.y;\n\n const atan = Math.atan2(cx, cy) - Math.atan2(x, y);\n\n let deg = rad2deg(atan);\n deg = Math.round(deg / step) * step;\n deg %= 360;\n\n const value = Math.floor(deg / step) || 0;\n const delta = Math.pow(x, 2) + Math.pow(y, 2);\n const distance = Math.sqrt(delta);\n\n return { value, distance };\n};\n\nexport const getHours = (offsetX: number, offsetY: number, ampm: boolean) => {\n let { value, distance } = getAngleValue(30, offsetX, offsetY);\n value = value || 12;\n\n if (!ampm) {\n if (distance < 90) {\n value += 12;\n value %= 24;\n }\n } else {\n value %= 12;\n }\n\n return value;\n};\n\nexport const getMinutes = (offsetX: number, offsetY: number, step = 1) => {\n const angleStep = step * 6;\n let { value } = getAngleValue(angleStep, offsetX, offsetY);\n value = (value * step) % 60;\n\n return value;\n};\n\nexport const getMeridiem = (\n date: MaterialUiPickersDate,\n utils: IUtils\n): 'am' | 'pm' => {\n return utils.getHours(date) >= 12 ? 'pm' : 'am';\n};\n\nexport const convertToMeridiem = (\n time: MaterialUiPickersDate,\n meridiem: 'am' | 'pm',\n ampm: boolean,\n utils: IUtils\n) => {\n if (ampm) {\n const currentMeridiem = utils.getHours(time) >= 12 ? 'pm' : 'am';\n if (currentMeridiem !== meridiem) {\n const hours = meridiem === 'am' ? utils.getHours(time) - 12 : utils.getHours(time) + 12;\n\n return utils.setHours(time, hours);\n }\n }\n\n return time;\n};\n","import * as React from 'react';\nimport * as PropTypes from 'prop-types';\nimport ClockPointer from './ClockPointer';\nimport ClockType, { ClockViewType } from '../../constants/ClockType';\nimport { getHours, getMinutes } from '../../_helpers/time-utils';\nimport { withStyles, createStyles, WithStyles, Theme } from '@material-ui/core/styles';\n\nexport interface ClockProps extends WithStyles {\n type: ClockViewType;\n value: number;\n onChange: (value: number, isFinish?: boolean) => void;\n ampm?: boolean;\n minutesStep?: number;\n children: React.ReactElement[];\n}\n\nexport class Clock extends React.Component {\n public static propTypes: any = {\n type: PropTypes.oneOf(\n Object.keys(ClockType).map(key => ClockType[key as keyof typeof ClockType])\n ).isRequired,\n value: PropTypes.number.isRequired,\n onChange: PropTypes.func.isRequired,\n children: PropTypes.arrayOf(PropTypes.node).isRequired,\n ampm: PropTypes.bool,\n minutesStep: PropTypes.number,\n innerRef: PropTypes.any,\n };\n\n public static defaultProps = {\n ampm: false,\n minutesStep: 1,\n };\n\n public isMoving = false;\n\n public setTime(e: any, isFinish = false) {\n let { offsetX, offsetY } = e;\n\n if (typeof offsetX === 'undefined') {\n const rect = e.target.getBoundingClientRect();\n\n offsetX = e.changedTouches[0].clientX - rect.left;\n offsetY = e.changedTouches[0].clientY - rect.top;\n }\n\n const value =\n this.props.type === ClockType.SECONDS || this.props.type === ClockType.MINUTES\n ? getMinutes(offsetX, offsetY, this.props.minutesStep)\n : getHours(offsetX, offsetY, Boolean(this.props.ampm));\n\n this.props.onChange(value, isFinish);\n }\n\n public handleTouchMove = (e: React.TouchEvent) => {\n this.isMoving = true;\n this.setTime(e);\n };\n\n public handleTouchEnd = (e: React.TouchEvent) => {\n if (this.isMoving) {\n this.setTime(e, true);\n this.isMoving = false;\n }\n };\n\n public handleMove = (e: React.MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n // MouseEvent.which is deprecated, but MouseEvent.buttons is not supported in Safari\n const isButtonPressed =\n typeof e.buttons === 'undefined' ? e.nativeEvent.which === 1 : e.buttons === 1;\n\n if (isButtonPressed) {\n this.setTime(e.nativeEvent, false);\n }\n };\n\n public handleMouseUp = (e: React.MouseEvent) => {\n if (this.isMoving) {\n this.isMoving = false;\n }\n\n this.setTime(e.nativeEvent, true);\n };\n\n public hasSelected = () => {\n const { type, value } = this.props;\n\n if (type === ClockType.HOURS) {\n return true;\n }\n\n return value % 5 === 0;\n };\n\n public render() {\n const { classes, value, children, type, ampm } = this.props;\n\n const isPointerInner = !ampm && type === ClockType.HOURS && (value < 1 || value > 12);\n\n return (\n \n
\n
\n\n
\n\n
\n\n {children}\n
\n
\n );\n }\n}\n\nexport const styles = (theme: Theme) =>\n createStyles({\n container: {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'flex-end',\n margin: `${theme.spacing(2)}px 0 ${theme.spacing(1)}px`,\n },\n clock: {\n backgroundColor: 'rgba(0,0,0,.07)',\n borderRadius: '50%',\n height: 260,\n width: 260,\n position: 'relative',\n pointerEvents: 'none',\n },\n squareMask: {\n width: '100%',\n height: '100%',\n position: 'absolute',\n pointerEvents: 'auto',\n outline: 'none',\n touchActions: 'none',\n userSelect: 'none',\n '&:active': {\n cursor: 'move',\n },\n },\n pin: {\n width: 6,\n height: 6,\n borderRadius: '50%',\n backgroundColor: theme.palette.primary.main,\n position: 'absolute',\n top: '50%',\n left: '50%',\n transform: 'translate(-50%, -50%)',\n },\n });\n\nexport default withStyles(styles, {\n name: 'MuiPickersClock',\n})(Clock as React.ComponentType);\n","import * as React from 'react';\nimport clsx from 'clsx';\nimport Typography from '@material-ui/core/Typography';\nimport { makeStyles } from '@material-ui/core/styles';\n\nconst positions: Record = {\n 0: [0, 40],\n 1: [55, 19.6],\n 2: [94.4, 59.5],\n 3: [109, 114],\n 4: [94.4, 168.5],\n 5: [54.5, 208.4],\n 6: [0, 223],\n 7: [-54.5, 208.4],\n 8: [-94.4, 168.5],\n 9: [-109, 114],\n 10: [-94.4, 59.5],\n 11: [-54.5, 19.6],\n 12: [0, 5],\n 13: [36.9, 49.9],\n 14: [64, 77],\n 15: [74, 114],\n 16: [64, 151],\n 17: [37, 178],\n 18: [0, 188],\n 19: [-37, 178],\n 20: [-64, 151],\n 21: [-74, 114],\n 22: [-64, 77],\n 23: [-37, 50],\n};\n\nexport interface ClockNumberProps {\n index: number;\n label: string;\n selected: boolean;\n isInner?: boolean;\n}\n\nexport const useStyles = makeStyles(\n theme => {\n const size = theme.spacing(4);\n\n return {\n clockNumber: {\n width: size,\n height: 32,\n userSelect: 'none',\n position: 'absolute',\n left: `calc((100% - ${typeof size === 'number' ? `${size}px` : size}) / 2)`,\n display: 'inline-flex',\n justifyContent: 'center',\n alignItems: 'center',\n borderRadius: '50%',\n color:\n theme.palette.type === 'light' ? theme.palette.text.primary : theme.palette.text.hint,\n },\n clockNumberSelected: {\n color: theme.palette.primary.contrastText,\n },\n };\n },\n { name: 'MuiPickersClockNumber' }\n);\n\nexport const ClockNumber: React.FC = ({ selected, label, index, isInner }) => {\n const classes = useStyles();\n const className = clsx(classes.clockNumber, {\n [classes.clockNumberSelected]: selected,\n });\n\n const transformStyle = React.useMemo(() => {\n const position = positions[index];\n\n return {\n transform: `translate(${position[0]}px, ${position[1]}px`,\n };\n }, [index]);\n\n return (\n \n );\n};\n\nexport default ClockNumber;\n","import * as React from 'react';\nimport ClockNumber from './ClockNumber';\nimport { IUtils } from '@date-io/core/IUtils';\nimport { MaterialUiPickersDate } from '../../typings/date';\n\nexport const getHourNumbers = ({\n ampm,\n utils,\n date,\n}: {\n ampm: boolean;\n utils: IUtils;\n date: MaterialUiPickersDate;\n}) => {\n const currentHours = utils.getHours(date);\n\n const hourNumbers: JSX.Element[] = [];\n const startHour = ampm ? 1 : 0;\n const endHour = ampm ? 12 : 23;\n\n const isSelected = (hour: number) => {\n if (ampm) {\n if (hour === 12) {\n return currentHours === 12 || currentHours === 0;\n }\n\n return currentHours === hour || currentHours - 12 === hour;\n }\n\n return currentHours === hour;\n };\n\n for (let hour = startHour; hour <= endHour; hour += 1) {\n let label = hour.toString();\n\n if (hour === 0) {\n label = '00';\n }\n\n const props = {\n index: hour,\n label: utils.formatNumber(label),\n selected: isSelected(hour),\n isInner: !ampm && (hour === 0 || hour > 12),\n };\n\n hourNumbers.push();\n }\n\n return hourNumbers;\n};\n\nexport const getMinutesNumbers = ({\n value,\n utils,\n}: {\n value: number;\n utils: IUtils;\n}) => {\n const f = utils.formatNumber;\n\n return [\n ,\n ,\n ,\n ,\n ,\n ,\n ,\n ,\n ,\n ,\n ,\n ,\n ];\n};\n","import * as React from 'react';\nimport * as PropTypes from 'prop-types';\nimport Clock from './Clock';\nimport ClockType from '../../constants/ClockType';\nimport { useUtils } from '../../_shared/hooks/useUtils';\nimport { MaterialUiPickersDate } from '../../typings/date';\nimport { getHourNumbers, getMinutesNumbers } from './ClockNumbers';\nimport { convertToMeridiem, getMeridiem } from '../../_helpers/time-utils';\n\nexport interface TimePickerViewProps {\n /** TimePicker value */\n date: MaterialUiPickersDate;\n /** Clock type */\n type: 'hours' | 'minutes' | 'seconds';\n /** 12h/24h clock mode */\n ampm?: boolean;\n /** Minutes step */\n minutesStep?: number;\n /** On hour change */\n onHourChange: (date: MaterialUiPickersDate, isFinish?: boolean) => void;\n /** On minutes change */\n onMinutesChange: (date: MaterialUiPickersDate, isFinish?: boolean) => void;\n /** On seconds change */\n onSecondsChange: (date: MaterialUiPickersDate, isFinish?: boolean) => void;\n}\n\nexport const ClockView: React.FC = ({\n type,\n onHourChange,\n onMinutesChange,\n onSecondsChange,\n ampm,\n date,\n minutesStep,\n}) => {\n const utils = useUtils();\n const viewProps = React.useMemo(() => {\n switch (type) {\n case ClockType.HOURS:\n return {\n value: utils.getHours(date),\n children: getHourNumbers({ date, utils, ampm: Boolean(ampm) }),\n onChange: (value: number, isFinish?: boolean) => {\n const currentMeridiem = getMeridiem(date, utils);\n const updatedTimeWithMeridiem = convertToMeridiem(\n utils.setHours(date, value),\n currentMeridiem,\n Boolean(ampm),\n utils\n );\n\n onHourChange(updatedTimeWithMeridiem, isFinish);\n },\n };\n\n case ClockType.MINUTES:\n const minutesValue = utils.getMinutes(date);\n return {\n value: minutesValue,\n children: getMinutesNumbers({ value: minutesValue, utils }),\n onChange: (value: number, isFinish?: boolean) => {\n const updatedTime = utils.setMinutes(date, value);\n\n onMinutesChange(updatedTime, isFinish);\n },\n };\n\n case ClockType.SECONDS:\n const secondsValue = utils.getSeconds(date);\n return {\n value: secondsValue,\n children: getMinutesNumbers({ value: secondsValue, utils }),\n onChange: (value: number, isFinish?: boolean) => {\n const updatedTime = utils.setSeconds(date, value);\n\n onSecondsChange(updatedTime, isFinish);\n },\n };\n\n default:\n throw new Error('You must provide the type for TimePickerView');\n }\n }, [ampm, date, onHourChange, onMinutesChange, onSecondsChange, type, utils]);\n\n return ;\n};\n\nClockView.displayName = 'TimePickerView';\n\nClockView.propTypes = {\n date: PropTypes.object.isRequired,\n onHourChange: PropTypes.func.isRequired,\n onMinutesChange: PropTypes.func.isRequired,\n onSecondsChange: PropTypes.func.isRequired,\n ampm: PropTypes.bool,\n minutesStep: PropTypes.number,\n type: PropTypes.oneOf(Object.keys(ClockType).map(key => ClockType[key as keyof typeof ClockType]))\n .isRequired,\n} as any;\n\nClockView.defaultProps = {\n ampm: true,\n minutesStep: 1,\n};\n\nexport default React.memo(ClockView);\n","import * as PropTypes from 'prop-types';\nimport { BaseTimePickerProps } from '../TimePicker/TimePicker';\nimport { BaseDatePickerProps } from '../DatePicker/DatePicker';\n\nconst date = PropTypes.oneOfType([\n PropTypes.object,\n PropTypes.string,\n PropTypes.number,\n PropTypes.instanceOf(Date),\n]);\n\nconst datePickerView = PropTypes.oneOf(['year', 'month', 'day']);\n\nexport type ParsableDate = object | string | number | Date | null | undefined;\n\nexport const DomainPropTypes = { date, datePickerView };\n\n/* eslint-disable @typescript-eslint/no-object-literal-type-assertion */\nexport const timePickerDefaultProps = {\n ampm: true,\n invalidDateMessage: 'Invalid Time Format',\n} as BaseTimePickerProps;\n\nexport const datePickerDefaultProps = {\n minDate: new Date('1900-01-01'),\n maxDate: new Date('2100-01-01'),\n invalidDateMessage: 'Invalid Date Format',\n minDateMessage: 'Date should not be before minimal date',\n maxDateMessage: 'Date should not be after maximal date',\n allowKeyboardControl: true,\n} as BaseDatePickerProps;\n\nexport const dateTimePickerDefaultProps = {\n ...timePickerDefaultProps,\n ...datePickerDefaultProps,\n showTabs: true,\n} as BaseTimePickerProps & BaseDatePickerProps;\n","import * as React from 'react';\nimport clsx from 'clsx';\nimport Typography from '@material-ui/core/Typography';\nimport { makeStyles } from '@material-ui/core/styles';\n\nexport interface YearProps {\n children: React.ReactNode;\n disabled?: boolean;\n onSelect: (value: any) => void;\n selected?: boolean;\n value: any;\n forwardedRef?: React.Ref;\n}\n\nexport const useStyles = makeStyles(\n theme => ({\n root: {\n height: 40,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n cursor: 'pointer',\n outline: 'none',\n '&:focus': {\n color: theme.palette.primary.main,\n fontWeight: theme.typography.fontWeightMedium,\n },\n },\n yearSelected: {\n margin: '10px 0',\n fontWeight: theme.typography.fontWeightMedium,\n },\n yearDisabled: {\n pointerEvents: 'none',\n color: theme.palette.text.hint,\n },\n }),\n { name: 'MuiPickersYear' }\n);\n\nexport const Year: React.FC = ({\n onSelect,\n forwardedRef,\n value,\n selected,\n disabled,\n children,\n ...other\n}) => {\n const classes = useStyles();\n const handleClick = React.useCallback(() => onSelect(value), [onSelect, value]);\n\n return (\n \n );\n};\n\nYear.displayName = 'Year';\n\nexport default React.forwardRef((props, ref) => (\n \n));\n","import * as React from 'react';\nimport Year from './Year';\nimport { DateType } from '@date-io/type';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { useUtils } from '../../_shared/hooks/useUtils';\nimport { VariantContext } from '../../wrappers/Wrapper';\nimport { MaterialUiPickersDate } from '../../typings/date';\n\nexport interface YearSelectionProps {\n date: MaterialUiPickersDate;\n minDate: DateType;\n maxDate: DateType;\n onChange: (date: MaterialUiPickersDate, isFinish: boolean) => void;\n disablePast?: boolean | null | undefined;\n disableFuture?: boolean | null | undefined;\n animateYearScrolling?: boolean | null | undefined;\n onYearChange?: (date: MaterialUiPickersDate) => void;\n}\n\nexport const useStyles = makeStyles(\n {\n container: {\n height: 300,\n overflowY: 'auto',\n },\n },\n { name: 'MuiPickersYearSelection' }\n);\n\nexport const YearSelection: React.FC = ({\n date,\n onChange,\n onYearChange,\n minDate,\n maxDate,\n disablePast,\n disableFuture,\n animateYearScrolling,\n}) => {\n const utils = useUtils();\n const classes = useStyles();\n const currentVariant = React.useContext(VariantContext);\n const selectedYearRef = React.useRef(null);\n\n React.useEffect(() => {\n if (selectedYearRef.current && selectedYearRef.current.scrollIntoView) {\n try {\n selectedYearRef.current.scrollIntoView({\n block: currentVariant === 'static' ? 'nearest' : 'center',\n behavior: animateYearScrolling ? 'smooth' : 'auto',\n });\n } catch (e) {\n // call without arguments in case when scrollIntoView works improperly (e.g. Firefox 52-57)\n selectedYearRef.current.scrollIntoView();\n }\n }\n }, []); // eslint-disable-line\n\n const currentYear = utils.getYear(date);\n const onYearSelect = React.useCallback(\n (year: number) => {\n const newDate = utils.setYear(date, year);\n if (onYearChange) {\n onYearChange(newDate);\n }\n\n onChange(newDate, true);\n },\n [date, onChange, onYearChange, utils]\n );\n\n return (\n \n {utils.getYearRange(minDate, maxDate).map(year => {\n const yearNumber = utils.getYear(year);\n const selected = yearNumber === currentYear;\n\n return (\n \n {utils.getYearText(year)}\n \n );\n })}\n
\n );\n};\n","import * as React from 'react';\nimport clsx from 'clsx';\nimport Typography from '@material-ui/core/Typography';\nimport { makeStyles } from '@material-ui/core/styles';\n\nexport interface MonthProps {\n children: React.ReactNode;\n disabled?: boolean;\n onSelect: (value: any) => void;\n selected?: boolean;\n value: any;\n}\n\nexport const useStyles = makeStyles(\n theme => ({\n root: {\n flex: '1 0 33.33%',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n cursor: 'pointer',\n outline: 'none',\n height: 75,\n transition: theme.transitions.create('font-size', { duration: '100ms' }),\n '&:focus': {\n color: theme.palette.primary.main,\n fontWeight: theme.typography.fontWeightMedium,\n },\n },\n monthSelected: {\n color: theme.palette.primary.main,\n fontWeight: theme.typography.fontWeightMedium,\n },\n monthDisabled: {\n pointerEvents: 'none',\n color: theme.palette.text.hint,\n },\n }),\n { name: 'MuiPickersMonth' }\n);\n\nexport const Month: React.FC = ({\n selected,\n onSelect,\n disabled,\n value,\n children,\n ...other\n}) => {\n const classes = useStyles();\n const handleSelection = React.useCallback(() => {\n onSelect(value);\n }, [onSelect, value]);\n\n return (\n \n );\n};\n\nMonth.displayName = 'Month';\n\nexport default Month;\n","import * as React from 'react';\nimport Month from './Month';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { useUtils } from '../../_shared/hooks/useUtils';\nimport { ParsableDate } from '../../constants/prop-types';\nimport { MaterialUiPickersDate } from '../../typings/date';\n\nexport interface MonthSelectionProps {\n date: MaterialUiPickersDate;\n minDate?: ParsableDate;\n maxDate?: ParsableDate;\n onChange: (date: MaterialUiPickersDate, isFinish: boolean) => void;\n disablePast?: boolean | null | undefined;\n disableFuture?: boolean | null | undefined;\n onMonthChange?: (date: MaterialUiPickersDate) => void | Promise;\n}\n\nexport const useStyles = makeStyles(\n {\n container: {\n width: 310,\n display: 'flex',\n flexWrap: 'wrap',\n alignContent: 'stretch',\n },\n },\n { name: 'MuiPickersMonthSelection' }\n);\n\nexport const MonthSelection: React.FC = ({\n disablePast,\n disableFuture,\n minDate,\n maxDate,\n date,\n onMonthChange,\n onChange,\n}) => {\n const utils = useUtils();\n const classes = useStyles();\n const currentMonth = utils.getMonth(date);\n\n const shouldDisableMonth = (month: MaterialUiPickersDate) => {\n const now = utils.date();\n const utilMinDate = utils.date(minDate);\n const utilMaxDate = utils.date(maxDate);\n\n const firstEnabledMonth = utils.startOfMonth(\n disablePast && utils.isAfter(now, utilMinDate) ? now : utilMinDate\n );\n\n const lastEnabledMonth = utils.startOfMonth(\n disableFuture && utils.isBefore(now, utilMaxDate) ? now : utilMaxDate\n );\n\n const isBeforeFirstEnabled = utils.isBefore(month, firstEnabledMonth);\n const isAfterLastEnabled = utils.isAfter(month, lastEnabledMonth);\n\n return isBeforeFirstEnabled || isAfterLastEnabled;\n };\n\n const onMonthSelect = React.useCallback(\n (month: number) => {\n const newDate = utils.setMonth(date, month);\n\n onChange(newDate, true);\n if (onMonthChange) {\n onMonthChange(newDate);\n }\n },\n [date, onChange, onMonthChange, utils]\n );\n\n return (\n \n {utils.getMonthArray(date).map(month => {\n const monthNumber = utils.getMonth(month);\n const monthText = utils.format(month, 'MMM');\n\n return (\n \n {monthText}\n \n );\n })}\n
\n );\n};\n","import * as React from 'react';\nimport { useIsomorphicEffect } from './useKeyDown';\nimport { BasePickerProps } from '../../typings/BasePicker';\n\nconst getOrientation = () => {\n if (typeof window === 'undefined') {\n return 'portrait';\n }\n\n if (window.screen && window.screen.orientation && window.screen.orientation.angle) {\n return Math.abs(window.screen.orientation.angle) === 90 ? 'landscape' : 'portrait';\n }\n\n // Support IOS safari\n if (window.orientation) {\n return Math.abs(Number(window.orientation)) === 90 ? 'landscape' : 'portrait';\n }\n\n return 'portrait';\n};\n\nexport function useIsLandscape(customOrientation?: BasePickerProps['orientation']) {\n const [orientation, setOrientation] = React.useState(\n getOrientation()\n );\n\n const eventHandler = React.useCallback(() => setOrientation(getOrientation()), []);\n\n useIsomorphicEffect(() => {\n window.addEventListener('orientationchange', eventHandler);\n return () => window.removeEventListener('orientationchange', eventHandler);\n }, [eventHandler]);\n\n const orientationToUse = customOrientation || orientation;\n return orientationToUse === 'landscape';\n}\n","import * as React from 'react';\nimport clsx from 'clsx';\nimport Calendar from '../views/Calendar/Calendar';\nimport { useUtils } from '../_shared/hooks/useUtils';\nimport { useViews } from '../_shared/hooks/useViews';\nimport { ClockView } from '../views/Clock/ClockView';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { YearSelection } from '../views/Year/YearView';\nimport { BasePickerProps } from '../typings/BasePicker';\nimport { MaterialUiPickersDate } from '../typings/date';\nimport { MonthSelection } from '../views/Month/MonthView';\nimport { BaseTimePickerProps } from '../TimePicker/TimePicker';\nimport { BaseDatePickerProps } from '../DatePicker/DatePicker';\nimport { useIsLandscape } from '../_shared/hooks/useIsLandscape';\nimport { datePickerDefaultProps } from '../constants/prop-types';\nimport { DIALOG_WIDTH_WIDER, DIALOG_WIDTH, VIEW_HEIGHT } from '../constants/dimensions';\n\nconst viewsMap = {\n year: YearSelection,\n month: MonthSelection,\n date: Calendar,\n hours: ClockView,\n minutes: ClockView,\n seconds: ClockView,\n};\n\nexport type PickerView = keyof typeof viewsMap;\n\nexport type ToolbarComponentProps = BaseDatePickerProps &\n BaseTimePickerProps & {\n views: PickerView[];\n openView: PickerView;\n date: MaterialUiPickersDate;\n setOpenView: (view: PickerView) => void;\n onChange: (date: MaterialUiPickersDate, isFinish?: boolean) => void;\n // TODO move out, cause it is DateTimePickerOnly\n hideTabs?: boolean;\n dateRangeIcon?: React.ReactNode;\n timeIcon?: React.ReactNode;\n isLandscape: boolean;\n };\n\nexport interface PickerViewProps extends BaseDatePickerProps, BaseTimePickerProps {\n views: PickerView[];\n openTo: PickerView;\n disableToolbar?: boolean;\n ToolbarComponent: React.ComponentType;\n // TODO move out, cause it is DateTimePickerOnly\n hideTabs?: boolean;\n dateRangeIcon?: React.ReactNode;\n timeIcon?: React.ReactNode;\n}\n\ninterface PickerProps extends PickerViewProps {\n date: MaterialUiPickersDate;\n orientation?: BasePickerProps['orientation'];\n onChange: (date: MaterialUiPickersDate, isFinish?: boolean) => void;\n}\n\nconst useStyles = makeStyles(\n {\n container: {\n display: 'flex',\n flexDirection: 'column',\n },\n containerLandscape: {\n flexDirection: 'row',\n },\n pickerView: {\n overflowX: 'hidden',\n minHeight: VIEW_HEIGHT,\n minWidth: DIALOG_WIDTH,\n maxWidth: DIALOG_WIDTH_WIDER,\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'center',\n },\n pickerViewLandscape: {\n padding: '0 8px',\n },\n },\n { name: 'MuiPickersBasePicker' }\n);\n\nexport const Picker: React.FunctionComponent = ({\n date,\n views,\n disableToolbar,\n onChange,\n openTo,\n minDate: unparsedMinDate,\n maxDate: unparsedMaxDate,\n ToolbarComponent,\n orientation,\n ...rest\n}) => {\n const utils = useUtils();\n const classes = useStyles();\n const isLandscape = useIsLandscape(orientation);\n const { openView, setOpenView, handleChangeAndOpenNext } = useViews(views, openTo, onChange);\n\n const minDate = React.useMemo(() => utils.date(unparsedMinDate)!, [unparsedMinDate, utils]);\n const maxDate = React.useMemo(() => utils.date(unparsedMaxDate)!, [unparsedMaxDate, utils]);\n\n return (\n \n {!disableToolbar && (\n
\n )}\n\n
\n {openView === 'year' && (\n \n )}\n\n {openView === 'month' && (\n \n )}\n\n {openView === 'date' && (\n \n )}\n\n {(openView === 'hours' || openView === 'minutes' || openView === 'seconds') && (\n \n )}\n
\n
\n );\n};\n\nPicker.defaultProps = {\n ...datePickerDefaultProps,\n views: Object.keys(viewsMap),\n} as any;\n","import * as React from 'react';\nimport { PickerView } from '../../Picker/Picker';\nimport { arrayIncludes } from '../../_helpers/utils';\nimport { MaterialUiPickersDate } from '../../typings/date';\n\nexport function useViews(\n views: PickerView[],\n openTo: PickerView,\n onChange: (date: MaterialUiPickersDate, isFinish?: boolean) => void\n) {\n const [openView, setOpenView] = React.useState(\n openTo && arrayIncludes(views, openTo) ? openTo : views[0]\n );\n\n const handleChangeAndOpenNext = React.useCallback(\n (date: MaterialUiPickersDate, isFinish?: boolean) => {\n const nextViewToOpen = views[views.indexOf(openView!) + 1];\n if (isFinish && nextViewToOpen) {\n // do not close picker if needs to show next view\n onChange(date, false);\n setOpenView(nextViewToOpen);\n return;\n }\n\n onChange(date, Boolean(isFinish));\n },\n [onChange, openView, views]\n );\n\n return { handleChangeAndOpenNext, openView, setOpenView };\n}\n","import * as React from 'react';\nimport clsx from 'clsx';\nimport Typography, { TypographyProps } from '@material-ui/core/Typography';\nimport { ExtendMui } from '../typings/extendMui';\nimport { makeStyles, fade } from '@material-ui/core/styles';\n\nexport interface ToolbarTextProps extends ExtendMui {\n selected?: boolean;\n label: string;\n}\n\nexport const useStyles = makeStyles(\n theme => {\n const textColor =\n theme.palette.type === 'light'\n ? theme.palette.primary.contrastText\n : theme.palette.getContrastText(theme.palette.background.default);\n\n return {\n toolbarTxt: {\n color: fade(textColor, 0.54),\n },\n toolbarBtnSelected: {\n color: textColor,\n },\n };\n },\n { name: 'MuiPickersToolbarText' }\n);\n\nconst ToolbarText: React.FunctionComponent = ({\n selected,\n label,\n className = null,\n ...other\n}) => {\n const classes = useStyles();\n return (\n \n );\n};\n\nexport default ToolbarText;\n","import * as React from 'react';\nimport * as PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport ToolbarText from './ToolbarText';\nimport Button, { ButtonProps } from '@material-ui/core/Button';\nimport { ExtendMui } from '../typings/extendMui';\nimport { TypographyProps } from '@material-ui/core/Typography';\nimport { createStyles, withStyles, WithStyles } from '@material-ui/core/styles';\n\nexport interface ToolbarButtonProps\n extends ExtendMui,\n WithStyles {\n variant: TypographyProps['variant'];\n selected: boolean;\n label: string;\n align?: TypographyProps['align'];\n typographyClassName?: string;\n}\n\nconst ToolbarButton: React.FunctionComponent = ({\n classes,\n className = null,\n label,\n selected,\n variant,\n align,\n typographyClassName,\n ...other\n}) => {\n return (\n \n );\n};\n\n(ToolbarButton as any).propTypes = {\n selected: PropTypes.bool.isRequired,\n label: PropTypes.string.isRequired,\n classes: PropTypes.any.isRequired,\n className: PropTypes.string,\n innerRef: PropTypes.any,\n};\n\nToolbarButton.defaultProps = {\n className: '',\n};\n\nexport const styles = createStyles({\n toolbarBtn: {\n padding: 0,\n minWidth: '16px',\n textTransform: 'none',\n },\n});\n\nexport default withStyles(styles, { name: 'MuiPickersToolbarButton' })(ToolbarButton);\n","import * as React from 'react';\nimport clsx from 'clsx';\nimport Toolbar, { ToolbarProps } from '@material-ui/core/Toolbar';\nimport { ExtendMui } from '../typings/extendMui';\nimport { makeStyles } from '@material-ui/core/styles';\n\nexport const useStyles = makeStyles(\n theme => ({\n toolbar: {\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n justifyContent: 'center',\n height: 100,\n backgroundColor:\n theme.palette.type === 'light'\n ? theme.palette.primary.main\n : theme.palette.background.default,\n },\n toolbarLandscape: {\n height: 'auto',\n maxWidth: 150,\n padding: 8,\n justifyContent: 'flex-start',\n },\n }),\n { name: 'MuiPickersToolbar' }\n);\n\ninterface PickerToolbarProps extends ExtendMui {\n isLandscape: boolean;\n}\n\nconst PickerToolbar: React.SFC = ({\n children,\n isLandscape,\n className = null,\n ...other\n}) => {\n const classes = useStyles();\n\n return (\n \n {children}\n \n );\n};\n\nexport default PickerToolbar;\n","import * as React from 'react';\nimport TextField, { BaseTextFieldProps, TextFieldProps } from '@material-ui/core/TextField';\nimport { ExtendMui } from '../typings/extendMui';\n\nexport type NotOverridableProps =\n | 'openPicker'\n | 'inputValue'\n | 'onChange'\n | 'format'\n | 'validationError'\n | 'format'\n | 'forwardedRef';\n\nexport interface PureDateInputProps\n extends ExtendMui {\n /** Pass material-ui text field variant down, bypass internal variant prop */\n inputVariant?: TextFieldProps['variant'];\n /** Override input component */\n TextFieldComponent?: React.ComponentType;\n InputProps?: TextFieldProps['InputProps'];\n inputProps?: TextFieldProps['inputProps'];\n onBlur?: TextFieldProps['onBlur'];\n onFocus?: TextFieldProps['onFocus'];\n inputValue: string;\n validationError?: React.ReactNode;\n openPicker: () => void;\n}\n\nexport const PureDateInput: React.FC = ({\n inputValue,\n inputVariant,\n validationError,\n InputProps,\n openPicker: onOpen,\n TextFieldComponent = TextField,\n ...other\n}) => {\n const PureDateInputProps = React.useMemo(\n () => ({\n ...InputProps,\n readOnly: true,\n }),\n [InputProps]\n );\n\n return (\n {\n // space\n if (e.keyCode === 32) {\n e.stopPropagation();\n onOpen();\n }\n }}\n />\n );\n};\n\nPureDateInput.displayName = 'PureDateInput';\n","import React from 'react';\nimport SvgIcon, { SvgIconProps } from '@material-ui/core/SvgIcon';\n\nexport const KeyboardIcon: React.SFC = props => {\n return (\n \n \n \n \n );\n};\n","import { Omit } from './utils';\nimport { DatePickerProps } from '..';\nimport { IUtils } from '@date-io/core/IUtils';\nimport { ParsableDate } from '../constants/prop-types';\nimport { BasePickerProps } from '../typings/BasePicker';\n\nexport const getDisplayDate = (\n value: ParsableDate,\n format: string,\n utils: IUtils,\n isEmpty: boolean,\n { invalidLabel, emptyLabel, labelFunc }: Omit\n) => {\n const date = utils.date(value);\n if (labelFunc) {\n return labelFunc(isEmpty ? null : date, invalidLabel!);\n }\n\n if (isEmpty) {\n return emptyLabel || '';\n }\n\n return utils.isValid(date) ? utils.format(date, format) : invalidLabel!;\n};\n\nexport interface BaseValidationProps {\n /**\n * Message, appearing when date cannot be parsed\n * @default 'Invalid Date Format'\n */\n invalidDateMessage?: React.ReactNode;\n}\n\nexport interface DateValidationProps extends BaseValidationProps {\n /**\n * Error message, shown if date is less then minimal date\n * @default 'Date should not be before minimal date'\n */\n minDateMessage?: React.ReactNode;\n /**\n * Error message, shown if date is more then maximal date\n * @default 'Date should not be after maximal date'\n */\n maxDateMessage?: React.ReactNode;\n}\n\nconst getComparisonMaxDate = (utils: IUtils, strictCompareDates: boolean, date: Date) => {\n if (strictCompareDates) {\n return date;\n }\n\n return utils.endOfDay(date);\n};\n\nconst getComparisonMinDate = (utils: IUtils, strictCompareDates: boolean, date: Date) => {\n if (strictCompareDates) {\n return date;\n }\n\n return utils.startOfDay(date);\n};\n\nexport const validate = (\n value: ParsableDate,\n utils: IUtils,\n {\n maxDate,\n minDate,\n disablePast,\n disableFuture,\n maxDateMessage,\n minDateMessage,\n invalidDateMessage,\n strictCompareDates,\n }: Omit // DateTimePicker doesn't support\n): React.ReactNode => {\n const parsedValue = utils.date(value);\n\n // if null - do not show error\n if (value === null) {\n return '';\n }\n\n if (!utils.isValid(value)) {\n return invalidDateMessage;\n }\n\n if (\n maxDate &&\n utils.isAfter(\n parsedValue,\n getComparisonMaxDate(utils, !!strictCompareDates, utils.date(maxDate))\n )\n ) {\n return maxDateMessage;\n }\n\n if (\n disableFuture &&\n utils.isAfter(parsedValue, getComparisonMaxDate(utils, !!strictCompareDates, utils.date()))\n ) {\n return maxDateMessage;\n }\n\n if (\n minDate &&\n utils.isBefore(\n parsedValue,\n getComparisonMinDate(utils, !!strictCompareDates, utils.date(minDate))\n )\n ) {\n return minDateMessage;\n }\n if (\n disablePast &&\n utils.isBefore(parsedValue, getComparisonMinDate(utils, !!strictCompareDates, utils.date()))\n ) {\n return minDateMessage;\n }\n\n return '';\n};\n\nexport function pick12hOr24hFormat(\n userFormat: string | undefined,\n ampm: boolean | undefined = true,\n formats: { '12h': string; '24h': string }\n) {\n if (userFormat) {\n return userFormat;\n }\n\n return ampm ? formats['12h'] : formats['24h'];\n}\n\nexport function makeMaskFromFormat(format: string, numberMaskChar: string) {\n return format.replace(/[a-z]/gi, numberMaskChar);\n}\n\nexport const maskedDateFormatter = (mask: string, numberMaskChar: string, refuse: RegExp) => (\n value: string\n) => {\n let result = '';\n const parsed = value.replace(refuse, '');\n\n if (parsed === '') {\n return parsed;\n }\n\n let i = 0;\n let n = 0;\n while (i < mask.length) {\n const maskChar = mask[i];\n if (maskChar === numberMaskChar && n < parsed.length) {\n const parsedChar = parsed[n];\n result += parsedChar;\n n += 1;\n } else {\n result += maskChar;\n }\n i += 1;\n }\n\n return result;\n};\n","import * as React from 'react';\nimport IconButton, { IconButtonProps } from '@material-ui/core/IconButton';\nimport InputAdornment, { InputAdornmentProps } from '@material-ui/core/InputAdornment';\nimport TextField, { BaseTextFieldProps, TextFieldProps } from '@material-ui/core/TextField';\nimport { Rifm } from 'rifm';\nimport { ExtendMui } from '../typings/extendMui';\nimport { KeyboardIcon } from './icons/KeyboardIcon';\nimport { makeMaskFromFormat, maskedDateFormatter } from '../_helpers/text-field-helper';\n\nexport interface KeyboardDateInputProps\n extends ExtendMui {\n format: string;\n onChange: (value: string | null) => void;\n openPicker: () => void;\n validationError?: React.ReactNode;\n inputValue: string;\n inputProps?: TextFieldProps['inputProps'];\n InputProps?: TextFieldProps['InputProps'];\n onBlur?: TextFieldProps['onBlur'];\n onFocus?: TextFieldProps['onFocus'];\n /** Override input component */\n TextFieldComponent?: React.ComponentType;\n /** Icon displaying for open picker button */\n keyboardIcon?: React.ReactNode;\n /** Pass material-ui text field variant down, bypass internal variant prop */\n inputVariant?: TextFieldProps['variant'];\n /**\n * Custom mask. Can be used to override generate from format. (e.g. __/__/____ __:__)\n */\n mask?: string;\n /**\n * Char string that will be replaced with number (for \"_\" mask will be \"__/__/____\")\n * @default '_'\n */\n maskChar?: string;\n /**\n * Refuse values regexp\n * @default /[^\\d]+/gi\n */\n refuse?: RegExp;\n /**\n * Props to pass to keyboard input adornment\n * @type {Partial}\n */\n InputAdornmentProps?: Partial;\n /**\n * Props to pass to keyboard adornment button\n * @type {Partial}\n */\n KeyboardButtonProps?: Partial;\n /** Custom formatter to be passed into Rifm component */\n rifmFormatter?: (str: string) => string;\n}\n\nexport const KeyboardDateInput: React.FunctionComponent = ({\n inputValue,\n inputVariant,\n validationError,\n KeyboardButtonProps,\n InputAdornmentProps,\n openPicker: onOpen,\n onChange,\n InputProps,\n mask,\n maskChar = '_',\n refuse = /[^\\d]+/gi,\n format,\n keyboardIcon,\n disabled,\n rifmFormatter,\n TextFieldComponent = TextField,\n ...other\n}) => {\n const inputMask = mask || makeMaskFromFormat(format, maskChar);\n // prettier-ignore\n const formatter = React.useMemo(\n () => maskedDateFormatter(inputMask, maskChar, refuse),\n [inputMask, maskChar, refuse]\n );\n\n const position =\n InputAdornmentProps && InputAdornmentProps.position ? InputAdornmentProps.position : 'end';\n\n const handleChange = (text: string) => {\n const finalString = text === '' || text === inputMask ? null : text;\n onChange(finalString);\n };\n\n return (\n \n {({ onChange, value }) => (\n \n \n {keyboardIcon}\n \n \n ),\n }}\n />\n )}\n \n );\n};\n\nKeyboardDateInput.defaultProps = {\n keyboardIcon: ,\n};\n\nexport default KeyboardDateInput;\n","import { useUtils } from './useUtils';\nimport { IUtils } from '@date-io/core/IUtils';\nimport { useOpenState } from './useOpenState';\nimport { MaterialUiPickersDate } from '../../typings/date';\nimport { BasePickerProps } from '../../typings/BasePicker';\nimport { getDisplayDate, validate } from '../../_helpers/text-field-helper';\nimport { useCallback, useDebugValue, useEffect, useMemo, useState, useRef } from 'react';\n\nexport interface StateHookOptions {\n getDefaultFormat: () => string;\n}\n\nconst useValueToDate = (\n utils: IUtils,\n { value, initialFocusedDate }: BasePickerProps\n) => {\n const nowRef = useRef(utils.date());\n const date = utils.date(value || initialFocusedDate || nowRef.current);\n\n return date && utils.isValid(date) ? date : nowRef.current;\n};\n\nfunction useDateValues(props: BasePickerProps, options: StateHookOptions) {\n const utils = useUtils();\n const date = useValueToDate(utils, props);\n const format = props.format || options.getDefaultFormat();\n\n return { date, format };\n}\n\nexport function usePickerState(props: BasePickerProps, options: StateHookOptions) {\n const { autoOk, disabled, readOnly, onAccept, onChange, onError, value, variant } = props;\n\n const utils = useUtils();\n const { isOpen, setIsOpen } = useOpenState(props);\n const { date, format } = useDateValues(props, options);\n const [pickerDate, setPickerDate] = useState(date);\n\n useEffect(() => {\n // if value was changed in closed state - treat it as accepted\n if (!isOpen && !utils.isEqual(pickerDate, date)) {\n setPickerDate(date);\n }\n }, [date, isOpen, pickerDate, utils]);\n\n const acceptDate = useCallback(\n (acceptedDate: MaterialUiPickersDate) => {\n onChange(acceptedDate);\n if (onAccept) {\n onAccept(acceptedDate);\n }\n\n setIsOpen(false);\n },\n [onAccept, onChange, setIsOpen]\n );\n\n const wrapperProps = useMemo(\n () => ({\n format,\n open: isOpen,\n onClear: () => acceptDate(null),\n onAccept: () => acceptDate(pickerDate),\n onSetToday: () => setPickerDate(utils.date()),\n onDismiss: () => {\n setIsOpen(false);\n },\n }),\n [acceptDate, format, isOpen, pickerDate, setIsOpen, utils]\n );\n\n const pickerProps = useMemo(\n () => ({\n date: pickerDate,\n onChange: (newDate: MaterialUiPickersDate, isFinish = true) => {\n setPickerDate(newDate);\n\n if (isFinish && autoOk) {\n acceptDate(newDate);\n return;\n }\n\n // simulate autoOk, but do not close the modal\n if (variant === 'inline' || variant === 'static') {\n onChange(newDate);\n onAccept && onAccept(newDate);\n }\n },\n }),\n [acceptDate, autoOk, onAccept, onChange, pickerDate, variant]\n );\n\n const validationError = validate(value, utils, props);\n useEffect(() => {\n if (onError) {\n onError(validationError, value);\n }\n }, [onError, validationError, value]);\n\n const inputValue = getDisplayDate(date, format, utils, value === null, props);\n const inputProps = useMemo(\n () => ({\n inputValue,\n validationError,\n openPicker: () => !readOnly && !disabled && setIsOpen(true),\n }),\n [disabled, inputValue, readOnly, setIsOpen, validationError]\n );\n\n const pickerState = { pickerProps, inputProps, wrapperProps };\n\n useDebugValue(pickerState);\n return pickerState;\n}\n","/* eslint-disable react-hooks/rules-of-hooks */\nimport { BasePickerProps } from '../../typings/BasePicker';\nimport { useCallback, useState, Dispatch, SetStateAction } from 'react';\n\nexport function useOpenState({ open, onOpen, onClose }: BasePickerProps) {\n let setIsOpenState: null | Dispatch> = null;\n if (open === undefined || open === null) {\n // The component is uncontrolled, so we need to give it its own state.\n [open, setIsOpenState] = useState(false);\n }\n\n // prettier-ignore\n const setIsOpen = useCallback((newIsOpen: boolean) => {\n setIsOpenState && setIsOpenState(newIsOpen);\n\n return newIsOpen\n ? onOpen && onOpen()\n : onClose && onClose();\n }, [onOpen, onClose, setIsOpenState]);\n\n return { isOpen: open, setIsOpen };\n}\n","import * as React from 'react';\nimport { BasePickerProps } from '../typings/BasePicker';\nimport { Picker, ToolbarComponentProps } from './Picker';\nimport { ExtendWrapper, Wrapper } from '../wrappers/Wrapper';\nimport { PureDateInputProps } from '../_shared/PureDateInput';\nimport { DateValidationProps } from '../_helpers/text-field-helper';\nimport { KeyboardDateInputProps } from '../_shared/KeyboardDateInput';\nimport { StateHookOptions, usePickerState } from '../_shared/hooks/usePickerState';\nimport {\n BaseKeyboardPickerProps,\n useKeyboardPickerState,\n} from '../_shared/hooks/useKeyboardPickerState';\n\nexport type WithKeyboardInputProps = DateValidationProps &\n BaseKeyboardPickerProps &\n ExtendWrapper;\n\nexport type WithPureInputProps = DateValidationProps &\n BasePickerProps &\n ExtendWrapper;\n\nexport interface MakePickerOptions {\n Input: any;\n useState: typeof usePickerState | typeof useKeyboardPickerState;\n useOptions: (props: any) => StateHookOptions;\n getCustomProps?: (props: T) => Partial;\n DefaultToolbarComponent: React.ComponentType;\n}\n\nexport function makePickerWithState({\n Input,\n useState,\n useOptions,\n getCustomProps,\n DefaultToolbarComponent,\n}: MakePickerOptions): React.FC {\n function PickerWithState(props: T) {\n const {\n allowKeyboardControl,\n ampm,\n animateYearScrolling,\n autoOk,\n dateRangeIcon,\n disableFuture,\n disablePast,\n disableToolbar,\n emptyLabel,\n format,\n forwardedRef,\n hideTabs,\n initialFocusedDate,\n invalidDateMessage,\n invalidLabel,\n labelFunc,\n leftArrowButtonProps,\n leftArrowIcon,\n loadingIndicator,\n maxDate,\n maxDateMessage,\n minDate,\n minDateMessage,\n minutesStep,\n onAccept,\n onChange,\n onClose,\n onMonthChange,\n onOpen,\n onYearChange,\n openTo,\n orientation,\n renderDay,\n rightArrowButtonProps,\n rightArrowIcon,\n shouldDisableDate,\n strictCompareDates,\n timeIcon,\n ToolbarComponent = DefaultToolbarComponent,\n value,\n variant,\n views,\n ...other\n } = props;\n\n const injectedProps = getCustomProps ? getCustomProps(props) : {};\n\n const options = useOptions(props);\n const { pickerProps, inputProps, wrapperProps } = useState(props as any, options);\n\n return (\n \n \n \n );\n }\n\n return PickerWithState;\n}\n","import * as React from 'react';\nimport clsx from 'clsx';\nimport ToolbarButton from '../_shared/ToolbarButton';\nimport PickerToolbar from '../_shared/PickerToolbar';\nimport { useUtils } from '../_shared/hooks/useUtils';\nimport { makeStyles } from '@material-ui/core/styles';\nimport { ToolbarComponentProps } from '../Picker/Picker';\nimport { isYearAndMonthViews, isYearOnlyView } from '../_helpers/date-utils';\n\nexport const useStyles = makeStyles(\n {\n toolbar: {\n flexDirection: 'column',\n alignItems: 'flex-start',\n },\n toolbarLandscape: {\n padding: 16,\n },\n dateLandscape: {\n marginRight: 16,\n },\n },\n { name: 'MuiPickersDatePickerRoot' }\n);\n\nexport const DatePickerToolbar: React.FC = ({\n date,\n views,\n setOpenView,\n isLandscape,\n openView,\n}) => {\n const utils = useUtils();\n const classes = useStyles();\n\n const isYearOnly = React.useMemo(() => isYearOnlyView(views as any), [views]);\n const isYearAndMonth = React.useMemo(() => isYearAndMonthViews(views as any), [views]);\n\n return (\n \n setOpenView('year')}\n selected={openView === 'year'}\n label={utils.getYearText(date)}\n />\n\n {!isYearOnly && !isYearAndMonth && (\n setOpenView('date')}\n align={isLandscape ? 'left' : 'center'}\n label={utils.getDatePickerHeaderText(date)}\n className={clsx({ [classes.dateLandscape]: isLandscape })}\n />\n )}\n\n {isYearAndMonth && (\n setOpenView('month')}\n selected={openView === 'month'}\n label={utils.getMonthText(date)}\n />\n )}\n \n );\n};\n","import { useUtils } from '../_shared/hooks/useUtils';\nimport { MaterialUiPickersDate } from '../typings/date';\nimport { DatePickerToolbar } from './DatePickerToolbar';\nimport { PureDateInput } from '../_shared/PureDateInput';\nimport { getFormatByViews } from '../_helpers/date-utils';\nimport { KeyboardDateInput } from '../_shared/KeyboardDateInput';\nimport { OutterCalendarProps } from '../views/Calendar/Calendar';\nimport { usePickerState } from '../_shared/hooks/usePickerState';\nimport { datePickerDefaultProps, ParsableDate } from '../constants/prop-types';\nimport { useKeyboardPickerState } from '../_shared/hooks/useKeyboardPickerState';\nimport {\n WithKeyboardInputProps,\n WithPureInputProps,\n makePickerWithState,\n} from '../Picker/makePickerWithState';\n\nexport type DatePickerView = 'year' | 'date' | 'month';\n\nexport interface BaseDatePickerProps extends OutterCalendarProps {\n /**\n * Min selectable date\n * @default Date(1900-01-01)\n */\n minDate?: ParsableDate;\n /**\n * Max selectable date\n * @default Date(2100-01-01)\n */\n maxDate?: ParsableDate;\n\n /**\n * Compare dates by the exact timestamp, instead of start/end of date\n * @default false\n */\n strictCompareDates?: boolean;\n\n /**\n * Disable past dates\n * @default false\n */\n disablePast?: boolean;\n /**\n * Disable future dates\n * @default false\n */\n disableFuture?: boolean;\n /**\n * To animate scrolling to current year (using scrollIntoView)\n * @default false\n */\n animateYearScrolling?: boolean;\n /** Callback firing on year change @DateIOType */\n onYearChange?: (date: MaterialUiPickersDate) => void;\n}\n\nexport interface DatePickerViewsProps extends BaseDatePickerProps {\n /**\n * Array of views to show\n * @type {Array<\"year\" | \"date\" | \"month\">}\n */\n views?: DatePickerView[];\n /** First view to show in DatePicker */\n openTo?: DatePickerView;\n}\n\nexport type DatePickerProps = WithPureInputProps & DatePickerViewsProps;\n\nexport type KeyboardDatePickerProps = WithKeyboardInputProps & DatePickerViewsProps;\n\nconst defaultProps = {\n ...datePickerDefaultProps,\n openTo: 'date' as DatePickerView,\n views: ['year', 'date'] as DatePickerView[],\n};\n\nfunction useOptions(props: DatePickerViewsProps) {\n const utils = useUtils();\n\n return {\n getDefaultFormat: () => getFormatByViews(props.views!, utils),\n };\n}\n\nexport const DatePicker = makePickerWithState({\n useOptions,\n Input: PureDateInput,\n useState: usePickerState,\n DefaultToolbarComponent: DatePickerToolbar,\n});\n\nexport const KeyboardDatePicker = makePickerWithState({\n useOptions,\n Input: KeyboardDateInput,\n useState: useKeyboardPickerState,\n DefaultToolbarComponent: DatePickerToolbar,\n});\n\nDatePicker.defaultProps = defaultProps;\n\nKeyboardDatePicker.defaultProps = defaultProps;\n","import { useUtils } from './useUtils';\nimport { Omit } from '../../_helpers/utils';\nimport { IUtils } from '@date-io/core/IUtils';\nimport { BasePickerProps } from '../../typings/BasePicker';\nimport { MaterialUiPickersDate } from '../../typings/date';\nimport { useCallback, useEffect, useMemo, useState } from 'react';\nimport { getDisplayDate } from '../../_helpers/text-field-helper';\nimport { StateHookOptions, usePickerState } from './usePickerState';\n\nexport interface BaseKeyboardPickerProps extends Omit {\n /** String value for controlling value with pure input string. Overrides value prop */\n inputValue?: string;\n /** Keyboard onChange callback @DateIOType */\n onChange: (date: MaterialUiPickersDate | null, value?: string | null) => void;\n}\n\nfunction parseInputString(value: string, utils: IUtils, format: string) {\n try {\n return utils.parse(value, format);\n } catch {\n return null;\n }\n}\n\nexport function useKeyboardPickerState(props: BaseKeyboardPickerProps, options: StateHookOptions) {\n const { format = options.getDefaultFormat(), inputValue, onChange, value } = props;\n const utils = useUtils();\n\n const displayDate = getDisplayDate(value, format, utils, value === null, props);\n const [innerInputValue, setInnerInputValue] = useState(displayDate);\n const dateValue = inputValue ? parseInputString(inputValue, utils, format) : value;\n\n useEffect(() => {\n if (value === null || utils.isValid(value)) {\n setInnerInputValue(displayDate);\n }\n }, [displayDate, setInnerInputValue, utils, value]);\n\n const handleKeyboardChange = useCallback(\n (date: MaterialUiPickersDate) => {\n onChange(date, date === null ? null : utils.format(date, format));\n },\n [format, onChange, utils]\n );\n\n const { inputProps: innerInputProps, wrapperProps, pickerProps } = usePickerState(\n // Extend props interface\n { ...props, value: dateValue, onChange: handleKeyboardChange },\n options\n );\n\n const inputProps = useMemo(\n () => ({\n ...innerInputProps, // reuse validation and open/close logic\n format: wrapperProps.format,\n inputValue: inputValue || innerInputValue,\n onChange: (value: string | null) => {\n setInnerInputValue(value || '');\n const date = value === null ? null : utils.parse(value, wrapperProps.format);\n\n onChange(date, value);\n },\n }),\n [innerInputProps, innerInputValue, inputValue, onChange, utils, wrapperProps.format]\n );\n\n return {\n inputProps,\n wrapperProps,\n pickerProps,\n };\n}\n","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport DateFnsUtils from '@date-io/date-fns';\nimport { MuiPickersUtilsProvider, KeyboardDatePicker } from '@material-ui/pickers';\nimport { makeStyles } from '@material-ui/core/styles';\nimport uuid from 'uuid/v4';\nimport PropTypes from 'prop-types';\nimport { Field } from \"../forms\";\nvar useStyles = makeStyles(function (theme) {\n return {\n root: function root(props) {\n return {\n marginRight: -14,\n // To offset InputField padding\n '& .MuiSvgIcon-root': {\n color: props.error ? theme.palette.error.main : theme.palette.text.secondary\n }\n };\n }\n };\n});\nimport { TextField } from \"./\";\n\nvar DateField = function DateField(props) {\n var _props$id = props.id,\n id = _props$id === void 0 ? uuid() : _props$id,\n value = props.value,\n label = props.label,\n onChange = props.onChange,\n onBlur = props.onBlur,\n format = props.format,\n disablePast = props.disablePast,\n disableFuture = props.disableFuture,\n minDate = props.minDate,\n maxDate = props.maxDate,\n disableToolbar = props.disableToolbar,\n error = props.error,\n helpText = props.helpText,\n KeyboardDatePickerProps = props.KeyboardDatePickerProps,\n fullWidth = props.fullWidth;\n var classes = useStyles(props);\n return React.createElement(Field, {\n helpText: helpText\n }, React.createElement(MuiPickersUtilsProvider, {\n utils: DateFnsUtils\n }, React.createElement(KeyboardDatePicker, _extends({\n disableToolbar: disableToolbar,\n variant: \"inline\",\n format: format,\n disablePast: disablePast,\n disableFuture: disableFuture,\n minDate: minDate,\n maxDate: maxDate,\n id: id,\n label: label,\n value: value || null,\n onChange: onChange,\n onBlur: onBlur,\n autoOk: true,\n KeyboardButtonProps: {\n 'aria-label': \"Choose \".concat(label)\n },\n InputAdornmentProps: {\n className: classes.root\n },\n TextFieldComponent: TextField,\n error: error\n }, KeyboardDatePickerProps || {}, {\n fullWidth: fullWidth\n }))));\n};\n\n__signature__(DateField, \"useStyles{classes}\", function () {\n return [useStyles];\n});\n\nDateField.propTypes = {\n disableToolbar: PropTypes.bool,\n error: PropTypes.bool,\n helpText: PropTypes.string,\n // eslint-disable-next-line react/forbid-prop-types\n KeyboardDatePickerProps: PropTypes.object\n};\nDateField.defaultProps = {\n format: 'dd.MM.yyyy',\n onChange: function onChange() {},\n onBlur: function onBlur() {},\n disableToolbar: true,\n error: false,\n fullWidth: false\n};\nvar _default = DateField;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(useStyles, \"useStyles\", \"/home/vsts/work/1/s/src/components/inputs/DateField.js\");\n reactHotLoader.register(DateField, \"DateField\", \"/home/vsts/work/1/s/src/components/inputs/DateField.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/inputs/DateField.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","import * as React from 'react';\n/**\n * @ignore - internal component.\n */\n\nvar RadioGroupContext = React.createContext();\n\nif (process.env.NODE_ENV !== 'production') {\n RadioGroupContext.displayName = 'RadioGroupContext';\n}\n\nexport default RadioGroupContext;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _slicedToArray from \"@babel/runtime/helpers/esm/slicedToArray\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport FormGroup from '../FormGroup';\nimport useForkRef from '../utils/useForkRef';\nimport useControlled from '../utils/useControlled';\nimport RadioGroupContext from './RadioGroupContext';\nimport useId from '../utils/unstable_useId';\nvar RadioGroup = /*#__PURE__*/React.forwardRef(function RadioGroup(props, ref) {\n var actions = props.actions,\n children = props.children,\n nameProp = props.name,\n valueProp = props.value,\n onChange = props.onChange,\n other = _objectWithoutProperties(props, [\"actions\", \"children\", \"name\", \"value\", \"onChange\"]);\n\n var rootRef = React.useRef(null);\n\n var _useControlled = useControlled({\n controlled: valueProp,\n default: props.defaultValue,\n name: 'RadioGroup'\n }),\n _useControlled2 = _slicedToArray(_useControlled, 2),\n value = _useControlled2[0],\n setValue = _useControlled2[1];\n\n React.useImperativeHandle(actions, function () {\n return {\n focus: function focus() {\n var input = rootRef.current.querySelector('input:not(:disabled):checked');\n\n if (!input) {\n input = rootRef.current.querySelector('input:not(:disabled)');\n }\n\n if (input) {\n input.focus();\n }\n }\n };\n }, []);\n var handleRef = useForkRef(ref, rootRef);\n\n var handleChange = function handleChange(event) {\n setValue(event.target.value);\n\n if (onChange) {\n onChange(event, event.target.value);\n }\n };\n\n var name = useId(nameProp);\n return /*#__PURE__*/React.createElement(RadioGroupContext.Provider, {\n value: {\n name: name,\n onChange: handleChange,\n value: value\n }\n }, /*#__PURE__*/React.createElement(FormGroup, _extends({\n role: \"radiogroup\",\n ref: handleRef\n }, other), children));\n});\nprocess.env.NODE_ENV !== \"production\" ? RadioGroup.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the d.ts file and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n\n /**\n * The content of the component.\n */\n children: PropTypes.node,\n\n /**\n * The default `input` element value. Use when the component is not controlled.\n */\n defaultValue: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string), PropTypes.number, PropTypes.string]),\n\n /**\n * The name used to reference the value of the control.\n * If you don't provide this prop, it falls back to a randomly generated name.\n */\n name: PropTypes.string,\n\n /**\n * Callback fired when a radio button is selected.\n *\n * @param {object} event The event source of the callback.\n * You can pull out the new value by accessing `event.target.value` (string).\n */\n onChange: PropTypes.func,\n\n /**\n * Value of the selected radio button. The DOM API casts this to a string.\n */\n value: PropTypes.any\n} : void 0;\nexport default RadioGroup;","import * as React from 'react';\nimport createSvgIcon from '../../utils/createSvgIcon';\n/**\n * @ignore - internal component.\n */\n\nexport default createSvgIcon( /*#__PURE__*/React.createElement(\"path\", {\n d: \"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z\"\n}), 'RadioButtonUnchecked');","import * as React from 'react';\nimport createSvgIcon from '../../utils/createSvgIcon';\n/**\n * @ignore - internal component.\n */\n\nexport default createSvgIcon( /*#__PURE__*/React.createElement(\"path\", {\n d: \"M8.465 8.465C9.37 7.56 10.62 7 12 7C14.76 7 17 9.24 17 12C17 13.38 16.44 14.63 15.535 15.535C14.63 16.44 13.38 17 12 17C9.24 17 7 14.76 7 12C7 10.62 7.56 9.37 8.465 8.465Z\"\n}), 'RadioButtonChecked');","import * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport RadioButtonUncheckedIcon from '../internal/svg-icons/RadioButtonUnchecked';\nimport RadioButtonCheckedIcon from '../internal/svg-icons/RadioButtonChecked';\nimport withStyles from '../styles/withStyles';\nexport var styles = function styles(theme) {\n return {\n root: {\n position: 'relative',\n display: 'flex',\n '&$checked $layer': {\n transform: 'scale(1)',\n transition: theme.transitions.create('transform', {\n easing: theme.transitions.easing.easeOut,\n duration: theme.transitions.duration.shortest\n })\n }\n },\n layer: {\n left: 0,\n position: 'absolute',\n transform: 'scale(0)',\n transition: theme.transitions.create('transform', {\n easing: theme.transitions.easing.easeIn,\n duration: theme.transitions.duration.shortest\n })\n },\n checked: {}\n };\n};\n/**\n * @ignore - internal component.\n */\n\nfunction RadioButtonIcon(props) {\n var checked = props.checked,\n classes = props.classes,\n fontSize = props.fontSize;\n return /*#__PURE__*/React.createElement(\"div\", {\n className: clsx(classes.root, checked && classes.checked)\n }, /*#__PURE__*/React.createElement(RadioButtonUncheckedIcon, {\n fontSize: fontSize\n }), /*#__PURE__*/React.createElement(RadioButtonCheckedIcon, {\n fontSize: fontSize,\n className: classes.layer\n }));\n}\n\nprocess.env.NODE_ENV !== \"production\" ? RadioButtonIcon.propTypes = {\n /**\n * If `true`, the component is checked.\n */\n checked: PropTypes.bool,\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object.isRequired,\n\n /**\n * The size of the radio.\n * `small` is equivalent to the dense radio styling.\n */\n fontSize: PropTypes.oneOf(['small', 'medium'])\n} : void 0;\nexport default withStyles(styles, {\n name: 'PrivateRadioButtonIcon'\n})(RadioButtonIcon);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { refType } from '@material-ui/utils';\nimport SwitchBase from '../internal/SwitchBase';\nimport RadioButtonIcon from './RadioButtonIcon';\nimport { alpha } from '../styles/colorManipulator';\nimport capitalize from '../utils/capitalize';\nimport createChainedFunction from '../utils/createChainedFunction';\nimport withStyles from '../styles/withStyles';\nimport useRadioGroup from '../RadioGroup/useRadioGroup';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: {\n color: theme.palette.text.secondary\n },\n\n /* Pseudo-class applied to the root element if `checked={true}`. */\n checked: {},\n\n /* Pseudo-class applied to the root element if `disabled={true}`. */\n disabled: {},\n\n /* Styles applied to the root element if `color=\"primary\"`. */\n colorPrimary: {\n '&$checked': {\n color: theme.palette.primary.main,\n '&:hover': {\n backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.hoverOpacity),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n }\n },\n '&$disabled': {\n color: theme.palette.action.disabled\n }\n },\n\n /* Styles applied to the root element if `color=\"secondary\"`. */\n colorSecondary: {\n '&$checked': {\n color: theme.palette.secondary.main,\n '&:hover': {\n backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.hoverOpacity),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n }\n },\n '&$disabled': {\n color: theme.palette.action.disabled\n }\n }\n };\n};\nvar defaultCheckedIcon = /*#__PURE__*/React.createElement(RadioButtonIcon, {\n checked: true\n});\nvar defaultIcon = /*#__PURE__*/React.createElement(RadioButtonIcon, null);\nvar Radio = /*#__PURE__*/React.forwardRef(function Radio(props, ref) {\n var checkedProp = props.checked,\n classes = props.classes,\n _props$color = props.color,\n color = _props$color === void 0 ? 'secondary' : _props$color,\n nameProp = props.name,\n onChangeProp = props.onChange,\n _props$size = props.size,\n size = _props$size === void 0 ? 'medium' : _props$size,\n other = _objectWithoutProperties(props, [\"checked\", \"classes\", \"color\", \"name\", \"onChange\", \"size\"]);\n\n var radioGroup = useRadioGroup();\n var checked = checkedProp;\n var onChange = createChainedFunction(onChangeProp, radioGroup && radioGroup.onChange);\n var name = nameProp;\n\n if (radioGroup) {\n if (typeof checked === 'undefined') {\n checked = radioGroup.value === props.value;\n }\n\n if (typeof name === 'undefined') {\n name = radioGroup.name;\n }\n }\n\n return /*#__PURE__*/React.createElement(SwitchBase, _extends({\n color: color,\n type: \"radio\",\n icon: /*#__PURE__*/React.cloneElement(defaultIcon, {\n fontSize: size === 'small' ? 'small' : 'medium'\n }),\n checkedIcon: /*#__PURE__*/React.cloneElement(defaultCheckedIcon, {\n fontSize: size === 'small' ? 'small' : 'medium'\n }),\n classes: {\n root: clsx(classes.root, classes[\"color\".concat(capitalize(color))]),\n checked: classes.checked,\n disabled: classes.disabled\n },\n name: name,\n checked: checked,\n onChange: onChange,\n ref: ref\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? Radio.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the d.ts file and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n\n /**\n * If `true`, the component is checked.\n */\n checked: PropTypes.bool,\n\n /**\n * The icon to display when the component is checked.\n */\n checkedIcon: PropTypes.node,\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object,\n\n /**\n * The color of the component. It supports those theme colors that make sense for this component.\n */\n color: PropTypes.oneOf(['default', 'primary', 'secondary']),\n\n /**\n * If `true`, the radio will be disabled.\n */\n disabled: PropTypes.bool,\n\n /**\n * If `true`, the ripple effect will be disabled.\n */\n disableRipple: PropTypes.bool,\n\n /**\n * The icon to display when the component is unchecked.\n */\n icon: PropTypes.node,\n\n /**\n * The id of the `input` element.\n */\n id: PropTypes.string,\n\n /**\n * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.\n */\n inputProps: PropTypes.object,\n\n /**\n * Pass a ref to the `input` element.\n */\n inputRef: refType,\n\n /**\n * Name attribute of the `input` element.\n */\n name: PropTypes.string,\n\n /**\n * Callback fired when the state is changed.\n *\n * @param {object} event The event source of the callback.\n * You can pull out the new value by accessing `event.target.value` (string).\n * You can pull out the new checked state by accessing `event.target.checked` (boolean).\n */\n onChange: PropTypes.func,\n\n /**\n * If `true`, the `input` element will be required.\n */\n required: PropTypes.bool,\n\n /**\n * The size of the radio.\n * `small` is equivalent to the dense radio styling.\n */\n size: PropTypes.oneOf(['medium', 'small']),\n\n /**\n * The value of the component. The DOM API casts this to a string.\n */\n value: PropTypes.any\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiRadio'\n})(Radio);","import * as React from 'react';\nimport RadioGroupContext from './RadioGroupContext';\nexport default function useRadioGroup() {\n return React.useContext(RadioGroupContext);\n}","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport { Radio as MuiRadio, RadioGroup as MuiRadioGroup, FormControlLabel, FormControl, FormLabel } from '@material-ui/core';\nimport PropTypes from 'prop-types';\n\nvar RadioGroup = function RadioGroup(props) {\n var options = props.options,\n value = props.value,\n onChange = props.onChange,\n name = props.name,\n label = props.label,\n color = props.color,\n direction = props.direction;\n var handleChange = onChange;\n return React.createElement(FormControl, {\n component: \"fieldset\"\n }, label ? React.createElement(FormLabel, {\n component: \"legend\"\n }, label) : null, React.createElement(MuiRadioGroup, {\n row: direction === 'row',\n \"aria-label\": name,\n name: name,\n value: value,\n onChange: handleChange\n }, options.map(function (option) {\n return React.createElement(FormControlLabel, {\n key: option.value,\n value: option.value,\n control: React.createElement(MuiRadio, {\n color: color\n }),\n label: option.text,\n disabled: Boolean(option.disabled)\n });\n })));\n};\n\nRadioGroup.propTypes = {\n name: PropTypes.string,\n label: PropTypes.string,\n options: PropTypes.arrayOf(PropTypes.shape({\n value: PropTypes.string,\n text: PropTypes.string,\n disabled: PropTypes.bool\n })),\n value: PropTypes.string,\n onChange: PropTypes.func,\n color: PropTypes.oneOf(['default', 'primary', 'secondary']),\n direction: PropTypes.oneOf(['row', 'column'])\n};\nRadioGroup.defaultProps = {\n options: [],\n onChange: function onChange() {\n return console.warn('No onChange function is provided');\n },\n color: 'default',\n direction: 'column'\n};\nvar _default = RadioGroup;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(RadioGroup, \"RadioGroup\", \"/home/vsts/work/1/s/src/components/inputs/RadioGroup.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/inputs/RadioGroup.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { chainPropTypes } from '@material-ui/utils';\nimport withStyles from '../styles/withStyles';\nimport ButtonBase from '../ButtonBase';\nimport isMuiElement from '../utils/isMuiElement';\nimport useForkRef from '../utils/useForkRef';\nimport ListContext from '../List/ListContext';\nimport * as ReactDOM from 'react-dom';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the (normally root) `component` element. May be wrapped by a `container`. */\n root: {\n display: 'flex',\n justifyContent: 'flex-start',\n alignItems: 'center',\n position: 'relative',\n textDecoration: 'none',\n width: '100%',\n boxSizing: 'border-box',\n textAlign: 'left',\n paddingTop: 8,\n paddingBottom: 8,\n '&$focusVisible': {\n backgroundColor: theme.palette.action.selected\n },\n '&$selected, &$selected:hover': {\n backgroundColor: theme.palette.action.selected\n },\n '&$disabled': {\n opacity: 0.5\n }\n },\n\n /* Styles applied to the `container` element if `children` includes `ListItemSecondaryAction`. */\n container: {\n position: 'relative'\n },\n\n /* Pseudo-class applied to the `component`'s `focusVisibleClassName` prop if `button={true}`. */\n focusVisible: {},\n\n /* Styles applied to the `component` element if dense. */\n dense: {\n paddingTop: 4,\n paddingBottom: 4\n },\n\n /* Styles applied to the `component` element if `alignItems=\"flex-start\"`. */\n alignItemsFlexStart: {\n alignItems: 'flex-start'\n },\n\n /* Pseudo-class applied to the inner `component` element if `disabled={true}`. */\n disabled: {},\n\n /* Styles applied to the inner `component` element if `divider={true}`. */\n divider: {\n borderBottom: \"1px solid \".concat(theme.palette.divider),\n backgroundClip: 'padding-box'\n },\n\n /* Styles applied to the inner `component` element if `disableGutters={false}`. */\n gutters: {\n paddingLeft: 16,\n paddingRight: 16\n },\n\n /* Styles applied to the inner `component` element if `button={true}`. */\n button: {\n transition: theme.transitions.create('background-color', {\n duration: theme.transitions.duration.shortest\n }),\n '&:hover': {\n textDecoration: 'none',\n backgroundColor: theme.palette.action.hover,\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n }\n },\n\n /* Styles applied to the `component` element if `children` includes `ListItemSecondaryAction`. */\n secondaryAction: {\n // Add some space to avoid collision as `ListItemSecondaryAction`\n // is absolutely positioned.\n paddingRight: 48\n },\n\n /* Pseudo-class applied to the root element if `selected={true}`. */\n selected: {}\n };\n};\nvar useEnhancedEffect = typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect;\n/**\n * Uses an additional container component if `ListItemSecondaryAction` is the last child.\n */\n\nvar ListItem = /*#__PURE__*/React.forwardRef(function ListItem(props, ref) {\n var _props$alignItems = props.alignItems,\n alignItems = _props$alignItems === void 0 ? 'center' : _props$alignItems,\n _props$autoFocus = props.autoFocus,\n autoFocus = _props$autoFocus === void 0 ? false : _props$autoFocus,\n _props$button = props.button,\n button = _props$button === void 0 ? false : _props$button,\n childrenProp = props.children,\n classes = props.classes,\n className = props.className,\n componentProp = props.component,\n _props$ContainerCompo = props.ContainerComponent,\n ContainerComponent = _props$ContainerCompo === void 0 ? 'li' : _props$ContainerCompo,\n _props$ContainerProps = props.ContainerProps;\n _props$ContainerProps = _props$ContainerProps === void 0 ? {} : _props$ContainerProps;\n\n var ContainerClassName = _props$ContainerProps.className,\n ContainerProps = _objectWithoutProperties(_props$ContainerProps, [\"className\"]),\n _props$dense = props.dense,\n dense = _props$dense === void 0 ? false : _props$dense,\n _props$disabled = props.disabled,\n disabled = _props$disabled === void 0 ? false : _props$disabled,\n _props$disableGutters = props.disableGutters,\n disableGutters = _props$disableGutters === void 0 ? false : _props$disableGutters,\n _props$divider = props.divider,\n divider = _props$divider === void 0 ? false : _props$divider,\n focusVisibleClassName = props.focusVisibleClassName,\n _props$selected = props.selected,\n selected = _props$selected === void 0 ? false : _props$selected,\n other = _objectWithoutProperties(props, [\"alignItems\", \"autoFocus\", \"button\", \"children\", \"classes\", \"className\", \"component\", \"ContainerComponent\", \"ContainerProps\", \"dense\", \"disabled\", \"disableGutters\", \"divider\", \"focusVisibleClassName\", \"selected\"]);\n\n var context = React.useContext(ListContext);\n var childContext = {\n dense: dense || context.dense || false,\n alignItems: alignItems\n };\n var listItemRef = React.useRef(null);\n useEnhancedEffect(function () {\n if (autoFocus) {\n if (listItemRef.current) {\n listItemRef.current.focus();\n } else if (process.env.NODE_ENV !== 'production') {\n console.error('Material-UI: Unable to set focus to a ListItem whose component has not been rendered.');\n }\n }\n }, [autoFocus]);\n var children = React.Children.toArray(childrenProp);\n var hasSecondaryAction = children.length && isMuiElement(children[children.length - 1], ['ListItemSecondaryAction']);\n var handleOwnRef = React.useCallback(function (instance) {\n // #StrictMode ready\n listItemRef.current = ReactDOM.findDOMNode(instance);\n }, []);\n var handleRef = useForkRef(handleOwnRef, ref);\n\n var componentProps = _extends({\n className: clsx(classes.root, className, childContext.dense && classes.dense, !disableGutters && classes.gutters, divider && classes.divider, disabled && classes.disabled, button && classes.button, alignItems !== \"center\" && classes.alignItemsFlexStart, hasSecondaryAction && classes.secondaryAction, selected && classes.selected),\n disabled: disabled\n }, other);\n\n var Component = componentProp || 'li';\n\n if (button) {\n componentProps.component = componentProp || 'div';\n componentProps.focusVisibleClassName = clsx(classes.focusVisible, focusVisibleClassName);\n Component = ButtonBase;\n }\n\n if (hasSecondaryAction) {\n // Use div by default.\n Component = !componentProps.component && !componentProp ? 'div' : Component; // Avoid nesting of li > li.\n\n if (ContainerComponent === 'li') {\n if (Component === 'li') {\n Component = 'div';\n } else if (componentProps.component === 'li') {\n componentProps.component = 'div';\n }\n }\n\n return /*#__PURE__*/React.createElement(ListContext.Provider, {\n value: childContext\n }, /*#__PURE__*/React.createElement(ContainerComponent, _extends({\n className: clsx(classes.container, ContainerClassName),\n ref: handleRef\n }, ContainerProps), /*#__PURE__*/React.createElement(Component, componentProps, children), children.pop()));\n }\n\n return /*#__PURE__*/React.createElement(ListContext.Provider, {\n value: childContext\n }, /*#__PURE__*/React.createElement(Component, _extends({\n ref: handleRef\n }, componentProps), children));\n});\nprocess.env.NODE_ENV !== \"production\" ? ListItem.propTypes = {\n /**\n * Defines the `align-items` style property.\n */\n alignItems: PropTypes.oneOf(['flex-start', 'center']),\n\n /**\n * If `true`, the list item will be focused during the first mount.\n * Focus will also be triggered if the value changes from false to true.\n */\n autoFocus: PropTypes.bool,\n\n /**\n * If `true`, the list item will be a button (using `ButtonBase`). Props intended\n * for `ButtonBase` can then be applied to `ListItem`.\n */\n button: PropTypes.bool,\n\n /**\n * The content of the component. If a `ListItemSecondaryAction` is used it must\n * be the last child.\n */\n children: chainPropTypes(PropTypes.node, function (props) {\n var children = React.Children.toArray(props.children); // React.Children.toArray(props.children).findLastIndex(isListItemSecondaryAction)\n\n var secondaryActionIndex = -1;\n\n for (var i = children.length - 1; i >= 0; i -= 1) {\n var child = children[i];\n\n if (isMuiElement(child, ['ListItemSecondaryAction'])) {\n secondaryActionIndex = i;\n break;\n }\n } // is ListItemSecondaryAction the last child of ListItem\n\n\n if (secondaryActionIndex !== -1 && secondaryActionIndex !== children.length - 1) {\n return new Error('Material-UI: You used an element after ListItemSecondaryAction. ' + 'For ListItem to detect that it has a secondary action ' + 'you must pass it as the last child to ListItem.');\n }\n\n return null;\n }),\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object.isRequired,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * The component used for the root node.\n * Either a string to use a HTML element or a component.\n * By default, it's a `li` when `button` is `false` and a `div` when `button` is `true`.\n */\n component: PropTypes\n /* @typescript-to-proptypes-ignore */\n .elementType,\n\n /**\n * The container component used when a `ListItemSecondaryAction` is the last child.\n */\n ContainerComponent: PropTypes.elementType,\n\n /**\n * Props applied to the container component if used.\n */\n ContainerProps: PropTypes.object,\n\n /**\n * If `true`, compact vertical padding designed for keyboard and mouse input will be used.\n */\n dense: PropTypes.bool,\n\n /**\n * If `true`, the list item will be disabled.\n */\n disabled: PropTypes.bool,\n\n /**\n * If `true`, the left and right padding is removed.\n */\n disableGutters: PropTypes.bool,\n\n /**\n * If `true`, a 1px light border is added to the bottom of the list item.\n */\n divider: PropTypes.bool,\n\n /**\n * @ignore\n */\n focusVisibleClassName: PropTypes.string,\n\n /**\n * Use to apply selected styling.\n */\n selected: PropTypes.bool\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiListItem'\n})(ListItem);","import _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport _defineProperty from \"@babel/runtime/helpers/esm/defineProperty\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport ListItem from '../ListItem';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: _extends({}, theme.typography.body1, _defineProperty({\n minHeight: 48,\n paddingTop: 6,\n paddingBottom: 6,\n boxSizing: 'border-box',\n width: 'auto',\n overflow: 'hidden',\n whiteSpace: 'nowrap'\n }, theme.breakpoints.up('sm'), {\n minHeight: 'auto'\n })),\n // TODO v5: remove\n\n /* Styles applied to the root element if `disableGutters={false}`. */\n gutters: {},\n\n /* Styles applied to the root element if `selected={true}`. */\n selected: {},\n\n /* Styles applied to the root element if dense. */\n dense: _extends({}, theme.typography.body2, {\n minHeight: 'auto'\n })\n };\n};\nvar MenuItem = /*#__PURE__*/React.forwardRef(function MenuItem(props, ref) {\n var classes = props.classes,\n className = props.className,\n _props$component = props.component,\n component = _props$component === void 0 ? 'li' : _props$component,\n _props$disableGutters = props.disableGutters,\n disableGutters = _props$disableGutters === void 0 ? false : _props$disableGutters,\n ListItemClasses = props.ListItemClasses,\n _props$role = props.role,\n role = _props$role === void 0 ? 'menuitem' : _props$role,\n selected = props.selected,\n tabIndexProp = props.tabIndex,\n other = _objectWithoutProperties(props, [\"classes\", \"className\", \"component\", \"disableGutters\", \"ListItemClasses\", \"role\", \"selected\", \"tabIndex\"]);\n\n var tabIndex;\n\n if (!props.disabled) {\n tabIndex = tabIndexProp !== undefined ? tabIndexProp : -1;\n }\n\n return /*#__PURE__*/React.createElement(ListItem, _extends({\n button: true,\n role: role,\n tabIndex: tabIndex,\n component: component,\n selected: selected,\n disableGutters: disableGutters,\n classes: _extends({\n dense: classes.dense\n }, ListItemClasses),\n className: clsx(classes.root, className, selected && classes.selected, !disableGutters && classes.gutters),\n ref: ref\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? MenuItem.propTypes = {\n /**\n * Menu item contents.\n */\n children: PropTypes.node,\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object.isRequired,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * The component used for the root node.\n * Either a string to use a HTML element or a component.\n */\n component: PropTypes\n /* @typescript-to-proptypes-ignore */\n .elementType,\n\n /**\n * If `true`, compact vertical padding designed for keyboard and mouse input will be used.\n */\n dense: PropTypes.bool,\n\n /**\n * @ignore\n */\n disabled: PropTypes.bool,\n\n /**\n * If `true`, the left and right padding is removed.\n */\n disableGutters: PropTypes.bool,\n\n /**\n * `classes` prop applied to the [`ListItem`](/api/list-item/) element.\n */\n ListItemClasses: PropTypes.object,\n\n /**\n * @ignore\n */\n role: PropTypes.string,\n\n /**\n * @ignore\n */\n selected: PropTypes.bool,\n\n /**\n * @ignore\n */\n tabIndex: PropTypes.number\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiMenuItem'\n})(MenuItem);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport Typography from '../Typography';\nimport ListContext from '../List/ListContext';\nexport var styles = {\n /* Styles applied to the root element. */\n root: {\n flex: '1 1 auto',\n minWidth: 0,\n marginTop: 4,\n marginBottom: 4\n },\n\n /* Styles applied to the `Typography` components if primary and secondary are set. */\n multiline: {\n marginTop: 6,\n marginBottom: 6\n },\n\n /* Styles applied to the `Typography` components if dense. */\n dense: {},\n\n /* Styles applied to the root element if `inset={true}`. */\n inset: {\n paddingLeft: 56\n },\n\n /* Styles applied to the primary `Typography` component. */\n primary: {},\n\n /* Styles applied to the secondary `Typography` component. */\n secondary: {}\n};\nvar ListItemText = /*#__PURE__*/React.forwardRef(function ListItemText(props, ref) {\n var children = props.children,\n classes = props.classes,\n className = props.className,\n _props$disableTypogra = props.disableTypography,\n disableTypography = _props$disableTypogra === void 0 ? false : _props$disableTypogra,\n _props$inset = props.inset,\n inset = _props$inset === void 0 ? false : _props$inset,\n primaryProp = props.primary,\n primaryTypographyProps = props.primaryTypographyProps,\n secondaryProp = props.secondary,\n secondaryTypographyProps = props.secondaryTypographyProps,\n other = _objectWithoutProperties(props, [\"children\", \"classes\", \"className\", \"disableTypography\", \"inset\", \"primary\", \"primaryTypographyProps\", \"secondary\", \"secondaryTypographyProps\"]);\n\n var _React$useContext = React.useContext(ListContext),\n dense = _React$useContext.dense;\n\n var primary = primaryProp != null ? primaryProp : children;\n\n if (primary != null && primary.type !== Typography && !disableTypography) {\n primary = /*#__PURE__*/React.createElement(Typography, _extends({\n variant: dense ? 'body2' : 'body1',\n className: classes.primary,\n component: \"span\",\n display: \"block\"\n }, primaryTypographyProps), primary);\n }\n\n var secondary = secondaryProp;\n\n if (secondary != null && secondary.type !== Typography && !disableTypography) {\n secondary = /*#__PURE__*/React.createElement(Typography, _extends({\n variant: \"body2\",\n className: classes.secondary,\n color: \"textSecondary\",\n display: \"block\"\n }, secondaryTypographyProps), secondary);\n }\n\n return /*#__PURE__*/React.createElement(\"div\", _extends({\n className: clsx(classes.root, className, dense && classes.dense, inset && classes.inset, primary && secondary && classes.multiline),\n ref: ref\n }, other), primary, secondary);\n});\nprocess.env.NODE_ENV !== \"production\" ? ListItemText.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the d.ts file and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n\n /**\n * Alias for the `primary` prop.\n */\n children: PropTypes.node,\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * If `true`, the children won't be wrapped by a Typography component.\n * This can be useful to render an alternative Typography variant by wrapping\n * the `children` (or `primary`) text, and optional `secondary` text\n * with the Typography component.\n */\n disableTypography: PropTypes.bool,\n\n /**\n * If `true`, the children will be indented.\n * This should be used if there is no left avatar or left icon.\n */\n inset: PropTypes.bool,\n\n /**\n * The main content element.\n */\n primary: PropTypes.node,\n\n /**\n * These props will be forwarded to the primary typography component\n * (as long as disableTypography is not `true`).\n */\n primaryTypographyProps: PropTypes.object,\n\n /**\n * The secondary content element.\n */\n secondary: PropTypes.node,\n\n /**\n * These props will be forwarded to the secondary typography component\n * (as long as disableTypography is not `true`).\n */\n secondaryTypographyProps: PropTypes.object\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiListItemText'\n})(ListItemText);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport capitalize from '../utils/capitalize';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: {\n boxSizing: 'border-box',\n lineHeight: '48px',\n listStyle: 'none',\n color: theme.palette.text.secondary,\n fontFamily: theme.typography.fontFamily,\n fontWeight: theme.typography.fontWeightMedium,\n fontSize: theme.typography.pxToRem(14)\n },\n\n /* Styles applied to the root element if `color=\"primary\"`. */\n colorPrimary: {\n color: theme.palette.primary.main\n },\n\n /* Styles applied to the root element if `color=\"inherit\"`. */\n colorInherit: {\n color: 'inherit'\n },\n\n /* Styles applied to the inner `component` element if `disableGutters={false}`. */\n gutters: {\n paddingLeft: 16,\n paddingRight: 16\n },\n\n /* Styles applied to the root element if `inset={true}`. */\n inset: {\n paddingLeft: 72\n },\n\n /* Styles applied to the root element if `disableSticky={false}`. */\n sticky: {\n position: 'sticky',\n top: 0,\n zIndex: 1,\n backgroundColor: 'inherit'\n }\n };\n};\nvar ListSubheader = /*#__PURE__*/React.forwardRef(function ListSubheader(props, ref) {\n var classes = props.classes,\n className = props.className,\n _props$color = props.color,\n color = _props$color === void 0 ? 'default' : _props$color,\n _props$component = props.component,\n Component = _props$component === void 0 ? 'li' : _props$component,\n _props$disableGutters = props.disableGutters,\n disableGutters = _props$disableGutters === void 0 ? false : _props$disableGutters,\n _props$disableSticky = props.disableSticky,\n disableSticky = _props$disableSticky === void 0 ? false : _props$disableSticky,\n _props$inset = props.inset,\n inset = _props$inset === void 0 ? false : _props$inset,\n other = _objectWithoutProperties(props, [\"classes\", \"className\", \"color\", \"component\", \"disableGutters\", \"disableSticky\", \"inset\"]);\n\n return /*#__PURE__*/React.createElement(Component, _extends({\n className: clsx(classes.root, className, color !== 'default' && classes[\"color\".concat(capitalize(color))], inset && classes.inset, !disableSticky && classes.sticky, !disableGutters && classes.gutters),\n ref: ref\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? ListSubheader.propTypes = {\n /**\n * The content of the component.\n */\n children: PropTypes.node,\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object.isRequired,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * The color of the component. It supports those theme colors that make sense for this component.\n */\n color: PropTypes.oneOf(['default', 'primary', 'inherit']),\n\n /**\n * The component used for the root node.\n * Either a string to use a HTML element or a component.\n */\n component: PropTypes\n /* @typescript-to-proptypes-ignore */\n .elementType,\n\n /**\n * If `true`, the List Subheader will not have gutters.\n */\n disableGutters: PropTypes.bool,\n\n /**\n * If `true`, the List Subheader will not stick to the top during scroll.\n */\n disableSticky: PropTypes.bool,\n\n /**\n * If `true`, the List Subheader will be indented.\n */\n inset: PropTypes.bool\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiListSubheader'\n})(ListSubheader);","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\n\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== \"undefined\" && arr[Symbol.iterator] || arr[\"@@iterator\"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"] != null) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; }\n\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React, { forwardRef } from 'react';\nimport { FormControl, InputLabel, OutlinedInput, Select as MuiSelect, MenuItem, Checkbox, ListItemText, ListSubheader } from '@material-ui/core';\nimport PropTypes from 'prop-types';\nimport { withTheme } from 'styled-components';\nimport { media } from \"../../helpers/responsive\";\nimport { Field } from \"../forms\"; // TODO: Implement label position in themes. Compact vs. not?\n// const labelPositions = ['above', 'left', 'outlined', 'infield'];\n// const labelPosition = labelPositions[2];\n// TODO: Should be using native select for mobile and tablet,\n// the only issue is supporting optgroup\n// eslint-disable-next-line\n\nvar Select = forwardRef(__signature__(function (props, ref) {\n var label = props.label,\n onChange = props.onChange,\n options = props.options,\n value = props.value,\n disabled = props.disabled,\n onBlur = props.onBlur,\n multiple = props.multiple,\n displayEmpty = props.displayEmpty,\n renderValue = props.renderValue,\n testSelector = props.testSelector,\n name = props.name,\n fullWidth = props.fullWidth,\n helpText = props.helpText,\n SelectProps = props.SelectProps,\n error = props.error,\n rest = _objectWithoutProperties(props, [\"label\", \"onChange\", \"options\", \"value\", \"disabled\", \"onBlur\", \"multiple\", \"displayEmpty\", \"renderValue\", \"testSelector\", \"name\", \"fullWidth\", \"helpText\", \"SelectProps\", \"error\"]);\n\n var inputLabel = React.useRef(null);\n\n var _React$useState = React.useState(0),\n _React$useState2 = _slicedToArray(_React$useState, 2),\n labelWidth = _React$useState2[0],\n setLabelWidth = _React$useState2[1];\n\n React.useEffect(function () {\n if (inputLabel.current) {\n setLabelWidth(inputLabel.current.offsetWidth);\n }\n }, []);\n\n var handleChange = function handleChange(e) {\n var v = e.target.value; // Catch click events on optgroup, which would trigger onChange event\n // with value undefined or [...values, undefined].\n\n if (multiple && v.length && v[v.length - 1] === undefined) {\n return;\n } else if (!multiple && v === undefined) {\n return;\n }\n\n onChange(e);\n }; // Use native if mobile and no optgroups\n\n\n var useNative = props[\"native\"] || media.matches.mobile.only() && !options.find(function (o) {\n return o.options;\n });\n var useRenderValue = renderValue ? renderValue : // : useNative\n !multiple ? function (renderValue) {\n var _options$find;\n\n return (_options$find = options.find(function (o) {\n return o.value === renderValue;\n })) === null || _options$find === void 0 ? void 0 : _options$find.text;\n } : function () {\n var selected = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];\n return selected.map(function (item) {\n var _options$find2;\n\n return (_options$find2 = options.find(function (o) {\n return o.value === item;\n })) === null || _options$find2 === void 0 ? void 0 : _options$find2.text;\n }).join(', ');\n };\n var inputRef = ref ? {\n inputRef: ref\n } : {};\n return React.createElement(FormControl, _extends({\n variant: \"outlined\",\n disabled: Boolean(disabled),\n onBlur: onBlur,\n fullWidth: fullWidth,\n style: props.style\n }, rest), label ? React.createElement(InputLabel, {\n ref: inputLabel\n }, label) : null, React.createElement(MuiSelect, _extends({}, inputRef, {\n displayEmpty: displayEmpty,\n \"native\": useNative ? value : undefined,\n value: value,\n name: name,\n renderValue: useRenderValue,\n onChange: handleChange,\n multiple: multiple,\n inputProps: {\n 'data-test-selector': testSelector || name\n },\n MenuProps: {\n getContentAnchorEl: null,\n anchorOrigin: {\n vertical: 'bottom',\n horizontal: 'left'\n },\n transformOrigin: {\n horizontal: 0,\n vertical: -4\n }\n },\n input: label ? React.createElement(OutlinedInput, {\n labelWidth: labelWidth\n }) : null\n }, SelectProps || {}, {\n error: error\n }), options.map(function (option) {\n return useNative ? option.options ? React.createElement(\"optgroup\", {\n key: option.value,\n label: option.text,\n disabled: Boolean(option.disabled)\n }, option.options.map(function (subOption) {\n return React.createElement(\"option\", {\n key: \"\".concat(option.value, \".\").concat(subOption.value),\n value: \"\".concat(option.value, \".\").concat(subOption.value),\n disabled: Boolean(option.disabled || subOption.disabled),\n selected: value instanceof Array ? value.indexOf(\"\".concat(option.value, \".\").concat(subOption.value)) !== -1 : value === \"\".concat(option.value, \".\").concat(subOption.value)\n }, subOption.text);\n })) : React.createElement(\"option\", {\n key: option.value,\n value: option.value,\n disabled: Boolean(option.disabled)\n }, option.text) : !multiple ? React.createElement(MenuItem, {\n key: option.value,\n value: option.value,\n disabled: Boolean(option.disabled)\n }, React.createElement(ListItemText, {\n primary: option.text\n })) : option.options ? [React.createElement(ListSubheader, {\n disableSticky: true,\n key: option.text\n }, option.text), option.options.map(function (subOption) {\n return React.createElement(MenuItem, {\n key: \"\".concat(option.value, \".\").concat(subOption.value),\n value: \"\".concat(option.value, \".\").concat(subOption.value),\n disabled: Boolean(option.disabled || subOption.disabled)\n }, React.createElement(Checkbox, {\n color: \"secondary\",\n checked: value instanceof Array ? value.indexOf(\"\".concat(option.value, \".\").concat(subOption.value)) !== -1 : value === \"\".concat(option.value, \".\").concat(subOption.value)\n }), React.createElement(ListItemText, {\n primary: subOption.text\n }));\n })] : React.createElement(MenuItem, {\n key: option.value,\n value: option.value,\n disabled: Boolean(option.disabled)\n }, React.createElement(Checkbox, {\n checked: value instanceof Array ? value.indexOf(option.value) !== -1 : value === option.value\n }), React.createElement(ListItemText, {\n primary: option.text\n }));\n })));\n}, \"useRef{inputLabel}\\nuseState{[labelWidth, setLabelWidth](0)}\\nuseEffect{}\"));\nSelect.propTypes = {\n \"native\": PropTypes.bool,\n fullWidth: PropTypes.bool,\n helpText: PropTypes.string,\n error: PropTypes.bool\n};\nSelect.defaultProps = {\n options: [],\n multiple: false,\n displayEmpty: false,\n disabled: false,\n \"native\": undefined,\n fullWidth: false,\n helpText: null,\n error: false\n};\n\nvar _default = withTheme(Select);\n\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(Select, \"Select\", \"/home/vsts/work/1/s/src/components/inputs/Select.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/inputs/Select.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport Typography from '../Typography';\nimport withStyles from '../styles/withStyles';\nimport FormControlContext, { useFormControl } from '../FormControl/FormControlContext';\nexport var styles = {\n /* Styles applied to the root element. */\n root: {\n display: 'flex',\n height: '0.01em',\n // Fix IE 11 flexbox alignment. To remove at some point.\n maxHeight: '2em',\n alignItems: 'center',\n whiteSpace: 'nowrap'\n },\n\n /* Styles applied to the root element if `variant=\"filled\"`. */\n filled: {\n '&$positionStart:not($hiddenLabel)': {\n marginTop: 16\n }\n },\n\n /* Styles applied to the root element if `position=\"start\"`. */\n positionStart: {\n marginRight: 8\n },\n\n /* Styles applied to the root element if `position=\"end\"`. */\n positionEnd: {\n marginLeft: 8\n },\n\n /* Styles applied to the root element if `disablePointerEvents=true`. */\n disablePointerEvents: {\n pointerEvents: 'none'\n },\n\n /* Styles applied if the adornment is used inside . */\n hiddenLabel: {},\n\n /* Styles applied if the adornment is used inside . */\n marginDense: {}\n};\nvar InputAdornment = /*#__PURE__*/React.forwardRef(function InputAdornment(props, ref) {\n var children = props.children,\n classes = props.classes,\n className = props.className,\n _props$component = props.component,\n Component = _props$component === void 0 ? 'div' : _props$component,\n _props$disablePointer = props.disablePointerEvents,\n disablePointerEvents = _props$disablePointer === void 0 ? false : _props$disablePointer,\n _props$disableTypogra = props.disableTypography,\n disableTypography = _props$disableTypogra === void 0 ? false : _props$disableTypogra,\n position = props.position,\n variantProp = props.variant,\n other = _objectWithoutProperties(props, [\"children\", \"classes\", \"className\", \"component\", \"disablePointerEvents\", \"disableTypography\", \"position\", \"variant\"]);\n\n var muiFormControl = useFormControl() || {};\n var variant = variantProp;\n\n if (variantProp && muiFormControl.variant) {\n if (process.env.NODE_ENV !== 'production') {\n if (variantProp === muiFormControl.variant) {\n console.error('Material-UI: The `InputAdornment` variant infers the variant prop ' + 'you do not have to provide one.');\n }\n }\n }\n\n if (muiFormControl && !variant) {\n variant = muiFormControl.variant;\n }\n\n return /*#__PURE__*/React.createElement(FormControlContext.Provider, {\n value: null\n }, /*#__PURE__*/React.createElement(Component, _extends({\n className: clsx(classes.root, className, position === 'end' ? classes.positionEnd : classes.positionStart, disablePointerEvents && classes.disablePointerEvents, muiFormControl.hiddenLabel && classes.hiddenLabel, variant === 'filled' && classes.filled, muiFormControl.margin === 'dense' && classes.marginDense),\n ref: ref\n }, other), typeof children === 'string' && !disableTypography ? /*#__PURE__*/React.createElement(Typography, {\n color: \"textSecondary\"\n }, children) : children));\n});\nprocess.env.NODE_ENV !== \"production\" ? InputAdornment.propTypes = {\n /**\n * The content of the component, normally an `IconButton` or string.\n */\n children: PropTypes.node.isRequired,\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object.isRequired,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * The component used for the root node.\n * Either a string to use a HTML element or a component.\n */\n component: PropTypes\n /* @typescript-to-proptypes-ignore */\n .elementType,\n\n /**\n * Disable pointer events on the root.\n * This allows for the content of the adornment to focus the input on click.\n */\n disablePointerEvents: PropTypes.bool,\n\n /**\n * If children is a string then disable wrapping in a Typography component.\n */\n disableTypography: PropTypes.bool,\n\n /**\n * @ignore\n */\n muiFormControl: PropTypes.object,\n\n /**\n * The position this adornment should appear relative to the `Input`.\n */\n position: PropTypes.oneOf(['start', 'end']).isRequired,\n\n /**\n * The variant to use.\n * Note: If you are using the `TextField` component or the `FormControl` component\n * you do not have to set this manually.\n */\n variant: PropTypes.oneOf(['standard', 'outlined', 'filled'])\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiInputAdornment'\n})(InputAdornment);","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React, { forwardRef } from 'react';\nimport PropTypes from 'prop-types';\nimport { TextField as MuiTextField, InputAdornment } from '@material-ui/core';\nimport { Icon } from \"../icons\";\nimport { COLOR } from \"../../constants/style\"; // eslint-disable-next-line\n\nvar TextField = forwardRef(function (props, ref) {\n var label = props.label,\n autoFocus = props.autoFocus,\n icon = props.icon,\n name = props.name,\n value = props.value,\n fullWidth = props.fullWidth,\n onChange = props.onChange,\n inputProps = props.inputProps,\n InputProps = props.InputProps,\n testSelector = props.testSelector,\n rest = _objectWithoutProperties(props, [\"label\", \"autoFocus\", \"icon\", \"name\", \"value\", \"fullWidth\", \"onChange\", \"inputProps\", \"InputProps\", \"testSelector\"]);\n\n var inputRef = ref ? {\n inputRef: ref\n } : {};\n return React.createElement(MuiTextField, _extends({}, rest, inputRef, {\n value: value,\n onChange: onChange,\n name: name,\n variant: \"outlined\",\n label: label,\n fullWidth: fullWidth,\n autoFocus: autoFocus,\n inputProps: _objectSpread({}, inputProps, {\n 'data-test-selector': testSelector || name\n }),\n InputProps: _objectSpread({}, InputProps, {\n startAdornment: icon ? React.createElement(InputAdornment, {\n position: \"start\"\n }, React.createElement(Icon, {\n name: icon,\n color: COLOR.gray.darker\n })) : null\n })\n }));\n});\nTextField.defaultProps = {\n autoFocus: false\n};\nTextField.propTypes = {\n variant: PropTypes.oneOf(['notched'])\n};\nvar _default = TextField;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(TextField, \"TextField\", \"/home/vsts/work/1/s/src/components/inputs/TextField.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/inputs/TextField.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\n// @inheritedComponent IconButton\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { refType } from '@material-ui/utils';\nimport withStyles from '../styles/withStyles';\nimport { alpha } from '../styles/colorManipulator';\nimport capitalize from '../utils/capitalize';\nimport SwitchBase from '../internal/SwitchBase';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: {\n display: 'inline-flex',\n width: 34 + 12 * 2,\n height: 14 + 12 * 2,\n overflow: 'hidden',\n padding: 12,\n boxSizing: 'border-box',\n position: 'relative',\n flexShrink: 0,\n zIndex: 0,\n // Reset the stacking context.\n verticalAlign: 'middle',\n // For correct alignment with the text.\n '@media print': {\n colorAdjust: 'exact'\n }\n },\n\n /* Styles applied to the root element if `edge=\"start\"`. */\n edgeStart: {\n marginLeft: -8\n },\n\n /* Styles applied to the root element if `edge=\"end\"`. */\n edgeEnd: {\n marginRight: -8\n },\n\n /* Styles applied to the internal `SwitchBase` component's `root` class. */\n switchBase: {\n position: 'absolute',\n top: 0,\n left: 0,\n zIndex: 1,\n // Render above the focus ripple.\n color: theme.palette.type === 'light' ? theme.palette.grey[50] : theme.palette.grey[400],\n transition: theme.transitions.create(['left', 'transform'], {\n duration: theme.transitions.duration.shortest\n }),\n '&$checked': {\n transform: 'translateX(20px)'\n },\n '&$disabled': {\n color: theme.palette.type === 'light' ? theme.palette.grey[400] : theme.palette.grey[800]\n },\n '&$checked + $track': {\n opacity: 0.5\n },\n '&$disabled + $track': {\n opacity: theme.palette.type === 'light' ? 0.12 : 0.1\n }\n },\n\n /* Styles applied to the internal SwitchBase component's root element if `color=\"primary\"`. */\n colorPrimary: {\n '&$checked': {\n color: theme.palette.primary.main,\n '&:hover': {\n backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.hoverOpacity),\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n }\n },\n '&$disabled': {\n color: theme.palette.type === 'light' ? theme.palette.grey[400] : theme.palette.grey[800]\n },\n '&$checked + $track': {\n backgroundColor: theme.palette.primary.main\n },\n '&$disabled + $track': {\n backgroundColor: theme.palette.type === 'light' ? theme.palette.common.black : theme.palette.common.white\n }\n },\n\n /* Styles applied to the internal SwitchBase component's root element if `color=\"secondary\"`. */\n colorSecondary: {\n '&$checked': {\n color: theme.palette.secondary.main,\n '&:hover': {\n backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.hoverOpacity),\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n }\n },\n '&$disabled': {\n color: theme.palette.type === 'light' ? theme.palette.grey[400] : theme.palette.grey[800]\n },\n '&$checked + $track': {\n backgroundColor: theme.palette.secondary.main\n },\n '&$disabled + $track': {\n backgroundColor: theme.palette.type === 'light' ? theme.palette.common.black : theme.palette.common.white\n }\n },\n\n /* Styles applied to the root element if `size=\"small\"`. */\n sizeSmall: {\n width: 40,\n height: 24,\n padding: 7,\n '& $thumb': {\n width: 16,\n height: 16\n },\n '& $switchBase': {\n padding: 4,\n '&$checked': {\n transform: 'translateX(16px)'\n }\n }\n },\n\n /* Pseudo-class applied to the internal `SwitchBase` component's `checked` class. */\n checked: {},\n\n /* Pseudo-class applied to the internal SwitchBase component's disabled class. */\n disabled: {},\n\n /* Styles applied to the internal SwitchBase component's input element. */\n input: {\n left: '-100%',\n width: '300%'\n },\n\n /* Styles used to create the thumb passed to the internal `SwitchBase` component `icon` prop. */\n thumb: {\n boxShadow: theme.shadows[1],\n backgroundColor: 'currentColor',\n width: 20,\n height: 20,\n borderRadius: '50%'\n },\n\n /* Styles applied to the track element. */\n track: {\n height: '100%',\n width: '100%',\n borderRadius: 14 / 2,\n zIndex: -1,\n transition: theme.transitions.create(['opacity', 'background-color'], {\n duration: theme.transitions.duration.shortest\n }),\n backgroundColor: theme.palette.type === 'light' ? theme.palette.common.black : theme.palette.common.white,\n opacity: theme.palette.type === 'light' ? 0.38 : 0.3\n }\n };\n};\nvar Switch = /*#__PURE__*/React.forwardRef(function Switch(props, ref) {\n var classes = props.classes,\n className = props.className,\n _props$color = props.color,\n color = _props$color === void 0 ? 'secondary' : _props$color,\n _props$edge = props.edge,\n edge = _props$edge === void 0 ? false : _props$edge,\n _props$size = props.size,\n size = _props$size === void 0 ? 'medium' : _props$size,\n other = _objectWithoutProperties(props, [\"classes\", \"className\", \"color\", \"edge\", \"size\"]);\n\n var icon = /*#__PURE__*/React.createElement(\"span\", {\n className: classes.thumb\n });\n return /*#__PURE__*/React.createElement(\"span\", {\n className: clsx(classes.root, className, {\n 'start': classes.edgeStart,\n 'end': classes.edgeEnd\n }[edge], size === \"small\" && classes[\"size\".concat(capitalize(size))])\n }, /*#__PURE__*/React.createElement(SwitchBase, _extends({\n type: \"checkbox\",\n icon: icon,\n checkedIcon: icon,\n classes: {\n root: clsx(classes.switchBase, classes[\"color\".concat(capitalize(color))]),\n input: classes.input,\n checked: classes.checked,\n disabled: classes.disabled\n },\n ref: ref\n }, other)), /*#__PURE__*/React.createElement(\"span\", {\n className: classes.track\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? Switch.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the d.ts file and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n\n /**\n * If `true`, the component is checked.\n */\n checked: PropTypes.bool,\n\n /**\n * The icon to display when the component is checked.\n */\n checkedIcon: PropTypes.node,\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * The color of the component. It supports those theme colors that make sense for this component.\n */\n color: PropTypes.oneOf(['default', 'primary', 'secondary']),\n\n /**\n * @ignore\n */\n defaultChecked: PropTypes.bool,\n\n /**\n * If `true`, the switch will be disabled.\n */\n disabled: PropTypes.bool,\n\n /**\n * If `true`, the ripple effect will be disabled.\n */\n disableRipple: PropTypes.bool,\n\n /**\n * If given, uses a negative margin to counteract the padding on one\n * side (this is often helpful for aligning the left or right\n * side of the icon with content above or below, without ruining the border\n * size and shape).\n */\n edge: PropTypes.oneOf(['end', 'start', false]),\n\n /**\n * The icon to display when the component is unchecked.\n */\n icon: PropTypes.node,\n\n /**\n * The id of the `input` element.\n */\n id: PropTypes.string,\n\n /**\n * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.\n */\n inputProps: PropTypes.object,\n\n /**\n * Pass a ref to the `input` element.\n */\n inputRef: refType,\n\n /**\n * Callback fired when the state is changed.\n *\n * @param {object} event The event source of the callback.\n * You can pull out the new value by accessing `event.target.value` (string).\n * You can pull out the new checked state by accessing `event.target.checked` (boolean).\n */\n onChange: PropTypes.func,\n\n /**\n * If `true`, the `input` element will be required.\n */\n required: PropTypes.bool,\n\n /**\n * The size of the switch.\n * `small` is equivalent to the dense switch styling.\n */\n size: PropTypes.oneOf(['medium', 'small']),\n\n /**\n * The value of the component. The DOM API casts this to a string.\n * The browser uses \"on\" as the default value.\n */\n value: PropTypes.any\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiSwitch'\n})(Switch);","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport styled from 'styled-components';\nimport PropTypes from 'prop-types';\nimport { Switch } from '@material-ui/core';\nimport { Div, Flex } from \"../layout\";\nimport { Label } from \"../forms\";\nimport { HelpText } from \"../text\";\nimport { SPACE } from \"../../constants/style\";\nvar ToggleContainer = styled(Flex).withConfig({\n displayName: \"Toggle__ToggleContainer\",\n componentId: \"sc-at4kt6-0\"\n})([\"max-width:100%;\", \";\"], function (props) {\n return props.fullWidth && 'width: 100%';\n});\nvar StyledLabel = styled(Label).withConfig({\n displayName: \"Toggle__StyledLabel\",\n componentId: \"sc-at4kt6-1\"\n})([\"font-weight:bold !important;\"]);\nvar StyledFlex = styled(Flex).withConfig({\n displayName: \"Toggle__StyledFlex\",\n componentId: \"sc-at4kt6-2\"\n})([\":nth-child(1){min-height:24px;align-items:center;}\"]);\n\nvar Toggle = function Toggle(props) {\n var label = props.label,\n helpText = props.helpText,\n onChange = props.onChange,\n checked = props.checked,\n disabled = props.disabled,\n testSelector = props.testSelector,\n rest = _objectWithoutProperties(props, [\"label\", \"helpText\", \"onChange\", \"checked\", \"disabled\", \"testSelector\"]);\n\n return React.createElement(ToggleContainer, _extends({\n direction: \"column\"\n }, rest), React.createElement(Flex, {\n alignItems: \"flex-start\"\n }, React.createElement(Switch, {\n inputProps: {\n 'data-test-selector': testSelector || label\n },\n color: \"default\",\n onChange: onChange,\n checked: checked,\n disabled: disabled\n }), React.createElement(Flex, {\n flexDirection: \"column\",\n marginLeft: \"21px\"\n }, label ? React.createElement(StyledFlex, {\n flex: \"0 0 auto\"\n }, React.createElement(StyledLabel, null, label)) : null, helpText ? React.createElement(StyledFlex, {\n flex: \"0 0 auto\"\n }, React.createElement(HelpText, {\n style: {\n margin: 0\n }\n }, helpText)) : null)));\n};\n\nToggle.propTypes = {\n label: PropTypes.string,\n helpText: PropTypes.string,\n onChange: PropTypes.func,\n checked: PropTypes.bool,\n disabled: PropTypes.bool,\n fullWidth: PropTypes.bool\n};\nToggle.defaultProps = {\n onChange: function onChange() {\n console.warn('No onChange provided to Toggle component');\n },\n disabled: false,\n fullWidth: false\n};\nvar _default = Toggle;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(ToggleContainer, \"ToggleContainer\", \"/home/vsts/work/1/s/src/components/inputs/Toggle.js\");\n reactHotLoader.register(StyledLabel, \"StyledLabel\", \"/home/vsts/work/1/s/src/components/inputs/Toggle.js\");\n reactHotLoader.register(StyledFlex, \"StyledFlex\", \"/home/vsts/work/1/s/src/components/inputs/Toggle.js\");\n reactHotLoader.register(Toggle, \"Toggle\", \"/home/vsts/work/1/s/src/components/inputs/Toggle.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/inputs/Toggle.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nexport { default as Autocomplete } from \"./Autocomplete.js\";\nexport { default as TextField } from \"./TextField.js\";\nexport { default as Select } from \"./Select.js\";\nexport { default as Toggle } from \"./Toggle.js\";\nexport { default as DateField } from \"./DateField.js\";\nexport { default as RadioGroup } from \"./RadioGroup.js\";\nexport { default as Checkbox } from \"./Checkbox.js\";\nexport { default as CheckboxGroup } from \"./CheckboxGroup.js\";","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\nimport { SPACE } from \"../../constants/style\";\nimport Flex from \"./Flex.js\";\nvar StyledFlex = styled(Flex).withConfig({\n displayName: \"Column__StyledFlex\",\n componentId: \"sc-1q0mpfe-0\"\n})([\"overflow:\", \";padding:0 \", \";&:first-child{padding-left:0;}&:last-child{padding-right:0;}\", \"\"], function (props) {\n return props.overflow;\n}, function (props) {\n return SPACE[props.spacing];\n}, function (props) {\n return props.left && 'margin-right: auto;';\n});\n\nvar Column = function Column(props) {\n var children = props.children,\n rest = _objectWithoutProperties(props, [\"children\"]);\n\n return React.createElement(StyledFlex, rest, children);\n};\n\nColumn.defaultProps = {\n direction: 'column',\n flex: '1',\n spacing: 'sm' // overflow: 'hidden',\n\n};\nColumn.propTypes = {\n direction: PropTypes.oneOf(['column', 'row']),\n flex: PropTypes.string,\n spacing: PropTypes.oneOf(Object.keys(SPACE))\n};\nvar _default = Column;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledFlex, \"StyledFlex\", \"/home/vsts/work/1/s/src/components/layout/Column.js\");\n reactHotLoader.register(Column, \"Column\", \"/home/vsts/work/1/s/src/components/layout/Column.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/layout/Column.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\nimport { HtmlElement } from \"../base\";\nvar Div = styled(HtmlElement).withConfig({\n displayName: \"Div\",\n componentId: \"sc-17442o6-0\"\n})([\"\", \" \", \" \", \" \", \" \", \" \", \" \", \" \", \"\"], function (props) {\n return typeof props.margin === 'undefined' ? '' : \"margin: \".concat(props.margin, \";\");\n}, function (props) {\n return typeof props.padding === 'undefined' ? '' : props.padding && \"padding: \".concat(props.padding, \";\");\n}, function (props) {\n return typeof props.flex === 'undefined' ? '' : \"flex: \".concat(props.flex, \";\");\n}, function (props) {\n return typeof props.flexGrow === 'undefined' ? '' : \"flex-grow: \".concat(props.flexGrow, \";\");\n}, function (props) {\n return typeof props.flexShrink === 'undefined' ? '' : \"flex-shrink: \".concat(props.flexShrink, \";\");\n}, function (props) {\n return typeof props.textAlign === 'undefined' ? '' : \"text-align: \".concat(props.textAlign, \";\");\n}, function (props) {\n return typeof props.width === 'undefined' ? '' : \"width: \".concat(props.width, \";\");\n}, function (props) {\n return typeof props.maxWidth === 'undefined' ? '' : \"max-width: \".concat(props.maxWidth, \";\");\n});\nDiv.propTypes = {\n margin: PropTypes.string,\n padding: PropTypes.string,\n flex: PropTypes.string,\n flexGrow: PropTypes.string,\n flexShrink: PropTypes.string,\n textAlign: PropTypes.string,\n width: PropTypes.string,\n maxWidth: PropTypes.string\n};\nvar _default = Div;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(Div, \"Div\", \"/home/vsts/work/1/s/src/components/layout/Div.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/layout/Div.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\nimport Div from \"./Div.js\";\nvar Flex = styled(Div).withConfig({\n displayName: \"Flex\",\n componentId: \"sc-iga4yc-0\"\n})([\"display:flex;\", \" \", \" \", \" \", \" \", \" \", \"\"], function (props) {\n return props.stretch && \"\\n justify-content: stretch;\\n align-items: stretch;\\n \";\n}, function (props) {\n return props.justifyContent && \"justify-content: \".concat(props.justifyContent, \";\");\n}, function (props) {\n return props.alignItems && \"align-items: \".concat(props.alignItems, \";\");\n}, function (props) {\n return props.alignSelf && \"align-self: \".concat(props.alignSelf, \";\");\n}, function (props) {\n return props.flexDirection && \"flex-direction: \".concat(props.flexDirection, \";\");\n}, function (props) {\n return props.direction && \"flex-direction: \".concat(props.direction, \";\");\n});\nFlex.propTypes = {\n stretch: PropTypes.bool,\n justifyContent: PropTypes.string,\n alignItems: PropTypes.string,\n alignSelf: PropTypes.string,\n flexDirection: PropTypes.string,\n direction: PropTypes.string\n};\nvar _default = Flex;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(Flex, \"Flex\", \"/home/vsts/work/1/s/src/components/layout/Flex.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/layout/Flex.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport styled from 'styled-components'; // TODO: Move to containers\n\nvar StyledFooter = styled('footer').withConfig({\n displayName: \"Footer__StyledFooter\",\n componentId: \"sc-178vvru-0\"\n})([\"background:#293440;color:#fff;padding:50px;text-align:center;\"]);\n\nvar _default = function _default(props) {\n var children = props.children,\n className = props.className;\n return React.createElement(StyledFooter, {\n className: className\n }, children);\n};\n\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledFooter, \"StyledFooter\", \"/home/vsts/work/1/s/src/components/layout/Footer.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/layout/Footer.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","import _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\n// A grid component using the following libs as inspiration.\n//\n// For the implementation:\n// - https://getbootstrap.com/docs/4.3/layout/grid/\n// - https://github.com/kristoferjoseph/flexboxgrid/blob/master/src/css/flexboxgrid.css\n// - https://github.com/roylee0704/react-flexbox-grid\n// - https://material.angularjs.org/latest/layout/introduction\n//\n// Follow this flexbox Guide to better understand the underlying model:\n// - https://css-tricks.com/snippets/css/a-guide-to-flexbox/\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport requirePropFactory from '../utils/requirePropFactory';\nimport deprecatedPropType from '../utils/deprecatedPropType';\nvar SPACINGS = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10];\nvar GRID_SIZES = ['auto', true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];\n\nfunction generateGrid(globalStyles, theme, breakpoint) {\n var styles = {};\n GRID_SIZES.forEach(function (size) {\n var key = \"grid-\".concat(breakpoint, \"-\").concat(size);\n\n if (size === true) {\n // For the auto layouting\n styles[key] = {\n flexBasis: 0,\n flexGrow: 1,\n maxWidth: '100%'\n };\n return;\n }\n\n if (size === 'auto') {\n styles[key] = {\n flexBasis: 'auto',\n flexGrow: 0,\n maxWidth: 'none'\n };\n return;\n } // Keep 7 significant numbers.\n\n\n var width = \"\".concat(Math.round(size / 12 * 10e7) / 10e5, \"%\"); // Close to the bootstrap implementation:\n // https://github.com/twbs/bootstrap/blob/8fccaa2439e97ec72a4b7dc42ccc1f649790adb0/scss/mixins/_grid.scss#L41\n\n styles[key] = {\n flexBasis: width,\n flexGrow: 0,\n maxWidth: width\n };\n }); // No need for a media query for the first size.\n\n if (breakpoint === 'xs') {\n _extends(globalStyles, styles);\n } else {\n globalStyles[theme.breakpoints.up(breakpoint)] = styles;\n }\n}\n\nfunction getOffset(val) {\n var div = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;\n var parse = parseFloat(val);\n return \"\".concat(parse / div).concat(String(val).replace(String(parse), '') || 'px');\n}\n\nfunction generateGutter(theme, breakpoint) {\n var styles = {};\n SPACINGS.forEach(function (spacing) {\n var themeSpacing = theme.spacing(spacing);\n\n if (themeSpacing === 0) {\n return;\n }\n\n styles[\"spacing-\".concat(breakpoint, \"-\").concat(spacing)] = {\n margin: \"-\".concat(getOffset(themeSpacing, 2)),\n width: \"calc(100% + \".concat(getOffset(themeSpacing), \")\"),\n '& > $item': {\n padding: getOffset(themeSpacing, 2)\n }\n };\n });\n return styles;\n} // Default CSS values\n// flex: '0 1 auto',\n// flexDirection: 'row',\n// alignItems: 'flex-start',\n// flexWrap: 'nowrap',\n// justifyContent: 'flex-start',\n\n\nexport var styles = function styles(theme) {\n return _extends({\n /* Styles applied to the root element. */\n root: {},\n\n /* Styles applied to the root element if `container={true}`. */\n container: {\n boxSizing: 'border-box',\n display: 'flex',\n flexWrap: 'wrap',\n width: '100%'\n },\n\n /* Styles applied to the root element if `item={true}`. */\n item: {\n boxSizing: 'border-box',\n margin: '0' // For instance, it's useful when used with a `figure` element.\n\n },\n\n /* Styles applied to the root element if `zeroMinWidth={true}`. */\n zeroMinWidth: {\n minWidth: 0\n },\n\n /* Styles applied to the root element if `direction=\"column\"`. */\n 'direction-xs-column': {\n flexDirection: 'column'\n },\n\n /* Styles applied to the root element if `direction=\"column-reverse\"`. */\n 'direction-xs-column-reverse': {\n flexDirection: 'column-reverse'\n },\n\n /* Styles applied to the root element if `direction=\"row-reverse\"`. */\n 'direction-xs-row-reverse': {\n flexDirection: 'row-reverse'\n },\n\n /* Styles applied to the root element if `wrap=\"nowrap\"`. */\n 'wrap-xs-nowrap': {\n flexWrap: 'nowrap'\n },\n\n /* Styles applied to the root element if `wrap=\"reverse\"`. */\n 'wrap-xs-wrap-reverse': {\n flexWrap: 'wrap-reverse'\n },\n\n /* Styles applied to the root element if `alignItems=\"center\"`. */\n 'align-items-xs-center': {\n alignItems: 'center'\n },\n\n /* Styles applied to the root element if `alignItems=\"flex-start\"`. */\n 'align-items-xs-flex-start': {\n alignItems: 'flex-start'\n },\n\n /* Styles applied to the root element if `alignItems=\"flex-end\"`. */\n 'align-items-xs-flex-end': {\n alignItems: 'flex-end'\n },\n\n /* Styles applied to the root element if `alignItems=\"baseline\"`. */\n 'align-items-xs-baseline': {\n alignItems: 'baseline'\n },\n\n /* Styles applied to the root element if `alignContent=\"center\"`. */\n 'align-content-xs-center': {\n alignContent: 'center'\n },\n\n /* Styles applied to the root element if `alignContent=\"flex-start\"`. */\n 'align-content-xs-flex-start': {\n alignContent: 'flex-start'\n },\n\n /* Styles applied to the root element if `alignContent=\"flex-end\"`. */\n 'align-content-xs-flex-end': {\n alignContent: 'flex-end'\n },\n\n /* Styles applied to the root element if `alignContent=\"space-between\"`. */\n 'align-content-xs-space-between': {\n alignContent: 'space-between'\n },\n\n /* Styles applied to the root element if `alignContent=\"space-around\"`. */\n 'align-content-xs-space-around': {\n alignContent: 'space-around'\n },\n\n /* Styles applied to the root element if `justifyContent=\"center\"`. */\n 'justify-content-xs-center': {\n justifyContent: 'center'\n },\n\n /* Styles applied to the root element if `justifyContent=\"flex-end\"`. */\n 'justify-content-xs-flex-end': {\n justifyContent: 'flex-end'\n },\n\n /* Styles applied to the root element if `justifyContent=\"space-between\"`. */\n 'justify-content-xs-space-between': {\n justifyContent: 'space-between'\n },\n\n /* Styles applied to the root element if `justifyContent=\"space-around\"`. */\n 'justify-content-xs-space-around': {\n justifyContent: 'space-around'\n },\n\n /* Styles applied to the root element if `justifyContent=\"space-evenly\"`. */\n 'justify-content-xs-space-evenly': {\n justifyContent: 'space-evenly'\n }\n }, generateGutter(theme, 'xs'), theme.breakpoints.keys.reduce(function (accumulator, key) {\n // Use side effect over immutability for better performance.\n generateGrid(accumulator, theme, key);\n return accumulator;\n }, {}));\n};\nvar Grid = /*#__PURE__*/React.forwardRef(function Grid(props, ref) {\n var _props$alignContent = props.alignContent,\n alignContent = _props$alignContent === void 0 ? 'stretch' : _props$alignContent,\n _props$alignItems = props.alignItems,\n alignItems = _props$alignItems === void 0 ? 'stretch' : _props$alignItems,\n classes = props.classes,\n classNameProp = props.className,\n _props$component = props.component,\n Component = _props$component === void 0 ? 'div' : _props$component,\n _props$container = props.container,\n container = _props$container === void 0 ? false : _props$container,\n _props$direction = props.direction,\n direction = _props$direction === void 0 ? 'row' : _props$direction,\n _props$item = props.item,\n item = _props$item === void 0 ? false : _props$item,\n justify = props.justify,\n _props$justifyContent = props.justifyContent,\n justifyContent = _props$justifyContent === void 0 ? 'flex-start' : _props$justifyContent,\n _props$lg = props.lg,\n lg = _props$lg === void 0 ? false : _props$lg,\n _props$md = props.md,\n md = _props$md === void 0 ? false : _props$md,\n _props$sm = props.sm,\n sm = _props$sm === void 0 ? false : _props$sm,\n _props$spacing = props.spacing,\n spacing = _props$spacing === void 0 ? 0 : _props$spacing,\n _props$wrap = props.wrap,\n wrap = _props$wrap === void 0 ? 'wrap' : _props$wrap,\n _props$xl = props.xl,\n xl = _props$xl === void 0 ? false : _props$xl,\n _props$xs = props.xs,\n xs = _props$xs === void 0 ? false : _props$xs,\n _props$zeroMinWidth = props.zeroMinWidth,\n zeroMinWidth = _props$zeroMinWidth === void 0 ? false : _props$zeroMinWidth,\n other = _objectWithoutProperties(props, [\"alignContent\", \"alignItems\", \"classes\", \"className\", \"component\", \"container\", \"direction\", \"item\", \"justify\", \"justifyContent\", \"lg\", \"md\", \"sm\", \"spacing\", \"wrap\", \"xl\", \"xs\", \"zeroMinWidth\"]);\n\n var className = clsx(classes.root, classNameProp, container && [classes.container, spacing !== 0 && classes[\"spacing-xs-\".concat(String(spacing))]], item && classes.item, zeroMinWidth && classes.zeroMinWidth, direction !== 'row' && classes[\"direction-xs-\".concat(String(direction))], wrap !== 'wrap' && classes[\"wrap-xs-\".concat(String(wrap))], alignItems !== 'stretch' && classes[\"align-items-xs-\".concat(String(alignItems))], alignContent !== 'stretch' && classes[\"align-content-xs-\".concat(String(alignContent))], (justify || justifyContent) !== 'flex-start' && classes[\"justify-content-xs-\".concat(String(justify || justifyContent))], xs !== false && classes[\"grid-xs-\".concat(String(xs))], sm !== false && classes[\"grid-sm-\".concat(String(sm))], md !== false && classes[\"grid-md-\".concat(String(md))], lg !== false && classes[\"grid-lg-\".concat(String(lg))], xl !== false && classes[\"grid-xl-\".concat(String(xl))]);\n return /*#__PURE__*/React.createElement(Component, _extends({\n className: className,\n ref: ref\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? Grid.propTypes = {\n /**\n * Defines the `align-content` style property.\n * It's applied for all screen sizes.\n */\n alignContent: PropTypes.oneOf(['stretch', 'center', 'flex-start', 'flex-end', 'space-between', 'space-around']),\n\n /**\n * Defines the `align-items` style property.\n * It's applied for all screen sizes.\n */\n alignItems: PropTypes.oneOf(['flex-start', 'center', 'flex-end', 'stretch', 'baseline']),\n\n /**\n * The content of the component.\n */\n children: PropTypes.node,\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object.isRequired,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * The component used for the root node.\n * Either a string to use a HTML element or a component.\n */\n component: PropTypes\n /* @typescript-to-proptypes-ignore */\n .elementType,\n\n /**\n * If `true`, the component will have the flex *container* behavior.\n * You should be wrapping *items* with a *container*.\n */\n container: PropTypes.bool,\n\n /**\n * Defines the `flex-direction` style property.\n * It is applied for all screen sizes.\n */\n direction: PropTypes.oneOf(['row', 'row-reverse', 'column', 'column-reverse']),\n\n /**\n * If `true`, the component will have the flex *item* behavior.\n * You should be wrapping *items* with a *container*.\n */\n item: PropTypes.bool,\n\n /**\n * Defines the `justify-content` style property.\n * It is applied for all screen sizes.\n * @deprecated Use `justifyContent` instead, the prop was renamed\n */\n justify: deprecatedPropType(PropTypes.oneOf(['flex-start', 'center', 'flex-end', 'space-between', 'space-around', 'space-evenly']), 'Use `justifyContent` instead, the prop was renamed.'),\n\n /**\n * Defines the `justify-content` style property.\n * It is applied for all screen sizes.\n */\n justifyContent: PropTypes.oneOf(['flex-start', 'center', 'flex-end', 'space-between', 'space-around', 'space-evenly']),\n\n /**\n * Defines the number of grids the component is going to use.\n * It's applied for the `lg` breakpoint and wider screens if not overridden.\n */\n lg: PropTypes.oneOf([false, 'auto', true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]),\n\n /**\n * Defines the number of grids the component is going to use.\n * It's applied for the `md` breakpoint and wider screens if not overridden.\n */\n md: PropTypes.oneOf([false, 'auto', true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]),\n\n /**\n * Defines the number of grids the component is going to use.\n * It's applied for the `sm` breakpoint and wider screens if not overridden.\n */\n sm: PropTypes.oneOf([false, 'auto', true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]),\n\n /**\n * Defines the space between the type `item` component.\n * It can only be used on a type `container` component.\n */\n spacing: PropTypes.oneOf(SPACINGS),\n\n /**\n * Defines the `flex-wrap` style property.\n * It's applied for all screen sizes.\n */\n wrap: PropTypes.oneOf(['nowrap', 'wrap', 'wrap-reverse']),\n\n /**\n * Defines the number of grids the component is going to use.\n * It's applied for the `xl` breakpoint and wider screens.\n */\n xl: PropTypes.oneOf([false, 'auto', true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]),\n\n /**\n * Defines the number of grids the component is going to use.\n * It's applied for all the screen sizes with the lowest priority.\n */\n xs: PropTypes.oneOf([false, 'auto', true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]),\n\n /**\n * If `true`, it sets `min-width: 0` on the item.\n * Refer to the limitations section of the documentation to better understand the use case.\n */\n zeroMinWidth: PropTypes.bool\n} : void 0;\nvar StyledGrid = withStyles(styles, {\n name: 'MuiGrid'\n})(Grid);\n\nif (process.env.NODE_ENV !== 'production') {\n var requireProp = requirePropFactory('Grid');\n StyledGrid.propTypes = _extends({}, StyledGrid.propTypes, {\n alignContent: requireProp('container'),\n alignItems: requireProp('container'),\n direction: requireProp('container'),\n justifyContent: requireProp('container'),\n lg: requireProp('item'),\n md: requireProp('item'),\n sm: requireProp('item'),\n spacing: requireProp('container'),\n wrap: requireProp('container'),\n xs: requireProp('item'),\n zeroMinWidth: requireProp('item')\n });\n}\n\nexport default StyledGrid;","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport { Grid as MuiGrid } from '@material-ui/core';\nimport { makeStyles } from '@material-ui/core/styles';\nvar useStyles = makeStyles(function (theme) {\n return {\n root: {\n display: 'flex'\n }\n };\n});\n\nvar Grid = function Grid(props) {\n var children = props.children;\n var classes = useStyles(); // const {xs, sm, md, lg, xl} = props;\n\n return React.createElement(MuiGrid, _extends({}, props, {\n className: classes.root\n }), children);\n};\n\n__signature__(Grid, \"useStyles{classes}\", function () {\n return [useStyles];\n});\n\nvar _default = Grid;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(useStyles, \"useStyles\", \"/home/vsts/work/1/s/src/components/layout/Grid.js\");\n reactHotLoader.register(Grid, \"Grid\", \"/home/vsts/work/1/s/src/components/layout/Grid.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/layout/Grid.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport styled from 'styled-components';\nimport { SPACE } from \"../../constants/style.js\"; // TODO: Move to containers\n// +/-50px padding and margin to make consistent shadow to screen edge\n\nvar Header = styled('header').withConfig({\n displayName: \"Header\",\n componentId: \"sc-1532rlb-0\"\n})([\"box-shadow:0 0 50px rgba(0,0,0,0.1);margin:0 -50px;padding:\", \" calc(\", \" + 50px);z-index:100;\"], SPACE.md, SPACE.xl);\nvar _default = Header;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(Header, \"Header\", \"/home/vsts/work/1/s/src/components/layout/Header.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/layout/Header.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\nimport Flex from \"./Flex.js\";\nvar Row = styled(Flex).withConfig({\n displayName: \"Row\",\n componentId: \"sc-1ep010t-0\"\n})([\"width:100%;flex-direction:row;align-items:\", \";justify-content:\", \";&:last-child{margin:0;}\"], function (props) {\n switch (props.vertical) {\n case 'top':\n return 'flex-start';\n\n case 'bottom':\n return 'flex-end';\n\n case 'stretch':\n case 'center':\n return props.vertical;\n\n default:\n return 'stretch';\n }\n}, function (props) {\n switch (props.horizontal) {\n case 'start':\n return 'flex-start';\n\n case 'end':\n return 'flex-end';\n\n case 'center':\n case 'space-between':\n return props.horizontal;\n\n default:\n return 'flex-start';\n }\n});\nRow.propTypes = {\n horizontal: PropTypes.string,\n vertical: PropTypes.string\n};\nvar _default = Row;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(Row, \"Row\", \"/home/vsts/work/1/s/src/components/layout/Row.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/layout/Row.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nexport { default as Column } from \"./Column.js\";\nexport { default as Div } from \"./Div.js\";\nexport { default as Flex } from \"./Flex.js\";\nexport { default as Footer } from \"./Footer.js\";\nexport { default as Grid } from \"./Grid.js\";\nexport { default as Header } from \"./Header.js\";\nexport { default as Row } from \"./Row.js\";","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport styled from 'styled-components';\nimport { SPACE } from \"../../constants/style\";\nvar StyledList = styled('ul').withConfig({\n displayName: \"List__StyledList\",\n componentId: \"sc-4oc7iw-0\"\n})([\"list-style:none;padding-left:0;margin:\", \" 0;\"], SPACE.xs);\n\nvar List = function List(props) {\n var children = props.children,\n tagName = props.tagName,\n rest = _objectWithoutProperties(props, [\"children\", \"tagName\"]);\n\n return React.createElement(StyledList, _extends({}, rest, {\n tagName: tagName\n }), children);\n};\n\nList.defaultProps = {\n tagName: 'ul'\n};\nvar _default = List;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledList, \"StyledList\", \"/home/vsts/work/1/s/src/components/lists/List.js\");\n reactHotLoader.register(List, \"List\", \"/home/vsts/work/1/s/src/components/lists/List.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/lists/List.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport styled from 'styled-components';\nimport { Icon } from \"../icons\";\nvar StyledListItem = styled('li').withConfig({\n displayName: \"ListItem__StyledListItem\",\n componentId: \"sc-1cms8t0-0\"\n})([\"list-style:none;margin-left:0;padding-left:0;\"]);\nvar ListItem = styled(function (props) {\n var children = props.children,\n icon = props.icon,\n rest = _objectWithoutProperties(props, [\"children\", \"icon\"]);\n\n return React.createElement(\"li\", rest, children);\n}).withConfig({\n displayName: \"ListItem\",\n componentId: \"sc-1cms8t0-1\"\n})([\"list-style:none;margin-left:0;padding-left:0;\"]);\nvar _default = ListItem;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledListItem, \"StyledListItem\", \"/home/vsts/work/1/s/src/components/lists/ListItem.js\");\n reactHotLoader.register(ListItem, \"ListItem\", \"/home/vsts/work/1/s/src/components/lists/ListItem.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/lists/ListItem.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\n\nvar _default = function _default() {\n return React.createElement(\"div\", null, \"Making progress\");\n};\n\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/loaders/Progress.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport clsx from 'clsx';\nimport PropTypes from 'prop-types';\nimport { alpha, withStyles } from '@material-ui/core/styles';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: {\n display: 'block',\n // Create a \"on paper\" color with sufficient contrast retaining the color\n backgroundColor: alpha(theme.palette.text.primary, theme.palette.type === 'light' ? 0.11 : 0.13),\n height: '1.2em'\n },\n\n /* Styles applied to the root element if `variant=\"text\"`. */\n text: {\n marginTop: 0,\n marginBottom: 0,\n height: 'auto',\n transformOrigin: '0 60%',\n transform: 'scale(1, 0.60)',\n borderRadius: theme.shape.borderRadius,\n '&:empty:before': {\n content: '\"\\\\00a0\"'\n }\n },\n\n /* Styles applied to the root element if `variant=\"rect\"`. */\n rect: {},\n\n /* Styles applied to the root element if `variant=\"circle\"`. */\n circle: {\n borderRadius: '50%'\n },\n\n /* Styles applied to the root element if `animation=\"pulse\"`. */\n pulse: {\n animation: '$pulse 1.5s ease-in-out 0.5s infinite'\n },\n '@keyframes pulse': {\n '0%': {\n opacity: 1\n },\n '50%': {\n opacity: 0.4\n },\n '100%': {\n opacity: 1\n }\n },\n\n /* Styles applied to the root element if `animation=\"wave\"`. */\n wave: {\n position: 'relative',\n overflow: 'hidden',\n '&::after': {\n animation: '$wave 1.6s linear 0.5s infinite',\n background: \"linear-gradient(90deg, transparent, \".concat(theme.palette.action.hover, \", transparent)\"),\n content: '\"\"',\n position: 'absolute',\n transform: 'translateX(-100%)',\n // Avoid flash during server-side hydration\n bottom: 0,\n left: 0,\n right: 0,\n top: 0\n }\n },\n '@keyframes wave': {\n '0%': {\n transform: 'translateX(-100%)'\n },\n '60%': {\n // +0.5s of delay between each loop\n transform: 'translateX(100%)'\n },\n '100%': {\n transform: 'translateX(100%)'\n }\n },\n\n /* Styles applied when the component is passed children. */\n withChildren: {\n '& > *': {\n visibility: 'hidden'\n }\n },\n\n /* Styles applied when the component is passed children and no width. */\n fitContent: {\n maxWidth: 'fit-content'\n },\n\n /* Styles applied when the component is passed children and no height. */\n heightAuto: {\n height: 'auto'\n }\n };\n};\nvar Skeleton = /*#__PURE__*/React.forwardRef(function Skeleton(props, ref) {\n var _props$animation = props.animation,\n animation = _props$animation === void 0 ? 'pulse' : _props$animation,\n classes = props.classes,\n className = props.className,\n _props$component = props.component,\n Component = _props$component === void 0 ? 'span' : _props$component,\n height = props.height,\n _props$variant = props.variant,\n variant = _props$variant === void 0 ? 'text' : _props$variant,\n width = props.width,\n other = _objectWithoutProperties(props, [\"animation\", \"classes\", \"className\", \"component\", \"height\", \"variant\", \"width\"]);\n\n var hasChildren = Boolean(other.children);\n return /*#__PURE__*/React.createElement(Component, _extends({\n ref: ref,\n className: clsx(classes.root, classes[variant], className, hasChildren && [classes.withChildren, !width && classes.fitContent, !height && classes.heightAuto], animation !== false && classes[animation])\n }, other, {\n style: _extends({\n width: width,\n height: height\n }, other.style)\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? Skeleton.propTypes = {\n /**\r\n * The animation.\r\n * If `false` the animation effect is disabled.\r\n */\n animation: PropTypes.oneOf(['pulse', 'wave', false]),\n\n /**\r\n * Optional children to infer width and height from.\r\n */\n children: PropTypes.node,\n\n /**\r\n * Override or extend the styles applied to the component.\r\n * See [CSS API](#css) below for more details.\r\n */\n classes: PropTypes.object.isRequired,\n\n /**\r\n * @ignore\r\n */\n className: PropTypes.string,\n\n /**\r\n * The component used for the root node.\r\n * Either a string to use a HTML element or a component.\r\n */\n component: PropTypes\n /* @typescript-to-proptypes-ignore */\n .elementType,\n\n /**\r\n * Height of the skeleton.\r\n * Useful when you don't want to adapt the skeleton to a text element but for instance a card.\r\n */\n height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n\n /**\r\n * The type of content that will be rendered.\r\n */\n variant: PropTypes.oneOf(['text', 'rect', 'circle']),\n\n /**\r\n * Width of the skeleton.\r\n * Useful when the skeleton is inside an inline element with no width of its own.\r\n */\n width: PropTypes.oneOfType([PropTypes.number, PropTypes.string])\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiSkeleton'\n})(Skeleton);","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport { Skeleton } from '@material-ui/lab';\nvar _default = Skeleton;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/loaders/Skeleton.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { chainPropTypes } from '@material-ui/utils';\nimport withStyles from '../styles/withStyles';\nimport capitalize from '../utils/capitalize';\nvar SIZE = 44;\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: {\n display: 'inline-block'\n },\n\n /* Styles applied to the root element if `variant=\"static\"`. */\n static: {\n transition: theme.transitions.create('transform')\n },\n\n /* Styles applied to the root element if `variant=\"indeterminate\"`. */\n indeterminate: {\n animation: '$circular-rotate 1.4s linear infinite'\n },\n\n /* Styles applied to the root element if `variant=\"determinate\"`. */\n determinate: {\n transition: theme.transitions.create('transform')\n },\n\n /* Styles applied to the root element if `color=\"primary\"`. */\n colorPrimary: {\n color: theme.palette.primary.main\n },\n\n /* Styles applied to the root element if `color=\"secondary\"`. */\n colorSecondary: {\n color: theme.palette.secondary.main\n },\n\n /* Styles applied to the `svg` element. */\n svg: {\n display: 'block' // Keeps the progress centered\n\n },\n\n /* Styles applied to the `circle` svg path. */\n circle: {\n stroke: 'currentColor' // Use butt to follow the specification, by chance, it's already the default CSS value.\n // strokeLinecap: 'butt',\n\n },\n\n /* Styles applied to the `circle` svg path if `variant=\"static\"`. */\n circleStatic: {\n transition: theme.transitions.create('stroke-dashoffset')\n },\n\n /* Styles applied to the `circle` svg path if `variant=\"indeterminate\"`. */\n circleIndeterminate: {\n animation: '$circular-dash 1.4s ease-in-out infinite',\n // Some default value that looks fine waiting for the animation to kicks in.\n strokeDasharray: '80px, 200px',\n strokeDashoffset: '0px' // Add the unit to fix a Edge 16 and below bug.\n\n },\n\n /* Styles applied to the `circle` svg path if `variant=\"determinate\"`. */\n circleDeterminate: {\n transition: theme.transitions.create('stroke-dashoffset')\n },\n '@keyframes circular-rotate': {\n '0%': {\n // Fix IE 11 wobbly\n transformOrigin: '50% 50%'\n },\n '100%': {\n transform: 'rotate(360deg)'\n }\n },\n '@keyframes circular-dash': {\n '0%': {\n strokeDasharray: '1px, 200px',\n strokeDashoffset: '0px'\n },\n '50%': {\n strokeDasharray: '100px, 200px',\n strokeDashoffset: '-15px'\n },\n '100%': {\n strokeDasharray: '100px, 200px',\n strokeDashoffset: '-125px'\n }\n },\n\n /* Styles applied to the `circle` svg path if `disableShrink={true}`. */\n circleDisableShrink: {\n animation: 'none'\n }\n };\n};\n/**\n * ## ARIA\n *\n * If the progress bar is describing the loading progress of a particular region of a page,\n * you should use `aria-describedby` to point to the progress bar, and set the `aria-busy`\n * attribute to `true` on that region until it has finished loading.\n */\n\nvar CircularProgress = /*#__PURE__*/React.forwardRef(function CircularProgress(props, ref) {\n var classes = props.classes,\n className = props.className,\n _props$color = props.color,\n color = _props$color === void 0 ? 'primary' : _props$color,\n _props$disableShrink = props.disableShrink,\n disableShrink = _props$disableShrink === void 0 ? false : _props$disableShrink,\n _props$size = props.size,\n size = _props$size === void 0 ? 40 : _props$size,\n style = props.style,\n _props$thickness = props.thickness,\n thickness = _props$thickness === void 0 ? 3.6 : _props$thickness,\n _props$value = props.value,\n value = _props$value === void 0 ? 0 : _props$value,\n _props$variant = props.variant,\n variant = _props$variant === void 0 ? 'indeterminate' : _props$variant,\n other = _objectWithoutProperties(props, [\"classes\", \"className\", \"color\", \"disableShrink\", \"size\", \"style\", \"thickness\", \"value\", \"variant\"]);\n\n var circleStyle = {};\n var rootStyle = {};\n var rootProps = {};\n\n if (variant === 'determinate' || variant === 'static') {\n var circumference = 2 * Math.PI * ((SIZE - thickness) / 2);\n circleStyle.strokeDasharray = circumference.toFixed(3);\n rootProps['aria-valuenow'] = Math.round(value);\n circleStyle.strokeDashoffset = \"\".concat(((100 - value) / 100 * circumference).toFixed(3), \"px\");\n rootStyle.transform = 'rotate(-90deg)';\n }\n\n return /*#__PURE__*/React.createElement(\"div\", _extends({\n className: clsx(classes.root, className, color !== 'inherit' && classes[\"color\".concat(capitalize(color))], {\n 'determinate': classes.determinate,\n 'indeterminate': classes.indeterminate,\n 'static': classes.static\n }[variant]),\n style: _extends({\n width: size,\n height: size\n }, rootStyle, style),\n ref: ref,\n role: \"progressbar\"\n }, rootProps, other), /*#__PURE__*/React.createElement(\"svg\", {\n className: classes.svg,\n viewBox: \"\".concat(SIZE / 2, \" \").concat(SIZE / 2, \" \").concat(SIZE, \" \").concat(SIZE)\n }, /*#__PURE__*/React.createElement(\"circle\", {\n className: clsx(classes.circle, disableShrink && classes.circleDisableShrink, {\n 'determinate': classes.circleDeterminate,\n 'indeterminate': classes.circleIndeterminate,\n 'static': classes.circleStatic\n }[variant]),\n style: circleStyle,\n cx: SIZE,\n cy: SIZE,\n r: (SIZE - thickness) / 2,\n fill: \"none\",\n strokeWidth: thickness\n })));\n});\nprocess.env.NODE_ENV !== \"production\" ? CircularProgress.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the d.ts file and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * The color of the component. It supports those theme colors that make sense for this component.\n */\n color: PropTypes.oneOf(['inherit', 'primary', 'secondary']),\n\n /**\n * If `true`, the shrink animation is disabled.\n * This only works if variant is `indeterminate`.\n */\n disableShrink: chainPropTypes(PropTypes.bool, function (props) {\n if (props.disableShrink && props.variant && props.variant !== 'indeterminate') {\n return new Error('Material-UI: You have provided the `disableShrink` prop ' + 'with a variant other than `indeterminate`. This will have no effect.');\n }\n\n return null;\n }),\n\n /**\n * The size of the circle.\n * If using a number, the pixel unit is assumed.\n * If using a string, you need to provide the CSS unit, e.g '3rem'.\n */\n size: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n\n /**\n * @ignore\n */\n style: PropTypes.object,\n\n /**\n * The thickness of the circle.\n */\n thickness: PropTypes.number,\n\n /**\n * The value of the progress indicator for the determinate variant.\n * Value between 0 and 100.\n */\n value: PropTypes.number,\n\n /**\n * The variant to use.\n * Use indeterminate when there is no progress value.\n */\n variant: chainPropTypes(PropTypes.oneOf(['determinate', 'indeterminate', 'static']), function (props) {\n var variant = props.variant;\n\n if (variant === 'static') {\n throw new Error('Material-UI: `variant=\"static\"` was deprecated. Use `variant=\"determinate\"` instead.');\n }\n\n return null;\n })\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiCircularProgress',\n flip: false\n})(CircularProgress);","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React, { useContext } from 'react';\nimport styled, { ThemeContext } from 'styled-components';\nimport PropTypes from 'prop-types';\nimport { createTheme, ThemeProvider } from '@material-ui/core/styles';\nimport { CircularProgress } from '@material-ui/core';\nimport { Flex } from \"../layout\";\nvar SpinnerWrapper = styled(Flex).withConfig({\n displayName: \"Spinner__SpinnerWrapper\",\n componentId: \"sc-1veqavl-0\"\n})([\"\", \"\"], function (props) {\n if (props.fullscreen) {\n return \"\\n flex-direction: column;\\n align-items: center;\\n flex: 1 0 0;\\n &:before {\\n flex: 1 0 0;\\n content: \\\"\\\";\\n }\\n &:after {\\n flex: 4 0 0;\\n content: \\\"\\\";\\n }\\n \";\n }\n});\n\nvar Spinner = function Spinner(props) {\n var fullscreen = props.fullscreen;\n var themeContext = useContext(ThemeContext);\n var muiTheme = createTheme({\n palette: {\n primary: {\n main: props.color || themeContext.styles.colors.primaryColor\n }\n }\n });\n return React.createElement(ThemeProvider, {\n theme: muiTheme\n }, React.createElement(SpinnerWrapper, {\n fullscreen: fullscreen\n }, React.createElement(CircularProgress, {\n color: \"primary\"\n })));\n};\n\n__signature__(Spinner, \"useContext{themeContext}\");\n\nSpinner.propTypes = {\n fullscreen: PropTypes.bool\n};\nSpinner.defaultProps = {\n fullscreen: false\n};\nvar _default = Spinner;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(SpinnerWrapper, \"SpinnerWrapper\", \"/home/vsts/work/1/s/src/components/loaders/Spinner.js\");\n reactHotLoader.register(Spinner, \"Spinner\", \"/home/vsts/work/1/s/src/components/loaders/Spinner.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/loaders/Spinner.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport Spinner from \"./Spinner.js\";\n\nvar _default = function _default(props) {\n var isSaving = props.isSaving,\n error = props.error;\n\n if (isSaving === false && error === null) {}\n\n return React.createElement(\"div\", null, React.createElement(Spinner, null), \"Saving...\");\n};\n\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/loaders/Status.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nexport { default as Progress } from \"./Progress.js\";\nexport { default as Spinner } from \"./Spinner.js\";\nexport { default as Status } from \"./Status.js\";\nexport { default as Skeleton } from \"./Skeleton.js\";","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\nimport { BORDER, COLOR, SPACE } from \"../../constants/style.js\";\nimport { Div, Flex } from \"../layout\";\nimport { Icon } from \"../icons\";\nvar StyledMessage = styled(Flex).withConfig({\n displayName: \"Message__StyledMessage\",\n componentId: \"sc-7um2iu-0\"\n})([\"border:\", \" solid \", \";flex-direction:row;align-items:center;padding:\", \";border-radius:\", \";margin-bottom:\", \";&:last-child{margin-bottom:0;}svg{color:\", \";}border-color:\", \";\", \"\"], BORDER.width.md, function (props) {\n return props.theme.styles.secondary.color;\n}, SPACE.md, BORDER.radius.sm, SPACE.xl, function (props) {\n return COLOR[props.variant] ? COLOR[props.variant].base : '' || props.theme.styles.colors[props.variant] || props.theme.styles.colors.tertiary;\n}, function (props) {\n return props.theme.styles.colors.divider;\n}, function (props) {\n switch (props.variant) {\n case 'plain':\n return \"\\n color: \".concat(COLOR.gray.darkest, \";\\n border-color: \").concat(COLOR.gray.lighter, \";\\n background-color: \").concat(COLOR.offWhite, \";\\n \");\n\n case 'info':\n case 'warning':\n case 'error':\n return \"\\n color: \".concat(COLOR[props.variant].base, \";\\n border-color: \").concat(COLOR[props.variant].base, \";\\n background-color: \").concat(COLOR[props.variant].lightest, \";\\n \");\n\n default:\n break;\n }\n});\nvar IconWrapper = styled(Div).withConfig({\n displayName: \"Message__IconWrapper\",\n componentId: \"sc-7um2iu-1\"\n})([\"padding-right:\", \";\"], SPACE.sm);\n\nvar Message = function Message(props) {\n var children = props.children,\n icon = props.icon;\n\n var variant = props.variant,\n category = props.category,\n rest = _objectWithoutProperties(props, [\"variant\", \"category\"]);\n\n return React.createElement(StyledMessage, _extends({}, rest, {\n variant: variant || category\n }), icon ? React.createElement(IconWrapper, null, React.createElement(Icon, {\n name: icon\n })) : null, children);\n};\n\nMessage.propTypes = {\n // TODO: Export available icons from Icon and set icon to oneOf them\n icon: PropTypes.string,\n category: PropTypes.oneOf(['error', 'info']),\n variant: PropTypes.oneOf(['plain', 'error', 'warning', 'info'])\n};\nMessage.defaultProps = {\n variant: 'plain'\n};\nvar _default = Message;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledMessage, \"StyledMessage\", \"/home/vsts/work/1/s/src/components/messages/Message.js\");\n reactHotLoader.register(IconWrapper, \"IconWrapper\", \"/home/vsts/work/1/s/src/components/messages/Message.js\");\n reactHotLoader.register(Message, \"Message\", \"/home/vsts/work/1/s/src/components/messages/Message.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/messages/Message.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport ownerDocument from '../utils/ownerDocument';\nimport useForkRef from '../utils/useForkRef';\nimport useEventCallback from '../utils/useEventCallback';\nimport { elementAcceptingRef, exactProp } from '@material-ui/utils';\n\nfunction mapEventPropToEvent(eventProp) {\n return eventProp.substring(2).toLowerCase();\n}\n\nfunction clickedRootScrollbar(event) {\n return document.documentElement.clientWidth < event.clientX || document.documentElement.clientHeight < event.clientY;\n}\n/**\n * Listen for click events that occur somewhere in the document, outside of the element itself.\n * For instance, if you need to hide a menu when people click anywhere else on your page.\n */\n\n\nfunction ClickAwayListener(props) {\n var children = props.children,\n _props$disableReactTr = props.disableReactTree,\n disableReactTree = _props$disableReactTr === void 0 ? false : _props$disableReactTr,\n _props$mouseEvent = props.mouseEvent,\n mouseEvent = _props$mouseEvent === void 0 ? 'onClick' : _props$mouseEvent,\n onClickAway = props.onClickAway,\n _props$touchEvent = props.touchEvent,\n touchEvent = _props$touchEvent === void 0 ? 'onTouchEnd' : _props$touchEvent;\n var movedRef = React.useRef(false);\n var nodeRef = React.useRef(null);\n var activatedRef = React.useRef(false);\n var syntheticEventRef = React.useRef(false);\n React.useEffect(function () {\n // Ensure that this component is not \"activated\" synchronously.\n // https://github.com/facebook/react/issues/20074\n setTimeout(function () {\n activatedRef.current = true;\n }, 0);\n return function () {\n activatedRef.current = false;\n };\n }, []); // can be removed once we drop support for non ref forwarding class components\n\n var handleOwnRef = React.useCallback(function (instance) {\n // #StrictMode ready\n nodeRef.current = ReactDOM.findDOMNode(instance);\n }, []);\n var handleRef = useForkRef(children.ref, handleOwnRef); // The handler doesn't take event.defaultPrevented into account:\n //\n // event.preventDefault() is meant to stop default behaviours like\n // clicking a checkbox to check it, hitting a button to submit a form,\n // and hitting left arrow to move the cursor in a text input etc.\n // Only special HTML elements have these default behaviors.\n\n var handleClickAway = useEventCallback(function (event) {\n // Given developers can stop the propagation of the synthetic event,\n // we can only be confident with a positive value.\n var insideReactTree = syntheticEventRef.current;\n syntheticEventRef.current = false; // 1. IE 11 support, which trigger the handleClickAway even after the unbind\n // 2. The child might render null.\n // 3. Behave like a blur listener.\n\n if (!activatedRef.current || !nodeRef.current || clickedRootScrollbar(event)) {\n return;\n } // Do not act if user performed touchmove\n\n\n if (movedRef.current) {\n movedRef.current = false;\n return;\n }\n\n var insideDOM; // If not enough, can use https://github.com/DieterHolvoet/event-propagation-path/blob/master/propagationPath.js\n\n if (event.composedPath) {\n insideDOM = event.composedPath().indexOf(nodeRef.current) > -1;\n } else {\n // TODO v6 remove dead logic https://caniuse.com/#search=composedPath.\n var doc = ownerDocument(nodeRef.current);\n insideDOM = !doc.documentElement.contains(event.target) || nodeRef.current.contains(event.target);\n }\n\n if (!insideDOM && (disableReactTree || !insideReactTree)) {\n onClickAway(event);\n }\n }); // Keep track of mouse/touch events that bubbled up through the portal.\n\n var createHandleSynthetic = function createHandleSynthetic(handlerName) {\n return function (event) {\n syntheticEventRef.current = true;\n var childrenPropsHandler = children.props[handlerName];\n\n if (childrenPropsHandler) {\n childrenPropsHandler(event);\n }\n };\n };\n\n var childrenProps = {\n ref: handleRef\n };\n\n if (touchEvent !== false) {\n childrenProps[touchEvent] = createHandleSynthetic(touchEvent);\n }\n\n React.useEffect(function () {\n if (touchEvent !== false) {\n var mappedTouchEvent = mapEventPropToEvent(touchEvent);\n var doc = ownerDocument(nodeRef.current);\n\n var handleTouchMove = function handleTouchMove() {\n movedRef.current = true;\n };\n\n doc.addEventListener(mappedTouchEvent, handleClickAway);\n doc.addEventListener('touchmove', handleTouchMove);\n return function () {\n doc.removeEventListener(mappedTouchEvent, handleClickAway);\n doc.removeEventListener('touchmove', handleTouchMove);\n };\n }\n\n return undefined;\n }, [handleClickAway, touchEvent]);\n\n if (mouseEvent !== false) {\n childrenProps[mouseEvent] = createHandleSynthetic(mouseEvent);\n }\n\n React.useEffect(function () {\n if (mouseEvent !== false) {\n var mappedMouseEvent = mapEventPropToEvent(mouseEvent);\n var doc = ownerDocument(nodeRef.current);\n doc.addEventListener(mappedMouseEvent, handleClickAway);\n return function () {\n doc.removeEventListener(mappedMouseEvent, handleClickAway);\n };\n }\n\n return undefined;\n }, [handleClickAway, mouseEvent]);\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.cloneElement(children, childrenProps));\n}\n\nprocess.env.NODE_ENV !== \"production\" ? ClickAwayListener.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the d.ts file and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n\n /**\n * The wrapped element.\n */\n children: elementAcceptingRef.isRequired,\n\n /**\n * If `true`, the React tree is ignored and only the DOM tree is considered.\n * This prop changes how portaled elements are handled.\n */\n disableReactTree: PropTypes.bool,\n\n /**\n * The mouse event to listen to. You can disable the listener by providing `false`.\n */\n mouseEvent: PropTypes.oneOf(['onClick', 'onMouseDown', 'onMouseUp', false]),\n\n /**\n * Callback fired when a \"click away\" event is detected.\n */\n onClickAway: PropTypes.func.isRequired,\n\n /**\n * The touch event to listen to. You can disable the listener by providing `false`.\n */\n touchEvent: PropTypes.oneOf(['onTouchEnd', 'onTouchStart', false])\n} : void 0;\n\nif (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line\n ClickAwayListener['propTypes' + ''] = exactProp(ClickAwayListener.propTypes);\n}\n\nexport default ClickAwayListener;","import _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport _defineProperty from \"@babel/runtime/helpers/esm/defineProperty\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport Paper from '../Paper';\nimport { emphasize } from '../styles/colorManipulator';\nexport var styles = function styles(theme) {\n var emphasis = theme.palette.type === 'light' ? 0.8 : 0.98;\n var backgroundColor = emphasize(theme.palette.background.default, emphasis);\n return {\n /* Styles applied to the root element. */\n root: _extends({}, theme.typography.body2, _defineProperty({\n color: theme.palette.getContrastText(backgroundColor),\n backgroundColor: backgroundColor,\n display: 'flex',\n alignItems: 'center',\n flexWrap: 'wrap',\n padding: '6px 16px',\n borderRadius: theme.shape.borderRadius,\n flexGrow: 1\n }, theme.breakpoints.up('sm'), {\n flexGrow: 'initial',\n minWidth: 288\n })),\n\n /* Styles applied to the message wrapper element. */\n message: {\n padding: '8px 0'\n },\n\n /* Styles applied to the action wrapper element if `action` is provided. */\n action: {\n display: 'flex',\n alignItems: 'center',\n marginLeft: 'auto',\n paddingLeft: 16,\n marginRight: -8\n }\n };\n};\nvar SnackbarContent = /*#__PURE__*/React.forwardRef(function SnackbarContent(props, ref) {\n var action = props.action,\n classes = props.classes,\n className = props.className,\n message = props.message,\n _props$role = props.role,\n role = _props$role === void 0 ? 'alert' : _props$role,\n other = _objectWithoutProperties(props, [\"action\", \"classes\", \"className\", \"message\", \"role\"]);\n\n return /*#__PURE__*/React.createElement(Paper, _extends({\n role: role,\n square: true,\n elevation: 6,\n className: clsx(classes.root, className),\n ref: ref\n }, other), /*#__PURE__*/React.createElement(\"div\", {\n className: classes.message\n }, message), action ? /*#__PURE__*/React.createElement(\"div\", {\n className: classes.action\n }, action) : null);\n});\nprocess.env.NODE_ENV !== \"production\" ? SnackbarContent.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the d.ts file and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n\n /**\n * The action to display. It renders after the message, at the end of the snackbar.\n */\n action: PropTypes.node,\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * The message to display.\n */\n message: PropTypes.node,\n\n /**\n * The ARIA role attribute of the element.\n */\n role: PropTypes.string\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiSnackbarContent'\n})(SnackbarContent);","import _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport _defineProperty from \"@babel/runtime/helpers/esm/defineProperty\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport { duration } from '../styles/transitions';\nimport ClickAwayListener from '../ClickAwayListener';\nimport useEventCallback from '../utils/useEventCallback';\nimport capitalize from '../utils/capitalize';\nimport createChainedFunction from '../utils/createChainedFunction';\nimport deprecatedPropType from '../utils/deprecatedPropType';\nimport Grow from '../Grow';\nimport SnackbarContent from '../SnackbarContent';\nexport var styles = function styles(theme) {\n var top1 = {\n top: 8\n };\n var bottom1 = {\n bottom: 8\n };\n var right = {\n justifyContent: 'flex-end'\n };\n var left = {\n justifyContent: 'flex-start'\n };\n var top3 = {\n top: 24\n };\n var bottom3 = {\n bottom: 24\n };\n var right3 = {\n right: 24\n };\n var left3 = {\n left: 24\n };\n var center = {\n left: '50%',\n right: 'auto',\n transform: 'translateX(-50%)'\n };\n return {\n /* Styles applied to the root element. */\n root: {\n zIndex: theme.zIndex.snackbar,\n position: 'fixed',\n display: 'flex',\n left: 8,\n right: 8,\n justifyContent: 'center',\n alignItems: 'center'\n },\n\n /* Styles applied to the root element if `anchorOrigin={{ 'top', 'center' }}`. */\n anchorOriginTopCenter: _extends({}, top1, _defineProperty({}, theme.breakpoints.up('sm'), _extends({}, top3, center))),\n\n /* Styles applied to the root element if `anchorOrigin={{ 'bottom', 'center' }}`. */\n anchorOriginBottomCenter: _extends({}, bottom1, _defineProperty({}, theme.breakpoints.up('sm'), _extends({}, bottom3, center))),\n\n /* Styles applied to the root element if `anchorOrigin={{ 'top', 'right' }}`. */\n anchorOriginTopRight: _extends({}, top1, right, _defineProperty({}, theme.breakpoints.up('sm'), _extends({\n left: 'auto'\n }, top3, right3))),\n\n /* Styles applied to the root element if `anchorOrigin={{ 'bottom', 'right' }}`. */\n anchorOriginBottomRight: _extends({}, bottom1, right, _defineProperty({}, theme.breakpoints.up('sm'), _extends({\n left: 'auto'\n }, bottom3, right3))),\n\n /* Styles applied to the root element if `anchorOrigin={{ 'top', 'left' }}`. */\n anchorOriginTopLeft: _extends({}, top1, left, _defineProperty({}, theme.breakpoints.up('sm'), _extends({\n right: 'auto'\n }, top3, left3))),\n\n /* Styles applied to the root element if `anchorOrigin={{ 'bottom', 'left' }}`. */\n anchorOriginBottomLeft: _extends({}, bottom1, left, _defineProperty({}, theme.breakpoints.up('sm'), _extends({\n right: 'auto'\n }, bottom3, left3)))\n };\n};\nvar Snackbar = /*#__PURE__*/React.forwardRef(function Snackbar(props, ref) {\n var action = props.action,\n _props$anchorOrigin = props.anchorOrigin;\n _props$anchorOrigin = _props$anchorOrigin === void 0 ? {\n vertical: 'bottom',\n horizontal: 'center'\n } : _props$anchorOrigin;\n\n var vertical = _props$anchorOrigin.vertical,\n horizontal = _props$anchorOrigin.horizontal,\n _props$autoHideDurati = props.autoHideDuration,\n autoHideDuration = _props$autoHideDurati === void 0 ? null : _props$autoHideDurati,\n children = props.children,\n classes = props.classes,\n className = props.className,\n ClickAwayListenerProps = props.ClickAwayListenerProps,\n ContentProps = props.ContentProps,\n _props$disableWindowB = props.disableWindowBlurListener,\n disableWindowBlurListener = _props$disableWindowB === void 0 ? false : _props$disableWindowB,\n message = props.message,\n onClose = props.onClose,\n onEnter = props.onEnter,\n onEntered = props.onEntered,\n onEntering = props.onEntering,\n onExit = props.onExit,\n onExited = props.onExited,\n onExiting = props.onExiting,\n onMouseEnter = props.onMouseEnter,\n onMouseLeave = props.onMouseLeave,\n open = props.open,\n resumeHideDuration = props.resumeHideDuration,\n _props$TransitionComp = props.TransitionComponent,\n TransitionComponent = _props$TransitionComp === void 0 ? Grow : _props$TransitionComp,\n _props$transitionDura = props.transitionDuration,\n transitionDuration = _props$transitionDura === void 0 ? {\n enter: duration.enteringScreen,\n exit: duration.leavingScreen\n } : _props$transitionDura,\n TransitionProps = props.TransitionProps,\n other = _objectWithoutProperties(props, [\"action\", \"anchorOrigin\", \"autoHideDuration\", \"children\", \"classes\", \"className\", \"ClickAwayListenerProps\", \"ContentProps\", \"disableWindowBlurListener\", \"message\", \"onClose\", \"onEnter\", \"onEntered\", \"onEntering\", \"onExit\", \"onExited\", \"onExiting\", \"onMouseEnter\", \"onMouseLeave\", \"open\", \"resumeHideDuration\", \"TransitionComponent\", \"transitionDuration\", \"TransitionProps\"]);\n\n var timerAutoHide = React.useRef();\n\n var _React$useState = React.useState(true),\n exited = _React$useState[0],\n setExited = _React$useState[1];\n\n var handleClose = useEventCallback(function () {\n if (onClose) {\n onClose.apply(void 0, arguments);\n }\n });\n var setAutoHideTimer = useEventCallback(function (autoHideDurationParam) {\n if (!onClose || autoHideDurationParam == null) {\n return;\n }\n\n clearTimeout(timerAutoHide.current);\n timerAutoHide.current = setTimeout(function () {\n handleClose(null, 'timeout');\n }, autoHideDurationParam);\n });\n React.useEffect(function () {\n if (open) {\n setAutoHideTimer(autoHideDuration);\n }\n\n return function () {\n clearTimeout(timerAutoHide.current);\n };\n }, [open, autoHideDuration, setAutoHideTimer]); // Pause the timer when the user is interacting with the Snackbar\n // or when the user hide the window.\n\n var handlePause = function handlePause() {\n clearTimeout(timerAutoHide.current);\n }; // Restart the timer when the user is no longer interacting with the Snackbar\n // or when the window is shown back.\n\n\n var handleResume = React.useCallback(function () {\n if (autoHideDuration != null) {\n setAutoHideTimer(resumeHideDuration != null ? resumeHideDuration : autoHideDuration * 0.5);\n }\n }, [autoHideDuration, resumeHideDuration, setAutoHideTimer]);\n\n var handleMouseEnter = function handleMouseEnter(event) {\n if (onMouseEnter) {\n onMouseEnter(event);\n }\n\n handlePause();\n };\n\n var handleMouseLeave = function handleMouseLeave(event) {\n if (onMouseLeave) {\n onMouseLeave(event);\n }\n\n handleResume();\n };\n\n var handleClickAway = function handleClickAway(event) {\n if (onClose) {\n onClose(event, 'clickaway');\n }\n };\n\n var handleExited = function handleExited() {\n setExited(true);\n };\n\n var handleEnter = function handleEnter() {\n setExited(false);\n };\n\n React.useEffect(function () {\n if (!disableWindowBlurListener && open) {\n window.addEventListener('focus', handleResume);\n window.addEventListener('blur', handlePause);\n return function () {\n window.removeEventListener('focus', handleResume);\n window.removeEventListener('blur', handlePause);\n };\n }\n\n return undefined;\n }, [disableWindowBlurListener, handleResume, open]); // So we only render active snackbars.\n\n if (!open && exited) {\n return null;\n }\n\n return /*#__PURE__*/React.createElement(ClickAwayListener, _extends({\n onClickAway: handleClickAway\n }, ClickAwayListenerProps), /*#__PURE__*/React.createElement(\"div\", _extends({\n className: clsx(classes.root, classes[\"anchorOrigin\".concat(capitalize(vertical)).concat(capitalize(horizontal))], className),\n onMouseEnter: handleMouseEnter,\n onMouseLeave: handleMouseLeave,\n ref: ref\n }, other), /*#__PURE__*/React.createElement(TransitionComponent, _extends({\n appear: true,\n in: open,\n onEnter: createChainedFunction(handleEnter, onEnter),\n onEntered: onEntered,\n onEntering: onEntering,\n onExit: onExit,\n onExited: createChainedFunction(handleExited, onExited),\n onExiting: onExiting,\n timeout: transitionDuration,\n direction: vertical === 'top' ? 'down' : 'up'\n }, TransitionProps), children || /*#__PURE__*/React.createElement(SnackbarContent, _extends({\n message: message,\n action: action\n }, ContentProps)))));\n});\nprocess.env.NODE_ENV !== \"production\" ? Snackbar.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the d.ts file and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n\n /**\n * The action to display. It renders after the message, at the end of the snackbar.\n */\n action: PropTypes.node,\n\n /**\n * The anchor of the `Snackbar`.\n */\n anchorOrigin: PropTypes.shape({\n horizontal: PropTypes.oneOf(['center', 'left', 'right']).isRequired,\n vertical: PropTypes.oneOf(['bottom', 'top']).isRequired\n }),\n\n /**\n * The number of milliseconds to wait before automatically calling the\n * `onClose` function. `onClose` should then set the state of the `open`\n * prop to hide the Snackbar. This behavior is disabled by default with\n * the `null` value.\n */\n autoHideDuration: PropTypes.number,\n\n /**\n * Replace the `SnackbarContent` component.\n */\n children: PropTypes.element,\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * Props applied to the `ClickAwayListener` element.\n */\n ClickAwayListenerProps: PropTypes.object,\n\n /**\n * Props applied to the [`SnackbarContent`](/api/snackbar-content/) element.\n */\n ContentProps: PropTypes.object,\n\n /**\n * If `true`, the `autoHideDuration` timer will expire even if the window is not focused.\n */\n disableWindowBlurListener: PropTypes.bool,\n\n /**\n * When displaying multiple consecutive Snackbars from a parent rendering a single\n * , add the key prop to ensure independent treatment of each message.\n * e.g. , otherwise, the message may update-in-place and\n * features such as autoHideDuration may be canceled.\n */\n key: PropTypes.any,\n\n /**\n * The message to display.\n */\n message: PropTypes.node,\n\n /**\n * Callback fired when the component requests to be closed.\n * Typically `onClose` is used to set state in the parent component,\n * which is used to control the `Snackbar` `open` prop.\n * The `reason` parameter can optionally be used to control the response to `onClose`,\n * for example ignoring `clickaway`.\n *\n * @param {object} event The event source of the callback.\n * @param {string} reason Can be: `\"timeout\"` (`autoHideDuration` expired), `\"clickaway\"`.\n */\n onClose: PropTypes.func,\n\n /**\n * Callback fired before the transition is entering.\n * @deprecated Use the `TransitionProps` prop instead.\n */\n onEnter: deprecatedPropType(PropTypes.func, 'Use the `TransitionProps` prop instead.'),\n\n /**\n * Callback fired when the transition has entered.\n * @deprecated Use the `TransitionProps` prop instead.\n */\n onEntered: deprecatedPropType(PropTypes.func, 'Use the `TransitionProps` prop instead.'),\n\n /**\n * Callback fired when the transition is entering.\n * @deprecated Use the `TransitionProps` prop instead.\n */\n onEntering: deprecatedPropType(PropTypes.func, 'Use the `TransitionProps` prop instead.'),\n\n /**\n * Callback fired before the transition is exiting.\n * @deprecated Use the `TransitionProps` prop instead.\n */\n onExit: deprecatedPropType(PropTypes.func, 'Use the `TransitionProps` prop instead.'),\n\n /**\n * Callback fired when the transition has exited.\n * @deprecated Use the `TransitionProps` prop instead.\n */\n onExited: deprecatedPropType(PropTypes.func, 'Use the `TransitionProps` prop instead.'),\n\n /**\n * Callback fired when the transition is exiting.\n * @deprecated Use the `TransitionProps` prop instead.\n */\n onExiting: deprecatedPropType(PropTypes.func, 'Use the `TransitionProps` prop instead.'),\n\n /**\n * @ignore\n */\n onMouseEnter: PropTypes.func,\n\n /**\n * @ignore\n */\n onMouseLeave: PropTypes.func,\n\n /**\n * If `true`, `Snackbar` is open.\n */\n open: PropTypes.bool,\n\n /**\n * The number of milliseconds to wait before dismissing after user interaction.\n * If `autoHideDuration` prop isn't specified, it does nothing.\n * If `autoHideDuration` prop is specified but `resumeHideDuration` isn't,\n * we default to `autoHideDuration / 2` ms.\n */\n resumeHideDuration: PropTypes.number,\n\n /**\n * The component used for the transition.\n * [Follow this guide](/components/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.\n */\n TransitionComponent: PropTypes.elementType,\n\n /**\n * The duration for the transition, in milliseconds.\n * You may specify a single timeout for all transitions, or individually with an object.\n */\n transitionDuration: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({\n appear: PropTypes.number,\n enter: PropTypes.number,\n exit: PropTypes.number\n })]),\n\n /**\n * Props applied to the [`Transition`](http://reactcommunity.org/react-transition-group/transition#Transition-props) element.\n */\n TransitionProps: PropTypes.object\n} : void 0;\nexport default withStyles(styles, {\n flip: false,\n name: 'MuiSnackbar'\n})(Snackbar);","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\n\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== \"undefined\" && arr[Symbol.iterator] || arr[\"@@iterator\"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"] != null) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; }\n\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React, { useEffect, useState } from 'react';\nimport { Grow, Snackbar } from '@material-ui/core';\nimport { makeStyles } from '@material-ui/core/styles';\n\nvar Notification = function Notification(props) {\n var id = props.id,\n message = props.message,\n onDismiss = props.onDismiss;\n\n var _useState = useState(true),\n _useState2 = _slicedToArray(_useState, 2),\n isOpen = _useState2[0],\n setIsOpen = _useState2[1];\n\n useEffect(function () {\n setIsOpen(true);\n }, [id]);\n\n var handleCloseClick = function handleCloseClick() {\n setIsOpen(false);\n\n if (typeof onDismiss === 'function') {\n onDismiss();\n }\n };\n\n return React.createElement(Snackbar, {\n TransitionComponent: Grow,\n message: message,\n open: isOpen,\n onClose: handleCloseClick\n });\n};\n\n__signature__(Notification, \"useState{[isOpen, setIsOpen](true)}\\nuseEffect{}\");\n\nvar _default = Notification;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(Notification, \"Notification\", \"/home/vsts/work/1/s/src/components/messages/Notification.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/messages/Notification.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React, { Fragment } from 'react';\nimport { SnackbarProvider, useSnackbar } from 'notistack';\nimport { Icon } from \"../icons\";\nexport var NotificationProvider = function NotificationProvider(props) {\n var children = props.children,\n rest = _objectWithoutProperties(props, [\"children\"]);\n\n return React.createElement(SnackbarProvider, _extends({\n hideIconVariant: true\n }, rest), children);\n};\nexport var useNotification = function useNotification() {\n var _useSnackbar = useSnackbar(),\n enqueueSnackbar = _useSnackbar.enqueueSnackbar,\n closeSnackbar = _useSnackbar.closeSnackbar;\n\n var closeNotification = function closeNotification(key) {\n closeSnackbar(key);\n };\n\n var Actions = function Actions(key) {\n return React.createElement(Fragment, null, React.createElement(Icon, {\n name: \"close\",\n color: \"#fff\",\n style: {\n cursor: 'pointer'\n },\n onClick: function onClick() {\n return closeNotification(key);\n }\n }));\n };\n\n var enqueueNotification = function enqueueNotification(message, options) {\n enqueueSnackbar(message, _objectSpread({}, options, {\n action: options.persist ? Actions : null\n }));\n };\n\n return {\n enqueueNotification: enqueueNotification,\n closeNotification: closeNotification\n };\n};\n\n__signature__(useNotification, \"useSnackbar{{enqueueSnackbar, closeSnackbar}}\", function () {\n return [useSnackbar];\n});\n\nvar _default = useNotification;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(NotificationProvider, \"NotificationProvider\", \"/home/vsts/work/1/s/src/components/messages/NotificationService.js\");\n reactHotLoader.register(useNotification, \"useNotification\", \"/home/vsts/work/1/s/src/components/messages/NotificationService.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/messages/NotificationService.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React, { Fragment } from 'react';\nimport styled from 'styled-components';\nimport PropTypes from 'prop-types';\nimport { Modal } from \"./\";\nimport { Flex } from \"../layout\";\nimport { Button } from \"../buttons\";\nimport { Paragraph } from \"../text\";\nvar ModalActions = styled(Button).withConfig({\n displayName: \"ConfirmationDialog__ModalActions\",\n componentId: \"sc-qr2fhl-0\"\n})([\"flex:1 0 0;\"]);\nvar ModalMessage = styled(Paragraph).withConfig({\n displayName: \"ConfirmationDialog__ModalMessage\",\n componentId: \"sc-qr2fhl-1\"\n})([\"text-align:center;\"]);\n\nvar ConfirmationDialog = function ConfirmationDialog(props) {\n var buttonDismiss = props.buttonDismiss,\n buttonCancel = props.buttonCancel,\n buttonConfirm = props.buttonConfirm,\n open = props.open,\n title = props.title,\n variant = props.variant,\n message = props.message,\n onSubmit = props.onSubmit,\n onClose = props.onClose;\n return React.createElement(Modal, {\n open: open,\n heading: title,\n size: \"sm\"\n }, React.createElement(Flex, {\n marginBottom: \"16px\"\n }, React.createElement(ModalMessage, null, message)), React.createElement(Flex, null, variant === 'confirm' && React.createElement(Fragment, null, React.createElement(ModalActions, {\n color: \"secondary\",\n onClick: onClose,\n size: \"sm\"\n }, buttonCancel), React.createElement(ModalActions, {\n color: \"primary\",\n onClick: onSubmit,\n size: \"sm\"\n }, buttonConfirm)), variant === 'info' && React.createElement(ModalActions, {\n color: \"primary\",\n onClick: onSubmit,\n size: \"sm\"\n }, buttonDismiss)));\n};\n\nConfirmationDialog.propTypes = {\n variant: PropTypes.oneOf(['confirm', 'info'])\n};\nConfirmationDialog.defaultProps = {\n variant: 'confirm',\n buttonConfirm: 'Yes',\n buttonCancel: 'No',\n buttonDismiss: 'OK'\n};\nvar _default = ConfirmationDialog;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(ModalActions, \"ModalActions\", \"/home/vsts/work/1/s/src/components/overlays/ConfirmationDialog.js\");\n reactHotLoader.register(ModalMessage, \"ModalMessage\", \"/home/vsts/work/1/s/src/components/overlays/ConfirmationDialog.js\");\n reactHotLoader.register(ConfirmationDialog, \"ConfirmationDialog\", \"/home/vsts/work/1/s/src/components/overlays/ConfirmationDialog.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/overlays/ConfirmationDialog.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\n\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== \"undefined\" && arr[Symbol.iterator] || arr[\"@@iterator\"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"] != null) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; }\n\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React, { Fragment, createContext, useContext, useRef, useState } from 'react';\nimport ConfirmationDialog from \"./ConfirmationDialog.js\";\nvar ConfirmationServiceContext = createContext(Promise.reject);\nexport var useConfirmation = function useConfirmation() {\n return useContext(ConfirmationServiceContext);\n};\n\n__signature__(useConfirmation, \"useContext{}\");\n\nexport var ConfirmationServiceProvider = function ConfirmationServiceProvider(_ref) {\n var children = _ref.children;\n\n var _useState = useState(false),\n _useState2 = _slicedToArray(_useState, 2),\n open = _useState2[0],\n setOpen = _useState2[1];\n\n var _useState3 = useState(null),\n _useState4 = _slicedToArray(_useState3, 2),\n confirmationState = _useState4[0],\n setConfirmationState = _useState4[1];\n\n var awaitingPromiseRef = useRef();\n\n var openConfirmation = function openConfirmation(options) {\n setConfirmationState(options);\n setOpen(true);\n return new Promise(function (resolve, reject) {\n awaitingPromiseRef.current = {\n resolve: resolve,\n reject: reject\n };\n });\n };\n\n var handleClose = function handleClose() {\n if (confirmationState.catchOnCancel && awaitingPromiseRef.current) {\n awaitingPromiseRef.current.reject();\n }\n\n setOpen(false);\n };\n\n var handleSubmit = function handleSubmit() {\n if (awaitingPromiseRef.current) {\n awaitingPromiseRef.current.resolve();\n }\n\n setOpen(false);\n };\n\n var handleClosed = function handleClosed() {\n setConfirmationState(null);\n };\n\n return React.createElement(Fragment, null, React.createElement(ConfirmationServiceContext.Provider, {\n value: openConfirmation\n }, children), React.createElement(ConfirmationDialog, _extends({\n open: open,\n onSubmit: handleSubmit,\n onClose: handleClose,\n onClosed: handleClosed\n }, confirmationState)));\n};\n\n__signature__(ConfirmationServiceProvider, \"useState{[open, setOpen](false)}\\nuseState{[confirmationState, setConfirmationState](null)}\\nuseRef{awaitingPromiseRef}\");\n\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(ConfirmationServiceContext, \"ConfirmationServiceContext\", \"/home/vsts/work/1/s/src/components/overlays/ConfirmationService.js\");\n reactHotLoader.register(useConfirmation, \"useConfirmation\", \"/home/vsts/work/1/s/src/components/overlays/ConfirmationService.js\");\n reactHotLoader.register(ConfirmationServiceProvider, \"ConfirmationServiceProvider\", \"/home/vsts/work/1/s/src/components/overlays/ConfirmationService.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _slicedToArray from \"@babel/runtime/helpers/esm/slicedToArray\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { Transition } from 'react-transition-group';\nimport { duration } from '../styles/transitions';\nimport useTheme from '../styles/useTheme';\nimport { reflow, getTransitionProps } from '../transitions/utils';\nimport useForkRef from '../utils/useForkRef';\nvar styles = {\n entering: {\n opacity: 1\n },\n entered: {\n opacity: 1\n }\n};\nvar defaultTimeout = {\n enter: duration.enteringScreen,\n exit: duration.leavingScreen\n};\n/**\n * The Fade transition is used by the [Modal](/components/modal/) component.\n * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally.\n */\n\nvar Fade = /*#__PURE__*/React.forwardRef(function Fade(props, ref) {\n var children = props.children,\n _props$disableStrictM = props.disableStrictModeCompat,\n disableStrictModeCompat = _props$disableStrictM === void 0 ? false : _props$disableStrictM,\n inProp = props.in,\n onEnter = props.onEnter,\n onEntered = props.onEntered,\n onEntering = props.onEntering,\n onExit = props.onExit,\n onExited = props.onExited,\n onExiting = props.onExiting,\n style = props.style,\n _props$TransitionComp = props.TransitionComponent,\n TransitionComponent = _props$TransitionComp === void 0 ? Transition : _props$TransitionComp,\n _props$timeout = props.timeout,\n timeout = _props$timeout === void 0 ? defaultTimeout : _props$timeout,\n other = _objectWithoutProperties(props, [\"children\", \"disableStrictModeCompat\", \"in\", \"onEnter\", \"onEntered\", \"onEntering\", \"onExit\", \"onExited\", \"onExiting\", \"style\", \"TransitionComponent\", \"timeout\"]);\n\n var theme = useTheme();\n var enableStrictModeCompat = theme.unstable_strictMode && !disableStrictModeCompat;\n var nodeRef = React.useRef(null);\n var foreignRef = useForkRef(children.ref, ref);\n var handleRef = useForkRef(enableStrictModeCompat ? nodeRef : undefined, foreignRef);\n\n var normalizedTransitionCallback = function normalizedTransitionCallback(callback) {\n return function (nodeOrAppearing, maybeAppearing) {\n if (callback) {\n var _ref = enableStrictModeCompat ? [nodeRef.current, nodeOrAppearing] : [nodeOrAppearing, maybeAppearing],\n _ref2 = _slicedToArray(_ref, 2),\n node = _ref2[0],\n isAppearing = _ref2[1]; // onEnterXxx and onExitXxx callbacks have a different arguments.length value.\n\n\n if (isAppearing === undefined) {\n callback(node);\n } else {\n callback(node, isAppearing);\n }\n }\n };\n };\n\n var handleEntering = normalizedTransitionCallback(onEntering);\n var handleEnter = normalizedTransitionCallback(function (node, isAppearing) {\n reflow(node); // So the animation always start from the start.\n\n var transitionProps = getTransitionProps({\n style: style,\n timeout: timeout\n }, {\n mode: 'enter'\n });\n node.style.webkitTransition = theme.transitions.create('opacity', transitionProps);\n node.style.transition = theme.transitions.create('opacity', transitionProps);\n\n if (onEnter) {\n onEnter(node, isAppearing);\n }\n });\n var handleEntered = normalizedTransitionCallback(onEntered);\n var handleExiting = normalizedTransitionCallback(onExiting);\n var handleExit = normalizedTransitionCallback(function (node) {\n var transitionProps = getTransitionProps({\n style: style,\n timeout: timeout\n }, {\n mode: 'exit'\n });\n node.style.webkitTransition = theme.transitions.create('opacity', transitionProps);\n node.style.transition = theme.transitions.create('opacity', transitionProps);\n\n if (onExit) {\n onExit(node);\n }\n });\n var handleExited = normalizedTransitionCallback(onExited);\n return /*#__PURE__*/React.createElement(TransitionComponent, _extends({\n appear: true,\n in: inProp,\n nodeRef: enableStrictModeCompat ? nodeRef : undefined,\n onEnter: handleEnter,\n onEntered: handleEntered,\n onEntering: handleEntering,\n onExit: handleExit,\n onExited: handleExited,\n onExiting: handleExiting,\n timeout: timeout\n }, other), function (state, childProps) {\n return /*#__PURE__*/React.cloneElement(children, _extends({\n style: _extends({\n opacity: 0,\n visibility: state === 'exited' && !inProp ? 'hidden' : undefined\n }, styles[state], style, children.props.style),\n ref: handleRef\n }, childProps));\n });\n});\nprocess.env.NODE_ENV !== \"production\" ? Fade.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the d.ts file and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n\n /**\n * A single child content element.\n */\n children: PropTypes.element,\n\n /**\n * Enable this prop if you encounter 'Function components cannot be given refs',\n * use `unstable_createStrictModeTheme`,\n * and can't forward the ref in the child component.\n */\n disableStrictModeCompat: PropTypes.bool,\n\n /**\n * If `true`, the component will transition in.\n */\n in: PropTypes.bool,\n\n /**\n * @ignore\n */\n onEnter: PropTypes.func,\n\n /**\n * @ignore\n */\n onEntered: PropTypes.func,\n\n /**\n * @ignore\n */\n onEntering: PropTypes.func,\n\n /**\n * @ignore\n */\n onExit: PropTypes.func,\n\n /**\n * @ignore\n */\n onExited: PropTypes.func,\n\n /**\n * @ignore\n */\n onExiting: PropTypes.func,\n\n /**\n * @ignore\n */\n style: PropTypes.object,\n\n /**\n * The duration for the transition, in milliseconds.\n * You may specify a single timeout for all transitions, or individually with an object.\n */\n timeout: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({\n appear: PropTypes.number,\n enter: PropTypes.number,\n exit: PropTypes.number\n })])\n} : void 0;\nexport default Fade;","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nfunction _templateObject4() {\n var data = _taggedTemplateLiteral([\"\\n max-width: 80vw;\\n \"]);\n\n _templateObject4 = function _templateObject4() {\n return data;\n };\n\n return data;\n}\n\nfunction _templateObject3() {\n var data = _taggedTemplateLiteral([\"\\n max-width: 50vw;\\n \"]);\n\n _templateObject3 = function _templateObject3() {\n return data;\n };\n\n return data;\n}\n\nfunction _templateObject2() {\n var data = _taggedTemplateLiteral([\"\\n padding: \", \" \", \";\\n \"]);\n\n _templateObject2 = function _templateObject2() {\n return data;\n };\n\n return data;\n}\n\nfunction _templateObject() {\n var data = _taggedTemplateLiteral([\"\\n padding: \", \";\\n \"]);\n\n _templateObject = function _templateObject() {\n return data;\n };\n\n return data;\n}\n\nfunction _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport styled from 'styled-components';\nimport PropTypes from 'prop-types';\nimport { Modal as MuiModal, Fade as MuiFade } from '@material-ui/core';\nimport { Flex } from \"../layout\";\nimport { BORDER, SPACE, SHADOW } from \"../../constants/style\";\nimport { media } from \"../../helpers/responsive\";\nimport { Spinner } from \"../loaders\";\nimport { themeWrapper } from \"../themes\";\nimport { Heading } from \"../text\";\nvar ModalContainer = styled(Flex).withConfig({\n displayName: \"Modal__ModalContainer\",\n componentId: \"sc-y6lo8c-0\"\n})([\"position:relative;flex-direction:column;padding:\", \" \", \";background:\", \";color:\", \";box-shadow:\", \";border-radius:\", \";overflow-y:auto;box-sizing:border-box;max-height:100%;\", \" \", \" \", \"\"], SPACE.xl, SPACE.lg, function (props) {\n return props.theme.styles.colors.background;\n}, function (props) {\n return props.theme.styles.colors.text;\n}, SHADOW.lg, BORDER.radius.sm, media.css.tablet.and('up')(_templateObject(), function (props) {\n return props.size === 'sm' ? \"\".concat(SPACE.xl, \" \").concat(SPACE.xl) : \"\".concat(SPACE.xxl, \" \").concat(SPACE.xxl);\n}), media.css.mobile.and('down')(_templateObject2(), SPACE.xl, SPACE.xl), function (props) {\n return props.maxWidth ? \"max-width: \".concat(props.maxWidth, \";\") : \"\\n \".concat(media.css.laptop.and('up')(_templateObject3()), \"\\n \").concat(media.css.tablet.only()(_templateObject4()), \"\\n \");\n});\nvar Overlay = styled('div').withConfig({\n displayName: \"Modal__Overlay\",\n componentId: \"sc-y6lo8c-1\"\n})([\"position:absolute;top:0;left:0;bottom:0;right:0;flex-direction:column;align-items:center;justify-content:center;flex:1 0 0;display:flex;background-color:rgba(0,0,0,0.15);\"]);\nvar SpinnerWrapper = styled('div').withConfig({\n displayName: \"Modal__SpinnerWrapper\",\n componentId: \"sc-y6lo8c-2\"\n})([\"background:\", \";padding:36px;border-radius:\", \";box-shadow:\", \";\"], function (props) {\n return props.theme.styles.colors.background;\n}, BORDER.radius.lg, SHADOW.lg);\nvar ModalHeading = styled(Heading).withConfig({\n displayName: \"Modal__ModalHeading\",\n componentId: \"sc-y6lo8c-3\"\n})([\"text-transform:uppercase;letter-spacing:0.04em;\"]);\n\nvar Modal = function Modal(props) {\n var children = props.children,\n heading = props.heading,\n open = props.open,\n isLoading = props.isLoading,\n size = props.size,\n rest = _objectWithoutProperties(props, [\"children\", \"heading\", \"open\", \"isLoading\", \"size\"]);\n\n var sizes = {\n sm: {\n maxWidth: '320px',\n titleFontSize: '20px',\n titleMarginBottom: '8px'\n },\n md: {\n maxWidth: '480px',\n titleFontSize: '24px',\n titleMarginBottom: '16px'\n },\n lg: {\n maxWidth: '1000px',\n titleFontSize: '24px',\n titleMarginBottom: '16px'\n }\n };\n var _sizes$size = sizes[size],\n titleFontSize = _sizes$size.titleFontSize,\n titleMarginBottom = _sizes$size.titleMarginBottom,\n maxWidth = _sizes$size.maxWidth;\n return React.createElement(MuiModal, _extends({\n open: open,\n style: {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center'\n }\n }, rest), React.createElement(MuiFade, {\n \"in\": open\n }, React.createElement(ModalContainer, {\n maxWidth: maxWidth,\n size: size\n }, heading ? React.createElement(ModalHeading, {\n center: true,\n level: 3,\n fontSize: titleFontSize,\n marginBottom: titleMarginBottom\n }, heading) : null, children, isLoading ? React.createElement(Overlay, null, React.createElement(SpinnerWrapper, null, React.createElement(Spinner, null))) : null)));\n};\n\nModal.defaultProps = {\n size: 'md',\n open: true,\n isLoading: false\n};\nModal.propTypes = {\n isLoading: PropTypes.bool,\n open: PropTypes.bool,\n size: PropTypes.oneOf(['sm', 'md', 'lg']),\n onClose: PropTypes.func\n};\n\nvar _default = themeWrapper(Modal);\n\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(ModalContainer, \"ModalContainer\", \"/home/vsts/work/1/s/src/components/overlays/Modal.js\");\n reactHotLoader.register(Overlay, \"Overlay\", \"/home/vsts/work/1/s/src/components/overlays/Modal.js\");\n reactHotLoader.register(SpinnerWrapper, \"SpinnerWrapper\", \"/home/vsts/work/1/s/src/components/overlays/Modal.js\");\n reactHotLoader.register(ModalHeading, \"ModalHeading\", \"/home/vsts/work/1/s/src/components/overlays/Modal.js\");\n reactHotLoader.register(Modal, \"Modal\", \"/home/vsts/work/1/s/src/components/overlays/Modal.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/overlays/Modal.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\n\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== \"undefined\" && arr[Symbol.iterator] || arr[\"@@iterator\"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"] != null) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; }\n\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React, { Fragment, useEffect, useRef, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\nimport { Popper } from '@material-ui/core';\nimport { COLOR, SHADOW, BORDER } from \"../../constants/style.js\";\nvar StyledContent = styled('div').withConfig({\n displayName: \"Popover__StyledContent\",\n componentId: \"sc-1lbuidl-0\"\n})([\"background-color:\", \";color:\", \";padding:20px;box-shadow:\", \";border-radius:\", \";& a,a:visited{color:#fff;text-decoration:none;}\"], COLOR.dark, COLOR.white, SHADOW.soft, BORDER.radius.sm);\n\nvar FallbackAnchor = function FallbackAnchor(props) {\n return React.createElement(\"button\", props, \"Anchor\");\n};\n\nvar Popover = function Popover(props) {\n var children = props.children,\n anchor = props.anchor;\n\n var _useState = useState(null),\n _useState2 = _slicedToArray(_useState, 2),\n anchorEl = _useState2[0],\n setAnchorEl = _useState2[1];\n\n var _useState3 = useState(false),\n _useState4 = _slicedToArray(_useState3, 2),\n open = _useState4[0],\n setOpen = _useState4[1];\n\n var Anchor = anchor ? React.cloneElement(anchor, {\n onClick: function onClick(e) {\n handleAnchorClick(e);\n }\n }) : FallbackAnchor;\n var anchorNode = useRef();\n var popoverNode = useRef();\n\n var handleClick = function handleClick(e) {\n if (popoverNode.current.contains(e.target)) {\n return;\n }\n\n close();\n };\n\n useEffect(function () {\n // console.log('Popover:mount');\n // document.addEventListener('mousedown', handleClick, false);\n // window.addEventListener('popstate', handleNavigation);\n history.onpushstate = function () {\n close();\n };\n\n return function () {// console.log('Popover:unmount');\n // document.removeEventListener('mousedown', handleClick, false);\n // window.removeEventListener('popstate', handleNavigation);\n };\n }, []);\n useEffect(function () {\n if (open) {\n document.addEventListener('mousedown', handleClick, false);\n } else {\n document.removeEventListener('mousedown', handleClick, false);\n }\n\n return function () {\n document.removeEventListener('mousedown', handleClick, false);\n };\n }, [open]);\n\n var handleAnchorClick = function handleAnchorClick(e) {\n setAnchorEl(e.currentTarget);\n setOpen(!open);\n e.preventDefault();\n e.stopPropagation();\n };\n\n var close = function close() {\n setOpen(false);\n };\n\n return React.createElement(Fragment, null, Anchor, React.createElement(Popper, {\n open: open,\n anchorEl: anchorEl,\n ref: popoverNode\n }, React.createElement(StyledContent, null, children ? children : React.createElement(\"div\", null, \"Popover content should be passed as children to the component.\"))));\n}; // NOTE: Super dirty method for being able to close on navigation\n// Should find a better way to do this\n\n\n__signature__(Popover, \"useState{[anchorEl, setAnchorEl](null)}\\nuseState{[open, setOpen](false)}\\nuseRef{anchorNode}\\nuseRef{popoverNode}\\nuseEffect{}\\nuseEffect{}\");\n\n(function (history) {\n var pushState = history.pushState;\n\n history.pushState = function (state) {\n if (typeof history.onpushstate == 'function') {\n history.onpushstate({\n state: state\n });\n }\n\n return pushState.apply(history, arguments);\n };\n})(window.history);\n\nPopover.propTypes = {\n anchor: PropTypes.element\n};\nvar _default = Popover;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledContent, \"StyledContent\", \"/home/vsts/work/1/s/src/components/overlays/Popover.js\");\n reactHotLoader.register(FallbackAnchor, \"FallbackAnchor\", \"/home/vsts/work/1/s/src/components/overlays/Popover.js\");\n reactHotLoader.register(Popover, \"Popover\", \"/home/vsts/work/1/s/src/components/overlays/Popover.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/overlays/Popover.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _slicedToArray from \"@babel/runtime/helpers/esm/slicedToArray\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport _defineProperty from \"@babel/runtime/helpers/esm/defineProperty\";\nimport * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { deepmerge, elementAcceptingRef } from '@material-ui/utils';\nimport { alpha } from '../styles/colorManipulator';\nimport withStyles from '../styles/withStyles';\nimport capitalize from '../utils/capitalize';\nimport Grow from '../Grow';\nimport Popper from '../Popper';\nimport useForkRef from '../utils/useForkRef';\nimport useId from '../utils/unstable_useId';\nimport setRef from '../utils/setRef';\nimport useIsFocusVisible from '../utils/useIsFocusVisible';\nimport useControlled from '../utils/useControlled';\nimport useTheme from '../styles/useTheme';\n\nfunction round(value) {\n return Math.round(value * 1e5) / 1e5;\n}\n\nfunction arrowGenerator() {\n return {\n '&[x-placement*=\"bottom\"] $arrow': {\n top: 0,\n left: 0,\n marginTop: '-0.71em',\n marginLeft: 4,\n marginRight: 4,\n '&::before': {\n transformOrigin: '0 100%'\n }\n },\n '&[x-placement*=\"top\"] $arrow': {\n bottom: 0,\n left: 0,\n marginBottom: '-0.71em',\n marginLeft: 4,\n marginRight: 4,\n '&::before': {\n transformOrigin: '100% 0'\n }\n },\n '&[x-placement*=\"right\"] $arrow': {\n left: 0,\n marginLeft: '-0.71em',\n height: '1em',\n width: '0.71em',\n marginTop: 4,\n marginBottom: 4,\n '&::before': {\n transformOrigin: '100% 100%'\n }\n },\n '&[x-placement*=\"left\"] $arrow': {\n right: 0,\n marginRight: '-0.71em',\n height: '1em',\n width: '0.71em',\n marginTop: 4,\n marginBottom: 4,\n '&::before': {\n transformOrigin: '0 0'\n }\n }\n };\n}\n\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the Popper component. */\n popper: {\n zIndex: theme.zIndex.tooltip,\n pointerEvents: 'none' // disable jss-rtl plugin\n\n },\n\n /* Styles applied to the Popper component if `interactive={true}`. */\n popperInteractive: {\n pointerEvents: 'auto'\n },\n\n /* Styles applied to the Popper component if `arrow={true}`. */\n popperArrow: arrowGenerator(),\n\n /* Styles applied to the tooltip (label wrapper) element. */\n tooltip: {\n backgroundColor: alpha(theme.palette.grey[700], 0.9),\n borderRadius: theme.shape.borderRadius,\n color: theme.palette.common.white,\n fontFamily: theme.typography.fontFamily,\n padding: '4px 8px',\n fontSize: theme.typography.pxToRem(10),\n lineHeight: \"\".concat(round(14 / 10), \"em\"),\n maxWidth: 300,\n wordWrap: 'break-word',\n fontWeight: theme.typography.fontWeightMedium\n },\n\n /* Styles applied to the tooltip (label wrapper) element if `arrow={true}`. */\n tooltipArrow: {\n position: 'relative',\n margin: '0'\n },\n\n /* Styles applied to the arrow element. */\n arrow: {\n overflow: 'hidden',\n position: 'absolute',\n width: '1em',\n height: '0.71em'\n /* = width / sqrt(2) = (length of the hypotenuse) */\n ,\n boxSizing: 'border-box',\n color: alpha(theme.palette.grey[700], 0.9),\n '&::before': {\n content: '\"\"',\n margin: 'auto',\n display: 'block',\n width: '100%',\n height: '100%',\n backgroundColor: 'currentColor',\n transform: 'rotate(45deg)'\n }\n },\n\n /* Styles applied to the tooltip (label wrapper) element if the tooltip is opened by touch. */\n touch: {\n padding: '8px 16px',\n fontSize: theme.typography.pxToRem(14),\n lineHeight: \"\".concat(round(16 / 14), \"em\"),\n fontWeight: theme.typography.fontWeightRegular\n },\n\n /* Styles applied to the tooltip (label wrapper) element if `placement` contains \"left\". */\n tooltipPlacementLeft: _defineProperty({\n transformOrigin: 'right center',\n margin: '0 24px '\n }, theme.breakpoints.up('sm'), {\n margin: '0 14px'\n }),\n\n /* Styles applied to the tooltip (label wrapper) element if `placement` contains \"right\". */\n tooltipPlacementRight: _defineProperty({\n transformOrigin: 'left center',\n margin: '0 24px'\n }, theme.breakpoints.up('sm'), {\n margin: '0 14px'\n }),\n\n /* Styles applied to the tooltip (label wrapper) element if `placement` contains \"top\". */\n tooltipPlacementTop: _defineProperty({\n transformOrigin: 'center bottom',\n margin: '24px 0'\n }, theme.breakpoints.up('sm'), {\n margin: '14px 0'\n }),\n\n /* Styles applied to the tooltip (label wrapper) element if `placement` contains \"bottom\". */\n tooltipPlacementBottom: _defineProperty({\n transformOrigin: 'center top',\n margin: '24px 0'\n }, theme.breakpoints.up('sm'), {\n margin: '14px 0'\n })\n };\n};\nvar hystersisOpen = false;\nvar hystersisTimer = null;\nexport function testReset() {\n hystersisOpen = false;\n clearTimeout(hystersisTimer);\n}\nvar Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(props, ref) {\n var _props$arrow = props.arrow,\n arrow = _props$arrow === void 0 ? false : _props$arrow,\n children = props.children,\n classes = props.classes,\n _props$disableFocusLi = props.disableFocusListener,\n disableFocusListener = _props$disableFocusLi === void 0 ? false : _props$disableFocusLi,\n _props$disableHoverLi = props.disableHoverListener,\n disableHoverListener = _props$disableHoverLi === void 0 ? false : _props$disableHoverLi,\n _props$disableTouchLi = props.disableTouchListener,\n disableTouchListener = _props$disableTouchLi === void 0 ? false : _props$disableTouchLi,\n _props$enterDelay = props.enterDelay,\n enterDelay = _props$enterDelay === void 0 ? 100 : _props$enterDelay,\n _props$enterNextDelay = props.enterNextDelay,\n enterNextDelay = _props$enterNextDelay === void 0 ? 0 : _props$enterNextDelay,\n _props$enterTouchDela = props.enterTouchDelay,\n enterTouchDelay = _props$enterTouchDela === void 0 ? 700 : _props$enterTouchDela,\n idProp = props.id,\n _props$interactive = props.interactive,\n interactive = _props$interactive === void 0 ? false : _props$interactive,\n _props$leaveDelay = props.leaveDelay,\n leaveDelay = _props$leaveDelay === void 0 ? 0 : _props$leaveDelay,\n _props$leaveTouchDela = props.leaveTouchDelay,\n leaveTouchDelay = _props$leaveTouchDela === void 0 ? 1500 : _props$leaveTouchDela,\n onClose = props.onClose,\n onOpen = props.onOpen,\n openProp = props.open,\n _props$placement = props.placement,\n placement = _props$placement === void 0 ? 'bottom' : _props$placement,\n _props$PopperComponen = props.PopperComponent,\n PopperComponent = _props$PopperComponen === void 0 ? Popper : _props$PopperComponen,\n PopperProps = props.PopperProps,\n title = props.title,\n _props$TransitionComp = props.TransitionComponent,\n TransitionComponent = _props$TransitionComp === void 0 ? Grow : _props$TransitionComp,\n TransitionProps = props.TransitionProps,\n other = _objectWithoutProperties(props, [\"arrow\", \"children\", \"classes\", \"disableFocusListener\", \"disableHoverListener\", \"disableTouchListener\", \"enterDelay\", \"enterNextDelay\", \"enterTouchDelay\", \"id\", \"interactive\", \"leaveDelay\", \"leaveTouchDelay\", \"onClose\", \"onOpen\", \"open\", \"placement\", \"PopperComponent\", \"PopperProps\", \"title\", \"TransitionComponent\", \"TransitionProps\"]);\n\n var theme = useTheme();\n\n var _React$useState = React.useState(),\n childNode = _React$useState[0],\n setChildNode = _React$useState[1];\n\n var _React$useState2 = React.useState(null),\n arrowRef = _React$useState2[0],\n setArrowRef = _React$useState2[1];\n\n var ignoreNonTouchEvents = React.useRef(false);\n var closeTimer = React.useRef();\n var enterTimer = React.useRef();\n var leaveTimer = React.useRef();\n var touchTimer = React.useRef();\n\n var _useControlled = useControlled({\n controlled: openProp,\n default: false,\n name: 'Tooltip',\n state: 'open'\n }),\n _useControlled2 = _slicedToArray(_useControlled, 2),\n openState = _useControlled2[0],\n setOpenState = _useControlled2[1];\n\n var open = openState;\n\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n var _React$useRef = React.useRef(openProp !== undefined),\n isControlled = _React$useRef.current; // eslint-disable-next-line react-hooks/rules-of-hooks\n\n\n React.useEffect(function () {\n if (childNode && childNode.disabled && !isControlled && title !== '' && childNode.tagName.toLowerCase() === 'button') {\n console.error(['Material-UI: You are providing a disabled `button` child to the Tooltip component.', 'A disabled element does not fire events.', \"Tooltip needs to listen to the child element's events to display the title.\", '', 'Add a simple wrapper element, such as a `span`.'].join('\\n'));\n }\n }, [title, childNode, isControlled]);\n }\n\n var id = useId(idProp);\n React.useEffect(function () {\n return function () {\n clearTimeout(closeTimer.current);\n clearTimeout(enterTimer.current);\n clearTimeout(leaveTimer.current);\n clearTimeout(touchTimer.current);\n };\n }, []);\n\n var handleOpen = function handleOpen(event) {\n clearTimeout(hystersisTimer);\n hystersisOpen = true; // The mouseover event will trigger for every nested element in the tooltip.\n // We can skip rerendering when the tooltip is already open.\n // We are using the mouseover event instead of the mouseenter event to fix a hide/show issue.\n\n setOpenState(true);\n\n if (onOpen) {\n onOpen(event);\n }\n };\n\n var handleEnter = function handleEnter() {\n var forward = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;\n return function (event) {\n var childrenProps = children.props;\n\n if (event.type === 'mouseover' && childrenProps.onMouseOver && forward) {\n childrenProps.onMouseOver(event);\n }\n\n if (ignoreNonTouchEvents.current && event.type !== 'touchstart') {\n return;\n } // Remove the title ahead of time.\n // We don't want to wait for the next render commit.\n // We would risk displaying two tooltips at the same time (native + this one).\n\n\n if (childNode) {\n childNode.removeAttribute('title');\n }\n\n clearTimeout(enterTimer.current);\n clearTimeout(leaveTimer.current);\n\n if (enterDelay || hystersisOpen && enterNextDelay) {\n event.persist();\n enterTimer.current = setTimeout(function () {\n handleOpen(event);\n }, hystersisOpen ? enterNextDelay : enterDelay);\n } else {\n handleOpen(event);\n }\n };\n };\n\n var _useIsFocusVisible = useIsFocusVisible(),\n isFocusVisible = _useIsFocusVisible.isFocusVisible,\n onBlurVisible = _useIsFocusVisible.onBlurVisible,\n focusVisibleRef = _useIsFocusVisible.ref;\n\n var _React$useState3 = React.useState(false),\n childIsFocusVisible = _React$useState3[0],\n setChildIsFocusVisible = _React$useState3[1];\n\n var handleBlur = function handleBlur() {\n if (childIsFocusVisible) {\n setChildIsFocusVisible(false);\n onBlurVisible();\n }\n };\n\n var handleFocus = function handleFocus() {\n var forward = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;\n return function (event) {\n // Workaround for https://github.com/facebook/react/issues/7769\n // The autoFocus of React might trigger the event before the componentDidMount.\n // We need to account for this eventuality.\n if (!childNode) {\n setChildNode(event.currentTarget);\n }\n\n if (isFocusVisible(event)) {\n setChildIsFocusVisible(true);\n handleEnter()(event);\n }\n\n var childrenProps = children.props;\n\n if (childrenProps.onFocus && forward) {\n childrenProps.onFocus(event);\n }\n };\n };\n\n var handleClose = function handleClose(event) {\n clearTimeout(hystersisTimer);\n hystersisTimer = setTimeout(function () {\n hystersisOpen = false;\n }, 800 + leaveDelay);\n setOpenState(false);\n\n if (onClose) {\n onClose(event);\n }\n\n clearTimeout(closeTimer.current);\n closeTimer.current = setTimeout(function () {\n ignoreNonTouchEvents.current = false;\n }, theme.transitions.duration.shortest);\n };\n\n var handleLeave = function handleLeave() {\n var forward = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;\n return function (event) {\n var childrenProps = children.props;\n\n if (event.type === 'blur') {\n if (childrenProps.onBlur && forward) {\n childrenProps.onBlur(event);\n }\n\n handleBlur();\n }\n\n if (event.type === 'mouseleave' && childrenProps.onMouseLeave && event.currentTarget === childNode) {\n childrenProps.onMouseLeave(event);\n }\n\n clearTimeout(enterTimer.current);\n clearTimeout(leaveTimer.current);\n event.persist();\n leaveTimer.current = setTimeout(function () {\n handleClose(event);\n }, leaveDelay);\n };\n };\n\n var detectTouchStart = function detectTouchStart(event) {\n ignoreNonTouchEvents.current = true;\n var childrenProps = children.props;\n\n if (childrenProps.onTouchStart) {\n childrenProps.onTouchStart(event);\n }\n };\n\n var handleTouchStart = function handleTouchStart(event) {\n detectTouchStart(event);\n clearTimeout(leaveTimer.current);\n clearTimeout(closeTimer.current);\n clearTimeout(touchTimer.current);\n event.persist();\n touchTimer.current = setTimeout(function () {\n handleEnter()(event);\n }, enterTouchDelay);\n };\n\n var handleTouchEnd = function handleTouchEnd(event) {\n if (children.props.onTouchEnd) {\n children.props.onTouchEnd(event);\n }\n\n clearTimeout(touchTimer.current);\n clearTimeout(leaveTimer.current);\n event.persist();\n leaveTimer.current = setTimeout(function () {\n handleClose(event);\n }, leaveTouchDelay);\n };\n\n var handleUseRef = useForkRef(setChildNode, ref);\n var handleFocusRef = useForkRef(focusVisibleRef, handleUseRef); // can be removed once we drop support for non ref forwarding class components\n\n var handleOwnRef = React.useCallback(function (instance) {\n // #StrictMode ready\n setRef(handleFocusRef, ReactDOM.findDOMNode(instance));\n }, [handleFocusRef]);\n var handleRef = useForkRef(children.ref, handleOwnRef); // There is no point in displaying an empty tooltip.\n\n if (title === '') {\n open = false;\n } // For accessibility and SEO concerns, we render the title to the DOM node when\n // the tooltip is hidden. However, we have made a tradeoff when\n // `disableHoverListener` is set. This title logic is disabled.\n // It's allowing us to keep the implementation size minimal.\n // We are open to change the tradeoff.\n\n\n var shouldShowNativeTitle = !open && !disableHoverListener;\n\n var childrenProps = _extends({\n 'aria-describedby': open ? id : null,\n title: shouldShowNativeTitle && typeof title === 'string' ? title : null\n }, other, children.props, {\n className: clsx(other.className, children.props.className),\n onTouchStart: detectTouchStart,\n ref: handleRef\n });\n\n var interactiveWrapperListeners = {};\n\n if (!disableTouchListener) {\n childrenProps.onTouchStart = handleTouchStart;\n childrenProps.onTouchEnd = handleTouchEnd;\n }\n\n if (!disableHoverListener) {\n childrenProps.onMouseOver = handleEnter();\n childrenProps.onMouseLeave = handleLeave();\n\n if (interactive) {\n interactiveWrapperListeners.onMouseOver = handleEnter(false);\n interactiveWrapperListeners.onMouseLeave = handleLeave(false);\n }\n }\n\n if (!disableFocusListener) {\n childrenProps.onFocus = handleFocus();\n childrenProps.onBlur = handleLeave();\n\n if (interactive) {\n interactiveWrapperListeners.onFocus = handleFocus(false);\n interactiveWrapperListeners.onBlur = handleLeave(false);\n }\n }\n\n if (process.env.NODE_ENV !== 'production') {\n if (children.props.title) {\n console.error(['Material-UI: You have provided a `title` prop to the child of .', \"Remove this title prop `\".concat(children.props.title, \"` or the Tooltip component.\")].join('\\n'));\n }\n }\n\n var mergedPopperProps = React.useMemo(function () {\n return deepmerge({\n popperOptions: {\n modifiers: {\n arrow: {\n enabled: Boolean(arrowRef),\n element: arrowRef\n }\n }\n }\n }, PopperProps);\n }, [arrowRef, PopperProps]);\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.cloneElement(children, childrenProps), /*#__PURE__*/React.createElement(PopperComponent, _extends({\n className: clsx(classes.popper, interactive && classes.popperInteractive, arrow && classes.popperArrow),\n placement: placement,\n anchorEl: childNode,\n open: childNode ? open : false,\n id: childrenProps['aria-describedby'],\n transition: true\n }, interactiveWrapperListeners, mergedPopperProps), function (_ref) {\n var placementInner = _ref.placement,\n TransitionPropsInner = _ref.TransitionProps;\n return /*#__PURE__*/React.createElement(TransitionComponent, _extends({\n timeout: theme.transitions.duration.shorter\n }, TransitionPropsInner, TransitionProps), /*#__PURE__*/React.createElement(\"div\", {\n className: clsx(classes.tooltip, classes[\"tooltipPlacement\".concat(capitalize(placementInner.split('-')[0]))], ignoreNonTouchEvents.current && classes.touch, arrow && classes.tooltipArrow)\n }, title, arrow ? /*#__PURE__*/React.createElement(\"span\", {\n className: classes.arrow,\n ref: setArrowRef\n }) : null));\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? Tooltip.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the d.ts file and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n\n /**\n * If `true`, adds an arrow to the tooltip.\n */\n arrow: PropTypes.bool,\n\n /**\n * Tooltip reference element.\n */\n children: elementAcceptingRef.isRequired,\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * Do not respond to focus events.\n */\n disableFocusListener: PropTypes.bool,\n\n /**\n * Do not respond to hover events.\n */\n disableHoverListener: PropTypes.bool,\n\n /**\n * Do not respond to long press touch events.\n */\n disableTouchListener: PropTypes.bool,\n\n /**\n * The number of milliseconds to wait before showing the tooltip.\n * This prop won't impact the enter touch delay (`enterTouchDelay`).\n */\n enterDelay: PropTypes.number,\n\n /**\n * The number of milliseconds to wait before showing the tooltip when one was already recently opened.\n */\n enterNextDelay: PropTypes.number,\n\n /**\n * The number of milliseconds a user must touch the element before showing the tooltip.\n */\n enterTouchDelay: PropTypes.number,\n\n /**\n * This prop is used to help implement the accessibility logic.\n * If you don't provide this prop. It falls back to a randomly generated id.\n */\n id: PropTypes.string,\n\n /**\n * Makes a tooltip interactive, i.e. will not close when the user\n * hovers over the tooltip before the `leaveDelay` is expired.\n */\n interactive: PropTypes.bool,\n\n /**\n * The number of milliseconds to wait before hiding the tooltip.\n * This prop won't impact the leave touch delay (`leaveTouchDelay`).\n */\n leaveDelay: PropTypes.number,\n\n /**\n * The number of milliseconds after the user stops touching an element before hiding the tooltip.\n */\n leaveTouchDelay: PropTypes.number,\n\n /**\n * Callback fired when the component requests to be closed.\n *\n * @param {object} event The event source of the callback.\n */\n onClose: PropTypes.func,\n\n /**\n * Callback fired when the component requests to be open.\n *\n * @param {object} event The event source of the callback.\n */\n onOpen: PropTypes.func,\n\n /**\n * If `true`, the tooltip is shown.\n */\n open: PropTypes.bool,\n\n /**\n * Tooltip placement.\n */\n placement: PropTypes.oneOf(['bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),\n\n /**\n * The component used for the popper.\n */\n PopperComponent: PropTypes.elementType,\n\n /**\n * Props applied to the [`Popper`](/api/popper/) element.\n */\n PopperProps: PropTypes.object,\n\n /**\n * Tooltip title. Zero-length titles string are never displayed.\n */\n title: PropTypes\n /* @typescript-to-proptypes-ignore */\n .node.isRequired,\n\n /**\n * The component used for the transition.\n * [Follow this guide](/components/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.\n */\n TransitionComponent: PropTypes.elementType,\n\n /**\n * Props applied to the [`Transition`](http://reactcommunity.org/react-transition-group/transition#Transition-props) element.\n */\n TransitionProps: PropTypes.object\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiTooltip',\n flip: false\n})(Tooltip);","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport { Tooltip as MuiTooltip } from '@material-ui/core';\n\nvar Tooltip = function Tooltip(props) {\n var anchor = props.anchor,\n title = props.title,\n children = props.children,\n rest = _objectWithoutProperties(props, [\"anchor\", \"title\", \"children\"]);\n\n return React.createElement(MuiTooltip, _extends({\n title: children || title\n }, rest), anchor);\n};\n\nTooltip.propTypes = {\n arrow: PropTypes.bool\n};\nTooltip.defaultProps = {\n arrow: false\n};\nvar _default = Tooltip;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(Tooltip, \"Tooltip\", \"/home/vsts/work/1/s/src/components/overlays/Tooltip.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/overlays/Tooltip.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nexport { default as Popover } from \"./Popover.js\";\nexport { default as Tooltip } from \"./Tooltip.js\";\nexport { default as Modal } from \"./Modal.js\";\nexport { useConfirmation } from \"./ConfirmationService.js\";","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\nimport { Flex } from \"../layout\";\nimport { Icon } from \"../icons\";\nvar CustomPaginationContainer = styled(Flex).withConfig({\n displayName: \"CustomPagination__CustomPaginationContainer\",\n componentId: \"sc-js4s6d-0\"\n})([\"display:flex;flex:1 0 0;justify-content:flex-end;align-items:center;color:#717171;\"]);\nvar Label = styled('span').withConfig({\n displayName: \"CustomPagination__Label\",\n componentId: \"sc-js4s6d-1\"\n})([\"margin-right:auto;\"]);\nvar PageNumber = styled('div').withConfig({\n displayName: \"CustomPagination__PageNumber\",\n componentId: \"sc-js4s6d-2\"\n})([\"padding:0.75rem 1rem;cursor:pointer;border-radius:4px;color:#2A0062;\", \" \", \" \", \" pointer-events:\", \";\"], function (props) {\n return props.current && 'background: #2EE8B9;';\n}, function (props) {\n return props.disabled && 'background: rgba(0, 0, 0, 0.08);';\n}, function (props) {\n return props.disabled && 'color: rgba(0, 0, 0, 0.08);';\n}, function (props) {\n return props.disabled ? \"none\" : \"initial\";\n});\nvar PagesContainer = styled('div').withConfig({\n displayName: \"CustomPagination__PagesContainer\",\n componentId: \"sc-js4s6d-3\"\n})([\"display:flex;\"]);\nvar ThreeDots = styled('span').withConfig({\n displayName: \"CustomPagination__ThreeDots\",\n componentId: \"sc-js4s6d-4\"\n})([\"text-align:center;padding:0.75rem 1rem;color:#2A0062;\", \"\"], function (props) {\n return props.disabled && 'color: rgba(0, 0, 0, 0.08);';\n});\nvar ArrowIcon = styled(Icon).withConfig({\n displayName: \"CustomPagination__ArrowIcon\",\n componentId: \"sc-js4s6d-5\"\n})([\"cursor:pointer;margin-right:\", \";margin-left:\", \";pointer-events:\", \";color:\", \";\"], function (props) {\n return props.name === \"back\" ? \"0.5rem\" : \"0\";\n}, function (props) {\n return props.name === \"forward\" ? \"0.5rem\" : \"0\";\n}, function (props) {\n return props.disabled ? \"none\" : \"initial\";\n}, function (props) {\n return props.disabled ? \"rgba(0, 0, 0, 0.08)\" : \"2A0062\";\n});\n\nvar CustomPagination = function CustomPagination(props) {\n var currentPage = props.currentPage,\n totalPages = props.totalPages,\n currentPageItems = props.currentPageItems,\n totalItems = props.totalItems,\n setCurrentPage = props.setCurrentPage,\n disabled = props.disabled,\n renderShowingString = props.renderShowingString,\n rest = _objectWithoutProperties(props, [\"currentPage\", \"totalPages\", \"currentPageItems\", \"totalItems\", \"setCurrentPage\", \"disabled\", \"renderShowingString\"]);\n\n var handleChange = function handleChange(page) {\n setCurrentPage(page);\n };\n\n var generatePageButtons = function generatePageButtons() {\n if (currentPage <= 4) {\n return React.createElement(PagesContainer, null, Array.from(Array(5), function (e, i) {\n return React.createElement(PageNumber, {\n onClick: function onClick() {\n return handleChange(i + 1);\n },\n current: currentPage == i + 1,\n key: i + 1,\n disabled: disabled\n }, i + 1);\n }), React.createElement(ThreeDots, null, \"...\"), React.createElement(PageNumber, {\n onClick: function onClick() {\n return handleChange(totalPages);\n },\n current: currentPage == totalPages,\n key: totalPages,\n disabled: disabled\n }, totalPages));\n } else if (currentPage >= totalPages - 3) {\n return React.createElement(PagesContainer, null, React.createElement(PageNumber, {\n onClick: function onClick() {\n return handleChange(1);\n },\n current: currentPage == 1,\n key: 1,\n disabled: disabled\n }, 1), React.createElement(ThreeDots, null, \"...\"), Array.from(Array(5), function (e, i) {\n return React.createElement(PageNumber, {\n onClick: function onClick() {\n return handleChange(totalPages - 4 + i);\n },\n current: currentPage == totalPages - 4 + i,\n key: totalPages - 4 + i,\n disabled: disabled\n }, totalPages - 4 + i);\n }));\n }\n\n return React.createElement(PagesContainer, null, React.createElement(PageNumber, {\n onClick: function onClick() {\n return handleChange(1);\n },\n current: currentPage == 1,\n key: 1,\n disabled: disabled\n }, 1), React.createElement(ThreeDots, null, \"...\"), Array.from(Array(3), function (e, i) {\n return React.createElement(PageNumber, {\n onClick: function onClick() {\n return handleChange(currentPage + i - 1);\n },\n current: currentPage == currentPage + i - 1,\n key: currentPage + i - 1,\n disabled: disabled\n }, currentPage + i - 1);\n }), React.createElement(ThreeDots, null, \"...\"), React.createElement(PageNumber, {\n onClick: function onClick() {\n return handleChange(totalPages);\n },\n current: currentPage == totalPages,\n key: totalPages,\n disabled: disabled\n }, totalPages));\n };\n\n return React.createElement(CustomPaginationContainer, rest, React.createElement(Label, null, renderShowingString(currentPageItems, totalItems)), React.createElement(ArrowIcon, {\n name: \"back\",\n onClick: function onClick() {\n return handleChange(currentPage - 1);\n },\n disabled: currentPage <= 1 || disabled\n }), totalPages > 9 ? generatePageButtons() : Array.from(Array(totalPages), function (e, i) {\n return React.createElement(PageNumber, {\n onClick: function onClick() {\n return handleChange(i + 1);\n },\n current: currentPage == i + 1,\n key: i,\n disabled: disabled\n }, i + 1);\n }), React.createElement(ArrowIcon, {\n name: \"forward\",\n onClick: function onClick() {\n return handleChange(currentPage + 1);\n },\n disabled: currentPage >= totalPages || disabled\n }));\n};\n\nCustomPagination.defaultProps = {\n disabled: false,\n hideNextButton: false,\n hidePrevButton: false,\n showFirstButton: false,\n showLastButton: false\n};\nCustomPagination.propTypes = {\n disabled: PropTypes.bool,\n hideNextButton: PropTypes.bool,\n hidePrevButton: PropTypes.bool,\n showFirstButton: PropTypes.bool,\n showLastButton: PropTypes.bool,\n totalItems: PropTypes.number.isRequired,\n totalPages: PropTypes.number.isRequired,\n currentPage: PropTypes.number.isRequired,\n currentPageItems: PropTypes.number.isRequired\n};\nvar _default = CustomPagination;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(CustomPaginationContainer, \"CustomPaginationContainer\", \"/home/vsts/work/1/s/src/components/pagination/CustomPagination.js\");\n reactHotLoader.register(Label, \"Label\", \"/home/vsts/work/1/s/src/components/pagination/CustomPagination.js\");\n reactHotLoader.register(PageNumber, \"PageNumber\", \"/home/vsts/work/1/s/src/components/pagination/CustomPagination.js\");\n reactHotLoader.register(PagesContainer, \"PagesContainer\", \"/home/vsts/work/1/s/src/components/pagination/CustomPagination.js\");\n reactHotLoader.register(ThreeDots, \"ThreeDots\", \"/home/vsts/work/1/s/src/components/pagination/CustomPagination.js\");\n reactHotLoader.register(ArrowIcon, \"ArrowIcon\", \"/home/vsts/work/1/s/src/components/pagination/CustomPagination.js\");\n reactHotLoader.register(CustomPagination, \"CustomPagination\", \"/home/vsts/work/1/s/src/components/pagination/CustomPagination.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/pagination/CustomPagination.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","import * as React from 'react';\nimport { createSvgIcon } from '@material-ui/core/utils';\n/**\r\n * @ignore - internal component.\r\n */\n\nexport default createSvgIcon( /*#__PURE__*/React.createElement(\"path\", {\n d: \"M18.41 16.59L13.82 12l4.59-4.59L17 6l-6 6 6 6zM6 6h2v12H6z\"\n}), 'FirstPage');","import * as React from 'react';\nimport { createSvgIcon } from '@material-ui/core/utils';\n/**\r\n * @ignore - internal component.\r\n */\n\nexport default createSvgIcon( /*#__PURE__*/React.createElement(\"path\", {\n d: \"M5.59 7.41L10.18 12l-4.59 4.59L7 18l6-6-6-6zM16 6h2v12h-2z\"\n}), 'LastPage');","import * as React from 'react';\nimport { createSvgIcon } from '@material-ui/core/utils';\n/**\r\n * @ignore - internal component.\r\n */\n\nexport default createSvgIcon( /*#__PURE__*/React.createElement(\"path\", {\n d: \"M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z\"\n}), 'NavigateBefore');","import * as React from 'react';\nimport { createSvgIcon } from '@material-ui/core/utils';\n/**\r\n * @ignore - internal component.\r\n */\n\nexport default createSvgIcon( /*#__PURE__*/React.createElement(\"path\", {\n d: \"M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z\"\n}), 'NavigateNext');","import _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { alpha, useTheme, withStyles } from '@material-ui/core/styles';\nimport ButtonBase from '@material-ui/core/ButtonBase';\nimport FirstPageIcon from '../internal/svg-icons/FirstPage';\nimport LastPageIcon from '../internal/svg-icons/LastPage';\nimport NavigateBeforeIcon from '../internal/svg-icons/NavigateBefore';\nimport NavigateNextIcon from '../internal/svg-icons/NavigateNext';\nimport { capitalize } from '@material-ui/core/utils';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: _extends({}, theme.typography.body2, {\n borderRadius: 32 / 2,\n textAlign: 'center',\n boxSizing: 'border-box',\n minWidth: 32,\n height: 32,\n padding: '0 6px',\n margin: '0 3px',\n color: theme.palette.text.primary\n }),\n\n /* Styles applied to the root element if `type=\"page\"`. */\n page: {\n transition: theme.transitions.create(['color', 'background-color'], {\n duration: theme.transitions.duration.short\n }),\n '&:hover': {\n backgroundColor: theme.palette.action.hover,\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n },\n '&$focusVisible': {\n backgroundColor: theme.palette.action.focus\n },\n '&$selected': {\n backgroundColor: theme.palette.action.selected,\n '&:hover, &$focusVisible': {\n backgroundColor: alpha(theme.palette.action.selected, theme.palette.action.selectedOpacity + theme.palette.action.hoverOpacity),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: theme.palette.action.selected\n }\n },\n '&$disabled': {\n opacity: 1,\n color: theme.palette.action.disabled,\n backgroundColor: theme.palette.action.selected\n }\n },\n '&$disabled': {\n opacity: theme.palette.action.disabledOpacity\n }\n },\n\n /* Styles applied applied to the root element if `size=\"small\"`. */\n sizeSmall: {\n minWidth: 26,\n height: 26,\n borderRadius: 26 / 2,\n margin: '0 1px',\n padding: '0 4px',\n '& $icon': {\n fontSize: theme.typography.pxToRem(18)\n }\n },\n\n /* Styles applied applied to the root element if `size=\"large\"`. */\n sizeLarge: {\n minWidth: 40,\n height: 40,\n borderRadius: 40 / 2,\n padding: '0 10px',\n fontSize: theme.typography.pxToRem(15),\n '& $icon': {\n fontSize: theme.typography.pxToRem(22)\n }\n },\n\n /* Styles applied to the root element if `variant=\"text\"` and `color=\"primary\"`. */\n textPrimary: {\n '&$selected': {\n color: theme.palette.primary.contrastText,\n backgroundColor: theme.palette.primary.main,\n '&:hover, &$focusVisible': {\n backgroundColor: theme.palette.primary.dark,\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: theme.palette.primary.main\n }\n },\n '&$disabled': {\n color: theme.palette.action.disabled\n }\n }\n },\n\n /* Styles applied to the root element if `variant=\"text\"` and `color=\"secondary\"`. */\n textSecondary: {\n '&$selected': {\n color: theme.palette.secondary.contrastText,\n backgroundColor: theme.palette.secondary.main,\n '&:hover, &$focusVisible': {\n backgroundColor: theme.palette.secondary.dark,\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: theme.palette.secondary.main\n }\n },\n '&$disabled': {\n color: theme.palette.action.disabled\n }\n }\n },\n\n /* Styles applied to the root element if `outlined=\"true\"`. */\n outlined: {\n border: \"1px solid \".concat(theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)'),\n '&$selected': {\n '&$disabled': {\n border: \"1px solid \".concat(theme.palette.action.disabledBackground)\n }\n }\n },\n\n /* Styles applied to the root element if `variant=\"outlined\"` and `color=\"primary\"`. */\n outlinedPrimary: {\n '&$selected': {\n color: theme.palette.primary.main,\n border: \"1px solid \".concat(alpha(theme.palette.primary.main, 0.5)),\n backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.activatedOpacity),\n '&:hover, &$focusVisible': {\n backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.activatedOpacity + theme.palette.action.hoverOpacity),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n },\n '&$disabled': {\n color: theme.palette.action.disabled\n }\n }\n },\n\n /* Styles applied to the root element if `variant=\"outlined\"` and `color=\"secondary\"`. */\n outlinedSecondary: {\n '&$selected': {\n color: theme.palette.secondary.main,\n border: \"1px solid \".concat(alpha(theme.palette.secondary.main, 0.5)),\n backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.activatedOpacity),\n '&:hover, &$focusVisible': {\n backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.activatedOpacity + theme.palette.action.hoverOpacity),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n },\n '&$disabled': {\n color: theme.palette.action.disabled\n }\n }\n },\n\n /* Styles applied to the root element if `rounded=\"true\"`. */\n rounded: {\n borderRadius: theme.shape.borderRadius\n },\n\n /* Styles applied to the root element if `type=\"start-ellipsis\"` or `type=\"end-ellipsis\"`. */\n ellipsis: {\n height: 'auto',\n '&$disabled': {\n opacity: theme.palette.action.disabledOpacity\n }\n },\n\n /* Pseudo-class applied to the root element if keyboard focused. */\n focusVisible: {},\n\n /* Pseudo-class applied to the root element if `disabled={true}`. */\n disabled: {},\n\n /* Pseudo-class applied to the root element if `selected={true}`. */\n selected: {},\n\n /* Styles applied to the icon element. */\n icon: {\n fontSize: theme.typography.pxToRem(20),\n margin: '0 -8px'\n }\n };\n};\nvar PaginationItem = /*#__PURE__*/React.forwardRef(function PaginationItem(props, ref) {\n var classes = props.classes,\n className = props.className,\n _props$color = props.color,\n color = _props$color === void 0 ? 'standard' : _props$color,\n component = props.component,\n _props$disabled = props.disabled,\n disabled = _props$disabled === void 0 ? false : _props$disabled,\n page = props.page,\n _props$selected = props.selected,\n selected = _props$selected === void 0 ? false : _props$selected,\n _props$shape = props.shape,\n shape = _props$shape === void 0 ? 'round' : _props$shape,\n _props$size = props.size,\n size = _props$size === void 0 ? 'medium' : _props$size,\n _props$type = props.type,\n type = _props$type === void 0 ? 'page' : _props$type,\n _props$variant = props.variant,\n variant = _props$variant === void 0 ? 'text' : _props$variant,\n other = _objectWithoutProperties(props, [\"classes\", \"className\", \"color\", \"component\", \"disabled\", \"page\", \"selected\", \"shape\", \"size\", \"type\", \"variant\"]);\n\n var theme = useTheme();\n var normalizedIcons = theme.direction === 'rtl' ? {\n previous: NavigateNextIcon,\n next: NavigateBeforeIcon,\n last: FirstPageIcon,\n first: LastPageIcon\n } : {\n previous: NavigateBeforeIcon,\n next: NavigateNextIcon,\n first: FirstPageIcon,\n last: LastPageIcon\n };\n var Icon = normalizedIcons[type];\n return type === 'start-ellipsis' || type === 'end-ellipsis' ? /*#__PURE__*/React.createElement(\"div\", {\n ref: ref,\n className: clsx(classes.root, classes.ellipsis, disabled && classes.disabled, size !== 'medium' && classes[\"size\".concat(capitalize(size))])\n }, \"\\u2026\") : /*#__PURE__*/React.createElement(ButtonBase, _extends({\n ref: ref,\n component: component,\n disabled: disabled,\n focusVisibleClassName: classes.focusVisible,\n className: clsx(classes.root, classes.page, classes[variant], classes[shape], className, color !== 'standard' && classes[\"\".concat(variant).concat(capitalize(color))], disabled && classes.disabled, selected && classes.selected, size !== 'medium' && classes[\"size\".concat(capitalize(size))])\n }, other), type === 'page' && page, Icon ? /*#__PURE__*/React.createElement(Icon, {\n className: classes.icon\n }) : null);\n});\nprocess.env.NODE_ENV !== \"production\" ? PaginationItem.propTypes = {\n /**\r\n * @ignore\r\n */\n classes: PropTypes.object.isRequired,\n\n /**\r\n * @ignore\r\n */\n className: PropTypes.string,\n\n /**\r\n * The active color.\r\n */\n color: PropTypes.oneOf(['standard', 'primary', 'secondary']),\n\n /**\r\n * The component used for the root node.\r\n * Either a string to use a HTML element or a component.\r\n */\n component: PropTypes\n /* @typescript-to-proptypes-ignore */\n .elementType,\n\n /**\r\n * If `true`, the item will be disabled.\r\n */\n disabled: PropTypes.bool,\n\n /**\r\n * The current page number.\r\n */\n page: PropTypes.number,\n\n /**\r\n * If `true` the pagination item is selected.\r\n */\n selected: PropTypes.bool,\n\n /**\r\n * The shape of the pagination item.\r\n */\n shape: PropTypes.oneOf(['round', 'rounded']),\n\n /**\r\n * The size of the pagination item.\r\n */\n size: PropTypes.oneOf(['small', 'medium', 'large']),\n\n /**\r\n * The type of pagination item.\r\n */\n type: PropTypes.oneOf(['page', 'first', 'last', 'next', 'previous', 'start-ellipsis', 'end-ellipsis']),\n\n /**\r\n * The pagination item variant.\r\n */\n variant: PropTypes.oneOf(['text', 'outlined'])\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiPaginationItem'\n})(PaginationItem);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { withStyles } from '@material-ui/core/styles';\nimport usePagination from './usePagination';\nimport PaginationItem from '../PaginationItem';\nexport var styles = {\n /* Styles applied to the root element. */\n root: {},\n\n /* Styles applied to the ul element. */\n ul: {\n display: 'flex',\n flexWrap: 'wrap',\n alignItems: 'center',\n padding: 0,\n margin: 0,\n listStyle: 'none'\n }\n};\n\nfunction defaultGetAriaLabel(type, page, selected) {\n if (type === 'page') {\n return \"\".concat(selected ? '' : 'Go to ', \"page \").concat(page);\n }\n\n return \"Go to \".concat(type, \" page\");\n}\n\nvar Pagination = /*#__PURE__*/React.forwardRef(function Pagination(props, ref) {\n var boundaryCount = props.boundaryCount,\n classes = props.classes,\n className = props.className,\n _props$color = props.color,\n color = _props$color === void 0 ? 'standard' : _props$color,\n count = props.count,\n defaultPage = props.defaultPage,\n disabled = props.disabled,\n _props$getItemAriaLab = props.getItemAriaLabel,\n getItemAriaLabel = _props$getItemAriaLab === void 0 ? defaultGetAriaLabel : _props$getItemAriaLab,\n hideNextButton = props.hideNextButton,\n hidePrevButton = props.hidePrevButton,\n onChange = props.onChange,\n page = props.page,\n _props$renderItem = props.renderItem,\n renderItem = _props$renderItem === void 0 ? function (item) {\n return /*#__PURE__*/React.createElement(PaginationItem, item);\n } : _props$renderItem,\n _props$shape = props.shape,\n shape = _props$shape === void 0 ? 'round' : _props$shape,\n showFirstButton = props.showFirstButton,\n showLastButton = props.showLastButton,\n siblingCount = props.siblingCount,\n _props$size = props.size,\n size = _props$size === void 0 ? 'medium' : _props$size,\n _props$variant = props.variant,\n variant = _props$variant === void 0 ? 'text' : _props$variant,\n other = _objectWithoutProperties(props, [\"boundaryCount\", \"classes\", \"className\", \"color\", \"count\", \"defaultPage\", \"disabled\", \"getItemAriaLabel\", \"hideNextButton\", \"hidePrevButton\", \"onChange\", \"page\", \"renderItem\", \"shape\", \"showFirstButton\", \"showLastButton\", \"siblingCount\", \"size\", \"variant\"]);\n\n var _usePagination = usePagination(_extends({}, props, {\n componentName: 'Pagination'\n })),\n items = _usePagination.items;\n\n return /*#__PURE__*/React.createElement(\"nav\", _extends({\n \"aria-label\": \"pagination navigation\",\n className: clsx(classes.root, className),\n ref: ref\n }, other), /*#__PURE__*/React.createElement(\"ul\", {\n className: classes.ul\n }, items.map(function (item, index) {\n return /*#__PURE__*/React.createElement(\"li\", {\n key: index\n }, renderItem(_extends({}, item, {\n color: color,\n 'aria-label': getItemAriaLabel(item.type, item.page, item.selected),\n shape: shape,\n size: size,\n variant: variant\n })));\n })));\n}); // @default tags synced with default values from usePagination\n\nprocess.env.NODE_ENV !== \"production\" ? Pagination.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the d.ts file and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n\n /**\r\n * Number of always visible pages at the beginning and end.\r\n * @default 1\r\n */\n boundaryCount: PropTypes.number,\n\n /**\r\n * Override or extend the styles applied to the component.\r\n * See [CSS API](#css) below for more details.\r\n */\n classes: PropTypes.object,\n\n /**\r\n * @ignore\r\n */\n className: PropTypes.string,\n\n /**\r\n * The active color.\r\n */\n color: PropTypes.oneOf(['primary', 'secondary', 'standard']),\n\n /**\r\n * The total number of pages.\r\n * @default 1\r\n */\n count: PropTypes.number,\n\n /**\r\n * The page selected by default when the component is uncontrolled.\r\n * @default 1\r\n */\n defaultPage: PropTypes.number,\n\n /**\r\n * If `true`, the pagination component will be disabled.\r\n * @default false\r\n */\n disabled: PropTypes.bool,\n\n /**\r\n * Accepts a function which returns a string value that provides a user-friendly name for the current page.\r\n *\r\n * For localization purposes, you can use the provided [translations](/guides/localization/).\r\n *\r\n * @param {string} type The link or button type to format ('page' | 'first' | 'last' | 'next' | 'previous'). Defaults to 'page'.\r\n * @param {number} page The page number to format.\r\n * @param {bool} selected If true, the current page is selected.\r\n * @returns {string}\r\n */\n getItemAriaLabel: PropTypes.func,\n\n /**\r\n * If `true`, hide the next-page button.\r\n * @default false\r\n */\n hideNextButton: PropTypes.bool,\n\n /**\r\n * If `true`, hide the previous-page button.\r\n * @default false\r\n */\n hidePrevButton: PropTypes.bool,\n\n /**\r\n * Callback fired when the page is changed.\r\n *\r\n * @param {object} event The event source of the callback.\r\n * @param {number} page The page selected.\r\n */\n onChange: PropTypes.func,\n\n /**\r\n * The current page.\r\n */\n page: PropTypes.number,\n\n /**\r\n * Render the item.\r\n *\r\n * @param {PaginationRenderItemParams} params The props to spread on a PaginationItem.\r\n * @returns {ReactNode}\r\n */\n renderItem: PropTypes.func,\n\n /**\r\n * The shape of the pagination items.\r\n */\n shape: PropTypes.oneOf(['round', 'rounded']),\n\n /**\r\n * If `true`, show the first-page button.\r\n * @default false\r\n */\n showFirstButton: PropTypes.bool,\n\n /**\r\n * If `true`, show the last-page button.\r\n * @default false\r\n */\n showLastButton: PropTypes.bool,\n\n /**\r\n * Number of always visible pages before and after the current page.\r\n * @default 1\r\n */\n siblingCount: PropTypes.number,\n\n /**\r\n * The size of the pagination component.\r\n */\n size: PropTypes.oneOf(['large', 'medium', 'small']),\n\n /**\r\n * The variant to use.\r\n */\n variant: PropTypes.oneOf(['outlined', 'text'])\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiPagination'\n})(Pagination);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _toConsumableArray from \"@babel/runtime/helpers/esm/toConsumableArray\";\nimport _slicedToArray from \"@babel/runtime/helpers/esm/slicedToArray\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport { useControlled } from '@material-ui/core/utils';\nexport default function usePagination() {\n var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n\n // keep default values in sync with @default tags in Pagination.propTypes\n var _props$boundaryCount = props.boundaryCount,\n boundaryCount = _props$boundaryCount === void 0 ? 1 : _props$boundaryCount,\n _props$componentName = props.componentName,\n componentName = _props$componentName === void 0 ? 'usePagination' : _props$componentName,\n _props$count = props.count,\n count = _props$count === void 0 ? 1 : _props$count,\n _props$defaultPage = props.defaultPage,\n defaultPage = _props$defaultPage === void 0 ? 1 : _props$defaultPage,\n _props$disabled = props.disabled,\n disabled = _props$disabled === void 0 ? false : _props$disabled,\n _props$hideNextButton = props.hideNextButton,\n hideNextButton = _props$hideNextButton === void 0 ? false : _props$hideNextButton,\n _props$hidePrevButton = props.hidePrevButton,\n hidePrevButton = _props$hidePrevButton === void 0 ? false : _props$hidePrevButton,\n handleChange = props.onChange,\n pageProp = props.page,\n _props$showFirstButto = props.showFirstButton,\n showFirstButton = _props$showFirstButto === void 0 ? false : _props$showFirstButto,\n _props$showLastButton = props.showLastButton,\n showLastButton = _props$showLastButton === void 0 ? false : _props$showLastButton,\n _props$siblingCount = props.siblingCount,\n siblingCount = _props$siblingCount === void 0 ? 1 : _props$siblingCount,\n other = _objectWithoutProperties(props, [\"boundaryCount\", \"componentName\", \"count\", \"defaultPage\", \"disabled\", \"hideNextButton\", \"hidePrevButton\", \"onChange\", \"page\", \"showFirstButton\", \"showLastButton\", \"siblingCount\"]);\n\n var _useControlled = useControlled({\n controlled: pageProp,\n default: defaultPage,\n name: componentName,\n state: 'page'\n }),\n _useControlled2 = _slicedToArray(_useControlled, 2),\n page = _useControlled2[0],\n setPageState = _useControlled2[1];\n\n var handleClick = function handleClick(event, value) {\n if (!pageProp) {\n setPageState(value);\n }\n\n if (handleChange) {\n handleChange(event, value);\n }\n }; // https://dev.to/namirsab/comment/2050\n\n\n var range = function range(start, end) {\n var length = end - start + 1;\n return Array.from({\n length: length\n }, function (_, i) {\n return start + i;\n });\n };\n\n var startPages = range(1, Math.min(boundaryCount, count));\n var endPages = range(Math.max(count - boundaryCount + 1, boundaryCount + 1), count);\n var siblingsStart = Math.max(Math.min( // Natural start\n page - siblingCount, // Lower boundary when page is high\n count - boundaryCount - siblingCount * 2 - 1), // Greater than startPages\n boundaryCount + 2);\n var siblingsEnd = Math.min(Math.max( // Natural end\n page + siblingCount, // Upper boundary when page is low\n boundaryCount + siblingCount * 2 + 2), // Less than endPages\n endPages[0] - 2); // Basic list of items to render\n // e.g. itemList = ['first', 'previous', 1, 'ellipsis', 4, 5, 6, 'ellipsis', 10, 'next', 'last']\n\n var itemList = [].concat(_toConsumableArray(showFirstButton ? ['first'] : []), _toConsumableArray(hidePrevButton ? [] : ['previous']), _toConsumableArray(startPages), _toConsumableArray(siblingsStart > boundaryCount + 2 ? ['start-ellipsis'] : boundaryCount + 1 < count - boundaryCount ? [boundaryCount + 1] : []), _toConsumableArray(range(siblingsStart, siblingsEnd)), _toConsumableArray(siblingsEnd < count - boundaryCount - 1 ? ['end-ellipsis'] : count - boundaryCount > boundaryCount ? [count - boundaryCount] : []), _toConsumableArray(endPages), _toConsumableArray(hideNextButton ? [] : ['next']), _toConsumableArray(showLastButton ? ['last'] : [])); // Map the button type to its page number\n\n var buttonPage = function buttonPage(type) {\n switch (type) {\n case 'first':\n return 1;\n\n case 'previous':\n return page - 1;\n\n case 'next':\n return page + 1;\n\n case 'last':\n return count;\n\n default:\n return null;\n }\n }; // Convert the basic item list to PaginationItem props objects\n\n\n var items = itemList.map(function (item) {\n return typeof item === 'number' ? {\n onClick: function onClick(event) {\n handleClick(event, item);\n },\n type: 'page',\n page: item,\n selected: item === page,\n disabled: disabled,\n 'aria-current': item === page ? 'true' : undefined\n } : {\n onClick: function onClick(event) {\n handleClick(event, buttonPage(item));\n },\n type: item,\n page: buttonPage(item),\n selected: false,\n disabled: disabled || item.indexOf('ellipsis') === -1 && (item === 'next' || item === 'last' ? page >= count : page <= 1)\n };\n });\n return _extends({\n items: items\n }, other);\n}","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nfunction _templateObject() {\n var data = _taggedTemplateLiteral([\"\\n flex-direction: column;\\n\\n \", \" {\\n justify-content: center;\\n margin-bottom: \", \";\\n flex: 1 0 auto;\\n }\\n \"]);\n\n _templateObject = function _templateObject() {\n return data;\n };\n\n return data;\n}\n\nfunction _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport styled from 'styled-components';\nimport PropTypes from 'prop-types';\nimport MuiPagination from '@material-ui/lab/Pagination';\nimport { Flex } from \"../layout\";\nimport { media } from \"../../helpers/responsive\";\nimport { SPACE } from \"../../constants/style\";\nvar PaginationContainer = styled(Flex).withConfig({\n displayName: \"Pagination__PaginationContainer\",\n componentId: \"sc-4blvlb-0\"\n})([\"flex-direction:row;\", \"{align-items:center;flex:1 0 0;}\", \"\"], Flex, media.css.mobile.and('down')(_templateObject(), Flex, SPACE.lg));\n\nvar Pagination = function Pagination(props) {\n var currentPage = props.currentPage,\n totalPages = props.totalPages,\n totalItems = props.totalItems,\n currentPageItems = props.currentPageItems,\n setCurrentPage = props.setCurrentPage,\n renderShowingString = props.renderShowingString,\n MuiPaginationProps = props.MuiPaginationProps,\n disabled = props.disabled,\n hideNextButton = props.hideNextButton,\n hidePrevButton = props.hidePrevButton,\n showFirstButton = props.showFirstButton,\n showLastButton = props.showLastButton,\n rest = _objectWithoutProperties(props, [\"currentPage\", \"totalPages\", \"totalItems\", \"currentPageItems\", \"setCurrentPage\", \"renderShowingString\", \"MuiPaginationProps\", \"disabled\", \"hideNextButton\", \"hidePrevButton\", \"showFirstButton\", \"showLastButton\"]);\n\n var handleChange = function handleChange(e, page) {\n setCurrentPage(page);\n };\n\n return React.createElement(PaginationContainer, rest, typeof renderShowingString === 'function' ? React.createElement(Flex, {\n justifyContent: \"flex-start\"\n }, renderShowingString(currentPageItems, totalItems)) : null, React.createElement(Flex, {\n justifyContent: \"flex-end\"\n }, React.createElement(MuiPagination, _extends({\n disabled: disabled,\n hideNextButton: hideNextButton,\n hidePrevButton: hidePrevButton,\n showFirstButton: showFirstButton,\n showLastButton: showLastButton,\n count: totalPages,\n page: currentPage,\n onChange: handleChange\n }, MuiPaginationProps || {}))));\n};\n\nPagination.defaultProps = {\n disabled: false,\n hideNextButton: false,\n hidePrevButton: false,\n showFirstButton: false,\n showLastButton: false,\n renderShowingString: function renderShowingString(currentPageItems, totalItems) {\n return (// Keeping the default simple and language neutral\n \"\".concat(currentPageItems, \" / \").concat(totalItems)\n );\n }\n};\nPagination.propTypes = {\n disabled: PropTypes.bool,\n hideNextButton: PropTypes.bool,\n hidePrevButton: PropTypes.bool,\n showFirstButton: PropTypes.bool,\n showLastButton: PropTypes.bool,\n totalItems: PropTypes.number.isRequired,\n totalPages: PropTypes.number.isRequired,\n currentPage: PropTypes.number.isRequired,\n currentPageItems: PropTypes.number.isRequired,\n renderShowingString: PropTypes.func\n};\nvar _default = Pagination;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(PaginationContainer, \"PaginationContainer\", \"/home/vsts/work/1/s/src/components/pagination/Pagination.js\");\n reactHotLoader.register(Pagination, \"Pagination\", \"/home/vsts/work/1/s/src/components/pagination/Pagination.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/pagination/Pagination.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","function _typeof(obj) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && \"function\" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }, _typeof(obj); }\n\n(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\n\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }\n\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\n\nfunction _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) { return call; } else if (call !== void 0) { throw new TypeError(\"Derived constructors may only return object or undefined\"); } return _assertThisInitialized(self); }\n\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\n\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\n\nfunction _inherits(subClass, superClass) { if (typeof superClass !== \"function\" && superClass !== null) { throw new TypeError(\"Super expression must either be null or a function\"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, \"prototype\", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }\n\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React, { Component } from 'react';\nimport { createGlobalStyle } from 'styled-components';\n\nvar FocusOutlines = /*#__PURE__*/function (_Component) {\n _inherits(FocusOutlines, _Component);\n\n function FocusOutlines() {\n var _getPrototypeOf2;\n\n var _this;\n\n _classCallCheck(this, FocusOutlines);\n\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n _this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(FocusOutlines)).call.apply(_getPrototypeOf2, [this].concat(args)));\n\n _defineProperty(_assertThisInitialized(_this), \"state\", {\n disableFocusOutlines: false\n });\n\n _defineProperty(_assertThisInitialized(_this), \"disableFocusOutlines\", function () {\n // Mousedown will disable focus outlines\n if (_this.state.disableFocusOutlines === false) {\n _this.setState({\n disableFocusOutlines: true\n });\n }\n });\n\n _defineProperty(_assertThisInitialized(_this), \"enableFocusOutlines\", function (e) {\n // Pressing tab will enable focus outlines\n if (_this.state.disableFocusOutlines === true && e.which === 9) {\n _this.setState({\n disableFocusOutlines: false\n });\n }\n });\n\n return _this;\n }\n\n _createClass(FocusOutlines, [{\n key: \"componentDidMount\",\n value: function componentDidMount() {\n window.addEventListener('keydown', this.enableFocusOutlines);\n window.addEventListener('mousedown', this.disableFocusOutlines);\n }\n }, {\n key: \"componentWillUnmount\",\n value: function componentWillUnmount() {\n window.removeEventListener('keydown', this.enableFocusOutlines);\n window.removeEventListener('mousedown', this.disableFocusOutlines);\n }\n }, {\n key: \"render\",\n value: function render() {\n var disableFocusOutlines = this.state.disableFocusOutlines;\n return disableFocusOutlines ? React.createElement(DisableFocusOutlines, null) : null;\n }\n }, {\n key: \"__reactstandin__regenerateByEval\",\n // @ts-ignore\n value: function __reactstandin__regenerateByEval(key, code) {\n // @ts-ignore\n this[key] = eval(code);\n }\n }]);\n\n return FocusOutlines;\n}(Component);\n\nvar DisableFocusOutlines = createGlobalStyle([\":focus{outline:none;}\"]);\nvar _default = FocusOutlines;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(FocusOutlines, \"FocusOutlines\", \"/home/vsts/work/1/s/src/components/styles/FocusOutlines.js\");\n reactHotLoader.register(DisableFocusOutlines, \"DisableFocusOutlines\", \"/home/vsts/work/1/s/src/components/styles/FocusOutlines.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/styles/FocusOutlines.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport { createGlobalStyle } from 'styled-components';\n\nvar _default = createGlobalStyle([\"body{font-family:\", \";}html{box-sizing:border-box;}*,*:before,*:after{box-sizing:inherit;}h1,h2,h3,h4,h5,h6,h7,p{margin:0;padding:0;}h2,h3,h4,h5,h6,h7{font-weight:200;color:\", \";}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{-webkit-transition-delay:999999s;-webkit-transition:color 999999s ease-out,background-color 999999s ease-out;}\"], function (props) {\n return props.theme.styles.fonts.primary;\n}, function (props) {\n return props.theme.styles.colors.headings;\n});\n\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/styles/Global.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport styled from 'styled-components';\nvar StyledTable = styled('table').withConfig({\n displayName: \"Table__StyledTable\",\n componentId: \"sc-tul2rq-0\"\n})([\"width:100%;border:1px solid #f6f6f6;border-radius:4px;border-spacing:0;border-collapse:separate;font-family:'Mabry Pro';color:#565656;& th{text-align:left;font-weight:900;color:#293440;background-color:#f6f6f6;}& th,td{padding:10px 12px;border:1px solid #f6f6f6;}td:not(:first-child){border-left:none;}td:not(:last-child){border-right:none;}& thead th:first-child{border-top-left-radius:4px;}& thead th:last-child{border-top-right-radius:4px;}& tr:last-child td:first-child{border-bottom-left-radius:4px;}& tr:last-child td:last-child{border-bottom-right-radius:4px;}\"]);\n\nvar _default = function _default(props) {\n var children = props.children;\n return React.createElement(StyledTable, props, children);\n};\n\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledTable, \"StyledTable\", \"/home/vsts/work/1/s/src/components/tables/Table.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/tables/Table.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\n\nvar _default = function _default(props) {\n var children = props.children;\n return React.createElement(\"tbody\", null, children);\n};\n\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/tables/Tbody.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport styled from 'styled-components';\nvar StyledTd = styled('td').withConfig({\n displayName: \"Td__StyledTd\",\n componentId: \"sc-qhbbyj-0\"\n})([\"\", \" \", \"\"], function (props) {\n return props.textAlign && \"text-align: \".concat(props.textAlign, \";\");\n}, function (props) {\n return props.onClick || props.role === 'button' ? \"\\n transition: background-color 0.1s;\\n cursor: pointer;\\n\\n &:hover {\\n background-color: #f6f6f6;\\n } \" : '';\n});\nvar _default = StyledTd;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledTd, \"StyledTd\", \"/home/vsts/work/1/s/src/components/tables/Td.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/tables/Td.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport styled from 'styled-components';\nvar StyledTh = styled('th').withConfig({\n displayName: \"Th__StyledTh\",\n componentId: \"sc-1qkdcdf-0\"\n})([\"\"]);\nvar _default = StyledTh;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledTh, \"StyledTh\", \"/home/vsts/work/1/s/src/components/tables/Th.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/tables/Th.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\n\nvar _default = function _default(props) {\n var children = props.children;\n return React.createElement(\"thead\", null, children);\n};\n\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/tables/Thead.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport styled from 'styled-components';\nvar StyledTr = styled('tr').withConfig({\n displayName: \"Tr__StyledTr\",\n componentId: \"sc-rj6534-0\"\n})([\"\", \"\"], function (props) {\n return props.onClick || props.role === 'button' ? \"\\n transition: background-color 0.1s;\\n cursor: pointer;\\n\\n &:hover {\\n background-color: #f6f6f6;\\n } \" : '';\n});\nvar _default = StyledTr;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledTr, \"StyledTr\", \"/home/vsts/work/1/s/src/components/tables/Tr.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/tables/Tr.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport PropTypes from 'prop-types';\n\nvar Tab = function Tab(props) {\n var children = props.children;\n return children;\n};\n\nTab.propTypes = {\n label: PropTypes.oneOfType([PropTypes.string, PropTypes.element])\n};\nvar _default = Tab;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(Tab, \"Tab\", \"/home/vsts/work/1/s/src/components/tabs/Tab.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/tabs/Tab.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","// Source from https://github.com/alitaheri/normalize-scroll-left\nvar cachedType;\n/**\n * Based on the jquery plugin https://github.com/othree/jquery.rtl-scroll-type\n *\n * Types of scrollLeft, assuming scrollWidth=100 and direction is rtl.\n *\n * Type | <- Most Left | Most Right -> | Initial\n * ---------------- | ------------ | ------------- | -------\n * default | 0 | 100 | 100\n * negative (spec*) | -100 | 0 | 0\n * reverse | 100 | 0 | 0\n *\n * Edge 85: default\n * Safari 14: negative\n * Chrome 85: negative\n * Firefox 81: negative\n * IE 11: reverse\n *\n * spec* https://drafts.csswg.org/cssom-view/#dom-window-scroll\n */\n\nexport function detectScrollType() {\n if (cachedType) {\n return cachedType;\n }\n\n var dummy = document.createElement('div');\n var container = document.createElement('div');\n container.style.width = '10px';\n container.style.height = '1px';\n dummy.appendChild(container);\n dummy.dir = 'rtl';\n dummy.style.fontSize = '14px';\n dummy.style.width = '4px';\n dummy.style.height = '1px';\n dummy.style.position = 'absolute';\n dummy.style.top = '-1000px';\n dummy.style.overflow = 'scroll';\n document.body.appendChild(dummy);\n cachedType = 'reverse';\n\n if (dummy.scrollLeft > 0) {\n cachedType = 'default';\n } else {\n dummy.scrollLeft = 1;\n\n if (dummy.scrollLeft === 0) {\n cachedType = 'negative';\n }\n }\n\n document.body.removeChild(dummy);\n return cachedType;\n} // Based on https://stackoverflow.com/a/24394376\n\nexport function getNormalizedScrollLeft(element, direction) {\n var scrollLeft = element.scrollLeft; // Perform the calculations only when direction is rtl to avoid messing up the ltr bahavior\n\n if (direction !== 'rtl') {\n return scrollLeft;\n }\n\n var type = detectScrollType();\n\n switch (type) {\n case 'negative':\n return element.scrollWidth - element.clientWidth + scrollLeft;\n\n case 'reverse':\n return element.scrollWidth - element.clientWidth - scrollLeft;\n\n default:\n return scrollLeft;\n }\n}","function easeInOutSin(time) {\n return (1 + Math.sin(Math.PI * time - Math.PI / 2)) / 2;\n}\n\nexport default function animate(property, element, to) {\n var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};\n var cb = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : function () {};\n var _options$ease = options.ease,\n ease = _options$ease === void 0 ? easeInOutSin : _options$ease,\n _options$duration = options.duration,\n duration = _options$duration === void 0 ? 300 : _options$duration;\n var start = null;\n var from = element[property];\n var cancelled = false;\n\n var cancel = function cancel() {\n cancelled = true;\n };\n\n var step = function step(timestamp) {\n if (cancelled) {\n cb(new Error('Animation cancelled'));\n return;\n }\n\n if (start === null) {\n start = timestamp;\n }\n\n var time = Math.min(1, (timestamp - start) / duration);\n element[property] = ease(time) * (to - from) + from;\n\n if (time >= 1) {\n requestAnimationFrame(function () {\n cb(null);\n });\n return;\n }\n\n requestAnimationFrame(step);\n };\n\n if (from === to) {\n cb(new Error('Element already at target position'));\n return cancel;\n }\n\n requestAnimationFrame(step);\n return cancel;\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport debounce from '../utils/debounce';\nvar styles = {\n width: 99,\n height: 99,\n position: 'absolute',\n top: -9999,\n overflow: 'scroll'\n};\n/**\n * @ignore - internal component.\n * The component originates from https://github.com/STORIS/react-scrollbar-size.\n * It has been moved into the core in order to minimize the bundle size.\n */\n\nexport default function ScrollbarSize(props) {\n var onChange = props.onChange,\n other = _objectWithoutProperties(props, [\"onChange\"]);\n\n var scrollbarHeight = React.useRef();\n var nodeRef = React.useRef(null);\n\n var setMeasurements = function setMeasurements() {\n scrollbarHeight.current = nodeRef.current.offsetHeight - nodeRef.current.clientHeight;\n };\n\n React.useEffect(function () {\n var handleResize = debounce(function () {\n var prevHeight = scrollbarHeight.current;\n setMeasurements();\n\n if (prevHeight !== scrollbarHeight.current) {\n onChange(scrollbarHeight.current);\n }\n });\n window.addEventListener('resize', handleResize);\n return function () {\n handleResize.clear();\n window.removeEventListener('resize', handleResize);\n };\n }, [onChange]);\n React.useEffect(function () {\n setMeasurements();\n onChange(scrollbarHeight.current);\n }, [onChange]);\n return /*#__PURE__*/React.createElement(\"div\", _extends({\n style: styles,\n ref: nodeRef\n }, other));\n}\nprocess.env.NODE_ENV !== \"production\" ? ScrollbarSize.propTypes = {\n onChange: PropTypes.func.isRequired\n} : void 0;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport capitalize from '../utils/capitalize';\nexport var styles = function styles(theme) {\n return {\n root: {\n position: 'absolute',\n height: 2,\n bottom: 0,\n width: '100%',\n transition: theme.transitions.create()\n },\n colorPrimary: {\n backgroundColor: theme.palette.primary.main\n },\n colorSecondary: {\n backgroundColor: theme.palette.secondary.main\n },\n vertical: {\n height: '100%',\n width: 2,\n right: 0\n }\n };\n};\n/**\n * @ignore - internal component.\n */\n\nvar TabIndicator = /*#__PURE__*/React.forwardRef(function TabIndicator(props, ref) {\n var classes = props.classes,\n className = props.className,\n color = props.color,\n orientation = props.orientation,\n other = _objectWithoutProperties(props, [\"classes\", \"className\", \"color\", \"orientation\"]);\n\n return /*#__PURE__*/React.createElement(\"span\", _extends({\n className: clsx(classes.root, classes[\"color\".concat(capitalize(color))], className, orientation === 'vertical' && classes.vertical),\n ref: ref\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? TabIndicator.propTypes = {\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object.isRequired,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * @ignore\n * The color of the tab indicator.\n */\n color: PropTypes.oneOf(['primary', 'secondary']).isRequired,\n\n /**\n * The tabs orientation (layout flow direction).\n */\n orientation: PropTypes.oneOf(['horizontal', 'vertical']).isRequired\n} : void 0;\nexport default withStyles(styles, {\n name: 'PrivateTabIndicator'\n})(TabIndicator);","import * as React from 'react';\nimport createSvgIcon from '../../utils/createSvgIcon';\n/**\n * @ignore - internal component.\n */\n\nexport default createSvgIcon( /*#__PURE__*/React.createElement(\"path\", {\n d: \"M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z\"\n}), 'KeyboardArrowLeft');","import * as React from 'react';\nimport createSvgIcon from '../../utils/createSvgIcon';\n/**\n * @ignore - internal component.\n */\n\nexport default createSvgIcon( /*#__PURE__*/React.createElement(\"path\", {\n d: \"M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z\"\n}), 'KeyboardArrowRight');","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\n\n/* eslint-disable jsx-a11y/aria-role */\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport KeyboardArrowLeft from '../internal/svg-icons/KeyboardArrowLeft';\nimport KeyboardArrowRight from '../internal/svg-icons/KeyboardArrowRight';\nimport withStyles from '../styles/withStyles';\nimport ButtonBase from '../ButtonBase';\nexport var styles = {\n /* Styles applied to the root element. */\n root: {\n width: 40,\n flexShrink: 0,\n opacity: 0.8,\n '&$disabled': {\n opacity: 0\n }\n },\n\n /* Styles applied to the root element if `orientation=\"vertical\"`. */\n vertical: {\n width: '100%',\n height: 40,\n '& svg': {\n transform: 'rotate(90deg)'\n }\n },\n\n /* Pseudo-class applied to the root element if `disabled={true}`. */\n disabled: {}\n};\n\nvar _ref = /*#__PURE__*/React.createElement(KeyboardArrowLeft, {\n fontSize: \"small\"\n});\n\nvar _ref2 = /*#__PURE__*/React.createElement(KeyboardArrowRight, {\n fontSize: \"small\"\n});\n\nvar TabScrollButton = /*#__PURE__*/React.forwardRef(function TabScrollButton(props, ref) {\n var classes = props.classes,\n classNameProp = props.className,\n direction = props.direction,\n orientation = props.orientation,\n disabled = props.disabled,\n other = _objectWithoutProperties(props, [\"classes\", \"className\", \"direction\", \"orientation\", \"disabled\"]);\n\n return /*#__PURE__*/React.createElement(ButtonBase, _extends({\n component: \"div\",\n className: clsx(classes.root, classNameProp, disabled && classes.disabled, orientation === 'vertical' && classes.vertical),\n ref: ref,\n role: null,\n tabIndex: null\n }, other), direction === 'left' ? _ref : _ref2);\n});\nprocess.env.NODE_ENV !== \"production\" ? TabScrollButton.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the d.ts file and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n\n /**\n * The content of the component.\n */\n children: PropTypes.node,\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * Which direction should the button indicate?\n */\n direction: PropTypes.oneOf(['left', 'right']).isRequired,\n\n /**\n * If `true`, the element will be disabled.\n */\n disabled: PropTypes.bool,\n\n /**\n * The tabs orientation (layout flow direction).\n */\n orientation: PropTypes.oneOf(['horizontal', 'vertical']).isRequired\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiTabScrollButton'\n})(TabScrollButton);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport _defineProperty from \"@babel/runtime/helpers/esm/defineProperty\";\nimport * as React from 'react';\nimport { isFragment } from 'react-is';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { refType } from '@material-ui/utils';\nimport debounce from '../utils/debounce';\nimport ownerWindow from '../utils/ownerWindow';\nimport { getNormalizedScrollLeft, detectScrollType } from '../utils/scrollLeft';\nimport animate from '../internal/animate';\nimport ScrollbarSize from './ScrollbarSize';\nimport withStyles from '../styles/withStyles';\nimport TabIndicator from './TabIndicator';\nimport TabScrollButton from '../TabScrollButton';\nimport useEventCallback from '../utils/useEventCallback';\nimport useTheme from '../styles/useTheme';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: {\n overflow: 'hidden',\n minHeight: 48,\n WebkitOverflowScrolling: 'touch',\n // Add iOS momentum scrolling.\n display: 'flex'\n },\n\n /* Styles applied to the root element if `orientation=\"vertical\"`. */\n vertical: {\n flexDirection: 'column'\n },\n\n /* Styles applied to the flex container element. */\n flexContainer: {\n display: 'flex'\n },\n\n /* Styles applied to the flex container element if `orientation=\"vertical\"`. */\n flexContainerVertical: {\n flexDirection: 'column'\n },\n\n /* Styles applied to the flex container element if `centered={true}` & `!variant=\"scrollable\"`. */\n centered: {\n justifyContent: 'center'\n },\n\n /* Styles applied to the tablist element. */\n scroller: {\n position: 'relative',\n display: 'inline-block',\n flex: '1 1 auto',\n whiteSpace: 'nowrap'\n },\n\n /* Styles applied to the tablist element if `!variant=\"scrollable\"`\b\b\b. */\n fixed: {\n overflowX: 'hidden',\n width: '100%'\n },\n\n /* Styles applied to the tablist element if `variant=\"scrollable\"`. */\n scrollable: {\n overflowX: 'scroll',\n // Hide dimensionless scrollbar on MacOS\n scrollbarWidth: 'none',\n // Firefox\n '&::-webkit-scrollbar': {\n display: 'none' // Safari + Chrome\n\n }\n },\n\n /* Styles applied to the `ScrollButtonComponent` component. */\n scrollButtons: {},\n\n /* Styles applied to the `ScrollButtonComponent` component if `scrollButtons=\"auto\"` or scrollButtons=\"desktop\"`. */\n scrollButtonsDesktop: _defineProperty({}, theme.breakpoints.down('xs'), {\n display: 'none'\n }),\n\n /* Styles applied to the `TabIndicator` component. */\n indicator: {}\n };\n};\nvar Tabs = /*#__PURE__*/React.forwardRef(function Tabs(props, ref) {\n var ariaLabel = props['aria-label'],\n ariaLabelledBy = props['aria-labelledby'],\n action = props.action,\n _props$centered = props.centered,\n centered = _props$centered === void 0 ? false : _props$centered,\n childrenProp = props.children,\n classes = props.classes,\n className = props.className,\n _props$component = props.component,\n Component = _props$component === void 0 ? 'div' : _props$component,\n _props$indicatorColor = props.indicatorColor,\n indicatorColor = _props$indicatorColor === void 0 ? 'secondary' : _props$indicatorColor,\n onChange = props.onChange,\n _props$orientation = props.orientation,\n orientation = _props$orientation === void 0 ? 'horizontal' : _props$orientation,\n _props$ScrollButtonCo = props.ScrollButtonComponent,\n ScrollButtonComponent = _props$ScrollButtonCo === void 0 ? TabScrollButton : _props$ScrollButtonCo,\n _props$scrollButtons = props.scrollButtons,\n scrollButtons = _props$scrollButtons === void 0 ? 'auto' : _props$scrollButtons,\n selectionFollowsFocus = props.selectionFollowsFocus,\n _props$TabIndicatorPr = props.TabIndicatorProps,\n TabIndicatorProps = _props$TabIndicatorPr === void 0 ? {} : _props$TabIndicatorPr,\n TabScrollButtonProps = props.TabScrollButtonProps,\n _props$textColor = props.textColor,\n textColor = _props$textColor === void 0 ? 'inherit' : _props$textColor,\n value = props.value,\n _props$variant = props.variant,\n variant = _props$variant === void 0 ? 'standard' : _props$variant,\n other = _objectWithoutProperties(props, [\"aria-label\", \"aria-labelledby\", \"action\", \"centered\", \"children\", \"classes\", \"className\", \"component\", \"indicatorColor\", \"onChange\", \"orientation\", \"ScrollButtonComponent\", \"scrollButtons\", \"selectionFollowsFocus\", \"TabIndicatorProps\", \"TabScrollButtonProps\", \"textColor\", \"value\", \"variant\"]);\n\n var theme = useTheme();\n var scrollable = variant === 'scrollable';\n var isRtl = theme.direction === 'rtl';\n var vertical = orientation === 'vertical';\n var scrollStart = vertical ? 'scrollTop' : 'scrollLeft';\n var start = vertical ? 'top' : 'left';\n var end = vertical ? 'bottom' : 'right';\n var clientSize = vertical ? 'clientHeight' : 'clientWidth';\n var size = vertical ? 'height' : 'width';\n\n if (process.env.NODE_ENV !== 'production') {\n if (centered && scrollable) {\n console.error('Material-UI: You can not use the `centered={true}` and `variant=\"scrollable\"` properties ' + 'at the same time on a `Tabs` component.');\n }\n }\n\n var _React$useState = React.useState(false),\n mounted = _React$useState[0],\n setMounted = _React$useState[1];\n\n var _React$useState2 = React.useState({}),\n indicatorStyle = _React$useState2[0],\n setIndicatorStyle = _React$useState2[1];\n\n var _React$useState3 = React.useState({\n start: false,\n end: false\n }),\n displayScroll = _React$useState3[0],\n setDisplayScroll = _React$useState3[1];\n\n var _React$useState4 = React.useState({\n overflow: 'hidden',\n marginBottom: null\n }),\n scrollerStyle = _React$useState4[0],\n setScrollerStyle = _React$useState4[1];\n\n var valueToIndex = new Map();\n var tabsRef = React.useRef(null);\n var tabListRef = React.useRef(null);\n\n var getTabsMeta = function getTabsMeta() {\n var tabsNode = tabsRef.current;\n var tabsMeta;\n\n if (tabsNode) {\n var rect = tabsNode.getBoundingClientRect(); // create a new object with ClientRect class props + scrollLeft\n\n tabsMeta = {\n clientWidth: tabsNode.clientWidth,\n scrollLeft: tabsNode.scrollLeft,\n scrollTop: tabsNode.scrollTop,\n scrollLeftNormalized: getNormalizedScrollLeft(tabsNode, theme.direction),\n scrollWidth: tabsNode.scrollWidth,\n top: rect.top,\n bottom: rect.bottom,\n left: rect.left,\n right: rect.right\n };\n }\n\n var tabMeta;\n\n if (tabsNode && value !== false) {\n var _children = tabListRef.current.children;\n\n if (_children.length > 0) {\n var tab = _children[valueToIndex.get(value)];\n\n if (process.env.NODE_ENV !== 'production') {\n if (!tab) {\n console.error([\"Material-UI: The value provided to the Tabs component is invalid.\", \"None of the Tabs' children match with `\".concat(value, \"`.\"), valueToIndex.keys ? \"You can provide one of the following values: \".concat(Array.from(valueToIndex.keys()).join(', '), \".\") : null].join('\\n'));\n }\n }\n\n tabMeta = tab ? tab.getBoundingClientRect() : null;\n }\n }\n\n return {\n tabsMeta: tabsMeta,\n tabMeta: tabMeta\n };\n };\n\n var updateIndicatorState = useEventCallback(function () {\n var _newIndicatorStyle;\n\n var _getTabsMeta = getTabsMeta(),\n tabsMeta = _getTabsMeta.tabsMeta,\n tabMeta = _getTabsMeta.tabMeta;\n\n var startValue = 0;\n\n if (tabMeta && tabsMeta) {\n if (vertical) {\n startValue = tabMeta.top - tabsMeta.top + tabsMeta.scrollTop;\n } else {\n var correction = isRtl ? tabsMeta.scrollLeftNormalized + tabsMeta.clientWidth - tabsMeta.scrollWidth : tabsMeta.scrollLeft;\n startValue = tabMeta.left - tabsMeta.left + correction;\n }\n }\n\n var newIndicatorStyle = (_newIndicatorStyle = {}, _defineProperty(_newIndicatorStyle, start, startValue), _defineProperty(_newIndicatorStyle, size, tabMeta ? tabMeta[size] : 0), _newIndicatorStyle);\n\n if (isNaN(indicatorStyle[start]) || isNaN(indicatorStyle[size])) {\n setIndicatorStyle(newIndicatorStyle);\n } else {\n var dStart = Math.abs(indicatorStyle[start] - newIndicatorStyle[start]);\n var dSize = Math.abs(indicatorStyle[size] - newIndicatorStyle[size]);\n\n if (dStart >= 1 || dSize >= 1) {\n setIndicatorStyle(newIndicatorStyle);\n }\n }\n });\n\n var scroll = function scroll(scrollValue) {\n animate(scrollStart, tabsRef.current, scrollValue);\n };\n\n var moveTabsScroll = function moveTabsScroll(delta) {\n var scrollValue = tabsRef.current[scrollStart];\n\n if (vertical) {\n scrollValue += delta;\n } else {\n scrollValue += delta * (isRtl ? -1 : 1); // Fix for Edge\n\n scrollValue *= isRtl && detectScrollType() === 'reverse' ? -1 : 1;\n }\n\n scroll(scrollValue);\n };\n\n var handleStartScrollClick = function handleStartScrollClick() {\n moveTabsScroll(-tabsRef.current[clientSize]);\n };\n\n var handleEndScrollClick = function handleEndScrollClick() {\n moveTabsScroll(tabsRef.current[clientSize]);\n };\n\n var handleScrollbarSizeChange = React.useCallback(function (scrollbarHeight) {\n setScrollerStyle({\n overflow: null,\n marginBottom: -scrollbarHeight\n });\n }, []);\n\n var getConditionalElements = function getConditionalElements() {\n var conditionalElements = {};\n conditionalElements.scrollbarSizeListener = scrollable ? /*#__PURE__*/React.createElement(ScrollbarSize, {\n className: classes.scrollable,\n onChange: handleScrollbarSizeChange\n }) : null;\n var scrollButtonsActive = displayScroll.start || displayScroll.end;\n var showScrollButtons = scrollable && (scrollButtons === 'auto' && scrollButtonsActive || scrollButtons === 'desktop' || scrollButtons === 'on');\n conditionalElements.scrollButtonStart = showScrollButtons ? /*#__PURE__*/React.createElement(ScrollButtonComponent, _extends({\n orientation: orientation,\n direction: isRtl ? 'right' : 'left',\n onClick: handleStartScrollClick,\n disabled: !displayScroll.start,\n className: clsx(classes.scrollButtons, scrollButtons !== 'on' && classes.scrollButtonsDesktop)\n }, TabScrollButtonProps)) : null;\n conditionalElements.scrollButtonEnd = showScrollButtons ? /*#__PURE__*/React.createElement(ScrollButtonComponent, _extends({\n orientation: orientation,\n direction: isRtl ? 'left' : 'right',\n onClick: handleEndScrollClick,\n disabled: !displayScroll.end,\n className: clsx(classes.scrollButtons, scrollButtons !== 'on' && classes.scrollButtonsDesktop)\n }, TabScrollButtonProps)) : null;\n return conditionalElements;\n };\n\n var scrollSelectedIntoView = useEventCallback(function () {\n var _getTabsMeta2 = getTabsMeta(),\n tabsMeta = _getTabsMeta2.tabsMeta,\n tabMeta = _getTabsMeta2.tabMeta;\n\n if (!tabMeta || !tabsMeta) {\n return;\n }\n\n if (tabMeta[start] < tabsMeta[start]) {\n // left side of button is out of view\n var nextScrollStart = tabsMeta[scrollStart] + (tabMeta[start] - tabsMeta[start]);\n scroll(nextScrollStart);\n } else if (tabMeta[end] > tabsMeta[end]) {\n // right side of button is out of view\n var _nextScrollStart = tabsMeta[scrollStart] + (tabMeta[end] - tabsMeta[end]);\n\n scroll(_nextScrollStart);\n }\n });\n var updateScrollButtonState = useEventCallback(function () {\n if (scrollable && scrollButtons !== 'off') {\n var _tabsRef$current = tabsRef.current,\n scrollTop = _tabsRef$current.scrollTop,\n scrollHeight = _tabsRef$current.scrollHeight,\n clientHeight = _tabsRef$current.clientHeight,\n scrollWidth = _tabsRef$current.scrollWidth,\n clientWidth = _tabsRef$current.clientWidth;\n var showStartScroll;\n var showEndScroll;\n\n if (vertical) {\n showStartScroll = scrollTop > 1;\n showEndScroll = scrollTop < scrollHeight - clientHeight - 1;\n } else {\n var scrollLeft = getNormalizedScrollLeft(tabsRef.current, theme.direction); // use 1 for the potential rounding error with browser zooms.\n\n showStartScroll = isRtl ? scrollLeft < scrollWidth - clientWidth - 1 : scrollLeft > 1;\n showEndScroll = !isRtl ? scrollLeft < scrollWidth - clientWidth - 1 : scrollLeft > 1;\n }\n\n if (showStartScroll !== displayScroll.start || showEndScroll !== displayScroll.end) {\n setDisplayScroll({\n start: showStartScroll,\n end: showEndScroll\n });\n }\n }\n });\n React.useEffect(function () {\n var handleResize = debounce(function () {\n updateIndicatorState();\n updateScrollButtonState();\n });\n var win = ownerWindow(tabsRef.current);\n win.addEventListener('resize', handleResize);\n return function () {\n handleResize.clear();\n win.removeEventListener('resize', handleResize);\n };\n }, [updateIndicatorState, updateScrollButtonState]);\n var handleTabsScroll = React.useCallback(debounce(function () {\n updateScrollButtonState();\n }));\n React.useEffect(function () {\n return function () {\n handleTabsScroll.clear();\n };\n }, [handleTabsScroll]);\n React.useEffect(function () {\n setMounted(true);\n }, []);\n React.useEffect(function () {\n updateIndicatorState();\n updateScrollButtonState();\n });\n React.useEffect(function () {\n scrollSelectedIntoView();\n }, [scrollSelectedIntoView, indicatorStyle]);\n React.useImperativeHandle(action, function () {\n return {\n updateIndicator: updateIndicatorState,\n updateScrollButtons: updateScrollButtonState\n };\n }, [updateIndicatorState, updateScrollButtonState]);\n var indicator = /*#__PURE__*/React.createElement(TabIndicator, _extends({\n className: classes.indicator,\n orientation: orientation,\n color: indicatorColor\n }, TabIndicatorProps, {\n style: _extends({}, indicatorStyle, TabIndicatorProps.style)\n }));\n var childIndex = 0;\n var children = React.Children.map(childrenProp, function (child) {\n if (! /*#__PURE__*/React.isValidElement(child)) {\n return null;\n }\n\n if (process.env.NODE_ENV !== 'production') {\n if (isFragment(child)) {\n console.error([\"Material-UI: The Tabs component doesn't accept a Fragment as a child.\", 'Consider providing an array instead.'].join('\\n'));\n }\n }\n\n var childValue = child.props.value === undefined ? childIndex : child.props.value;\n valueToIndex.set(childValue, childIndex);\n var selected = childValue === value;\n childIndex += 1;\n return /*#__PURE__*/React.cloneElement(child, {\n fullWidth: variant === 'fullWidth',\n indicator: selected && !mounted && indicator,\n selected: selected,\n selectionFollowsFocus: selectionFollowsFocus,\n onChange: onChange,\n textColor: textColor,\n value: childValue\n });\n });\n\n var handleKeyDown = function handleKeyDown(event) {\n var target = event.target; // Keyboard navigation assumes that [role=\"tab\"] are siblings\n // though we might warn in the future about nested, interactive elements\n // as a a11y violation\n\n var role = target.getAttribute('role');\n\n if (role !== 'tab') {\n return;\n }\n\n var newFocusTarget = null;\n var previousItemKey = orientation !== \"vertical\" ? 'ArrowLeft' : 'ArrowUp';\n var nextItemKey = orientation !== \"vertical\" ? 'ArrowRight' : 'ArrowDown';\n\n if (orientation !== \"vertical\" && theme.direction === 'rtl') {\n // swap previousItemKey with nextItemKey\n previousItemKey = 'ArrowRight';\n nextItemKey = 'ArrowLeft';\n }\n\n switch (event.key) {\n case previousItemKey:\n newFocusTarget = target.previousElementSibling || tabListRef.current.lastChild;\n break;\n\n case nextItemKey:\n newFocusTarget = target.nextElementSibling || tabListRef.current.firstChild;\n break;\n\n case 'Home':\n newFocusTarget = tabListRef.current.firstChild;\n break;\n\n case 'End':\n newFocusTarget = tabListRef.current.lastChild;\n break;\n\n default:\n break;\n }\n\n if (newFocusTarget !== null) {\n newFocusTarget.focus();\n event.preventDefault();\n }\n };\n\n var conditionalElements = getConditionalElements();\n return /*#__PURE__*/React.createElement(Component, _extends({\n className: clsx(classes.root, className, vertical && classes.vertical),\n ref: ref\n }, other), conditionalElements.scrollButtonStart, conditionalElements.scrollbarSizeListener, /*#__PURE__*/React.createElement(\"div\", {\n className: clsx(classes.scroller, scrollable ? classes.scrollable : classes.fixed),\n style: scrollerStyle,\n ref: tabsRef,\n onScroll: handleTabsScroll\n }, /*#__PURE__*/React.createElement(\"div\", {\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n className: clsx(classes.flexContainer, vertical && classes.flexContainerVertical, centered && !scrollable && classes.centered),\n onKeyDown: handleKeyDown,\n ref: tabListRef,\n role: \"tablist\"\n }, children), mounted && indicator), conditionalElements.scrollButtonEnd);\n});\nprocess.env.NODE_ENV !== \"production\" ? Tabs.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the d.ts file and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n\n /**\n * Callback fired when the component mounts.\n * This is useful when you want to trigger an action programmatically.\n * It supports two actions: `updateIndicator()` and `updateScrollButtons()`\n *\n * @param {object} actions This object contains all possible actions\n * that can be triggered programmatically.\n */\n action: refType,\n\n /**\n * The label for the Tabs as a string.\n */\n 'aria-label': PropTypes.string,\n\n /**\n * An id or list of ids separated by a space that label the Tabs.\n */\n 'aria-labelledby': PropTypes.string,\n\n /**\n * If `true`, the tabs will be centered.\n * This property is intended for large views.\n */\n centered: PropTypes.bool,\n\n /**\n * The content of the component.\n */\n children: PropTypes.node,\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * The component used for the root node.\n * Either a string to use a HTML element or a component.\n */\n component: PropTypes\n /* @typescript-to-proptypes-ignore */\n .elementType,\n\n /**\n * Determines the color of the indicator.\n */\n indicatorColor: PropTypes.oneOf(['primary', 'secondary']),\n\n /**\n * Callback fired when the value changes.\n *\n * @param {object} event The event source of the callback\n * @param {any} value We default to the index of the child (number)\n */\n onChange: PropTypes.func,\n\n /**\n * The tabs orientation (layout flow direction).\n */\n orientation: PropTypes.oneOf(['horizontal', 'vertical']),\n\n /**\n * The component used to render the scroll buttons.\n */\n ScrollButtonComponent: PropTypes.elementType,\n\n /**\n * Determine behavior of scroll buttons when tabs are set to scroll:\n *\n * - `auto` will only present them when not all the items are visible.\n * - `desktop` will only present them on medium and larger viewports.\n * - `on` will always present them.\n * - `off` will never present them.\n */\n scrollButtons: PropTypes.oneOf(['auto', 'desktop', 'off', 'on']),\n\n /**\n * If `true` the selected tab changes on focus. Otherwise it only\n * changes on activation.\n */\n selectionFollowsFocus: PropTypes.bool,\n\n /**\n * Props applied to the tab indicator element.\n */\n TabIndicatorProps: PropTypes.object,\n\n /**\n * Props applied to the [`TabScrollButton`](/api/tab-scroll-button/) element.\n */\n TabScrollButtonProps: PropTypes.object,\n\n /**\n * Determines the color of the `Tab`.\n */\n textColor: PropTypes.oneOf(['inherit', 'primary', 'secondary']),\n\n /**\n * The value of the currently selected `Tab`.\n * If you don't want any selected `Tab`, you can set this property to `false`.\n */\n value: PropTypes.any,\n\n /**\n * Determines additional display behavior of the tabs:\n *\n * - `scrollable` will invoke scrolling properties and allow for horizontally\n * scrolling (or swiping) of the tab bar.\n * -`fullWidth` will make the tabs grow to use all the available space,\n * which should be used for small views, like on mobile.\n * - `standard` will render the default state.\n */\n variant: PropTypes.oneOf(['fullWidth', 'scrollable', 'standard'])\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiTabs'\n})(Tabs);","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport styled from 'styled-components';\nimport { Tabs } from '@material-ui/core';\nimport { ConditionalWrapper } from \"../../helpers\";\nimport { Div } from \"../layout\";\nvar TabBarWrapper = styled(Div).withConfig({\n displayName: \"TabBar__TabBarWrapper\",\n componentId: \"sc-1prjsfw-0\"\n})([\"width:100%;margin-bottom:40px;\"]);\n\nvar TabBar = function TabBar(props) {\n var children = props.children,\n render = props.render,\n rest = _objectWithoutProperties(props, [\"children\", \"render\"]);\n\n return React.createElement(TabBarWrapper, null, React.createElement(ConditionalWrapper, {\n condition: render,\n wrapper: function wrapper(children) {\n return render(children);\n }\n }, React.createElement(Tabs, rest, children)));\n};\n\nvar _default = TabBar;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(TabBarWrapper, \"TabBarWrapper\", \"/home/vsts/work/1/s/src/components/tabs/TabBar.js\");\n reactHotLoader.register(TabBar, \"TabBar\", \"/home/vsts/work/1/s/src/components/tabs/TabBar.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/tabs/TabBar.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nexport { default as responsive } from \"./responsive.js\";\nexport { default as ConditionalWrapper } from \"./ConditionalWrapper.js\";","import _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport _defineProperty from \"@babel/runtime/helpers/esm/defineProperty\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport ButtonBase from '../ButtonBase';\nimport capitalize from '../utils/capitalize';\nimport unsupportedProp from '../utils/unsupportedProp';\nexport var styles = function styles(theme) {\n var _extends2;\n\n return {\n /* Styles applied to the root element. */\n root: _extends({}, theme.typography.button, (_extends2 = {\n maxWidth: 264,\n minWidth: 72,\n position: 'relative',\n boxSizing: 'border-box',\n minHeight: 48,\n flexShrink: 0,\n padding: '6px 12px'\n }, _defineProperty(_extends2, theme.breakpoints.up('sm'), {\n padding: '6px 24px'\n }), _defineProperty(_extends2, \"overflow\", 'hidden'), _defineProperty(_extends2, \"whiteSpace\", 'normal'), _defineProperty(_extends2, \"textAlign\", 'center'), _defineProperty(_extends2, theme.breakpoints.up('sm'), {\n minWidth: 160\n }), _extends2)),\n\n /* Styles applied to the root element if both `icon` and `label` are provided. */\n labelIcon: {\n minHeight: 72,\n paddingTop: 9,\n '& $wrapper > *:first-child': {\n marginBottom: 6\n }\n },\n\n /* Styles applied to the root element if the parent [`Tabs`](/api/tabs/) has `textColor=\"inherit\"`. */\n textColorInherit: {\n color: 'inherit',\n opacity: 0.7,\n '&$selected': {\n opacity: 1\n },\n '&$disabled': {\n opacity: 0.5\n }\n },\n\n /* Styles applied to the root element if the parent [`Tabs`](/api/tabs/) has `textColor=\"primary\"`. */\n textColorPrimary: {\n color: theme.palette.text.secondary,\n '&$selected': {\n color: theme.palette.primary.main\n },\n '&$disabled': {\n color: theme.palette.text.disabled\n }\n },\n\n /* Styles applied to the root element if the parent [`Tabs`](/api/tabs/) has `textColor=\"secondary\"`. */\n textColorSecondary: {\n color: theme.palette.text.secondary,\n '&$selected': {\n color: theme.palette.secondary.main\n },\n '&$disabled': {\n color: theme.palette.text.disabled\n }\n },\n\n /* Pseudo-class applied to the root element if `selected={true}` (controlled by the Tabs component). */\n selected: {},\n\n /* Pseudo-class applied to the root element if `disabled={true}` (controlled by the Tabs component). */\n disabled: {},\n\n /* Styles applied to the root element if `fullWidth={true}` (controlled by the Tabs component). */\n fullWidth: {\n flexShrink: 1,\n flexGrow: 1,\n flexBasis: 0,\n maxWidth: 'none'\n },\n\n /* Styles applied to the root element if `wrapped={true}`. */\n wrapped: {\n fontSize: theme.typography.pxToRem(12),\n lineHeight: 1.5\n },\n\n /* Styles applied to the `icon` and `label`'s wrapper element. */\n wrapper: {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n width: '100%',\n flexDirection: 'column'\n }\n };\n};\nvar Tab = /*#__PURE__*/React.forwardRef(function Tab(props, ref) {\n var classes = props.classes,\n className = props.className,\n _props$disabled = props.disabled,\n disabled = _props$disabled === void 0 ? false : _props$disabled,\n _props$disableFocusRi = props.disableFocusRipple,\n disableFocusRipple = _props$disableFocusRi === void 0 ? false : _props$disableFocusRi,\n fullWidth = props.fullWidth,\n icon = props.icon,\n indicator = props.indicator,\n label = props.label,\n onChange = props.onChange,\n onClick = props.onClick,\n onFocus = props.onFocus,\n selected = props.selected,\n selectionFollowsFocus = props.selectionFollowsFocus,\n _props$textColor = props.textColor,\n textColor = _props$textColor === void 0 ? 'inherit' : _props$textColor,\n value = props.value,\n _props$wrapped = props.wrapped,\n wrapped = _props$wrapped === void 0 ? false : _props$wrapped,\n other = _objectWithoutProperties(props, [\"classes\", \"className\", \"disabled\", \"disableFocusRipple\", \"fullWidth\", \"icon\", \"indicator\", \"label\", \"onChange\", \"onClick\", \"onFocus\", \"selected\", \"selectionFollowsFocus\", \"textColor\", \"value\", \"wrapped\"]);\n\n var handleClick = function handleClick(event) {\n if (onChange) {\n onChange(event, value);\n }\n\n if (onClick) {\n onClick(event);\n }\n };\n\n var handleFocus = function handleFocus(event) {\n if (selectionFollowsFocus && !selected && onChange) {\n onChange(event, value);\n }\n\n if (onFocus) {\n onFocus(event);\n }\n };\n\n return /*#__PURE__*/React.createElement(ButtonBase, _extends({\n focusRipple: !disableFocusRipple,\n className: clsx(classes.root, classes[\"textColor\".concat(capitalize(textColor))], className, disabled && classes.disabled, selected && classes.selected, label && icon && classes.labelIcon, fullWidth && classes.fullWidth, wrapped && classes.wrapped),\n ref: ref,\n role: \"tab\",\n \"aria-selected\": selected,\n disabled: disabled,\n onClick: handleClick,\n onFocus: handleFocus,\n tabIndex: selected ? 0 : -1\n }, other), /*#__PURE__*/React.createElement(\"span\", {\n className: classes.wrapper\n }, icon, label), indicator);\n});\nprocess.env.NODE_ENV !== \"production\" ? Tab.propTypes = {\n /**\n * This prop isn't supported.\n * Use the `component` prop if you need to change the children structure.\n */\n children: unsupportedProp,\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object.isRequired,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * If `true`, the tab will be disabled.\n */\n disabled: PropTypes.bool,\n\n /**\n * If `true`, the keyboard focus ripple will be disabled.\n */\n disableFocusRipple: PropTypes.bool,\n\n /**\n * If `true`, the ripple effect will be disabled.\n */\n disableRipple: PropTypes.bool,\n\n /**\n * @ignore\n */\n fullWidth: PropTypes.bool,\n\n /**\n * The icon element.\n */\n icon: PropTypes.node,\n\n /**\n * @ignore\n * For server-side rendering consideration, we let the selected tab\n * render the indicator.\n */\n indicator: PropTypes.node,\n\n /**\n * The label element.\n */\n label: PropTypes.node,\n\n /**\n * @ignore\n */\n onChange: PropTypes.func,\n\n /**\n * @ignore\n */\n onClick: PropTypes.func,\n\n /**\n * @ignore\n */\n onFocus: PropTypes.func,\n\n /**\n * @ignore\n */\n selected: PropTypes.bool,\n\n /**\n * @ignore\n */\n selectionFollowsFocus: PropTypes.bool,\n\n /**\n * @ignore\n */\n textColor: PropTypes.oneOf(['secondary', 'primary', 'inherit']),\n\n /**\n * You can provide your own value. Otherwise, we fallback to the child position index.\n */\n value: PropTypes.any,\n\n /**\n * Tab labels appear in a single row.\n * They can use a second line if needed.\n */\n wrapped: PropTypes.bool\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiTab'\n})(Tab);","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport { Tab } from '@material-ui/core';\n\nvar TabLabel = function TabLabel(props) {\n var children = props.children,\n rest = _objectWithoutProperties(props, [\"children\"]);\n\n return React.createElement(Tab, _extends({}, rest, {\n label: children\n }));\n};\n\nvar _default = TabLabel;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(TabLabel, \"TabLabel\", \"/home/vsts/work/1/s/src/components/tabs/TabLabel.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/tabs/TabLabel.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","import * as React from 'react';\nimport * as PropTypes from 'prop-types';\n/**\r\n * @type {React.Context<{ idPrefix: string; value: string } | null>}\r\n */\n\nvar Context = React.createContext(null);\n\nif (process.env.NODE_ENV !== 'production') {\n Context.displayName = 'TabContext';\n}\n\nfunction useUniquePrefix() {\n var _React$useState = React.useState(null),\n id = _React$useState[0],\n setId = _React$useState[1];\n\n React.useEffect(function () {\n setId(\"mui-p-\".concat(Math.round(Math.random() * 1e5)));\n }, []);\n return id;\n}\n\nexport default function TabContext(props) {\n var children = props.children,\n value = props.value;\n var idPrefix = useUniquePrefix();\n var context = React.useMemo(function () {\n return {\n idPrefix: idPrefix,\n value: value\n };\n }, [idPrefix, value]);\n return /*#__PURE__*/React.createElement(Context.Provider, {\n value: context\n }, children);\n}\nprocess.env.NODE_ENV !== \"production\" ? TabContext.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the d.ts file and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n\n /**\r\n * The content of the component.\r\n */\n children: PropTypes.node,\n\n /**\r\n * The value of the currently selected `Tab`.\r\n */\n value: PropTypes.string.isRequired\n} : void 0;\n/**\r\n * @returns {unknown}\r\n */\n\nexport function useTabContext() {\n return React.useContext(Context);\n}\nexport function getPanelId(context, value) {\n var idPrefix = context.idPrefix;\n\n if (idPrefix === null) {\n return null;\n }\n\n return \"\".concat(context.idPrefix, \"-P-\").concat(value);\n}\nexport function getTabId(context, value) {\n var idPrefix = context.idPrefix;\n\n if (idPrefix === null) {\n return null;\n }\n\n return \"\".concat(context.idPrefix, \"-T-\").concat(value);\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { withStyles } from '@material-ui/core/styles';\nimport { getPanelId, getTabId, useTabContext } from '../TabContext';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: {\n padding: theme.spacing(3)\n }\n };\n};\nvar TabPanel = /*#__PURE__*/React.forwardRef(function TabPanel(props, ref) {\n var children = props.children,\n className = props.className,\n classes = props.classes,\n value = props.value,\n other = _objectWithoutProperties(props, [\"children\", \"className\", \"classes\", \"value\"]);\n\n var context = useTabContext();\n\n if (context === null) {\n throw new TypeError('No TabContext provided');\n }\n\n var id = getPanelId(context, value);\n var tabId = getTabId(context, value);\n return /*#__PURE__*/React.createElement(\"div\", _extends({\n \"aria-labelledby\": tabId,\n className: clsx(classes.root, className),\n hidden: value !== context.value,\n id: id,\n ref: ref,\n role: \"tabpanel\"\n }, other), value === context.value && children);\n});\nprocess.env.NODE_ENV !== \"production\" ? TabPanel.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the d.ts file and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n\n /**\r\n * The content of the component.\r\n */\n children: PropTypes.node,\n\n /**\r\n * Override or extend the styles applied to the component.\r\n * See [CSS API](#css) below for more details.\r\n */\n classes: PropTypes.object,\n\n /**\r\n * @ignore\r\n */\n className: PropTypes.string,\n\n /**\r\n * The `value` of the corresponding `Tab`. Must use the index of the `Tab` when\r\n * no `value` was passed to `Tab`.\r\n */\n value: PropTypes.string.isRequired\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiTabPanel'\n})(TabPanel);","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport { TabPanel as MuiTabPanel } from '@material-ui/lab';\n\nvar TabPanel = function TabPanel(props) {\n return React.createElement(MuiTabPanel, props);\n};\n\nvar _default = TabPanel;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(TabPanel, \"TabPanel\", \"/home/vsts/work/1/s/src/components/tabs/TabPanel.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/tabs/TabPanel.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\n\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== \"undefined\" && arr[Symbol.iterator] || arr[\"@@iterator\"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"] != null) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; }\n\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React, { Fragment, useState, useEffect } from 'react';\nimport TabBar from \"./TabBar.js\";\nimport TabLabel from \"./TabLabel.js\";\n\nvar Tabs = function Tabs(props) {\n var onChange = props.onChange,\n renderTabBar = props.renderTabBar,\n children = props.children,\n value = props.value;\n\n var _useState = useState(0),\n _useState2 = _slicedToArray(_useState, 2),\n currentTabIndex = _useState2[0],\n setCurrentTabIndex = _useState2[1];\n\n var handleChange = function handleChange(e, newValue) {\n if (!value) {\n setCurrentTabIndex(newValue);\n }\n\n if (typeof onChange === 'function') onChange(e, newValue);\n };\n\n useEffect(function () {\n if (value) {\n setCurrentTabIndex(value);\n }\n }, [value]);\n var TabBarProps = {};\n\n if (typeof renderTabBar === 'function') {\n TabBarProps.render = renderTabBar;\n }\n\n return React.createElement(Fragment, null, React.createElement(TabBar, _extends({\n value: currentTabIndex || 0,\n onChange: handleChange\n }, TabBarProps), React.Children.map(children, function (child, index) {\n return React.createElement(TabLabel, {\n key: index\n }, child.props.label || \"No label \".concat(index));\n })), React.Children.map(children, function (child, index) {\n return index === currentTabIndex ? child : null;\n }));\n};\n\n__signature__(Tabs, \"useState{[currentTabIndex, setCurrentTabIndex](0)}\\nuseEffect{}\");\n\nvar _default = Tabs;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(Tabs, \"Tabs\", \"/home/vsts/work/1/s/src/components/tabs/Tabs.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/tabs/Tabs.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React, { forwardRef } from 'react';\nimport styled from 'styled-components';\nimport { HtmlElement } from \"../base\";\nvar StyledA = styled(HtmlElement).withConfig({\n displayName: \"Anchor__StyledA\",\n componentId: \"sc-tfvab6-0\"\n})([\"text-decoration:none;color:#0075ff;cursor:pointer;\"]); // eslint-disable-next-line react/display-name\n\nvar Anchor = forwardRef(function (props, ref) {\n return React.createElement(StyledA, _extends({}, props, {\n ref: ref,\n forwardedAs: \"a\"\n }));\n});\nvar _default = Anchor;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledA, \"StyledA\", \"/home/vsts/work/1/s/src/components/text/Anchor.js\");\n reactHotLoader.register(Anchor, \"Anchor\", \"/home/vsts/work/1/s/src/components/text/Anchor.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/text/Anchor.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }\n\nfunction _nonIterableSpread() { throw new TypeError(\"Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _iterableToArray(iter) { if (typeof Symbol !== \"undefined\" && iter[Symbol.iterator] != null || iter[\"@@iterator\"] != null) return Array.from(iter); }\n\nfunction _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport styled, { css } from 'styled-components';\nimport PropTypes from 'prop-types';\nimport { HtmlElement } from \"../base\";\nimport { SPACE } from \"../../constants/style.js\";\nvar StyledHeading = styled(HtmlElement).withConfig({\n displayName: \"Heading__StyledHeading\",\n componentId: \"sc-3jfc5-0\"\n})([\"color:\", \";\", \" \", \" \", \" \", \" \", \" \", \" \", \" \", \" \", \" &:first-child{margin-top:0;}\"], function (props) {\n return props.theme.styles.colors.headings;\n}, function (props) {\n return (// Reverse values of the SPACE constants and use the biggest for level 1\n // and so on. Let's see how that works.\n props.level && \"margin-top: \".concat(_toConsumableArray(Object.values(SPACE)).reverse()[props.level], \";\")\n );\n}, function (props) {\n return props.level === 2 && \"\\n text-align: center;\\n margin-bottom: \".concat(SPACE.xxl, \";\\n font-size: 32px;\\n font-weight: 500;\\n letter-spacing: -0.025em;\\n \");\n}, function (props) {\n return props.level === 3 && \"\\n font-size: 24px;\\n margin-bottom: \".concat(SPACE.lg, \";\\n font-weight: 500;\\n letter-spacing: -0.025em;\\n \");\n}, function (props) {\n return props.level === 4 && \"\\n font-size: 18px;\\n text-transform: uppercase;\\n font-weight: 500;\\n margin-bottom: \".concat(SPACE.md, \";\\n padding-bottom: \").concat(SPACE.xs, \";\\n width: auto;\\n display: inline-block;\\n \");\n}, function (props) {\n return props.level === 5 && \"\\n font-size: 16px;\\n text-transform: uppercase;\\n font-weight: 500;\\n letter-spacing: -0.025em;\\n border-bottom: 2px solid #f6f6f6;\\n margin-bottom: \".concat(SPACE.md, \";\\n padding-bottom: \").concat(SPACE.xs, \";\\n width: auto;\\n display: inline-block;\\n \");\n}, function (props) {\n return props.level === 6 && \"\\n font-size: 14px;\\n text-transform: uppercase;\\n font-weight: 800;\\n letter-spacing: -0.025em;\\n margin-bottom: \".concat(SPACE.sm, \";\\n width: auto;\\n display: inline-block;\\n \");\n}, function (props) {\n return props.center && \"text-align: center;\";\n}, function (props) {\n return props.fontSize && \"font-size: \".concat(props.fontSize, \";\");\n}, function (props) {\n return props.marginBottom && \"margin-bottom: \".concat(props.marginBottom, \";\");\n});\n\nvar Heading = function Heading(props) {\n var children = props.children,\n tagName = props.tagName,\n level = props.level;\n return React.createElement(StyledHeading, _extends({}, props, {\n tagName: \"\".concat(tagName || \"h\".concat(level))\n }), children);\n};\n\nHeading.propTypes = {\n level: PropTypes.number\n};\nHeading.defaultProps = {\n level: 3\n};\nvar _default = Heading;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledHeading, \"StyledHeading\", \"/home/vsts/work/1/s/src/components/text/Heading.js\");\n reactHotLoader.register(Heading, \"Heading\", \"/home/vsts/work/1/s/src/components/text/Heading.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/text/Heading.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport styled from 'styled-components';\nimport { HtmlElement } from \"../base\";\nimport { SPACE } from \"../../constants/style.js\";\nvar StyledHtmlElement = styled(HtmlElement).withConfig({\n displayName: \"HelpText__StyledHtmlElement\",\n componentId: \"sc-1dee3gm-0\"\n})([\"font-family:'Mabry Pro';font-size:14px;font-weight:300;color:\", \";line-height:1.4;margin-top:\", \";\"], function (props) {\n return props.theme.styles.colors.tertiary;\n}, SPACE.xs);\n\nvar HelpText = function HelpText(props) {\n var children = props.children,\n rest = _objectWithoutProperties(props, [\"children\"]);\n\n return React.createElement(StyledHtmlElement, _extends({}, rest, {\n tagName: \"p\"\n }), children);\n};\n\nvar _default = HelpText;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledHtmlElement, \"StyledHtmlElement\", \"/home/vsts/work/1/s/src/components/text/HelpText.js\");\n reactHotLoader.register(HelpText, \"HelpText\", \"/home/vsts/work/1/s/src/components/text/HelpText.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/text/HelpText.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport styled from 'styled-components';\nimport { HtmlElement } from \"../base\";\nvar StyledLead = styled(HtmlElement).withConfig({\n displayName: \"Lead__StyledLead\",\n componentId: \"sc-1koubqu-0\"\n})([\"font-size:24px;\"]);\n\nvar Lead = function Lead(props) {\n var children = props.children,\n rest = _objectWithoutProperties(props, [\"children\"]);\n\n return React.createElement(StyledLead, _extends({}, rest, {\n tagName: \"p\"\n }), children);\n};\n\nvar _default = Lead;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledLead, \"StyledLead\", \"/home/vsts/work/1/s/src/components/text/Lead.js\");\n reactHotLoader.register(Lead, \"Lead\", \"/home/vsts/work/1/s/src/components/text/Lead.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/text/Lead.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport styled from 'styled-components';\nimport { SPACE } from \"../../constants/style\";\nvar StyledParagraph = styled('p').withConfig({\n displayName: \"Paragraph__StyledParagraph\",\n componentId: \"sc-78bm3o-0\"\n})([\"font-family:\", \";line-height:1.25;font-weight:300;color:\", \";margin-bottom:\", \";&:last-child{margin-bottom:0;}\"], function (props) {\n return props.theme.styles.fonts.primary;\n}, function (props) {\n return props.theme.styles.colors.text;\n}, SPACE.md);\n\nvar Paragraph = function Paragraph(props) {\n var children = props.children,\n rest = _objectWithoutProperties(props, [\"children\"]);\n\n return React.createElement(StyledParagraph, rest, children);\n};\n\nvar _default = Paragraph;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledParagraph, \"StyledParagraph\", \"/home/vsts/work/1/s/src/components/text/Paragraph.js\");\n reactHotLoader.register(Paragraph, \"Paragraph\", \"/home/vsts/work/1/s/src/components/text/Paragraph.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/text/Paragraph.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport styled from 'styled-components';\nimport { HtmlElement } from \"../base\";\nvar StyledElement = styled('span').withConfig({\n displayName: \"Placeholder__StyledElement\",\n componentId: \"sc-1j54qgt-0\"\n})([\"font-style:italic;\"]);\n\nvar Placeholder = function Placeholder(props) {\n var children = props.children,\n rest = _objectWithoutProperties(props, [\"children\"]);\n\n return React.createElement(StyledElement, rest, children);\n};\n\nvar _default = Placeholder;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledElement, \"StyledElement\", \"/home/vsts/work/1/s/src/components/text/Placeholder.js\");\n reactHotLoader.register(Placeholder, \"Placeholder\", \"/home/vsts/work/1/s/src/components/text/Placeholder.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/text/Placeholder.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport styled from 'styled-components';\nvar StyledSpan = styled('span').withConfig({\n displayName: \"Span__StyledSpan\",\n componentId: \"sc-irj9l5-0\"\n})([\"font-weight:400;color:\", \";\"], function (props) {\n return props.theme.styles.secondary.color;\n});\n\nvar Span = function Span(props) {\n var children = props.children,\n rest = _objectWithoutProperties(props, [\"children\"]);\n\n return React.createElement(StyledSpan, rest, children);\n};\n\nvar _default = Span;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyledSpan, \"StyledSpan\", \"/home/vsts/work/1/s/src/components/text/Span.js\");\n reactHotLoader.register(Span, \"Span\", \"/home/vsts/work/1/s/src/components/text/Span.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/text/Span.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nexport { default as Anchor } from \"./Anchor.js\";\nexport { default as Heading } from \"./Heading.js\";\nexport { default as HelpText } from \"./HelpText.js\";\nexport { default as Lead } from \"./Lead.js\";\nexport { default as Paragraph } from \"./Paragraph.js\";\nexport { default as Placeholder } from \"./Placeholder.js\";\nexport { default as Span } from \"./Span.js\";","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport { ThemeProvider as MuiThemeProvider, createTheme } from '@material-ui/core/styles';\nimport { ThemeProvider as StyledComponentsThemeProvider } from 'styled-components';\nimport { MediaContext } from \"../../helpers/responsive\";\nimport { SPACE, BORDER } from \"../../constants/style\";\n\nvar ConditionalWrapper = function ConditionalWrapper(_ref) {\n var condition = _ref.condition,\n wrapper = _ref.wrapper,\n children = _ref.children;\n return condition ? wrapper(children) : children;\n};\n\nvar MuiThemeThemeProvider = function MuiThemeThemeProvider(props) {\n var children = props.children,\n theme = props.theme;\n var muiTheme = createTheme({\n typography: {\n fontFamily: 'Mabry Pro'\n },\n palette: {\n error: {\n main: theme.styles.colors.errorColor\n },\n primary: {\n main: theme.styles.colors.primaryColor,\n dark: theme.styles.colors.primaryFadedColor\n },\n text: {\n primary: theme.styles.colors.bodyTextColor,\n secondary: theme.styles.colors.bodySecondaryTextColor\n }\n },\n divider: theme.styles.colors.primaryFadedColor,\n props: {\n MuiButtonBase: {\n disableRipple: true\n }\n },\n overrides: {\n MuiIconButton: {\n root: {\n '&&&:hover': {\n backgroundColor: 'transparent'\n }\n }\n },\n MuiSelect: {\n icon: {\n color: theme.styles.colors.bodySecondaryTextColor\n }\n },\n MuiInputLabel: {\n root: {\n fontWeight: 700\n },\n outlined: {\n transform: 'translate(14px, 16px) scale(1)',\n paddingRight: '0px',\n '&$shrink': {\n paddingRight: '8px',\n transform: 'translate(14px, -6px) scale(0.8)'\n }\n }\n },\n MuiFormLabel: {\n root: {\n '&$focused': {\n color: \"\".concat(theme.styles.colors.secondaryColor, \" !important\")\n }\n }\n },\n MuiInputBase: {\n root: {\n color: theme.styles.colors.bodySecondaryTextColor,\n fontWeight: 700\n }\n },\n MuiInputAdornment: {\n root: {\n color: theme.styles.colors.bodySecondaryTextColor\n },\n positionStart: {\n marginRight: SPACE.sm\n },\n positionEnd: {\n marginLeft: SPACE.sm\n }\n },\n MuiPaper: {\n root: {\n backgroundColor: theme.styles.colors.backgroundAlternate,\n color: theme.styles.colors.bodySecondaryTextColor\n }\n },\n MuiOutlinedInput: {\n input: {\n paddingTop: '14.5px',\n paddingBottom: '14.5px'\n },\n notchedOutline: {\n borderWidth: '2px',\n borderColor: \"\".concat(theme.styles.colors.secondaryColor, \" !important\"),\n transition: 'border-color 0.15s',\n fontSize: '1.05em'\n }\n },\n MuiAutocomplete: {\n popupIndicator: {\n padding: '2px !important'\n },\n clearIndicator: {\n padding: '4px !important'\n },\n root: {\n '&& $inputRoot': {\n padding: '6px 8px'\n },\n '&&&& $input': {\n padding: '8.5px 4px'\n }\n },\n tag: {\n height: '26px',\n borderRadius: '4px',\n paddingLeft: 6,\n paddingRight: 6\n }\n },\n MuiChip: {\n root: {\n backgroundColor: theme.styles.colors.primary,\n color: theme.styles.colors.bodyFilledTextColor\n },\n label: {\n paddingLeft: 2,\n paddingRight: 12\n },\n deleteIcon: {\n marginRight: -2,\n color: theme.styles.colors.bodyFilledTextColor,\n width: 16,\n height: 16,\n stroke: 'unset',\n '&&:hover': {\n color: theme.styles.colors.bodyFilledTextColor\n }\n }\n },\n MuiCheckbox: {\n root: {\n color: theme.styles.colors.tertiary,\n '&$checked': {\n color: theme.styles.colors.tertiary\n }\n },\n colorPrimary: {\n color: theme.styles.colors.tertiary,\n '&$checked': {\n color: theme.styles.colors.primary\n }\n },\n colorSecondary: {\n color: theme.styles.colors.tertiary,\n '&$checked': {\n color: theme.styles.colors.secondary\n }\n }\n },\n MuiRadio: {\n root: {\n color: theme.styles.colors.tertiary,\n '&$checked': {\n color: theme.styles.colors.tertiary\n }\n },\n colorPrimary: {\n color: theme.styles.colors.tertiary,\n '&$checked': {\n color: theme.styles.colors.primary\n }\n },\n colorSecondary: {\n color: theme.styles.colors.tertiary,\n '&$checked': {\n color: theme.styles.colors.secondary\n }\n }\n },\n MuiSwitch: {\n root: {\n width: 45,\n height: 24,\n padding: 0,\n display: 'flex'\n },\n switchBase: {\n padding: 4,\n height: 24,\n backgroundColor: 'transparent',\n color: theme.styles.colors.tertiary,\n colorSecondary: {\n color: theme.styles.colors.tertiary,\n '&$checked': {\n color: theme.styles.colors.tertiary\n }\n },\n '&$checked': {\n transform: 'translateX(20.5px)',\n color: theme.styles.colors.primaryColor,\n '& + $track': {\n opacity: 1,\n backgroundColor: 'transparent',\n borderColor: theme.styles.colors.primaryColor\n }\n }\n },\n thumb: {\n width: 16,\n height: 16,\n boxShadow: 'none'\n },\n track: {\n border: \"2px solid \".concat(theme.styles.colors.tertiary),\n borderRadius: 24 / 2,\n opacity: 1,\n backgroundColor: 'transparent',\n height: 24\n },\n checked: {}\n },\n MuiPickersDay: {\n day: {\n borderRadius: BORDER.radius.sm\n },\n daySelected: {\n '&&&:hover': {\n backgroundColor: theme.styles.colors.primaryColor\n }\n }\n },\n MuiPickersCalendarHeader: {\n iconButton: {\n backgroundColor: 'transparent'\n }\n },\n MuiTooltip: {\n tooltip: {\n backgroundColor: theme.styles.colors.secondaryColor,\n fontSize: '14px'\n },\n arrow: {\n color: theme.styles.colors.secondaryColor\n }\n },\n MuiTabs: {\n root: {\n borderBottom: 'transparent',\n backgroundColor: 'transparent'\n },\n indicator: {\n backgroundColor: theme.styles.colors.secondaryColor,\n bottom: '4px'\n }\n },\n MuiTab: {\n root: {\n fontFamily: theme.styles.fonts.primary,\n fontWeight: 400,\n padding: 0,\n textTransform: 'none',\n marginRight: '24px',\n minWidth: 0,\n '@media (min-width: 600px)': {\n minWidth: 0\n },\n fontSize: '18px',\n '&$selected': {\n color: theme.styles.colors.secondaryColor\n }\n }\n },\n MuiButtonBase: {\n root: {\n fontFamily: 'Mabry Pro',\n fontSize: '16px',\n fontWeight: 400,\n borderRadius: '4px'\n }\n },\n MuiPagination: {},\n MuiPaginationItem: {\n root: {\n fontFamily: null,\n // To inherit from MuiButtonBase instead of theme default\n fontWeight: null,\n fontSize: null,\n padding: '0 16px',\n margin: 0,\n transition: null,\n borderRadius: '4px',\n '&$selected': {\n backgroundColor: theme.styles.colors.primaryColor,\n color: '#2A0062'\n },\n height: '40px'\n },\n page: {\n borderRadius: '4px',\n transition: null,\n '&$selected': {\n backgroundColor: theme.styles.colors.primaryColor,\n color: '#2A0062',\n '&:hover': {\n backgroundColor: theme.styles.colors.primaryColor\n }\n },\n '&:hover': {\n backgroundColor: 'transparent'\n }\n }\n }\n }\n });\n return React.createElement(MuiThemeProvider, {\n theme: muiTheme\n }, children);\n};\n\nvar ThemeProvider = function ThemeProvider(props) {\n var children = props.children,\n theme = props.theme;\n return React.createElement(MediaContext.Provider, {\n value: \"mobile\"\n }, React.createElement(ConditionalWrapper, {\n condition: theme,\n wrapper: function wrapper(children) {\n return React.createElement(StyledComponentsThemeProvider, {\n theme: theme\n }, React.createElement(MuiThemeThemeProvider, {\n theme: theme\n }, children));\n }\n }, children));\n};\n\nvar _default = ThemeProvider;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(ConditionalWrapper, \"ConditionalWrapper\", \"/home/vsts/work/1/s/src/components/themes/ThemeProvider.js\");\n reactHotLoader.register(MuiThemeThemeProvider, \"MuiThemeThemeProvider\", \"/home/vsts/work/1/s/src/components/themes/ThemeProvider.js\");\n reactHotLoader.register(ThemeProvider, \"ThemeProvider\", \"/home/vsts/work/1/s/src/components/themes/ThemeProvider.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/themes/ThemeProvider.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","var __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nexport { makeStyles } from '@material-ui/core/styles';\nexport { withStyles } from '@material-ui/core/styles';\nexport { default as ThemeProvider } from \"./ThemeProvider.js\";\nexport { default as themeWrapper } from \"./themeWrapper.js\";","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nimport ThemeProvider from \"./ThemeProvider.js\";\nimport contrast from \"../../themes/contrast\";\nimport light from \"../../themes/light\";\nvar themes = {\n contrast: contrast,\n light: light\n};\n\nvar ConditionalWrapper = function ConditionalWrapper(props) {\n var condition = props.condition,\n wrapper = props.wrapper,\n children = props.children;\n return condition ? wrapper(children) : children;\n};\n\nvar themeWrapper = function themeWrapper(WrappedComponent) {\n return function (props) {\n var themeId = props.themeId,\n rest = _objectWithoutProperties(props, [\"themeId\"]);\n\n return React.createElement(ConditionalWrapper, {\n condition: themeId,\n wrapper: function wrapper(children) {\n return React.createElement(ThemeProvider, {\n theme: themes[themeId]\n }, children);\n }\n }, React.createElement(WrappedComponent, rest));\n };\n};\n\nvar _default = themeWrapper;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(themes, \"themes\", \"/home/vsts/work/1/s/src/components/themes/themeWrapper.js\");\n reactHotLoader.register(ConditionalWrapper, \"ConditionalWrapper\", \"/home/vsts/work/1/s/src/components/themes/themeWrapper.js\");\n reactHotLoader.register(themeWrapper, \"themeWrapper\", \"/home/vsts/work/1/s/src/components/themes/themeWrapper.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/components/themes/themeWrapper.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nexport var BREAKPOINTS = {\n mobile: 600,\n tablet: 1200,\n laptop: 1600,\n desktop: 4800\n};\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(BREAKPOINTS, \"BREAKPOINTS\", \"/home/vsts/work/1/s/src/constants/responsive.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nexport var COLOR = {\n white: '#fff',\n offWhite: '#fefefe',\n dark: '#293440',\n gray: {\n darkest: '#565656',\n darker: '#717171',\n base: '#c4c4c4',\n lighter: '#eee',\n lightest: '#f6f6f6'\n },\n primary: {\n base: '#0070f0'\n },\n secondary: {\n base: '#293440'\n },\n error: {\n base: '#db2828',\n lighter: '#fee',\n lightest: '#fff7f7'\n },\n warning: {\n base: '#e4511f',\n lighter: '#ffe5b4',\n lightest: '#fcfaf9'\n },\n info: {\n base: '#213e5e',\n lighter: '#eaf4ff',\n lightest: '#f5faff'\n }\n};\nexport var FONT = {};\nexport var BORDER = {\n width: {\n sm: '1px',\n md: '2px',\n lg: '4px'\n },\n radius: {\n xs: '2px',\n sm: '4px',\n md: '8px',\n lg: '16px'\n },\n style: {\n solid: '',\n dashed: '',\n none: ''\n }\n};\nexport var SHADOW = {\n soft: '0 0 50px rgba(0, 0, 0, 0.1)',\n lg: '0 0 50px rgba(0, 0, 0, 0.25)'\n};\nexport var SPACE = {\n xxxs: '1px',\n xxs: '2px',\n xs: '4px',\n sm: '8px',\n md: '12px',\n lg: '16px',\n xl: '24px',\n xxl: '48px',\n xxxl: '96px'\n};\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(COLOR, \"COLOR\", \"/home/vsts/work/1/s/src/constants/style.js\");\n reactHotLoader.register(FONT, \"FONT\", \"/home/vsts/work/1/s/src/constants/style.js\");\n reactHotLoader.register(BORDER, \"BORDER\", \"/home/vsts/work/1/s/src/constants/style.js\");\n reactHotLoader.register(SHADOW, \"SHADOW\", \"/home/vsts/work/1/s/src/constants/style.js\");\n reactHotLoader.register(SPACE, \"SPACE\", \"/home/vsts/work/1/s/src/constants/style.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport React from 'react';\nexport var StyleContext = React.createContext(null);\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(StyleContext, \"StyleContext\", \"/home/vsts/work/1/s/src/context.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nvar ConditionalWrapper = function ConditionalWrapper(_ref) {\n var condition = _ref.condition,\n wrapper = _ref.wrapper,\n children = _ref.children;\n return condition ? wrapper(children) : children ? children : null;\n};\n\nvar _default = ConditionalWrapper;\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(ConditionalWrapper, \"ConditionalWrapper\", \"/home/vsts/work/1/s/src/helpers/ConditionalWrapper.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/helpers/ConditionalWrapper.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","(function () {\n var enterModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.enterModule : undefined;\n enterModule && enterModule(module);\n})();\n\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\n\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== \"undefined\" && arr[Symbol.iterator] || arr[\"@@iterator\"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"] != null) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; }\n\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\nvar __signature__ = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal[\"default\"].signature : function (a) {\n return a;\n};\n\nimport { createContext } from 'react';\nimport { css } from 'styled-components';\nimport { BREAKPOINTS } from \"../constants/responsive\";\nvar ranges = Object.entries(BREAKPOINTS).reduce(function (acc, curr, index, arr) {\n var _curr = _slicedToArray(curr, 2),\n label = _curr[0],\n upperBoundary = _curr[1];\n\n var prevItem = arr[index - 1] || []; // eslint-disable-next-line no-unused-vars\n\n var _prevItem = _slicedToArray(prevItem, 2),\n prevLabel = _prevItem[0],\n _prevItem$ = _prevItem[1],\n prevUppperBoundary = _prevItem$ === void 0 ? 0 : _prevItem$;\n\n acc[label] = {\n from: prevUppperBoundary + 1,\n to: upperBoundary\n };\n return acc;\n}, {});\nexport var media = Object.entries(ranges).reduce(function (acc, curr, index, arr) {\n var _curr2 = _slicedToArray(curr, 2),\n label = _curr2[0],\n range = _curr2[1];\n\n var minWidth = \"(min-width: \".concat(range.from, \"px)\");\n var maxWidth = \"(max-width: \".concat(range.to, \"px)\");\n var mediaQueries = {\n up: minWidth,\n down: maxWidth,\n only: \"\".concat(minWidth, \" and \").concat(maxWidth)\n };\n acc.css[label] = {\n only: function only() {\n return function () {\n return css([\"@media \", \"{\", \";}\"], mediaQueries.only, css.apply(void 0, arguments));\n };\n },\n and: function and(direction) {\n return function () {\n return css([\"@media \", \"{\", \";}\"], mediaQueries[direction], css.apply(void 0, arguments));\n };\n }\n };\n acc.matches[label] = {\n only: function only() {\n return window.matchMedia(mediaQueries.only).matches;\n },\n and: function and(direction) {\n return window.matchMedia(mediaQueries[direction]).matches;\n }\n };\n return acc;\n}, {\n css: {},\n matches: {}\n});\nexport var MediaContext = createContext();\nvar _default = {\n media: media\n};\nexport default _default;\n;\n\n(function () {\n var reactHotLoader = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.default : undefined;\n\n if (!reactHotLoader) {\n return;\n }\n\n reactHotLoader.register(ranges, \"ranges\", \"/home/vsts/work/1/s/src/helpers/responsive.js\");\n reactHotLoader.register(media, \"media\", \"/home/vsts/work/1/s/src/helpers/responsive.js\");\n reactHotLoader.register(MediaContext, \"MediaContext\", \"/home/vsts/work/1/s/src/helpers/responsive.js\");\n reactHotLoader.register(_default, \"default\", \"/home/vsts/work/1/s/src/helpers/responsive.js\");\n})();\n\n;\n\n(function () {\n var leaveModule = typeof reactHotLoaderGlobal !== 'undefined' ? reactHotLoaderGlobal.leaveModule : undefined;\n leaveModule && leaveModule(module);\n})();","import * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport useEventCallback from '../utils/useEventCallback';\nvar useEnhancedEffect = typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect;\n/**\n * @ignore - internal component.\n */\n\nfunction Ripple(props) {\n var classes = props.classes,\n _props$pulsate = props.pulsate,\n pulsate = _props$pulsate === void 0 ? false : _props$pulsate,\n rippleX = props.rippleX,\n rippleY = props.rippleY,\n rippleSize = props.rippleSize,\n inProp = props.in,\n _props$onExited = props.onExited,\n onExited = _props$onExited === void 0 ? function () {} : _props$onExited,\n timeout = props.timeout;\n\n var _React$useState = React.useState(false),\n leaving = _React$useState[0],\n setLeaving = _React$useState[1];\n\n var rippleClassName = clsx(classes.ripple, classes.rippleVisible, pulsate && classes.ripplePulsate);\n var rippleStyles = {\n width: rippleSize,\n height: rippleSize,\n top: -(rippleSize / 2) + rippleY,\n left: -(rippleSize / 2) + rippleX\n };\n var childClassName = clsx(classes.child, leaving && classes.childLeaving, pulsate && classes.childPulsate);\n var handleExited = useEventCallback(onExited); // Ripple is used for user feedback (e.g. click or press) so we want to apply styles with the highest priority\n\n useEnhancedEffect(function () {\n if (!inProp) {\n // react-transition-group#onExit\n setLeaving(true); // react-transition-group#onExited\n\n var timeoutId = setTimeout(handleExited, timeout);\n return function () {\n clearTimeout(timeoutId);\n };\n }\n\n return undefined;\n }, [handleExited, inProp, timeout]);\n return /*#__PURE__*/React.createElement(\"span\", {\n className: rippleClassName,\n style: rippleStyles\n }, /*#__PURE__*/React.createElement(\"span\", {\n className: childClassName\n }));\n}\n\nprocess.env.NODE_ENV !== \"production\" ? Ripple.propTypes = {\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object.isRequired,\n\n /**\n * @ignore - injected from TransitionGroup\n */\n in: PropTypes.bool,\n\n /**\n * @ignore - injected from TransitionGroup\n */\n onExited: PropTypes.func,\n\n /**\n * If `true`, the ripple pulsates, typically indicating the keyboard focus state of an element.\n */\n pulsate: PropTypes.bool,\n\n /**\n * Diameter of the ripple.\n */\n rippleSize: PropTypes.number,\n\n /**\n * Horizontal position of the ripple center.\n */\n rippleX: PropTypes.number,\n\n /**\n * Vertical position of the ripple center.\n */\n rippleY: PropTypes.number,\n\n /**\n * exit delay\n */\n timeout: PropTypes.number.isRequired\n} : void 0;\nexport default Ripple;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _toConsumableArray from \"@babel/runtime/helpers/esm/toConsumableArray\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { TransitionGroup } from 'react-transition-group';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport Ripple from './Ripple';\nvar DURATION = 550;\nexport var DELAY_RIPPLE = 80;\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: {\n overflow: 'hidden',\n pointerEvents: 'none',\n position: 'absolute',\n zIndex: 0,\n top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n borderRadius: 'inherit'\n },\n\n /* Styles applied to the internal `Ripple` components `ripple` class. */\n ripple: {\n opacity: 0,\n position: 'absolute'\n },\n\n /* Styles applied to the internal `Ripple` components `rippleVisible` class. */\n rippleVisible: {\n opacity: 0.3,\n transform: 'scale(1)',\n animation: \"$enter \".concat(DURATION, \"ms \").concat(theme.transitions.easing.easeInOut)\n },\n\n /* Styles applied to the internal `Ripple` components `ripplePulsate` class. */\n ripplePulsate: {\n animationDuration: \"\".concat(theme.transitions.duration.shorter, \"ms\")\n },\n\n /* Styles applied to the internal `Ripple` components `child` class. */\n child: {\n opacity: 1,\n display: 'block',\n width: '100%',\n height: '100%',\n borderRadius: '50%',\n backgroundColor: 'currentColor'\n },\n\n /* Styles applied to the internal `Ripple` components `childLeaving` class. */\n childLeaving: {\n opacity: 0,\n animation: \"$exit \".concat(DURATION, \"ms \").concat(theme.transitions.easing.easeInOut)\n },\n\n /* Styles applied to the internal `Ripple` components `childPulsate` class. */\n childPulsate: {\n position: 'absolute',\n left: 0,\n top: 0,\n animation: \"$pulsate 2500ms \".concat(theme.transitions.easing.easeInOut, \" 200ms infinite\")\n },\n '@keyframes enter': {\n '0%': {\n transform: 'scale(0)',\n opacity: 0.1\n },\n '100%': {\n transform: 'scale(1)',\n opacity: 0.3\n }\n },\n '@keyframes exit': {\n '0%': {\n opacity: 1\n },\n '100%': {\n opacity: 0\n }\n },\n '@keyframes pulsate': {\n '0%': {\n transform: 'scale(1)'\n },\n '50%': {\n transform: 'scale(0.92)'\n },\n '100%': {\n transform: 'scale(1)'\n }\n }\n };\n};\n/**\n * @ignore - internal component.\n *\n * TODO v5: Make private\n */\n\nvar TouchRipple = /*#__PURE__*/React.forwardRef(function TouchRipple(props, ref) {\n var _props$center = props.center,\n centerProp = _props$center === void 0 ? false : _props$center,\n classes = props.classes,\n className = props.className,\n other = _objectWithoutProperties(props, [\"center\", \"classes\", \"className\"]);\n\n var _React$useState = React.useState([]),\n ripples = _React$useState[0],\n setRipples = _React$useState[1];\n\n var nextKey = React.useRef(0);\n var rippleCallback = React.useRef(null);\n React.useEffect(function () {\n if (rippleCallback.current) {\n rippleCallback.current();\n rippleCallback.current = null;\n }\n }, [ripples]); // Used to filter out mouse emulated events on mobile.\n\n var ignoringMouseDown = React.useRef(false); // We use a timer in order to only show the ripples for touch \"click\" like events.\n // We don't want to display the ripple for touch scroll events.\n\n var startTimer = React.useRef(null); // This is the hook called once the previous timeout is ready.\n\n var startTimerCommit = React.useRef(null);\n var container = React.useRef(null);\n React.useEffect(function () {\n return function () {\n clearTimeout(startTimer.current);\n };\n }, []);\n var startCommit = React.useCallback(function (params) {\n var pulsate = params.pulsate,\n rippleX = params.rippleX,\n rippleY = params.rippleY,\n rippleSize = params.rippleSize,\n cb = params.cb;\n setRipples(function (oldRipples) {\n return [].concat(_toConsumableArray(oldRipples), [/*#__PURE__*/React.createElement(Ripple, {\n key: nextKey.current,\n classes: classes,\n timeout: DURATION,\n pulsate: pulsate,\n rippleX: rippleX,\n rippleY: rippleY,\n rippleSize: rippleSize\n })]);\n });\n nextKey.current += 1;\n rippleCallback.current = cb;\n }, [classes]);\n var start = React.useCallback(function () {\n var event = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n var cb = arguments.length > 2 ? arguments[2] : undefined;\n var _options$pulsate = options.pulsate,\n pulsate = _options$pulsate === void 0 ? false : _options$pulsate,\n _options$center = options.center,\n center = _options$center === void 0 ? centerProp || options.pulsate : _options$center,\n _options$fakeElement = options.fakeElement,\n fakeElement = _options$fakeElement === void 0 ? false : _options$fakeElement;\n\n if (event.type === 'mousedown' && ignoringMouseDown.current) {\n ignoringMouseDown.current = false;\n return;\n }\n\n if (event.type === 'touchstart') {\n ignoringMouseDown.current = true;\n }\n\n var element = fakeElement ? null : container.current;\n var rect = element ? element.getBoundingClientRect() : {\n width: 0,\n height: 0,\n left: 0,\n top: 0\n }; // Get the size of the ripple\n\n var rippleX;\n var rippleY;\n var rippleSize;\n\n if (center || event.clientX === 0 && event.clientY === 0 || !event.clientX && !event.touches) {\n rippleX = Math.round(rect.width / 2);\n rippleY = Math.round(rect.height / 2);\n } else {\n var _ref = event.touches ? event.touches[0] : event,\n clientX = _ref.clientX,\n clientY = _ref.clientY;\n\n rippleX = Math.round(clientX - rect.left);\n rippleY = Math.round(clientY - rect.top);\n }\n\n if (center) {\n rippleSize = Math.sqrt((2 * Math.pow(rect.width, 2) + Math.pow(rect.height, 2)) / 3); // For some reason the animation is broken on Mobile Chrome if the size if even.\n\n if (rippleSize % 2 === 0) {\n rippleSize += 1;\n }\n } else {\n var sizeX = Math.max(Math.abs((element ? element.clientWidth : 0) - rippleX), rippleX) * 2 + 2;\n var sizeY = Math.max(Math.abs((element ? element.clientHeight : 0) - rippleY), rippleY) * 2 + 2;\n rippleSize = Math.sqrt(Math.pow(sizeX, 2) + Math.pow(sizeY, 2));\n } // Touche devices\n\n\n if (event.touches) {\n // check that this isn't another touchstart due to multitouch\n // otherwise we will only clear a single timer when unmounting while two\n // are running\n if (startTimerCommit.current === null) {\n // Prepare the ripple effect.\n startTimerCommit.current = function () {\n startCommit({\n pulsate: pulsate,\n rippleX: rippleX,\n rippleY: rippleY,\n rippleSize: rippleSize,\n cb: cb\n });\n }; // Delay the execution of the ripple effect.\n\n\n startTimer.current = setTimeout(function () {\n if (startTimerCommit.current) {\n startTimerCommit.current();\n startTimerCommit.current = null;\n }\n }, DELAY_RIPPLE); // We have to make a tradeoff with this value.\n }\n } else {\n startCommit({\n pulsate: pulsate,\n rippleX: rippleX,\n rippleY: rippleY,\n rippleSize: rippleSize,\n cb: cb\n });\n }\n }, [centerProp, startCommit]);\n var pulsate = React.useCallback(function () {\n start({}, {\n pulsate: true\n });\n }, [start]);\n var stop = React.useCallback(function (event, cb) {\n clearTimeout(startTimer.current); // The touch interaction occurs too quickly.\n // We still want to show ripple effect.\n\n if (event.type === 'touchend' && startTimerCommit.current) {\n event.persist();\n startTimerCommit.current();\n startTimerCommit.current = null;\n startTimer.current = setTimeout(function () {\n stop(event, cb);\n });\n return;\n }\n\n startTimerCommit.current = null;\n setRipples(function (oldRipples) {\n if (oldRipples.length > 0) {\n return oldRipples.slice(1);\n }\n\n return oldRipples;\n });\n rippleCallback.current = cb;\n }, []);\n React.useImperativeHandle(ref, function () {\n return {\n pulsate: pulsate,\n start: start,\n stop: stop\n };\n }, [pulsate, start, stop]);\n return /*#__PURE__*/React.createElement(\"span\", _extends({\n className: clsx(classes.root, className),\n ref: container\n }, other), /*#__PURE__*/React.createElement(TransitionGroup, {\n component: null,\n exit: true\n }, ripples));\n});\nprocess.env.NODE_ENV !== \"production\" ? TouchRipple.propTypes = {\n /**\n * If `true`, the ripple starts at the center of the component\n * rather than at the point of interaction.\n */\n center: PropTypes.bool,\n\n /**\n * Override or extend the styles applied to the component.\n * See [CSS API](#css) below for more details.\n */\n classes: PropTypes.object.isRequired,\n\n /**\n * @ignore\n */\n className: PropTypes.string\n} : void 0;\nexport default withStyles(styles, {\n flip: false,\n name: 'MuiTouchRipple'\n})( /*#__PURE__*/React.memo(TouchRipple));","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport * as ReactDOM from 'react-dom';\nimport clsx from 'clsx';\nimport { elementTypeAcceptingRef, refType } from '@material-ui/utils';\nimport useForkRef from '../utils/useForkRef';\nimport useEventCallback from '../utils/useEventCallback';\nimport deprecatedPropType from '../utils/deprecatedPropType';\nimport withStyles from '../styles/withStyles';\nimport useIsFocusVisible from '../utils/useIsFocusVisible';\nimport TouchRipple from './TouchRipple';\nexport var styles = {\n /* Styles applied to the root element. */\n root: {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n position: 'relative',\n WebkitTapHighlightColor: 'transparent',\n backgroundColor: 'transparent',\n // Reset default value\n // We disable the focus ring for mouse, touch and keyboard users.\n outline: 0,\n border: 0,\n margin: 0,\n // Remove the margin in Safari\n borderRadius: 0,\n padding: 0,\n // Remove the padding in Firefox\n cursor: 'pointer',\n userSelect: 'none',\n verticalAlign: 'middle',\n '-moz-appearance': 'none',\n // Reset\n '-webkit-appearance': 'none',\n // Reset\n textDecoration: 'none',\n // So we take precedent over the style of a native element.\n color: 'inherit',\n '&::-moz-focus-inner': {\n borderStyle: 'none' // Remove Firefox dotted outline.\n\n },\n '&$disabled': {\n pointerEvents: 'none',\n // Disable link interactions\n cursor: 'default'\n },\n '@media print': {\n colorAdjust: 'exact'\n }\n },\n\n /* Pseudo-class applied to the root element if `disabled={true}`. */\n disabled: {},\n\n /* Pseudo-class applied to the root element if keyboard focused. */\n focusVisible: {}\n};\n/**\n * `ButtonBase` contains as few styles as possible.\n * It aims to be a simple building block for creating a button.\n * It contains a load of style reset and some focus/ripple logic.\n */\n\nvar ButtonBase = /*#__PURE__*/React.forwardRef(function ButtonBase(props, ref) {\n var action = props.action,\n buttonRefProp = props.buttonRef,\n _props$centerRipple = props.centerRipple,\n centerRipple = _props$centerRipple === void 0 ? false : _props$centerRipple,\n children = props.children,\n classes = props.classes,\n className = props.className,\n _props$component = props.component,\n component = _props$component === void 0 ? 'button' : _props$component,\n _props$disabled = props.disabled,\n disabled = _props$disabled === void 0 ? false : _props$disabled,\n _props$disableRipple = props.disableRipple,\n disableRipple = _props$disableRipple === void 0 ? false : _props$disableRipple,\n _props$disableTouchRi = props.disableTouchRipple,\n disableTouchRipple = _props$disableTouchRi === void 0 ? false : _props$disableTouchRi,\n _props$focusRipple = props.focusRipple,\n focusRipple = _props$focusRipple === void 0 ? false : _props$focusRipple,\n focusVisibleClassName = props.focusVisibleClassName,\n onBlur = props.onBlur,\n onClick = props.onClick,\n onFocus = props.onFocus,\n onFocusVisible = props.onFocusVisible,\n onKeyDown = props.onKeyDown,\n onKeyUp = props.onKeyUp,\n onMouseDown = props.onMouseDown,\n onMouseLeave = props.onMouseLeave,\n onMouseUp = props.onMouseUp,\n onTouchEnd = props.onTouchEnd,\n onTouchMove = props.onTouchMove,\n onTouchStart = props.onTouchStart,\n onDragLeave = props.onDragLeave,\n _props$tabIndex = props.tabIndex,\n tabIndex = _props$tabIndex === void 0 ? 0 : _props$tabIndex,\n TouchRippleProps = props.TouchRippleProps,\n _props$type = props.type,\n type = _props$type === void 0 ? 'button' : _props$type,\n other = _objectWithoutProperties(props, [\"action\", \"buttonRef\", \"centerRipple\", \"children\", \"classes\", \"className\", \"component\", \"disabled\", \"disableRipple\", \"disableTouchRipple\", \"focusRipple\", \"focusVisibleClassName\", \"onBlur\", \"onClick\", \"onFocus\", \"onFocusVisible\", \"onKeyDown\", \"onKeyUp\", \"onMouseDown\", \"onMouseLeave\", \"onMouseUp\", \"onTouchEnd\", \"onTouchMove\", \"onTouchStart\", \"onDragLeave\", \"tabIndex\", \"TouchRippleProps\", \"type\"]);\n\n var buttonRef = React.useRef(null);\n\n function getButtonNode() {\n // #StrictMode ready\n return ReactDOM.findDOMNode(buttonRef.current);\n }\n\n var rippleRef = React.useRef(null);\n\n var _React$useState = React.useState(false),\n focusVisible = _React$useState[0],\n setFocusVisible = _React$useState[1];\n\n if (disabled && focusVisible) {\n setFocusVisible(false);\n }\n\n var _useIsFocusVisible = useIsFocusVisible(),\n isFocusVisible = _useIsFocusVisible.isFocusVisible,\n onBlurVisible = _useIsFocusVisible.onBlurVisible,\n focusVisibleRef = _useIsFocusVisible.ref;\n\n React.useImperativeHandle(action, function () {\n return {\n focusVisible: function focusVisible() {\n setFocusVisible(true);\n buttonRef.current.focus();\n }\n };\n }, []);\n React.useEffect(function () {\n if (focusVisible && focusRipple && !disableRipple) {\n rippleRef.current.pulsate();\n }\n }, [disableRipple, focusRipple, focusVisible]);\n\n function useRippleHandler(rippleAction, eventCallback) {\n var skipRippleAction = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : disableTouchRipple;\n return useEventCallback(function (event) {\n if (eventCallback) {\n eventCallback(event);\n }\n\n var ignore = skipRippleAction;\n\n if (!ignore && rippleRef.current) {\n rippleRef.current[rippleAction](event);\n }\n\n return true;\n });\n }\n\n var handleMouseDown = useRippleHandler('start', onMouseDown);\n var handleDragLeave = useRippleHandler('stop', onDragLeave);\n var handleMouseUp = useRippleHandler('stop', onMouseUp);\n var handleMouseLeave = useRippleHandler('stop', function (event) {\n if (focusVisible) {\n event.preventDefault();\n }\n\n if (onMouseLeave) {\n onMouseLeave(event);\n }\n });\n var handleTouchStart = useRippleHandler('start', onTouchStart);\n var handleTouchEnd = useRippleHandler('stop', onTouchEnd);\n var handleTouchMove = useRippleHandler('stop', onTouchMove);\n var handleBlur = useRippleHandler('stop', function (event) {\n if (focusVisible) {\n onBlurVisible(event);\n setFocusVisible(false);\n }\n\n if (onBlur) {\n onBlur(event);\n }\n }, false);\n var handleFocus = useEventCallback(function (event) {\n // Fix for https://github.com/facebook/react/issues/7769\n if (!buttonRef.current) {\n buttonRef.current = event.currentTarget;\n }\n\n if (isFocusVisible(event)) {\n setFocusVisible(true);\n\n if (onFocusVisible) {\n onFocusVisible(event);\n }\n }\n\n if (onFocus) {\n onFocus(event);\n }\n });\n\n var isNonNativeButton = function isNonNativeButton() {\n var button = getButtonNode();\n return component && component !== 'button' && !(button.tagName === 'A' && button.href);\n };\n /**\n * IE 11 shim for https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/repeat\n */\n\n\n var keydownRef = React.useRef(false);\n var handleKeyDown = useEventCallback(function (event) {\n // Check if key is already down to avoid repeats being counted as multiple activations\n if (focusRipple && !keydownRef.current && focusVisible && rippleRef.current && event.key === ' ') {\n keydownRef.current = true;\n event.persist();\n rippleRef.current.stop(event, function () {\n rippleRef.current.start(event);\n });\n }\n\n if (event.target === event.currentTarget && isNonNativeButton() && event.key === ' ') {\n event.preventDefault();\n }\n\n if (onKeyDown) {\n onKeyDown(event);\n } // Keyboard accessibility for non interactive elements\n\n\n if (event.target === event.currentTarget && isNonNativeButton() && event.key === 'Enter' && !disabled) {\n event.preventDefault();\n\n if (onClick) {\n onClick(event);\n }\n }\n });\n var handleKeyUp = useEventCallback(function (event) {\n // calling preventDefault in keyUp on a