children such as `TableCell`.\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 DOM element or a component.\n */\n component: PropTypes.elementType,\n\n /**\n * If `true`, the table row will shade on hover.\n */\n hover: PropTypes.bool,\n\n /**\n * If `true`, the table row will have the selected shading.\n */\n selected: PropTypes.bool\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiTableRow'\n})(TableRow);","import _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport capitalize from '../utils/capitalize';\nimport { darken, fade, lighten } from '../styles/colorManipulator';\nimport TableContext from '../Table/TableContext';\nimport Tablelvl2Context from '../Table/Tablelvl2Context';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: _extends({}, theme.typography.body2, {\n display: 'table-cell',\n verticalAlign: 'inherit',\n // Workaround for a rendering bug with spanned columns in Chrome 62.0.\n // Removes the alpha (sets it to 1), and lightens or darkens the theme color.\n borderBottom: \"1px solid\\n \".concat(theme.palette.type === 'light' ? lighten(fade(theme.palette.divider, 1), 0.88) : darken(fade(theme.palette.divider, 1), 0.68)),\n textAlign: 'left',\n padding: 16\n }),\n\n /* Styles applied to the root element if `variant=\"head\"` or `context.table.head`. */\n head: {\n color: theme.palette.text.primary,\n lineHeight: theme.typography.pxToRem(24),\n fontWeight: theme.typography.fontWeightMedium\n },\n\n /* Styles applied to the root element if `variant=\"body\"` or `context.table.body`. */\n body: {\n color: theme.palette.text.primary\n },\n\n /* Styles applied to the root element if `variant=\"footer\"` or `context.table.footer`. */\n footer: {\n color: theme.palette.text.secondary,\n lineHeight: theme.typography.pxToRem(21),\n fontSize: theme.typography.pxToRem(12)\n },\n\n /* Styles applied to the root element if `size=\"small\"`. */\n sizeSmall: {\n padding: '6px 24px 6px 16px',\n '&:last-child': {\n paddingRight: 16\n },\n '&$paddingCheckbox': {\n width: 24,\n // prevent the checkbox column from growing\n padding: '0px 12px 0 16px',\n '&:last-child': {\n paddingLeft: 12,\n paddingRight: 16\n },\n '& > *': {\n padding: 0\n }\n }\n },\n\n /* Styles applied to the root element if `padding=\"checkbox\"`. */\n paddingCheckbox: {\n width: 48,\n // prevent the checkbox column from growing\n padding: '0 0 0 4px',\n '&:last-child': {\n paddingLeft: 0,\n paddingRight: 4\n }\n },\n\n /* Styles applied to the root element if `padding=\"none\"`. */\n paddingNone: {\n padding: 0,\n '&:last-child': {\n padding: 0\n }\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 flexDirection: 'row-reverse'\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 `context.table.stickyHeader={true}`. */\n stickyHeader: {\n position: 'sticky',\n top: 0,\n left: 0,\n zIndex: 2,\n backgroundColor: theme.palette.background.default\n }\n };\n};\n/**\n * The component renders a `` element when the parent context is a header\n * or otherwise a ` ` element.\n */\n\nvar TableCell = React.forwardRef(function TableCell(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 component = props.component,\n paddingProp = props.padding,\n scopeProp = props.scope,\n sizeProp = props.size,\n sortDirection = props.sortDirection,\n variantProp = props.variant,\n other = _objectWithoutProperties(props, [\"align\", \"classes\", \"className\", \"component\", \"padding\", \"scope\", \"size\", \"sortDirection\", \"variant\"]);\n\n var table = React.useContext(TableContext);\n var tablelvl2 = React.useContext(Tablelvl2Context);\n var Component;\n\n if (component) {\n Component = component;\n } else {\n Component = tablelvl2 && tablelvl2.variant === 'head' ? 'th' : 'td';\n }\n\n var scope = scopeProp;\n\n if (!scope && tablelvl2 && tablelvl2.variant === 'head') {\n scope = 'col';\n }\n\n var padding = paddingProp || (table && table.padding ? table.padding : 'default');\n var size = sizeProp || (table && table.size ? table.size : 'medium');\n var variant = variantProp || tablelvl2 && tablelvl2.variant;\n var ariaSort = null;\n\n if (sortDirection) {\n ariaSort = sortDirection === 'asc' ? 'ascending' : 'descending';\n }\n\n return React.createElement(Component, _extends({\n ref: ref,\n className: clsx(classes.root, classes[variant], className, align !== 'inherit' && classes[\"align\".concat(capitalize(align))], padding !== 'default' && classes[\"padding\".concat(capitalize(padding))], size !== 'medium' && classes[\"size\".concat(capitalize(size))], variant === 'head' && table && table.stickyHeader && classes.stickyHeader),\n \"aria-sort\": ariaSort,\n scope: scope\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? TableCell.propTypes = {\n /**\n * Set the text-align on the table cell content.\n *\n * Monetary or generally number fields **should be right aligned** as that allows\n * you to add them up quickly in your head without having to worry about decimals.\n */\n align: PropTypes.oneOf(['inherit', 'left', 'center', 'right', 'justify']),\n\n /**\n * The table cell 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 DOM element or a component.\n */\n component: PropTypes.elementType,\n\n /**\n * Sets the padding applied to the cell.\n * By default, the Table parent component set the value (`default`).\n */\n padding: PropTypes.oneOf(['default', 'checkbox', 'none']),\n\n /**\n * Set scope attribute.\n */\n scope: PropTypes.string,\n\n /**\n * Specify the size of the cell.\n * By default, the Table parent component set the value (`medium`).\n */\n size: PropTypes.oneOf(['small', 'medium']),\n\n /**\n * Set aria-sort direction.\n */\n sortDirection: PropTypes.oneOf(['asc', 'desc', false]),\n\n /**\n * Specify the cell type.\n * By default, the TableHead, TableBody or TableFooter parent component set the value.\n */\n variant: PropTypes.oneOf(['head', 'body', 'footer'])\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiTableCell'\n})(TableCell);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport Tablelvl2Context from '../Table/Tablelvl2Context';\nexport var styles = {\n /* Styles applied to the root element. */\n root: {\n display: 'table-row-group'\n }\n};\nvar tablelvl2 = {\n variant: 'body'\n};\nvar TableBody = React.forwardRef(function TableBody(props, ref) {\n var classes = props.classes,\n className = props.className,\n _props$component = props.component,\n Component = _props$component === void 0 ? 'tbody' : _props$component,\n other = _objectWithoutProperties(props, [\"classes\", \"className\", \"component\"]);\n\n return React.createElement(Tablelvl2Context.Provider, {\n value: tablelvl2\n }, React.createElement(Component, _extends({\n className: clsx(classes.root, className),\n ref: ref\n }, other)));\n});\nprocess.env.NODE_ENV !== \"production\" ? TableBody.propTypes = {\n /**\n * The content of the component, normally `TableRow`.\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 DOM element or a component.\n */\n component: PropTypes.elementType\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiTableBody'\n})(TableBody);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport Typography from '../Typography';\nexport var styles = {\n /* Styles applied to the root element. */\n root: {\n margin: 0,\n padding: '16px 24px',\n flex: '0 0 auto'\n }\n};\nvar DialogTitle = React.forwardRef(function DialogTitle(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 other = _objectWithoutProperties(props, [\"children\", \"classes\", \"className\", \"disableTypography\"]);\n\n return React.createElement(\"div\", _extends({\n className: clsx(classes.root, className),\n ref: ref\n }, other), disableTypography ? children : React.createElement(Typography, {\n component: \"h2\",\n variant: \"h6\"\n }, children));\n});\nprocess.env.NODE_ENV !== \"production\" ? DialogTitle.propTypes = {\n /**\n * The content of the component.\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 * If `true`, the children won't be wrapped by a typography component.\n * For instance, this can be useful to render an h4 instead of the default h2.\n */\n disableTypography: PropTypes.bool\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiDialogTitle'\n})(DialogTitle);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: {\n flex: '1 1 auto',\n WebkitOverflowScrolling: 'touch',\n // Add iOS momentum scrolling.\n overflowY: 'auto',\n padding: '8px 24px',\n '&:first-child': {\n // dialog without title\n paddingTop: 20\n }\n },\n\n /* Styles applied to the root element if `dividers={true}`. */\n dividers: {\n padding: '16px 24px',\n borderTop: \"1px solid \".concat(theme.palette.divider),\n borderBottom: \"1px solid \".concat(theme.palette.divider)\n }\n };\n};\nvar DialogContent = React.forwardRef(function DialogContent(props, ref) {\n var classes = props.classes,\n className = props.className,\n _props$dividers = props.dividers,\n dividers = _props$dividers === void 0 ? false : _props$dividers,\n other = _objectWithoutProperties(props, [\"classes\", \"className\", \"dividers\"]);\n\n return React.createElement(\"div\", _extends({\n className: clsx(classes.root, className, dividers && classes.dividers),\n ref: ref\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? DialogContent.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 * Display the top and bottom dividers.\n */\n dividers: PropTypes.bool\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiDialogContent'\n})(DialogContent);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport withStyles from '../styles/withStyles';\nimport Typography from '../Typography';\nexport var styles = {\n /* Styles applied to the root element. */\n root: {\n marginBottom: 12\n }\n};\nvar DialogContentText = React.forwardRef(function DialogContentText(props, ref) {\n return React.createElement(Typography, _extends({\n component: \"p\",\n variant: \"body1\",\n color: \"textSecondary\",\n ref: ref\n }, props));\n});\nprocess.env.NODE_ENV !== \"production\" ? DialogContentText.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} : void 0;\nexport default withStyles(styles, {\n name: 'MuiDialogContentText'\n})(DialogContentText);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nexport var styles = {\n /* Styles applied to the root element. */\n root: {\n display: 'flex',\n alignItems: 'center',\n padding: 8,\n justifyContent: 'flex-end',\n flex: '0 0 auto'\n },\n\n /* Styles applied to the root element if `disableSpacing={false}`. */\n spacing: {\n '& > :not(:first-child)': {\n marginLeft: 8\n }\n }\n};\nvar DialogActions = React.forwardRef(function DialogActions(props, ref) {\n var _props$disableSpacing = props.disableSpacing,\n disableSpacing = _props$disableSpacing === void 0 ? false : _props$disableSpacing,\n classes = props.classes,\n className = props.className,\n other = _objectWithoutProperties(props, [\"disableSpacing\", \"classes\", \"className\"]);\n\n return React.createElement(\"div\", _extends({\n className: clsx(classes.root, className, !disableSpacing && classes.spacing),\n ref: ref\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? DialogActions.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 * If `true`, the actions do not have additional margin.\n */\n disableSpacing: PropTypes.bool\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiDialogActions'\n})(DialogActions);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport { exactProp } from '@material-ui/utils';\nimport ThemeContext from '../useTheme/ThemeContext';\nimport useTheme from '../useTheme';\nimport nested from './nested'; // To support composition of theme.\n\nfunction mergeOuterLocalTheme(outerTheme, localTheme) {\n if (typeof localTheme === 'function') {\n var mergedTheme = localTheme(outerTheme);\n\n if (process.env.NODE_ENV !== 'production') {\n if (!mergedTheme) {\n console.error(['Material-UI: you should return an object from your theme function, i.e.', ' ({})} />'].join('\\n'));\n }\n }\n\n return mergedTheme;\n }\n\n return _extends({}, outerTheme, {}, localTheme);\n}\n/**\n * This component takes a `theme` prop.\n * It makes the `theme` available down the React tree thanks to React context.\n * This component should preferably be used at **the root of your component tree**.\n */\n\n\nfunction ThemeProvider(props) {\n var children = props.children,\n localTheme = props.theme;\n var outerTheme = useTheme();\n\n if (process.env.NODE_ENV !== 'production') {\n if (outerTheme === null && typeof localTheme === 'function') {\n console.error(['Material-UI: you are providing a theme function prop to the ThemeProvider component:', ' outerTheme} />', '', 'However, no outer theme is present.', 'Make sure a theme is already injected higher in the React tree ' + 'or provide a theme object.'].join('\\n'));\n }\n }\n\n var theme = React.useMemo(function () {\n var output = outerTheme === null ? localTheme : mergeOuterLocalTheme(outerTheme, localTheme);\n\n if (output != null) {\n output[nested] = outerTheme !== null;\n }\n\n return output;\n }, [localTheme, outerTheme]);\n return React.createElement(ThemeContext.Provider, {\n value: theme\n }, children);\n}\n\nprocess.env.NODE_ENV !== \"production\" ? ThemeProvider.propTypes = {\n /**\n * Your component tree.\n */\n children: PropTypes.node.isRequired,\n\n /**\n * A theme object. You can provide a function to extend the outer theme.\n */\n theme: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).isRequired\n} : void 0;\n\nif (process.env.NODE_ENV !== 'production') {\n process.env.NODE_ENV !== \"production\" ? ThemeProvider.propTypes = exactProp(ThemeProvider.propTypes) : void 0;\n}\n\nexport default ThemeProvider;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport withStyles from '../styles/withStyles';\nimport { exactProp } from '@material-ui/utils';\nexport var html = {\n WebkitFontSmoothing: 'antialiased',\n // Antialiasing.\n MozOsxFontSmoothing: 'grayscale',\n // Antialiasing.\n // Change from `box-sizing: content-box` so that `width`\n // is not affected by `padding` or `border`.\n boxSizing: 'border-box'\n};\nexport var body = function body(theme) {\n return _extends({\n color: theme.palette.text.primary\n }, theme.typography.body2, {\n backgroundColor: theme.palette.background.default,\n '@media print': {\n // Save printer ink.\n backgroundColor: theme.palette.common.white\n }\n });\n};\nexport var styles = function styles(theme) {\n return {\n '@global': {\n html: html,\n '*, *::before, *::after': {\n boxSizing: 'inherit'\n },\n 'strong, b': {\n fontWeight: theme.typography.fontWeightBold\n },\n body: _extends({\n margin: 0\n }, body(theme), {\n // Add support for document.body.requestFullScreen().\n // Other elements, if background transparent, are not supported.\n '&::backdrop': {\n backgroundColor: theme.palette.background.default\n }\n })\n }\n };\n};\n/**\n * Kickstart an elegant, consistent, and simple baseline to build upon.\n */\n\nfunction CssBaseline(props) {\n /* eslint-disable no-unused-vars */\n var _props$children = props.children,\n children = _props$children === void 0 ? null : _props$children,\n classes = props.classes;\n /* eslint-enable no-unused-vars */\n\n return React.createElement(React.Fragment, null, children);\n}\n\nprocess.env.NODE_ENV !== \"production\" ? CssBaseline.propTypes = {\n /**\n * You can wrap a node.\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} : void 0;\n\nif (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line\n CssBaseline['propTypes' + ''] = exactProp(CssBaseline.propTypes);\n}\n\nexport default withStyles(styles, {\n name: 'MuiCssBaseline'\n})(CssBaseline);","export default function formControlState(_ref) {\n var props = _ref.props,\n states = _ref.states,\n muiFormControl = _ref.muiFormControl;\n return states.reduce(function (acc, state) {\n acc[state] = props[state];\n\n if (muiFormControl) {\n if (typeof props[state] === 'undefined') {\n acc[state] = muiFormControl[state];\n }\n }\n\n return acc;\n }, {});\n}","import React from 'react';\n/**\n * @ignore - internal component.\n */\n\nvar FormControlContext = React.createContext();\n\nif (process.env.NODE_ENV !== 'production') {\n FormControlContext.displayName = 'FormControlContext';\n}\n\nexport function useFormControl() {\n return React.useContext(FormControlContext);\n}\nexport default FormControlContext;","// Corresponds to 10 frames at 60 Hz.\n// A few bytes payload overhead when lodash/debounce is ~3 kB and debounce ~300 B.\nexport default function debounce(func) {\n var wait = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 166;\n var timeout;\n\n function debounced() {\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n // eslint-disable-next-line consistent-this\n var that = this;\n\n var later = function later() {\n func.apply(that, args);\n };\n\n clearTimeout(timeout);\n timeout = setTimeout(later, wait);\n }\n\n debounced.clear = function () {\n clearTimeout(timeout);\n };\n\n return debounced;\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport debounce from '../utils/debounce';\nimport useForkRef from '../utils/useForkRef';\n\nfunction getStyleValue(computedStyle, property) {\n return parseInt(computedStyle[property], 10) || 0;\n}\n\nvar useEnhancedEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;\nvar styles = {\n /* Styles applied to the shadow textarea element. */\n shadow: {\n // Visibility needed to hide the extra text area on iPads\n visibility: 'hidden',\n // Remove from the content flow\n position: 'absolute',\n // Ignore the scrollbar width\n overflow: 'hidden',\n height: 0,\n top: 0,\n left: 0,\n // Create a new layer, increase the isolation of the computed values\n transform: 'translateZ(0)'\n }\n};\nvar TextareaAutosize = React.forwardRef(function TextareaAutosize(props, ref) {\n var onChange = props.onChange,\n rows = props.rows,\n rowsMax = props.rowsMax,\n _props$rowsMin = props.rowsMin,\n rowsMinProp = _props$rowsMin === void 0 ? 1 : _props$rowsMin,\n style = props.style,\n value = props.value,\n other = _objectWithoutProperties(props, [\"onChange\", \"rows\", \"rowsMax\", \"rowsMin\", \"style\", \"value\"]);\n\n var rowsMin = rows || rowsMinProp;\n\n var _React$useRef = React.useRef(value != null),\n isControlled = _React$useRef.current;\n\n var inputRef = React.useRef(null);\n var handleRef = useForkRef(ref, inputRef);\n var shadowRef = React.useRef(null);\n\n var _React$useState = React.useState({}),\n state = _React$useState[0],\n setState = _React$useState[1];\n\n var syncHeight = React.useCallback(function () {\n var input = inputRef.current;\n var computedStyle = window.getComputedStyle(input);\n var inputShallow = shadowRef.current;\n inputShallow.style.width = computedStyle.width;\n inputShallow.value = input.value || props.placeholder || 'x';\n var boxSizing = computedStyle['box-sizing'];\n var padding = getStyleValue(computedStyle, 'padding-bottom') + getStyleValue(computedStyle, 'padding-top');\n var border = getStyleValue(computedStyle, 'border-bottom-width') + getStyleValue(computedStyle, 'border-top-width'); // The height of the inner content\n\n var innerHeight = inputShallow.scrollHeight - padding; // Measure height of a textarea with a single row\n\n inputShallow.value = 'x';\n var singleRowHeight = inputShallow.scrollHeight - padding; // The height of the outer content\n\n var outerHeight = innerHeight;\n\n if (rowsMin) {\n outerHeight = Math.max(Number(rowsMin) * singleRowHeight, outerHeight);\n }\n\n if (rowsMax) {\n outerHeight = Math.min(Number(rowsMax) * singleRowHeight, outerHeight);\n }\n\n outerHeight = Math.max(outerHeight, singleRowHeight); // Take the box sizing into account for applying this value as a style.\n\n var outerHeightStyle = outerHeight + (boxSizing === 'border-box' ? padding + border : 0);\n var overflow = Math.abs(outerHeight - innerHeight) <= 1;\n setState(function (prevState) {\n // Need a large enough different to update the height.\n // This prevents infinite rendering loop.\n if (outerHeightStyle > 0 && Math.abs((prevState.outerHeightStyle || 0) - outerHeightStyle) > 1 || prevState.overflow !== overflow) {\n return {\n overflow: overflow,\n outerHeightStyle: outerHeightStyle\n };\n }\n\n return prevState;\n });\n }, [rowsMax, rowsMin, props.placeholder]);\n React.useEffect(function () {\n var handleResize = debounce(function () {\n syncHeight();\n });\n window.addEventListener('resize', handleResize);\n return function () {\n handleResize.clear();\n window.removeEventListener('resize', handleResize);\n };\n }, [syncHeight]);\n useEnhancedEffect(function () {\n syncHeight();\n });\n\n var handleChange = function handleChange(event) {\n if (!isControlled) {\n syncHeight();\n }\n\n if (onChange) {\n onChange(event);\n }\n };\n\n return React.createElement(React.Fragment, null, React.createElement(\"textarea\", _extends({\n value: value,\n onChange: handleChange,\n ref: handleRef // Apply the rows prop to get a \"correct\" first SSR paint\n ,\n rows: rowsMin,\n style: _extends({\n height: state.outerHeightStyle,\n // Need a large enough different to allow scrolling.\n // This prevents infinite rendering loop.\n overflow: state.overflow ? 'hidden' : null\n }, style)\n }, other)), React.createElement(\"textarea\", {\n \"aria-hidden\": true,\n className: props.className,\n readOnly: true,\n ref: shadowRef,\n tabIndex: -1,\n style: _extends({}, styles.shadow, {}, style)\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? TextareaAutosize.propTypes = {\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * @ignore\n */\n onChange: PropTypes.func,\n\n /**\n * @ignore\n */\n placeholder: PropTypes.string,\n\n /**\n * Use `rowsMin` instead. The prop will be removed in v5.\n *\n * @deprecated\n */\n rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * Maximum number of rows to display.\n */\n rowsMax: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * Minimum number of rows to display.\n */\n rowsMin: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * @ignore\n */\n style: PropTypes.object,\n\n /**\n * @ignore\n */\n value: PropTypes.any\n} : void 0;\nexport default TextareaAutosize;","// Supports determination of isControlled().\n// Controlled input accepts its current value as a prop.\n//\n// @see https://facebook.github.io/react/docs/forms.html#controlled-components\n// @param value\n// @returns {boolean} true if string (including '') or number (including zero)\nexport function hasValue(value) {\n return value != null && !(Array.isArray(value) && value.length === 0);\n} // Determine if field is empty or filled.\n// Response determines if label is presented above field or as placeholder.\n//\n// @param obj\n// @param SSR\n// @returns {boolean} False when not present or empty string.\n// True when any number or string with length.\n\nexport function isFilled(obj) {\n var SSR = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;\n return obj && (hasValue(obj.value) && obj.value !== '' || SSR && hasValue(obj.defaultValue) && obj.defaultValue !== '');\n} // Determine if an Input is adorned on start.\n// It's corresponding to the left with LTR.\n//\n// @param obj\n// @returns {boolean} False when no adornments.\n// True when adorned at the start.\n\nexport function isAdornedStart(obj) {\n return obj.startAdornment;\n}","import _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\n\n/* eslint-disable jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { refType } from '@material-ui/utils';\nimport formControlState from '../FormControl/formControlState';\nimport FormControlContext, { useFormControl } from '../FormControl/FormControlContext';\nimport withStyles from '../styles/withStyles';\nimport capitalize from '../utils/capitalize';\nimport useForkRef from '../utils/useForkRef';\nimport TextareaAutosize from '../TextareaAutosize';\nimport { isFilled } from './utils';\nexport var styles = function styles(theme) {\n var light = theme.palette.type === 'light';\n var placeholder = {\n color: 'currentColor',\n opacity: light ? 0.42 : 0.5,\n transition: theme.transitions.create('opacity', {\n duration: theme.transitions.duration.shorter\n })\n };\n var placeholderHidden = {\n opacity: '0 !important'\n };\n var placeholderVisible = {\n opacity: light ? 0.42 : 0.5\n };\n return {\n '@global': {\n '@keyframes mui-auto-fill': {\n from: {}\n },\n '@keyframes mui-auto-fill-cancel': {\n from: {}\n }\n },\n\n /* Styles applied to the root element. */\n root: _extends({}, theme.typography.body1, {\n color: theme.palette.text.primary,\n lineHeight: '1.1875em',\n // Reset (19px), match the native input line-height\n boxSizing: 'border-box',\n // Prevent padding issue with fullWidth.\n position: 'relative',\n cursor: 'text',\n display: 'inline-flex',\n alignItems: 'center',\n '&$disabled': {\n color: theme.palette.text.disabled,\n cursor: 'default'\n }\n }),\n\n /* Styles applied to the root element if the component is a descendant of `FormControl`. */\n formControl: {},\n\n /* Styles applied to the root element if the component is focused. */\n focused: {},\n\n /* Styles applied to the root element if `disabled={true}`. */\n disabled: {},\n\n /* Styles applied to the root element if `startAdornment` is provided. */\n adornedStart: {},\n\n /* Styles applied to the root element if `endAdornment` is provided. */\n adornedEnd: {},\n\n /* Pseudo-class applied to the root element if `error={true}`. */\n error: {},\n\n /* Styles applied to the `input` element if `margin=\"dense\"`. */\n marginDense: {},\n\n /* Styles applied to the root element if `multiline={true}`. */\n multiline: {\n padding: \"\".concat(8 - 2, \"px 0 \").concat(8 - 1, \"px\"),\n '&$marginDense': {\n paddingTop: 4 - 1\n }\n },\n\n /* Styles applied to the root element if the color is secondary. */\n colorSecondary: {},\n\n /* Styles applied to the root element if `fullWidth={true}`. */\n fullWidth: {\n width: '100%'\n },\n\n /* Styles applied to the `input` element. */\n input: {\n font: 'inherit',\n color: 'currentColor',\n padding: \"\".concat(8 - 2, \"px 0 \").concat(8 - 1, \"px\"),\n border: 0,\n boxSizing: 'content-box',\n background: 'none',\n height: '1.1875em',\n // Reset (19px), match the native input line-height\n margin: 0,\n // Reset for Safari\n WebkitTapHighlightColor: 'transparent',\n display: 'block',\n // Make the flex item shrink with Firefox\n minWidth: 0,\n width: '100%',\n // Fix IE 11 width issue\n animationName: 'mui-auto-fill-cancel',\n '&::-webkit-input-placeholder': placeholder,\n '&::-moz-placeholder': placeholder,\n // Firefox 19+\n '&:-ms-input-placeholder': placeholder,\n // IE 11\n '&::-ms-input-placeholder': placeholder,\n // Edge\n '&:focus': {\n outline: 0\n },\n // Reset Firefox invalid required input style\n '&:invalid': {\n boxShadow: 'none'\n },\n '&::-webkit-search-decoration': {\n // Remove the padding when type=search.\n '-webkit-appearance': 'none'\n },\n // Show and hide the placeholder logic\n 'label[data-shrink=false] + $formControl &': {\n '&::-webkit-input-placeholder': placeholderHidden,\n '&::-moz-placeholder': placeholderHidden,\n // Firefox 19+\n '&:-ms-input-placeholder': placeholderHidden,\n // IE 11\n '&::-ms-input-placeholder': placeholderHidden,\n // Edge\n '&:focus::-webkit-input-placeholder': placeholderVisible,\n '&:focus::-moz-placeholder': placeholderVisible,\n // Firefox 19+\n '&:focus:-ms-input-placeholder': placeholderVisible,\n // IE 11\n '&:focus::-ms-input-placeholder': placeholderVisible // Edge\n\n },\n '&$disabled': {\n opacity: 1 // Reset iOS opacity\n\n },\n '&:-webkit-autofill': {\n animationDuration: '5000s',\n animationName: 'mui-auto-fill'\n }\n },\n\n /* Styles applied to the `input` element if `margin=\"dense\"`. */\n inputMarginDense: {\n paddingTop: 4 - 1\n },\n\n /* Styles applied to the `input` element if `multiline={true}`. */\n inputMultiline: {\n height: 'auto',\n resize: 'none',\n padding: 0\n },\n\n /* Styles applied to the `input` element if `type=\"search\"`. */\n inputTypeSearch: {\n // Improve type search style.\n '-moz-appearance': 'textfield',\n '-webkit-appearance': 'textfield'\n },\n\n /* Styles applied to the `input` element if `startAdornment` is provided. */\n inputAdornedStart: {},\n\n /* Styles applied to the `input` element if `endAdornment` is provided. */\n inputAdornedEnd: {},\n\n /* Styles applied to the `input` element if `hiddenLabel={true}`. */\n inputHiddenLabel: {}\n };\n};\nvar useEnhancedEffect = typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect;\n/**\n * `InputBase` contains as few styles as possible.\n * It aims to be a simple building block for creating an input.\n * It contains a load of style reset and some state logic.\n */\n\nvar InputBase = React.forwardRef(function InputBase(props, ref) {\n var ariaDescribedby = props['aria-describedby'],\n autoComplete = props.autoComplete,\n autoFocus = props.autoFocus,\n classes = props.classes,\n className = props.className,\n color = props.color,\n defaultValue = props.defaultValue,\n disabled = props.disabled,\n endAdornment = props.endAdornment,\n error = props.error,\n _props$fullWidth = props.fullWidth,\n fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth,\n id = props.id,\n _props$inputComponent = props.inputComponent,\n inputComponent = _props$inputComponent === void 0 ? 'input' : _props$inputComponent,\n _props$inputProps = props.inputProps,\n inputPropsProp = _props$inputProps === void 0 ? {} : _props$inputProps,\n inputRefProp = props.inputRef,\n margin = props.margin,\n _props$multiline = props.multiline,\n multiline = _props$multiline === void 0 ? false : _props$multiline,\n name = props.name,\n onBlur = props.onBlur,\n onChange = props.onChange,\n onClick = props.onClick,\n onFocus = props.onFocus,\n onKeyDown = props.onKeyDown,\n onKeyUp = props.onKeyUp,\n placeholder = props.placeholder,\n readOnly = props.readOnly,\n renderSuffix = props.renderSuffix,\n rows = props.rows,\n rowsMax = props.rowsMax,\n rowsMin = props.rowsMin,\n startAdornment = props.startAdornment,\n _props$type = props.type,\n type = _props$type === void 0 ? 'text' : _props$type,\n valueProp = props.value,\n other = _objectWithoutProperties(props, [\"aria-describedby\", \"autoComplete\", \"autoFocus\", \"classes\", \"className\", \"color\", \"defaultValue\", \"disabled\", \"endAdornment\", \"error\", \"fullWidth\", \"id\", \"inputComponent\", \"inputProps\", \"inputRef\", \"margin\", \"multiline\", \"name\", \"onBlur\", \"onChange\", \"onClick\", \"onFocus\", \"onKeyDown\", \"onKeyUp\", \"placeholder\", \"readOnly\", \"renderSuffix\", \"rows\", \"rowsMax\", \"rowsMin\", \"startAdornment\", \"type\", \"value\"]);\n\n var value = inputPropsProp.value != null ? inputPropsProp.value : valueProp;\n\n var _React$useRef = React.useRef(value != null),\n isControlled = _React$useRef.current;\n\n var inputRef = React.useRef();\n var handleInputRefWarning = React.useCallback(function (instance) {\n if (process.env.NODE_ENV !== 'production') {\n if (instance && !(instance instanceof HTMLInputElement) && !instance.focus) {\n console.error(['Material-UI: you have provided a `inputComponent` to the input component', 'that does not correctly handle the `inputRef` prop.', 'Make sure the `inputRef` prop is called with a HTMLInputElement.'].join('\\n'));\n }\n }\n }, []);\n var handleInputPropsRefProp = useForkRef(inputPropsProp.ref, handleInputRefWarning);\n var handleInputRefProp = useForkRef(inputRefProp, handleInputPropsRefProp);\n var handleInputRef = useForkRef(inputRef, handleInputRefProp);\n\n var _React$useState = React.useState(false),\n focused = _React$useState[0],\n setFocused = _React$useState[1];\n\n var muiFormControl = useFormControl();\n\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(function () {\n if (muiFormControl) {\n return muiFormControl.registerEffect();\n }\n\n return undefined;\n }, [muiFormControl]);\n }\n\n var fcs = formControlState({\n props: props,\n muiFormControl: muiFormControl,\n states: ['color', 'disabled', 'error', 'hiddenLabel', 'margin', 'required', 'filled']\n });\n fcs.focused = muiFormControl ? muiFormControl.focused : focused; // The blur won't fire when the disabled state is set on a focused input.\n // We need to book keep the focused state manually.\n\n React.useEffect(function () {\n if (!muiFormControl && disabled && focused) {\n setFocused(false);\n\n if (onBlur) {\n onBlur();\n }\n }\n }, [muiFormControl, disabled, focused, onBlur]);\n var onFilled = muiFormControl && muiFormControl.onFilled;\n var onEmpty = muiFormControl && muiFormControl.onEmpty;\n var checkDirty = React.useCallback(function (obj) {\n if (isFilled(obj)) {\n if (onFilled) {\n onFilled();\n }\n } else if (onEmpty) {\n onEmpty();\n }\n }, [onFilled, onEmpty]);\n useEnhancedEffect(function () {\n if (isControlled) {\n checkDirty({\n value: value\n });\n }\n }, [value, checkDirty, isControlled]);\n\n var handleFocus = function handleFocus(event) {\n // Fix a bug with IE 11 where the focus/blur events are triggered\n // while the input is disabled.\n if (fcs.disabled) {\n event.stopPropagation();\n return;\n }\n\n if (onFocus) {\n onFocus(event);\n }\n\n if (inputPropsProp.onFocus) {\n inputPropsProp.onFocus(event);\n }\n\n if (muiFormControl && muiFormControl.onFocus) {\n muiFormControl.onFocus(event);\n } else {\n setFocused(true);\n }\n };\n\n var handleBlur = function handleBlur(event) {\n if (onBlur) {\n onBlur(event);\n }\n\n if (inputPropsProp.onBlur) {\n inputPropsProp.onBlur(event);\n }\n\n if (muiFormControl && muiFormControl.onBlur) {\n muiFormControl.onBlur(event);\n } else {\n setFocused(false);\n }\n };\n\n var handleChange = function handleChange(event) {\n if (!isControlled) {\n var element = event.target || inputRef.current;\n\n if (element == null) {\n throw new TypeError('Material-UI: Expected valid input target. ' + 'Did you use a custom `inputComponent` and forget to forward refs? ' + 'See https://material-ui.com/r/input-component-ref-interface for more info.');\n }\n\n checkDirty({\n value: element.value\n });\n }\n\n for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {\n args[_key - 1] = arguments[_key];\n }\n\n if (inputPropsProp.onChange) {\n inputPropsProp.onChange.apply(inputPropsProp, [event].concat(args));\n } // Perform in the willUpdate\n\n\n if (onChange) {\n onChange.apply(void 0, [event].concat(args));\n }\n }; // Check the input state on mount, in case it was filled by the user\n // or auto filled by the browser before the hydration (for SSR).\n\n\n React.useEffect(function () {\n checkDirty(inputRef.current);\n }, []); // eslint-disable-line react-hooks/exhaustive-deps\n\n var handleClick = function handleClick(event) {\n if (inputRef.current && event.currentTarget === event.target) {\n inputRef.current.focus();\n }\n\n if (onClick) {\n onClick(event);\n }\n };\n\n var InputComponent = inputComponent;\n\n var inputProps = _extends({}, inputPropsProp, {\n ref: handleInputRef\n });\n\n if (typeof InputComponent !== 'string') {\n inputProps = _extends({\n // Rename ref to inputRef as we don't know the\n // provided `inputComponent` structure.\n inputRef: handleInputRef,\n type: type\n }, inputProps, {\n ref: null\n });\n } else if (multiline) {\n if (rows && !rowsMax && !rowsMin) {\n InputComponent = 'textarea';\n } else {\n inputProps = _extends({\n rows: rows,\n rowsMax: rowsMax\n }, inputProps);\n InputComponent = TextareaAutosize;\n }\n } else {\n inputProps = _extends({\n type: type\n }, inputProps);\n }\n\n var handleAutoFill = function handleAutoFill(event) {\n // Provide a fake value as Chrome might not let you access it for security reasons.\n checkDirty(event.animationName === 'mui-auto-fill-cancel' ? inputRef.current : {\n value: 'x'\n });\n };\n\n React.useEffect(function () {\n if (muiFormControl) {\n muiFormControl.setAdornedStart(Boolean(startAdornment));\n }\n }, [muiFormControl, startAdornment]);\n return React.createElement(\"div\", _extends({\n className: clsx(classes.root, classes[\"color\".concat(capitalize(fcs.color || 'primary'))], className, fcs.disabled && classes.disabled, fcs.error && classes.error, fullWidth && classes.fullWidth, fcs.focused && classes.focused, muiFormControl && classes.formControl, multiline && classes.multiline, startAdornment && classes.adornedStart, endAdornment && classes.adornedEnd, fcs.margin === 'dense' && classes.marginDense),\n onClick: handleClick,\n ref: ref\n }, other), startAdornment, React.createElement(FormControlContext.Provider, {\n value: null\n }, React.createElement(InputComponent, _extends({\n \"aria-invalid\": fcs.error,\n \"aria-describedby\": ariaDescribedby,\n autoComplete: autoComplete,\n autoFocus: autoFocus,\n defaultValue: defaultValue,\n disabled: fcs.disabled,\n id: id,\n onAnimationStart: handleAutoFill,\n name: name,\n placeholder: placeholder,\n readOnly: readOnly,\n required: fcs.required,\n rows: rows,\n value: value,\n onKeyDown: onKeyDown,\n onKeyUp: onKeyUp\n }, inputProps, {\n className: clsx(classes.input, inputPropsProp.className, fcs.disabled && classes.disabled, multiline && classes.inputMultiline, fcs.hiddenLabel && classes.inputHiddenLabel, startAdornment && classes.inputAdornedStart, endAdornment && classes.inputAdornedEnd, type === 'search' && classes.inputTypeSearch, fcs.margin === 'dense' && classes.inputMarginDense),\n onBlur: handleBlur,\n onChange: handleChange,\n onFocus: handleFocus\n }))), endAdornment, renderSuffix ? renderSuffix(_extends({}, fcs, {\n startAdornment: startAdornment\n })) : null);\n});\nprocess.env.NODE_ENV !== \"production\" ? InputBase.propTypes = {\n /**\n * @ignore\n */\n 'aria-describedby': PropTypes.string,\n\n /**\n * This prop helps users to fill forms faster, especially on mobile devices.\n * The name can be confusing, as it's more like an autofill.\n * You can learn more about it [following the specification](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill).\n */\n autoComplete: PropTypes.string,\n\n /**\n * If `true`, the `input` element will be focused during the first mount.\n */\n autoFocus: 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 CSS class name of the wrapper element.\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(['primary', 'secondary']),\n\n /**\n * The default `input` element value. Use when the component is not controlled.\n */\n defaultValue: PropTypes.any,\n\n /**\n * If `true`, the `input` element will be disabled.\n */\n disabled: PropTypes.bool,\n\n /**\n * End `InputAdornment` for this component.\n */\n endAdornment: PropTypes.node,\n\n /**\n * If `true`, the input will indicate an error. This is normally obtained via context from\n * FormControl.\n */\n error: PropTypes.bool,\n\n /**\n * If `true`, the input will take up the full width of its container.\n */\n fullWidth: PropTypes.bool,\n\n /**\n * The id of the `input` element.\n */\n id: PropTypes.string,\n\n /**\n * The component used for the `input` element.\n * Either a string to use a DOM element or a component.\n */\n inputComponent: PropTypes.elementType,\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 * If `dense`, will adjust vertical spacing. This is normally obtained via context from\n * FormControl.\n */\n margin: PropTypes.oneOf(['dense', 'none']),\n\n /**\n * If `true`, a textarea element will be rendered.\n */\n multiline: PropTypes.bool,\n\n /**\n * Name attribute of the `input` element.\n */\n name: PropTypes.string,\n\n /**\n * Callback fired when the input is blurred.\n *\n * Notice that the first argument (event) might be undefined.\n */\n onBlur: PropTypes.func,\n\n /**\n * Callback fired when the value 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 */\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 onKeyDown: PropTypes.func,\n\n /**\n * @ignore\n */\n onKeyUp: PropTypes.func,\n\n /**\n * The short hint displayed in the input before the user enters a value.\n */\n placeholder: PropTypes.string,\n\n /**\n * It prevents the user from changing the value of the field\n * (not from interacting with the field).\n */\n readOnly: PropTypes.bool,\n\n /**\n * @ignore\n */\n renderSuffix: PropTypes.func,\n\n /**\n * If `true`, the `input` element will be required.\n */\n required: PropTypes.bool,\n\n /**\n * Number of rows to display when multiline option is set to true.\n */\n rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * Maximum number of rows to display when multiline option is set to true.\n */\n rowsMax: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * Minimum number of rows to display when multiline option is set to true.\n */\n rowsMin: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * Start `InputAdornment` for this component.\n */\n startAdornment: PropTypes.node,\n\n /**\n * Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types).\n */\n type: PropTypes.string,\n\n /**\n * The value of the `input` element, required for a controlled component.\n */\n value: PropTypes.any\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiInputBase'\n})(InputBase);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { refType } from '@material-ui/utils';\nimport InputBase from '../InputBase';\nimport withStyles from '../styles/withStyles';\nexport var styles = function styles(theme) {\n var light = theme.palette.type === 'light';\n var bottomLineColor = light ? 'rgba(0, 0, 0, 0.42)' : 'rgba(255, 255, 255, 0.7)';\n return {\n /* Styles applied to the root element. */\n root: {\n position: 'relative'\n },\n\n /* Styles applied to the root element if the component is a descendant of `FormControl`. */\n formControl: {\n 'label + &': {\n marginTop: 16\n }\n },\n\n /* Styles applied to the root element if the component is focused. */\n focused: {},\n\n /* Styles applied to the root element if `disabled={true}`. */\n disabled: {},\n\n /* Styles applied to the root element if color secondary. */\n colorSecondary: {\n '&$underline:after': {\n borderBottomColor: theme.palette.secondary.main\n }\n },\n\n /* Styles applied to the root element if `disableUnderline={false}`. */\n underline: {\n '&:after': {\n borderBottom: \"2px solid \".concat(theme.palette.primary.main),\n left: 0,\n bottom: 0,\n // Doing the other way around crash on IE 11 \"''\" https://github.com/cssinjs/jss/issues/242\n content: '\"\"',\n position: 'absolute',\n right: 0,\n transform: 'scaleX(0)',\n transition: theme.transitions.create('transform', {\n duration: theme.transitions.duration.shorter,\n easing: theme.transitions.easing.easeOut\n }),\n pointerEvents: 'none' // Transparent to the hover style.\n\n },\n '&$focused:after': {\n transform: 'scaleX(1)'\n },\n '&$error:after': {\n borderBottomColor: theme.palette.error.main,\n transform: 'scaleX(1)' // error is always underlined in red\n\n },\n '&:before': {\n borderBottom: \"1px solid \".concat(bottomLineColor),\n left: 0,\n bottom: 0,\n // Doing the other way around crash on IE 11 \"''\" https://github.com/cssinjs/jss/issues/242\n content: '\"\\\\00a0\"',\n position: 'absolute',\n right: 0,\n transition: theme.transitions.create('border-bottom-color', {\n duration: theme.transitions.duration.shorter\n }),\n pointerEvents: 'none' // Transparent to the hover style.\n\n },\n '&:hover:not($disabled):before': {\n borderBottom: \"2px solid \".concat(theme.palette.text.primary),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n borderBottom: \"1px solid \".concat(bottomLineColor)\n }\n },\n '&$disabled:before': {\n borderBottomStyle: 'dotted'\n }\n },\n\n /* Pseudo-class applied to the root element if `error={true}`. */\n error: {},\n\n /* Styles applied to the `input` element if `margin=\"dense\"`. */\n marginDense: {},\n\n /* Styles applied to the root element if `multiline={true}`. */\n multiline: {},\n\n /* Styles applied to the root element if `fullWidth={true}`. */\n fullWidth: {},\n\n /* Styles applied to the `input` element. */\n input: {},\n\n /* Styles applied to the `input` element if `margin=\"dense\"`. */\n inputMarginDense: {},\n\n /* Styles applied to the `input` element if `multiline={true}`. */\n inputMultiline: {},\n\n /* Styles applied to the `input` element if `type=\"search\"`. */\n inputTypeSearch: {}\n };\n};\nvar Input = React.forwardRef(function Input(props, ref) {\n var disableUnderline = props.disableUnderline,\n classes = props.classes,\n _props$fullWidth = props.fullWidth,\n fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth,\n _props$inputComponent = props.inputComponent,\n inputComponent = _props$inputComponent === void 0 ? 'input' : _props$inputComponent,\n _props$multiline = props.multiline,\n multiline = _props$multiline === void 0 ? false : _props$multiline,\n _props$type = props.type,\n type = _props$type === void 0 ? 'text' : _props$type,\n other = _objectWithoutProperties(props, [\"disableUnderline\", \"classes\", \"fullWidth\", \"inputComponent\", \"multiline\", \"type\"]);\n\n return React.createElement(InputBase, _extends({\n classes: _extends({}, classes, {\n root: clsx(classes.root, !disableUnderline && classes.underline),\n underline: null\n }),\n fullWidth: fullWidth,\n inputComponent: inputComponent,\n multiline: multiline,\n ref: ref,\n type: type\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? Input.propTypes = {\n /**\n * This prop helps users to fill forms faster, especially on mobile devices.\n * The name can be confusing, as it's more like an autofill.\n * You can learn more about it [following the specification](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill).\n */\n autoComplete: PropTypes.string,\n\n /**\n * If `true`, the `input` element will be focused during the first mount.\n */\n autoFocus: 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 CSS class name of the wrapper element.\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(['primary', 'secondary']),\n\n /**\n * The default `input` element value. Use when the component is not controlled.\n */\n defaultValue: PropTypes.any,\n\n /**\n * If `true`, the `input` element will be disabled.\n */\n disabled: PropTypes.bool,\n\n /**\n * If `true`, the input will not have an underline.\n */\n disableUnderline: PropTypes.bool,\n\n /**\n * End `InputAdornment` for this component.\n */\n endAdornment: PropTypes.node,\n\n /**\n * If `true`, the input will indicate an error. This is normally obtained via context from\n * FormControl.\n */\n error: PropTypes.bool,\n\n /**\n * If `true`, the input will take up the full width of its container.\n */\n fullWidth: PropTypes.bool,\n\n /**\n * The id of the `input` element.\n */\n id: PropTypes.string,\n\n /**\n * The component used for the native input.\n * Either a string to use a DOM element or a component.\n */\n inputComponent: PropTypes.elementType,\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 * If `dense`, will adjust vertical spacing. This is normally obtained via context from\n * FormControl.\n */\n margin: PropTypes.oneOf(['dense', 'none']),\n\n /**\n * If `true`, a textarea element will be rendered.\n */\n multiline: PropTypes.bool,\n\n /**\n * Name attribute of the `input` element.\n */\n name: PropTypes.string,\n\n /**\n * Callback fired when the value 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 */\n onChange: PropTypes.func,\n\n /**\n * The short hint displayed in the input before the user enters a value.\n */\n placeholder: PropTypes.string,\n\n /**\n * It prevents the user from changing the value of the field\n * (not from interacting with the field).\n */\n readOnly: PropTypes.bool,\n\n /**\n * If `true`, the `input` element will be required.\n */\n required: PropTypes.bool,\n\n /**\n * Number of rows to display when multiline option is set to true.\n */\n rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * Maximum number of rows to display when multiline option is set to true.\n */\n rowsMax: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * Start `InputAdornment` for this component.\n */\n startAdornment: PropTypes.node,\n\n /**\n * Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types).\n */\n type: PropTypes.string,\n\n /**\n * The value of the `input` element, required for a controlled component.\n */\n value: PropTypes.any\n} : void 0;\nInput.muiName = 'Input';\nexport default withStyles(styles, {\n name: 'MuiInput'\n})(Input);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { refType } from '@material-ui/utils';\nimport InputBase from '../InputBase';\nimport withStyles from '../styles/withStyles';\nexport var styles = function styles(theme) {\n var light = theme.palette.type === 'light';\n var bottomLineColor = light ? 'rgba(0, 0, 0, 0.42)' : 'rgba(255, 255, 255, 0.7)';\n var backgroundColor = light ? 'rgba(0, 0, 0, 0.09)' : 'rgba(255, 255, 255, 0.09)';\n return {\n /* Styles applied to the root element. */\n root: {\n position: 'relative',\n backgroundColor: backgroundColor,\n borderTopLeftRadius: theme.shape.borderRadius,\n borderTopRightRadius: theme.shape.borderRadius,\n transition: theme.transitions.create('background-color', {\n duration: theme.transitions.duration.shorter,\n easing: theme.transitions.easing.easeOut\n }),\n '&:hover': {\n backgroundColor: light ? 'rgba(0, 0, 0, 0.13)' : 'rgba(255, 255, 255, 0.13)',\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: backgroundColor\n }\n },\n '&$focused': {\n backgroundColor: light ? 'rgba(0, 0, 0, 0.09)' : 'rgba(255, 255, 255, 0.09)'\n },\n '&$disabled': {\n backgroundColor: light ? 'rgba(0, 0, 0, 0.12)' : 'rgba(255, 255, 255, 0.12)'\n }\n },\n\n /* Styles applied to the root element if color secondary. */\n colorSecondary: {\n '&$underline:after': {\n borderBottomColor: theme.palette.secondary.main\n }\n },\n\n /* Styles applied to the root element if `disableUnderline={false}`. */\n underline: {\n '&:after': {\n borderBottom: \"2px solid \".concat(theme.palette.primary.main),\n left: 0,\n bottom: 0,\n // Doing the other way around crash on IE 11 \"''\" https://github.com/cssinjs/jss/issues/242\n content: '\"\"',\n position: 'absolute',\n right: 0,\n transform: 'scaleX(0)',\n transition: theme.transitions.create('transform', {\n duration: theme.transitions.duration.shorter,\n easing: theme.transitions.easing.easeOut\n }),\n pointerEvents: 'none' // Transparent to the hover style.\n\n },\n '&$focused:after': {\n transform: 'scaleX(1)'\n },\n '&$error:after': {\n borderBottomColor: theme.palette.error.main,\n transform: 'scaleX(1)' // error is always underlined in red\n\n },\n '&:before': {\n borderBottom: \"1px solid \".concat(bottomLineColor),\n left: 0,\n bottom: 0,\n // Doing the other way around crash on IE 11 \"''\" https://github.com/cssinjs/jss/issues/242\n content: '\"\\\\00a0\"',\n position: 'absolute',\n right: 0,\n transition: theme.transitions.create('border-bottom-color', {\n duration: theme.transitions.duration.shorter\n }),\n pointerEvents: 'none' // Transparent to the hover style.\n\n },\n '&:hover:before': {\n borderBottom: \"1px solid \".concat(theme.palette.text.primary)\n },\n '&$disabled:before': {\n borderBottomStyle: 'dotted'\n }\n },\n\n /* Pseudo-class applied to the root element if the component is focused. */\n focused: {},\n\n /* Pseudo-class applied to the root element if `disabled={true}`. */\n disabled: {},\n\n /* Styles applied to the root element if `startAdornment` is provided. */\n adornedStart: {\n paddingLeft: 12\n },\n\n /* Styles applied to the root element if `endAdornment` is provided. */\n adornedEnd: {\n paddingRight: 12\n },\n\n /* Pseudo-class applied to the root element if `error={true}`. */\n error: {},\n\n /* Styles applied to the `input` element if `margin=\"dense\"`. */\n marginDense: {},\n\n /* Styles applied to the root element if `multiline={true}`. */\n multiline: {\n padding: '27px 12px 10px',\n '&$marginDense': {\n paddingTop: 23,\n paddingBottom: 6\n }\n },\n\n /* Styles applied to the `input` element. */\n input: {\n padding: '27px 12px 10px',\n '&:-webkit-autofill': {\n WebkitBoxShadow: theme.palette.type === 'dark' ? '0 0 0 100px #266798 inset' : null,\n WebkitTextFillColor: theme.palette.type === 'dark' ? '#fff' : null,\n borderTopLeftRadius: 'inherit',\n borderTopRightRadius: 'inherit'\n }\n },\n\n /* Styles applied to the `input` element if `margin=\"dense\"`. */\n inputMarginDense: {\n paddingTop: 23,\n paddingBottom: 6\n },\n\n /* Styles applied to the `input` if in ` `. */\n inputHiddenLabel: {\n paddingTop: 18,\n paddingBottom: 19,\n '&$inputMarginDense': {\n paddingTop: 10,\n paddingBottom: 11\n }\n },\n\n /* Styles applied to the `input` element if `multiline={true}`. */\n inputMultiline: {\n padding: 0\n },\n\n /* Styles applied to the `input` element if `startAdornment` is provided. */\n inputAdornedStart: {\n paddingLeft: 0\n },\n\n /* Styles applied to the `input` element if `endAdornment` is provided. */\n inputAdornedEnd: {\n paddingRight: 0\n }\n };\n};\nvar FilledInput = React.forwardRef(function FilledInput(props, ref) {\n var disableUnderline = props.disableUnderline,\n classes = props.classes,\n _props$fullWidth = props.fullWidth,\n fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth,\n _props$inputComponent = props.inputComponent,\n inputComponent = _props$inputComponent === void 0 ? 'input' : _props$inputComponent,\n _props$multiline = props.multiline,\n multiline = _props$multiline === void 0 ? false : _props$multiline,\n _props$type = props.type,\n type = _props$type === void 0 ? 'text' : _props$type,\n other = _objectWithoutProperties(props, [\"disableUnderline\", \"classes\", \"fullWidth\", \"inputComponent\", \"multiline\", \"type\"]);\n\n return React.createElement(InputBase, _extends({\n classes: _extends({}, classes, {\n root: clsx(classes.root, !disableUnderline && classes.underline),\n underline: null\n }),\n fullWidth: fullWidth,\n inputComponent: inputComponent,\n multiline: multiline,\n ref: ref,\n type: type\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? FilledInput.propTypes = {\n /**\n * This prop helps users to fill forms faster, especially on mobile devices.\n * The name can be confusing, as it's more like an autofill.\n * You can learn more about it [following the specification](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill).\n */\n autoComplete: PropTypes.string,\n\n /**\n * If `true`, the `input` element will be focused during the first mount.\n */\n autoFocus: 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 CSS class name of the wrapper element.\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(['primary', 'secondary']),\n\n /**\n * The default `input` element value. Use when the component is not controlled.\n */\n defaultValue: PropTypes.any,\n\n /**\n * If `true`, the `input` element will be disabled.\n */\n disabled: PropTypes.bool,\n\n /**\n * If `true`, the input will not have an underline.\n */\n disableUnderline: PropTypes.bool,\n\n /**\n * End `InputAdornment` for this component.\n */\n endAdornment: PropTypes.node,\n\n /**\n * If `true`, the input will indicate an error. This is normally obtained via context from\n * FormControl.\n */\n error: PropTypes.bool,\n\n /**\n * If `true`, the input will take up the full width of its container.\n */\n fullWidth: PropTypes.bool,\n\n /**\n * The id of the `input` element.\n */\n id: PropTypes.string,\n\n /**\n * The component used for the native input.\n * Either a string to use a DOM element or a component.\n */\n inputComponent: PropTypes.elementType,\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 * If `dense`, will adjust vertical spacing. This is normally obtained via context from\n * FormControl.\n */\n margin: PropTypes.oneOf(['dense', 'none']),\n\n /**\n * If `true`, a textarea element will be rendered.\n */\n multiline: PropTypes.bool,\n\n /**\n * Name attribute of the `input` element.\n */\n name: PropTypes.string,\n\n /**\n * Callback fired when the value 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 */\n onChange: PropTypes.func,\n\n /**\n * The short hint displayed in the input before the user enters a value.\n */\n placeholder: PropTypes.string,\n\n /**\n * It prevents the user from changing the value of the field\n * (not from interacting with the field).\n */\n readOnly: PropTypes.bool,\n\n /**\n * If `true`, the `input` element will be required.\n */\n required: PropTypes.bool,\n\n /**\n * Number of rows to display when multiline option is set to true.\n */\n rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * Maximum number of rows to display when multiline option is set to true.\n */\n rowsMax: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * Start `InputAdornment` for this component.\n */\n startAdornment: PropTypes.node,\n\n /**\n * Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types).\n */\n type: PropTypes.string,\n\n /**\n * The value of the `input` element, required for a controlled component.\n */\n value: PropTypes.any\n} : void 0;\nFilledInput.muiName = 'Input';\nexport default withStyles(styles, {\n name: 'MuiFilledInput'\n})(FilledInput);","import _defineProperty from \"@babel/runtime/helpers/esm/defineProperty\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport useTheme from '../styles/useTheme';\nimport capitalize from '../utils/capitalize';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: {\n position: 'absolute',\n bottom: 0,\n right: 0,\n top: -5,\n left: 0,\n margin: 0,\n padding: 0,\n paddingLeft: 8,\n pointerEvents: 'none',\n borderRadius: 'inherit',\n borderStyle: 'solid',\n borderWidth: 1\n },\n\n /* Styles applied to the legend element when `labelWidth` is provided. */\n legend: {\n textAlign: 'left',\n padding: 0,\n lineHeight: '11px',\n // sync with `height` in `legend` styles\n transition: theme.transitions.create('width', {\n duration: 150,\n easing: theme.transitions.easing.easeOut\n })\n },\n\n /* Styles applied to the legend element. */\n legendLabelled: {\n display: 'block',\n width: 'auto',\n textAlign: 'left',\n padding: 0,\n height: 11,\n // sync with `lineHeight` in `legend` styles\n fontSize: '0.75em',\n visibility: 'hidden',\n maxWidth: 0.01,\n transition: theme.transitions.create('max-width', {\n duration: 50,\n easing: theme.transitions.easing.easeOut\n }),\n '& span': {\n paddingLeft: 5,\n paddingRight: 5\n }\n },\n\n /* Styles applied to the legend element is notched. */\n legendNotched: {\n maxWidth: 1000,\n transition: theme.transitions.create('max-width', {\n duration: 100,\n easing: theme.transitions.easing.easeOut,\n delay: 50\n })\n }\n };\n};\n/**\n * @ignore - internal component.\n */\n\nvar NotchedOutline = React.forwardRef(function NotchedOutline(props, ref) {\n var children = props.children,\n classes = props.classes,\n className = props.className,\n label = props.label,\n labelWidthProp = props.labelWidth,\n notched = props.notched,\n style = props.style,\n other = _objectWithoutProperties(props, [\"children\", \"classes\", \"className\", \"label\", \"labelWidth\", \"notched\", \"style\"]);\n\n var theme = useTheme();\n var align = theme.direction === 'rtl' ? 'right' : 'left';\n\n if (label !== undefined) {\n return React.createElement(\"fieldset\", _extends({\n \"aria-hidden\": true,\n className: clsx(classes.root, className),\n ref: ref,\n style: style\n }, other), React.createElement(\"legend\", {\n className: clsx(classes.legendLabelled, notched && classes.legendNotched)\n }, label ? React.createElement(\"span\", null, label) : React.createElement(\"span\", {\n dangerouslySetInnerHTML: {\n __html: ''\n }\n })));\n }\n\n var labelWidth = labelWidthProp > 0 ? labelWidthProp * 0.75 + 8 : 0.01;\n return React.createElement(\"fieldset\", _extends({\n \"aria-hidden\": true,\n style: _extends(_defineProperty({}, \"padding\".concat(capitalize(align)), 8), style),\n className: clsx(classes.root, className),\n ref: ref\n }, other), React.createElement(\"legend\", {\n className: classes.legend,\n style: {\n // IE 11: fieldset with legend does not render\n // a border radius. This maintains consistency\n // by always having a legend rendered\n width: notched ? labelWidth : 0.01\n }\n }, React.createElement(\"span\", {\n dangerouslySetInnerHTML: {\n __html: ''\n }\n })));\n});\nprocess.env.NODE_ENV !== \"production\" ? NotchedOutline.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,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * The label.\n */\n label: PropTypes.node,\n\n /**\n * The width of the label.\n */\n labelWidth: PropTypes.number.isRequired,\n\n /**\n * If `true`, the outline is notched to accommodate the label.\n */\n notched: PropTypes.bool.isRequired,\n\n /**\n * @ignore\n */\n style: PropTypes.object\n} : void 0;\nexport default withStyles(styles, {\n name: 'PrivateNotchedOutline'\n})(NotchedOutline);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { refType } from '@material-ui/utils';\nimport InputBase from '../InputBase';\nimport NotchedOutline from './NotchedOutline';\nimport withStyles from '../styles/withStyles';\nexport var styles = function styles(theme) {\n var borderColor = theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)';\n return {\n /* Styles applied to the root element. */\n root: {\n position: 'relative',\n borderRadius: theme.shape.borderRadius,\n '&:hover $notchedOutline': {\n borderColor: theme.palette.text.primary\n },\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n '&:hover $notchedOutline': {\n borderColor: borderColor\n }\n },\n '&$focused $notchedOutline': {\n borderColor: theme.palette.primary.main,\n borderWidth: 2\n },\n '&$error $notchedOutline': {\n borderColor: theme.palette.error.main\n },\n '&$disabled $notchedOutline': {\n borderColor: theme.palette.action.disabled\n }\n },\n\n /* Styles applied to the root element if the color is secondary. */\n colorSecondary: {\n '&$focused $notchedOutline': {\n borderColor: theme.palette.secondary.main\n }\n },\n\n /* Styles applied to the root element if the component is focused. */\n focused: {},\n\n /* Styles applied to the root element if `disabled={true}`. */\n disabled: {},\n\n /* Styles applied to the root element if `startAdornment` is provided. */\n adornedStart: {\n paddingLeft: 14\n },\n\n /* Styles applied to the root element if `endAdornment` is provided. */\n adornedEnd: {\n paddingRight: 14\n },\n\n /* Pseudo-class applied to the root element if `error={true}`. */\n error: {},\n\n /* Styles applied to the `input` element if `margin=\"dense\"`. */\n marginDense: {},\n\n /* Styles applied to the root element if `multiline={true}`. */\n multiline: {\n padding: '18.5px 14px',\n '&$marginDense': {\n paddingTop: 10.5,\n paddingBottom: 10.5\n }\n },\n\n /* Styles applied to the `NotchedOutline` element. */\n notchedOutline: {\n borderColor: borderColor\n },\n\n /* Styles applied to the `input` element. */\n input: {\n padding: '18.5px 14px',\n '&:-webkit-autofill': {\n WebkitBoxShadow: theme.palette.type === 'dark' ? '0 0 0 100px #266798 inset' : null,\n WebkitTextFillColor: theme.palette.type === 'dark' ? '#fff' : null,\n borderRadius: 'inherit'\n }\n },\n\n /* Styles applied to the `input` element if `margin=\"dense\"`. */\n inputMarginDense: {\n paddingTop: 10.5,\n paddingBottom: 10.5\n },\n\n /* Styles applied to the `input` element if `multiline={true}`. */\n inputMultiline: {\n padding: 0\n },\n\n /* Styles applied to the `input` element if `startAdornment` is provided. */\n inputAdornedStart: {\n paddingLeft: 0\n },\n\n /* Styles applied to the `input` element if `endAdornment` is provided. */\n inputAdornedEnd: {\n paddingRight: 0\n }\n };\n};\nvar OutlinedInput = React.forwardRef(function OutlinedInput(props, ref) {\n var classes = props.classes,\n _props$fullWidth = props.fullWidth,\n fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth,\n _props$inputComponent = props.inputComponent,\n inputComponent = _props$inputComponent === void 0 ? 'input' : _props$inputComponent,\n label = props.label,\n _props$labelWidth = props.labelWidth,\n labelWidth = _props$labelWidth === void 0 ? 0 : _props$labelWidth,\n _props$multiline = props.multiline,\n multiline = _props$multiline === void 0 ? false : _props$multiline,\n notched = props.notched,\n _props$type = props.type,\n type = _props$type === void 0 ? 'text' : _props$type,\n other = _objectWithoutProperties(props, [\"classes\", \"fullWidth\", \"inputComponent\", \"label\", \"labelWidth\", \"multiline\", \"notched\", \"type\"]);\n\n return React.createElement(InputBase, _extends({\n renderSuffix: function renderSuffix(state) {\n return React.createElement(NotchedOutline, {\n className: classes.notchedOutline,\n label: label,\n labelWidth: labelWidth,\n notched: typeof notched !== 'undefined' ? notched : Boolean(state.startAdornment || state.filled || state.focused)\n });\n },\n classes: _extends({}, classes, {\n root: clsx(classes.root, classes.underline),\n notchedOutline: null\n }),\n fullWidth: fullWidth,\n inputComponent: inputComponent,\n multiline: multiline,\n ref: ref,\n type: type\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? OutlinedInput.propTypes = {\n /**\n * This prop helps users to fill forms faster, especially on mobile devices.\n * The name can be confusing, as it's more like an autofill.\n * You can learn more about it [following the specification](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill).\n */\n autoComplete: PropTypes.string,\n\n /**\n * If `true`, the `input` element will be focused during the first mount.\n */\n autoFocus: 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 CSS class name of the wrapper element.\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(['primary', 'secondary']),\n\n /**\n * The default `input` element value. Use when the component is not controlled.\n */\n defaultValue: PropTypes.any,\n\n /**\n * If `true`, the `input` element will be disabled.\n */\n disabled: PropTypes.bool,\n\n /**\n * End `InputAdornment` for this component.\n */\n endAdornment: PropTypes.node,\n\n /**\n * If `true`, the input will indicate an error. This is normally obtained via context from\n * FormControl.\n */\n error: PropTypes.bool,\n\n /**\n * If `true`, the input will take up the full width of its container.\n */\n fullWidth: PropTypes.bool,\n\n /**\n * The id of the `input` element.\n */\n id: PropTypes.string,\n\n /**\n * The component used for the native input.\n * Either a string to use a DOM element or a component.\n */\n inputComponent: PropTypes.elementType,\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 * The label of the input. It is only used for layout. The actual labelling\n * is handled by `InputLabel`. If specified `labelWidth` is ignored.\n */\n label: PropTypes.node,\n\n /**\n * The width of the label. Is ignored if `label` is provided. Prefer `label`\n * if the input label appears with a strike through.\n */\n labelWidth: PropTypes.number,\n\n /**\n * If `dense`, will adjust vertical spacing. This is normally obtained via context from\n * FormControl.\n */\n margin: PropTypes.oneOf(['dense', 'none']),\n\n /**\n * If `true`, a textarea element will be rendered.\n */\n multiline: PropTypes.bool,\n\n /**\n * Name attribute of the `input` element.\n */\n name: PropTypes.string,\n\n /**\n * If `true`, the outline is notched to accommodate the label.\n */\n notched: PropTypes.bool,\n\n /**\n * Callback fired when the value 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 */\n onChange: PropTypes.func,\n\n /**\n * The short hint displayed in the input before the user enters a value.\n */\n placeholder: PropTypes.string,\n\n /**\n * It prevents the user from changing the value of the field\n * (not from interacting with the field).\n */\n readOnly: PropTypes.bool,\n\n /**\n * If `true`, the `input` element will be required.\n */\n required: PropTypes.bool,\n\n /**\n * Number of rows to display when multiline option is set to true.\n */\n rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * Maximum number of rows to display when multiline option is set to true.\n */\n rowsMax: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * Start `InputAdornment` for this component.\n */\n startAdornment: PropTypes.node,\n\n /**\n * Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types).\n */\n type: PropTypes.string,\n\n /**\n * The value of the `input` element, required for a controlled component.\n */\n value: PropTypes.any\n} : void 0;\nOutlinedInput.muiName = 'Input';\nexport default withStyles(styles, {\n name: 'MuiOutlinedInput'\n})(OutlinedInput);","import React from 'react';\nimport FormControlContext from './FormControlContext';\nexport default function useFormControl() {\n return React.useContext(FormControlContext);\n}","import _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport formControlState from '../FormControl/formControlState';\nimport useFormControl from '../FormControl/useFormControl';\nimport capitalize from '../utils/capitalize';\nimport withStyles from '../styles/withStyles';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: _extends({\n color: theme.palette.text.secondary\n }, theme.typography.body1, {\n lineHeight: 1,\n padding: 0,\n '&$focused': {\n color: theme.palette.primary.main\n },\n '&$disabled': {\n color: theme.palette.text.disabled\n },\n '&$error': {\n color: theme.palette.error.main\n }\n }),\n\n /* Styles applied to the root element if the color is secondary. */\n colorSecondary: {\n '&$focused': {\n color: theme.palette.secondary.main\n }\n },\n\n /* Pseudo-class applied to the root element if `focused={true}`. */\n focused: {},\n\n /* Pseudo-class applied to the root element if `disabled={true}`. */\n disabled: {},\n\n /* Pseudo-class applied to the root element if `error={true}`. */\n error: {},\n\n /* Pseudo-class applied to the root element if `filled={true}`. */\n filled: {},\n\n /* Pseudo-class applied to the root element if `required={true}`. */\n required: {},\n\n /* Styles applied to the asterisk element. */\n asterisk: {\n '&$error': {\n color: theme.palette.error.main\n }\n }\n };\n};\nvar FormLabel = React.forwardRef(function FormLabel(props, ref) {\n var children = props.children,\n classes = props.classes,\n className = props.className,\n color = props.color,\n _props$component = props.component,\n Component = _props$component === void 0 ? 'label' : _props$component,\n disabled = props.disabled,\n error = props.error,\n filled = props.filled,\n focused = props.focused,\n required = props.required,\n other = _objectWithoutProperties(props, [\"children\", \"classes\", \"className\", \"color\", \"component\", \"disabled\", \"error\", \"filled\", \"focused\", \"required\"]);\n\n var muiFormControl = useFormControl();\n var fcs = formControlState({\n props: props,\n muiFormControl: muiFormControl,\n states: ['color', 'required', 'focused', 'disabled', 'error', 'filled']\n });\n return React.createElement(Component, _extends({\n className: clsx(classes.root, classes[\"color\".concat(capitalize(fcs.color || 'primary'))], className, fcs.disabled && classes.disabled, fcs.error && classes.error, fcs.filled && classes.filled, fcs.focused && classes.focused, fcs.required && classes.required),\n ref: ref\n }, other), children, fcs.required && React.createElement(\"span\", {\n className: clsx(classes.asterisk, fcs.error && classes.error)\n }, \"\\u2009\", '*'));\n});\nprocess.env.NODE_ENV !== \"production\" ? FormLabel.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(['primary', 'secondary']),\n\n /**\n * The component used for the root node.\n * Either a string to use a DOM element or a component.\n */\n component: PropTypes.elementType,\n\n /**\n * If `true`, the label should be displayed in a disabled state.\n */\n disabled: PropTypes.bool,\n\n /**\n * If `true`, the label should be displayed in an error state.\n */\n error: PropTypes.bool,\n\n /**\n * If `true`, the label should use filled classes key.\n */\n filled: PropTypes.bool,\n\n /**\n * If `true`, the input of this label is focused (used by `FormGroup` components).\n */\n focused: PropTypes.bool,\n\n /**\n * If `true`, the label will indicate that the input is required.\n */\n required: PropTypes.bool\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiFormLabel'\n})(FormLabel);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport formControlState from '../FormControl/formControlState';\nimport useFormControl from '../FormControl/useFormControl';\nimport withStyles from '../styles/withStyles';\nimport FormLabel from '../FormLabel';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: {\n display: 'block',\n transformOrigin: 'top left'\n },\n\n /* Pseudo-class applied to the root element if `focused={true}`. */\n focused: {},\n\n /* Pseudo-class applied to the root element if `disabled={true}`. */\n disabled: {},\n\n /* Pseudo-class applied to the root element if `error={true}`. */\n error: {},\n\n /* Pseudo-class applied to the root element if `required={true}`. */\n required: {},\n\n /* Pseudo-class applied to the asterisk element. */\n asterisk: {},\n\n /* Styles applied to the root element if the component is a descendant of `FormControl`. */\n formControl: {\n position: 'absolute',\n left: 0,\n top: 0,\n // slight alteration to spec spacing to match visual spec result\n transform: 'translate(0, 24px) scale(1)'\n },\n\n /* Styles applied to the root element if `margin=\"dense\"`. */\n marginDense: {\n // Compensation for the `Input.inputDense` style.\n transform: 'translate(0, 21px) scale(1)'\n },\n\n /* Styles applied to the `input` element if `shrink={true}`. */\n shrink: {\n transform: 'translate(0, 1.5px) scale(0.75)',\n transformOrigin: 'top left'\n },\n\n /* Styles applied to the `input` element if `disableAnimation={false}`. */\n animated: {\n transition: theme.transitions.create(['color', 'transform'], {\n duration: theme.transitions.duration.shorter,\n easing: theme.transitions.easing.easeOut\n })\n },\n\n /* Styles applied to the root element if `variant=\"filled\"`. */\n filled: {\n // Chrome's autofill feature gives the input field a yellow background.\n // Since the input field is behind the label in the HTML tree,\n // the input field is drawn last and hides the label with an opaque background color.\n // zIndex: 1 will raise the label above opaque background-colors of input.\n zIndex: 1,\n pointerEvents: 'none',\n transform: 'translate(12px, 20px) scale(1)',\n '&$marginDense': {\n transform: 'translate(12px, 17px) scale(1)'\n },\n '&$shrink': {\n transform: 'translate(12px, 10px) scale(0.75)',\n '&$marginDense': {\n transform: 'translate(12px, 7px) scale(0.75)'\n }\n }\n },\n\n /* Styles applied to the root element if `variant=\"outlined\"`. */\n outlined: {\n // see comment above on filled.zIndex\n zIndex: 1,\n pointerEvents: 'none',\n transform: 'translate(14px, 20px) scale(1)',\n '&$marginDense': {\n transform: 'translate(14px, 12px) scale(1)'\n },\n '&$shrink': {\n transform: 'translate(14px, -6px) scale(0.75)'\n }\n }\n };\n};\nvar InputLabel = React.forwardRef(function InputLabel(props, ref) {\n var classes = props.classes,\n className = props.className,\n _props$disableAnimati = props.disableAnimation,\n disableAnimation = _props$disableAnimati === void 0 ? false : _props$disableAnimati,\n margin = props.margin,\n shrinkProp = props.shrink,\n variant = props.variant,\n other = _objectWithoutProperties(props, [\"classes\", \"className\", \"disableAnimation\", \"margin\", \"shrink\", \"variant\"]);\n\n var muiFormControl = useFormControl();\n var shrink = shrinkProp;\n\n if (typeof shrink === 'undefined' && muiFormControl) {\n shrink = muiFormControl.filled || muiFormControl.focused || muiFormControl.adornedStart;\n }\n\n var fcs = formControlState({\n props: props,\n muiFormControl: muiFormControl,\n states: ['margin', 'variant']\n });\n return React.createElement(FormLabel, _extends({\n \"data-shrink\": shrink,\n className: clsx(classes.root, className, muiFormControl && classes.formControl, !disableAnimation && classes.animated, shrink && classes.shrink, fcs.margin === 'dense' && classes.marginDense, {\n 'filled': classes.filled,\n 'outlined': classes.outlined\n }[fcs.variant]),\n classes: {\n focused: classes.focused,\n disabled: classes.disabled,\n error: classes.error,\n required: classes.required,\n asterisk: classes.asterisk\n },\n ref: ref\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? InputLabel.propTypes = {\n /**\n * The contents of the `InputLabel`.\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(['primary', 'secondary']),\n\n /**\n * If `true`, the transition animation is disabled.\n */\n disableAnimation: PropTypes.bool,\n\n /**\n * If `true`, apply disabled class.\n */\n disabled: PropTypes.bool,\n\n /**\n * If `true`, the label will be displayed in an error state.\n */\n error: PropTypes.bool,\n\n /**\n * If `true`, the input of this label is focused.\n */\n focused: PropTypes.bool,\n\n /**\n * If `dense`, will adjust vertical spacing. This is normally obtained via context from\n * FormControl.\n */\n margin: PropTypes.oneOf(['dense']),\n\n /**\n * if `true`, the label will indicate that the input is required.\n */\n required: PropTypes.bool,\n\n /**\n * If `true`, the label is shrunk.\n */\n shrink: PropTypes.bool,\n\n /**\n * The variant to use.\n */\n variant: PropTypes.oneOf(['standard', 'outlined', 'filled'])\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiInputLabel'\n})(InputLabel);","import React from 'react';\nexport default function isMuiElement(element, muiNames) {\n return React.isValidElement(element) && muiNames.indexOf(element.type.muiName) !== -1;\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { isFilled, isAdornedStart } from '../InputBase/utils';\nimport withStyles from '../styles/withStyles';\nimport capitalize from '../utils/capitalize';\nimport isMuiElement from '../utils/isMuiElement';\nimport FormControlContext from './FormControlContext';\nexport var styles = {\n /* Styles applied to the root element. */\n root: {\n display: 'inline-flex',\n flexDirection: 'column',\n position: 'relative',\n // Reset fieldset default style.\n minWidth: 0,\n padding: 0,\n margin: 0,\n border: 0,\n zIndex: 0,\n // Fix blur label text issue\n verticalAlign: 'top' // Fix alignment issue on Safari.\n\n },\n\n /* Styles applied to the root element if `margin=\"normal\"`. */\n marginNormal: {\n marginTop: 16,\n marginBottom: 8\n },\n\n /* Styles applied to the root element if `margin=\"dense\"`. */\n marginDense: {\n marginTop: 8,\n marginBottom: 4\n },\n\n /* Styles applied to the root element if `fullWidth={true}`. */\n fullWidth: {\n width: '100%'\n }\n};\n/**\n * Provides context such as filled/focused/error/required for form inputs.\n * Relying on the context provides high flexibility and ensures that the state always stays\n * consistent across the children of the `FormControl`.\n * This context is used by the following components:\n *\n * - FormLabel\n * - FormHelperText\n * - Input\n * - InputLabel\n *\n * You can find one composition example below and more going to [the demos](/components/text-fields/#components).\n *\n * ```jsx\n * \n * Email address \n * \n * We'll never share your email. \n * \n * ```\n *\n * ⚠️Only one input can be used within a FormControl.\n */\n\nvar FormControl = React.forwardRef(function FormControl(props, ref) {\n var children = props.children,\n classes = props.classes,\n className = props.className,\n _props$color = props.color,\n color = _props$color === void 0 ? 'primary' : _props$color,\n _props$component = props.component,\n Component = _props$component === void 0 ? 'div' : _props$component,\n _props$disabled = props.disabled,\n disabled = _props$disabled === void 0 ? false : _props$disabled,\n _props$error = props.error,\n error = _props$error === void 0 ? false : _props$error,\n _props$fullWidth = props.fullWidth,\n fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth,\n _props$hiddenLabel = props.hiddenLabel,\n hiddenLabel = _props$hiddenLabel === void 0 ? false : _props$hiddenLabel,\n _props$margin = props.margin,\n margin = _props$margin === void 0 ? 'none' : _props$margin,\n _props$required = props.required,\n required = _props$required === void 0 ? false : _props$required,\n size = props.size,\n _props$variant = props.variant,\n variant = _props$variant === void 0 ? 'standard' : _props$variant,\n other = _objectWithoutProperties(props, [\"children\", \"classes\", \"className\", \"color\", \"component\", \"disabled\", \"error\", \"fullWidth\", \"hiddenLabel\", \"margin\", \"required\", \"size\", \"variant\"]);\n\n var _React$useState = React.useState(function () {\n // We need to iterate through the children and find the Input in order\n // to fully support server-side rendering.\n var initialAdornedStart = false;\n\n if (children) {\n React.Children.forEach(children, function (child) {\n if (!isMuiElement(child, ['Input', 'Select'])) {\n return;\n }\n\n var input = isMuiElement(child, ['Select']) ? child.props.input : child;\n\n if (input && isAdornedStart(input.props)) {\n initialAdornedStart = true;\n }\n });\n }\n\n return initialAdornedStart;\n }),\n adornedStart = _React$useState[0],\n setAdornedStart = _React$useState[1];\n\n var _React$useState2 = React.useState(function () {\n // We need to iterate through the children and find the Input in order\n // to fully support server-side rendering.\n var initialFilled = false;\n\n if (children) {\n React.Children.forEach(children, function (child) {\n if (!isMuiElement(child, ['Input', 'Select'])) {\n return;\n }\n\n if (isFilled(child.props, true)) {\n initialFilled = true;\n }\n });\n }\n\n return initialFilled;\n }),\n filled = _React$useState2[0],\n setFilled = _React$useState2[1];\n\n var _React$useState3 = React.useState(false),\n focused = _React$useState3[0],\n setFocused = _React$useState3[1];\n\n if (disabled && focused) {\n setFocused(false);\n }\n\n var registerEffect;\n\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n var registeredInput = React.useRef(false);\n\n registerEffect = function registerEffect() {\n if (registeredInput.current) {\n console.error(['Material-UI: there are multiple InputBase components inside a FormControl.', 'This is not supported. It might cause infinite rendering loops.', 'Only use one InputBase.'].join('\\n'));\n }\n\n registeredInput.current = true;\n return function () {\n registeredInput.current = false;\n };\n };\n }\n\n var onFilled = React.useCallback(function () {\n setFilled(true);\n }, []);\n var onEmpty = React.useCallback(function () {\n setFilled(false);\n }, []);\n var childContext = {\n adornedStart: adornedStart,\n setAdornedStart: setAdornedStart,\n color: color,\n disabled: disabled,\n error: error,\n filled: filled,\n focused: focused,\n fullWidth: fullWidth,\n hiddenLabel: hiddenLabel,\n margin: (size === 'small' ? 'dense' : undefined) || margin,\n onBlur: function onBlur() {\n setFocused(false);\n },\n onEmpty: onEmpty,\n onFilled: onFilled,\n onFocus: function onFocus() {\n setFocused(true);\n },\n registerEffect: registerEffect,\n required: required,\n variant: variant\n };\n return React.createElement(FormControlContext.Provider, {\n value: childContext\n }, React.createElement(Component, _extends({\n className: clsx(classes.root, className, margin !== 'none' && classes[\"margin\".concat(capitalize(margin))], fullWidth && classes.fullWidth),\n ref: ref\n }, other), children));\n});\nprocess.env.NODE_ENV !== \"production\" ? FormControl.propTypes = {\n /**\n * The contents of the form control.\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(['primary', 'secondary']),\n\n /**\n * The component used for the root node.\n * Either a string to use a DOM element or a component.\n */\n component: PropTypes.elementType,\n\n /**\n * If `true`, the label, input and helper text should be displayed in a disabled state.\n */\n disabled: PropTypes.bool,\n\n /**\n * If `true`, the label should be displayed in an error state.\n */\n error: PropTypes.bool,\n\n /**\n * If `true`, the component will take up the full width of its container.\n */\n fullWidth: PropTypes.bool,\n\n /**\n * If `true`, the label will be hidden.\n * This is used to increase density for a `FilledInput`.\n * Be sure to add `aria-label` to the `input` element.\n */\n hiddenLabel: PropTypes.bool,\n\n /**\n * If `dense` or `normal`, will adjust vertical spacing of this and contained components.\n */\n margin: PropTypes.oneOf(['none', 'dense', 'normal']),\n\n /**\n * If `true`, the label will indicate that the input is required.\n */\n required: PropTypes.bool,\n\n /**\n * The size of the text field.\n */\n size: PropTypes.oneOf(['small', 'medium']),\n\n /**\n * The variant to use.\n */\n variant: PropTypes.oneOf(['standard', 'outlined', 'filled'])\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiFormControl'\n})(FormControl);","import _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport formControlState from '../FormControl/formControlState';\nimport useFormControl from '../FormControl/useFormControl';\nimport withStyles from '../styles/withStyles';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: _extends({\n color: theme.palette.text.secondary\n }, theme.typography.caption, {\n textAlign: 'left',\n marginTop: 3,\n margin: 0,\n '&$disabled': {\n color: theme.palette.text.disabled\n },\n '&$error': {\n color: theme.palette.error.main\n }\n }),\n\n /* Pseudo-class applied to the root element if `error={true}`. */\n error: {},\n\n /* Pseudo-class applied to the root element if `disabled={true}`. */\n disabled: {},\n\n /* Styles applied to the root element if `margin=\"dense\"`. */\n marginDense: {\n marginTop: 4\n },\n\n /* Styles applied to the root element if `variant=\"filled\"` or `variant=\"outlined\"`. */\n contained: {\n marginLeft: 14,\n marginRight: 14\n },\n\n /* Pseudo-class applied to the root element if `focused={true}`. */\n focused: {},\n\n /* Pseudo-class applied to the root element if `filled={true}`. */\n filled: {},\n\n /* Pseudo-class applied to the root element if `required={true}`. */\n required: {}\n };\n};\nvar FormHelperText = React.forwardRef(function FormHelperText(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 ? 'p' : _props$component,\n disabled = props.disabled,\n error = props.error,\n filled = props.filled,\n focused = props.focused,\n margin = props.margin,\n required = props.required,\n variant = props.variant,\n other = _objectWithoutProperties(props, [\"children\", \"classes\", \"className\", \"component\", \"disabled\", \"error\", \"filled\", \"focused\", \"margin\", \"required\", \"variant\"]);\n\n var muiFormControl = useFormControl();\n var fcs = formControlState({\n props: props,\n muiFormControl: muiFormControl,\n states: ['variant', 'margin', 'disabled', 'error', 'filled', 'focused', 'required']\n });\n return React.createElement(Component, _extends({\n className: clsx(classes.root, (fcs.variant === 'filled' || fcs.variant === 'outlined') && classes.contained, className, fcs.disabled && classes.disabled, fcs.error && classes.error, fcs.filled && classes.filled, fcs.focused && classes.focused, fcs.required && classes.required, fcs.margin === 'dense' && classes.marginDense),\n ref: ref\n }, other), children === ' ' ? // eslint-disable-next-line react/no-danger\n React.createElement(\"span\", {\n dangerouslySetInnerHTML: {\n __html: ''\n }\n }) : children);\n});\nprocess.env.NODE_ENV !== \"production\" ? FormHelperText.propTypes = {\n /**\n * The content of the component.\n *\n * If `' '` is provided, the component reserves one line height for displaying a future message.\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 DOM element or a component.\n */\n component: PropTypes.elementType,\n\n /**\n * If `true`, the helper text should be displayed in a disabled state.\n */\n disabled: PropTypes.bool,\n\n /**\n * If `true`, helper text should be displayed in an error state.\n */\n error: PropTypes.bool,\n\n /**\n * If `true`, the helper text should use filled classes key.\n */\n filled: PropTypes.bool,\n\n /**\n * If `true`, the helper text should use focused classes key.\n */\n focused: PropTypes.bool,\n\n /**\n * If `dense`, will adjust vertical spacing. This is normally obtained via context from\n * FormControl.\n */\n margin: PropTypes.oneOf(['dense']),\n\n /**\n * If `true`, the helper text should use required classes key.\n */\n required: PropTypes.bool,\n\n /**\n * The variant to use.\n */\n variant: PropTypes.oneOf(['standard', 'outlined', 'filled'])\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiFormHelperText'\n})(FormHelperText);","import arrayWithHoles from \"./arrayWithHoles\";\nimport iterableToArrayLimit from \"./iterableToArrayLimit\";\nimport nonIterableRest from \"./nonIterableRest\";\nexport default function _slicedToArray(arr, i) {\n return arrayWithHoles(arr) || iterableToArrayLimit(arr, i) || nonIterableRest();\n}","export default function _arrayWithHoles(arr) {\n if (Array.isArray(arr)) return arr;\n}","export default function _iterableToArrayLimit(arr, i) {\n if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === \"[object Arguments]\")) {\n return;\n }\n\n var _arr = [];\n var _n = true;\n var _d = false;\n var _e = undefined;\n\n try {\n for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) {\n _arr.push(_s.value);\n\n if (i && _arr.length === i) break;\n }\n } catch (err) {\n _d = true;\n _e = err;\n } finally {\n try {\n if (!_n && _i[\"return\"] != null) _i[\"return\"]();\n } finally {\n if (_d) throw _e;\n }\n }\n\n return _arr;\n}","export default function _nonIterableRest() {\n throw new TypeError(\"Invalid attempt to destructure non-iterable instance\");\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport { Transition } from 'react-transition-group';\nimport useTheme from '../styles/useTheme';\nimport { reflow, getTransitionProps } from '../transitions/utils';\nimport useForkRef from '../utils/useForkRef';\n\nfunction getScale(value) {\n return \"scale(\".concat(value, \", \").concat(Math.pow(value, 2), \")\");\n}\n\nvar styles = {\n entering: {\n opacity: 1,\n transform: getScale(1)\n },\n entered: {\n opacity: 1,\n transform: 'none'\n }\n};\n/**\n * The Grow transition is used by the [Tooltip](/components/tooltips/) and\n * [Popover](/components/popover/) components.\n * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally.\n */\n\nvar Grow = React.forwardRef(function Grow(props, ref) {\n var children = props.children,\n inProp = props.in,\n onEnter = props.onEnter,\n onExit = props.onExit,\n style = props.style,\n _props$timeout = props.timeout,\n timeout = _props$timeout === void 0 ? 'auto' : _props$timeout,\n other = _objectWithoutProperties(props, [\"children\", \"in\", \"onEnter\", \"onExit\", \"style\", \"timeout\"]);\n\n var timer = React.useRef();\n var autoTimeout = React.useRef();\n var handleRef = useForkRef(children.ref, ref);\n var theme = useTheme();\n\n var handleEnter = function handleEnter(node, isAppearing) {\n reflow(node); // So the animation always start from the start.\n\n var _getTransitionProps = getTransitionProps({\n style: style,\n timeout: timeout\n }, {\n mode: 'enter'\n }),\n transitionDuration = _getTransitionProps.duration,\n delay = _getTransitionProps.delay;\n\n var duration;\n\n if (timeout === 'auto') {\n duration = theme.transitions.getAutoHeightDuration(node.clientHeight);\n autoTimeout.current = duration;\n } else {\n duration = transitionDuration;\n }\n\n node.style.transition = [theme.transitions.create('opacity', {\n duration: duration,\n delay: delay\n }), theme.transitions.create('transform', {\n duration: duration * 0.666,\n delay: delay\n })].join(',');\n\n if (onEnter) {\n onEnter(node, isAppearing);\n }\n };\n\n var handleExit = function handleExit(node) {\n var _getTransitionProps2 = getTransitionProps({\n style: style,\n timeout: timeout\n }, {\n mode: 'exit'\n }),\n transitionDuration = _getTransitionProps2.duration,\n delay = _getTransitionProps2.delay;\n\n var duration;\n\n if (timeout === 'auto') {\n duration = theme.transitions.getAutoHeightDuration(node.clientHeight);\n autoTimeout.current = duration;\n } else {\n duration = transitionDuration;\n }\n\n node.style.transition = [theme.transitions.create('opacity', {\n duration: duration,\n delay: delay\n }), theme.transitions.create('transform', {\n duration: duration * 0.666,\n delay: delay || duration * 0.333\n })].join(',');\n node.style.opacity = '0';\n node.style.transform = getScale(0.75);\n\n if (onExit) {\n onExit(node);\n }\n };\n\n var addEndListener = function addEndListener(_, next) {\n if (timeout === 'auto') {\n timer.current = setTimeout(next, autoTimeout.current || 0);\n }\n };\n\n React.useEffect(function () {\n return function () {\n clearTimeout(timer.current);\n };\n }, []);\n return React.createElement(Transition, _extends({\n appear: true,\n in: inProp,\n onEnter: handleEnter,\n onExit: handleExit,\n addEndListener: addEndListener,\n timeout: timeout === 'auto' ? null : timeout\n }, other), function (state, childProps) {\n return React.cloneElement(children, _extends({\n style: _extends({\n opacity: 0,\n transform: getScale(0.75),\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\" ? Grow.propTypes = {\n /**\n * A single child content element.\n */\n children: PropTypes.element,\n\n /**\n * If `true`, show the component; triggers the enter or exit animation.\n */\n in: PropTypes.bool,\n\n /**\n * @ignore\n */\n onEnter: PropTypes.func,\n\n /**\n * @ignore\n */\n onExit: 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 * Set to 'auto' to automatically calculate transition time based on height.\n */\n timeout: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({\n enter: PropTypes.number,\n exit: PropTypes.number\n }), PropTypes.oneOf(['auto'])])\n} : void 0;\nGrow.muiSupportAuto = true;\nexport default Grow;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport ReactDOM from 'react-dom';\nimport debounce from '../utils/debounce';\nimport clsx from 'clsx';\nimport { chainPropTypes, elementTypeAcceptingRef, refType } from '@material-ui/utils';\nimport ownerDocument from '../utils/ownerDocument';\nimport ownerWindow from '../utils/ownerWindow';\nimport createChainedFunction from '../utils/createChainedFunction';\nimport withStyles from '../styles/withStyles';\nimport Modal from '../Modal';\nimport Grow from '../Grow';\nimport Paper from '../Paper';\nexport function getOffsetTop(rect, vertical) {\n var offset = 0;\n\n if (typeof vertical === 'number') {\n offset = vertical;\n } else if (vertical === 'center') {\n offset = rect.height / 2;\n } else if (vertical === 'bottom') {\n offset = rect.height;\n }\n\n return offset;\n}\nexport function getOffsetLeft(rect, horizontal) {\n var offset = 0;\n\n if (typeof horizontal === 'number') {\n offset = horizontal;\n } else if (horizontal === 'center') {\n offset = rect.width / 2;\n } else if (horizontal === 'right') {\n offset = rect.width;\n }\n\n return offset;\n}\n\nfunction getTransformOriginValue(transformOrigin) {\n return [transformOrigin.horizontal, transformOrigin.vertical].map(function (n) {\n return typeof n === 'number' ? \"\".concat(n, \"px\") : n;\n }).join(' ');\n} // Sum the scrollTop between two elements.\n\n\nfunction getScrollParent(parent, child) {\n var element = child;\n var scrollTop = 0;\n\n while (element && element !== parent) {\n element = element.parentElement;\n scrollTop += element.scrollTop;\n }\n\n return scrollTop;\n}\n\nfunction getAnchorEl(anchorEl) {\n return typeof anchorEl === 'function' ? anchorEl() : anchorEl;\n}\n\nexport var styles = {\n /* Styles applied to the root element */\n root: {},\n\n /* Styles applied to the `Paper` component. */\n paper: {\n position: 'absolute',\n overflowY: 'auto',\n overflowX: 'hidden',\n // So we see the popover when it's empty.\n // It's most likely on issue on userland.\n minWidth: 16,\n minHeight: 16,\n maxWidth: 'calc(100% - 32px)',\n maxHeight: 'calc(100% - 32px)',\n // We disable the focus ring for mouse, touch and keyboard users.\n outline: 0\n }\n};\nvar Popover = React.forwardRef(function Popover(props, ref) {\n var action = props.action,\n anchorEl = props.anchorEl,\n _props$anchorOrigin = props.anchorOrigin,\n anchorOrigin = _props$anchorOrigin === void 0 ? {\n vertical: 'top',\n horizontal: 'left'\n } : _props$anchorOrigin,\n anchorPosition = props.anchorPosition,\n _props$anchorReferenc = props.anchorReference,\n anchorReference = _props$anchorReferenc === void 0 ? 'anchorEl' : _props$anchorReferenc,\n children = props.children,\n classes = props.classes,\n className = props.className,\n containerProp = props.container,\n _props$elevation = props.elevation,\n elevation = _props$elevation === void 0 ? 8 : _props$elevation,\n getContentAnchorEl = props.getContentAnchorEl,\n _props$marginThreshol = props.marginThreshold,\n marginThreshold = _props$marginThreshol === void 0 ? 16 : _props$marginThreshol,\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 open = props.open,\n _props$PaperProps = props.PaperProps,\n PaperProps = _props$PaperProps === void 0 ? {} : _props$PaperProps,\n _props$transformOrigi = props.transformOrigin,\n transformOrigin = _props$transformOrigi === void 0 ? {\n vertical: 'top',\n horizontal: 'left'\n } : _props$transformOrigi,\n _props$TransitionComp = props.TransitionComponent,\n TransitionComponent = _props$TransitionComp === void 0 ? Grow : _props$TransitionComp,\n _props$transitionDura = props.transitionDuration,\n transitionDurationProp = _props$transitionDura === void 0 ? 'auto' : _props$transitionDura,\n _props$TransitionProp = props.TransitionProps,\n TransitionProps = _props$TransitionProp === void 0 ? {} : _props$TransitionProp,\n other = _objectWithoutProperties(props, [\"action\", \"anchorEl\", \"anchorOrigin\", \"anchorPosition\", \"anchorReference\", \"children\", \"classes\", \"className\", \"container\", \"elevation\", \"getContentAnchorEl\", \"marginThreshold\", \"onEnter\", \"onEntered\", \"onEntering\", \"onExit\", \"onExited\", \"onExiting\", \"open\", \"PaperProps\", \"transformOrigin\", \"TransitionComponent\", \"transitionDuration\", \"TransitionProps\"]);\n\n var paperRef = React.useRef(); // Returns the top/left offset of the position\n // to attach to on the anchor element (or body if none is provided)\n\n var getAnchorOffset = React.useCallback(function (contentAnchorOffset) {\n if (anchorReference === 'anchorPosition') {\n if (process.env.NODE_ENV !== 'production') {\n if (!anchorPosition) {\n console.error('Material-UI: you need to provide a `anchorPosition` prop when using ' + ' .');\n }\n }\n\n return anchorPosition;\n }\n\n var resolvedAnchorEl = getAnchorEl(anchorEl);\n var containerWindow = ownerWindow(resolvedAnchorEl); // If an anchor element wasn't provided, just use the parent body element of this Popover\n\n var anchorElement = resolvedAnchorEl instanceof containerWindow.Element ? resolvedAnchorEl : ownerDocument(paperRef.current).body;\n var anchorRect = anchorElement.getBoundingClientRect();\n\n if (process.env.NODE_ENV !== 'production') {\n var box = anchorElement.getBoundingClientRect();\n\n if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {\n console.warn(['Material-UI: the `anchorEl` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', \"Make sure the element is present in the document or that it's not display none.\"].join('\\n'));\n }\n }\n\n var anchorVertical = contentAnchorOffset === 0 ? anchorOrigin.vertical : 'center';\n return {\n top: anchorRect.top + getOffsetTop(anchorRect, anchorVertical),\n left: anchorRect.left + getOffsetLeft(anchorRect, anchorOrigin.horizontal)\n };\n }, [anchorEl, anchorOrigin.horizontal, anchorOrigin.vertical, anchorPosition, anchorReference]); // Returns the vertical offset of inner content to anchor the transform on if provided\n\n var getContentAnchorOffset = React.useCallback(function (element) {\n var contentAnchorOffset = 0;\n\n if (getContentAnchorEl && anchorReference === 'anchorEl') {\n var contentAnchorEl = getContentAnchorEl(element);\n\n if (contentAnchorEl && element.contains(contentAnchorEl)) {\n var scrollTop = getScrollParent(element, contentAnchorEl);\n contentAnchorOffset = contentAnchorEl.offsetTop + contentAnchorEl.clientHeight / 2 - scrollTop || 0;\n } // != the default value\n\n\n if (process.env.NODE_ENV !== 'production') {\n if (anchorOrigin.vertical !== 'top') {\n console.error(['Material-UI: you can not change the default `anchorOrigin.vertical` value ', 'when also providing the `getContentAnchorEl` prop to the popover component.', 'Only use one of the two props.', 'Set `getContentAnchorEl` to `null | undefined`' + ' or leave `anchorOrigin.vertical` unchanged.'].join('\\n'));\n }\n }\n }\n\n return contentAnchorOffset;\n }, [anchorOrigin.vertical, anchorReference, getContentAnchorEl]); // Return the base transform origin using the element\n // and taking the content anchor offset into account if in use\n\n var getTransformOrigin = React.useCallback(function (elemRect) {\n var contentAnchorOffset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;\n return {\n vertical: getOffsetTop(elemRect, transformOrigin.vertical) + contentAnchorOffset,\n horizontal: getOffsetLeft(elemRect, transformOrigin.horizontal)\n };\n }, [transformOrigin.horizontal, transformOrigin.vertical]);\n var getPositioningStyle = React.useCallback(function (element) {\n // Check if the parent has requested anchoring on an inner content node\n var contentAnchorOffset = getContentAnchorOffset(element);\n var elemRect = {\n width: element.offsetWidth,\n height: element.offsetHeight\n }; // Get the transform origin point on the element itself\n\n var elemTransformOrigin = getTransformOrigin(elemRect, contentAnchorOffset);\n\n if (anchorReference === 'none') {\n return {\n top: null,\n left: null,\n transformOrigin: getTransformOriginValue(elemTransformOrigin)\n };\n } // Get the offset of of the anchoring element\n\n\n var anchorOffset = getAnchorOffset(contentAnchorOffset); // Calculate element positioning\n\n var top = anchorOffset.top - elemTransformOrigin.vertical;\n var left = anchorOffset.left - elemTransformOrigin.horizontal;\n var bottom = top + elemRect.height;\n var right = left + elemRect.width; // Use the parent window of the anchorEl if provided\n\n var containerWindow = ownerWindow(getAnchorEl(anchorEl)); // Window thresholds taking required margin into account\n\n var heightThreshold = containerWindow.innerHeight - marginThreshold;\n var widthThreshold = containerWindow.innerWidth - marginThreshold; // Check if the vertical axis needs shifting\n\n if (top < marginThreshold) {\n var diff = top - marginThreshold;\n top -= diff;\n elemTransformOrigin.vertical += diff;\n } else if (bottom > heightThreshold) {\n var _diff = bottom - heightThreshold;\n\n top -= _diff;\n elemTransformOrigin.vertical += _diff;\n }\n\n if (process.env.NODE_ENV !== 'production') {\n if (elemRect.height > heightThreshold && elemRect.height && heightThreshold) {\n console.error(['Material-UI: the popover component is too tall.', \"Some part of it can not be seen on the screen (\".concat(elemRect.height - heightThreshold, \"px).\"), 'Please consider adding a `max-height` to improve the user-experience.'].join('\\n'));\n }\n } // Check if the horizontal axis needs shifting\n\n\n if (left < marginThreshold) {\n var _diff2 = left - marginThreshold;\n\n left -= _diff2;\n elemTransformOrigin.horizontal += _diff2;\n } else if (right > widthThreshold) {\n var _diff3 = right - widthThreshold;\n\n left -= _diff3;\n elemTransformOrigin.horizontal += _diff3;\n }\n\n return {\n top: \"\".concat(Math.round(top), \"px\"),\n left: \"\".concat(Math.round(left), \"px\"),\n transformOrigin: getTransformOriginValue(elemTransformOrigin)\n };\n }, [anchorEl, anchorReference, getAnchorOffset, getContentAnchorOffset, getTransformOrigin, marginThreshold]);\n var setPositioningStyles = React.useCallback(function () {\n var element = paperRef.current;\n\n if (!element) {\n return;\n }\n\n var positioning = getPositioningStyle(element);\n\n if (positioning.top !== null) {\n element.style.top = positioning.top;\n }\n\n if (positioning.left !== null) {\n element.style.left = positioning.left;\n }\n\n element.style.transformOrigin = positioning.transformOrigin;\n }, [getPositioningStyle]);\n\n var handleEntering = function handleEntering(element, isAppearing) {\n if (onEntering) {\n onEntering(element, isAppearing);\n }\n\n setPositioningStyles();\n };\n\n var handlePaperRef = React.useCallback(function (instance) {\n // #StrictMode ready\n paperRef.current = ReactDOM.findDOMNode(instance);\n }, []);\n React.useEffect(function () {\n if (open) {\n setPositioningStyles();\n }\n });\n React.useImperativeHandle(action, function () {\n return open ? {\n updatePosition: function updatePosition() {\n setPositioningStyles();\n }\n } : null;\n }, [open, setPositioningStyles]);\n React.useEffect(function () {\n if (!open) {\n return undefined;\n }\n\n var handleResize = debounce(function () {\n setPositioningStyles();\n });\n window.addEventListener('resize', handleResize);\n return function () {\n handleResize.clear();\n window.removeEventListener('rezise', handleResize);\n };\n }, [open, setPositioningStyles]);\n var transitionDuration = transitionDurationProp;\n\n if (transitionDurationProp === 'auto' && !TransitionComponent.muiSupportAuto) {\n transitionDuration = undefined;\n } // If the container prop is provided, use that\n // If the anchorEl prop is provided, use its parent body element as the container\n // If neither are provided let the Modal take care of choosing the container\n\n\n var container = containerProp || (anchorEl ? ownerDocument(getAnchorEl(anchorEl)).body : undefined);\n return React.createElement(Modal, _extends({\n container: container,\n open: open,\n ref: ref,\n BackdropProps: {\n invisible: true\n },\n className: clsx(classes.root, className)\n }, other), React.createElement(TransitionComponent, _extends({\n appear: true,\n in: open,\n onEnter: onEnter,\n onEntered: onEntered,\n onExit: onExit,\n onExited: onExited,\n onExiting: onExiting,\n timeout: transitionDuration\n }, TransitionProps, {\n onEntering: createChainedFunction(handleEntering, TransitionProps.onEntering)\n }), React.createElement(Paper, _extends({\n elevation: elevation,\n ref: handlePaperRef\n }, PaperProps, {\n className: clsx(classes.paper, PaperProps.className)\n }), children)));\n});\nprocess.env.NODE_ENV !== \"production\" ? Popover.propTypes = {\n /**\n * A ref for imperative actions.\n * It currently only supports updatePosition() action.\n */\n action: refType,\n\n /**\n * This is the DOM element, or a function that returns the DOM element,\n * that may be used to set the position of the popover.\n */\n anchorEl: chainPropTypes(PropTypes.oneOfType([PropTypes.object, PropTypes.func]), function (props) {\n if (props.open && (!props.anchorReference || props.anchorReference === 'anchorEl')) {\n var resolvedAnchorEl = getAnchorEl(props.anchorEl);\n var containerWindow = ownerWindow(resolvedAnchorEl);\n\n if (resolvedAnchorEl instanceof containerWindow.Element) {\n var box = resolvedAnchorEl.getBoundingClientRect();\n\n if (process.env.NODE_ENV !== 'test' && box.top === 0 && box.left === 0 && box.right === 0 && box.bottom === 0) {\n return new Error(['Material-UI: the `anchorEl` prop provided to the component is invalid.', 'The anchor element should be part of the document layout.', \"Make sure the element is present in the document or that it's not display none.\"].join('\\n'));\n }\n } else {\n return new Error(['Material-UI: the `anchorEl` prop provided to the component is invalid.', \"It should be an Element instance but it's `\".concat(resolvedAnchorEl, \"` instead.\")].join('\\n'));\n }\n }\n\n return null;\n }),\n\n /**\n * This is the point on the anchor where the popover's\n * `anchorEl` will attach to. This is not used when the\n * anchorReference is 'anchorPosition'.\n *\n * Options:\n * vertical: [top, center, bottom];\n * horizontal: [left, center, right].\n */\n anchorOrigin: PropTypes.shape({\n horizontal: PropTypes.oneOfType([PropTypes.number, PropTypes.oneOf(['left', 'center', 'right'])]).isRequired,\n vertical: PropTypes.oneOfType([PropTypes.number, PropTypes.oneOf(['top', 'center', 'bottom'])]).isRequired\n }),\n\n /**\n * This is the position that may be used\n * to set the position of the popover.\n * The coordinates are relative to\n * the application's client area.\n */\n anchorPosition: PropTypes.shape({\n left: PropTypes.number.isRequired,\n top: PropTypes.number.isRequired\n }),\n\n /*\n * This determines which anchor prop to refer to to set\n * the position of the popover.\n */\n anchorReference: PropTypes.oneOf(['anchorEl', 'anchorPosition', 'none']),\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 * A node, component instance, or function that returns either.\n * The `container` will passed to the Modal component.\n * By default, it uses the body of the anchorEl's top-level document object,\n * so it's simply `document.body` most of the time.\n */\n container: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),\n\n /**\n * The elevation of the popover.\n */\n elevation: PropTypes.number,\n\n /**\n * This function is called in order to retrieve the content anchor element.\n * It's the opposite of the `anchorEl` prop.\n * The content anchor element should be an element inside the popover.\n * It's used to correctly scroll and set the position of the popover.\n * The positioning strategy tries to make the content anchor element just above the\n * anchor element.\n */\n getContentAnchorEl: PropTypes.func,\n\n /**\n * Specifies how close to the edge of the window the popover can appear.\n */\n marginThreshold: 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 * @param {string} reason Can be: `\"escapeKeyDown\"`, `\"backdropClick\"`.\n */\n onClose: PropTypes.func,\n\n /**\n * Callback fired before the component is entering.\n */\n onEnter: PropTypes.func,\n\n /**\n * Callback fired when the component has entered.\n */\n onEntered: PropTypes.func,\n\n /**\n * Callback fired when the component is entering.\n */\n onEntering: PropTypes.func,\n\n /**\n * Callback fired before the component is exiting.\n */\n onExit: PropTypes.func,\n\n /**\n * Callback fired when the component has exited.\n */\n onExited: PropTypes.func,\n\n /**\n * Callback fired when the component is exiting.\n */\n onExiting: PropTypes.func,\n\n /**\n * If `true`, the popover is visible.\n */\n open: PropTypes.bool.isRequired,\n\n /**\n * Props applied to the [`Paper`](/api/paper/) element.\n */\n PaperProps: PropTypes.shape({\n component: elementTypeAcceptingRef\n }),\n\n /**\n * This is the point on the popover which\n * will attach to the anchor's origin.\n *\n * Options:\n * vertical: [top, center, bottom, x(px)];\n * horizontal: [left, center, right, x(px)].\n */\n transformOrigin: PropTypes.shape({\n horizontal: PropTypes.oneOfType([PropTypes.number, PropTypes.oneOf(['left', 'center', 'right'])]).isRequired,\n vertical: PropTypes.oneOfType([PropTypes.number, PropTypes.oneOf(['top', 'center', 'bottom'])]).isRequired\n }),\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 * Set to 'auto' to automatically calculate transition time based on height.\n */\n transitionDuration: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({\n enter: PropTypes.number,\n exit: PropTypes.number\n }), PropTypes.oneOf(['auto'])]),\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: 'MuiPopover'\n})(Popover);","import React from 'react';\n/**\n * @ignore - internal component.\n */\n\nvar ListContext = React.createContext({});\n\nif (process.env.NODE_ENV !== 'production') {\n ListContext.displayName = 'ListContext';\n}\n\nexport default ListContext;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport ListContext from './ListContext';\nexport var styles = {\n /* Styles applied to the root element. */\n root: {\n listStyle: 'none',\n margin: 0,\n padding: 0,\n position: 'relative'\n },\n\n /* Styles applied to the root element if `disablePadding={false}`. */\n padding: {\n paddingTop: 8,\n paddingBottom: 8\n },\n\n /* Styles applied to the root element if dense. */\n dense: {},\n\n /* Styles applied to the root element if a `subheader` is provided. */\n subheader: {\n paddingTop: 0\n }\n};\nvar List = React.forwardRef(function List(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 ? 'ul' : _props$component,\n _props$dense = props.dense,\n dense = _props$dense === void 0 ? false : _props$dense,\n _props$disablePadding = props.disablePadding,\n disablePadding = _props$disablePadding === void 0 ? false : _props$disablePadding,\n subheader = props.subheader,\n other = _objectWithoutProperties(props, [\"children\", \"classes\", \"className\", \"component\", \"dense\", \"disablePadding\", \"subheader\"]);\n\n var context = React.useMemo(function () {\n return {\n dense: dense\n };\n }, [dense]);\n return React.createElement(ListContext.Provider, {\n value: context\n }, React.createElement(Component, _extends({\n className: clsx(classes.root, className, dense && classes.dense, !disablePadding && classes.padding, subheader && classes.subheader),\n ref: ref\n }, other), subheader, children));\n});\nprocess.env.NODE_ENV !== \"production\" ? List.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 component used for the root node.\n * Either a string to use a DOM element or a component.\n */\n component: PropTypes.elementType,\n\n /**\n * If `true`, compact vertical padding designed for keyboard and mouse input will be used for\n * the list and list items.\n * The prop is available to descendant components as the `dense` context.\n */\n dense: PropTypes.bool,\n\n /**\n * If `true`, vertical padding will be removed from the list.\n */\n disablePadding: PropTypes.bool,\n\n /**\n * The content of the subheader, normally `ListSubheader`.\n */\n subheader: PropTypes.node\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiList'\n})(List);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport { isFragment } from 'react-is';\nimport PropTypes from 'prop-types';\nimport ReactDOM from 'react-dom';\nimport ownerDocument from '../utils/ownerDocument';\nimport List from '../List';\nimport getScrollbarSize from '../utils/getScrollbarSize';\nimport useForkRef from '../utils/useForkRef';\n\nfunction nextItem(list, item, disableListWrap) {\n if (list === item) {\n return list.firstChild;\n }\n\n if (item && item.nextElementSibling) {\n return item.nextElementSibling;\n }\n\n return disableListWrap ? null : list.firstChild;\n}\n\nfunction previousItem(list, item, disableListWrap) {\n if (list === item) {\n return disableListWrap ? list.firstChild : list.lastChild;\n }\n\n if (item && item.previousElementSibling) {\n return item.previousElementSibling;\n }\n\n return disableListWrap ? null : list.lastChild;\n}\n\nfunction textCriteriaMatches(nextFocus, textCriteria) {\n if (textCriteria === undefined) {\n return true;\n }\n\n var text = nextFocus.innerText;\n\n if (text === undefined) {\n // jsdom doesn't support innerText\n text = nextFocus.textContent;\n }\n\n text = text.trim().toLowerCase();\n\n if (text.length === 0) {\n return false;\n }\n\n if (textCriteria.repeating) {\n return text[0] === textCriteria.keys[0];\n }\n\n return text.indexOf(textCriteria.keys.join('')) === 0;\n}\n\nfunction moveFocus(list, currentFocus, disableListWrap, traversalFunction, textCriteria) {\n var wrappedOnce = false;\n var nextFocus = traversalFunction(list, currentFocus, currentFocus ? disableListWrap : false);\n\n while (nextFocus) {\n // Prevent infinite loop.\n if (nextFocus === list.firstChild) {\n if (wrappedOnce) {\n return false;\n }\n\n wrappedOnce = true;\n } // Move to the next element.\n\n\n if (!nextFocus.hasAttribute('tabindex') || nextFocus.disabled || nextFocus.getAttribute('aria-disabled') === 'true' || !textCriteriaMatches(nextFocus, textCriteria)) {\n nextFocus = traversalFunction(list, nextFocus, disableListWrap);\n } else {\n nextFocus.focus();\n return true;\n }\n }\n\n return false;\n}\n\nvar useEnhancedEffect = typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect;\n/**\n * A permanently displayed menu following https://www.w3.org/TR/wai-aria-practices/#menubutton\n * It's exposed to help customization of the [`Menu`](/api/menu/) component. If you\n * use it separately you need to move focus into the component manually. Once\n * the focus is placed inside the component it is fully keyboard accessible.\n */\n\nvar MenuList = React.forwardRef(function MenuList(props, ref) {\n var actions = props.actions,\n _props$autoFocus = props.autoFocus,\n autoFocus = _props$autoFocus === void 0 ? false : _props$autoFocus,\n _props$autoFocusItem = props.autoFocusItem,\n autoFocusItem = _props$autoFocusItem === void 0 ? false : _props$autoFocusItem,\n children = props.children,\n className = props.className,\n onKeyDown = props.onKeyDown,\n _props$disableListWra = props.disableListWrap,\n disableListWrap = _props$disableListWra === void 0 ? false : _props$disableListWra,\n _props$variant = props.variant,\n variant = _props$variant === void 0 ? 'selectedMenu' : _props$variant,\n other = _objectWithoutProperties(props, [\"actions\", \"autoFocus\", \"autoFocusItem\", \"children\", \"className\", \"onKeyDown\", \"disableListWrap\", \"variant\"]);\n\n var listRef = React.useRef(null);\n var textCriteriaRef = React.useRef({\n keys: [],\n repeating: true,\n previousKeyMatched: true,\n lastTime: null\n });\n useEnhancedEffect(function () {\n if (autoFocus) {\n listRef.current.focus();\n }\n }, [autoFocus]);\n React.useImperativeHandle(actions, function () {\n return {\n adjustStyleForScrollbar: function adjustStyleForScrollbar(containerElement, theme) {\n // Let's ignore that piece of logic if users are already overriding the width\n // of the menu.\n var noExplicitWidth = !listRef.current.style.width;\n\n if (containerElement.clientHeight < listRef.current.clientHeight && noExplicitWidth) {\n var scrollbarSize = \"\".concat(getScrollbarSize(true), \"px\");\n listRef.current.style[theme.direction === 'rtl' ? 'paddingLeft' : 'paddingRight'] = scrollbarSize;\n listRef.current.style.width = \"calc(100% + \".concat(scrollbarSize, \")\");\n }\n\n return listRef.current;\n }\n };\n }, []);\n\n var handleKeyDown = function handleKeyDown(event) {\n var list = listRef.current;\n var key = event.key;\n /**\n * @type {Element} - will always be defined since we are in a keydown handler\n * attached to an element. A keydown event is either dispatched to the activeElement\n * or document.body or document.documentElement. Only the first case will\n * trigger this specific handler.\n */\n\n var currentFocus = ownerDocument(list).activeElement;\n\n if (key === 'ArrowDown') {\n // Prevent scroll of the page\n event.preventDefault();\n moveFocus(list, currentFocus, disableListWrap, nextItem);\n } else if (key === 'ArrowUp') {\n event.preventDefault();\n moveFocus(list, currentFocus, disableListWrap, previousItem);\n } else if (key === 'Home') {\n event.preventDefault();\n moveFocus(list, null, disableListWrap, nextItem);\n } else if (key === 'End') {\n event.preventDefault();\n moveFocus(list, null, disableListWrap, previousItem);\n } else if (key.length === 1) {\n var criteria = textCriteriaRef.current;\n var lowerKey = key.toLowerCase();\n var currTime = performance.now();\n\n if (criteria.keys.length > 0) {\n // Reset\n if (currTime - criteria.lastTime > 500) {\n criteria.keys = [];\n criteria.repeating = true;\n criteria.previousKeyMatched = true;\n } else if (criteria.repeating && lowerKey !== criteria.keys[0]) {\n criteria.repeating = false;\n }\n }\n\n criteria.lastTime = currTime;\n criteria.keys.push(lowerKey);\n var keepFocusOnCurrent = currentFocus && !criteria.repeating && textCriteriaMatches(currentFocus, criteria);\n\n if (criteria.previousKeyMatched && (keepFocusOnCurrent || moveFocus(list, currentFocus, false, nextItem, criteria))) {\n event.preventDefault();\n } else {\n criteria.previousKeyMatched = false;\n }\n }\n\n if (onKeyDown) {\n onKeyDown(event);\n }\n };\n\n var handleOwnRef = React.useCallback(function (instance) {\n // #StrictMode ready\n listRef.current = ReactDOM.findDOMNode(instance);\n }, []);\n var handleRef = useForkRef(handleOwnRef, ref);\n /**\n * the index of the item should receive focus\n * in a `variant=\"selectedMenu\"` it's the first `selected` item\n * otherwise it's the very first item.\n */\n\n var activeItemIndex = -1; // since we inject focus related props into children we have to do a lookahead\n // to check if there is a `selected` item. We're looking for the last `selected`\n // item and use the first valid item as a fallback\n\n React.Children.forEach(children, function (child, index) {\n if (!React.isValidElement(child)) {\n return;\n }\n\n if (process.env.NODE_ENV !== 'production') {\n if (isFragment(child)) {\n console.error([\"Material-UI: the Menu component doesn't accept a Fragment as a child.\", 'Consider providing an array instead.'].join('\\n'));\n }\n }\n\n if (!child.props.disabled) {\n if (variant === 'selectedMenu' && child.props.selected) {\n activeItemIndex = index;\n } else if (activeItemIndex === -1) {\n activeItemIndex = index;\n }\n }\n });\n var items = React.Children.map(children, function (child, index) {\n if (index === activeItemIndex) {\n var newChildProps = {};\n\n if (autoFocusItem) {\n newChildProps.autoFocus = true;\n }\n\n if (child.props.tabIndex === undefined && variant === 'selectedMenu') {\n newChildProps.tabIndex = 0;\n }\n\n if (newChildProps !== null) {\n return React.cloneElement(child, newChildProps);\n }\n }\n\n return child;\n });\n return React.createElement(List, _extends({\n role: \"menu\",\n ref: handleRef,\n className: className,\n onKeyDown: handleKeyDown,\n tabIndex: autoFocus ? 0 : -1\n }, other), items);\n});\nprocess.env.NODE_ENV !== \"production\" ? MenuList.propTypes = {\n /**\n * @ignore\n */\n actions: PropTypes.shape({\n current: PropTypes.object\n }),\n\n /**\n * If `true`, will focus the `[role=\"menu\"]` container and move into tab order\n */\n autoFocus: PropTypes.bool,\n\n /**\n * If `true`, will focus the first menuitem if `variant=\"menu\"` or selected item\n * if `variant=\"selectedMenu\"`\n */\n autoFocusItem: PropTypes.bool,\n\n /**\n * MenuList contents, normally `MenuItem`s.\n */\n children: PropTypes.node,\n\n /**\n * @ignore\n */\n className: PropTypes.string,\n\n /**\n * If `true`, the menu items will not wrap focus.\n */\n disableListWrap: PropTypes.bool,\n\n /**\n * @ignore\n */\n onKeyDown: PropTypes.func,\n\n /**\n * The variant to use. Use `menu` to prevent selected items from impacting the initial focus\n * and the vertical alignment relative to the anchor element.\n */\n variant: PropTypes.oneOf(['menu', 'selectedMenu'])\n} : void 0;\nexport default MenuList;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport { isFragment } from 'react-is';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport Popover from '../Popover';\nimport MenuList from '../MenuList';\nimport ReactDOM from 'react-dom';\nimport setRef from '../utils/setRef';\nimport useTheme from '../styles/useTheme';\nvar RTL_ORIGIN = {\n vertical: 'top',\n horizontal: 'right'\n};\nvar LTR_ORIGIN = {\n vertical: 'top',\n horizontal: 'left'\n};\nexport var styles = {\n /* Styles applied to the `Paper` component. */\n paper: {\n // specZ: The maximum height of a simple menu should be one or more rows less than the view\n // height. This ensures a tapable area outside of the simple menu with which to dismiss\n // the menu.\n maxHeight: 'calc(100% - 96px)',\n // Add iOS momentum scrolling.\n WebkitOverflowScrolling: 'touch'\n },\n\n /* Styles applied to the `List` component via `MenuList`. */\n list: {\n // We disable the focus ring for mouse, touch and keyboard users.\n outline: 0\n }\n};\nvar Menu = React.forwardRef(function Menu(props, ref) {\n var _props$autoFocus = props.autoFocus,\n autoFocus = _props$autoFocus === void 0 ? true : _props$autoFocus,\n children = props.children,\n classes = props.classes,\n _props$disableAutoFoc = props.disableAutoFocusItem,\n disableAutoFocusItem = _props$disableAutoFoc === void 0 ? false : _props$disableAutoFoc,\n _props$MenuListProps = props.MenuListProps,\n MenuListProps = _props$MenuListProps === void 0 ? {} : _props$MenuListProps,\n onClose = props.onClose,\n onEntering = props.onEntering,\n open = props.open,\n _props$PaperProps = props.PaperProps,\n PaperProps = _props$PaperProps === void 0 ? {} : _props$PaperProps,\n PopoverClasses = props.PopoverClasses,\n _props$transitionDura = props.transitionDuration,\n transitionDuration = _props$transitionDura === void 0 ? 'auto' : _props$transitionDura,\n _props$variant = props.variant,\n variant = _props$variant === void 0 ? 'selectedMenu' : _props$variant,\n other = _objectWithoutProperties(props, [\"autoFocus\", \"children\", \"classes\", \"disableAutoFocusItem\", \"MenuListProps\", \"onClose\", \"onEntering\", \"open\", \"PaperProps\", \"PopoverClasses\", \"transitionDuration\", \"variant\"]);\n\n var theme = useTheme();\n var autoFocusItem = autoFocus && !disableAutoFocusItem && open;\n var menuListActionsRef = React.useRef(null);\n var contentAnchorRef = React.useRef(null);\n\n var getContentAnchorEl = function getContentAnchorEl() {\n return contentAnchorRef.current;\n };\n\n var handleEntering = function handleEntering(element, isAppearing) {\n if (menuListActionsRef.current) {\n menuListActionsRef.current.adjustStyleForScrollbar(element, theme);\n }\n\n if (onEntering) {\n onEntering(element, isAppearing);\n }\n };\n\n var handleListKeyDown = function handleListKeyDown(event) {\n if (event.key === 'Tab') {\n event.preventDefault();\n\n if (onClose) {\n onClose(event, 'tabKeyDown');\n }\n }\n };\n /**\n * the index of the item should receive focus\n * in a `variant=\"selectedMenu\"` it's the first `selected` item\n * otherwise it's the very first item.\n */\n\n\n var activeItemIndex = -1; // since we inject focus related props into children we have to do a lookahead\n // to check if there is a `selected` item. We're looking for the last `selected`\n // item and use the first valid item as a fallback\n\n React.Children.map(children, function (child, index) {\n if (!React.isValidElement(child)) {\n return;\n }\n\n if (process.env.NODE_ENV !== 'production') {\n if (isFragment(child)) {\n console.error([\"Material-UI: the Menu component doesn't accept a Fragment as a child.\", 'Consider providing an array instead.'].join('\\n'));\n }\n }\n\n if (!child.props.disabled) {\n if (variant !== \"menu\" && child.props.selected) {\n activeItemIndex = index;\n } else if (activeItemIndex === -1) {\n activeItemIndex = index;\n }\n }\n });\n var items = React.Children.map(children, function (child, index) {\n if (index === activeItemIndex) {\n return React.cloneElement(child, {\n ref: function ref(instance) {\n // #StrictMode ready\n contentAnchorRef.current = ReactDOM.findDOMNode(instance);\n setRef(child.ref, instance);\n }\n });\n }\n\n return child;\n });\n return React.createElement(Popover, _extends({\n getContentAnchorEl: getContentAnchorEl,\n classes: PopoverClasses,\n onClose: onClose,\n onEntering: handleEntering,\n anchorOrigin: theme.direction === 'rtl' ? RTL_ORIGIN : LTR_ORIGIN,\n transformOrigin: theme.direction === 'rtl' ? RTL_ORIGIN : LTR_ORIGIN,\n PaperProps: _extends({}, PaperProps, {\n classes: _extends({}, PaperProps.classes, {\n root: classes.paper\n })\n }),\n open: open,\n ref: ref,\n transitionDuration: transitionDuration\n }, other), React.createElement(MenuList, _extends({\n onKeyDown: handleListKeyDown,\n actions: menuListActionsRef,\n autoFocus: autoFocus && (activeItemIndex === -1 || disableAutoFocusItem),\n autoFocusItem: autoFocusItem,\n variant: variant\n }, MenuListProps, {\n className: clsx(classes.list, MenuListProps.className)\n }), items));\n});\nprocess.env.NODE_ENV !== \"production\" ? Menu.propTypes = {\n /**\n * The DOM element used to set the position of the menu.\n */\n anchorEl: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),\n\n /**\n * If `true` (Default) will focus the `[role=\"menu\"]` if no focusable child is found. Disabled\n * children are not focusable. If you set this prop to `false` focus will be placed\n * on the parent modal container. This has severe accessibility implications\n * and should only be considered if you manage focus otherwise.\n */\n autoFocus: PropTypes.bool,\n\n /**\n * Menu contents, normally `MenuItem`s.\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 * When opening the menu will not focus the active item but the `[role=\"menu\"]`\n * unless `autoFocus` is also set to `false`. Not using the default means not\n * following WAI-ARIA authoring practices. Please be considerate about possible\n * accessibility implications.\n */\n disableAutoFocusItem: PropTypes.bool,\n\n /**\n * Props applied to the [`MenuList`](/api/menu-list/) element.\n */\n MenuListProps: PropTypes.object,\n\n /**\n * Callback fired when the component requests to be closed.\n *\n * @param {object} event The event source of the callback.\n * @param {string} reason Can be: `\"escapeKeyDown\"`, `\"backdropClick\"`, `\"tabKeyDown\"`.\n */\n onClose: PropTypes.func,\n\n /**\n * Callback fired before the Menu enters.\n */\n onEnter: PropTypes.func,\n\n /**\n * Callback fired when the Menu has entered.\n */\n onEntered: PropTypes.func,\n\n /**\n * Callback fired when the Menu is entering.\n */\n onEntering: PropTypes.func,\n\n /**\n * Callback fired before the Menu exits.\n */\n onExit: PropTypes.func,\n\n /**\n * Callback fired when the Menu has exited.\n */\n onExited: PropTypes.func,\n\n /**\n * Callback fired when the Menu is exiting.\n */\n onExiting: PropTypes.func,\n\n /**\n * If `true`, the menu is visible.\n */\n open: PropTypes.bool.isRequired,\n\n /**\n * @ignore\n */\n PaperProps: PropTypes.object,\n\n /**\n * `classes` prop applied to the [`Popover`](/api/popover/) element.\n */\n PopoverClasses: PropTypes.object,\n\n /**\n * The length of the transition in `ms`, or 'auto'\n */\n transitionDuration: PropTypes.oneOfType([PropTypes.number, PropTypes.shape({\n enter: PropTypes.number,\n exit: PropTypes.number\n }), PropTypes.oneOf(['auto'])]),\n\n /**\n * The variant to use. Use `menu` to prevent selected items from impacting the initial focus\n * and the vertical alignment relative to the anchor element.\n */\n variant: PropTypes.oneOf(['menu', 'selectedMenu'])\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiMenu'\n})(Menu);","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 _typeof from \"@babel/runtime/helpers/esm/typeof\";\nimport React from 'react';\nimport { isFragment } from 'react-is';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport capitalize from '../utils/capitalize';\nimport { refType } from '@material-ui/utils';\nimport Menu from '../Menu/Menu';\nimport { isFilled } from '../InputBase/utils';\nimport useForkRef from '../utils/useForkRef';\nimport useControlled from '../utils/useControlled';\n\nfunction areEqualValues(a, b) {\n if (_typeof(b) === 'object' && b !== null) {\n return a === b;\n }\n\n return String(a) === String(b);\n}\n\nfunction isEmpty(display) {\n return display == null || typeof display === 'string' && !display.trim();\n}\n/**\n * @ignore - internal component.\n */\n\n\nvar SelectInput = React.forwardRef(function SelectInput(props, ref) {\n var autoFocus = props.autoFocus,\n autoWidth = props.autoWidth,\n children = props.children,\n classes = props.classes,\n className = props.className,\n defaultValue = props.defaultValue,\n disabled = props.disabled,\n displayEmpty = props.displayEmpty,\n IconComponent = props.IconComponent,\n inputRefProp = props.inputRef,\n labelId = props.labelId,\n _props$MenuProps = props.MenuProps,\n MenuProps = _props$MenuProps === void 0 ? {} : _props$MenuProps,\n multiple = props.multiple,\n name = props.name,\n onBlur = props.onBlur,\n onChange = props.onChange,\n onClose = props.onClose,\n onFocus = props.onFocus,\n onOpen = props.onOpen,\n openProp = props.open,\n readOnly = props.readOnly,\n renderValue = props.renderValue,\n required = props.required,\n _props$SelectDisplayP = props.SelectDisplayProps,\n SelectDisplayProps = _props$SelectDisplayP === void 0 ? {} : _props$SelectDisplayP,\n tabIndexProp = props.tabIndex,\n type = props.type,\n valueProp = props.value,\n _props$variant = props.variant,\n variant = _props$variant === void 0 ? 'standard' : _props$variant,\n other = _objectWithoutProperties(props, [\"autoFocus\", \"autoWidth\", \"children\", \"classes\", \"className\", \"defaultValue\", \"disabled\", \"displayEmpty\", \"IconComponent\", \"inputRef\", \"labelId\", \"MenuProps\", \"multiple\", \"name\", \"onBlur\", \"onChange\", \"onClose\", \"onFocus\", \"onOpen\", \"open\", \"readOnly\", \"renderValue\", \"required\", \"SelectDisplayProps\", \"tabIndex\", \"type\", \"value\", \"variant\"]);\n\n var _useControlled = useControlled({\n controlled: valueProp,\n default: defaultValue,\n name: 'SelectInput'\n }),\n _useControlled2 = _slicedToArray(_useControlled, 2),\n value = _useControlled2[0],\n setValue = _useControlled2[1];\n\n var inputRef = React.useRef(null);\n\n var _React$useState = React.useState(null),\n displayNode = _React$useState[0],\n setDisplayNode = _React$useState[1];\n\n var _React$useRef = React.useRef(openProp != null),\n isOpenControlled = _React$useRef.current;\n\n var _React$useState2 = React.useState(),\n menuMinWidthState = _React$useState2[0],\n setMenuMinWidthState = _React$useState2[1];\n\n var _React$useState3 = React.useState(false),\n openState = _React$useState3[0],\n setOpenState = _React$useState3[1];\n\n var handleRef = useForkRef(ref, inputRefProp);\n React.useImperativeHandle(handleRef, function () {\n return {\n focus: function focus() {\n displayNode.focus();\n },\n node: inputRef.current,\n value: value\n };\n }, [displayNode, value]);\n React.useEffect(function () {\n if (autoFocus && displayNode) {\n displayNode.focus();\n }\n }, [autoFocus, displayNode]);\n\n var update = function update(open, event) {\n if (open) {\n if (onOpen) {\n onOpen(event);\n }\n } else if (onClose) {\n onClose(event);\n }\n\n if (!isOpenControlled) {\n setMenuMinWidthState(autoWidth ? null : displayNode.clientWidth);\n setOpenState(open);\n }\n };\n\n var handleMouseDown = function handleMouseDown(event) {\n // Ignore everything but left-click\n if (event.button !== 0) {\n return;\n } // Hijack the default focus behavior.\n\n\n event.preventDefault();\n displayNode.focus();\n update(true, event);\n };\n\n var handleClose = function handleClose(event) {\n update(false, event);\n };\n\n var handleItemClick = function handleItemClick(child) {\n return function (event) {\n if (!multiple) {\n update(false, event);\n }\n\n var newValue;\n\n if (multiple) {\n newValue = Array.isArray(value) ? _toConsumableArray(value) : [];\n var itemIndex = value.indexOf(child.props.value);\n\n if (itemIndex === -1) {\n newValue.push(child.props.value);\n } else {\n newValue.splice(itemIndex, 1);\n }\n } else {\n newValue = child.props.value;\n }\n\n setValue(newValue);\n\n if (onChange) {\n event.persist(); // Preact support, target is read only property on a native event.\n\n Object.defineProperty(event, 'target', {\n writable: true,\n value: {\n value: newValue,\n name: name\n }\n });\n onChange(event, child);\n }\n };\n };\n\n var handleKeyDown = function handleKeyDown(event) {\n if (!readOnly) {\n var validKeys = [' ', 'ArrowUp', 'ArrowDown', // The native select doesn't respond to enter on MacOS, but it's recommended by\n // https://www.w3.org/TR/wai-aria-practices/examples/listbox/listbox-collapsible.html\n 'Enter'];\n\n if (validKeys.indexOf(event.key) !== -1) {\n event.preventDefault();\n update(true, event);\n }\n }\n };\n\n var open = displayNode !== null && (isOpenControlled ? openProp : openState);\n\n var handleBlur = function handleBlur(event) {\n // if open event.stopImmediatePropagation\n if (!open && onBlur) {\n event.persist(); // Preact support, target is read only property on a native event.\n\n Object.defineProperty(event, 'target', {\n writable: true,\n value: {\n value: value,\n name: name\n }\n });\n onBlur(event);\n }\n };\n\n delete other['aria-invalid'];\n var display;\n var displaySingle;\n var displayMultiple = [];\n var computeDisplay = false;\n var foundMatch = false; // No need to display any value if the field is empty.\n\n if (isFilled({\n value: value\n }) || displayEmpty) {\n if (renderValue) {\n display = renderValue(value);\n } else {\n computeDisplay = true;\n }\n }\n\n var items = React.Children.map(children, function (child) {\n if (!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 Select component doesn't accept a Fragment as a child.\", 'Consider providing an array instead.'].join('\\n'));\n }\n }\n\n var selected;\n\n if (multiple) {\n if (!Array.isArray(value)) {\n throw new Error('Material-UI: the `value` prop must be an array ' + 'when using the `Select` component with `multiple`.');\n }\n\n selected = value.some(function (v) {\n return areEqualValues(v, child.props.value);\n });\n\n if (selected && computeDisplay) {\n displayMultiple.push(child.props.children);\n }\n } else {\n selected = areEqualValues(value, child.props.value);\n\n if (selected && computeDisplay) {\n displaySingle = child.props.children;\n }\n }\n\n if (selected) {\n foundMatch = true;\n }\n\n return React.cloneElement(child, {\n 'aria-selected': selected ? 'true' : undefined,\n onClick: handleItemClick(child),\n onKeyUp: function onKeyUp(event) {\n if (event.key === ' ') {\n // otherwise our MenuItems dispatches a click event\n // it's not behavior of the native and causes\n // the select to close immediately since we open on space keydown\n event.preventDefault();\n }\n\n var onKeyUp = child.props.onKeyUp;\n\n if (typeof onKeyUp === 'function') {\n onKeyUp(event);\n }\n },\n role: 'option',\n selected: selected,\n value: undefined,\n // The value is most likely not a valid HTML attribute.\n 'data-value': child.props.value // Instead, we provide it as a data attribute.\n\n });\n });\n\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(function () {\n if (!foundMatch && !multiple && value !== '') {\n var values = React.Children.toArray(children).map(function (child) {\n return child.props.value;\n });\n console.warn([\"Material-UI: you have provided an out-of-range value `\".concat(value, \"` for the select \").concat(name ? \"(name=\\\"\".concat(name, \"\\\") \") : '', \"component.\"), \"Consider providing a value that matches one of the available options or ''.\", \"The available values are \".concat(values.filter(function (x) {\n return x != null;\n }).map(function (x) {\n return \"`\".concat(x, \"`\");\n }).join(', ') || '\"\"', \".\")].join('\\n'));\n }\n }, [foundMatch, children, multiple, name, value]);\n }\n\n if (computeDisplay) {\n display = multiple ? displayMultiple.join(', ') : displaySingle;\n } // Avoid performing a layout computation in the render method.\n\n\n var menuMinWidth = menuMinWidthState;\n\n if (!autoWidth && isOpenControlled && displayNode) {\n menuMinWidth = displayNode.clientWidth;\n }\n\n var tabIndex;\n\n if (typeof tabIndexProp !== 'undefined') {\n tabIndex = tabIndexProp;\n } else {\n tabIndex = disabled ? null : 0;\n }\n\n var buttonId = SelectDisplayProps.id || (name ? \"mui-component-select-\".concat(name) : undefined);\n return React.createElement(React.Fragment, null, React.createElement(\"div\", _extends({\n className: clsx(classes.root, // TODO v5: merge root and select\n classes.select, classes.selectMenu, classes[variant], className, disabled && classes.disabled),\n ref: setDisplayNode,\n tabIndex: tabIndex,\n role: \"button\",\n \"aria-expanded\": open ? 'true' : undefined,\n \"aria-labelledby\": \"\".concat(labelId || '', \" \").concat(buttonId || ''),\n \"aria-haspopup\": \"listbox\",\n onKeyDown: handleKeyDown,\n onMouseDown: disabled || readOnly ? null : handleMouseDown,\n onBlur: handleBlur,\n onFocus: onFocus\n }, SelectDisplayProps, {\n // The id is required for proper a11y\n id: buttonId\n }), isEmpty(display) ? // eslint-disable-next-line react/no-danger\n React.createElement(\"span\", {\n dangerouslySetInnerHTML: {\n __html: ''\n }\n }) : display), React.createElement(\"input\", _extends({\n value: Array.isArray(value) ? value.join(',') : value,\n name: name,\n ref: inputRef,\n type: \"hidden\",\n autoFocus: autoFocus\n }, other)), React.createElement(IconComponent, {\n className: clsx(classes.icon, classes[\"icon\".concat(capitalize(variant))], open && classes.iconOpen)\n }), React.createElement(Menu, _extends({\n id: \"menu-\".concat(name || ''),\n anchorEl: displayNode,\n open: open,\n onClose: handleClose\n }, MenuProps, {\n MenuListProps: _extends({\n 'aria-labelledby': labelId,\n role: 'listbox',\n disableListWrap: true\n }, MenuProps.MenuListProps),\n PaperProps: _extends({}, MenuProps.PaperProps, {\n style: _extends({\n minWidth: menuMinWidth\n }, MenuProps.PaperProps != null ? MenuProps.PaperProps.style : null)\n })\n }), items));\n});\nprocess.env.NODE_ENV !== \"production\" ? SelectInput.propTypes = {\n /**\n * @ignore\n */\n autoFocus: PropTypes.bool,\n\n /**\n * If `true`, the width of the popover will automatically be set according to the items inside the\n * menu, otherwise it will be at least the width of the select input.\n */\n autoWidth: PropTypes.bool,\n\n /**\n * The option elements to populate the select with.\n * Can be some `` elements.\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 * The CSS class name of the select element.\n */\n className: PropTypes.string,\n\n /**\n * The default element value. Use when the component is not controlled.\n */\n defaultValue: PropTypes.any,\n\n /**\n * If `true`, the select will be disabled.\n */\n disabled: PropTypes.bool,\n\n /**\n * If `true`, the selected item is displayed even if its value is empty.\n */\n displayEmpty: PropTypes.bool,\n\n /**\n * The icon that displays the arrow.\n */\n IconComponent: PropTypes.elementType.isRequired,\n\n /**\n * Imperative handle implementing `{ value: T, node: HTMLElement, focus(): void }`\n * Equivalent to `ref`\n */\n inputRef: refType,\n\n /**\n * The ID of an element that acts as an additional label. The Select will\n * be labelled by the additional label and the selected value.\n */\n labelId: PropTypes.string,\n\n /**\n * Props applied to the [`Menu`](/api/menu/) element.\n */\n MenuProps: PropTypes.object,\n\n /**\n * If `true`, `value` must be an array and the menu will support multiple selections.\n */\n multiple: PropTypes.bool,\n\n /**\n * Name attribute of the `select` or hidden `input` element.\n */\n name: PropTypes.string,\n\n /**\n * @ignore\n */\n onBlur: PropTypes.func,\n\n /**\n * Callback function fired when a menu item 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` (any).\n * @param {object} [child] The react element that was selected.\n */\n onChange: PropTypes.func,\n\n /**\n * Callback fired when the component requests to be closed.\n * Use in controlled mode (see open).\n *\n * @param {object} event The event source of the callback.\n */\n onClose: PropTypes.func,\n\n /**\n * @ignore\n */\n onFocus: PropTypes.func,\n\n /**\n * Callback fired when the component requests to be opened.\n * Use in controlled mode (see open).\n *\n * @param {object} event The event source of the callback.\n */\n onOpen: PropTypes.func,\n\n /**\n * Control `select` open state.\n */\n open: PropTypes.bool,\n\n /**\n * @ignore\n */\n readOnly: PropTypes.bool,\n\n /**\n * Render the selected value.\n *\n * @param {any} value The `value` provided to the component.\n * @returns {ReactNode}\n */\n renderValue: PropTypes.func,\n\n /**\n * @ignore\n */\n required: PropTypes.bool,\n\n /**\n * Props applied to the clickable div element.\n */\n SelectDisplayProps: PropTypes.object,\n\n /**\n * @ignore\n */\n tabIndex: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n\n /**\n * @ignore\n */\n type: PropTypes.any,\n\n /**\n * The input value.\n */\n value: PropTypes.any,\n\n /**\n * The variant to use.\n */\n variant: PropTypes.oneOf(['standard', 'outlined', 'filled'])\n} : void 0;\nexport default SelectInput;","/* eslint-disable react-hooks/rules-of-hooks, react-hooks/exhaustive-deps */\nimport React from 'react';\nexport default function useControlled(_ref) {\n var controlled = _ref.controlled,\n defaultProp = _ref.default,\n name = _ref.name;\n\n var _React$useRef = React.useRef(controlled !== undefined),\n isControlled = _React$useRef.current;\n\n var _React$useState = React.useState(defaultProp),\n valueState = _React$useState[0],\n setValue = _React$useState[1];\n\n var value = isControlled ? controlled : valueState;\n\n if (process.env.NODE_ENV !== 'production') {\n React.useEffect(function () {\n if (isControlled !== (controlled !== undefined)) {\n console.error([\"Material-UI: A component is changing \".concat(isControlled ? 'a ' : 'an un', \"controlled \").concat(name, \" to be \").concat(isControlled ? 'un' : '', \"controlled.\"), 'Elements should not switch from uncontrolled to controlled (or vice versa).', \"Decide between using a controlled or uncontrolled \".concat(name, \" \") + 'element for the lifetime of the component.', 'More info: https://fb.me/react-controlled-components'].join('\\n'));\n }\n }, [controlled]);\n\n var _React$useRef2 = React.useRef(defaultProp),\n defaultValue = _React$useRef2.current;\n\n React.useEffect(function () {\n if (defaultValue !== defaultProp) {\n console.error([\"Material-UI: A component is changing the default value of an uncontrolled \".concat(name, \" after being initialized. \") + \"To suppress this warning opt to use a controlled \".concat(name, \".\")].join('\\n'));\n }\n }, [JSON.stringify(defaultProp)]);\n }\n\n var setValueIfUncontrolled = React.useCallback(function (newValue) {\n if (!isControlled) {\n setValue(newValue);\n }\n }, []);\n return [value, setValueIfUncontrolled];\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport 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 userSelect: 'none',\n width: '1em',\n height: '1em',\n display: 'inline-block',\n fill: 'currentColor',\n flexShrink: 0,\n fontSize: theme.typography.pxToRem(24),\n transition: theme.transitions.create('fill', {\n duration: theme.transitions.duration.shorter\n })\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=\"action\"`. */\n colorAction: {\n color: theme.palette.action.active\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 `color=\"disabled\"`. */\n colorDisabled: {\n color: theme.palette.action.disabled\n },\n\n /* Styles applied to the root element if `fontSize=\"inherit\"`. */\n fontSizeInherit: {\n fontSize: 'inherit'\n },\n\n /* Styles applied to the root element if `fontSize=\"small\"`. */\n fontSizeSmall: {\n fontSize: theme.typography.pxToRem(20)\n },\n\n /* Styles applied to the root element if `fontSize=\"large\"`. */\n fontSizeLarge: {\n fontSize: theme.typography.pxToRem(35)\n }\n };\n};\nvar SvgIcon = React.forwardRef(function SvgIcon(props, ref) {\n var children = props.children,\n classes = props.classes,\n className = props.className,\n _props$color = props.color,\n color = _props$color === void 0 ? 'inherit' : _props$color,\n _props$component = props.component,\n Component = _props$component === void 0 ? 'svg' : _props$component,\n _props$fontSize = props.fontSize,\n fontSize = _props$fontSize === void 0 ? 'default' : _props$fontSize,\n htmlColor = props.htmlColor,\n titleAccess = props.titleAccess,\n _props$viewBox = props.viewBox,\n viewBox = _props$viewBox === void 0 ? '0 0 24 24' : _props$viewBox,\n other = _objectWithoutProperties(props, [\"children\", \"classes\", \"className\", \"color\", \"component\", \"fontSize\", \"htmlColor\", \"titleAccess\", \"viewBox\"]);\n\n return React.createElement(Component, _extends({\n className: clsx(classes.root, className, color !== 'inherit' && classes[\"color\".concat(capitalize(color))], fontSize !== 'default' && classes[\"fontSize\".concat(capitalize(fontSize))]),\n focusable: \"false\",\n viewBox: viewBox,\n color: htmlColor,\n \"aria-hidden\": titleAccess ? undefined : 'true',\n role: titleAccess ? 'img' : 'presentation',\n ref: ref\n }, other), children, titleAccess ? React.createElement(\"title\", null, titleAccess) : null);\n});\nprocess.env.NODE_ENV !== \"production\" ? SvgIcon.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 * Node passed into the SVG element.\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 color of the component. It supports those theme colors that make sense for this component.\n * You can use the `htmlColor` prop to apply a color attribute to the SVG element.\n */\n color: PropTypes.oneOf(['action', 'disabled', 'error', 'inherit', 'primary', 'secondary']),\n\n /**\n * The component used for the root node.\n * Either a string to use a DOM element or a component.\n */\n component: PropTypes.elementType,\n\n /**\n * The fontSize applied to the icon. Defaults to 24px, but can be configure to inherit font size.\n */\n fontSize: PropTypes.oneOf(['default', 'inherit', 'large', 'small']),\n\n /**\n * Applies a color attribute to the SVG element.\n */\n htmlColor: PropTypes.string,\n\n /**\n * The shape-rendering attribute. The behavior of the different options is described on the\n * [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/shape-rendering).\n * If you are having issues with blurry icons you should investigate this property.\n */\n shapeRendering: PropTypes.string,\n\n /**\n * Provides a human-readable title for the element that contains it.\n * https://www.w3.org/TR/SVG-access/#Equivalent\n */\n titleAccess: PropTypes.string,\n\n /**\n * Allows you to redefine what the coordinates without units mean inside an SVG element.\n * For example, if the SVG element is 500 (width) by 200 (height),\n * and you pass viewBox=\"0 0 50 20\",\n * this means that the coordinates inside the SVG will go from the top left corner (0,0)\n * to bottom right (50,20) and each unit will be worth 10px.\n */\n viewBox: PropTypes.string\n} : void 0;\nSvgIcon.muiName = 'SvgIcon';\nexport default withStyles(styles, {\n name: 'MuiSvgIcon'\n})(SvgIcon);","import React from 'react';\nimport createSvgIcon from './createSvgIcon';\n/**\n * @ignore - internal component.\n */\n\nexport default createSvgIcon(React.createElement(\"path\", {\n d: \"M7 10l5 5 5-5z\"\n}), 'ArrowDropDown');","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport React from 'react';\nimport SvgIcon from '../../SvgIcon';\nexport default function createSvgIcon(path, displayName) {\n var Component = React.memo(React.forwardRef(function (props, ref) {\n return React.createElement(SvgIcon, _extends({}, props, {\n ref: ref\n }), path);\n }));\n\n if (process.env.NODE_ENV !== 'production') {\n Component.displayName = \"\".concat(displayName, \"Icon\");\n }\n\n Component.muiName = SvgIcon.muiName;\n return Component;\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { refType } from '@material-ui/utils';\nimport capitalize from '../utils/capitalize';\n/**\n * @ignore - internal component.\n */\n\nvar NativeSelectInput = React.forwardRef(function NativeSelectInput(props, ref) {\n var classes = props.classes,\n className = props.className,\n disabled = props.disabled,\n IconComponent = props.IconComponent,\n inputRef = props.inputRef,\n _props$variant = props.variant,\n variant = _props$variant === void 0 ? 'standard' : _props$variant,\n other = _objectWithoutProperties(props, [\"classes\", \"className\", \"disabled\", \"IconComponent\", \"inputRef\", \"variant\"]);\n\n return React.createElement(React.Fragment, null, React.createElement(\"select\", _extends({\n className: clsx(classes.root, // TODO v5: merge root and select\n classes.select, classes[variant], className, disabled && classes.disabled),\n disabled: disabled,\n ref: inputRef || ref\n }, other)), props.multiple ? null : React.createElement(IconComponent, {\n className: clsx(classes.icon, classes[\"icon\".concat(capitalize(variant))])\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? NativeSelectInput.propTypes = {\n /**\n * The option elements to populate the select with.\n * Can be some `` elements.\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 * The CSS class name of the select element.\n */\n className: PropTypes.string,\n\n /**\n * If `true`, the select will be disabled.\n */\n disabled: PropTypes.bool,\n\n /**\n * The icon that displays the arrow.\n */\n IconComponent: PropTypes.elementType.isRequired,\n\n /**\n * Use that prop to pass a ref to the native select element.\n * @deprecated\n */\n inputRef: refType,\n\n /**\n * @ignore\n */\n multiple: PropTypes.bool,\n\n /**\n * Name attribute of the `select` or hidden `input` element.\n */\n name: PropTypes.string,\n\n /**\n * Callback function fired when a menu item 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 * The input value.\n */\n value: PropTypes.any,\n\n /**\n * The variant to use.\n */\n variant: PropTypes.oneOf(['standard', 'outlined', 'filled'])\n} : void 0;\nexport default NativeSelectInput;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport NativeSelectInput from './NativeSelectInput';\nimport withStyles from '../styles/withStyles';\nimport formControlState from '../FormControl/formControlState';\nimport useFormControl from '../FormControl/useFormControl';\nimport ArrowDropDownIcon from '../internal/svg-icons/ArrowDropDown';\nimport Input from '../Input';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the select component `root` class. */\n root: {},\n\n /* Styles applied to the select component `select` class. */\n select: {\n '-moz-appearance': 'none',\n // Reset\n '-webkit-appearance': 'none',\n // Reset\n // When interacting quickly, the text can end up selected.\n // Native select can't be selected either.\n userSelect: 'none',\n borderRadius: 0,\n // Reset\n minWidth: 16,\n // So it doesn't collapse.\n cursor: 'pointer',\n '&:focus': {\n // Show that it's not an text input\n backgroundColor: theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.05)' : 'rgba(255, 255, 255, 0.05)',\n borderRadius: 0 // Reset Chrome style\n\n },\n // Remove IE 11 arrow\n '&::-ms-expand': {\n display: 'none'\n },\n '&$disabled': {\n cursor: 'default'\n },\n '&[multiple]': {\n height: 'auto'\n },\n '&:not([multiple]) option, &:not([multiple]) optgroup': {\n backgroundColor: theme.palette.background.paper\n },\n '&&': {\n paddingRight: 24\n }\n },\n\n /* Styles applied to the select component if `variant=\"filled\"`. */\n filled: {\n '&&': {\n paddingRight: 32\n }\n },\n\n /* Styles applied to the select component if `variant=\"outlined\"`. */\n outlined: {\n borderRadius: theme.shape.borderRadius,\n '&&': {\n paddingRight: 32\n }\n },\n\n /* Styles applied to the select component `selectMenu` class. */\n selectMenu: {\n height: 'auto',\n // Reset\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n overflow: 'hidden'\n },\n\n /* Pseudo-class applied to the select component `disabled` class. */\n disabled: {},\n\n /* Styles applied to the icon component. */\n icon: {\n // We use a position absolute over a flexbox in order to forward the pointer events\n // to the input and to support wrapping tags..\n position: 'absolute',\n right: 0,\n top: 'calc(50% - 12px)',\n // Center vertically\n color: theme.palette.action.active,\n pointerEvents: 'none' // Don't block pointer events on the select under the icon.\n\n },\n\n /* Styles applied to the icon component if the popup is open. */\n iconOpen: {\n transform: 'rotate(180deg)'\n },\n\n /* Styles applied to the icon component if `variant=\"filled\"`. */\n iconFilled: {\n right: 7\n },\n\n /* Styles applied to the icon component if `variant=\"outlined\"`. */\n iconOutlined: {\n right: 7\n }\n };\n};\nvar defaultInput = React.createElement(Input, null);\n/**\n * An alternative to ` ` with a much smaller bundle size footprint.\n */\n\nvar NativeSelect = React.forwardRef(function NativeSelect(props, ref) {\n var children = props.children,\n classes = props.classes,\n _props$IconComponent = props.IconComponent,\n IconComponent = _props$IconComponent === void 0 ? ArrowDropDownIcon : _props$IconComponent,\n _props$input = props.input,\n input = _props$input === void 0 ? defaultInput : _props$input,\n inputProps = props.inputProps,\n variant = props.variant,\n other = _objectWithoutProperties(props, [\"children\", \"classes\", \"IconComponent\", \"input\", \"inputProps\", \"variant\"]);\n\n var muiFormControl = useFormControl();\n var fcs = formControlState({\n props: props,\n muiFormControl: muiFormControl,\n states: ['variant']\n });\n return React.cloneElement(input, _extends({\n // Most of the logic is implemented in `NativeSelectInput`.\n // The `Select` component is a simple API wrapper to expose something better to play with.\n inputComponent: NativeSelectInput,\n inputProps: _extends({\n children: children,\n classes: classes,\n IconComponent: IconComponent,\n variant: fcs.variant,\n type: undefined\n }, inputProps, {}, input ? input.props.inputProps : {}),\n ref: ref\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? NativeSelect.propTypes = {\n /**\n * The option elements to populate the select with.\n * Can be some ` ` elements.\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 * The icon that displays the arrow.\n */\n IconComponent: PropTypes.elementType,\n\n /**\n * An `Input` element; does not have to be a material-ui specific `Input`.\n */\n input: PropTypes.element,\n\n /**\n * Attributes applied to the `select` element.\n */\n inputProps: PropTypes.object,\n\n /**\n * Callback function fired when a menu item 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 * The input value. The DOM API casts this to a string.\n */\n value: PropTypes.any,\n\n /**\n * The variant to use.\n */\n variant: PropTypes.oneOf(['standard', 'outlined', 'filled'])\n} : void 0;\nNativeSelect.muiName = 'Select';\nexport default withStyles(styles, {\n name: 'MuiNativeSelect'\n})(NativeSelect);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport { mergeClasses } from '@material-ui/styles';\nimport SelectInput from './SelectInput';\nimport formControlState from '../FormControl/formControlState';\nimport useFormControl from '../FormControl/useFormControl';\nimport withStyles from '../styles/withStyles';\nimport ArrowDropDownIcon from '../internal/svg-icons/ArrowDropDown';\nimport Input from '../Input';\nimport { styles as nativeSelectStyles } from '../NativeSelect/NativeSelect';\nimport NativeSelectInput from '../NativeSelect/NativeSelectInput';\nimport FilledInput from '../FilledInput';\nimport OutlinedInput from '../OutlinedInput';\nexport var styles = nativeSelectStyles;\n\nvar _ref = React.createElement(Input, null);\n\nvar _ref2 = React.createElement(FilledInput, null);\n\nvar Select = React.forwardRef(function Select(props, ref) {\n var _props$autoWidth = props.autoWidth,\n autoWidth = _props$autoWidth === void 0 ? false : _props$autoWidth,\n children = props.children,\n classes = props.classes,\n _props$displayEmpty = props.displayEmpty,\n displayEmpty = _props$displayEmpty === void 0 ? false : _props$displayEmpty,\n _props$IconComponent = props.IconComponent,\n IconComponent = _props$IconComponent === void 0 ? ArrowDropDownIcon : _props$IconComponent,\n id = props.id,\n input = props.input,\n inputProps = props.inputProps,\n label = props.label,\n labelId = props.labelId,\n _props$labelWidth = props.labelWidth,\n labelWidth = _props$labelWidth === void 0 ? 0 : _props$labelWidth,\n MenuProps = props.MenuProps,\n _props$multiple = props.multiple,\n multiple = _props$multiple === void 0 ? false : _props$multiple,\n _props$native = props.native,\n native = _props$native === void 0 ? false : _props$native,\n onClose = props.onClose,\n onOpen = props.onOpen,\n open = props.open,\n renderValue = props.renderValue,\n SelectDisplayProps = props.SelectDisplayProps,\n _props$variant = props.variant,\n variantProps = _props$variant === void 0 ? 'standard' : _props$variant,\n other = _objectWithoutProperties(props, [\"autoWidth\", \"children\", \"classes\", \"displayEmpty\", \"IconComponent\", \"id\", \"input\", \"inputProps\", \"label\", \"labelId\", \"labelWidth\", \"MenuProps\", \"multiple\", \"native\", \"onClose\", \"onOpen\", \"open\", \"renderValue\", \"SelectDisplayProps\", \"variant\"]);\n\n var inputComponent = native ? NativeSelectInput : SelectInput;\n var muiFormControl = useFormControl();\n var fcs = formControlState({\n props: props,\n muiFormControl: muiFormControl,\n states: ['variant']\n });\n var variant = fcs.variant || variantProps;\n var InputComponent = input || {\n standard: _ref,\n outlined: React.createElement(OutlinedInput, {\n label: label,\n labelWidth: labelWidth\n }),\n filled: _ref2\n }[variant];\n return React.cloneElement(InputComponent, _extends({\n // Most of the logic is implemented in `SelectInput`.\n // The `Select` component is a simple API wrapper to expose something better to play with.\n inputComponent: inputComponent,\n inputProps: _extends({\n children: children,\n IconComponent: IconComponent,\n variant: variant,\n type: undefined,\n // We render a select. We can ignore the type provided by the `Input`.\n multiple: multiple\n }, native ? {\n id: id\n } : {\n autoWidth: autoWidth,\n displayEmpty: displayEmpty,\n labelId: labelId,\n MenuProps: MenuProps,\n onClose: onClose,\n onOpen: onOpen,\n open: open,\n renderValue: renderValue,\n SelectDisplayProps: _extends({\n id: id\n }, SelectDisplayProps)\n }, {}, inputProps, {\n classes: inputProps ? mergeClasses({\n baseClasses: classes,\n newClasses: inputProps.classes,\n Component: Select\n }) : classes\n }, input ? input.props.inputProps : {}),\n ref: ref\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? Select.propTypes = {\n /**\n * If `true`, the width of the popover will automatically be set according to the items inside the\n * menu, otherwise it will be at least the width of the select input.\n */\n autoWidth: PropTypes.bool,\n\n /**\n * The option elements to populate the select with.\n * Can be some `MenuItem` when `native` is false and `option` when `native` is true.\n *\n * ⚠️The `MenuItem` elements **must** be direct descendants when `native` is false.\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 * The default element value. Use when the component is not controlled.\n */\n defaultValue: PropTypes.any,\n\n /**\n * If `true`, a value is displayed even if no items are selected.\n *\n * In order to display a meaningful value, a function should be passed to the `renderValue` prop which returns the value to be displayed when no items are selected.\n * You can only use it when the `native` prop is `false` (default).\n */\n displayEmpty: PropTypes.bool,\n\n /**\n * The icon that displays the arrow.\n */\n IconComponent: PropTypes.elementType,\n\n /**\n * @ignore\n */\n id: PropTypes.string,\n\n /**\n * An `Input` element; does not have to be a material-ui specific `Input`.\n */\n input: PropTypes.element,\n\n /**\n * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.\n * When `native` is `true`, the attributes are applied on the `select` element.\n */\n inputProps: PropTypes.object,\n\n /**\n * See [OutlinedLabel#label](/api/outlined-input/#props)\n */\n label: PropTypes.node,\n\n /**\n * The ID of an element that acts as an additional label. The Select will\n * be labelled by the additional label and the selected value.\n */\n labelId: PropTypes.string,\n\n /**\n * See OutlinedLabel#label\n */\n labelWidth: PropTypes.number,\n\n /**\n * Props applied to the [`Menu`](/api/menu/) element.\n */\n MenuProps: PropTypes.object,\n\n /**\n * If `true`, `value` must be an array and the menu will support multiple selections.\n */\n multiple: PropTypes.bool,\n\n /**\n * If `true`, the component will be using a native `select` element.\n */\n native: PropTypes.bool,\n\n /**\n * Callback function fired when a menu item 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` (any).\n * @param {object} [child] The react element that was selected when `native` is `false` (default).\n */\n onChange: PropTypes.func,\n\n /**\n * Callback fired when the component requests to be closed.\n * Use in controlled mode (see open).\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 opened.\n * Use in controlled mode (see open).\n *\n * @param {object} event The event source of the callback.\n */\n onOpen: PropTypes.func,\n\n /**\n * Control `select` open state.\n * You can only use it when the `native` prop is `false` (default).\n */\n open: PropTypes.bool,\n\n /**\n * Render the selected value.\n * You can only use it when the `native` prop is `false` (default).\n *\n * @param {any} value The `value` provided to the component.\n * @returns {ReactNode}\n */\n renderValue: PropTypes.func,\n\n /**\n * Props applied to the clickable div element.\n */\n SelectDisplayProps: PropTypes.object,\n\n /**\n * The input value. Providing an empty string will select no options.\n * This prop is required when the `native` prop is `false` (default).\n * Set to an empty string `''` if you don't want any of the available options to be selected.\n *\n * If the value is an object it must have reference equality with the option in order to be selected.\n * If the value is not an object, the string representation must match with the string representation of the option in order to be selected.\n */\n value: PropTypes.any,\n\n /**\n * The variant to use.\n */\n variant: PropTypes.oneOf(['standard', 'outlined', 'filled'])\n} : void 0;\nSelect.muiName = 'Select';\nexport default withStyles(styles, {\n name: 'MuiSelect'\n})(Select);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { refType } from '@material-ui/utils';\nimport Input from '../Input';\nimport FilledInput from '../FilledInput';\nimport OutlinedInput from '../OutlinedInput';\nimport InputLabel from '../InputLabel';\nimport FormControl from '../FormControl';\nimport FormHelperText from '../FormHelperText';\nimport Select from '../Select';\nimport withStyles from '../styles/withStyles';\nvar variantComponent = {\n standard: Input,\n filled: FilledInput,\n outlined: OutlinedInput\n};\nexport var styles = {\n /* Styles applied to the root element. */\n root: {}\n};\n/**\n * The `TextField` is a convenience wrapper for the most common cases (80%).\n * It cannot be all things to all people, otherwise the API would grow out of control.\n *\n * ## Advanced Configuration\n *\n * It's important to understand that the text field is a simple abstraction\n * on top of the following components:\n *\n * - [FormControl](/api/form-control/)\n * - [InputLabel](/api/input-label/)\n * - [FilledInput](/api/filled-input/)\n * - [OutlinedInput](/api/outlined-input/)\n * - [Input](/api/input/)\n * - [FormHelperText](/api/form-helper-text/)\n *\n * If you wish to alter the props applied to the `input` element, you can do so as follows:\n *\n * ```jsx\n * const inputProps = {\n * step: 300,\n * };\n *\n * return ;\n * ```\n *\n * For advanced cases, please look at the source of TextField by clicking on the\n * \"Edit this page\" button above. Consider either:\n *\n * - using the upper case props for passing values directly to the components\n * - using the underlying components directly as shown in the demos\n */\n\nvar TextField = React.forwardRef(function TextField(props, ref) {\n var autoComplete = props.autoComplete,\n _props$autoFocus = props.autoFocus,\n autoFocus = _props$autoFocus === void 0 ? false : _props$autoFocus,\n children = props.children,\n classes = props.classes,\n className = props.className,\n _props$color = props.color,\n color = _props$color === void 0 ? 'primary' : _props$color,\n defaultValue = props.defaultValue,\n _props$disabled = props.disabled,\n disabled = _props$disabled === void 0 ? false : _props$disabled,\n _props$error = props.error,\n error = _props$error === void 0 ? false : _props$error,\n FormHelperTextProps = props.FormHelperTextProps,\n _props$fullWidth = props.fullWidth,\n fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth,\n helperText = props.helperText,\n hiddenLabel = props.hiddenLabel,\n id = props.id,\n InputLabelProps = props.InputLabelProps,\n inputProps = props.inputProps,\n InputProps = props.InputProps,\n inputRef = props.inputRef,\n label = props.label,\n _props$multiline = props.multiline,\n multiline = _props$multiline === void 0 ? false : _props$multiline,\n name = props.name,\n onBlur = props.onBlur,\n onChange = props.onChange,\n onFocus = props.onFocus,\n placeholder = props.placeholder,\n _props$required = props.required,\n required = _props$required === void 0 ? false : _props$required,\n rows = props.rows,\n rowsMax = props.rowsMax,\n _props$select = props.select,\n select = _props$select === void 0 ? false : _props$select,\n SelectProps = props.SelectProps,\n type = props.type,\n value = props.value,\n _props$variant = props.variant,\n variant = _props$variant === void 0 ? 'standard' : _props$variant,\n other = _objectWithoutProperties(props, [\"autoComplete\", \"autoFocus\", \"children\", \"classes\", \"className\", \"color\", \"defaultValue\", \"disabled\", \"error\", \"FormHelperTextProps\", \"fullWidth\", \"helperText\", \"hiddenLabel\", \"id\", \"InputLabelProps\", \"inputProps\", \"InputProps\", \"inputRef\", \"label\", \"multiline\", \"name\", \"onBlur\", \"onChange\", \"onFocus\", \"placeholder\", \"required\", \"rows\", \"rowsMax\", \"select\", \"SelectProps\", \"type\", \"value\", \"variant\"]);\n\n if (process.env.NODE_ENV !== 'production') {\n if (select && !children) {\n console.error('Material-UI: `children` must be passed when using the `TextField` component with `select`.');\n }\n }\n\n var InputMore = {};\n\n if (variant === 'outlined') {\n if (InputLabelProps && typeof InputLabelProps.shrink !== 'undefined') {\n InputMore.notched = InputLabelProps.shrink;\n }\n\n InputMore.label = label ? React.createElement(React.Fragment, null, label, required && \"\\xA0*\") : label;\n }\n\n if (select) {\n // unset defaults from textbox inputs\n if (!SelectProps || !SelectProps.native) {\n InputMore.id = undefined;\n }\n\n InputMore['aria-describedby'] = undefined;\n }\n\n var helperTextId = helperText && id ? \"\".concat(id, \"-helper-text\") : undefined;\n var inputLabelId = label && id ? \"\".concat(id, \"-label\") : undefined;\n var InputComponent = variantComponent[variant];\n var InputElement = React.createElement(InputComponent, _extends({\n \"aria-describedby\": helperTextId,\n autoComplete: autoComplete,\n autoFocus: autoFocus,\n defaultValue: defaultValue,\n fullWidth: fullWidth,\n multiline: multiline,\n name: name,\n rows: rows,\n rowsMax: rowsMax,\n type: type,\n value: value,\n id: id,\n inputRef: inputRef,\n onBlur: onBlur,\n onChange: onChange,\n onFocus: onFocus,\n placeholder: placeholder,\n inputProps: inputProps\n }, InputMore, InputProps));\n return React.createElement(FormControl, _extends({\n className: clsx(classes.root, className),\n disabled: disabled,\n error: error,\n fullWidth: fullWidth,\n hiddenLabel: hiddenLabel,\n ref: ref,\n required: required,\n color: color,\n variant: variant\n }, other), label && React.createElement(InputLabel, _extends({\n htmlFor: id,\n id: inputLabelId\n }, InputLabelProps), label), select ? React.createElement(Select, _extends({\n \"aria-describedby\": helperTextId,\n id: id,\n labelId: inputLabelId,\n value: value,\n input: InputElement\n }, SelectProps), children) : InputElement, helperText && React.createElement(FormHelperText, _extends({\n id: helperTextId\n }, FormHelperTextProps), helperText));\n});\nprocess.env.NODE_ENV !== \"production\" ? TextField.propTypes = {\n /**\n * This prop helps users to fill forms faster, especially on mobile devices.\n * The name can be confusing, as it's more like an autofill.\n * You can learn more about it [following the specification](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill).\n */\n autoComplete: PropTypes.string,\n\n /**\n * If `true`, the `input` element will be focused during the first mount.\n */\n autoFocus: PropTypes.bool,\n\n /**\n * @ignore\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(['primary', 'secondary']),\n\n /**\n * The default value of the `input` element.\n */\n defaultValue: PropTypes.any,\n\n /**\n * If `true`, the `input` element will be disabled.\n */\n disabled: PropTypes.bool,\n\n /**\n * If `true`, the label will be displayed in an error state.\n */\n error: PropTypes.bool,\n\n /**\n * Props applied to the [`FormHelperText`](/api/form-helper-text/) element.\n */\n FormHelperTextProps: PropTypes.object,\n\n /**\n * If `true`, the input will take up the full width of its container.\n */\n fullWidth: PropTypes.bool,\n\n /**\n * The helper text content.\n */\n helperText: PropTypes.node,\n\n /**\n * @ignore\n */\n hiddenLabel: PropTypes.bool,\n\n /**\n * The id of the `input` element.\n * Use this prop to make `label` and `helperText` accessible for screen readers.\n */\n id: PropTypes.string,\n\n /**\n * Props applied to the [`InputLabel`](/api/input-label/) element.\n */\n InputLabelProps: PropTypes.object,\n\n /**\n * Props applied to the Input element.\n * It will be a [`FilledInput`](/api/filled-input/),\n * [`OutlinedInput`](/api/outlined-input/) or [`Input`](/api/input/)\n * component depending on the `variant` prop value.\n */\n InputProps: PropTypes.object,\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 * The label content.\n */\n label: PropTypes.node,\n\n /**\n * If `dense` or `normal`, will adjust vertical spacing of this and contained components.\n */\n margin: PropTypes.oneOf(['none', 'dense', 'normal']),\n\n /**\n * If `true`, a textarea element will be rendered instead of an input.\n */\n multiline: PropTypes.bool,\n\n /**\n * Name attribute of the `input` element.\n */\n name: PropTypes.string,\n\n /**\n * @ignore\n */\n onBlur: PropTypes.func,\n\n /**\n * Callback fired when the value 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 */\n onChange: PropTypes.func,\n\n /**\n * @ignore\n */\n onFocus: PropTypes.func,\n\n /**\n * The short hint displayed in the input before the user enters a value.\n */\n placeholder: PropTypes.string,\n\n /**\n * If `true`, the label is displayed as required and the `input` element` will be required.\n */\n required: PropTypes.bool,\n\n /**\n * Number of rows to display when multiline option is set to true.\n */\n rows: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * Maximum number of rows to display when multiline option is set to true.\n */\n rowsMax: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n /**\n * Render a [`Select`](/api/select/) element while passing the Input element to `Select` as `input` parameter.\n * If this option is set you must pass the options of the select as children.\n */\n select: PropTypes.bool,\n\n /**\n * Props applied to the [`Select`](/api/select/) element.\n */\n SelectProps: PropTypes.object,\n\n /**\n * The size of the text field.\n */\n size: PropTypes.oneOf(['small', 'medium']),\n\n /**\n * Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types).\n */\n type: PropTypes.string,\n\n /**\n * The value of the `input` element, required for a controlled component.\n */\n value: PropTypes.any,\n\n /**\n * The variant to use.\n */\n variant: PropTypes.oneOf(['standard', 'outlined', 'filled'])\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiTextField'\n})(TextField);","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { exactProp } from '@material-ui/utils';\nvar useEnhancedEffect = typeof window !== 'undefined' && process.env.NODE_ENV !== 'test' ? React.useLayoutEffect : React.useEffect;\n/**\n * NoSsr purposely removes components from the subject of Server Side Rendering (SSR).\n *\n * This component can be useful in a variety of situations:\n * - Escape hatch for broken dependencies not supporting SSR.\n * - Improve the time-to-first paint on the client by only rendering above the fold.\n * - Reduce the rendering time on the server.\n * - Under too heavy server load, you can turn on service degradation.\n */\n\nfunction NoSsr(props) {\n var children = props.children,\n _props$defer = props.defer,\n defer = _props$defer === void 0 ? false : _props$defer,\n _props$fallback = props.fallback,\n fallback = _props$fallback === void 0 ? null : _props$fallback;\n\n var _React$useState = React.useState(false),\n mountedState = _React$useState[0],\n setMountedState = _React$useState[1];\n\n useEnhancedEffect(function () {\n if (!defer) {\n setMountedState(true);\n }\n }, [defer]);\n React.useEffect(function () {\n if (defer) {\n setMountedState(true);\n }\n }, [defer]); // We need the Fragment here to force react-docgen to recognise NoSsr as a component.\n\n return React.createElement(React.Fragment, null, mountedState ? children : fallback);\n}\n\nprocess.env.NODE_ENV !== \"production\" ? NoSsr.propTypes = {\n /**\n * You can wrap a node.\n */\n children: PropTypes.node.isRequired,\n\n /**\n * If `true`, the component will not only prevent server-side rendering.\n * It will also defer the rendering of the children into a different screen frame.\n */\n defer: PropTypes.bool,\n\n /**\n * The fallback content to display.\n */\n fallback: PropTypes.node\n} : void 0;\n\nif (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line\n NoSsr['propTypes' + ''] = exactProp(NoSsr.propTypes);\n}\n\nexport default NoSsr;","// based on https://github.com/WICG/focus-visible/blob/v4.1.5/src/focus-visible.js\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nvar hadKeyboardEvent = true;\nvar hadFocusVisibleRecently = false;\nvar hadFocusVisibleRecentlyTimeout = null;\nvar inputTypesWhitelist = {\n text: true,\n search: true,\n url: true,\n tel: true,\n email: true,\n password: true,\n number: true,\n date: true,\n month: true,\n week: true,\n time: true,\n datetime: true,\n 'datetime-local': true\n};\n/**\n * Computes whether the given element should automatically trigger the\n * `focus-visible` class being added, i.e. whether it should always match\n * `:focus-visible` when focused.\n * @param {Element} node\n * @return {boolean}\n */\n\nfunction focusTriggersKeyboardModality(node) {\n var type = node.type,\n tagName = node.tagName;\n\n if (tagName === 'INPUT' && inputTypesWhitelist[type] && !node.readOnly) {\n return true;\n }\n\n if (tagName === 'TEXTAREA' && !node.readOnly) {\n return true;\n }\n\n if (node.isContentEditable) {\n return true;\n }\n\n return false;\n}\n/**\n * Keep track of our keyboard modality state with `hadKeyboardEvent`.\n * If the most recent user interaction was via the keyboard;\n * and the key press did not include a meta, alt/option, or control key;\n * then the modality is keyboard. Otherwise, the modality is not keyboard.\n * @param {KeyboardEvent} event\n */\n\n\nfunction handleKeyDown(event) {\n if (event.metaKey || event.altKey || event.ctrlKey) {\n return;\n }\n\n hadKeyboardEvent = true;\n}\n/**\n * If at any point a user clicks with a pointing device, ensure that we change\n * the modality away from keyboard.\n * This avoids the situation where a user presses a key on an already focused\n * element, and then clicks on a different element, focusing it with a\n * pointing device, while we still think we're in keyboard modality.\n */\n\n\nfunction handlePointerDown() {\n hadKeyboardEvent = false;\n}\n\nfunction handleVisibilityChange() {\n if (this.visibilityState === 'hidden') {\n // If the tab becomes active again, the browser will handle calling focus\n // on the element (Safari actually calls it twice).\n // If this tab change caused a blur on an element with focus-visible,\n // re-apply the class when the user switches back to the tab.\n if (hadFocusVisibleRecently) {\n hadKeyboardEvent = true;\n }\n }\n}\n\nfunction prepare(doc) {\n doc.addEventListener('keydown', handleKeyDown, true);\n doc.addEventListener('mousedown', handlePointerDown, true);\n doc.addEventListener('pointerdown', handlePointerDown, true);\n doc.addEventListener('touchstart', handlePointerDown, true);\n doc.addEventListener('visibilitychange', handleVisibilityChange, true);\n}\n\nexport function teardown(doc) {\n doc.removeEventListener('keydown', handleKeyDown, true);\n doc.removeEventListener('mousedown', handlePointerDown, true);\n doc.removeEventListener('pointerdown', handlePointerDown, true);\n doc.removeEventListener('touchstart', handlePointerDown, true);\n doc.removeEventListener('visibilitychange', handleVisibilityChange, true);\n}\n\nfunction isFocusVisible(event) {\n var target = event.target;\n\n try {\n return target.matches(':focus-visible');\n } catch (error) {} // browsers not implementing :focus-visible will throw a SyntaxError\n // we use our own heuristic for those browsers\n // rethrow might be better if it's not the expected error but do we really\n // want to crash if focus-visible malfunctioned?\n // no need for validFocusTarget check. the user does that by attaching it to\n // focusable events only\n\n\n return hadKeyboardEvent || focusTriggersKeyboardModality(target);\n}\n/**\n * Should be called if a blur event is fired on a focus-visible element\n */\n\n\nfunction handleBlurVisible() {\n // To detect a tab/window switch, we look for a blur event followed\n // rapidly by a visibility change.\n // If we don't see a visibility change within 100ms, it's probably a\n // regular focus change.\n hadFocusVisibleRecently = true;\n window.clearTimeout(hadFocusVisibleRecentlyTimeout);\n hadFocusVisibleRecentlyTimeout = window.setTimeout(function () {\n hadFocusVisibleRecently = false;\n }, 100);\n}\n\nexport function useIsFocusVisible() {\n var ref = React.useCallback(function (instance) {\n var node = ReactDOM.findDOMNode(instance);\n\n if (node != null) {\n prepare(node.ownerDocument);\n }\n }, []);\n return {\n isFocusVisible: isFocusVisible,\n onBlurVisible: handleBlurVisible,\n ref: ref\n };\n}","import { Children, cloneElement, isValidElement } from 'react';\n/**\n * Given `this.props.children`, return an object mapping key to child.\n *\n * @param {*} children `this.props.children`\n * @return {object} Mapping of key to child\n */\n\nexport function getChildMapping(children, mapFn) {\n var mapper = function mapper(child) {\n return mapFn && isValidElement(child) ? mapFn(child) : child;\n };\n\n var result = Object.create(null);\n if (children) Children.map(children, function (c) {\n return c;\n }).forEach(function (child) {\n // run the map function here instead so that the key is the computed one\n result[child.key] = mapper(child);\n });\n return result;\n}\n/**\n * When you're adding or removing children some may be added or removed in the\n * same render pass. We want to show *both* since we want to simultaneously\n * animate elements in and out. This function takes a previous set of keys\n * and a new set of keys and merges them with its best guess of the correct\n * ordering. In the future we may expose some of the utilities in\n * ReactMultiChild to make this easy, but for now React itself does not\n * directly have this concept of the union of prevChildren and nextChildren\n * so we implement it here.\n *\n * @param {object} prev prev children as returned from\n * `ReactTransitionChildMapping.getChildMapping()`.\n * @param {object} next next children as returned from\n * `ReactTransitionChildMapping.getChildMapping()`.\n * @return {object} a key set that contains all keys in `prev` and all keys\n * in `next` in a reasonable order.\n */\n\nexport function mergeChildMappings(prev, next) {\n prev = prev || {};\n next = next || {};\n\n function getValueForKey(key) {\n return key in next ? next[key] : prev[key];\n } // For each key of `next`, the list of keys to insert before that key in\n // the combined list\n\n\n var nextKeysPending = Object.create(null);\n var pendingKeys = [];\n\n for (var prevKey in prev) {\n if (prevKey in next) {\n if (pendingKeys.length) {\n nextKeysPending[prevKey] = pendingKeys;\n pendingKeys = [];\n }\n } else {\n pendingKeys.push(prevKey);\n }\n }\n\n var i;\n var childMapping = {};\n\n for (var nextKey in next) {\n if (nextKeysPending[nextKey]) {\n for (i = 0; i < nextKeysPending[nextKey].length; i++) {\n var pendingNextKey = nextKeysPending[nextKey][i];\n childMapping[nextKeysPending[nextKey][i]] = getValueForKey(pendingNextKey);\n }\n }\n\n childMapping[nextKey] = getValueForKey(nextKey);\n } // Finally, add the keys which didn't appear before any key in `next`\n\n\n for (i = 0; i < pendingKeys.length; i++) {\n childMapping[pendingKeys[i]] = getValueForKey(pendingKeys[i]);\n }\n\n return childMapping;\n}\n\nfunction getProp(child, prop, props) {\n return props[prop] != null ? props[prop] : child.props[prop];\n}\n\nexport function getInitialChildMapping(props, onExited) {\n return getChildMapping(props.children, function (child) {\n return cloneElement(child, {\n onExited: onExited.bind(null, child),\n in: true,\n appear: getProp(child, 'appear', props),\n enter: getProp(child, 'enter', props),\n exit: getProp(child, 'exit', props)\n });\n });\n}\nexport function getNextChildMapping(nextProps, prevChildMapping, onExited) {\n var nextChildMapping = getChildMapping(nextProps.children);\n var children = mergeChildMappings(prevChildMapping, nextChildMapping);\n Object.keys(children).forEach(function (key) {\n var child = children[key];\n if (!isValidElement(child)) return;\n var hasPrev = key in prevChildMapping;\n var hasNext = key in nextChildMapping;\n var prevChild = prevChildMapping[key];\n var isLeaving = isValidElement(prevChild) && !prevChild.props.in; // item is new (entering)\n\n if (hasNext && (!hasPrev || isLeaving)) {\n // console.log('entering', key)\n children[key] = cloneElement(child, {\n onExited: onExited.bind(null, child),\n in: true,\n exit: getProp(child, 'exit', nextProps),\n enter: getProp(child, 'enter', nextProps)\n });\n } else if (!hasNext && hasPrev && !isLeaving) {\n // item is old (exiting)\n // console.log('leaving', key)\n children[key] = cloneElement(child, {\n in: false\n });\n } else if (hasNext && hasPrev && isValidElement(prevChild)) {\n // item hasn't changed transition states\n // copy over the last transition props;\n // console.log('unchanged', key)\n children[key] = cloneElement(child, {\n onExited: onExited.bind(null, child),\n in: prevChild.props.in,\n exit: getProp(child, 'exit', nextProps),\n enter: getProp(child, 'enter', nextProps)\n });\n }\n });\n return children;\n}","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _inheritsLoose from \"@babel/runtime/helpers/esm/inheritsLoose\";\nimport _assertThisInitialized from \"@babel/runtime/helpers/esm/assertThisInitialized\";\nimport PropTypes from 'prop-types';\nimport React from 'react';\nimport TransitionGroupContext from './TransitionGroupContext';\nimport { getChildMapping, getInitialChildMapping, getNextChildMapping } from './utils/ChildMapping';\n\nvar values = Object.values || function (obj) {\n return Object.keys(obj).map(function (k) {\n return obj[k];\n });\n};\n\nvar defaultProps = {\n component: 'div',\n childFactory: function childFactory(child) {\n return child;\n }\n /**\n * The `` component manages a set of transition components\n * (`` and ``) in a list. Like with the transition\n * components, `` is a state machine for managing the mounting\n * and unmounting of components over time.\n *\n * Consider the example below. As items are removed or added to the TodoList the\n * `in` prop is toggled automatically by the ``.\n *\n * Note that `` does not define any animation behavior!\n * Exactly _how_ a list item animates is up to the individual transition\n * component. This means you can mix and match animations across different list\n * items.\n */\n\n};\n\nvar TransitionGroup =\n/*#__PURE__*/\nfunction (_React$Component) {\n _inheritsLoose(TransitionGroup, _React$Component);\n\n function TransitionGroup(props, context) {\n var _this;\n\n _this = _React$Component.call(this, props, context) || this;\n\n var handleExited = _this.handleExited.bind(_assertThisInitialized(_assertThisInitialized(_this))); // Initial children should all be entering, dependent on appear\n\n\n _this.state = {\n contextValue: {\n isMounting: true\n },\n handleExited: handleExited,\n firstRender: true\n };\n return _this;\n }\n\n var _proto = TransitionGroup.prototype;\n\n _proto.componentDidMount = function componentDidMount() {\n this.mounted = true;\n this.setState({\n contextValue: {\n isMounting: false\n }\n });\n };\n\n _proto.componentWillUnmount = function componentWillUnmount() {\n this.mounted = false;\n };\n\n TransitionGroup.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, _ref) {\n var prevChildMapping = _ref.children,\n handleExited = _ref.handleExited,\n firstRender = _ref.firstRender;\n return {\n children: firstRender ? getInitialChildMapping(nextProps, handleExited) : getNextChildMapping(nextProps, prevChildMapping, handleExited),\n firstRender: false\n };\n };\n\n _proto.handleExited = function handleExited(child, node) {\n var currentChildMapping = getChildMapping(this.props.children);\n if (child.key in currentChildMapping) return;\n\n if (child.props.onExited) {\n child.props.onExited(node);\n }\n\n if (this.mounted) {\n this.setState(function (state) {\n var children = _extends({}, state.children);\n\n delete children[child.key];\n return {\n children: children\n };\n });\n }\n };\n\n _proto.render = function render() {\n var _this$props = this.props,\n Component = _this$props.component,\n childFactory = _this$props.childFactory,\n props = _objectWithoutPropertiesLoose(_this$props, [\"component\", \"childFactory\"]);\n\n var contextValue = this.state.contextValue;\n var children = values(this.state.children).map(childFactory);\n delete props.appear;\n delete props.enter;\n delete props.exit;\n\n if (Component === null) {\n return React.createElement(TransitionGroupContext.Provider, {\n value: contextValue\n }, children);\n }\n\n return React.createElement(TransitionGroupContext.Provider, {\n value: contextValue\n }, React.createElement(Component, props, children));\n };\n\n return TransitionGroup;\n}(React.Component);\n\nTransitionGroup.propTypes = process.env.NODE_ENV !== \"production\" ? {\n /**\n * `` renders a `` by default. You can change this\n * behavior by providing a `component` prop.\n * If you use React v16+ and would like to avoid a wrapping `
` element\n * you can pass in `component={null}`. This is useful if the wrapping div\n * borks your css styles.\n */\n component: PropTypes.any,\n\n /**\n * A set of `
` components, that are toggled `in` and out as they\n * leave. the `` will inject specific transition props, so\n * remember to spread them through if you are wrapping the `` as\n * with our `` example.\n *\n * While this component is meant for multiple `Transition` or `CSSTransition`\n * children, sometimes you may want to have a single transition child with\n * content that you want to be transitioned out and in when you change it\n * (e.g. routes, images etc.) In that case you can change the `key` prop of\n * the transition child as you change its content, this will cause\n * `TransitionGroup` to transition the child out and back in.\n */\n children: PropTypes.node,\n\n /**\n * A convenience prop that enables or disables appear animations\n * for all children. Note that specifying this will override any defaults set\n * on individual children Transitions.\n */\n appear: PropTypes.bool,\n\n /**\n * A convenience prop that enables or disables enter animations\n * for all children. Note that specifying this will override any defaults set\n * on individual children Transitions.\n */\n enter: PropTypes.bool,\n\n /**\n * A convenience prop that enables or disables exit animations\n * for all children. Note that specifying this will override any defaults set\n * on individual children Transitions.\n */\n exit: PropTypes.bool,\n\n /**\n * You may need to apply reactive updates to a child as it is exiting.\n * This is generally done by using `cloneElement` however in the case of an exiting\n * child the element has already been removed and not accessible to the consumer.\n *\n * If you do need to update a child as it leaves you can provide a `childFactory`\n * to wrap every child, even the ones that are leaving.\n *\n * @type Function(child: ReactElement) -> ReactElement\n */\n childFactory: PropTypes.func\n} : {};\nTransitionGroup.defaultProps = defaultProps;\nexport default TransitionGroup;","import 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 React.createElement(\"span\", {\n className: rippleClassName,\n style: rippleStyles\n }, 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 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 = 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), [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 clientX = event.clientX ? event.clientX : event.touches[0].clientX;\n var clientY = event.clientY ? event.clientY : event.touches[0].clientY;\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 React.createElement(\"span\", _extends({\n className: clsx(classes.root, className),\n ref: container\n }, other), 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})(React.memo(TouchRipple));","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport 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 withStyles from '../styles/withStyles';\nimport NoSsr from '../NoSsr';\nimport { useIsFocusVisible } from '../utils/focusVisible';\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 },\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 = 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 if (disabled) {\n return;\n } // Fix for https://github.com/facebook/react/issues/7769\n\n\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 (onKeyDown) {\n onKeyDown(event);\n } // Keyboard accessibility for non interactive elements\n\n\n if (event.target === event.currentTarget && isNonNativeButton() && event.key === 'Enter') {\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 will not dispatch a click event if Space is pressed\n // https://codesandbox.io/s/button-keyup-preventdefault-dn7f0\n if (focusRipple && event.key === ' ' && rippleRef.current && focusVisible && !event.defaultPrevented) {\n keydownRef.current = false;\n event.persist();\n rippleRef.current.stop(event, function () {\n rippleRef.current.pulsate(event);\n });\n }\n\n if (onKeyUp) {\n onKeyUp(event);\n } // Keyboard accessibility for non interactive elements\n\n\n if (event.target === event.currentTarget && isNonNativeButton() && event.key === ' ' && !event.defaultPrevented) {\n event.preventDefault();\n\n if (onClick) {\n onClick(event);\n }\n }\n });\n var ComponentProp = component;\n\n if (ComponentProp === 'button' && other.href) {\n ComponentProp = 'a';\n }\n\n var buttonProps = {};\n\n if (ComponentProp === 'button') {\n buttonProps.type = type;\n buttonProps.disabled = disabled;\n } else {\n if (ComponentProp !== 'a' || !other.href) {\n buttonProps.role = 'button';\n }\n\n buttonProps['aria-disabled'] = disabled;\n }\n\n var handleUserRef = useForkRef(buttonRefProp, ref);\n var handleOwnRef = useForkRef(focusVisibleRef, buttonRef);\n var handleRef = useForkRef(handleUserRef, handleOwnRef);\n return React.createElement(ComponentProp, _extends({\n className: clsx(classes.root, className, focusVisible && [classes.focusVisible, focusVisibleClassName], disabled && classes.disabled),\n onBlur: handleBlur,\n onClick: onClick,\n onFocus: handleFocus,\n onKeyDown: handleKeyDown,\n onKeyUp: handleKeyUp,\n onMouseDown: handleMouseDown,\n onMouseLeave: handleMouseLeave,\n onMouseUp: handleMouseUp,\n onDragLeave: handleDragLeave,\n onTouchEnd: handleTouchEnd,\n onTouchMove: handleTouchMove,\n onTouchStart: handleTouchStart,\n ref: handleRef,\n tabIndex: disabled ? -1 : tabIndex\n }, buttonProps, other), children, !disableRipple && !disabled ? React.createElement(NoSsr, null, React.createElement(TouchRipple, _extends({\n ref: rippleRef,\n center: centerRipple\n }, TouchRippleProps))) : null);\n});\nprocess.env.NODE_ENV !== \"production\" ? ButtonBase.propTypes = {\n /**\n * A ref for imperative actions.\n * It currently only supports `focusVisible()` action.\n */\n action: refType,\n\n /**\n * @ignore\n *\n * Use that prop to pass a ref to the native button component.\n * @deprecated Use `ref` instead.\n */\n buttonRef: refType,\n\n /**\n * If `true`, the ripples will be centered.\n * They won't start at the cursor interaction position.\n */\n centerRipple: 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.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 DOM element or a component.\n */\n component: elementTypeAcceptingRef,\n\n /**\n * If `true`, the base button will be disabled.\n */\n disabled: PropTypes.bool,\n\n /**\n * If `true`, the ripple effect will be disabled.\n *\n * ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure\n * to highlight the element by applying separate styles with the `focusVisibleClassName`.\n */\n disableRipple: PropTypes.bool,\n\n /**\n * If `true`, the touch ripple effect will be disabled.\n */\n disableTouchRipple: PropTypes.bool,\n\n /**\n * If `true`, the base button will have a keyboard focus ripple.\n * `disableRipple` must also be `false`.\n */\n focusRipple: PropTypes.bool,\n\n /**\n * This prop can help a person know which element has the keyboard focus.\n * The class name will be applied when the element gain the focus through a keyboard interaction.\n * It's a polyfill for the [CSS :focus-visible selector](https://drafts.csswg.org/selectors-4/#the-focus-visible-pseudo).\n * The rationale for using this feature [is explained here](https://github.com/WICG/focus-visible/blob/master/explainer.md).\n * A [polyfill can be used](https://github.com/WICG/focus-visible) to apply a `focus-visible` class to other components\n * if needed.\n */\n focusVisibleClassName: PropTypes.string,\n\n /**\n * @ignore\n */\n onBlur: PropTypes.func,\n\n /**\n * @ignore\n */\n onClick: PropTypes.func,\n\n /**\n * @ignore\n */\n onDragLeave: PropTypes.func,\n\n /**\n * @ignore\n */\n onFocus: PropTypes.func,\n\n /**\n * Callback fired when the component is focused with a keyboard.\n * We trigger a `onFocus` callback too.\n */\n onFocusVisible: PropTypes.func,\n\n /**\n * @ignore\n */\n onKeyDown: PropTypes.func,\n\n /**\n * @ignore\n */\n onKeyUp: PropTypes.func,\n\n /**\n * @ignore\n */\n onMouseDown: PropTypes.func,\n\n /**\n * @ignore\n */\n onMouseLeave: PropTypes.func,\n\n /**\n * @ignore\n */\n onMouseUp: PropTypes.func,\n\n /**\n * @ignore\n */\n onTouchEnd: PropTypes.func,\n\n /**\n * @ignore\n */\n onTouchMove: PropTypes.func,\n\n /**\n * @ignore\n */\n onTouchStart: PropTypes.func,\n\n /**\n * @ignore\n */\n role: PropTypes.string,\n\n /**\n * @ignore\n */\n tabIndex: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n\n /**\n * Props applied to the `TouchRipple` element.\n */\n TouchRippleProps: PropTypes.object,\n\n /**\n * Used to control the button's purpose.\n * This prop passes the value to the `type` attribute of the native button component.\n */\n type: PropTypes.oneOf(['submit', 'reset', 'button'])\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiButtonBase'\n})(ButtonBase);","import _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport { fade } from '../styles/colorManipulator';\nimport ButtonBase from '../ButtonBase';\nimport capitalize from '../utils/capitalize';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: _extends({}, theme.typography.button, {\n boxSizing: 'border-box',\n minWidth: 64,\n padding: '6px 16px',\n borderRadius: theme.shape.borderRadius,\n color: theme.palette.text.primary,\n transition: theme.transitions.create(['background-color', 'box-shadow', 'border'], {\n duration: theme.transitions.duration.short\n }),\n '&:hover': {\n textDecoration: 'none',\n backgroundColor: fade(theme.palette.text.primary, theme.palette.action.hoverOpacity),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n },\n '&$disabled': {\n backgroundColor: 'transparent'\n }\n },\n '&$disabled': {\n color: theme.palette.action.disabled\n }\n }),\n\n /* Styles applied to the span element that wraps the children. */\n label: {\n width: '100%',\n // Ensure the correct width for iOS Safari\n display: 'inherit',\n alignItems: 'inherit',\n justifyContent: 'inherit'\n },\n\n /* Styles applied to the root element if `variant=\"text\"`. */\n text: {\n padding: '6px 8px'\n },\n\n /* Styles applied to the root element if `variant=\"text\"` and `color=\"primary\"`. */\n textPrimary: {\n color: theme.palette.primary.main,\n '&:hover': {\n backgroundColor: fade(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\n /* Styles applied to the root element if `variant=\"text\"` and `color=\"secondary\"`. */\n textSecondary: {\n color: theme.palette.secondary.main,\n '&:hover': {\n backgroundColor: fade(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\n /* Styles applied to the root element if `variant=\"outlined\"`. */\n outlined: {\n padding: '5px 15px',\n border: \"1px solid \".concat(theme.palette.type === 'light' ? 'rgba(0, 0, 0, 0.23)' : 'rgba(255, 255, 255, 0.23)'),\n '&$disabled': {\n border: \"1px solid \".concat(theme.palette.action.disabledBackground)\n }\n },\n\n /* Styles applied to the root element if `variant=\"outlined\"` and `color=\"primary\"`. */\n outlinedPrimary: {\n color: theme.palette.primary.main,\n border: \"1px solid \".concat(fade(theme.palette.primary.main, 0.5)),\n '&:hover': {\n border: \"1px solid \".concat(theme.palette.primary.main),\n backgroundColor: fade(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\n /* Styles applied to the root element if `variant=\"outlined\"` and `color=\"secondary\"`. */\n outlinedSecondary: {\n color: theme.palette.secondary.main,\n border: \"1px solid \".concat(fade(theme.palette.secondary.main, 0.5)),\n '&:hover': {\n border: \"1px solid \".concat(theme.palette.secondary.main),\n backgroundColor: fade(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 '&$disabled': {\n border: \"1px solid \".concat(theme.palette.action.disabled)\n }\n },\n\n /* Styles applied to the root element if `variant=\"contained\"`. */\n contained: {\n color: theme.palette.getContrastText(theme.palette.grey[300]),\n backgroundColor: theme.palette.grey[300],\n boxShadow: theme.shadows[2],\n '&:hover': {\n backgroundColor: theme.palette.grey.A100,\n boxShadow: theme.shadows[4],\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n boxShadow: theme.shadows[2],\n backgroundColor: theme.palette.grey[300]\n },\n '&$disabled': {\n backgroundColor: theme.palette.action.disabledBackground\n }\n },\n '&$focusVisible': {\n boxShadow: theme.shadows[6]\n },\n '&:active': {\n boxShadow: theme.shadows[8]\n },\n '&$disabled': {\n color: theme.palette.action.disabled,\n boxShadow: theme.shadows[0],\n backgroundColor: theme.palette.action.disabledBackground\n }\n },\n\n /* Styles applied to the root element if `variant=\"contained\"` and `color=\"primary\"`. */\n containedPrimary: {\n color: theme.palette.primary.contrastText,\n backgroundColor: theme.palette.primary.main,\n '&:hover': {\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 },\n\n /* Styles applied to the root element if `variant=\"contained\"` and `color=\"secondary\"`. */\n containedSecondary: {\n color: theme.palette.secondary.contrastText,\n backgroundColor: theme.palette.secondary.main,\n '&:hover': {\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 },\n\n /* Styles applied to the root element if `disableElevation={true}`. */\n disableElevation: {\n boxShadow: 'none',\n '&:hover': {\n boxShadow: 'none'\n },\n '&$focusVisible': {\n boxShadow: 'none'\n },\n '&:active': {\n boxShadow: 'none'\n },\n '&$disabled': {\n boxShadow: 'none'\n }\n },\n\n /* Pseudo-class applied to the ButtonBase root element if the button is keyboard focused. */\n focusVisible: {},\n\n /* Pseudo-class applied to the root element if `disabled={true}`. */\n disabled: {},\n\n /* Styles applied to the root element if `color=\"inherit\"`. */\n colorInherit: {\n color: 'inherit',\n borderColor: 'currentColor'\n },\n\n /* Styles applied to the root element if `size=\"small\"` and `variant=\"text\"`. */\n textSizeSmall: {\n padding: '4px 5px',\n fontSize: theme.typography.pxToRem(13)\n },\n\n /* Styles applied to the root element if `size=\"large\"` and `variant=\"text\"`. */\n textSizeLarge: {\n padding: '8px 11px',\n fontSize: theme.typography.pxToRem(15)\n },\n\n /* Styles applied to the root element if `size=\"small\"` and `variant=\"outlined\"`. */\n outlinedSizeSmall: {\n padding: '3px 9px',\n fontSize: theme.typography.pxToRem(13)\n },\n\n /* Styles applied to the root element if `size=\"large\"` and `variant=\"outlined\"`. */\n outlinedSizeLarge: {\n padding: '7px 21px',\n fontSize: theme.typography.pxToRem(15)\n },\n\n /* Styles applied to the root element if `size=\"small\"` and `variant=\"contained\"`. */\n containedSizeSmall: {\n padding: '4px 10px',\n fontSize: theme.typography.pxToRem(13)\n },\n\n /* Styles applied to the root element if `size=\"large\"` and `variant=\"contained\"`. */\n containedSizeLarge: {\n padding: '8px 22px',\n fontSize: theme.typography.pxToRem(15)\n },\n\n /* Styles applied to the root element if `size=\"small\"`. */\n sizeSmall: {},\n\n /* Styles applied to the root element if `size=\"large\"`. */\n sizeLarge: {},\n\n /* Styles applied to the root element if `fullWidth={true}`. */\n fullWidth: {\n width: '100%'\n },\n\n /* Styles applied to the startIcon element if supplied. */\n startIcon: {\n display: 'inherit',\n marginRight: 8,\n marginLeft: -4,\n '&$iconSizeSmall': {\n marginLeft: -2\n }\n },\n\n /* Styles applied to the endIcon element if supplied. */\n endIcon: {\n display: 'inherit',\n marginRight: -4,\n marginLeft: 8,\n '&$iconSizeSmall': {\n marginRight: -2\n }\n },\n\n /* Styles applied to the icon element if supplied and `size=\"small\"`. */\n iconSizeSmall: {\n '& > *:first-child': {\n fontSize: 18\n }\n },\n\n /* Styles applied to the icon element if supplied and `size=\"medium\"`. */\n iconSizeMedium: {\n '& > *:first-child': {\n fontSize: 20\n }\n },\n\n /* Styles applied to the icon element if supplied and `size=\"large\"`. */\n iconSizeLarge: {\n '& > *:first-child': {\n fontSize: 22\n }\n }\n };\n};\nvar Button = React.forwardRef(function Button(props, ref) {\n var children = props.children,\n 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 ? 'button' : _props$component,\n _props$disabled = props.disabled,\n disabled = _props$disabled === void 0 ? false : _props$disabled,\n _props$disableElevati = props.disableElevation,\n disableElevation = _props$disableElevati === void 0 ? false : _props$disableElevati,\n _props$disableFocusRi = props.disableFocusRipple,\n disableFocusRipple = _props$disableFocusRi === void 0 ? false : _props$disableFocusRi,\n endIconProp = props.endIcon,\n focusVisibleClassName = props.focusVisibleClassName,\n _props$fullWidth = props.fullWidth,\n fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth,\n _props$size = props.size,\n size = _props$size === void 0 ? 'medium' : _props$size,\n startIconProp = props.startIcon,\n _props$type = props.type,\n type = _props$type === void 0 ? 'button' : _props$type,\n _props$variant = props.variant,\n variant = _props$variant === void 0 ? 'text' : _props$variant,\n other = _objectWithoutProperties(props, [\"children\", \"classes\", \"className\", \"color\", \"component\", \"disabled\", \"disableElevation\", \"disableFocusRipple\", \"endIcon\", \"focusVisibleClassName\", \"fullWidth\", \"size\", \"startIcon\", \"type\", \"variant\"]);\n\n var startIcon = startIconProp && React.createElement(\"span\", {\n className: clsx(classes.startIcon, classes[\"iconSize\".concat(capitalize(size))])\n }, startIconProp);\n var endIcon = endIconProp && React.createElement(\"span\", {\n className: clsx(classes.endIcon, classes[\"iconSize\".concat(capitalize(size))])\n }, endIconProp);\n return React.createElement(ButtonBase, _extends({\n className: clsx(classes.root, classes[variant], className, color === 'inherit' ? classes.colorInherit : color !== 'default' && classes[\"\".concat(variant).concat(capitalize(color))], size !== 'medium' && [classes[\"\".concat(variant, \"Size\").concat(capitalize(size))], classes[\"size\".concat(capitalize(size))]], disableElevation && classes.disableElevation, disabled && classes.disabled, fullWidth && classes.fullWidth),\n component: component,\n disabled: disabled,\n focusRipple: !disableFocusRipple,\n focusVisibleClassName: clsx(classes.focusVisible, focusVisibleClassName),\n ref: ref,\n type: type\n }, other), React.createElement(\"span\", {\n className: classes.label\n }, startIcon, children, endIcon));\n});\nprocess.env.NODE_ENV !== \"production\" ? Button.propTypes = {\n /**\n * The content of the button.\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 color of the component. It supports those theme colors that make sense for this component.\n */\n color: PropTypes.oneOf(['default', 'inherit', 'primary', 'secondary']),\n\n /**\n * The component used for the root node.\n * Either a string to use a DOM element or a component.\n */\n component: PropTypes.elementType,\n\n /**\n * If `true`, the button will be disabled.\n */\n disabled: PropTypes.bool,\n\n /**\n * If `true`, no elevation is used.\n */\n disableElevation: PropTypes.bool,\n\n /**\n * If `true`, the keyboard focus ripple will be disabled.\n * `disableRipple` must also be true.\n */\n disableFocusRipple: PropTypes.bool,\n\n /**\n * If `true`, the ripple effect will be disabled.\n *\n * ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure\n * to highlight the element by applying separate styles with the `focusVisibleClassName`.\n */\n disableRipple: PropTypes.bool,\n\n /**\n * Element placed after the children.\n */\n endIcon: PropTypes.node,\n\n /**\n * @ignore\n */\n focusVisibleClassName: PropTypes.string,\n\n /**\n * If `true`, the button will take up the full width of its container.\n */\n fullWidth: PropTypes.bool,\n\n /**\n * The URL to link to when the button is clicked.\n * If defined, an `a` element will be used as the root node.\n */\n href: PropTypes.string,\n\n /**\n * The size of the button.\n * `small` is equivalent to the dense button styling.\n */\n size: PropTypes.oneOf(['small', 'medium', 'large']),\n\n /**\n * Element placed before the children.\n */\n startIcon: PropTypes.node,\n\n /**\n * @ignore\n */\n type: PropTypes.string,\n\n /**\n * The variant to use.\n */\n variant: PropTypes.oneOf(['text', 'outlined', 'contained'])\n} : void 0;\nexport default withStyles(styles, {\n name: 'MuiButton'\n})(Button);","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport { exactProp } from '@material-ui/utils';\nimport setRef from '../utils/setRef';\nimport useForkRef from '../utils/useForkRef';\n\nfunction getContainer(container) {\n container = typeof container === 'function' ? container() : container; // #StrictMode ready\n\n return ReactDOM.findDOMNode(container);\n}\n\nvar useEnhancedEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;\n/**\n * Portals provide a first-class way to render children into a DOM node\n * that exists outside the DOM hierarchy of the parent component.\n */\n\nvar Portal = React.forwardRef(function Portal(props, ref) {\n var children = props.children,\n container = props.container,\n _props$disablePortal = props.disablePortal,\n disablePortal = _props$disablePortal === void 0 ? false : _props$disablePortal,\n onRendered = props.onRendered;\n\n var _React$useState = React.useState(null),\n mountNode = _React$useState[0],\n setMountNode = _React$useState[1];\n\n var handleRef = useForkRef(React.isValidElement(children) ? children.ref : null, ref);\n useEnhancedEffect(function () {\n if (!disablePortal) {\n setMountNode(getContainer(container) || document.body);\n }\n }, [container, disablePortal]);\n useEnhancedEffect(function () {\n if (mountNode && !disablePortal) {\n setRef(ref, mountNode);\n return function () {\n setRef(ref, null);\n };\n }\n\n return undefined;\n }, [ref, mountNode, disablePortal]);\n useEnhancedEffect(function () {\n if (onRendered && (mountNode || disablePortal)) {\n onRendered();\n }\n }, [onRendered, mountNode, disablePortal]);\n\n if (disablePortal) {\n if (React.isValidElement(children)) {\n return React.cloneElement(children, {\n ref: handleRef\n });\n }\n\n return children;\n }\n\n return mountNode ? ReactDOM.createPortal(children, mountNode) : mountNode;\n});\nprocess.env.NODE_ENV !== \"production\" ? Portal.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 children to render into the `container`.\n */\n children: PropTypes.node,\n\n /**\n * A node, component instance, or function that returns either.\n * The `container` will have the portal children appended to it.\n * By default, it uses the body of the top-level document object,\n * so it's simply `document.body` most of the time.\n */\n container: PropTypes.oneOfType([PropTypes.func, PropTypes.instanceOf(React.Component), PropTypes.instanceOf(typeof Element === 'undefined' ? Object : Element)]),\n\n /**\n * Disable the portal behavior.\n * The children stay within it's parent DOM hierarchy.\n */\n disablePortal: PropTypes.bool,\n\n /**\n * Callback fired once the children has been mounted into the `container`.\n *\n * This prop will be deprecated and removed in v5, the ref can be used instead.\n */\n onRendered: PropTypes.func\n} : void 0;\n\nif (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line\n Portal['propTypes' + ''] = exactProp(Portal.propTypes);\n}\n\nexport default Portal;","import _classCallCheck from \"@babel/runtime/helpers/esm/classCallCheck\";\nimport _createClass from \"@babel/runtime/helpers/esm/createClass\";\nimport _toConsumableArray from \"@babel/runtime/helpers/esm/toConsumableArray\";\nimport getScrollbarSize from '../utils/getScrollbarSize';\nimport ownerDocument from '../utils/ownerDocument';\nimport ownerWindow from '../utils/ownerWindow'; // Is a vertical scrollbar displayed?\n\nfunction isOverflowing(container) {\n var doc = ownerDocument(container);\n\n if (doc.body === container) {\n return ownerWindow(doc).innerWidth > doc.documentElement.clientWidth;\n }\n\n return container.scrollHeight > container.clientHeight;\n}\n\nexport function ariaHidden(node, show) {\n if (show) {\n node.setAttribute('aria-hidden', 'true');\n } else {\n node.removeAttribute('aria-hidden');\n }\n}\n\nfunction getPaddingRight(node) {\n return parseInt(window.getComputedStyle(node)['padding-right'], 10) || 0;\n}\n\nfunction ariaHiddenSiblings(container, mountNode, currentNode) {\n var nodesToExclude = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];\n var show = arguments.length > 4 ? arguments[4] : undefined;\n var blacklist = [mountNode, currentNode].concat(_toConsumableArray(nodesToExclude));\n var blacklistTagNames = ['TEMPLATE', 'SCRIPT', 'STYLE'];\n [].forEach.call(container.children, function (node) {\n if (node.nodeType === 1 && blacklist.indexOf(node) === -1 && blacklistTagNames.indexOf(node.tagName) === -1) {\n ariaHidden(node, show);\n }\n });\n}\n\nfunction findIndexOf(containerInfo, callback) {\n var idx = -1;\n containerInfo.some(function (item, index) {\n if (callback(item)) {\n idx = index;\n return true;\n }\n\n return false;\n });\n return idx;\n}\n\nfunction handleContainer(containerInfo, props) {\n var restoreStyle = [];\n var restorePaddings = [];\n var container = containerInfo.container;\n var fixedNodes;\n\n if (!props.disableScrollLock) {\n if (isOverflowing(container)) {\n // Compute the size before applying overflow hidden to avoid any scroll jumps.\n var scrollbarSize = getScrollbarSize();\n restoreStyle.push({\n value: container.style.paddingRight,\n key: 'padding-right',\n el: container\n }); // Use computed style, here to get the real padding to add our scrollbar width.\n\n container.style['padding-right'] = \"\".concat(getPaddingRight(container) + scrollbarSize, \"px\"); // .mui-fixed is a global helper.\n\n fixedNodes = ownerDocument(container).querySelectorAll('.mui-fixed');\n [].forEach.call(fixedNodes, function (node) {\n restorePaddings.push(node.style.paddingRight);\n node.style.paddingRight = \"\".concat(getPaddingRight(node) + scrollbarSize, \"px\");\n });\n } // Improve Gatsby support\n // https://css-tricks.com/snippets/css/force-vertical-scrollbar/\n\n\n var parent = container.parentElement;\n var scrollContainer = parent.nodeName === 'HTML' && window.getComputedStyle(parent)['overflow-y'] === 'scroll' ? parent : container; // Block the scroll even if no scrollbar is visible to account for mobile keyboard\n // screensize shrink.\n\n restoreStyle.push({\n value: scrollContainer.style.overflow,\n key: 'overflow',\n el: scrollContainer\n });\n scrollContainer.style.overflow = 'hidden';\n }\n\n var restore = function restore() {\n if (fixedNodes) {\n [].forEach.call(fixedNodes, function (node, i) {\n if (restorePaddings[i]) {\n node.style.paddingRight = restorePaddings[i];\n } else {\n node.style.removeProperty('padding-right');\n }\n });\n }\n\n restoreStyle.forEach(function (_ref) {\n var value = _ref.value,\n el = _ref.el,\n key = _ref.key;\n\n if (value) {\n el.style.setProperty(key, value);\n } else {\n el.style.removeProperty(key);\n }\n });\n };\n\n return restore;\n}\n\nfunction getHiddenSiblings(container) {\n var hiddenSiblings = [];\n [].forEach.call(container.children, function (node) {\n if (node.getAttribute && node.getAttribute('aria-hidden') === 'true') {\n hiddenSiblings.push(node);\n }\n });\n return hiddenSiblings;\n}\n/**\n * @ignore - do not document.\n *\n * Proper state management for containers and the modals in those containers.\n * Simplified, but inspired by react-overlay's ModalManager class.\n * Used by the Modal to ensure proper styling of containers.\n */\n\n\nvar ModalManager =\n/*#__PURE__*/\nfunction () {\n function ModalManager() {\n _classCallCheck(this, ModalManager);\n\n // this.modals[modalIndex] = modal\n this.modals = []; // this.containers[containerIndex] = {\n // modals: [],\n // container,\n // restore: null,\n // }\n\n this.containers = [];\n }\n\n _createClass(ModalManager, [{\n key: \"add\",\n value: function add(modal, container) {\n var modalIndex = this.modals.indexOf(modal);\n\n if (modalIndex !== -1) {\n return modalIndex;\n }\n\n modalIndex = this.modals.length;\n this.modals.push(modal); // If the modal we are adding is already in the DOM.\n\n if (modal.modalRef) {\n ariaHidden(modal.modalRef, false);\n }\n\n var hiddenSiblingNodes = getHiddenSiblings(container);\n ariaHiddenSiblings(container, modal.mountNode, modal.modalRef, hiddenSiblingNodes, true);\n var containerIndex = findIndexOf(this.containers, function (item) {\n return item.container === container;\n });\n\n if (containerIndex !== -1) {\n this.containers[containerIndex].modals.push(modal);\n return modalIndex;\n }\n\n this.containers.push({\n modals: [modal],\n container: container,\n restore: null,\n hiddenSiblingNodes: hiddenSiblingNodes\n });\n return modalIndex;\n }\n }, {\n key: \"mount\",\n value: function mount(modal, props) {\n var containerIndex = findIndexOf(this.containers, function (item) {\n return item.modals.indexOf(modal) !== -1;\n });\n var containerInfo = this.containers[containerIndex];\n\n if (!containerInfo.restore) {\n containerInfo.restore = handleContainer(containerInfo, props);\n }\n }\n }, {\n key: \"remove\",\n value: function remove(modal) {\n var modalIndex = this.modals.indexOf(modal);\n\n if (modalIndex === -1) {\n return modalIndex;\n }\n\n var containerIndex = findIndexOf(this.containers, function (item) {\n return item.modals.indexOf(modal) !== -1;\n });\n var containerInfo = this.containers[containerIndex];\n containerInfo.modals.splice(containerInfo.modals.indexOf(modal), 1);\n this.modals.splice(modalIndex, 1); // If that was the last modal in a container, clean up the container.\n\n if (containerInfo.modals.length === 0) {\n // The modal might be closed before it had the chance to be mounted in the DOM.\n if (containerInfo.restore) {\n containerInfo.restore();\n }\n\n if (modal.modalRef) {\n // In case the modal wasn't in the DOM yet.\n ariaHidden(modal.modalRef, true);\n }\n\n ariaHiddenSiblings(containerInfo.container, modal.mountNode, modal.modalRef, containerInfo.hiddenSiblingNodes, false);\n this.containers.splice(containerIndex, 1);\n } else {\n // Otherwise make sure the next top modal is visible to a screen reader.\n var nextTop = containerInfo.modals[containerInfo.modals.length - 1]; // as soon as a modal is adding its modalRef is undefined. it can't set\n // aria-hidden because the dom element doesn't exist either\n // when modal was unmounted before modalRef gets null\n\n if (nextTop.modalRef) {\n ariaHidden(nextTop.modalRef, false);\n }\n }\n\n return modalIndex;\n }\n }, {\n key: \"isTopModal\",\n value: function isTopModal(modal) {\n return this.modals.length > 0 && this.modals[this.modals.length - 1] === modal;\n }\n }]);\n\n return ModalManager;\n}();\n\nexport { ModalManager as default };","/* eslint-disable consistent-return, jsx-a11y/no-noninteractive-tabindex */\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport ownerDocument from '../utils/ownerDocument';\nimport useForkRef from '../utils/useForkRef';\n/**\n * @ignore - internal component.\n */\n\nfunction TrapFocus(props) {\n var children = props.children,\n _props$disableAutoFoc = props.disableAutoFocus,\n disableAutoFocus = _props$disableAutoFoc === void 0 ? false : _props$disableAutoFoc,\n _props$disableEnforce = props.disableEnforceFocus,\n disableEnforceFocus = _props$disableEnforce === void 0 ? false : _props$disableEnforce,\n _props$disableRestore = props.disableRestoreFocus,\n disableRestoreFocus = _props$disableRestore === void 0 ? false : _props$disableRestore,\n getDoc = props.getDoc,\n isEnabled = props.isEnabled,\n open = props.open;\n var ignoreNextEnforceFocus = React.useRef();\n var sentinelStart = React.useRef(null);\n var sentinelEnd = React.useRef(null);\n var nodeToRestore = React.useRef();\n var rootRef = React.useRef(null); // 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 rootRef.current = ReactDOM.findDOMNode(instance);\n }, []);\n var handleRef = useForkRef(children.ref, handleOwnRef); // ⚠️ You may rely on React.useMemo as a performance optimization, not as a semantic guarantee.\n // https://reactjs.org/docs/hooks-reference.html#usememo\n\n React.useMemo(function () {\n if (!open || typeof window === 'undefined') {\n return;\n }\n\n nodeToRestore.current = getDoc().activeElement;\n }, [open]); // eslint-disable-line react-hooks/exhaustive-deps\n\n React.useEffect(function () {\n if (!open) {\n return;\n }\n\n var doc = ownerDocument(rootRef.current); // We might render an empty child.\n\n if (!disableAutoFocus && rootRef.current && !rootRef.current.contains(doc.activeElement)) {\n if (!rootRef.current.hasAttribute('tabIndex')) {\n if (process.env.NODE_ENV !== 'production') {\n console.error(['Material-UI: the modal content node does not accept focus.', 'For the benefit of assistive technologies, ' + 'the tabIndex of the node is being set to \"-1\".'].join('\\n'));\n }\n\n rootRef.current.setAttribute('tabIndex', -1);\n }\n\n rootRef.current.focus();\n }\n\n var contain = function contain() {\n if (disableEnforceFocus || !isEnabled() || ignoreNextEnforceFocus.current) {\n ignoreNextEnforceFocus.current = false;\n return;\n }\n\n if (rootRef.current && !rootRef.current.contains(doc.activeElement)) {\n rootRef.current.focus();\n }\n };\n\n var loopFocus = function loopFocus(event) {\n // 9 = Tab\n if (disableEnforceFocus || !isEnabled() || event.keyCode !== 9) {\n return;\n } // Make sure the next tab starts from the right place.\n\n\n if (doc.activeElement === rootRef.current) {\n // We need to ignore the next contain as\n // it will try to move the focus back to the rootRef element.\n ignoreNextEnforceFocus.current = true;\n\n if (event.shiftKey) {\n sentinelEnd.current.focus();\n } else {\n sentinelStart.current.focus();\n }\n }\n };\n\n doc.addEventListener('focus', contain, true);\n doc.addEventListener('keydown', loopFocus, true); // With Edge, Safari and Firefox, no focus related events are fired when the focused area stops being a focused area\n // e.g. https://bugzilla.mozilla.org/show_bug.cgi?id=559561.\n //\n // The whatwg spec defines how the browser should behave but does not explicitly mention any events:\n // https://html.spec.whatwg.org/multipage/interaction.html#focus-fixup-rule.\n\n var interval = setInterval(function () {\n contain();\n }, 50);\n return function () {\n clearInterval(interval);\n doc.removeEventListener('focus', contain, true);\n doc.removeEventListener('keydown', loopFocus, true); // restoreLastFocus()\n\n if (!disableRestoreFocus) {\n // In IE 11 it is possible for document.activeElement to be null resulting\n // in nodeToRestore.current being null.\n // Not all elements in IE 11 have a focus method.\n // Once IE 11 support is dropped the focus() call can be unconditional.\n if (nodeToRestore.current && nodeToRestore.current.focus) {\n nodeToRestore.current.focus();\n }\n\n nodeToRestore.current = null;\n }\n };\n }, [disableAutoFocus, disableEnforceFocus, disableRestoreFocus, isEnabled, open]);\n return React.createElement(React.Fragment, null, React.createElement(\"div\", {\n tabIndex: 0,\n ref: sentinelStart,\n \"data-test\": \"sentinelStart\"\n }), React.cloneElement(children, {\n ref: handleRef\n }), React.createElement(\"div\", {\n tabIndex: 0,\n ref: sentinelEnd,\n \"data-test\": \"sentinelEnd\"\n }));\n}\n\nprocess.env.NODE_ENV !== \"production\" ? TrapFocus.propTypes = {\n /**\n * A single child content element.\n */\n children: PropTypes.element.isRequired,\n\n /**\n * If `true`, the modal will not automatically shift focus to itself when it opens, and\n * replace it to the last focused element when it closes.\n * This also works correctly with any modal children that have the `disableAutoFocus` prop.\n *\n * Generally this should never be set to `true` as it makes the modal less\n * accessible to assistive technologies, like screen readers.\n */\n disableAutoFocus: PropTypes.bool,\n\n /**\n * If `true`, the modal will not prevent focus from leaving the modal while open.\n *\n * Generally this should never be set to `true` as it makes the modal less\n * accessible to assistive technologies, like screen readers.\n */\n disableEnforceFocus: PropTypes.bool,\n\n /**\n * If `true`, the modal will not restore focus to previously focused element once\n * modal is hidden.\n */\n disableRestoreFocus: PropTypes.bool,\n\n /**\n * Return the document to consider.\n * We use it to implement the restore focus between different browser documents.\n */\n getDoc: PropTypes.func.isRequired,\n\n /**\n * Do we still want to enforce the focus?\n * This prop helps nesting TrapFocus elements.\n */\n isEnabled: PropTypes.func.isRequired,\n\n /**\n * If `true`, the modal is open.\n */\n open: PropTypes.bool.isRequired\n} : void 0;\n/*\n\nIn the future, we should be able to replace TrapFocus with:\nhttps://github.com/facebook/react/blob/master/packages/react-events/docs/FocusScope.md\n\n```jsx\nimport FocusScope from 'react-dom/FocusScope';\n\nfunction TrapFocus(props) {\n const {\n children\n disableAutoFocus = false,\n disableEnforceFocus = false,\n disableRestoreFocus = false,\n open,\n } = props;\n\n if (!open) {\n return children;\n }\n\n return (\n \n {children}\n \n );\n}\n```\n\n*/\n\nexport default TrapFocus;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nexport var styles = {\n /* Styles applied to the root element. */\n root: {\n zIndex: -1,\n position: 'fixed',\n right: 0,\n bottom: 0,\n top: 0,\n left: 0,\n backgroundColor: 'rgba(0, 0, 0, 0.5)',\n WebkitTapHighlightColor: 'transparent'\n },\n\n /* Styles applied to the root element if `invisible={true}`. */\n invisible: {\n backgroundColor: 'transparent'\n }\n};\n/**\n * @ignore - internal component.\n */\n\nvar SimpleBackdrop = React.forwardRef(function SimpleBackdrop(props, ref) {\n var _props$invisible = props.invisible,\n invisible = _props$invisible === void 0 ? false : _props$invisible,\n open = props.open,\n other = _objectWithoutProperties(props, [\"invisible\", \"open\"]);\n\n return open ? React.createElement(\"div\", _extends({\n \"aria-hidden\": true,\n ref: ref\n }, other, {\n style: _extends({}, styles.root, {}, invisible ? styles.invisible : {}, {}, other.style)\n })) : null;\n});\nprocess.env.NODE_ENV !== \"production\" ? SimpleBackdrop.propTypes = {\n /**\n * If `true`, the backdrop is invisible.\n * It can be used when rendering a popover or a custom select component.\n */\n invisible: PropTypes.bool,\n\n /**\n * If `true`, the backdrop is open.\n */\n open: PropTypes.bool.isRequired\n} : void 0;\nexport default SimpleBackdrop;","import _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport { getThemeProps, useTheme } from '@material-ui/styles';\nimport { elementAcceptingRef } from '@material-ui/utils';\nimport ownerDocument from '../utils/ownerDocument';\nimport Portal from '../Portal';\nimport createChainedFunction from '../utils/createChainedFunction';\nimport useForkRef from '../utils/useForkRef';\nimport useEventCallback from '../utils/useEventCallback';\nimport zIndex from '../styles/zIndex';\nimport ModalManager, { ariaHidden } from './ModalManager';\nimport TrapFocus from './TrapFocus';\nimport SimpleBackdrop from './SimpleBackdrop';\n\nfunction getContainer(container) {\n container = typeof container === 'function' ? container() : container;\n return ReactDOM.findDOMNode(container);\n}\n\nfunction getHasTransition(props) {\n return props.children ? props.children.props.hasOwnProperty('in') : false;\n} // A modal manager used to track and manage the state of open Modals.\n// Modals don't open on the server so this won't conflict with concurrent requests.\n\n\nvar defaultManager = new ModalManager();\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: {\n position: 'fixed',\n zIndex: theme.zIndex.modal,\n right: 0,\n bottom: 0,\n top: 0,\n left: 0\n },\n\n /* Styles applied to the root element if the `Modal` has exited. */\n hidden: {\n visibility: 'hidden'\n }\n };\n};\n/**\n * Modal is a lower-level construct that is leveraged by the following components:\n *\n * - [Dialog](/api/dialog/)\n * - [Drawer](/api/drawer/)\n * - [Menu](/api/menu/)\n * - [Popover](/api/popover/)\n *\n * If you are creating a modal dialog, you probably want to use the [Dialog](/api/dialog/) component\n * rather than directly using Modal.\n *\n * This component shares many concepts with [react-overlays](https://react-bootstrap.github.io/react-overlays/#modals).\n */\n\nvar Modal = React.forwardRef(function Modal(inProps, ref) {\n var theme = useTheme();\n var props = getThemeProps({\n name: 'MuiModal',\n props: _extends({}, inProps),\n theme: theme\n });\n\n var _props$BackdropCompon = props.BackdropComponent,\n BackdropComponent = _props$BackdropCompon === void 0 ? SimpleBackdrop : _props$BackdropCompon,\n BackdropProps = props.BackdropProps,\n children = props.children,\n _props$closeAfterTran = props.closeAfterTransition,\n closeAfterTransition = _props$closeAfterTran === void 0 ? false : _props$closeAfterTran,\n container = props.container,\n _props$disableAutoFoc = props.disableAutoFocus,\n disableAutoFocus = _props$disableAutoFoc === void 0 ? false : _props$disableAutoFoc,\n _props$disableBackdro = props.disableBackdropClick,\n disableBackdropClick = _props$disableBackdro === void 0 ? false : _props$disableBackdro,\n _props$disableEnforce = props.disableEnforceFocus,\n disableEnforceFocus = _props$disableEnforce === void 0 ? false : _props$disableEnforce,\n _props$disableEscapeK = props.disableEscapeKeyDown,\n disableEscapeKeyDown = _props$disableEscapeK === void 0 ? false : _props$disableEscapeK,\n _props$disablePortal = props.disablePortal,\n disablePortal = _props$disablePortal === void 0 ? false : _props$disablePortal,\n _props$disableRestore = props.disableRestoreFocus,\n disableRestoreFocus = _props$disableRestore === void 0 ? false : _props$disableRestore,\n _props$disableScrollL = props.disableScrollLock,\n disableScrollLock = _props$disableScrollL === void 0 ? false : _props$disableScrollL,\n _props$hideBackdrop = props.hideBackdrop,\n hideBackdrop = _props$hideBackdrop === void 0 ? false : _props$hideBackdrop,\n _props$keepMounted = props.keepMounted,\n keepMounted = _props$keepMounted === void 0 ? false : _props$keepMounted,\n _props$manager = props.manager,\n manager = _props$manager === void 0 ? defaultManager : _props$manager,\n onBackdropClick = props.onBackdropClick,\n onClose = props.onClose,\n onEscapeKeyDown = props.onEscapeKeyDown,\n onRendered = props.onRendered,\n open = props.open,\n other = _objectWithoutProperties(props, [\"BackdropComponent\", \"BackdropProps\", \"children\", \"closeAfterTransition\", \"container\", \"disableAutoFocus\", \"disableBackdropClick\", \"disableEnforceFocus\", \"disableEscapeKeyDown\", \"disablePortal\", \"disableRestoreFocus\", \"disableScrollLock\", \"hideBackdrop\", \"keepMounted\", \"manager\", \"onBackdropClick\", \"onClose\", \"onEscapeKeyDown\", \"onRendered\", \"open\"]);\n\n var _React$useState = React.useState(true),\n exited = _React$useState[0],\n setExited = _React$useState[1];\n\n var modal = React.useRef({});\n var mountNodeRef = React.useRef(null);\n var modalRef = React.useRef(null);\n var handleRef = useForkRef(modalRef, ref);\n var hasTransition = getHasTransition(props);\n\n var getDoc = function getDoc() {\n return ownerDocument(mountNodeRef.current);\n };\n\n var getModal = function getModal() {\n modal.current.modalRef = modalRef.current;\n modal.current.mountNode = mountNodeRef.current;\n return modal.current;\n };\n\n var handleMounted = function handleMounted() {\n manager.mount(getModal(), {\n disableScrollLock: disableScrollLock\n }); // Fix a bug on Chrome where the scroll isn't initially 0.\n\n modalRef.current.scrollTop = 0;\n };\n\n var handleOpen = useEventCallback(function () {\n var resolvedContainer = getContainer(container) || getDoc().body;\n manager.add(getModal(), resolvedContainer); // The element was already mounted.\n\n if (modalRef.current) {\n handleMounted();\n }\n });\n var isTopModal = React.useCallback(function () {\n return manager.isTopModal(getModal());\n }, [manager]);\n var handlePortalRef = useEventCallback(function (node) {\n mountNodeRef.current = node;\n\n if (!node) {\n return;\n }\n\n if (onRendered) {\n onRendered();\n }\n\n if (open && isTopModal()) {\n handleMounted();\n } else {\n ariaHidden(modalRef.current, true);\n }\n });\n var handleClose = React.useCallback(function () {\n manager.remove(getModal());\n }, [manager]);\n React.useEffect(function () {\n return function () {\n handleClose();\n };\n }, [handleClose]);\n React.useEffect(function () {\n if (open) {\n handleOpen();\n } else if (!hasTransition || !closeAfterTransition) {\n handleClose();\n }\n }, [open, handleClose, hasTransition, closeAfterTransition, handleOpen]);\n\n if (!keepMounted && !open && (!hasTransition || exited)) {\n return null;\n }\n\n var handleEnter = function handleEnter() {\n setExited(false);\n };\n\n var handleExited = function handleExited() {\n setExited(true);\n\n if (closeAfterTransition) {\n handleClose();\n }\n };\n\n var handleBackdropClick = function handleBackdropClick(event) {\n if (event.target !== event.currentTarget) {\n return;\n }\n\n if (onBackdropClick) {\n onBackdropClick(event);\n }\n\n if (!disableBackdropClick && onClose) {\n onClose(event, 'backdropClick');\n }\n };\n\n var handleKeyDown = function handleKeyDown(event) {\n // 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 if (event.key !== 'Escape' || !isTopModal()) {\n return;\n } // Swallow the event, in case someone is listening for the escape key on the body.\n\n\n event.stopPropagation();\n\n if (onEscapeKeyDown) {\n onEscapeKeyDown(event);\n }\n\n if (!disableEscapeKeyDown && onClose) {\n onClose(event, 'escapeKeyDown');\n }\n };\n\n var inlineStyle = styles(theme || {\n zIndex: zIndex\n });\n var childProps = {};\n\n if (children.props.tabIndex === undefined) {\n childProps.tabIndex = children.props.tabIndex || '-1';\n } // It's a Transition like component\n\n\n if (hasTransition) {\n childProps.onEnter = createChainedFunction(handleEnter, children.props.onEnter);\n childProps.onExited = createChainedFunction(handleExited, children.props.onExited);\n }\n\n return React.createElement(Portal, {\n ref: handlePortalRef,\n container: container,\n disablePortal: disablePortal\n }, React.createElement(\"div\", _extends({\n ref: handleRef,\n onKeyDown: handleKeyDown,\n role: \"presentation\"\n }, other, {\n style: _extends({}, inlineStyle.root, {}, !open && exited ? inlineStyle.hidden : {}, {}, other.style)\n }), hideBackdrop ? null : React.createElement(BackdropComponent, _extends({\n open: open,\n onClick: handleBackdropClick\n }, BackdropProps)), React.createElement(TrapFocus, {\n disableEnforceFocus: disableEnforceFocus,\n disableAutoFocus: disableAutoFocus,\n disableRestoreFocus: disableRestoreFocus,\n getDoc: getDoc,\n isEnabled: isTopModal,\n open: open\n }, React.cloneElement(children, childProps))));\n});\nprocess.env.NODE_ENV !== \"production\" ? Modal.propTypes = {\n /**\n * A backdrop component. This prop enables custom backdrop rendering.\n */\n BackdropComponent: PropTypes.elementType,\n\n /**\n * Props applied to the [`Backdrop`](/api/backdrop/) element.\n */\n BackdropProps: PropTypes.object,\n\n /**\n * A single child content element.\n */\n children: elementAcceptingRef.isRequired,\n\n /**\n * When set to true the Modal waits until a nested Transition is completed before closing.\n */\n closeAfterTransition: PropTypes.bool,\n\n /**\n * A node, component instance, or function that returns either.\n * The `container` will have the portal children appended to it.\n */\n container: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),\n\n /**\n * If `true`, the modal will not automatically shift focus to itself when it opens, and\n * replace it to the last focused element when it closes.\n * This also works correctly with any modal children that have the `disableAutoFocus` prop.\n *\n * Generally this should never be set to `true` as it makes the modal less\n * accessible to assistive technologies, like screen readers.\n */\n disableAutoFocus: PropTypes.bool,\n\n /**\n * If `true`, clicking the backdrop will not fire any callback.\n */\n disableBackdropClick: PropTypes.bool,\n\n /**\n * If `true`, the modal will not prevent focus from leaving the modal while open.\n *\n * Generally this should never be set to `true` as it makes the modal less\n * accessible to assistive technologies, like screen readers.\n */\n disableEnforceFocus: PropTypes.bool,\n\n /**\n * If `true`, hitting escape will not fire any callback.\n */\n disableEscapeKeyDown: PropTypes.bool,\n\n /**\n * Disable the portal behavior.\n * The children stay within it's parent DOM hierarchy.\n */\n disablePortal: PropTypes.bool,\n\n /**\n * If `true`, the modal will not restore focus to previously focused element once\n * modal is hidden.\n */\n disableRestoreFocus: PropTypes.bool,\n\n /**\n * Disable the scroll lock behavior.\n */\n disableScrollLock: PropTypes.bool,\n\n /**\n * If `true`, the backdrop is not rendered.\n */\n hideBackdrop: PropTypes.bool,\n\n /**\n * Always keep the children in the DOM.\n * This prop can be useful in SEO situation or\n * when you want to maximize the responsiveness of the Modal.\n */\n keepMounted: PropTypes.bool,\n\n /**\n * @ignore\n */\n manager: PropTypes.object,\n\n /**\n * Callback fired when the backdrop is clicked.\n */\n onBackdropClick: PropTypes.func,\n\n /**\n * Callback fired when the component requests to be closed.\n * The `reason` parameter can optionally be used to control the response to `onClose`.\n *\n * @param {object} event The event source of the callback.\n * @param {string} reason Can be: `\"escapeKeyDown\"`, `\"backdropClick\"`.\n */\n onClose: PropTypes.func,\n\n /**\n * Callback fired when the escape key is pressed,\n * `disableEscapeKeyDown` is false and the modal is in focus.\n */\n onEscapeKeyDown: PropTypes.func,\n\n /**\n * Callback fired once the children has been mounted into the `container`.\n * It signals that the `open={true}` prop took effect.\n *\n * This prop will be deprecated and removed in v5, the ref can be used instead.\n */\n onRendered: PropTypes.func,\n\n /**\n * If `true`, the modal is open.\n */\n open: PropTypes.bool.isRequired\n} : void 0;\nexport default Modal;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport 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 = React.forwardRef(function Fade(props, ref) {\n var children = props.children,\n inProp = props.in,\n onEnter = props.onEnter,\n onExit = props.onExit,\n style = props.style,\n _props$timeout = props.timeout,\n timeout = _props$timeout === void 0 ? defaultTimeout : _props$timeout,\n other = _objectWithoutProperties(props, [\"children\", \"in\", \"onEnter\", \"onExit\", \"style\", \"timeout\"]);\n\n var theme = useTheme();\n var handleRef = useForkRef(children.ref, ref);\n\n var handleEnter = function handleEnter(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\n var handleExit = function handleExit(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\n return React.createElement(Transition, _extends({\n appear: true,\n in: inProp,\n onEnter: handleEnter,\n onExit: handleExit,\n timeout: timeout\n }, other), function (state, childProps) {\n return 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 /**\n * A single child content element.\n */\n children: PropTypes.element,\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 onExit: 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 enter: PropTypes.number,\n exit: PropTypes.number\n })])\n} : void 0;\nexport default Fade;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport Fade from '../Fade';\nexport var styles = {\n /* Styles applied to the root element. */\n root: {\n // Improve scrollable dialog support.\n zIndex: -1,\n position: 'fixed',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n right: 0,\n bottom: 0,\n top: 0,\n left: 0,\n backgroundColor: 'rgba(0, 0, 0, 0.5)',\n WebkitTapHighlightColor: 'transparent'\n },\n\n /* Styles applied to the root element if `invisible={true}`. */\n invisible: {\n backgroundColor: 'transparent'\n }\n};\nvar Backdrop = React.forwardRef(function Backdrop(props, ref) {\n var children = props.children,\n classes = props.classes,\n className = props.className,\n _props$invisible = props.invisible,\n invisible = _props$invisible === void 0 ? false : _props$invisible,\n open = props.open,\n transitionDuration = props.transitionDuration,\n other = _objectWithoutProperties(props, [\"children\", \"classes\", \"className\", \"invisible\", \"open\", \"transitionDuration\"]);\n\n return React.createElement(Fade, _extends({\n in: open,\n timeout: transitionDuration\n }, other), React.createElement(\"div\", {\n className: clsx(classes.root, className, invisible && classes.invisible),\n \"aria-hidden\": true,\n ref: ref\n }, children));\n});\nprocess.env.NODE_ENV !== \"production\" ? Backdrop.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 * If `true`, the backdrop is invisible.\n * It can be used when rendering a popover or a custom select component.\n */\n invisible: PropTypes.bool,\n\n /**\n * If `true`, the backdrop is open.\n */\n open: PropTypes.bool.isRequired,\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} : void 0;\nexport default withStyles(styles, {\n name: 'MuiBackdrop'\n})(Backdrop);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutProperties from \"@babel/runtime/helpers/esm/objectWithoutProperties\";\nimport _defineProperty from \"@babel/runtime/helpers/esm/defineProperty\";\n\n/* eslint-disable jsx-a11y/click-events-have-key-events */\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport withStyles from '../styles/withStyles';\nimport capitalize from '../utils/capitalize';\nimport Modal from '../Modal';\nimport Backdrop from '../Backdrop';\nimport Fade from '../Fade';\nimport { duration } from '../styles/transitions';\nimport Paper from '../Paper';\nexport var styles = function styles(theme) {\n return {\n /* Styles applied to the root element. */\n root: {\n '@media print': {\n // Use !important to override the Modal inline-style.\n position: 'absolute !important'\n }\n },\n\n /* Styles applied to the container element if `scroll=\"paper\"`. */\n scrollPaper: {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center'\n },\n\n /* Styles applied to the container element if `scroll=\"body\"`. */\n scrollBody: {\n overflowY: 'auto',\n overflowX: 'hidden',\n textAlign: 'center',\n '&:after': {\n content: '\"\"',\n display: 'inline-block',\n verticalAlign: 'middle',\n height: '100%',\n width: '0'\n }\n },\n\n /* Styles applied to the container element. */\n container: {\n height: '100%',\n '@media print': {\n height: 'auto'\n },\n // We disable the focus ring for mouse, touch and keyboard users.\n outline: 0\n },\n\n /* Styles applied to the `Paper` component. */\n paper: {\n margin: 32,\n position: 'relative',\n overflowY: 'auto',\n // Fix IE 11 issue, to remove at some point.\n '@media print': {\n overflowY: 'visible',\n boxShadow: 'none'\n }\n },\n\n /* Styles applied to the `Paper` component if `scroll=\"paper\"`. */\n paperScrollPaper: {\n display: 'flex',\n flexDirection: 'column',\n maxHeight: 'calc(100% - 64px)'\n },\n\n /* Styles applied to the `Paper` component if `scroll=\"body\"`. */\n paperScrollBody: {\n display: 'inline-block',\n verticalAlign: 'middle',\n textAlign: 'left' // 'initial' doesn't work on IE 11\n\n },\n\n /* Styles applied to the `Paper` component if `maxWidth=false`. */\n paperWidthFalse: {\n maxWidth: 'calc(100% - 64px)'\n },\n\n /* Styles applied to the `Paper` component if `maxWidth=\"xs\"`. */\n paperWidthXs: {\n maxWidth: Math.max(theme.breakpoints.values.xs, 444),\n '&$paperScrollBody': _defineProperty({}, theme.breakpoints.down(Math.max(theme.breakpoints.values.xs, 444) + 32 * 2), {\n maxWidth: 'calc(100% - 64px)'\n })\n },\n\n /* Styles applied to the `Paper` component if `maxWidth=\"sm\"`. */\n paperWidthSm: {\n maxWidth: theme.breakpoints.values.sm,\n '&$paperScrollBody': _defineProperty({}, theme.breakpoints.down(theme.breakpoints.values.sm + 32 * 2), {\n maxWidth: 'calc(100% - 64px)'\n })\n },\n\n /* Styles applied to the `Paper` component if `maxWidth=\"md\"`. */\n paperWidthMd: {\n maxWidth: theme.breakpoints.values.md,\n '&$paperScrollBody': _defineProperty({}, theme.breakpoints.down(theme.breakpoints.values.md + 32 * 2), {\n maxWidth: 'calc(100% - 64px)'\n })\n },\n\n /* Styles applied to the `Paper` component if `maxWidth=\"lg\"`. */\n paperWidthLg: {\n maxWidth: theme.breakpoints.values.lg,\n '&$paperScrollBody': _defineProperty({}, theme.breakpoints.down(theme.breakpoints.values.lg + 32 * 2), {\n maxWidth: 'calc(100% - 64px)'\n })\n },\n\n /* Styles applied to the `Paper` component if `maxWidth=\"xl\"`. */\n paperWidthXl: {\n maxWidth: theme.breakpoints.values.xl,\n '&$paperScrollBody': _defineProperty({}, theme.breakpoints.down(theme.breakpoints.values.xl + 32 * 2), {\n maxWidth: 'calc(100% - 64px)'\n })\n },\n\n /* Styles applied to the `Paper` component if `fullWidth={true}`. */\n paperFullWidth: {\n width: 'calc(100% - 64px)'\n },\n\n /* Styles applied to the `Paper` component if `fullScreen={true}`. */\n paperFullScreen: {\n margin: 0,\n width: '100%',\n maxWidth: '100%',\n height: '100%',\n maxHeight: 'none',\n borderRadius: 0,\n '&$paperScrollBody': {\n margin: 0,\n maxWidth: '100%'\n }\n }\n };\n};\nvar defaultTransitionDuration = {\n enter: duration.enteringScreen,\n exit: duration.leavingScreen\n};\n/**\n * Dialogs are overlaid modal paper based components with a backdrop.\n */\n\nvar Dialog = React.forwardRef(function Dialog(props, ref) {\n var BackdropProps = props.BackdropProps,\n children = props.children,\n classes = props.classes,\n className = props.className,\n _props$disableBackdro = props.disableBackdropClick,\n disableBackdropClick = _props$disableBackdro === void 0 ? false : _props$disableBackdro,\n _props$disableEscapeK = props.disableEscapeKeyDown,\n disableEscapeKeyDown = _props$disableEscapeK === void 0 ? false : _props$disableEscapeK,\n _props$fullScreen = props.fullScreen,\n fullScreen = _props$fullScreen === void 0 ? false : _props$fullScreen,\n _props$fullWidth = props.fullWidth,\n fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth,\n _props$maxWidth = props.maxWidth,\n maxWidth = _props$maxWidth === void 0 ? 'sm' : _props$maxWidth,\n onBackdropClick = props.onBackdropClick,\n onClose = props.onClose,\n onEnter = props.onEnter,\n onEntered = props.onEntered,\n onEntering = props.onEntering,\n onEscapeKeyDown = props.onEscapeKeyDown,\n onExit = props.onExit,\n onExited = props.onExited,\n onExiting = props.onExiting,\n open = props.open,\n _props$PaperComponent = props.PaperComponent,\n PaperComponent = _props$PaperComponent === void 0 ? Paper : _props$PaperComponent,\n _props$PaperProps = props.PaperProps,\n PaperProps = _props$PaperProps === void 0 ? {} : _props$PaperProps,\n _props$scroll = props.scroll,\n scroll = _props$scroll === void 0 ? 'paper' : _props$scroll,\n _props$TransitionComp = props.TransitionComponent,\n TransitionComponent = _props$TransitionComp === void 0 ? Fade : _props$TransitionComp,\n _props$transitionDura = props.transitionDuration,\n transitionDuration = _props$transitionDura === void 0 ? defaultTransitionDuration : _props$transitionDura,\n TransitionProps = props.TransitionProps,\n ariaDescribedby = props['aria-describedby'],\n ariaLabelledby = props['aria-labelledby'],\n other = _objectWithoutProperties(props, [\"BackdropProps\", \"children\", \"classes\", \"className\", \"disableBackdropClick\", \"disableEscapeKeyDown\", \"fullScreen\", \"fullWidth\", \"maxWidth\", \"onBackdropClick\", \"onClose\", \"onEnter\", \"onEntered\", \"onEntering\", \"onEscapeKeyDown\", \"onExit\", \"onExited\", \"onExiting\", \"open\", \"PaperComponent\", \"PaperProps\", \"scroll\", \"TransitionComponent\", \"transitionDuration\", \"TransitionProps\", \"aria-describedby\", \"aria-labelledby\"]);\n\n var mouseDownTarget = React.useRef();\n\n var handleMouseDown = function handleMouseDown(event) {\n mouseDownTarget.current = event.target;\n };\n\n var handleBackdropClick = function handleBackdropClick(event) {\n // Ignore the events not coming from the \"backdrop\"\n // We don't want to close the dialog when clicking the dialog content.\n if (event.target !== event.currentTarget) {\n return;\n } // Make sure the event starts and ends on the same DOM element.\n\n\n if (event.target !== mouseDownTarget.current) {\n return;\n }\n\n mouseDownTarget.current = null;\n\n if (onBackdropClick) {\n onBackdropClick(event);\n }\n\n if (!disableBackdropClick && onClose) {\n onClose(event, 'backdropClick');\n }\n };\n\n return React.createElement(Modal, _extends({\n className: clsx(classes.root, className),\n BackdropComponent: Backdrop,\n BackdropProps: _extends({\n transitionDuration: transitionDuration\n }, BackdropProps),\n closeAfterTransition: true,\n disableBackdropClick: disableBackdropClick,\n disableEscapeKeyDown: disableEscapeKeyDown,\n onEscapeKeyDown: onEscapeKeyDown,\n onClose: onClose,\n open: open,\n ref: ref\n }, other), React.createElement(TransitionComponent, _extends({\n appear: true,\n in: open,\n timeout: transitionDuration,\n onEnter: onEnter,\n onEntering: onEntering,\n onEntered: onEntered,\n onExit: onExit,\n onExiting: onExiting,\n onExited: onExited,\n role: \"none presentation\"\n }, TransitionProps), React.createElement(\"div\", {\n className: clsx(classes.container, classes[\"scroll\".concat(capitalize(scroll))]),\n onClick: handleBackdropClick,\n onMouseDown: handleMouseDown\n }, React.createElement(PaperComponent, _extends({\n elevation: 24,\n role: \"dialog\",\n \"aria-describedby\": ariaDescribedby,\n \"aria-labelledby\": ariaLabelledby\n }, PaperProps, {\n className: clsx(classes.paper, classes[\"paperScroll\".concat(capitalize(scroll))], classes[\"paperWidth\".concat(capitalize(String(maxWidth)))], PaperProps.className, fullScreen && classes.paperFullScreen, fullWidth && classes.paperFullWidth)\n }), children))));\n});\nprocess.env.NODE_ENV !== \"production\" ? Dialog.propTypes = {\n /**\n * The id(s) of the element(s) that describe the dialog.\n */\n 'aria-describedby': PropTypes.string,\n\n /**\n * The id(s) of the element(s) that label the dialog.\n */\n 'aria-labelledby': PropTypes.string,\n\n /**\n * @ignore\n */\n BackdropProps: PropTypes.object,\n\n /**\n * Dialog children, usually the included sub-components.\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 * If `true`, clicking the backdrop will not fire the `onClose` callback.\n */\n disableBackdropClick: PropTypes.bool,\n\n /**\n * If `true`, hitting escape will not fire the `onClose` callback.\n */\n disableEscapeKeyDown: PropTypes.bool,\n\n /**\n * If `true`, the dialog will be full-screen\n */\n fullScreen: PropTypes.bool,\n\n /**\n * If `true`, the dialog stretches to `maxWidth`.\n *\n * Notice that the dialog width grow is limited by the default margin.\n */\n fullWidth: PropTypes.bool,\n\n /**\n * Determine the max-width of the dialog.\n * The dialog width grows with the size of the screen.\n * Set to `false` to disable `maxWidth`.\n */\n maxWidth: PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl', false]),\n\n /**\n * Callback fired when the backdrop is clicked.\n */\n onBackdropClick: PropTypes.func,\n\n /**\n * Callback fired when the component requests to be closed.\n *\n * @param {object} event The event source of the callback.\n * @param {string} reason Can be: `\"escapeKeyDown\"`, `\"backdropClick\"`.\n */\n onClose: PropTypes.func,\n\n /**\n * Callback fired before the dialog enters.\n */\n onEnter: PropTypes.func,\n\n /**\n * Callback fired when the dialog has entered.\n */\n onEntered: PropTypes.func,\n\n /**\n * Callback fired when the dialog is entering.\n */\n onEntering: PropTypes.func,\n\n /**\n * Callback fired when the escape key is pressed,\n * `disableKeyboard` is false and the modal is in focus.\n */\n onEscapeKeyDown: PropTypes.func,\n\n /**\n * Callback fired before the dialog exits.\n */\n onExit: PropTypes.func,\n\n /**\n * Callback fired when the dialog has exited.\n */\n onExited: PropTypes.func,\n\n /**\n * Callback fired when the dialog is exiting.\n */\n onExiting: PropTypes.func,\n\n /**\n * If `true`, the Dialog is open.\n */\n open: PropTypes.bool.isRequired,\n\n /**\n * The component used to render the body of the dialog.\n */\n PaperComponent: PropTypes.elementType,\n\n /**\n * Props applied to the [`Paper`](/api/paper/) element.\n */\n PaperProps: PropTypes.object,\n\n /**\n * Determine the container for scrolling the dialog.\n */\n scroll: PropTypes.oneOf(['body', 'paper']),\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 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 name: 'MuiDialog'\n})(Dialog);","export default {\n disabled: false\n};","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _inheritsLoose from \"@babel/runtime/helpers/esm/inheritsLoose\";\nimport PropTypes from 'prop-types';\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport config from './config';\nimport { timeoutsShape } from './utils/PropTypes';\nimport TransitionGroupContext from './TransitionGroupContext';\nexport var UNMOUNTED = 'unmounted';\nexport var EXITED = 'exited';\nexport var ENTERING = 'entering';\nexport var ENTERED = 'entered';\nexport var EXITING = 'exiting';\n/**\n * The Transition component lets you describe a transition from one component\n * state to another _over time_ with a simple declarative API. Most commonly\n * it's used to animate the mounting and unmounting of a component, but can also\n * be used to describe in-place transition states as well.\n *\n * ---\n *\n * **Note**: `Transition` is a platform-agnostic base component. If you're using\n * transitions in CSS, you'll probably want to use\n * [`CSSTransition`](https://reactcommunity.org/react-transition-group/css-transition)\n * instead. It inherits all the features of `Transition`, but contains\n * additional features necessary to play nice with CSS transitions (hence the\n * name of the component).\n *\n * ---\n *\n * By default the `Transition` component does not alter the behavior of the\n * component it renders, it only tracks \"enter\" and \"exit\" states for the\n * components. It's up to you to give meaning and effect to those states. For\n * example we can add styles to a component when it enters or exits:\n *\n * ```jsx\n * import { Transition } from 'react-transition-group';\n *\n * const duration = 300;\n *\n * const defaultStyle = {\n * transition: `opacity ${duration}ms ease-in-out`,\n * opacity: 0,\n * }\n *\n * const transitionStyles = {\n * entering: { opacity: 1 },\n * entered: { opacity: 1 },\n * exiting: { opacity: 0 },\n * exited: { opacity: 0 },\n * };\n *\n * const Fade = ({ in: inProp }) => (\n * \n * {state => (\n * \n * I'm a fade Transition!\n *
\n * )}\n * \n * );\n * ```\n *\n * There are 4 main states a Transition can be in:\n * - `'entering'`\n * - `'entered'`\n * - `'exiting'`\n * - `'exited'`\n *\n * Transition state is toggled via the `in` prop. When `true` the component\n * begins the \"Enter\" stage. During this stage, the component will shift from\n * its current transition state, to `'entering'` for the duration of the\n * transition and then to the `'entered'` stage once it's complete. Let's take\n * the following example (we'll use the\n * [useState](https://reactjs.org/docs/hooks-reference.html#usestate) hook):\n *\n * ```jsx\n * function App() {\n * const [inProp, setInProp] = useState(false);\n * return (\n * \n * \n * {state => (\n * // ...\n * )}\n * \n * setInProp(true)}>\n * Click to Enter\n * \n *
\n * );\n * }\n * ```\n *\n * When the button is clicked the component will shift to the `'entering'` state\n * and stay there for 500ms (the value of `timeout`) before it finally switches\n * to `'entered'`.\n *\n * When `in` is `false` the same thing happens except the state moves from\n * `'exiting'` to `'exited'`.\n */\n\nvar Transition =\n/*#__PURE__*/\nfunction (_React$Component) {\n _inheritsLoose(Transition, _React$Component);\n\n function Transition(props, context) {\n var _this;\n\n _this = _React$Component.call(this, props, context) || this;\n var parentGroup = context; // In the context of a TransitionGroup all enters are really appears\n\n var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear;\n var initialStatus;\n _this.appearStatus = null;\n\n if (props.in) {\n if (appear) {\n initialStatus = EXITED;\n _this.appearStatus = ENTERING;\n } else {\n initialStatus = ENTERED;\n }\n } else {\n if (props.unmountOnExit || props.mountOnEnter) {\n initialStatus = UNMOUNTED;\n } else {\n initialStatus = EXITED;\n }\n }\n\n _this.state = {\n status: initialStatus\n };\n _this.nextCallback = null;\n return _this;\n }\n\n Transition.getDerivedStateFromProps = function getDerivedStateFromProps(_ref, prevState) {\n var nextIn = _ref.in;\n\n if (nextIn && prevState.status === UNMOUNTED) {\n return {\n status: EXITED\n };\n }\n\n return null;\n }; // getSnapshotBeforeUpdate(prevProps) {\n // let nextStatus = null\n // if (prevProps !== this.props) {\n // const { status } = this.state\n // if (this.props.in) {\n // if (status !== ENTERING && status !== ENTERED) {\n // nextStatus = ENTERING\n // }\n // } else {\n // if (status === ENTERING || status === ENTERED) {\n // nextStatus = EXITING\n // }\n // }\n // }\n // return { nextStatus }\n // }\n\n\n var _proto = Transition.prototype;\n\n _proto.componentDidMount = function componentDidMount() {\n this.updateStatus(true, this.appearStatus);\n };\n\n _proto.componentDidUpdate = function componentDidUpdate(prevProps) {\n var nextStatus = null;\n\n if (prevProps !== this.props) {\n var status = this.state.status;\n\n if (this.props.in) {\n if (status !== ENTERING && status !== ENTERED) {\n nextStatus = ENTERING;\n }\n } else {\n if (status === ENTERING || status === ENTERED) {\n nextStatus = EXITING;\n }\n }\n }\n\n this.updateStatus(false, nextStatus);\n };\n\n _proto.componentWillUnmount = function componentWillUnmount() {\n this.cancelNextCallback();\n };\n\n _proto.getTimeouts = function getTimeouts() {\n var timeout = this.props.timeout;\n var exit, enter, appear;\n exit = enter = appear = timeout;\n\n if (timeout != null && typeof timeout !== 'number') {\n exit = timeout.exit;\n enter = timeout.enter; // TODO: remove fallback for next major\n\n appear = timeout.appear !== undefined ? timeout.appear : enter;\n }\n\n return {\n exit: exit,\n enter: enter,\n appear: appear\n };\n };\n\n _proto.updateStatus = function updateStatus(mounting, nextStatus) {\n if (mounting === void 0) {\n mounting = false;\n }\n\n if (nextStatus !== null) {\n // nextStatus will always be ENTERING or EXITING.\n this.cancelNextCallback();\n var node = ReactDOM.findDOMNode(this);\n\n if (nextStatus === ENTERING) {\n this.performEnter(node, mounting);\n } else {\n this.performExit(node);\n }\n } else if (this.props.unmountOnExit && this.state.status === EXITED) {\n this.setState({\n status: UNMOUNTED\n });\n }\n };\n\n _proto.performEnter = function performEnter(node, mounting) {\n var _this2 = this;\n\n var enter = this.props.enter;\n var appearing = this.context ? this.context.isMounting : mounting;\n var timeouts = this.getTimeouts();\n var enterTimeout = appearing ? timeouts.appear : timeouts.enter; // no enter animation skip right to ENTERED\n // if we are mounting and running this it means appear _must_ be set\n\n if (!mounting && !enter || config.disabled) {\n this.safeSetState({\n status: ENTERED\n }, function () {\n _this2.props.onEntered(node);\n });\n return;\n }\n\n this.props.onEnter(node, appearing);\n this.safeSetState({\n status: ENTERING\n }, function () {\n _this2.props.onEntering(node, appearing);\n\n _this2.onTransitionEnd(node, enterTimeout, function () {\n _this2.safeSetState({\n status: ENTERED\n }, function () {\n _this2.props.onEntered(node, appearing);\n });\n });\n });\n };\n\n _proto.performExit = function performExit(node) {\n var _this3 = this;\n\n var exit = this.props.exit;\n var timeouts = this.getTimeouts(); // no exit animation skip right to EXITED\n\n if (!exit || config.disabled) {\n this.safeSetState({\n status: EXITED\n }, function () {\n _this3.props.onExited(node);\n });\n return;\n }\n\n this.props.onExit(node);\n this.safeSetState({\n status: EXITING\n }, function () {\n _this3.props.onExiting(node);\n\n _this3.onTransitionEnd(node, timeouts.exit, function () {\n _this3.safeSetState({\n status: EXITED\n }, function () {\n _this3.props.onExited(node);\n });\n });\n });\n };\n\n _proto.cancelNextCallback = function cancelNextCallback() {\n if (this.nextCallback !== null) {\n this.nextCallback.cancel();\n this.nextCallback = null;\n }\n };\n\n _proto.safeSetState = function safeSetState(nextState, callback) {\n // This shouldn't be necessary, but there are weird race conditions with\n // setState callbacks and unmounting in testing, so always make sure that\n // we can cancel any pending setState callbacks after we unmount.\n callback = this.setNextCallback(callback);\n this.setState(nextState, callback);\n };\n\n _proto.setNextCallback = function setNextCallback(callback) {\n var _this4 = this;\n\n var active = true;\n\n this.nextCallback = function (event) {\n if (active) {\n active = false;\n _this4.nextCallback = null;\n callback(event);\n }\n };\n\n this.nextCallback.cancel = function () {\n active = false;\n };\n\n return this.nextCallback;\n };\n\n _proto.onTransitionEnd = function onTransitionEnd(node, timeout, handler) {\n this.setNextCallback(handler);\n var doesNotHaveTimeoutOrListener = timeout == null && !this.props.addEndListener;\n\n if (!node || doesNotHaveTimeoutOrListener) {\n setTimeout(this.nextCallback, 0);\n return;\n }\n\n if (this.props.addEndListener) {\n this.props.addEndListener(node, this.nextCallback);\n }\n\n if (timeout != null) {\n setTimeout(this.nextCallback, timeout);\n }\n };\n\n _proto.render = function render() {\n var status = this.state.status;\n\n if (status === UNMOUNTED) {\n return null;\n }\n\n var _this$props = this.props,\n children = _this$props.children,\n childProps = _objectWithoutPropertiesLoose(_this$props, [\"children\"]); // filter props for Transtition\n\n\n delete childProps.in;\n delete childProps.mountOnEnter;\n delete childProps.unmountOnExit;\n delete childProps.appear;\n delete childProps.enter;\n delete childProps.exit;\n delete childProps.timeout;\n delete childProps.addEndListener;\n delete childProps.onEnter;\n delete childProps.onEntering;\n delete childProps.onEntered;\n delete childProps.onExit;\n delete childProps.onExiting;\n delete childProps.onExited;\n\n if (typeof children === 'function') {\n // allows for nested Transitions\n return React.createElement(TransitionGroupContext.Provider, {\n value: null\n }, children(status, childProps));\n }\n\n var child = React.Children.only(children);\n return (// allows for nested Transitions\n React.createElement(TransitionGroupContext.Provider, {\n value: null\n }, React.cloneElement(child, childProps))\n );\n };\n\n return Transition;\n}(React.Component);\n\nTransition.contextType = TransitionGroupContext;\nTransition.propTypes = process.env.NODE_ENV !== \"production\" ? {\n /**\n * A `function` child can be used instead of a React element. This function is\n * called with the current transition status (`'entering'`, `'entered'`,\n * `'exiting'`, `'exited'`), which can be used to apply context\n * specific props to a component.\n *\n * ```jsx\n * \n * {state => (\n * \n * )}\n * \n * ```\n */\n children: PropTypes.oneOfType([PropTypes.func.isRequired, PropTypes.element.isRequired]).isRequired,\n\n /**\n * Show the component; triggers the enter or exit states\n */\n in: PropTypes.bool,\n\n /**\n * By default the child component is mounted immediately along with\n * the parent `Transition` component. If you want to \"lazy mount\" the component on the\n * first `in={true}` you can set `mountOnEnter`. After the first enter transition the component will stay\n * mounted, even on \"exited\", unless you also specify `unmountOnExit`.\n */\n mountOnEnter: PropTypes.bool,\n\n /**\n * By default the child component stays mounted after it reaches the `'exited'` state.\n * Set `unmountOnExit` if you'd prefer to unmount the component after it finishes exiting.\n */\n unmountOnExit: PropTypes.bool,\n\n /**\n * Normally a component is not transitioned if it is shown when the\n * `` component mounts. If you want to transition on the first\n * mount set `appear` to `true`, and the component will transition in as soon\n * as the `` mounts.\n *\n * > **Note**: there are no special appear states like `appearing`/`appeared`, this prop\n * > only adds an additional enter transition. However, in the\n * > `` component that first enter transition does result in\n * > additional `.appear-*` classes, that way you can choose to style it\n * > differently.\n */\n appear: PropTypes.bool,\n\n /**\n * Enable or disable enter transitions.\n */\n enter: PropTypes.bool,\n\n /**\n * Enable or disable exit transitions.\n */\n exit: PropTypes.bool,\n\n /**\n * The duration of the transition, in milliseconds.\n * Required unless `addEndListener` is provided.\n *\n * You may specify a single timeout for all transitions:\n *\n * ```jsx\n * timeout={500}\n * ```\n *\n * or individually:\n *\n * ```jsx\n * timeout={{\n * appear: 500,\n * enter: 300,\n * exit: 500,\n * }}\n * ```\n *\n * - `appear` defaults to the value of `enter`\n * - `enter` defaults to `0`\n * - `exit` defaults to `0`\n *\n * @type {number | { enter?: number, exit?: number, appear?: number }}\n */\n timeout: function timeout(props) {\n var pt = timeoutsShape;\n if (!props.addEndListener) pt = pt.isRequired;\n\n for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {\n args[_key - 1] = arguments[_key];\n }\n\n return pt.apply(void 0, [props].concat(args));\n },\n\n /**\n * Add a custom transition end trigger. Called with the transitioning\n * DOM node and a `done` callback. Allows for more fine grained transition end\n * logic. **Note:** Timeouts are still used as a fallback if provided.\n *\n * ```jsx\n * addEndListener={(node, done) => {\n * // use the css transitionend event to mark the finish of a transition\n * node.addEventListener('transitionend', done, false);\n * }}\n * ```\n */\n addEndListener: PropTypes.func,\n\n /**\n * Callback fired before the \"entering\" status is applied. An extra parameter\n * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount\n *\n * @type Function(node: HtmlElement, isAppearing: bool) -> void\n */\n onEnter: PropTypes.func,\n\n /**\n * Callback fired after the \"entering\" status is applied. An extra parameter\n * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount\n *\n * @type Function(node: HtmlElement, isAppearing: bool)\n */\n onEntering: PropTypes.func,\n\n /**\n * Callback fired after the \"entered\" status is applied. An extra parameter\n * `isAppearing` is supplied to indicate if the enter stage is occurring on the initial mount\n *\n * @type Function(node: HtmlElement, isAppearing: bool) -> void\n */\n onEntered: PropTypes.func,\n\n /**\n * Callback fired before the \"exiting\" status is applied.\n *\n * @type Function(node: HtmlElement) -> void\n */\n onExit: PropTypes.func,\n\n /**\n * Callback fired after the \"exiting\" status is applied.\n *\n * @type Function(node: HtmlElement) -> void\n */\n onExiting: PropTypes.func,\n\n /**\n * Callback fired after the \"exited\" status is applied.\n *\n * @type Function(node: HtmlElement) -> void\n */\n onExited: PropTypes.func // Name the function so it is clearer in the documentation\n\n} : {};\n\nfunction noop() {}\n\nTransition.defaultProps = {\n in: false,\n mountOnEnter: false,\n unmountOnExit: false,\n appear: false,\n enter: true,\n exit: true,\n onEnter: noop,\n onEntering: noop,\n onEntered: noop,\n onExit: noop,\n onExiting: noop,\n onExited: noop\n};\nTransition.UNMOUNTED = 0;\nTransition.EXITED = 1;\nTransition.ENTERING = 2;\nTransition.ENTERED = 3;\nTransition.EXITING = 4;\nexport default Transition;"],"sourceRoot":""}
\ No newline at end of file
diff --git a/app/bin/main/public/static/js/main.4ee489f9.chunk.js b/app/bin/main/public/static/js/main.4ee489f9.chunk.js
new file mode 100644
index 0000000..b26cd98
--- /dev/null
+++ b/app/bin/main/public/static/js/main.4ee489f9.chunk.js
@@ -0,0 +1,2 @@
+(this.webpackJsonpfrontend=this.webpackJsonpfrontend||[]).push([[0],{70:function(e,t,a){e.exports=a(97)},75:function(e,t,a){},93:function(e,t,a){},97:function(e,t,a){"use strict";a.r(t);var n=a(0),o=a.n(n),l=a(8),r=a.n(l),c=(a(75),a(149)),s=a(148),i=a(44),u=a(61),m=Object(u.a)({palette:{primary:{main:"#556cd6"},secondary:{main:"#19857b"},error:{main:i.a.A400},background:{default:"#fff"}}}),p=a(15),d=a(12),h=a(19),f=a(20),k=a(24),b=a(16),g=a.n(b),E=a(4),v=a(135),S=a(63),y=(a(93),a(11)),C=a(150),j=a(151),O=a(138),P=function(e){function t(){var e,a;Object(p.a)(this,t);for(var n=arguments.length,o=new Array(n),l=0;l0},a}return Object(k.a)(t,e),Object(d.a)(t,[{key:"render",value:function(){return o.a.createElement(v.a,{className:this.props.classes.PalletProductionPaper},o.a.createElement(S.a,{color:"textSecondary",variant:"button",gutterBottom:!0},"Production"),o.a.createElement("form",null,o.a.createElement(O.a,{container:!0,direction:"row",justify:"flex-start",alignItems:"flex-end"},o.a.createElement(C.a,{style:{minWidth:"140px"},id:"cookie",select:!0,label:"Select Cookie",value:this.state.cookie,onChange:this.handleInputChange,name:"cookie",SelectProps:{native:!0}},o.a.createElement("option",{value:""}),this.props.cookies.map((function(e){return o.a.createElement("option",{key:e.name,value:e.name},e.name)}))),o.a.createElement(j.a,{style:{marginLeft:"10px"},variant:"contained",onClick:this.handleSubmit,disabled:!this.isFormValid()},"Produce pallet!"))))}}]),t}(n.Component),x=Object(E.a)((function(e){return{PalletProductionPaper:{padding:"10px",marginBottom:"15px"}}}))(P),w=function(e){function t(){var e,a;Object(p.a)(this,t);for(var n=arguments.length,o=new Array(n),l=0;l0})).forEach((function(a){return t[a]=e[a]})),g.a.get("pallets",{params:t}).then((function(e){console.log(e),e.data&&e.data.pallets?a.setState({pallets:e.data.pallets,palletStatus:e.data.pallets&&0!==e.data.pallets.length?"":"Pallet request success, but no pallets returned from API."}):a.setState({palletStatus:"Couldn't fetch pallets from REST server"})})).catch((function(e){console.log(e),a.setState({disconnected:!0})}))},a.setStatus=function(e){a.setState({status:e})},a.setPalletsFilter=function(e){a.setState({palletsFilter:e}),a.fetchPallets(e)},a.mainArea=function(){return o.a.createElement("div",null,o.a.createElement(x,{cookies:a.state.cookies,refresh:a.refresh,setStatus:a.setStatus}),o.a.createElement(B,{cookies:a.state.cookies,pallets:a.state.pallets,palletsFilter:a.setPalletsFilter}),o.a.createElement(q,{refresh:a.refresh,setStatus:a.setStatus}))},a}return Object(k.a)(t,e),Object(d.a)(t,[{key:"componentDidMount",value:function(){this.refresh()}},{key:"render",value:function(){var e=[this.state.cookieStatus,this.state.palletStatus].join(" - ");this.state.disconnected&&(e=o.a.createElement("b",null,"Disconnected. Couldn't connect to REST server (",g.a.defaults.baseURL,")"));var t=null;return this.state.disconnected||(t=this.mainArea()),o.a.createElement("div",{className:"App"},o.a.createElement(S.a,{variant:"h3",gutterBottom:!0},"Krusty"),o.a.createElement(v.a,{className:this.props.classes.StatusPaper},o.a.createElement("div",null,o.a.createElement("b",null,"Status:")," ",e)),t)}}]),t}(n.Component),U=Object(E.a)((function(e){return{StatusPaper:{padding:"10px",marginBottom:"15px"}}}))(J);Boolean("localhost"===window.location.hostname||"[::1]"===window.location.hostname||window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/));g.a.defaults.baseURL="/api/v1",r.a.render(o.a.createElement(s.a,{theme:m},o.a.createElement(c.a,null),o.a.createElement(U,null)),document.getElementById("root")),"serviceWorker"in navigator&&navigator.serviceWorker.ready.then((function(e){e.unregister()})).catch((function(e){console.error(e.message)}))}},[[70,1,2]]]);
+//# sourceMappingURL=main.4ee489f9.chunk.js.map
\ No newline at end of file
diff --git a/app/bin/main/public/static/js/main.4ee489f9.chunk.js.map b/app/bin/main/public/static/js/main.4ee489f9.chunk.js.map
new file mode 100644
index 0000000..7e3e0e1
--- /dev/null
+++ b/app/bin/main/public/static/js/main.4ee489f9.chunk.js.map
@@ -0,0 +1 @@
+{"version":3,"sources":["theme.js","PalletProduction.js","PalletTableFilter.js","PalletTable.js","ResetDatabase.js","App.js","serviceWorker.js","index.js"],"names":["theme","createMuiTheme","palette","primary","main","secondary","error","red","A400","background","default","PalletProduction","state","cookie","handleInputChange","e","setState","target","name","value","handleSubmit","preventDefault","isFormValid","params","axios","post","then","res","console","log","data","id","message","props","setStatus","alert","status","refresh","catch","length","Paper","className","this","classes","PalletProductionPaper","Typography","color","variant","gutterBottom","Grid","container","direction","justify","alignItems","TextField","style","minWidth","select","label","onChange","SelectProps","native","cookies","map","c","key","Button","marginLeft","onClick","disabled","Component","withStyles","padding","marginBottom","PalletTableFilter","from","to","blocked","palletsFilter","handleClear","paddingLeft","marginTop","type","InputLabelProps","shrink","root","width","overflowX","table","header","Table","TableHead","TableRow","TableCell","TableBody","pallets","p","customer","component","scope","production_date","ResetDatabase","open","openDialog","closeDialog","resetDatabase","response","Dialog","onClose","aria-labelledby","aria-describedby","DialogTitle","DialogContent","DialogContentText","DialogActions","autoFocus","App","disconnected","cookieStatus","palletStatus","fetchCookies","fetchPallets","get","filter","Object","keys","k","forEach","setPalletsFilter","mainArea","statusMessage","join","defaults","baseURL","StatusPaper","Boolean","window","location","hostname","match","ReactDOM","render","ThemeProvider","CssBaseline","document","getElementById","navigator","serviceWorker","ready","registration","unregister"],"mappings":"wQAqBeA,EAjBDC,YAAe,CAC3BC,QAAS,CACPC,QAAS,CACPC,KAAM,WAERC,UAAW,CACTD,KAAM,WAERE,MAAO,CACLF,KAAMG,IAAIC,MAEZC,WAAY,CACVC,QAAS,W,4HCNTC,E,2MACJC,MAAQ,CACNC,OAAQ,I,EAGVC,kBAAoB,SAACC,GACnB,EAAKC,SAAL,eACGD,EAAEE,OAAOC,KAAOH,EAAEE,OAAOE,S,EAI9BC,aAAe,SAACL,GAEd,GADAA,EAAEM,iBACE,EAAKC,cAAe,CACtB,IAAMT,EAAS,EAAKD,MAAMC,OACpBU,EAAS,CAACV,OAAQA,GACxBW,IAAMC,KAAK,UAAW,KAAM,CAACF,OAAQA,IAClCG,MAAK,SAAAC,GAEJ,GADAC,QAAQC,IAAIF,GACRA,EAAIG,KAAKC,GAAI,CACf,IAAMC,EAAU,eAAiBnB,EAC7B,yBAA2Bc,EAAIG,KAAKC,GACxC,EAAKE,MAAMC,UAAUF,QAErBG,MAAM,qBAAuBR,EAAIG,KAAKM,OAClC,gCAEN,EAAKH,MAAMI,aAEZC,OAAM,SAAAhC,GACL6B,MAAM,gDACNP,QAAQC,IAAIvB,MAEhB,EAAKU,SAAS,CAACH,OAAQ,O,EAI3BS,YAAc,kBAAM,EAAKV,MAAMC,OAAO0B,OAAS,G,wEAG7C,OACE,kBAACC,EAAA,EAAD,CAAOC,UAAWC,KAAKT,MAAMU,QAAQC,uBACnC,kBAACC,EAAA,EAAD,CAAYC,MAAM,gBAAgBC,QAAQ,SAASC,cAAY,GAA/D,cAGA,8BACE,kBAACC,EAAA,EAAD,CACEC,WAAS,EACTC,UAAU,MACVC,QAAQ,aACRC,WAAW,YACX,kBAACC,EAAA,EAAD,CACEC,MAAO,CAACC,SAAU,SAClBzB,GAAG,SACH0B,QAAM,EACNC,MAAM,gBACNvC,MAAOuB,KAAK9B,MAAMC,OAClB8C,SAAUjB,KAAK5B,kBACfI,KAAK,SACL0C,YAAa,CACXC,QAAQ,IAEV,4BAAQ1C,MAAM,KACbuB,KAAKT,MAAM6B,QAAQC,KAAI,SAAAC,GAAC,OACvB,4BAAQC,IAAKD,EAAE9C,KAAMC,MAAO6C,EAAE9C,MAAO8C,EAAE9C,UAG3C,kBAACgD,EAAA,EAAD,CACIX,MAAO,CAACY,WAAY,QACpBpB,QAAQ,YACRqB,QAAS1B,KAAKtB,aACdiD,UAAW3B,KAAKpB,eAJpB,0B,GAnEmBgD,aAwFhBC,eAPA,SAAAvE,GAAK,MAAK,CACvB4C,sBAAuB,CACrB4B,QAAS,OACTC,aAAc,WAIHF,CAAmB5D,GCcnB+D,E,2MAlGb9D,MAR0B,CAC1BC,OAAQ,GACR8D,KAAM,GACNC,GAAI,GACJC,QAAS,I,EAMT/D,kBAAoB,SAACC,GACnB,EAAKC,SAAL,eACGD,EAAEE,OAAOC,KAAOH,EAAEE,OAAOE,S,EAI9BC,aAAe,WACb,EAAKa,MAAM6C,cAAc,EAAKlE,Q,EAGhCmE,YAAc,WACZ,EAAK/D,SArBmB,CAC1BH,OAAQ,GACR8D,KAAM,GACNC,GAAI,GACJC,QAAS,KAkBP,EAAK5C,MAAM6C,cAAc,K,wEAIzB,OACE,0BAAMvB,MAAO,CAACyB,YAAa,OAAQP,aAAc,OAAQQ,UAAU,QACjE,kBAAChC,EAAA,EAAD,CACEC,WAAS,EACTC,UAAU,MACVC,QAAQ,aACRC,WAAW,YACX,kBAACC,EAAA,EAAD,CACEC,MAAO,CAACC,SAAU,SAClBzB,GAAG,SACH0B,QAAM,EACNC,MAAM,gBACNvC,MAAOuB,KAAK9B,MAAMC,OAClB8C,SAAUjB,KAAK5B,kBACfI,KAAK,SACL0C,YAAa,CACXC,QAAQ,IAEV,4BAAQ1C,MAAM,KACbuB,KAAKT,MAAM6B,QAAQC,KAAI,SAAAC,GAAC,OACvB,4BAAQC,IAAKD,EAAE9C,KAAMC,MAAO6C,EAAE9C,MAAO8C,EAAE9C,UAG3C,kBAACoC,EAAA,EAAD,CACEC,MAAO,CAACY,WAAY,QACpBpC,GAAG,OACH2B,MAAM,OACNwB,KAAK,OACL/D,MAAOuB,KAAK9B,MAAM+D,KAClBhB,SAAUjB,KAAK5B,kBACfI,KAAK,OACLiE,gBAAiB,CACfC,QAAQ,KAGZ,kBAAC9B,EAAA,EAAD,CACEC,MAAO,CAACY,WAAY,QACpBpC,GAAG,KACH2B,MAAM,KACNwB,KAAK,OACL/D,MAAOuB,KAAK9B,MAAMgE,GAClBjB,SAAUjB,KAAK5B,kBACfI,KAAK,KACLiE,gBAAiB,CACfC,QAAQ,KAGZ,kBAAC9B,EAAA,EAAD,CACEC,MAAO,CAACY,WAAY,OAAQX,SAAU,QACtCzB,GAAG,UACH0B,QAAM,EACNC,MAAM,WACNvC,MAAOuB,KAAK9B,MAAMiE,QAClBlB,SAAUjB,KAAK5B,kBACfI,KAAK,UACL0C,YAAa,CACXC,QAAQ,IAEV,4BAAQ1C,MAAM,KACd,4BAAQA,MAAM,OAAd,OACA,4BAAQA,MAAM,MAAd,OAEF,kBAAC+C,EAAA,EAAD,CACIX,MAAO,CAACY,WAAY,QACpBpB,QAAQ,YACRqB,QAAS1B,KAAKtB,cAHlB,UAMA,kBAAC8C,EAAA,EAAD,CACIX,MAAO,CAACY,WAAY,QACpBpB,QAAQ,YACRqB,QAAS1B,KAAKqC,aAHlB,e,GAvFsBT,a,6CC2DjBC,mBA1DA,SAAAvE,GAAK,MAAK,CACvBqF,KAAM,CACJC,MAAO,OACPC,UAAW,QAEbC,MAAO,CACLhC,SAAU,KAEZiC,OAAQ,CACNtB,WAAY,OACZc,UAAW,WAgDAV,EA5Cf,SAAqBtC,GAAQ,IACnBU,EAAYV,EAAZU,QAER,OACE,kBAACH,EAAA,EAAD,CAAOC,UAAWE,EAAQ0C,MACxB,kBAACxC,EAAA,EAAD,CAAYJ,UAAWE,EAAQ8C,OAAQ3C,MAAM,gBAAgBC,QAAQ,SAASC,cAAY,GAA1F,oBAGA,kBAAC,EAAD,CACEc,QAAS7B,EAAM6B,QACfgB,cAAe7C,EAAM6C,gBACvB,kBAACY,EAAA,EAAD,CAAOjD,UAAWE,EAAQ6C,OACxB,kBAACG,EAAA,EAAD,KACE,kBAACC,EAAA,EAAD,KACE,kBAACC,EAAA,EAAD,aACA,kBAACA,EAAA,EAAD,wBACA,kBAACA,EAAA,EAAD,iBACA,kBAACA,EAAA,EAAD,kBAGJ,kBAACC,EAAA,EAAD,KACG7D,EAAM8D,QAAQhC,KAAI,SAAAiC,GACjB,IAAMC,EAAYD,EAAEC,UAA2B,SAAfD,EAAEC,SAA2BD,EAAEC,SAAP,GACxD,OACE,kBAACL,EAAA,EAAD,CAAU3B,IAAK+B,EAAEjE,IACf,kBAAC8D,EAAA,EAAD,CAAWK,UAAU,KAAKC,MAAM,OAC7BH,EAAEnF,QAEL,kBAACgF,EAAA,EAAD,KAAYG,EAAEI,iBACd,kBAACP,EAAA,EAAD,KAAYI,GACZ,kBAACJ,EAAA,EAAD,KAAYG,EAAEnB,mB,6CCSfwB,E,2MAzDbzF,MAAQ,CACN0F,MAAM,G,EAGRC,WAAa,WACX,EAAKvF,SAAS,CAACsF,MAAM,K,EAGvBE,YAAc,WACZ,EAAKxF,SAAS,CAACsF,MAAM,K,EAGvBG,cAAgB,WACd,EAAKD,cACLhF,IAAMC,KAAK,QAAS,IACjBC,MAAK,SAAAgF,GACJ9E,QAAQC,IAAI6E,GACZ,EAAKzE,MAAMI,UACX,EAAKJ,MAAMC,UAAU,gCAEtBI,OAAM,SAAAhC,GACL6B,MAAM,kCACNP,QAAQC,IAAIvB,O,wEAKhB,OACE,2BACE,kBAAC4D,EAAA,EAAD,CAAQnB,QAAQ,YAAYqB,QAAS1B,KAAK6D,YAA1C,kBAGA,kBAACI,EAAA,EAAD,CACEL,KAAM5D,KAAK9B,MAAM0F,KACjBM,QAASlE,KAAK8D,YACdK,kBAAgB,qBAChBC,mBAAiB,4BACjB,kBAACC,EAAA,EAAD,CAAahF,GAAG,sBAAsB,mBACtC,kBAACiF,EAAA,EAAD,KACE,kBAACC,EAAA,EAAD,CAAmBlF,GAAG,4BAAtB,uCAIF,kBAACmF,EAAA,EAAD,KACE,kBAAChD,EAAA,EAAD,CAAQE,QAAS1B,KAAK+D,cAAe3D,MAAM,WAA3C,OAGA,kBAACoB,EAAA,EAAD,CAAQE,QAAS1B,KAAK8D,YAAa1D,MAAM,UAAUqE,WAAS,GAA5D,a,GAhDgB7C,aCGtB8C,E,2MACJxG,MAAQ,CACNkD,QAAS,GACTiC,QAAS,GACTjB,cAAe,GACfuC,cAAc,EACdC,aAAc,GACdC,aAAc,I,EAOhBlF,QAAU,WACR,EAAKmF,eACL,EAAKC,aAAa,EAAK7G,MAAMkE,gB,EAG/B0C,aAAe,WACbhG,IAAMkG,IAAI,WACPhG,MAAK,SAAAC,GACAA,EAAIG,MAAQH,EAAIG,KAAKgC,QACvB,EAAK9C,SAAS,CAAE8C,QAASnC,EAAIG,KAAKgC,QAASwD,aAAgB3F,EAAIG,KAAKgC,SAAuC,IAA5BnC,EAAIG,KAAKgC,QAAQvB,OAA4E,GAA5D,6DAEhH,EAAKvB,SAAS,CAAEsG,aAAc,+CAGjChF,OAAM,SAAAhC,GACLsB,QAAQC,IAAIvB,GACZ,EAAKU,SAAS,CAACqG,cAAc,Q,EAInCI,aAAe,SAACE,GAEd,IAAIpG,EAAS,GACbqG,OAAOC,KAAKF,GACTA,QAAO,SAAAG,GAAC,OAAIH,EAAOG,GAAGvF,OAAS,KAC/BwF,SAAQ,SAAAD,GAAC,OAAIvG,EAAOuG,GAAKH,EAAOG,MAEnCtG,IAAMkG,IAAI,UAAW,CAACnG,OAAQA,IAC3BG,MAAK,SAAAC,GACJC,QAAQC,IAAIF,GACRA,EAAIG,MAAQH,EAAIG,KAAKiE,QACvB,EAAK/E,SAAS,CAAE+E,QAASpE,EAAIG,KAAKiE,QAASwB,aAAgB5F,EAAIG,KAAKiE,SAAuC,IAA5BpE,EAAIG,KAAKiE,QAAQxD,OAA6E,GAA7D,8DAEhH,EAAKvB,SAAS,CAAEuG,aAAc,+CAGjCjF,OAAM,SAAAhC,GACLsB,QAAQC,IAAIvB,GACZ,EAAKU,SAAS,CAACqG,cAAc,Q,EAInCnF,UAAY,SAACF,GACX,EAAKhB,SAAS,CAACoB,OAAQJ,K,EAGzBgG,iBAAmB,SAACL,GAClB,EAAK3G,SAAS,CAAC8D,cAAe6C,IAC9B,EAAKF,aAAaE,I,EAGpBM,SAAW,kBACT,6BACE,kBAAC,EAAD,CACEnE,QAAS,EAAKlD,MAAMkD,QACpBzB,QAAS,EAAKA,QACdH,UAAW,EAAKA,YAClB,kBAAC,EAAD,CACE4B,QAAS,EAAKlD,MAAMkD,QACpBiC,QAAS,EAAKnF,MAAMmF,QACpBjB,cAAe,EAAKkD,mBACtB,kBAAC,EAAD,CACE3F,QAAS,EAAKA,QACdH,UAAW,EAAKA,c,mFAlEpBQ,KAAKL,Y,+BAuEL,IAAI6F,EAAgB,CAACxF,KAAK9B,MAAM0G,aAAc5E,KAAK9B,MAAM2G,cAAcY,KAAK,OACxEzF,KAAK9B,MAAMyG,eACba,EACE,6EAAmD1G,IAAM4G,SAASC,QAAlE,MAIJ,IAAIjI,EAAO,KAKX,OAJKsC,KAAK9B,MAAMyG,eACdjH,EAAOsC,KAAKuF,YAIZ,yBAAKxF,UAAU,OACb,kBAACI,EAAA,EAAD,CAAYE,QAAQ,KAAKC,cAAY,GAArC,UAIA,kBAACR,EAAA,EAAD,CAAOC,UAAWC,KAAKT,MAAMU,QAAQ2F,aACnC,6BACE,sCADF,IACkBJ,IAInB9H,O,GA1GSkE,aAwHHC,eAPA,SAAAvE,GAAK,MAAK,CACvBsI,YAAa,CACX9D,QAAS,OACTC,aAAc,WAIHF,CAAmB6C,GCxHdmB,QACW,cAA7BC,OAAOC,SAASC,UAEe,UAA7BF,OAAOC,SAASC,UAEhBF,OAAOC,SAASC,SAASC,MACvB,2DCNNnH,IAAM4G,SAASC,QAAU,UAEzBO,IAASC,OACT,kBAACC,EAAA,EAAD,CAAe9I,MAAOA,GAElB,kBAAC+I,EAAA,EAAD,MACA,kBAAC,EAAD,OACgBC,SAASC,eAAe,SDgHtC,kBAAmBC,WACrBA,UAAUC,cAAcC,MACrB1H,MAAK,SAAA2H,GACJA,EAAaC,gBAEdhH,OAAM,SAAAhC,GACLsB,QAAQtB,MAAMA,EAAM0B,c","file":"static/js/main.4ee489f9.chunk.js","sourcesContent":["import { red } from '@material-ui/core/colors';\nimport { createMuiTheme } from '@material-ui/core/styles';\n\n// A custom theme for this app\nconst theme = createMuiTheme({\n palette: {\n primary: {\n main: '#556cd6',\n },\n secondary: {\n main: '#19857b',\n },\n error: {\n main: red.A400,\n },\n background: {\n default: '#fff',\n },\n },\n});\n\nexport default theme;","import React, { Component } from 'react';\nimport axios from 'axios';\n\nimport TextField from '@material-ui/core/TextField';\nimport Button from '@material-ui/core/Button';\nimport Grid from '@material-ui/core/Grid';\nimport Typography from '@material-ui/core/Typography';\nimport { withStyles } from '@material-ui/core/styles';\nimport Paper from '@material-ui/core/Paper';\n\nclass PalletProduction extends Component {\n state = {\n cookie: \"\",\n }\n\n handleInputChange = (e) => {\n this.setState({\n [e.target.name]: e.target.value\n });\n }\n\n handleSubmit = (e) => {\n e.preventDefault();\n if (this.isFormValid()) {\n const cookie = this.state.cookie\n const params = {cookie: cookie}\n axios.post('pallets', null, {params: params})\n .then(res => {\n console.log(res);\n if (res.data.id) {\n const message = \"A pallet of \" + cookie\n + \" was produced with id \" + res.data.id;\n this.props.setStatus(message)\n } else {\n alert('An error occured: ' + res.data.status\n + '. See console for more info.');\n }\n this.props.refresh();\n })\n .catch(error => {\n alert('An error occured. See console for more info.');\n console.log(error);\n });\n this.setState({cookie: \"\"});\n }\n }\n\n isFormValid = () => this.state.cookie.length > 0;\n\n render() {\n return (\n \n \n Production\n \n \n \n );\n }\n}\n\nconst styles = theme => ({\n PalletProductionPaper: {\n padding: \"10px\",\n marginBottom: \"15px\"\n }\n});\n\nexport default withStyles(styles)(PalletProduction);\n","import React, { Component } from 'react';\n\nimport TextField from '@material-ui/core/TextField';\nimport Button from '@material-ui/core/Button';\nimport Grid from '@material-ui/core/Grid';\n\nconst initialState = () => ({\n cookie: \"\",\n from: \"\",\n to: \"\",\n blocked: \"\"\n})\n\nclass PalletTableFilter extends Component {\n state = initialState()\n\n handleInputChange = (e) => {\n this.setState({\n [e.target.name]: e.target.value\n });\n }\n\n handleSubmit = () => {\n this.props.palletsFilter(this.state);\n }\n\n handleClear = () => {\n this.setState(initialState());\n this.props.palletsFilter({ });\n }\n\n render() {\n return (\n \n );\n }\n}\n\nexport default(PalletTableFilter);\n","import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport PalletTableFilter from './PalletTableFilter'\n\nimport { withStyles } from '@material-ui/core/styles';\nimport Table from '@material-ui/core/Table';\nimport TableBody from '@material-ui/core/TableBody';\nimport TableCell from '@material-ui/core/TableCell';\nimport TableHead from '@material-ui/core/TableHead';\nimport TableRow from '@material-ui/core/TableRow';\nimport Paper from '@material-ui/core/Paper';\nimport Typography from '@material-ui/core/Typography';\n\nconst styles = theme => ({\n root: {\n width: '100%',\n overflowX: 'auto',\n },\n table: {\n minWidth: 400,\n },\n header: {\n marginLeft: '10px',\n marginTop: '10px'\n }\n});\n\nfunction PalletTable(props) {\n const { classes } = props;\n\n return (\n \n \n Produced Pallets\n \n \n \n \n \n Name \n Production date \n Customer \n Blocked \n \n \n \n {props.pallets.map(p => {\n const customer = !p.customer || p.customer === 'null' ? '' : p.customer;\n return (\n \n \n {p.cookie}\n \n {p.production_date} \n {customer} \n {p.blocked} \n \n );\n })}\n \n
\n \n );\n}\n\nPalletTable.propTypes = {\n classes: PropTypes.object.isRequired,\n};\n\nexport default withStyles(styles)(PalletTable);\n","import React, { Component } from 'react';\nimport axios from 'axios';\nimport Button from '@material-ui/core/Button';\nimport Dialog from '@material-ui/core/Dialog';\nimport DialogActions from '@material-ui/core/DialogActions';\nimport DialogContent from '@material-ui/core/DialogContent';\nimport DialogContentText from '@material-ui/core/DialogContentText';\nimport DialogTitle from '@material-ui/core/DialogTitle';\n\nclass ResetDatabase extends Component {\n state = {\n open: false\n }\n\n openDialog = () => {\n this.setState({open: true})\n }\n\n closeDialog = () => {\n this.setState({open: false})\n }\n\n resetDatabase = () => {\n this.closeDialog();\n axios.post('reset', {})\n .then(response => {\n console.log(response);\n this.props.refresh();\n this.props.setStatus(\"The database was restored\");\n })\n .catch(error => {\n alert('An error occured. See console.');\n console.log(error);\n });\n }\n\n render() {\n return (\n \n \n Reset database\n \n \n {\"Reset database?\"} \n \n \n Do you want do reset the database?\n \n \n \n \n Yes\n \n \n No\n \n \n \n
\n );\n }\n}\n\nexport default ResetDatabase;\n","import React, { Component } from 'react';\nimport axios from 'axios';\n\nimport { withStyles } from '@material-ui/core/styles';\nimport Paper from '@material-ui/core/Paper';\nimport Typography from '@material-ui/core/Typography';\n\nimport './App.css';\nimport PalletProduction from './PalletProduction';\nimport PalletTable from './PalletTable'\nimport ResetDatabase from './ResetDatabase';\n\nclass App extends Component {\n state = {\n cookies: [],\n pallets: [],\n palletsFilter: {},\n disconnected: false,\n cookieStatus: \"\",\n palletStatus: \"\"\n }\n\n componentDidMount() {\n this.refresh();\n }\n\n refresh = () => {\n this.fetchCookies();\n this.fetchPallets(this.state.palletsFilter);\n }\n\n fetchCookies = () => {\n axios.get(\"cookies\")\n .then(res => {\n if (res.data && res.data.cookies) {\n this.setState({ cookies: res.data.cookies, cookieStatus: (!res.data.cookies || res.data.cookies.length === 0) ? \"Cookie request success, but no cookies returned from API\": \"\"});\n } else {\n this.setState({ cookieStatus: \"Couldn't fetch cookies from REST server\"});\n }\n })\n .catch(error => {\n console.log(error);\n this.setState({disconnected: true})\n });\n }\n\n fetchPallets = (filter) => {\n // Only apply filters that are non-empty\n let params = {}\n Object.keys(filter)\n .filter(k => filter[k].length > 0)\n .forEach(k => params[k] = filter[k])\n\n axios.get(\"pallets\", {params: params})\n .then(res => {\n console.log(res);\n if (res.data && res.data.pallets) {\n this.setState({ pallets: res.data.pallets, palletStatus: (!res.data.pallets || res.data.pallets.length === 0) ? \"Pallet request success, but no pallets returned from API.\": \"\" });\n } else {\n this.setState({ palletStatus: \"Couldn't fetch pallets from REST server\"});\n }\n })\n .catch(error => {\n console.log(error);\n this.setState({disconnected: true})\n });\n }\n\n setStatus = (message) => {\n this.setState({status: message});\n }\n\n setPalletsFilter = (filter) => {\n this.setState({palletsFilter: filter});\n this.fetchPallets(filter);\n }\n\n mainArea = () => (\n \n )\n\n render() {\n let statusMessage = [this.state.cookieStatus, this.state.palletStatus].join(\" - \");\n if (this.state.disconnected) {\n statusMessage = (\n Disconnected. Couldn't connect to REST server ({axios.defaults.baseURL}) \n )\n }\n\n let main = null;\n if (!this.state.disconnected) {\n main = this.mainArea();\n }\n\n return (\n \n
\n Krusty\n \n\n
\n \n Status: {statusMessage}\n
\n \n\n {main}\n
\n );\n }\n\n}\n\nconst styles = theme => ({\n StatusPaper: {\n padding: \"10px\",\n marginBottom: \"15px\"\n }\n});\n\nexport default withStyles(styles)(App);\n","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read https://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.0/8 are considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n);\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return;\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config);\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit https://bit.ly/CRA-PWA'\n );\n });\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config);\n }\n });\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl)\n .then(registration => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing;\n if (installingWorker == null) {\n return;\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See https://bit.ly/CRA-PWA.'\n );\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration);\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.');\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration);\n }\n }\n }\n };\n };\n })\n .catch(error => {\n console.error('Error during service worker registration:', error);\n });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl, {\n headers: { 'Service-Worker': 'script' }\n })\n .then(response => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type');\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister().then(() => {\n window.location.reload();\n });\n });\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config);\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n );\n });\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready\n .then(registration => {\n registration.unregister();\n })\n .catch(error => {\n console.error(error.message);\n });\n }\n}\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.css';\nimport CssBaseline from '@material-ui/core/CssBaseline';\nimport { ThemeProvider } from '@material-ui/core/styles'\nimport theme from './theme';\n\nimport App from './App';\nimport * as serviceWorker from './serviceWorker';\n\nimport axios from 'axios';\n\naxios.defaults.baseURL = '/api/v1';\n\nReactDOM.render(\n\n {/* CssBaseline kickstart an elegant, consistent, and simple baseline to build upon. */}\n \n \n , document.getElementById('root'));\n\n// If you want your app to work offline and load faster, you can change\n// unregister() to register() below. Note this comes with some pitfalls.\n// Learn more about service workers: https://bit.ly/CRA-PWA\nserviceWorker.unregister();\n"],"sourceRoot":""}
\ No newline at end of file
diff --git a/app/bin/main/public/static/js/runtime-main.1c2d59f4.js b/app/bin/main/public/static/js/runtime-main.1c2d59f4.js
new file mode 100644
index 0000000..8e654ec
--- /dev/null
+++ b/app/bin/main/public/static/js/runtime-main.1c2d59f4.js
@@ -0,0 +1,2 @@
+!function(e){function r(r){for(var n,f,l=r[0],i=r[1],a=r[2],c=0,s=[];c.sqlite3" to use a file-based database instead.
// Nore that ":memory:" is an **SQLite specific** magic string that tells the
// underlying SQLite engine to store the database in memory.
private static final String jdbcString = "jdbc:sqlite::memory:";
// private static final String jdbcString = "jdbc:sqlite:krusty.db";
-
- // Hold a single connection to the database. Note that this is
- // not a pool, so this is not thread-safe nor efficient.
private Connection conn = null;
public String getCustomers(Request req, Response res) {
@@ -42,242 +34,30 @@ public class Database {
}
public String getRawMaterials(Request req, Response res) {
- String result = selectQuery("raw_materials", "raw-materials", "ingredient_name", "ingredient_quantity", "unit");
+ String result = selectQuery("ingredients", "raw-materials", "ingredient_name", "amount", "unit");
result = result.replaceAll("ingredient_name", "name");
- result = result.replaceAll("ingredient_quantity", "amount");
return result;
}
public String getCookies(Request req, Response res) {
- String result = selectQuery("cookies", "cookies", "cookie_name");
- result = result.replaceAll("cookie_name", "name");
+ String result = selectQuery("recipes", "cookies", "recipe_name");
+ result = result.replaceAll("recipe_name", "name");
return result;
}
public String getRecipes(Request req, Response res) {
- // Essentially serialize DefaultRecipes to json
return "{}";
}
public String getPallets(Request req, Response res) {
- // These queries look like:
- // http://localhost:8888/api/v1/pallets?cookie=Nut+cookie&from=2024-05-23&to=2024-05-30&blocked=yes
- // They may contain any combination of the parameters, or none at all.
-
- Optional r = Optional.empty(); // Holds the ecipe if we have a cookie
- Optional blocked = Optional.empty(); // Holds the blocked status
- Optional from = Optional.empty(); // Holds the from date
- Optional to = Optional.empty(); // Holds the to date
-
- // Parameter validation block
- {
- // First we need the cookie parameter
- String cookie = req.queryParams("cookie");
-
- // And the blocked parameter
- String blocked_str = req.queryParams("blocked");
-
- // Then we need the date parameters
- String from_str = req.queryParams("from");
- String to_str = req.queryParams("to");
-
- // Fancy functional one-liner to get the recipe if the cookie is present
- if (cookie != null) {
- r = Optional.ofNullable(DefaultRecipes.recipes.stream()
- .filter(recipe -> recipe.name.equals(cookie))
- .findFirst().orElse(null));
- }
-
- if (blocked_str != null) {
- blocked = switch (blocked_str) {
- case "yes" -> Optional.of(true);
- case "no" -> Optional.of(false);
- default -> Optional.empty();
- };
- }
-
- if (from_str != null) {
- try {
- from = Optional.of(new SimpleDateFormat("yyyy-MM-dd").parse(from_str));
- } catch (Exception e) {
- from = Optional.empty();
- }
- }
-
- if (to_str != null) {
- try {
- to = Optional.of(new SimpleDateFormat("yyyy-MM-dd").parse(to_str));
- } catch (Exception e) {
- to = Optional.empty();
- }
- }
-
- // If the interval is negative, reset the dates
- if (from.isPresent() && to.isPresent() && from.get().after(to.get())) {
- from = Optional.empty();
- to = Optional.empty();
- }
- }
-
- // This type of code is unreadable, error prone and hard to maintain.
- // The fact that im responsible for this code makes my soul hurt.
- // This part almost made me write a simple query factory to handle this.
- //
- // SqlBuilder exists to 'take the pain out of generating SQL queries',
- // but it's not in the standard library.
- //
- // Helmets, seatbelts and safety goggles on; we need to execute a query.
- try {
- Statement stmt = conn.createStatement();
- StringBuilder query = new StringBuilder(
- "SELECT cookie_name, status FROM pallets_view");
-
- // r is validated here
- if (r.isPresent()) {
- query.append(" WHERE cookie_name = '" + r.get().name + "'");
- }
-
- if (from.isPresent()) {
- String query_from = new SimpleDateFormat("yyyy-MM-dd").format(from.get());
-
- // Super hacky, low quality code
- String clause = query.toString().contains("WHERE") ? " AND " : " WHERE ";
-
- query.append(clause + "production_date >= '" + query_from + "'");
- }
-
- if (to.isPresent()) {
- String query_to = new SimpleDateFormat("yyyy-MM-dd").format(to.get());
-
- // Super hacky, low quality code
- String clause = query.toString().contains("WHERE") ? " AND " : " WHERE ";
-
- query.append(clause + "production_date <= '" + query_to + "'");
- }
-
- if (blocked.isPresent()) {
- // This again
- String clause = query.toString().contains("WHERE") ? " AND " : " WHERE ";
- query.append(clause);
-
- // TODO: WARNING This logic is flawed. WARNING
- // Remember, status can be 'freezer', 'delivered' or 'blocked'
- query.append("status = " + (blocked.get() ? "'blocked'" : "'freezer'"));
- }
-
- System.out.println(query.toString());
-
- ResultSet result = stmt.executeQuery(query.toString());
-
- // Rename the columns
- String jsonResult = Jsonizer.toJson(result, "pallets");
-
- // Some carmack level code, as usual
- jsonResult = jsonResult.replaceAll("cookie_name", "cookie");
- jsonResult = jsonResult.replaceAll("freezer", "no");
- jsonResult = jsonResult.replaceAll("delivered", "no");
- jsonResult = jsonResult.replaceAll("blocked", "yes");
- jsonResult = jsonResult.replaceAll("status", "blocked");
-
- return jsonResult;
- } catch (SQLException e) {
- System.out.printf("Error executing query: \n%s", e);
- }
-
- // Statue 500, to give the client a
- // chance to figure out that something went wrong
- res.status(500);
return "{\"pallets\":[]}";
}
public String reset(Request req, Response res) {
- try {
- this.migrateScript("Migrations/create-schema.sql");
- this.migrateScript("Migrations/initial-data.sql");
- } catch (Exception e) {
- System.out.printf("Error resetting database: \n%s", e);
- res.status(500);
- return "{}";
- }
return "{}";
}
public String createPallet(Request req, Response res) {
- // This on only has one query param and looks like:
- // http://localhost:8888/api/v1/pallets?cookie=Amneris
-
- Optional r = Optional.empty();
- String cookie = req.queryParams("cookie");
-
- if (cookie != null) {
- r = Optional.ofNullable(DefaultRecipes.recipes.stream()
- .filter(recipe -> recipe.name.equals(cookie))
- .findFirst().orElse(null));
- }
-
- if (r.isEmpty()) {
- res.status(404);
- return "{}";
- }
-
- try (PreparedStatement getRawMaterials = conn
- .prepareStatement("SELECT * FROM raw_materials WHERE ingredient_name = ?");
- PreparedStatement decrementRawMaterials = conn.prepareStatement(
- "UPDATE raw_materials SET ingredient_quantity = ingredient_quantity - ? WHERE ingredient_name = ?");
- PreparedStatement insertPallet = conn.prepareStatement(
- "INSERT INTO pallets (cookie_id, production_date, status) VALUES (?, ?, ?)");
- PreparedStatement getCookieId = conn
- .prepareStatement("SELECT cookie_id FROM cookies WHERE cookie_name = ?")) {
- // Start transaction
- conn.setAutoCommit(false);
-
- for (Ingredient i : r.get().ingredients) {
- getRawMaterials.setString(1, i.name);
- ResultSet result = getRawMaterials.executeQuery();
- if (!result.next()) {
- conn.rollback();
- res.status(500);
- return "{}";
- }
-
- int amount_per_pallet = i.amount * 54; // 54 * 100
-
- // Check if we have enough raw materials
- if (result.getInt("ingredient_quantity") < amount_per_pallet) {
- conn.rollback();
- res.status(500);
- return "{}";
- }
-
- decrementRawMaterials.setInt(1, amount_per_pallet);
- decrementRawMaterials.setString(2, i.name);
- decrementRawMaterials.executeUpdate();
- }
-
- // Fish out the cookie id
- getCookieId.setString(1, cookie);
- ResultSet cookie_rs = getCookieId.executeQuery();
- if (!cookie_rs.next()) {
- conn.rollback();
- res.status(500);
- return "{}";
- }
-
- int cookie_id = cookie_rs.getInt("cookie_id");
-
- insertPallet.setInt(1, cookie_id);
- insertPallet.setString(2, new SimpleDateFormat("yyyy-MM-dd").format(new Date()));
- insertPallet.setString(3, "freezer");
-
- System.out.println(insertPallet.toString());
-
- insertPallet.executeUpdate();
- conn.commit();
- } catch (SQLException e) {
- System.out.printf("Error starting transaction: \n%s", e);
- }
-
- res.status(201);
return "{}";
}
@@ -324,7 +104,6 @@ public class Database {
// The script location is relative to the gradle
// build script ("build.gradle.kts", in this case).
- // Assumes every statement ends with a semicolon. (notably broken for triggers)
/** Reads an sql script into the database */
public void migrateScript(String filename) throws IOException, SQLException {
try (Stream lines = Files.lines(Paths.get(filename))) {
diff --git a/app/src/main/java/krusty/Recipe.java b/app/src/main/java/krusty/Recipe.java
index beb56de..864e39a 100644
--- a/app/src/main/java/krusty/Recipe.java
+++ b/app/src/main/java/krusty/Recipe.java
@@ -10,12 +10,6 @@ public class Recipe {
}
public String toString() {
- StringBuilder sb = new StringBuilder(name + ": ");
-
- for (Ingredient i : ingredients) {
- sb.append(i.toString());
- sb.append(" ");
- }
- return sb.toString();
+ return name;
}
}
\ No newline at end of file
diff --git a/makefile b/makefile
index 1459c69..dc22d2c 100644
--- a/makefile
+++ b/makefile
@@ -8,8 +8,6 @@ run:
clean:
./gradlew clean
- rm -f *.tar.gz *.tar.gz.minisig *.zip *.jpg
- rm -f app/krusty.db
test:
./gradlew test
@@ -18,7 +16,6 @@ dbdump:
sqlite3 app/krusty.db .dump
migrate:
- rm -f app/krusty.db
sqlite3 app/krusty.db < app/Migrations/create-schema.sql
sqlite3 app/krusty.db < app/Migrations/initial-data.sql
@@ -28,12 +25,4 @@ release:
scp krusty-imbus_$(GITHASH).tar.gz server:/public/krusty/krusty-imbus_$(GITHASH).tar.gz
scp krusty-imbus_$(GITHASH).tar.gz.minisig server:/public/krusty/krusty-imbus_$(GITHASH).tar.gz.minisig
-zip:
- git archive --format=zip --prefix Rest11/ --output=Rest11.zip HEAD
- 7za a -tzip CourseProject11.zip ./app/Migrations/*.sql
-
-# Generate ERD. Requires eralchemy2 (pip install eralchemy2)
-erd: migrate
- eralchemy2 -i sqlite:///app/krusty.db -o erd.jpg
-
-.PHONY: run clean test build dbdump migrate release erd
+.PHONY: run clean test build dbdump migrate release