;\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","function _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nfunction _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\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.\"); }\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); }\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; }\nfunction _iterableToArrayLimit(r, l) { var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\n/**\n * @fileOverview Default Tooltip Content\n */\n\nimport React from 'react';\nimport sortBy from 'lodash/sortBy';\nimport isNil from 'lodash/isNil';\nimport clsx from 'clsx';\nimport { isNumOrStr } from '../util/DataUtils';\nfunction defaultFormatter(value) {\n return Array.isArray(value) && isNumOrStr(value[0]) && isNumOrStr(value[1]) ? value.join(' ~ ') : value;\n}\nexport var DefaultTooltipContent = function DefaultTooltipContent(props) {\n var _props$separator = props.separator,\n separator = _props$separator === void 0 ? ' : ' : _props$separator,\n _props$contentStyle = props.contentStyle,\n contentStyle = _props$contentStyle === void 0 ? {} : _props$contentStyle,\n _props$itemStyle = props.itemStyle,\n itemStyle = _props$itemStyle === void 0 ? {} : _props$itemStyle,\n _props$labelStyle = props.labelStyle,\n labelStyle = _props$labelStyle === void 0 ? {} : _props$labelStyle,\n payload = props.payload,\n formatter = props.formatter,\n itemSorter = props.itemSorter,\n wrapperClassName = props.wrapperClassName,\n labelClassName = props.labelClassName,\n label = props.label,\n labelFormatter = props.labelFormatter,\n _props$accessibilityL = props.accessibilityLayer,\n accessibilityLayer = _props$accessibilityL === void 0 ? false : _props$accessibilityL;\n var renderContent = function renderContent() {\n if (payload && payload.length) {\n var listStyle = {\n padding: 0,\n margin: 0\n };\n var items = (itemSorter ? sortBy(payload, itemSorter) : payload).map(function (entry, i) {\n if (entry.type === 'none') {\n return null;\n }\n var finalItemStyle = _objectSpread({\n display: 'block',\n paddingTop: 4,\n paddingBottom: 4,\n color: entry.color || '#000'\n }, itemStyle);\n var finalFormatter = entry.formatter || formatter || defaultFormatter;\n var value = entry.value,\n name = entry.name;\n var finalValue = value;\n var finalName = name;\n if (finalFormatter && finalValue != null && finalName != null) {\n var formatted = finalFormatter(value, name, entry, i, payload);\n if (Array.isArray(formatted)) {\n var _formatted = _slicedToArray(formatted, 2);\n finalValue = _formatted[0];\n finalName = _formatted[1];\n } else {\n finalValue = formatted;\n }\n }\n return (\n /*#__PURE__*/\n // eslint-disable-next-line react/no-array-index-key\n React.createElement(\"li\", {\n className: \"recharts-tooltip-item\",\n key: \"tooltip-item-\".concat(i),\n style: finalItemStyle\n }, isNumOrStr(finalName) ? /*#__PURE__*/React.createElement(\"span\", {\n className: \"recharts-tooltip-item-name\"\n }, finalName) : null, isNumOrStr(finalName) ? /*#__PURE__*/React.createElement(\"span\", {\n className: \"recharts-tooltip-item-separator\"\n }, separator) : null, /*#__PURE__*/React.createElement(\"span\", {\n className: \"recharts-tooltip-item-value\"\n }, finalValue), /*#__PURE__*/React.createElement(\"span\", {\n className: \"recharts-tooltip-item-unit\"\n }, entry.unit || ''))\n );\n });\n return /*#__PURE__*/React.createElement(\"ul\", {\n className: \"recharts-tooltip-item-list\",\n style: listStyle\n }, items);\n }\n return null;\n };\n var finalStyle = _objectSpread({\n margin: 0,\n padding: 10,\n backgroundColor: '#fff',\n border: '1px solid #ccc',\n whiteSpace: 'nowrap'\n }, contentStyle);\n var finalLabelStyle = _objectSpread({\n margin: 0\n }, labelStyle);\n var hasLabel = !isNil(label);\n var finalLabel = hasLabel ? label : '';\n var wrapperCN = clsx('recharts-default-tooltip', wrapperClassName);\n var labelCN = clsx('recharts-tooltip-label', labelClassName);\n if (hasLabel && labelFormatter && payload !== undefined && payload !== null) {\n finalLabel = labelFormatter(label, payload);\n }\n var accessibilityAttributes = accessibilityLayer ? {\n role: 'status',\n 'aria-live': 'assertive'\n } : {};\n return /*#__PURE__*/React.createElement(\"div\", _extends({\n className: wrapperCN,\n style: finalStyle\n }, accessibilityAttributes), /*#__PURE__*/React.createElement(\"p\", {\n className: labelCN,\n style: finalLabelStyle\n }, /*#__PURE__*/React.isValidElement(finalLabel) ? finalLabel : \"\".concat(finalLabel)), renderContent());\n};","function _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\nimport clsx from 'clsx';\nimport { isNumber } from '../DataUtils';\nvar CSS_CLASS_PREFIX = 'recharts-tooltip-wrapper';\nvar TOOLTIP_HIDDEN = {\n visibility: 'hidden'\n};\nexport function getTooltipCSSClassName(_ref) {\n var coordinate = _ref.coordinate,\n translateX = _ref.translateX,\n translateY = _ref.translateY;\n return clsx(CSS_CLASS_PREFIX, _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, \"\".concat(CSS_CLASS_PREFIX, \"-right\"), isNumber(translateX) && coordinate && isNumber(coordinate.x) && translateX >= coordinate.x), \"\".concat(CSS_CLASS_PREFIX, \"-left\"), isNumber(translateX) && coordinate && isNumber(coordinate.x) && translateX < coordinate.x), \"\".concat(CSS_CLASS_PREFIX, \"-bottom\"), isNumber(translateY) && coordinate && isNumber(coordinate.y) && translateY >= coordinate.y), \"\".concat(CSS_CLASS_PREFIX, \"-top\"), isNumber(translateY) && coordinate && isNumber(coordinate.y) && translateY < coordinate.y));\n}\nexport function getTooltipTranslateXY(_ref2) {\n var allowEscapeViewBox = _ref2.allowEscapeViewBox,\n coordinate = _ref2.coordinate,\n key = _ref2.key,\n offsetTopLeft = _ref2.offsetTopLeft,\n position = _ref2.position,\n reverseDirection = _ref2.reverseDirection,\n tooltipDimension = _ref2.tooltipDimension,\n viewBox = _ref2.viewBox,\n viewBoxDimension = _ref2.viewBoxDimension;\n if (position && isNumber(position[key])) {\n return position[key];\n }\n var negative = coordinate[key] - tooltipDimension - offsetTopLeft;\n var positive = coordinate[key] + offsetTopLeft;\n if (allowEscapeViewBox[key]) {\n return reverseDirection[key] ? negative : positive;\n }\n if (reverseDirection[key]) {\n var _tooltipBoundary = negative;\n var _viewBoxBoundary = viewBox[key];\n if (_tooltipBoundary < _viewBoxBoundary) {\n return Math.max(positive, viewBox[key]);\n }\n return Math.max(negative, viewBox[key]);\n }\n var tooltipBoundary = positive + tooltipDimension;\n var viewBoxBoundary = viewBox[key] + viewBoxDimension;\n if (tooltipBoundary > viewBoxBoundary) {\n return Math.max(negative, viewBox[key]);\n }\n return Math.max(positive, viewBox[key]);\n}\nexport function getTransformStyle(_ref3) {\n var translateX = _ref3.translateX,\n translateY = _ref3.translateY,\n useTranslate3d = _ref3.useTranslate3d;\n return {\n transform: useTranslate3d ? \"translate3d(\".concat(translateX, \"px, \").concat(translateY, \"px, 0)\") : \"translate(\".concat(translateX, \"px, \").concat(translateY, \"px)\")\n };\n}\nexport function getTooltipTranslate(_ref4) {\n var allowEscapeViewBox = _ref4.allowEscapeViewBox,\n coordinate = _ref4.coordinate,\n offsetTopLeft = _ref4.offsetTopLeft,\n position = _ref4.position,\n reverseDirection = _ref4.reverseDirection,\n tooltipBox = _ref4.tooltipBox,\n useTranslate3d = _ref4.useTranslate3d,\n viewBox = _ref4.viewBox;\n var cssProperties, translateX, translateY;\n if (tooltipBox.height > 0 && tooltipBox.width > 0 && coordinate) {\n translateX = getTooltipTranslateXY({\n allowEscapeViewBox: allowEscapeViewBox,\n coordinate: coordinate,\n key: 'x',\n offsetTopLeft: offsetTopLeft,\n position: position,\n reverseDirection: reverseDirection,\n tooltipDimension: tooltipBox.width,\n viewBox: viewBox,\n viewBoxDimension: viewBox.width\n });\n translateY = getTooltipTranslateXY({\n allowEscapeViewBox: allowEscapeViewBox,\n coordinate: coordinate,\n key: 'y',\n offsetTopLeft: offsetTopLeft,\n position: position,\n reverseDirection: reverseDirection,\n tooltipDimension: tooltipBox.height,\n viewBox: viewBox,\n viewBoxDimension: viewBox.height\n });\n cssProperties = getTransformStyle({\n translateX: translateX,\n translateY: translateY,\n useTranslate3d: useTranslate3d\n });\n } else {\n cssProperties = TOOLTIP_HIDDEN;\n }\n return {\n cssProperties: cssProperties,\n cssClasses: getTooltipCSSClassName({\n translateX: translateX,\n translateY: translateY,\n coordinate: coordinate\n })\n };\n}","function _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\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, _toPropertyKey(descriptor.key), descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }\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); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\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); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\nimport React, { PureComponent } from 'react';\nimport { getTooltipTranslate } from '../util/tooltip/translate';\nvar EPSILON = 1;\nexport var TooltipBoundingBox = /*#__PURE__*/function (_PureComponent) {\n function TooltipBoundingBox() {\n var _this;\n _classCallCheck(this, TooltipBoundingBox);\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n _this = _callSuper(this, TooltipBoundingBox, [].concat(args));\n _defineProperty(_this, \"state\", {\n dismissed: false,\n dismissedAtCoordinate: {\n x: 0,\n y: 0\n },\n lastBoundingBox: {\n width: -1,\n height: -1\n }\n });\n _defineProperty(_this, \"handleKeyDown\", function (event) {\n if (event.key === 'Escape') {\n var _this$props$coordinat, _this$props$coordinat2, _this$props$coordinat3, _this$props$coordinat4;\n _this.setState({\n dismissed: true,\n dismissedAtCoordinate: {\n x: (_this$props$coordinat = (_this$props$coordinat2 = _this.props.coordinate) === null || _this$props$coordinat2 === void 0 ? void 0 : _this$props$coordinat2.x) !== null && _this$props$coordinat !== void 0 ? _this$props$coordinat : 0,\n y: (_this$props$coordinat3 = (_this$props$coordinat4 = _this.props.coordinate) === null || _this$props$coordinat4 === void 0 ? void 0 : _this$props$coordinat4.y) !== null && _this$props$coordinat3 !== void 0 ? _this$props$coordinat3 : 0\n }\n });\n }\n });\n return _this;\n }\n _inherits(TooltipBoundingBox, _PureComponent);\n return _createClass(TooltipBoundingBox, [{\n key: \"updateBBox\",\n value: function updateBBox() {\n if (this.wrapperNode && this.wrapperNode.getBoundingClientRect) {\n var box = this.wrapperNode.getBoundingClientRect();\n if (Math.abs(box.width - this.state.lastBoundingBox.width) > EPSILON || Math.abs(box.height - this.state.lastBoundingBox.height) > EPSILON) {\n this.setState({\n lastBoundingBox: {\n width: box.width,\n height: box.height\n }\n });\n }\n } else if (this.state.lastBoundingBox.width !== -1 || this.state.lastBoundingBox.height !== -1) {\n this.setState({\n lastBoundingBox: {\n width: -1,\n height: -1\n }\n });\n }\n }\n }, {\n key: \"componentDidMount\",\n value: function componentDidMount() {\n document.addEventListener('keydown', this.handleKeyDown);\n this.updateBBox();\n }\n }, {\n key: \"componentWillUnmount\",\n value: function componentWillUnmount() {\n document.removeEventListener('keydown', this.handleKeyDown);\n }\n }, {\n key: \"componentDidUpdate\",\n value: function componentDidUpdate() {\n var _this$props$coordinat5, _this$props$coordinat6;\n if (this.props.active) {\n this.updateBBox();\n }\n if (!this.state.dismissed) {\n return;\n }\n if (((_this$props$coordinat5 = this.props.coordinate) === null || _this$props$coordinat5 === void 0 ? void 0 : _this$props$coordinat5.x) !== this.state.dismissedAtCoordinate.x || ((_this$props$coordinat6 = this.props.coordinate) === null || _this$props$coordinat6 === void 0 ? void 0 : _this$props$coordinat6.y) !== this.state.dismissedAtCoordinate.y) {\n this.state.dismissed = false;\n }\n }\n }, {\n key: \"render\",\n value: function render() {\n var _this2 = this;\n var _this$props = this.props,\n active = _this$props.active,\n allowEscapeViewBox = _this$props.allowEscapeViewBox,\n animationDuration = _this$props.animationDuration,\n animationEasing = _this$props.animationEasing,\n children = _this$props.children,\n coordinate = _this$props.coordinate,\n hasPayload = _this$props.hasPayload,\n isAnimationActive = _this$props.isAnimationActive,\n offset = _this$props.offset,\n position = _this$props.position,\n reverseDirection = _this$props.reverseDirection,\n useTranslate3d = _this$props.useTranslate3d,\n viewBox = _this$props.viewBox,\n wrapperStyle = _this$props.wrapperStyle;\n var _getTooltipTranslate = getTooltipTranslate({\n allowEscapeViewBox: allowEscapeViewBox,\n coordinate: coordinate,\n offsetTopLeft: offset,\n position: position,\n reverseDirection: reverseDirection,\n tooltipBox: this.state.lastBoundingBox,\n useTranslate3d: useTranslate3d,\n viewBox: viewBox\n }),\n cssClasses = _getTooltipTranslate.cssClasses,\n cssProperties = _getTooltipTranslate.cssProperties;\n var outerStyle = _objectSpread(_objectSpread({\n transition: isAnimationActive && active ? \"transform \".concat(animationDuration, \"ms \").concat(animationEasing) : undefined\n }, cssProperties), {}, {\n pointerEvents: 'none',\n visibility: !this.state.dismissed && active && hasPayload ? 'visible' : 'hidden',\n position: 'absolute',\n top: 0,\n left: 0\n }, wrapperStyle);\n return (\n /*#__PURE__*/\n // This element allow listening to the `Escape` key.\n // See https://github.com/recharts/recharts/pull/2925\n React.createElement(\"div\", {\n tabIndex: -1,\n className: cssClasses,\n style: outerStyle,\n ref: function ref(node) {\n _this2.wrapperNode = node;\n }\n }, children)\n );\n }\n }]);\n}(PureComponent);","function _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\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, _toPropertyKey(descriptor.key), descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }\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); }\nfunction _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError(\"this hasn't been initialised - super() hasn't been called\"); } return self; }\nfunction _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }\nfunction _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }\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); }\nfunction _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : i + \"\"; }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\n/**\n * @fileOverview Tooltip\n */\nimport React, { PureComponent } from 'react';\nimport { DefaultTooltipContent } from './DefaultTooltipContent';\nimport { TooltipBoundingBox } from './TooltipBoundingBox';\nimport { Global } from '../util/Global';\nimport { getUniqPayload } from '../util/payload/getUniqPayload';\nfunction defaultUniqBy(entry) {\n return entry.dataKey;\n}\nfunction renderContent(content, props) {\n if ( /*#__PURE__*/React.isValidElement(content)) {\n return /*#__PURE__*/React.cloneElement(content, props);\n }\n if (typeof content === 'function') {\n return /*#__PURE__*/React.createElement(content, props);\n }\n return /*#__PURE__*/React.createElement(DefaultTooltipContent, props);\n}\nexport var Tooltip = /*#__PURE__*/function (_PureComponent) {\n function Tooltip() {\n _classCallCheck(this, Tooltip);\n return _callSuper(this, Tooltip, arguments);\n }\n _inherits(Tooltip, _PureComponent);\n return _createClass(Tooltip, [{\n key: \"render\",\n value: function render() {\n var _this = this;\n var _this$props = this.props,\n active = _this$props.active,\n allowEscapeViewBox = _this$props.allowEscapeViewBox,\n animationDuration = _this$props.animationDuration,\n animationEasing = _this$props.animationEasing,\n content = _this$props.content,\n coordinate = _this$props.coordinate,\n filterNull = _this$props.filterNull,\n isAnimationActive = _this$props.isAnimationActive,\n offset = _this$props.offset,\n payload = _this$props.payload,\n payloadUniqBy = _this$props.payloadUniqBy,\n position = _this$props.position,\n reverseDirection = _this$props.reverseDirection,\n useTranslate3d = _this$props.useTranslate3d,\n viewBox = _this$props.viewBox,\n wrapperStyle = _this$props.wrapperStyle;\n var finalPayload = payload !== null && payload !== void 0 ? payload : [];\n if (filterNull && finalPayload.length) {\n finalPayload = getUniqPayload(payload.filter(function (entry) {\n return entry.value != null && (entry.hide !== true || _this.props.includeHidden);\n }), payloadUniqBy, defaultUniqBy);\n }\n var hasPayload = finalPayload.length > 0;\n return /*#__PURE__*/React.createElement(TooltipBoundingBox, {\n allowEscapeViewBox: allowEscapeViewBox,\n animationDuration: animationDuration,\n animationEasing: animationEasing,\n isAnimationActive: isAnimationActive,\n active: active,\n coordinate: coordinate,\n hasPayload: hasPayload,\n offset: offset,\n position: position,\n reverseDirection: reverseDirection,\n useTranslate3d: useTranslate3d,\n viewBox: viewBox,\n wrapperStyle: wrapperStyle\n }, renderContent(content, _objectSpread(_objectSpread({}, this.props), {}, {\n payload: finalPayload\n })));\n }\n }]);\n}(PureComponent);\n_defineProperty(Tooltip, \"displayName\", 'Tooltip');\n_defineProperty(Tooltip, \"defaultProps\", {\n accessibilityLayer: false,\n allowEscapeViewBox: {\n x: false,\n y: false\n },\n animationDuration: 400,\n animationEasing: 'ease',\n contentStyle: {},\n coordinate: {\n x: 0,\n y: 0\n },\n cursor: true,\n cursorStyle: {},\n filterNull: true,\n isAnimationActive: !Global.isSsr,\n itemStyle: {},\n labelStyle: {},\n offset: 10,\n reverseDirection: {\n x: false,\n y: false\n },\n separator: ' : ',\n trigger: 'hover',\n useTranslate3d: false,\n viewBox: {\n x: 0,\n y: 0,\n height: 0,\n width: 0\n },\n wrapperStyle: {}\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 '../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 margin: 0\n },\n\n /* Styles applied to the root element if `variant=\"body2\"`. */\n body2: theme.typography.body2,\n\n /* Styles applied to the root element if `variant=\"body1\"`. */\n body1: theme.typography.body1,\n\n /* Styles applied to the root element if `variant=\"caption\"`. */\n caption: theme.typography.caption,\n\n /* Styles applied to the root element if `variant=\"button\"`. */\n button: theme.typography.button,\n\n /* Styles applied to the root element if `variant=\"h1\"`. */\n h1: theme.typography.h1,\n\n /* Styles applied to the root element if `variant=\"h2\"`. */\n h2: theme.typography.h2,\n\n /* Styles applied to the root element if `variant=\"h3\"`. */\n h3: theme.typography.h3,\n\n /* Styles applied to the root element if `variant=\"h4\"`. */\n h4: theme.typography.h4,\n\n /* Styles applied to the root element if `variant=\"h5\"`. */\n h5: theme.typography.h5,\n\n /* Styles applied to the root element if `variant=\"h6\"`. */\n h6: theme.typography.h6,\n\n /* Styles applied to the root element if `variant=\"subtitle1\"`. */\n subtitle1: theme.typography.subtitle1,\n\n /* Styles applied to the root element if `variant=\"subtitle2\"`. */\n subtitle2: theme.typography.subtitle2,\n\n /* Styles applied to the root element if `variant=\"overline\"`. */\n overline: theme.typography.overline,\n\n /* Styles applied to the root element if `variant=\"srOnly\"`. Only accessible to screen readers. */\n srOnly: {\n position: 'absolute',\n height: 1,\n width: 1,\n overflow: 'hidden'\n },\n\n /* Styles applied to the root element if `align=\"left\"`. */\n alignLeft: {\n textAlign: 'left'\n },\n\n /* Styles applied to the root element if `align=\"center\"`. */\n alignCenter: {\n textAlign: 'center'\n },\n\n /* Styles applied to the root element if `align=\"right\"`. */\n alignRight: {\n textAlign: 'right'\n },\n\n /* Styles applied to the root element if `align=\"justify\"`. */\n alignJustify: {\n textAlign: 'justify'\n },\n\n /* Styles applied to the root element if `nowrap={true}`. */\n noWrap: {\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap'\n },\n\n /* Styles applied to the root element if `gutterBottom={true}`. */\n gutterBottom: {\n marginBottom: '0.35em'\n },\n\n /* Styles applied to the root element if `paragraph={true}`. */\n paragraph: {\n marginBottom: 16\n },\n\n /* Styles applied to the root element if `color=\"inherit\"`. */\n colorInherit: {\n color: 'inherit'\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 root element if `color=\"textPrimary\"`. */\n colorTextPrimary: {\n color: theme.palette.text.primary\n },\n\n /* Styles applied to the root element if `color=\"textSecondary\"`. */\n colorTextSecondary: {\n color: theme.palette.text.secondary\n },\n\n /* Styles applied to the root element if `color=\"error\"`. */\n colorError: {\n color: theme.palette.error.main\n },\n\n /* Styles applied to the root element if `display=\"inline\"`. */\n displayInline: {\n display: 'inline'\n },\n\n /* Styles applied to the root element if `display=\"block\"`. */\n displayBlock: {\n display: 'block'\n }\n };\n};\nvar defaultVariantMapping = {\n h1: 'h1',\n h2: 'h2',\n h3: 'h3',\n h4: 'h4',\n h5: 'h5',\n h6: 'h6',\n subtitle1: 'h6',\n subtitle2: 'h6',\n body1: 'p',\n body2: 'p'\n};\nvar Typography = /*#__PURE__*/React.forwardRef(function Typography(props, ref) {\n var _props$align = props.align,\n align = _props$align === void 0 ? 'inherit' : _props$align,\n classes = props.classes,\n className = props.className,\n _props$color = props.color,\n color = _props$color === void 0 ? 'initial' : _props$color,\n component = props.component,\n _props$display = props.display,\n display = _props$display === void 0 ? 'initial' : _props$display,\n _props$gutterBottom = props.gutterBottom,\n gutterBottom = _props$gutterBottom === void 0 ? false : _props$gutterBottom,\n _props$noWrap = props.noWrap,\n noWrap = _props$noWrap === void 0 ? false : _props$noWrap,\n _props$paragraph = props.paragraph,\n paragraph = _props$paragraph === void 0 ? false : _props$paragraph,\n _props$variant = props.variant,\n variant = _props$variant === void 0 ? 'body1' : _props$variant,\n _props$variantMapping = props.variantMapping,\n variantMapping = _props$variantMapping === void 0 ? defaultVariantMapping : _props$variantMapping,\n other = _objectWithoutProperties(props, [\"align\", \"classes\", \"className\", \"color\", \"component\", \"display\", \"gutterBottom\", \"noWrap\", \"paragraph\", \"variant\", \"variantMapping\"]);\n\n var Component = component || (paragraph ? 'p' : variantMapping[variant] || defaultVariantMapping[variant]) || 'span';\n return /*#__PURE__*/React.createElement(Component, _extends({\n className: clsx(classes.root, className, variant !== 'inherit' && classes[variant], color !== 'initial' && classes[\"color\".concat(capitalize(color))], noWrap && classes.noWrap, gutterBottom && classes.gutterBottom, paragraph && classes.paragraph, align !== 'inherit' && classes[\"align\".concat(capitalize(align))], display !== 'initial' && classes[\"display\".concat(capitalize(display))]),\n ref: ref\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? Typography.propTypes = {\n /**\n * Set the text-align on the component.\n */\n align: PropTypes.oneOf(['inherit', 'left', 'center', 'right', 'justify']),\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 color of the component. It supports those theme colors that make sense for this component.\n */\n color: PropTypes.oneOf(['initial', 'inherit', 'primary', 'secondary', 'textPrimary', 'textSecondary', 'error']),\n\n /**\n * The component used for the root node.\n * Either a string to use a HTML element or a component.\n * Overrides the behavior of the `variantMapping` prop.\n */\n component: PropTypes\n /* @typescript-to-proptypes-ignore */\n .elementType,\n\n /**\n * Controls the display type\n */\n display: PropTypes.oneOf(['initial', 'block', 'inline']),\n\n /**\n * If `true`, the text will have a bottom margin.\n */\n gutterBottom: PropTypes.bool,\n\n /**\n * If `true`, the text will not wrap, but instead will truncate with a text overflow ellipsis.\n *\n * Note that text overflow can only happen with block or inline-block level elements\n * (the element needs to have a width in order to overflow).\n */\n noWrap: PropTypes.bool,\n\n /**\n * If `true`, the text will have a bottom margin.\n */\n paragraph: PropTypes.bool,\n\n /**\n * Applies the theme typography styles.\n */\n variant: PropTypes.oneOf(['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'subtitle1', 'subtitle2', 'body1', 'body2', 'caption', 'button', 'overline', 'srOnly', 'inherit']),\n\n /**\n * The component maps the variant prop to a range of different HTML element types.\n * For instance, subtitle1 to `