will define the property that has `currentColor`\n // e.g. heroicons uses fill=\"none\" and stroke=\"currentColor\"\n fill: ownerState.hasSvgAsChild ? undefined : 'currentColor',\n flexShrink: 0,\n transition: (_theme$transitions = theme.transitions) == null ? void 0 : (_theme$transitions$cr = _theme$transitions.create) == null ? void 0 : _theme$transitions$cr.call(_theme$transitions, 'fill', {\n duration: (_theme$transitions2 = theme.transitions) == null ? void 0 : (_theme$transitions2$d = _theme$transitions2.duration) == null ? void 0 : _theme$transitions2$d.shorter\n }),\n fontSize: {\n inherit: 'inherit',\n small: ((_theme$typography = theme.typography) == null ? void 0 : (_theme$typography$pxT = _theme$typography.pxToRem) == null ? void 0 : _theme$typography$pxT.call(_theme$typography, 20)) || '1.25rem',\n medium: ((_theme$typography2 = theme.typography) == null ? void 0 : (_theme$typography2$px = _theme$typography2.pxToRem) == null ? void 0 : _theme$typography2$px.call(_theme$typography2, 24)) || '1.5rem',\n large: ((_theme$typography3 = theme.typography) == null ? void 0 : (_theme$typography3$px = _theme$typography3.pxToRem) == null ? void 0 : _theme$typography3$px.call(_theme$typography3, 35)) || '2.1875rem'\n }[ownerState.fontSize],\n // TODO v5 deprecate, v6 remove for sx\n color: (_palette$ownerState$c = (_palette = (theme.vars || theme).palette) == null ? void 0 : (_palette$ownerState$c2 = _palette[ownerState.color]) == null ? void 0 : _palette$ownerState$c2.main) != null ? _palette$ownerState$c : {\n action: (_palette2 = (theme.vars || theme).palette) == null ? void 0 : (_palette2$action = _palette2.action) == null ? void 0 : _palette2$action.active,\n disabled: (_palette3 = (theme.vars || theme).palette) == null ? void 0 : (_palette3$action = _palette3.action) == null ? void 0 : _palette3$action.disabled,\n inherit: undefined\n }[ownerState.color]\n };\n});\nconst SvgIcon = /*#__PURE__*/React.forwardRef(function SvgIcon(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiSvgIcon'\n });\n const {\n children,\n className,\n color = 'inherit',\n component = 'svg',\n fontSize = 'medium',\n htmlColor,\n inheritViewBox = false,\n titleAccess,\n viewBox = '0 0 24 24'\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const hasSvgAsChild = /*#__PURE__*/React.isValidElement(children) && children.type === 'svg';\n const ownerState = _extends({}, props, {\n color,\n component,\n fontSize,\n instanceFontSize: inProps.fontSize,\n inheritViewBox,\n viewBox,\n hasSvgAsChild\n });\n const more = {};\n if (!inheritViewBox) {\n more.viewBox = viewBox;\n }\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsxs(SvgIconRoot, _extends({\n as: component,\n className: clsx(classes.root, className),\n focusable: \"false\",\n color: htmlColor,\n \"aria-hidden\": titleAccess ? undefined : true,\n role: titleAccess ? 'img' : undefined,\n ref: ref\n }, more, other, hasSvgAsChild && children.props, {\n ownerState: ownerState,\n children: [hasSvgAsChild ? children.props.children : children, titleAccess ? /*#__PURE__*/_jsx(\"title\", {\n children: titleAccess\n }) : null]\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? SvgIcon.propTypes /* remove-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 * Node passed into the SVG element.\n */\n children: PropTypes.node,\n /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n /**\n * @ignore\n */\n className: PropTypes.string,\n /**\n * The color of the component.\n * It supports both default and custom theme colors, which can be added as shown in the\n * [palette customization guide](https://mui.com/material-ui/customization/palette/#adding-new-colors).\n * You can use the `htmlColor` prop to apply a color attribute to the SVG element.\n * @default 'inherit'\n */\n color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['inherit', 'action', 'disabled', 'primary', 'secondary', 'error', 'info', 'success', 'warning']), PropTypes.string]),\n /**\n * The component used for the root node.\n * Either a string to use a HTML element or a component.\n */\n component: PropTypes.elementType,\n /**\n * The fontSize applied to the icon. Defaults to 24px, but can be configure to inherit font size.\n * @default 'medium'\n */\n fontSize: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['inherit', 'large', 'medium', 'small']), PropTypes.string]),\n /**\n * Applies a color attribute to the SVG element.\n */\n htmlColor: PropTypes.string,\n /**\n * If `true`, the root node will inherit the custom `component`'s viewBox and the `viewBox`\n * prop will be ignored.\n * Useful when you want to reference a custom `component` and have `SvgIcon` pass that\n * `component`'s viewBox to the root node.\n * @default false\n */\n inheritViewBox: PropTypes.bool,\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 prop.\n */\n shapeRendering: PropTypes.string,\n /**\n * The system prop that allows defining system overrides as well as additional CSS styles.\n */\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),\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 * 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 * @default '0 0 24 24'\n */\n viewBox: PropTypes.string\n} : void 0;\nSvgIcon.muiName = 'SvgIcon';\nexport default SvgIcon;","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getTabUtilityClass(slot) {\n return generateUtilityClass('MuiTab', slot);\n}\nconst tabClasses = generateUtilityClasses('MuiTab', ['root', 'labelIcon', 'textColorInherit', 'textColorPrimary', 'textColorSecondary', 'selected', 'disabled', 'fullWidth', 'wrapped', 'iconWrapper']);\nexport default tabClasses;","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"className\", \"disabled\", \"disableFocusRipple\", \"fullWidth\", \"icon\", \"iconPosition\", \"indicator\", \"label\", \"onChange\", \"onClick\", \"onFocus\", \"selected\", \"selectionFollowsFocus\", \"textColor\", \"value\", \"wrapped\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/base';\nimport ButtonBase from '../ButtonBase';\nimport capitalize from '../utils/capitalize';\nimport useThemeProps from '../styles/useThemeProps';\nimport styled from '../styles/styled';\nimport unsupportedProp from '../utils/unsupportedProp';\nimport tabClasses, { getTabUtilityClass } from './tabClasses';\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n textColor,\n fullWidth,\n wrapped,\n icon,\n label,\n selected,\n disabled\n } = ownerState;\n const slots = {\n root: ['root', icon && label && 'labelIcon', `textColor${capitalize(textColor)}`, fullWidth && 'fullWidth', wrapped && 'wrapped', selected && 'selected', disabled && 'disabled'],\n iconWrapper: ['iconWrapper']\n };\n return composeClasses(slots, getTabUtilityClass, classes);\n};\nconst TabRoot = styled(ButtonBase, {\n name: 'MuiTab',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, ownerState.label && ownerState.icon && styles.labelIcon, styles[`textColor${capitalize(ownerState.textColor)}`], ownerState.fullWidth && styles.fullWidth, ownerState.wrapped && styles.wrapped];\n }\n})(({\n theme,\n ownerState\n}) => _extends({}, theme.typography.button, {\n maxWidth: 360,\n minWidth: 90,\n position: 'relative',\n minHeight: 48,\n flexShrink: 0,\n padding: '12px 16px',\n overflow: 'hidden',\n whiteSpace: 'normal',\n textAlign: 'center'\n}, ownerState.label && {\n flexDirection: ownerState.iconPosition === 'top' || ownerState.iconPosition === 'bottom' ? 'column' : 'row'\n}, {\n lineHeight: 1.25\n}, ownerState.icon && ownerState.label && {\n minHeight: 72,\n paddingTop: 9,\n paddingBottom: 9,\n [`& > .${tabClasses.iconWrapper}`]: _extends({}, ownerState.iconPosition === 'top' && {\n marginBottom: 6\n }, ownerState.iconPosition === 'bottom' && {\n marginTop: 6\n }, ownerState.iconPosition === 'start' && {\n marginRight: theme.spacing(1)\n }, ownerState.iconPosition === 'end' && {\n marginLeft: theme.spacing(1)\n })\n}, ownerState.textColor === 'inherit' && {\n color: 'inherit',\n opacity: 0.6,\n // same opacity as theme.palette.text.secondary\n [`&.${tabClasses.selected}`]: {\n opacity: 1\n },\n [`&.${tabClasses.disabled}`]: {\n opacity: (theme.vars || theme).palette.action.disabledOpacity\n }\n}, ownerState.textColor === 'primary' && {\n color: (theme.vars || theme).palette.text.secondary,\n [`&.${tabClasses.selected}`]: {\n color: (theme.vars || theme).palette.primary.main\n },\n [`&.${tabClasses.disabled}`]: {\n color: (theme.vars || theme).palette.text.disabled\n }\n}, ownerState.textColor === 'secondary' && {\n color: (theme.vars || theme).palette.text.secondary,\n [`&.${tabClasses.selected}`]: {\n color: (theme.vars || theme).palette.secondary.main\n },\n [`&.${tabClasses.disabled}`]: {\n color: (theme.vars || theme).palette.text.disabled\n }\n}, ownerState.fullWidth && {\n flexShrink: 1,\n flexGrow: 1,\n flexBasis: 0,\n maxWidth: 'none'\n}, ownerState.wrapped && {\n fontSize: theme.typography.pxToRem(12)\n}));\nconst Tab = /*#__PURE__*/React.forwardRef(function Tab(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiTab'\n });\n const {\n className,\n disabled = false,\n disableFocusRipple = false,\n // eslint-disable-next-line react/prop-types\n fullWidth,\n icon: iconProp,\n iconPosition = 'top',\n // eslint-disable-next-line react/prop-types\n indicator,\n label,\n onChange,\n onClick,\n onFocus,\n // eslint-disable-next-line react/prop-types\n selected,\n // eslint-disable-next-line react/prop-types\n selectionFollowsFocus,\n // eslint-disable-next-line react/prop-types\n textColor = 'inherit',\n value,\n wrapped = false\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const ownerState = _extends({}, props, {\n disabled,\n disableFocusRipple,\n selected,\n icon: !!iconProp,\n iconPosition,\n label: !!label,\n fullWidth,\n textColor,\n wrapped\n });\n const classes = useUtilityClasses(ownerState);\n const icon = iconProp && label && /*#__PURE__*/React.isValidElement(iconProp) ? /*#__PURE__*/React.cloneElement(iconProp, {\n className: clsx(classes.iconWrapper, iconProp.props.className)\n }) : iconProp;\n const handleClick = event => {\n if (!selected && onChange) {\n onChange(event, value);\n }\n if (onClick) {\n onClick(event);\n }\n };\n const handleFocus = event => {\n if (selectionFollowsFocus && !selected && onChange) {\n onChange(event, value);\n }\n if (onFocus) {\n onFocus(event);\n }\n };\n return /*#__PURE__*/_jsxs(TabRoot, _extends({\n focusRipple: !disableFocusRipple,\n className: clsx(classes.root, className),\n ref: ref,\n role: \"tab\",\n \"aria-selected\": selected,\n disabled: disabled,\n onClick: handleClick,\n onFocus: handleFocus,\n ownerState: ownerState,\n tabIndex: selected ? 0 : -1\n }, other, {\n children: [iconPosition === 'top' || iconPosition === 'start' ? /*#__PURE__*/_jsxs(React.Fragment, {\n children: [icon, label]\n }) : /*#__PURE__*/_jsxs(React.Fragment, {\n children: [label, icon]\n }), indicator]\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? Tab.propTypes /* remove-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 * This prop isn't supported.\n * Use the `component` prop if you need to change the children structure.\n */\n children: unsupportedProp,\n /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n /**\n * @ignore\n */\n className: PropTypes.string,\n /**\n * If `true`, the component is disabled.\n * @default false\n */\n disabled: PropTypes.bool,\n /**\n * If `true`, the keyboard focus ripple is disabled.\n * @default false\n */\n disableFocusRipple: PropTypes.bool,\n /**\n * If `true`, the ripple effect is 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 `.Mui-focusVisible` class.\n * @default false\n */\n disableRipple: PropTypes.bool,\n /**\n * The icon to display.\n */\n icon: PropTypes.oneOfType([PropTypes.element, PropTypes.string]),\n /**\n * The position of the icon relative to the label.\n * @default 'top'\n */\n iconPosition: PropTypes.oneOf(['bottom', 'end', 'start', 'top']),\n /**\n * The label element.\n */\n label: PropTypes.node,\n /**\n * @ignore\n */\n onChange: PropTypes.func,\n /**\n * @ignore\n */\n onClick: PropTypes.func,\n /**\n * @ignore\n */\n onFocus: PropTypes.func,\n /**\n * The system prop that allows defining system overrides as well as additional CSS styles.\n */\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),\n /**\n * You can provide your own value. Otherwise, we fallback to the child position index.\n */\n value: PropTypes.any,\n /**\n * Tab labels appear in a single row.\n * They can use a second line if needed.\n * @default false\n */\n wrapped: PropTypes.bool\n} : void 0;\nexport default Tab;","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getTableCellUtilityClass(slot) {\n return generateUtilityClass('MuiTableCell', slot);\n}\nconst tableCellClasses = generateUtilityClasses('MuiTableCell', ['root', 'head', 'body', 'footer', 'sizeSmall', 'sizeMedium', 'paddingCheckbox', 'paddingNone', 'alignLeft', 'alignCenter', 'alignRight', 'alignJustify', 'stickyHeader']);\nexport default tableCellClasses;","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"align\", \"className\", \"component\", \"padding\", \"scope\", \"size\", \"sortDirection\", \"variant\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/base';\nimport { darken, alpha, lighten } from '@mui/system';\nimport capitalize from '../utils/capitalize';\nimport TableContext from '../Table/TableContext';\nimport Tablelvl2Context from '../Table/Tablelvl2Context';\nimport useThemeProps from '../styles/useThemeProps';\nimport styled from '../styles/styled';\nimport tableCellClasses, { getTableCellUtilityClass } from './tableCellClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n variant,\n align,\n padding,\n size,\n stickyHeader\n } = ownerState;\n const slots = {\n root: ['root', variant, stickyHeader && 'stickyHeader', align !== 'inherit' && `align${capitalize(align)}`, padding !== 'normal' && `padding${capitalize(padding)}`, `size${capitalize(size)}`]\n };\n return composeClasses(slots, getTableCellUtilityClass, classes);\n};\nconst TableCellRoot = styled('td', {\n name: 'MuiTableCell',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, styles[ownerState.variant], styles[`size${capitalize(ownerState.size)}`], ownerState.padding !== 'normal' && styles[`padding${capitalize(ownerState.padding)}`], ownerState.align !== 'inherit' && styles[`align${capitalize(ownerState.align)}`], ownerState.stickyHeader && styles.stickyHeader];\n }\n})(({\n theme,\n ownerState\n}) => _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: theme.vars ? `1px solid ${theme.vars.palette.TableCell.border}` : `1px solid\n ${theme.palette.mode === 'light' ? lighten(alpha(theme.palette.divider, 1), 0.88) : darken(alpha(theme.palette.divider, 1), 0.68)}`,\n textAlign: 'left',\n padding: 16\n}, ownerState.variant === 'head' && {\n color: (theme.vars || theme).palette.text.primary,\n lineHeight: theme.typography.pxToRem(24),\n fontWeight: theme.typography.fontWeightMedium\n}, ownerState.variant === 'body' && {\n color: (theme.vars || theme).palette.text.primary\n}, ownerState.variant === 'footer' && {\n color: (theme.vars || theme).palette.text.secondary,\n lineHeight: theme.typography.pxToRem(21),\n fontSize: theme.typography.pxToRem(12)\n}, ownerState.size === 'small' && {\n padding: '6px 16px',\n [`&.${tableCellClasses.paddingCheckbox}`]: {\n width: 24,\n // prevent the checkbox column from growing\n padding: '0 12px 0 16px',\n '& > *': {\n padding: 0\n }\n }\n}, ownerState.padding === 'checkbox' && {\n width: 48,\n // prevent the checkbox column from growing\n padding: '0 0 0 4px'\n}, ownerState.padding === 'none' && {\n padding: 0\n}, ownerState.align === 'left' && {\n textAlign: 'left'\n}, ownerState.align === 'center' && {\n textAlign: 'center'\n}, ownerState.align === 'right' && {\n textAlign: 'right',\n flexDirection: 'row-reverse'\n}, ownerState.align === 'justify' && {\n textAlign: 'justify'\n}, ownerState.stickyHeader && {\n position: 'sticky',\n top: 0,\n zIndex: 2,\n backgroundColor: (theme.vars || theme).palette.background.default\n}));\n\n/**\n * The component renders a `` element when the parent context is a header\n * or otherwise a ` ` element.\n */\nconst TableCell = /*#__PURE__*/React.forwardRef(function TableCell(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiTableCell'\n });\n const {\n align = 'inherit',\n className,\n component: componentProp,\n padding: paddingProp,\n scope: scopeProp,\n size: sizeProp,\n sortDirection,\n variant: variantProp\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const table = React.useContext(TableContext);\n const tablelvl2 = React.useContext(Tablelvl2Context);\n const isHeadCell = tablelvl2 && tablelvl2.variant === 'head';\n let component;\n if (componentProp) {\n component = componentProp;\n } else {\n component = isHeadCell ? 'th' : 'td';\n }\n let scope = scopeProp;\n // scope is not a valid attribute for on Chrome.\n }\n});\n\nconst TablePaginationMenuItem = styled(MenuItem, {\n name: 'MuiTablePagination',\n slot: 'MenuItem',\n overridesResolver: (props, styles) => styles.menuItem\n})({});\nconst TablePaginationDisplayedRows = styled('p', {\n name: 'MuiTablePagination',\n slot: 'DisplayedRows',\n overridesResolver: (props, styles) => styles.displayedRows\n})(({\n theme\n}) => _extends({}, theme.typography.body2, {\n flexShrink: 0\n}));\nfunction defaultLabelDisplayedRows({\n from,\n to,\n count\n}) {\n return `${from}–${to} of ${count !== -1 ? count : `more than ${to}`}`;\n}\nfunction defaultGetAriaLabel(type) {\n return `Go to ${type} page`;\n}\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['root'],\n toolbar: ['toolbar'],\n spacer: ['spacer'],\n selectLabel: ['selectLabel'],\n select: ['select'],\n input: ['input'],\n selectIcon: ['selectIcon'],\n menuItem: ['menuItem'],\n displayedRows: ['displayedRows'],\n actions: ['actions']\n };\n return composeClasses(slots, getTablePaginationUtilityClass, classes);\n};\n\n/**\n * A `TableCell` based component for placing inside `TableFooter` for pagination.\n */\nconst TablePagination = /*#__PURE__*/React.forwardRef(function TablePagination(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiTablePagination'\n });\n const {\n ActionsComponent = TablePaginationActions,\n backIconButtonProps,\n className,\n colSpan: colSpanProp,\n component = TableCell,\n count,\n getItemAriaLabel = defaultGetAriaLabel,\n labelDisplayedRows = defaultLabelDisplayedRows,\n labelRowsPerPage = 'Rows per page:',\n nextIconButtonProps,\n onPageChange,\n onRowsPerPageChange,\n page,\n rowsPerPage,\n rowsPerPageOptions = [10, 25, 50, 100],\n SelectProps = {},\n showFirstButton = false,\n showLastButton = false\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const ownerState = props;\n const classes = useUtilityClasses(ownerState);\n const MenuItemComponent = SelectProps.native ? 'option' : TablePaginationMenuItem;\n let colSpan;\n if (component === TableCell || component === 'td') {\n colSpan = colSpanProp || 1000; // col-span over everything\n }\n\n const selectId = useId(SelectProps.id);\n const labelId = useId(SelectProps.labelId);\n const getLabelDisplayedRowsTo = () => {\n if (count === -1) {\n return (page + 1) * rowsPerPage;\n }\n return rowsPerPage === -1 ? count : Math.min(count, (page + 1) * rowsPerPage);\n };\n return /*#__PURE__*/_jsx(TablePaginationRoot, _extends({\n colSpan: colSpan,\n ref: ref,\n as: component,\n ownerState: ownerState,\n className: clsx(classes.root, className)\n }, other, {\n children: /*#__PURE__*/_jsxs(TablePaginationToolbar, {\n className: classes.toolbar,\n children: [/*#__PURE__*/_jsx(TablePaginationSpacer, {\n className: classes.spacer\n }), rowsPerPageOptions.length > 1 && /*#__PURE__*/_jsx(TablePaginationSelectLabel, {\n className: classes.selectLabel,\n id: labelId,\n children: labelRowsPerPage\n }), rowsPerPageOptions.length > 1 && /*#__PURE__*/_jsx(TablePaginationSelect, _extends({\n variant: \"standard\"\n }, !SelectProps.variant && {\n input: _InputBase || (_InputBase = /*#__PURE__*/_jsx(InputBase, {}))\n }, {\n value: rowsPerPage,\n onChange: onRowsPerPageChange,\n id: selectId,\n labelId: labelId\n }, SelectProps, {\n classes: _extends({}, SelectProps.classes, {\n // TODO v5 remove `classes.input`\n root: clsx(classes.input, classes.selectRoot, (SelectProps.classes || {}).root),\n select: clsx(classes.select, (SelectProps.classes || {}).select),\n // TODO v5 remove `selectIcon`\n icon: clsx(classes.selectIcon, (SelectProps.classes || {}).icon)\n }),\n children: rowsPerPageOptions.map(rowsPerPageOption => /*#__PURE__*/_createElement(MenuItemComponent, _extends({}, !isHostComponent(MenuItemComponent) && {\n ownerState\n }, {\n className: classes.menuItem,\n key: rowsPerPageOption.label ? rowsPerPageOption.label : rowsPerPageOption,\n value: rowsPerPageOption.value ? rowsPerPageOption.value : rowsPerPageOption\n }), rowsPerPageOption.label ? rowsPerPageOption.label : rowsPerPageOption))\n })), /*#__PURE__*/_jsx(TablePaginationDisplayedRows, {\n className: classes.displayedRows,\n children: labelDisplayedRows({\n from: count === 0 ? 0 : page * rowsPerPage + 1,\n to: getLabelDisplayedRowsTo(),\n count: count === -1 ? -1 : count,\n page\n })\n }), /*#__PURE__*/_jsx(ActionsComponent, {\n className: classes.actions,\n backIconButtonProps: backIconButtonProps,\n count: count,\n nextIconButtonProps: nextIconButtonProps,\n onPageChange: onPageChange,\n page: page,\n rowsPerPage: rowsPerPage,\n showFirstButton: showFirstButton,\n showLastButton: showLastButton,\n getItemAriaLabel: getItemAriaLabel\n })]\n })\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? TablePagination.propTypes /* remove-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 * The component used for displaying the actions.\n * Either a string to use a HTML element or a component.\n * @default TablePaginationActions\n */\n ActionsComponent: PropTypes.elementType,\n /**\n * Props applied to the back arrow [`IconButton`](/material-ui/api/icon-button/) component.\n */\n backIconButtonProps: PropTypes.object,\n /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n /**\n * @ignore\n */\n className: PropTypes.string,\n /**\n * @ignore\n */\n colSpan: PropTypes.number,\n /**\n * The component used for the root node.\n * Either a string to use a HTML element or a component.\n */\n component: PropTypes.elementType,\n /**\n * The total number of rows.\n *\n * To enable server side pagination for an unknown number of items, provide -1.\n */\n count: integerPropType.isRequired,\n /**\n * Accepts a function which returns a string value that provides a user-friendly name for the current page.\n * This is important for screen reader users.\n *\n * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/).\n * @param {string} type The link or button type to format ('first' | 'last' | 'next' | 'previous').\n * @returns {string}\n * @default function defaultGetAriaLabel(type) {\n * return `Go to ${type} page`;\n * }\n */\n getItemAriaLabel: PropTypes.func,\n /**\n * Customize the displayed rows label. Invoked with a `{ from, to, count, page }`\n * object.\n *\n * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/).\n * @default function defaultLabelDisplayedRows({ from, to, count }) {\n * return `${from}–${to} of ${count !== -1 ? count : `more than ${to}`}`;\n * }\n */\n labelDisplayedRows: PropTypes.func,\n /**\n * Customize the rows per page label.\n *\n * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/).\n * @default 'Rows per page:'\n */\n labelRowsPerPage: PropTypes.node,\n /**\n * Props applied to the next arrow [`IconButton`](/material-ui/api/icon-button/) element.\n */\n nextIconButtonProps: PropTypes.object,\n /**\n * Callback fired when the page is changed.\n *\n * @param {React.MouseEvent | null} event The event source of the callback.\n * @param {number} page The page selected.\n */\n onPageChange: PropTypes.func.isRequired,\n /**\n * Callback fired when the number of rows per page is changed.\n *\n * @param {React.ChangeEvent} event The event source of the callback.\n */\n onRowsPerPageChange: PropTypes.func,\n /**\n * The zero-based index of the current page.\n */\n page: chainPropTypes(integerPropType.isRequired, props => {\n const {\n count,\n page,\n rowsPerPage\n } = props;\n if (count === -1) {\n return null;\n }\n const newLastPage = Math.max(0, Math.ceil(count / rowsPerPage) - 1);\n if (page < 0 || page > newLastPage) {\n return new Error('MUI: The page prop of a TablePagination is out of range ' + `(0 to ${newLastPage}, but page is ${page}).`);\n }\n return null;\n }),\n /**\n * The number of rows per page.\n *\n * Set -1 to display all the rows.\n */\n rowsPerPage: integerPropType.isRequired,\n /**\n * Customizes the options of the rows per page select field. If less than two options are\n * available, no select field will be displayed.\n * Use -1 for the value with a custom label to show all the rows.\n * @default [10, 25, 50, 100]\n */\n rowsPerPageOptions: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.shape({\n label: PropTypes.string.isRequired,\n value: PropTypes.number.isRequired\n })]).isRequired),\n /**\n * Props applied to the rows per page [`Select`](/material-ui/api/select/) element.\n * @default {}\n */\n SelectProps: PropTypes.object,\n /**\n * If `true`, show the first-page button.\n * @default false\n */\n showFirstButton: PropTypes.bool,\n /**\n * If `true`, show the last-page button.\n * @default false\n */\n showLastButton: PropTypes.bool,\n /**\n * The system prop that allows defining system overrides as well as additional CSS styles.\n */\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])\n} : void 0;\nexport default TablePagination;","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getTablePaginationUtilityClass(slot) {\n return generateUtilityClass('MuiTablePagination', slot);\n}\nconst tablePaginationClasses = generateUtilityClasses('MuiTablePagination', ['root', 'toolbar', 'spacer', 'selectLabel', 'selectRoot', 'select', 'selectIcon', 'input', 'menuItem', 'displayedRows', 'actions']);\nexport default tablePaginationClasses;","import * as React from 'react';\n\n/**\n * @ignore - internal component.\n */\nconst TableContext = /*#__PURE__*/React.createContext();\nif (process.env.NODE_ENV !== 'production') {\n TableContext.displayName = 'TableContext';\n}\nexport default TableContext;","import * as React from 'react';\n\n/**\n * @ignore - internal component.\n */\nconst Tablelvl2Context = /*#__PURE__*/React.createContext();\nif (process.env.NODE_ENV !== 'production') {\n Tablelvl2Context.displayName = 'Tablelvl2Context';\n}\nexport default Tablelvl2Context;","// Source from https://github.com/alitaheri/normalize-scroll-left\nlet cachedType;\n\n/**\n * Based on the jquery plugin https://github.com/othree/jquery.rtl-scroll-type\n *\n * Types of scrollLeft, assuming scrollWidth=100 and direction is rtl.\n *\n * Type | <- Most Left | Most Right -> | Initial\n * ---------------- | ------------ | ------------- | -------\n * default | 0 | 100 | 100\n * negative (spec*) | -100 | 0 | 0\n * reverse | 100 | 0 | 0\n *\n * Edge 85: default\n * Safari 14: negative\n * Chrome 85: negative\n * Firefox 81: negative\n * IE11: reverse\n *\n * spec* https://drafts.csswg.org/cssom-view/#dom-window-scroll\n */\nexport function detectScrollType() {\n if (cachedType) {\n return cachedType;\n }\n const dummy = document.createElement('div');\n const container = document.createElement('div');\n container.style.width = '10px';\n container.style.height = '1px';\n dummy.appendChild(container);\n dummy.dir = 'rtl';\n dummy.style.fontSize = '14px';\n dummy.style.width = '4px';\n dummy.style.height = '1px';\n dummy.style.position = 'absolute';\n dummy.style.top = '-1000px';\n dummy.style.overflow = 'scroll';\n document.body.appendChild(dummy);\n cachedType = 'reverse';\n if (dummy.scrollLeft > 0) {\n cachedType = 'default';\n } else {\n dummy.scrollLeft = 1;\n if (dummy.scrollLeft === 0) {\n cachedType = 'negative';\n }\n }\n document.body.removeChild(dummy);\n return cachedType;\n}\n\n// Based on https://stackoverflow.com/a/24394376\nexport function getNormalizedScrollLeft(element, direction) {\n const scrollLeft = element.scrollLeft;\n\n // Perform the calculations only when direction is rtl to avoid messing up the ltr behavior\n if (direction !== 'rtl') {\n return scrollLeft;\n }\n const type = detectScrollType();\n switch (type) {\n case 'negative':\n return element.scrollWidth - element.clientWidth + scrollLeft;\n case 'reverse':\n return element.scrollWidth - element.clientWidth - scrollLeft;\n default:\n return scrollLeft;\n }\n}","function easeInOutSin(time) {\n return (1 + Math.sin(Math.PI * time - Math.PI / 2)) / 2;\n}\nexport default function animate(property, element, to, options = {}, cb = () => {}) {\n const {\n ease = easeInOutSin,\n duration = 300 // standard\n } = options;\n let start = null;\n const from = element[property];\n let cancelled = false;\n const cancel = () => {\n cancelled = true;\n };\n const step = timestamp => {\n if (cancelled) {\n cb(new Error('Animation cancelled'));\n return;\n }\n if (start === null) {\n start = timestamp;\n }\n const time = Math.min(1, (timestamp - start) / duration);\n element[property] = ease(time) * (to - from) + from;\n if (time >= 1) {\n requestAnimationFrame(() => {\n cb(null);\n });\n return;\n }\n requestAnimationFrame(step);\n };\n if (from === to) {\n cb(new Error('Element already at target position'));\n return cancel;\n }\n requestAnimationFrame(step);\n return cancel;\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"onChange\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport debounce from '../utils/debounce';\nimport { ownerWindow, unstable_useEnhancedEffect as useEnhancedEffect } from '../utils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst styles = {\n width: 99,\n height: 99,\n position: 'absolute',\n top: -9999,\n overflow: 'scroll'\n};\n\n/**\n * @ignore - internal component.\n * The component originates from https://github.com/STORIS/react-scrollbar-size.\n * It has been moved into the core in order to minimize the bundle size.\n */\nexport default function ScrollbarSize(props) {\n const {\n onChange\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const scrollbarHeight = React.useRef();\n const nodeRef = React.useRef(null);\n const setMeasurements = () => {\n scrollbarHeight.current = nodeRef.current.offsetHeight - nodeRef.current.clientHeight;\n };\n useEnhancedEffect(() => {\n const handleResize = debounce(() => {\n const prevHeight = scrollbarHeight.current;\n setMeasurements();\n if (prevHeight !== scrollbarHeight.current) {\n onChange(scrollbarHeight.current);\n }\n });\n const containerWindow = ownerWindow(nodeRef.current);\n containerWindow.addEventListener('resize', handleResize);\n return () => {\n handleResize.clear();\n containerWindow.removeEventListener('resize', handleResize);\n };\n }, [onChange]);\n React.useEffect(() => {\n setMeasurements();\n onChange(scrollbarHeight.current);\n }, [onChange]);\n return /*#__PURE__*/_jsx(\"div\", _extends({\n style: styles,\n ref: nodeRef\n }, other));\n}\nprocess.env.NODE_ENV !== \"production\" ? ScrollbarSize.propTypes = {\n onChange: PropTypes.func.isRequired\n} : void 0;","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getTabScrollButtonUtilityClass(slot) {\n return generateUtilityClass('MuiTabScrollButton', slot);\n}\nconst tabScrollButtonClasses = generateUtilityClasses('MuiTabScrollButton', ['root', 'vertical', 'horizontal', 'disabled']);\nexport default tabScrollButtonClasses;","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"className\", \"slots\", \"slotProps\", \"direction\", \"orientation\", \"disabled\"];\n/* eslint-disable jsx-a11y/aria-role */\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses, useSlotProps } from '@mui/base';\nimport KeyboardArrowLeft from '../internal/svg-icons/KeyboardArrowLeft';\nimport KeyboardArrowRight from '../internal/svg-icons/KeyboardArrowRight';\nimport ButtonBase from '../ButtonBase';\nimport useTheme from '../styles/useTheme';\nimport useThemeProps from '../styles/useThemeProps';\nimport styled from '../styles/styled';\nimport tabScrollButtonClasses, { getTabScrollButtonUtilityClass } from './tabScrollButtonClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n orientation,\n disabled\n } = ownerState;\n const slots = {\n root: ['root', orientation, disabled && 'disabled']\n };\n return composeClasses(slots, getTabScrollButtonUtilityClass, classes);\n};\nconst TabScrollButtonRoot = styled(ButtonBase, {\n name: 'MuiTabScrollButton',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, ownerState.orientation && styles[ownerState.orientation]];\n }\n})(({\n ownerState\n}) => _extends({\n width: 40,\n flexShrink: 0,\n opacity: 0.8,\n [`&.${tabScrollButtonClasses.disabled}`]: {\n opacity: 0\n }\n}, ownerState.orientation === 'vertical' && {\n width: '100%',\n height: 40,\n '& svg': {\n transform: `rotate(${ownerState.isRtl ? -90 : 90}deg)`\n }\n}));\nconst TabScrollButton = /*#__PURE__*/React.forwardRef(function TabScrollButton(inProps, ref) {\n var _slots$StartScrollBut, _slots$EndScrollButto;\n const props = useThemeProps({\n props: inProps,\n name: 'MuiTabScrollButton'\n });\n const {\n className,\n slots = {},\n slotProps = {},\n direction\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const theme = useTheme();\n const isRtl = theme.direction === 'rtl';\n const ownerState = _extends({\n isRtl\n }, props);\n const classes = useUtilityClasses(ownerState);\n const StartButtonIcon = (_slots$StartScrollBut = slots.StartScrollButtonIcon) != null ? _slots$StartScrollBut : KeyboardArrowLeft;\n const EndButtonIcon = (_slots$EndScrollButto = slots.EndScrollButtonIcon) != null ? _slots$EndScrollButto : KeyboardArrowRight;\n const startButtonIconProps = useSlotProps({\n elementType: StartButtonIcon,\n externalSlotProps: slotProps.startScrollButtonIcon,\n additionalProps: {\n fontSize: 'small'\n },\n ownerState\n });\n const endButtonIconProps = useSlotProps({\n elementType: EndButtonIcon,\n externalSlotProps: slotProps.endScrollButtonIcon,\n additionalProps: {\n fontSize: 'small'\n },\n ownerState\n });\n return /*#__PURE__*/_jsx(TabScrollButtonRoot, _extends({\n component: \"div\",\n className: clsx(classes.root, className),\n ref: ref,\n role: null,\n ownerState: ownerState,\n tabIndex: null\n }, other, {\n children: direction === 'left' ? /*#__PURE__*/_jsx(StartButtonIcon, _extends({}, startButtonIconProps)) : /*#__PURE__*/_jsx(EndButtonIcon, _extends({}, endButtonIconProps))\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? TabScrollButton.propTypes /* remove-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 * The content of the component.\n */\n children: PropTypes.node,\n /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n /**\n * @ignore\n */\n className: PropTypes.string,\n /**\n * The direction the button should indicate.\n */\n direction: PropTypes.oneOf(['left', 'right']).isRequired,\n /**\n * If `true`, the component is disabled.\n * @default false\n */\n disabled: PropTypes.bool,\n /**\n * The component orientation (layout flow direction).\n */\n orientation: PropTypes.oneOf(['horizontal', 'vertical']).isRequired,\n /**\n * The extra props for the slot components.\n * You can override the existing props or add new ones.\n * @default {}\n */\n slotProps: PropTypes.shape({\n endScrollButtonIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),\n startScrollButtonIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object])\n }),\n /**\n * The components used for each slot inside.\n * @default {}\n */\n slots: PropTypes.shape({\n EndScrollButtonIcon: PropTypes.elementType,\n StartScrollButtonIcon: PropTypes.elementType\n }),\n /**\n * The system prop that allows defining system overrides as well as additional CSS styles.\n */\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])\n} : void 0;\nexport default TabScrollButton;","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"aria-label\", \"aria-labelledby\", \"action\", \"centered\", \"children\", \"className\", \"component\", \"allowScrollButtonsMobile\", \"indicatorColor\", \"onChange\", \"orientation\", \"ScrollButtonComponent\", \"scrollButtons\", \"selectionFollowsFocus\", \"slots\", \"slotProps\", \"TabIndicatorProps\", \"TabScrollButtonProps\", \"textColor\", \"value\", \"variant\", \"visibleScrollbar\"];\nimport * as React from 'react';\nimport { isFragment } from 'react-is';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { refType } from '@mui/utils';\nimport { unstable_composeClasses as composeClasses, useSlotProps } from '@mui/base';\nimport styled from '../styles/styled';\nimport useThemeProps from '../styles/useThemeProps';\nimport useTheme from '../styles/useTheme';\nimport debounce from '../utils/debounce';\nimport { getNormalizedScrollLeft, detectScrollType } from '../utils/scrollLeft';\nimport animate from '../internal/animate';\nimport ScrollbarSize from './ScrollbarSize';\nimport TabScrollButton from '../TabScrollButton';\nimport useEventCallback from '../utils/useEventCallback';\nimport tabsClasses, { getTabsUtilityClass } from './tabsClasses';\nimport ownerDocument from '../utils/ownerDocument';\nimport ownerWindow from '../utils/ownerWindow';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst nextItem = (list, item) => {\n if (list === item) {\n return list.firstChild;\n }\n if (item && item.nextElementSibling) {\n return item.nextElementSibling;\n }\n return list.firstChild;\n};\nconst previousItem = (list, item) => {\n if (list === item) {\n return list.lastChild;\n }\n if (item && item.previousElementSibling) {\n return item.previousElementSibling;\n }\n return list.lastChild;\n};\nconst moveFocus = (list, currentFocus, traversalFunction) => {\n let wrappedOnce = false;\n let nextFocus = traversalFunction(list, currentFocus);\n while (nextFocus) {\n // Prevent infinite loop.\n if (nextFocus === list.firstChild) {\n if (wrappedOnce) {\n return;\n }\n wrappedOnce = true;\n }\n\n // Same logic as useAutocomplete.js\n const nextFocusDisabled = nextFocus.disabled || nextFocus.getAttribute('aria-disabled') === 'true';\n if (!nextFocus.hasAttribute('tabindex') || nextFocusDisabled) {\n // Move to the next element.\n nextFocus = traversalFunction(list, nextFocus);\n } else {\n nextFocus.focus();\n return;\n }\n }\n};\nconst useUtilityClasses = ownerState => {\n const {\n vertical,\n fixed,\n hideScrollbar,\n scrollableX,\n scrollableY,\n centered,\n scrollButtonsHideMobile,\n classes\n } = ownerState;\n const slots = {\n root: ['root', vertical && 'vertical'],\n scroller: ['scroller', fixed && 'fixed', hideScrollbar && 'hideScrollbar', scrollableX && 'scrollableX', scrollableY && 'scrollableY'],\n flexContainer: ['flexContainer', vertical && 'flexContainerVertical', centered && 'centered'],\n indicator: ['indicator'],\n scrollButtons: ['scrollButtons', scrollButtonsHideMobile && 'scrollButtonsHideMobile'],\n scrollableX: [scrollableX && 'scrollableX'],\n hideScrollbar: [hideScrollbar && 'hideScrollbar']\n };\n return composeClasses(slots, getTabsUtilityClass, classes);\n};\nconst TabsRoot = styled('div', {\n name: 'MuiTabs',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [{\n [`& .${tabsClasses.scrollButtons}`]: styles.scrollButtons\n }, {\n [`& .${tabsClasses.scrollButtons}`]: ownerState.scrollButtonsHideMobile && styles.scrollButtonsHideMobile\n }, styles.root, ownerState.vertical && styles.vertical];\n }\n})(({\n ownerState,\n theme\n}) => _extends({\n overflow: 'hidden',\n minHeight: 48,\n // Add iOS momentum scrolling for iOS < 13.0\n WebkitOverflowScrolling: 'touch',\n display: 'flex'\n}, ownerState.vertical && {\n flexDirection: 'column'\n}, ownerState.scrollButtonsHideMobile && {\n [`& .${tabsClasses.scrollButtons}`]: {\n [theme.breakpoints.down('sm')]: {\n display: 'none'\n }\n }\n}));\nconst TabsScroller = styled('div', {\n name: 'MuiTabs',\n slot: 'Scroller',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.scroller, ownerState.fixed && styles.fixed, ownerState.hideScrollbar && styles.hideScrollbar, ownerState.scrollableX && styles.scrollableX, ownerState.scrollableY && styles.scrollableY];\n }\n})(({\n ownerState\n}) => _extends({\n position: 'relative',\n display: 'inline-block',\n flex: '1 1 auto',\n whiteSpace: 'nowrap'\n}, ownerState.fixed && {\n overflowX: 'hidden',\n width: '100%'\n}, ownerState.hideScrollbar && {\n // Hide dimensionless scrollbar on macOS\n scrollbarWidth: 'none',\n // Firefox\n '&::-webkit-scrollbar': {\n display: 'none' // Safari + Chrome\n }\n}, ownerState.scrollableX && {\n overflowX: 'auto',\n overflowY: 'hidden'\n}, ownerState.scrollableY && {\n overflowY: 'auto',\n overflowX: 'hidden'\n}));\nconst FlexContainer = styled('div', {\n name: 'MuiTabs',\n slot: 'FlexContainer',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.flexContainer, ownerState.vertical && styles.flexContainerVertical, ownerState.centered && styles.centered];\n }\n})(({\n ownerState\n}) => _extends({\n display: 'flex'\n}, ownerState.vertical && {\n flexDirection: 'column'\n}, ownerState.centered && {\n justifyContent: 'center'\n}));\nconst TabsIndicator = styled('span', {\n name: 'MuiTabs',\n slot: 'Indicator',\n overridesResolver: (props, styles) => styles.indicator\n})(({\n ownerState,\n theme\n}) => _extends({\n position: 'absolute',\n height: 2,\n bottom: 0,\n width: '100%',\n transition: theme.transitions.create()\n}, ownerState.indicatorColor === 'primary' && {\n backgroundColor: (theme.vars || theme).palette.primary.main\n}, ownerState.indicatorColor === 'secondary' && {\n backgroundColor: (theme.vars || theme).palette.secondary.main\n}, ownerState.vertical && {\n height: '100%',\n width: 2,\n right: 0\n}));\nconst TabsScrollbarSize = styled(ScrollbarSize, {\n name: 'MuiTabs',\n slot: 'ScrollbarSize'\n})({\n overflowX: 'auto',\n overflowY: 'hidden',\n // Hide dimensionless scrollbar on macOS\n scrollbarWidth: 'none',\n // Firefox\n '&::-webkit-scrollbar': {\n display: 'none' // Safari + Chrome\n }\n});\n\nconst defaultIndicatorStyle = {};\nlet warnedOnceTabPresent = false;\nconst Tabs = /*#__PURE__*/React.forwardRef(function Tabs(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiTabs'\n });\n const theme = useTheme();\n const isRtl = theme.direction === 'rtl';\n const {\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledBy,\n action,\n centered = false,\n children: childrenProp,\n className,\n component = 'div',\n allowScrollButtonsMobile = false,\n indicatorColor = 'primary',\n onChange,\n orientation = 'horizontal',\n ScrollButtonComponent = TabScrollButton,\n scrollButtons = 'auto',\n selectionFollowsFocus,\n slots = {},\n slotProps = {},\n TabIndicatorProps = {},\n TabScrollButtonProps = {},\n textColor = 'primary',\n value,\n variant = 'standard',\n visibleScrollbar = false\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const scrollable = variant === 'scrollable';\n const vertical = orientation === 'vertical';\n const scrollStart = vertical ? 'scrollTop' : 'scrollLeft';\n const start = vertical ? 'top' : 'left';\n const end = vertical ? 'bottom' : 'right';\n const clientSize = vertical ? 'clientHeight' : 'clientWidth';\n const size = vertical ? 'height' : 'width';\n const ownerState = _extends({}, props, {\n component,\n allowScrollButtonsMobile,\n indicatorColor,\n orientation,\n vertical,\n scrollButtons,\n textColor,\n variant,\n visibleScrollbar,\n fixed: !scrollable,\n hideScrollbar: scrollable && !visibleScrollbar,\n scrollableX: scrollable && !vertical,\n scrollableY: scrollable && vertical,\n centered: centered && !scrollable,\n scrollButtonsHideMobile: !allowScrollButtonsMobile\n });\n const classes = useUtilityClasses(ownerState);\n const startScrollButtonIconProps = useSlotProps({\n elementType: slots.StartScrollButtonIcon,\n externalSlotProps: slotProps.startScrollButtonIcon,\n ownerState\n });\n const endScrollButtonIconProps = useSlotProps({\n elementType: slots.EndScrollButtonIcon,\n externalSlotProps: slotProps.endScrollButtonIcon,\n ownerState\n });\n if (process.env.NODE_ENV !== 'production') {\n if (centered && scrollable) {\n console.error('MUI: You can not use the `centered={true}` and `variant=\"scrollable\"` properties ' + 'at the same time on a `Tabs` component.');\n }\n }\n const [mounted, setMounted] = React.useState(false);\n const [indicatorStyle, setIndicatorStyle] = React.useState(defaultIndicatorStyle);\n const [displayScroll, setDisplayScroll] = React.useState({\n start: false,\n end: false\n });\n const [scrollerStyle, setScrollerStyle] = React.useState({\n overflow: 'hidden',\n scrollbarWidth: 0\n });\n const valueToIndex = new Map();\n const tabsRef = React.useRef(null);\n const tabListRef = React.useRef(null);\n const getTabsMeta = () => {\n const tabsNode = tabsRef.current;\n let tabsMeta;\n if (tabsNode) {\n const rect = tabsNode.getBoundingClientRect();\n // create a new object with ClientRect class props + scrollLeft\n tabsMeta = {\n clientWidth: tabsNode.clientWidth,\n scrollLeft: tabsNode.scrollLeft,\n scrollTop: tabsNode.scrollTop,\n scrollLeftNormalized: getNormalizedScrollLeft(tabsNode, theme.direction),\n scrollWidth: tabsNode.scrollWidth,\n top: rect.top,\n bottom: rect.bottom,\n left: rect.left,\n right: rect.right\n };\n }\n let tabMeta;\n if (tabsNode && value !== false) {\n const children = tabListRef.current.children;\n if (children.length > 0) {\n const tab = children[valueToIndex.get(value)];\n if (process.env.NODE_ENV !== 'production') {\n if (!tab) {\n console.error([`MUI: The \\`value\\` provided to the Tabs component is invalid.`, `None of the Tabs' children match with \"${value}\".`, valueToIndex.keys ? `You can provide one of the following values: ${Array.from(valueToIndex.keys()).join(', ')}.` : null].join('\\n'));\n }\n }\n tabMeta = tab ? tab.getBoundingClientRect() : null;\n if (process.env.NODE_ENV !== 'production') {\n if (process.env.NODE_ENV !== 'test' && !warnedOnceTabPresent && tabMeta && tabMeta.width === 0 && tabMeta.height === 0 &&\n // if the whole Tabs component is hidden, don't warn\n tabsMeta.clientWidth !== 0) {\n tabsMeta = null;\n console.error(['MUI: The `value` provided to the Tabs component is invalid.', `The Tab with this \\`value\\` (\"${value}\") is not part of the document layout.`, \"Make sure the tab item is present in the document or that it's not `display: none`.\"].join('\\n'));\n warnedOnceTabPresent = true;\n }\n }\n }\n }\n return {\n tabsMeta,\n tabMeta\n };\n };\n const updateIndicatorState = useEventCallback(() => {\n const {\n tabsMeta,\n tabMeta\n } = getTabsMeta();\n let startValue = 0;\n let startIndicator;\n if (vertical) {\n startIndicator = 'top';\n if (tabMeta && tabsMeta) {\n startValue = tabMeta.top - tabsMeta.top + tabsMeta.scrollTop;\n }\n } else {\n startIndicator = isRtl ? 'right' : 'left';\n if (tabMeta && tabsMeta) {\n const correction = isRtl ? tabsMeta.scrollLeftNormalized + tabsMeta.clientWidth - tabsMeta.scrollWidth : tabsMeta.scrollLeft;\n startValue = (isRtl ? -1 : 1) * (tabMeta[startIndicator] - tabsMeta[startIndicator] + correction);\n }\n }\n const newIndicatorStyle = {\n [startIndicator]: startValue,\n // May be wrong until the font is loaded.\n [size]: tabMeta ? tabMeta[size] : 0\n };\n\n // IE11 support, replace with Number.isNaN\n // eslint-disable-next-line no-restricted-globals\n if (isNaN(indicatorStyle[startIndicator]) || isNaN(indicatorStyle[size])) {\n setIndicatorStyle(newIndicatorStyle);\n } else {\n const dStart = Math.abs(indicatorStyle[startIndicator] - newIndicatorStyle[startIndicator]);\n const dSize = Math.abs(indicatorStyle[size] - newIndicatorStyle[size]);\n if (dStart >= 1 || dSize >= 1) {\n setIndicatorStyle(newIndicatorStyle);\n }\n }\n });\n const scroll = (scrollValue, {\n animation = true\n } = {}) => {\n if (animation) {\n animate(scrollStart, tabsRef.current, scrollValue, {\n duration: theme.transitions.duration.standard\n });\n } else {\n tabsRef.current[scrollStart] = scrollValue;\n }\n };\n const moveTabsScroll = delta => {\n let scrollValue = tabsRef.current[scrollStart];\n if (vertical) {\n scrollValue += delta;\n } else {\n scrollValue += delta * (isRtl ? -1 : 1);\n // Fix for Edge\n scrollValue *= isRtl && detectScrollType() === 'reverse' ? -1 : 1;\n }\n scroll(scrollValue);\n };\n const getScrollSize = () => {\n const containerSize = tabsRef.current[clientSize];\n let totalSize = 0;\n const children = Array.from(tabListRef.current.children);\n for (let i = 0; i < children.length; i += 1) {\n const tab = children[i];\n if (totalSize + tab[clientSize] > containerSize) {\n // If the first item is longer than the container size, then only scroll\n // by the container size.\n if (i === 0) {\n totalSize = containerSize;\n }\n break;\n }\n totalSize += tab[clientSize];\n }\n return totalSize;\n };\n const handleStartScrollClick = () => {\n moveTabsScroll(-1 * getScrollSize());\n };\n const handleEndScrollClick = () => {\n moveTabsScroll(getScrollSize());\n };\n\n // TODO Remove `.\n * If you wish to change that mapping, you can provide your own.\n * Alternatively, you can use the `component` prop.\n * @default {\n * h1: 'h1',\n * h2: 'h2',\n * h3: 'h3',\n * h4: 'h4',\n * h5: 'h5',\n * h6: 'h6',\n * subtitle1: 'h6',\n * subtitle2: 'h6',\n * body1: 'p',\n * body2: 'p',\n * inherit: 'p',\n * }\n */\n variantMapping: PropTypes /* @typescript-to-proptypes-ignore */.object\n} : void 0;\nexport default Typography;","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getSwitchBaseUtilityClass(slot) {\n return generateUtilityClass('PrivateSwitchBase', slot);\n}\nconst switchBaseClasses = generateUtilityClasses('PrivateSwitchBase', ['root', 'checked', 'disabled', 'input', 'edgeStart', 'edgeEnd']);\nexport default switchBaseClasses;","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"autoFocus\", \"checked\", \"checkedIcon\", \"className\", \"defaultChecked\", \"disabled\", \"disableFocusRipple\", \"edge\", \"icon\", \"id\", \"inputProps\", \"inputRef\", \"name\", \"onBlur\", \"onChange\", \"onFocus\", \"readOnly\", \"required\", \"tabIndex\", \"type\", \"value\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { refType } from '@mui/utils';\nimport { unstable_composeClasses as composeClasses } from '@mui/base';\nimport capitalize from '../utils/capitalize';\nimport styled from '../styles/styled';\nimport useControlled from '../utils/useControlled';\nimport useFormControl from '../FormControl/useFormControl';\nimport ButtonBase from '../ButtonBase';\nimport { getSwitchBaseUtilityClass } from './switchBaseClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n checked,\n disabled,\n edge\n } = ownerState;\n const slots = {\n root: ['root', checked && 'checked', disabled && 'disabled', edge && `edge${capitalize(edge)}`],\n input: ['input']\n };\n return composeClasses(slots, getSwitchBaseUtilityClass, classes);\n};\nconst SwitchBaseRoot = styled(ButtonBase)(({\n ownerState\n}) => _extends({\n padding: 9,\n borderRadius: '50%'\n}, ownerState.edge === 'start' && {\n marginLeft: ownerState.size === 'small' ? -3 : -12\n}, ownerState.edge === 'end' && {\n marginRight: ownerState.size === 'small' ? -3 : -12\n}));\nconst SwitchBaseInput = styled('input')({\n cursor: 'inherit',\n position: 'absolute',\n opacity: 0,\n width: '100%',\n height: '100%',\n top: 0,\n left: 0,\n margin: 0,\n padding: 0,\n zIndex: 1\n});\n\n/**\n * @ignore - internal component.\n */\nconst SwitchBase = /*#__PURE__*/React.forwardRef(function SwitchBase(props, ref) {\n const {\n autoFocus,\n checked: checkedProp,\n checkedIcon,\n className,\n defaultChecked,\n disabled: disabledProp,\n disableFocusRipple = false,\n edge = false,\n icon,\n id,\n inputProps,\n inputRef,\n name,\n onBlur,\n onChange,\n onFocus,\n readOnly,\n required = false,\n tabIndex,\n type,\n value\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const [checked, setCheckedState] = useControlled({\n controlled: checkedProp,\n default: Boolean(defaultChecked),\n name: 'SwitchBase',\n state: 'checked'\n });\n const muiFormControl = useFormControl();\n const handleFocus = event => {\n if (onFocus) {\n onFocus(event);\n }\n if (muiFormControl && muiFormControl.onFocus) {\n muiFormControl.onFocus(event);\n }\n };\n const handleBlur = event => {\n if (onBlur) {\n onBlur(event);\n }\n if (muiFormControl && muiFormControl.onBlur) {\n muiFormControl.onBlur(event);\n }\n };\n const handleInputChange = event => {\n // Workaround for https://github.com/facebook/react/issues/9023\n if (event.nativeEvent.defaultPrevented) {\n return;\n }\n const newChecked = event.target.checked;\n setCheckedState(newChecked);\n if (onChange) {\n // TODO v6: remove the second argument.\n onChange(event, newChecked);\n }\n };\n let disabled = disabledProp;\n if (muiFormControl) {\n if (typeof disabled === 'undefined') {\n disabled = muiFormControl.disabled;\n }\n }\n const hasLabelFor = type === 'checkbox' || type === 'radio';\n const ownerState = _extends({}, props, {\n checked,\n disabled,\n disableFocusRipple,\n edge\n });\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsxs(SwitchBaseRoot, _extends({\n component: \"span\",\n className: clsx(classes.root, className),\n centerRipple: true,\n focusRipple: !disableFocusRipple,\n disabled: disabled,\n tabIndex: null,\n role: undefined,\n onFocus: handleFocus,\n onBlur: handleBlur,\n ownerState: ownerState,\n ref: ref\n }, other, {\n children: [/*#__PURE__*/_jsx(SwitchBaseInput, _extends({\n autoFocus: autoFocus,\n checked: checkedProp,\n defaultChecked: defaultChecked,\n className: classes.input,\n disabled: disabled,\n id: hasLabelFor ? id : undefined,\n name: name,\n onChange: handleInputChange,\n readOnly: readOnly,\n ref: inputRef,\n required: required,\n ownerState: ownerState,\n tabIndex: tabIndex,\n type: type\n }, type === 'checkbox' && value === undefined ? {} : {\n value\n }, inputProps)), checked ? checkedIcon : icon]\n }));\n});\n\n// NB: If changed, please update Checkbox, Switch and Radio\n// so that the API documentation is updated.\nprocess.env.NODE_ENV !== \"production\" ? SwitchBase.propTypes = {\n /**\n * If `true`, the `input` element is focused during the first mount.\n */\n autoFocus: PropTypes.bool,\n /**\n * If `true`, the component is checked.\n */\n checked: PropTypes.bool,\n /**\n * The icon to display when the component is checked.\n */\n checkedIcon: PropTypes.node.isRequired,\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 * @ignore\n */\n className: PropTypes.string,\n /**\n * @ignore\n */\n defaultChecked: PropTypes.bool,\n /**\n * If `true`, the component is disabled.\n */\n disabled: PropTypes.bool,\n /**\n * If `true`, the keyboard focus ripple is disabled.\n * @default false\n */\n disableFocusRipple: PropTypes.bool,\n /**\n * If given, uses a negative margin to counteract the padding on one\n * side (this is often helpful for aligning the left or right\n * side of the icon with content above or below, without ruining the border\n * size and shape).\n * @default false\n */\n edge: PropTypes.oneOf(['end', 'start', false]),\n /**\n * The icon to display when the component is unchecked.\n */\n icon: PropTypes.node.isRequired,\n /**\n * The id of the `input` element.\n */\n id: PropTypes.string,\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 * Pass a ref to the `input` element.\n */\n inputRef: refType,\n /*\n * @ignore\n */\n name: PropTypes.string,\n /**\n * @ignore\n */\n onBlur: PropTypes.func,\n /**\n * Callback fired when the state is changed.\n *\n * @param {object} event The event source of the callback.\n * You can pull out the new checked state by accessing `event.target.checked` (boolean).\n */\n onChange: PropTypes.func,\n /**\n * @ignore\n */\n onFocus: PropTypes.func,\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 * If `true`, the `input` element is required.\n */\n required: PropTypes.bool,\n /**\n * The system prop that allows defining system overrides as well as additional CSS styles.\n */\n sx: PropTypes.object,\n /**\n * @ignore\n */\n tabIndex: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n /**\n * The input component prop `type`.\n */\n type: PropTypes.string.isRequired,\n /**\n * The value of the component.\n */\n value: PropTypes.any\n} : void 0;\nexport default SwitchBase;","import * as React from 'react';\nimport createSvgIcon from '../../utils/createSvgIcon';\n\n/**\n * @ignore - internal component.\n */\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M7 10l5 5 5-5z\"\n}), 'ArrowDropDown');","import * as React from 'react';\nimport createSvgIcon from '../../utils/createSvgIcon';\n\n/**\n * @ignore - internal component.\n *\n * Alias to `Clear`.\n */\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"\n}), 'Close');","import * as React from 'react';\nimport createSvgIcon from '../../utils/createSvgIcon';\n\n/**\n * @ignore - internal component.\n */\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z\"\n}), 'KeyboardArrowLeft');","import * as React from 'react';\nimport createSvgIcon from '../../utils/createSvgIcon';\n\n/**\n * @ignore - internal component.\n */\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z\"\n}), 'KeyboardArrowRight');","import * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { elementAcceptingRef, exactProp, unstable_ownerDocument as ownerDocument, unstable_useForkRef as useForkRef, unstable_useEventCallback as useEventCallback } from '@mui/utils';\n\n// TODO: return `EventHandlerName extends `on${infer EventName}` ? Lowercase : never` once generatePropTypes runs with TS 4.1\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction mapEventPropToEvent(eventProp) {\n return eventProp.substring(2).toLowerCase();\n}\nfunction clickedRootScrollbar(event, doc) {\n return doc.documentElement.clientWidth < event.clientX || doc.documentElement.clientHeight < event.clientY;\n}\n/**\n * Listen for click events that occur somewhere in the document, outside of the element itself.\n * For instance, if you need to hide a menu when people click anywhere else on your page.\n *\n * Demos:\n *\n * - [Click-Away Listener](https://mui.com/base-ui/react-click-away-listener/)\n *\n * API:\n *\n * - [ClickAwayListener API](https://mui.com/base-ui/react-click-away-listener/components-api/#click-away-listener)\n */\nfunction ClickAwayListener(props) {\n const {\n children,\n disableReactTree = false,\n mouseEvent = 'onClick',\n onClickAway,\n touchEvent = 'onTouchEnd'\n } = props;\n const movedRef = React.useRef(false);\n const nodeRef = React.useRef(null);\n const activatedRef = React.useRef(false);\n const syntheticEventRef = React.useRef(false);\n React.useEffect(() => {\n // Ensure that this component is not \"activated\" synchronously.\n // https://github.com/facebook/react/issues/20074\n setTimeout(() => {\n activatedRef.current = true;\n }, 0);\n return () => {\n activatedRef.current = false;\n };\n }, []);\n const handleRef = useForkRef(\n // @ts-expect-error TODO upstream fix\n children.ref, nodeRef);\n\n // The handler doesn't take event.defaultPrevented into account:\n //\n // event.preventDefault() is meant to stop default behaviors 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 const handleClickAway = useEventCallback(event => {\n // Given developers can stop the propagation of the synthetic event,\n // we can only be confident with a positive value.\n const insideReactTree = syntheticEventRef.current;\n syntheticEventRef.current = false;\n const doc = ownerDocument(nodeRef.current);\n\n // 1. IE11 support, which trigger the handleClickAway even after the unbind\n // 2. The child might render null.\n // 3. Behave like a blur listener.\n if (!activatedRef.current || !nodeRef.current || 'clientX' in event && clickedRootScrollbar(event, doc)) {\n return;\n }\n\n // Do not act if user performed touchmove\n if (movedRef.current) {\n movedRef.current = false;\n return;\n }\n let insideDOM;\n\n // If not enough, can use https://github.com/DieterHolvoet/event-propagation-path/blob/master/propagationPath.js\n if (event.composedPath) {\n insideDOM = event.composedPath().indexOf(nodeRef.current) > -1;\n } else {\n insideDOM = !doc.documentElement.contains(\n // @ts-expect-error returns `false` as intended when not dispatched from a Node\n event.target) || nodeRef.current.contains(\n // @ts-expect-error returns `false` as intended when not dispatched from a Node\n event.target);\n }\n if (!insideDOM && (disableReactTree || !insideReactTree)) {\n onClickAway(event);\n }\n });\n\n // Keep track of mouse/touch events that bubbled up through the portal.\n const createHandleSynthetic = handlerName => event => {\n syntheticEventRef.current = true;\n const childrenPropsHandler = children.props[handlerName];\n if (childrenPropsHandler) {\n childrenPropsHandler(event);\n }\n };\n const childrenProps = {\n ref: handleRef\n };\n if (touchEvent !== false) {\n childrenProps[touchEvent] = createHandleSynthetic(touchEvent);\n }\n React.useEffect(() => {\n if (touchEvent !== false) {\n const mappedTouchEvent = mapEventPropToEvent(touchEvent);\n const doc = ownerDocument(nodeRef.current);\n const handleTouchMove = () => {\n movedRef.current = true;\n };\n doc.addEventListener(mappedTouchEvent, handleClickAway);\n doc.addEventListener('touchmove', handleTouchMove);\n return () => {\n doc.removeEventListener(mappedTouchEvent, handleClickAway);\n doc.removeEventListener('touchmove', handleTouchMove);\n };\n }\n return undefined;\n }, [handleClickAway, touchEvent]);\n if (mouseEvent !== false) {\n childrenProps[mouseEvent] = createHandleSynthetic(mouseEvent);\n }\n React.useEffect(() => {\n if (mouseEvent !== false) {\n const mappedMouseEvent = mapEventPropToEvent(mouseEvent);\n const doc = ownerDocument(nodeRef.current);\n doc.addEventListener(mappedMouseEvent, handleClickAway);\n return () => {\n doc.removeEventListener(mappedMouseEvent, handleClickAway);\n };\n }\n return undefined;\n }, [handleClickAway, mouseEvent]);\n return /*#__PURE__*/_jsx(React.Fragment, {\n children: /*#__PURE__*/React.cloneElement(children, childrenProps)\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? ClickAwayListener.propTypes /* remove-proptypes */ = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n /**\n * The wrapped element.\n */\n children: elementAcceptingRef.isRequired,\n /**\n * If `true`, the React tree is ignored and only the DOM tree is considered.\n * This prop changes how portaled elements are handled.\n * @default false\n */\n disableReactTree: PropTypes.bool,\n /**\n * The mouse event to listen to. You can disable the listener by providing `false`.\n * @default 'onClick'\n */\n mouseEvent: PropTypes.oneOf(['onClick', 'onMouseDown', 'onMouseUp', 'onPointerDown', 'onPointerUp', false]),\n /**\n * Callback fired when a \"click away\" event is detected.\n */\n onClickAway: PropTypes.func.isRequired,\n /**\n * The touch event to listen to. You can disable the listener by providing `false`.\n * @default 'onTouchEnd'\n */\n touchEvent: PropTypes.oneOf(['onTouchEnd', 'onTouchStart', false])\n} : void 0;\nif (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line\n ClickAwayListener['propTypes' + ''] = exactProp(ClickAwayListener.propTypes);\n}\nexport default ClickAwayListener;","/* eslint-disable consistent-return, jsx-a11y/no-noninteractive-tabindex */\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { exactProp, elementAcceptingRef, unstable_useForkRef as useForkRef, unstable_ownerDocument as ownerDocument } from '@mui/utils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\n// Inspired by https://github.com/focus-trap/tabbable\nconst candidatesSelector = ['input', 'select', 'textarea', 'a[href]', 'button', '[tabindex]', 'audio[controls]', 'video[controls]', '[contenteditable]:not([contenteditable=\"false\"])'].join(',');\nfunction getTabIndex(node) {\n const tabindexAttr = parseInt(node.getAttribute('tabindex') || '', 10);\n if (!Number.isNaN(tabindexAttr)) {\n return tabindexAttr;\n }\n\n // Browsers do not return `tabIndex` correctly for contentEditable nodes;\n // https://bugs.chromium.org/p/chromium/issues/detail?id=661108&q=contenteditable%20tabindex&can=2\n // so if they don't have a tabindex attribute specifically set, assume it's 0.\n // in Chrome, = contrastThreshold ? dark.text.primary : light.text.primary;\n if (process.env.NODE_ENV !== 'production') {\n const contrast = getContrastRatio(background, contrastText);\n if (contrast < 3) {\n console.error([`MUI: The contrast ratio of ${contrast}:1 for ${contrastText} on ${background}`, 'falls below the WCAG recommended absolute minimum contrast ratio of 3:1.', 'https://www.w3.org/TR/2008/REC-WCAG20-20081211/#visual-audio-contrast-contrast'].join('\\n'));\n }\n }\n return contrastText;\n }\n const augmentColor = ({\n color,\n name,\n mainShade = 500,\n lightShade = 300,\n darkShade = 700\n }) => {\n color = _extends({}, color);\n if (!color.main && color[mainShade]) {\n color.main = color[mainShade];\n }\n if (!color.hasOwnProperty('main')) {\n throw new Error(process.env.NODE_ENV !== \"production\" ? `MUI: The color${name ? ` (${name})` : ''} provided to augmentColor(color) is invalid.\nThe color object needs to have a \\`main\\` property or a \\`${mainShade}\\` property.` : _formatMuiErrorMessage(11, name ? ` (${name})` : '', mainShade));\n }\n if (typeof color.main !== 'string') {\n throw new Error(process.env.NODE_ENV !== \"production\" ? `MUI: The color${name ? ` (${name})` : ''} provided to augmentColor(color) is invalid.\n\\`color.main\\` should be a string, but \\`${JSON.stringify(color.main)}\\` was provided instead.\n\nDid you intend to use one of the following approaches?\n\nimport { green } from \"@mui/material/colors\";\n\nconst theme1 = createTheme({ palette: {\n primary: green,\n} });\n\nconst theme2 = createTheme({ palette: {\n primary: { main: green[500] },\n} });` : _formatMuiErrorMessage(12, name ? ` (${name})` : '', JSON.stringify(color.main)));\n }\n addLightOrDark(color, 'light', lightShade, tonalOffset);\n addLightOrDark(color, 'dark', darkShade, tonalOffset);\n if (!color.contrastText) {\n color.contrastText = getContrastText(color.main);\n }\n return color;\n };\n const modes = {\n dark,\n light\n };\n if (process.env.NODE_ENV !== 'production') {\n if (!modes[mode]) {\n console.error(`MUI: The palette mode \\`${mode}\\` is not supported.`);\n }\n }\n const paletteOutput = deepmerge(_extends({\n // A collection of common colors.\n common: _extends({}, common),\n // prevent mutable object.\n // The palette mode, can be light or dark.\n mode,\n // The colors used to represent primary interface elements for a user.\n primary: augmentColor({\n color: primary,\n name: 'primary'\n }),\n // The colors used to represent secondary interface elements for a user.\n secondary: augmentColor({\n color: secondary,\n name: 'secondary',\n mainShade: 'A400',\n lightShade: 'A200',\n darkShade: 'A700'\n }),\n // The colors used to represent interface elements that the user should be made aware of.\n error: augmentColor({\n color: error,\n name: 'error'\n }),\n // The colors used to represent potentially dangerous actions or important messages.\n warning: augmentColor({\n color: warning,\n name: 'warning'\n }),\n // The colors used to present information to the user that is neutral and not necessarily important.\n info: augmentColor({\n color: info,\n name: 'info'\n }),\n // The colors used to indicate the successful completion of an action that user triggered.\n success: augmentColor({\n color: success,\n name: 'success'\n }),\n // The grey colors.\n grey,\n // Used by `getContrastText()` to maximize the contrast between\n // the background and the text.\n contrastThreshold,\n // Takes a background color and returns the text color that maximizes the contrast.\n getContrastText,\n // Generate a rich color object.\n augmentColor,\n // Used by the functions below to shift a color's luminance by approximately\n // two indexes within its tonal palette.\n // E.g., shift from Red 500 to Red 300 or Red 700.\n tonalOffset\n }, modes[mode]), other);\n return paletteOutput;\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"fontFamily\", \"fontSize\", \"fontWeightLight\", \"fontWeightRegular\", \"fontWeightMedium\", \"fontWeightBold\", \"htmlFontSize\", \"allVariants\", \"pxToRem\"];\nimport { deepmerge } from '@mui/utils';\nfunction round(value) {\n return Math.round(value * 1e5) / 1e5;\n}\nconst caseAllCaps = {\n textTransform: 'uppercase'\n};\nconst defaultFontFamily = '\"Roboto\", \"Helvetica\", \"Arial\", sans-serif';\n\n/**\n * @see @link{https://m2.material.io/design/typography/the-type-system.html}\n * @see @link{https://m2.material.io/design/typography/understanding-typography.html}\n */\nexport default function createTypography(palette, typography) {\n const _ref = typeof typography === 'function' ? typography(palette) : typography,\n {\n fontFamily = defaultFontFamily,\n // The default font size of the Material Specification.\n fontSize = 14,\n // px\n fontWeightLight = 300,\n fontWeightRegular = 400,\n fontWeightMedium = 500,\n fontWeightBold = 700,\n // Tell MUI what's the font-size on the html element.\n // 16px is the default font-size used by browsers.\n htmlFontSize = 16,\n // Apply the CSS properties to all the variants.\n allVariants,\n pxToRem: pxToRem2\n } = _ref,\n other = _objectWithoutPropertiesLoose(_ref, _excluded);\n if (process.env.NODE_ENV !== 'production') {\n if (typeof fontSize !== 'number') {\n console.error('MUI: `fontSize` is required to be a number.');\n }\n if (typeof htmlFontSize !== 'number') {\n console.error('MUI: `htmlFontSize` is required to be a number.');\n }\n }\n const coef = fontSize / 14;\n const pxToRem = pxToRem2 || (size => `${size / htmlFontSize * coef}rem`);\n const buildVariant = (fontWeight, size, lineHeight, letterSpacing, casing) => _extends({\n fontFamily,\n fontWeight,\n fontSize: pxToRem(size),\n // Unitless following https://meyerweb.com/eric/thoughts/2006/02/08/unitless-line-heights/\n lineHeight\n }, fontFamily === defaultFontFamily ? {\n letterSpacing: `${round(letterSpacing / size)}em`\n } : {}, casing, allVariants);\n const variants = {\n h1: buildVariant(fontWeightLight, 96, 1.167, -1.5),\n h2: buildVariant(fontWeightLight, 60, 1.2, -0.5),\n h3: buildVariant(fontWeightRegular, 48, 1.167, 0),\n h4: buildVariant(fontWeightRegular, 34, 1.235, 0.25),\n h5: buildVariant(fontWeightRegular, 24, 1.334, 0),\n h6: buildVariant(fontWeightMedium, 20, 1.6, 0.15),\n subtitle1: buildVariant(fontWeightRegular, 16, 1.75, 0.15),\n subtitle2: buildVariant(fontWeightMedium, 14, 1.57, 0.1),\n body1: buildVariant(fontWeightRegular, 16, 1.5, 0.15),\n body2: buildVariant(fontWeightRegular, 14, 1.43, 0.15),\n button: buildVariant(fontWeightMedium, 14, 1.75, 0.4, caseAllCaps),\n caption: buildVariant(fontWeightRegular, 12, 1.66, 0.4),\n overline: buildVariant(fontWeightRegular, 12, 2.66, 1, caseAllCaps),\n inherit: {\n fontFamily: 'inherit',\n fontWeight: 'inherit',\n fontSize: 'inherit',\n lineHeight: 'inherit',\n letterSpacing: 'inherit'\n }\n };\n return deepmerge(_extends({\n htmlFontSize,\n pxToRem,\n fontFamily,\n fontSize,\n fontWeightLight,\n fontWeightRegular,\n fontWeightMedium,\n fontWeightBold\n }, variants), other, {\n clone: false // No need to clone deep\n });\n}","const shadowKeyUmbraOpacity = 0.2;\nconst shadowKeyPenumbraOpacity = 0.14;\nconst shadowAmbientShadowOpacity = 0.12;\nfunction createShadow(...px) {\n return [`${px[0]}px ${px[1]}px ${px[2]}px ${px[3]}px rgba(0,0,0,${shadowKeyUmbraOpacity})`, `${px[4]}px ${px[5]}px ${px[6]}px ${px[7]}px rgba(0,0,0,${shadowKeyPenumbraOpacity})`, `${px[8]}px ${px[9]}px ${px[10]}px ${px[11]}px rgba(0,0,0,${shadowAmbientShadowOpacity})`].join(',');\n}\n\n// Values from https://github.com/material-components/material-components-web/blob/be8747f94574669cb5e7add1a7c54fa41a89cec7/packages/mdc-elevation/_variables.scss\nconst shadows = ['none', createShadow(0, 2, 1, -1, 0, 1, 1, 0, 0, 1, 3, 0), createShadow(0, 3, 1, -2, 0, 2, 2, 0, 0, 1, 5, 0), createShadow(0, 3, 3, -2, 0, 3, 4, 0, 0, 1, 8, 0), createShadow(0, 2, 4, -1, 0, 4, 5, 0, 0, 1, 10, 0), createShadow(0, 3, 5, -1, 0, 5, 8, 0, 0, 1, 14, 0), createShadow(0, 3, 5, -1, 0, 6, 10, 0, 0, 1, 18, 0), createShadow(0, 4, 5, -2, 0, 7, 10, 1, 0, 2, 16, 1), createShadow(0, 5, 5, -3, 0, 8, 10, 1, 0, 3, 14, 2), createShadow(0, 5, 6, -3, 0, 9, 12, 1, 0, 3, 16, 2), createShadow(0, 6, 6, -3, 0, 10, 14, 1, 0, 4, 18, 3), createShadow(0, 6, 7, -4, 0, 11, 15, 1, 0, 4, 20, 3), createShadow(0, 7, 8, -4, 0, 12, 17, 2, 0, 5, 22, 4), createShadow(0, 7, 8, -4, 0, 13, 19, 2, 0, 5, 24, 4), createShadow(0, 7, 9, -4, 0, 14, 21, 2, 0, 5, 26, 4), createShadow(0, 8, 9, -5, 0, 15, 22, 2, 0, 6, 28, 5), createShadow(0, 8, 10, -5, 0, 16, 24, 2, 0, 6, 30, 5), createShadow(0, 8, 11, -5, 0, 17, 26, 2, 0, 6, 32, 5), createShadow(0, 9, 11, -5, 0, 18, 28, 2, 0, 7, 34, 6), createShadow(0, 9, 12, -6, 0, 19, 29, 2, 0, 7, 36, 6), createShadow(0, 10, 13, -6, 0, 20, 31, 3, 0, 8, 38, 7), createShadow(0, 10, 13, -6, 0, 21, 33, 3, 0, 8, 40, 7), createShadow(0, 10, 14, -6, 0, 22, 35, 3, 0, 8, 42, 7), createShadow(0, 11, 14, -7, 0, 23, 36, 3, 0, 9, 44, 8), createShadow(0, 11, 15, -7, 0, 24, 38, 3, 0, 9, 46, 8)];\nexport default shadows;","// We need to centralize the zIndex definitions as they work\n// like global values in the browser.\nconst zIndex = {\n mobileStepper: 1000,\n fab: 1050,\n speedDial: 1050,\n appBar: 1100,\n drawer: 1200,\n modal: 1300,\n snackbar: 1400,\n tooltip: 1500\n};\nexport default zIndex;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport { formatMuiErrorMessage as _formatMuiErrorMessage } from \"@mui/utils\";\nconst _excluded = [\"breakpoints\", \"mixins\", \"spacing\", \"palette\", \"transitions\", \"typography\", \"shape\"];\nimport { deepmerge } from '@mui/utils';\nimport { createTheme as systemCreateTheme, unstable_defaultSxConfig as defaultSxConfig, unstable_styleFunctionSx as styleFunctionSx } from '@mui/system';\nimport generateUtilityClass from '../generateUtilityClass';\nimport createMixins from './createMixins';\nimport createPalette from './createPalette';\nimport createTypography from './createTypography';\nimport shadows from './shadows';\nimport createTransitions from './createTransitions';\nimport zIndex from './zIndex';\nfunction createTheme(options = {}, ...args) {\n const {\n mixins: mixinsInput = {},\n palette: paletteInput = {},\n transitions: transitionsInput = {},\n typography: typographyInput = {}\n } = options,\n other = _objectWithoutPropertiesLoose(options, _excluded);\n if (options.vars) {\n throw new Error(process.env.NODE_ENV !== \"production\" ? `MUI: \\`vars\\` is a private field used for CSS variables support.\nPlease use another name.` : _formatMuiErrorMessage(18));\n }\n const palette = createPalette(paletteInput);\n const systemTheme = systemCreateTheme(options);\n let muiTheme = deepmerge(systemTheme, {\n mixins: createMixins(systemTheme.breakpoints, mixinsInput),\n palette,\n // Don't use [...shadows] until you've verified its transpiled code is not invoking the iterator protocol.\n shadows: shadows.slice(),\n typography: createTypography(palette, typographyInput),\n transitions: createTransitions(transitionsInput),\n zIndex: _extends({}, zIndex)\n });\n muiTheme = deepmerge(muiTheme, other);\n muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);\n if (process.env.NODE_ENV !== 'production') {\n // TODO v6: Refactor to use globalStateClassesMapping from @mui/utils once `readOnly` state class is used in Rating component.\n const stateClasses = ['active', 'checked', 'completed', 'disabled', 'error', 'expanded', 'focused', 'focusVisible', 'required', 'selected'];\n const traverse = (node, component) => {\n let key;\n\n // eslint-disable-next-line guard-for-in, no-restricted-syntax\n for (key in node) {\n const child = node[key];\n if (stateClasses.indexOf(key) !== -1 && Object.keys(child).length > 0) {\n if (process.env.NODE_ENV !== 'production') {\n const stateClass = generateUtilityClass('', key);\n console.error([`MUI: The \\`${component}\\` component increases ` + `the CSS specificity of the \\`${key}\\` internal state.`, 'You can not override it like this: ', JSON.stringify(node, null, 2), '', `Instead, you need to use the '&.${stateClass}' syntax:`, JSON.stringify({\n root: {\n [`&.${stateClass}`]: child\n }\n }, null, 2), '', 'https://mui.com/r/state-classes-guide'].join('\\n'));\n }\n // Remove the style to prevent global conflicts.\n node[key] = {};\n }\n }\n };\n Object.keys(muiTheme.components).forEach(component => {\n const styleOverrides = muiTheme.components[component].styleOverrides;\n if (styleOverrides && component.indexOf('Mui') === 0) {\n traverse(styleOverrides, component);\n }\n });\n }\n muiTheme.unstable_sxConfig = _extends({}, defaultSxConfig, other == null ? void 0 : other.unstable_sxConfig);\n muiTheme.unstable_sx = function sx(props) {\n return styleFunctionSx({\n sx: props,\n theme: this\n });\n };\n return muiTheme;\n}\nlet warnedOnce = false;\nexport function createMuiTheme(...args) {\n if (process.env.NODE_ENV !== 'production') {\n if (!warnedOnce) {\n warnedOnce = true;\n console.error(['MUI: the createMuiTheme function was renamed to createTheme.', '', \"You should use `import { createTheme } from '@mui/material/styles'`\"].join('\\n'));\n }\n }\n return createTheme(...args);\n}\nexport default createTheme;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nexport default function createMixins(breakpoints, mixins) {\n return _extends({\n toolbar: {\n minHeight: 56,\n [breakpoints.up('xs')]: {\n '@media (orientation: landscape)': {\n minHeight: 48\n }\n },\n [breakpoints.up('sm')]: {\n minHeight: 64\n }\n }\n }, mixins);\n}","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"duration\", \"easing\", \"delay\"];\n// Follow https://material.google.com/motion/duration-easing.html#duration-easing-natural-easing-curves\n// to learn the context in which each easing should be used.\nexport const easing = {\n // This is the most common easing curve.\n easeInOut: 'cubic-bezier(0.4, 0, 0.2, 1)',\n // Objects enter the screen at full velocity from off-screen and\n // slowly decelerate to a resting point.\n easeOut: 'cubic-bezier(0.0, 0, 0.2, 1)',\n // Objects leave the screen at full velocity. They do not decelerate when off-screen.\n easeIn: 'cubic-bezier(0.4, 0, 1, 1)',\n // The sharp curve is used by objects that may return to the screen at any time.\n sharp: 'cubic-bezier(0.4, 0, 0.6, 1)'\n};\n\n// Follow https://m2.material.io/guidelines/motion/duration-easing.html#duration-easing-common-durations\n// to learn when use what timing\nexport const duration = {\n shortest: 150,\n shorter: 200,\n short: 250,\n // most basic recommended timing\n standard: 300,\n // this is to be used in complex animations\n complex: 375,\n // recommended when something is entering screen\n enteringScreen: 225,\n // recommended when something is leaving screen\n leavingScreen: 195\n};\nfunction formatMs(milliseconds) {\n return `${Math.round(milliseconds)}ms`;\n}\nfunction getAutoHeightDuration(height) {\n if (!height) {\n return 0;\n }\n const constant = height / 36;\n\n // https://www.wolframalpha.com/input/?i=(4+%2B+15+*+(x+%2F+36+)+**+0.25+%2B+(x+%2F+36)+%2F+5)+*+10\n return Math.round((4 + 15 * constant ** 0.25 + constant / 5) * 10);\n}\nexport default function createTransitions(inputTransitions) {\n const mergedEasing = _extends({}, easing, inputTransitions.easing);\n const mergedDuration = _extends({}, duration, inputTransitions.duration);\n const create = (props = ['all'], options = {}) => {\n const {\n duration: durationOption = mergedDuration.standard,\n easing: easingOption = mergedEasing.easeInOut,\n delay = 0\n } = options,\n other = _objectWithoutPropertiesLoose(options, _excluded);\n if (process.env.NODE_ENV !== 'production') {\n const isString = value => typeof value === 'string';\n // IE11 support, replace with Number.isNaN\n // eslint-disable-next-line no-restricted-globals\n const isNumber = value => !isNaN(parseFloat(value));\n if (!isString(props) && !Array.isArray(props)) {\n console.error('MUI: Argument \"props\" must be a string or Array.');\n }\n if (!isNumber(durationOption) && !isString(durationOption)) {\n console.error(`MUI: Argument \"duration\" must be a number or a string but found ${durationOption}.`);\n }\n if (!isString(easingOption)) {\n console.error('MUI: Argument \"easing\" must be a string.');\n }\n if (!isNumber(delay) && !isString(delay)) {\n console.error('MUI: Argument \"delay\" must be a number or a string.');\n }\n if (Object.keys(other).length !== 0) {\n console.error(`MUI: Unrecognized argument(s) [${Object.keys(other).join(',')}].`);\n }\n }\n return (Array.isArray(props) ? props : [props]).map(animatedProp => `${animatedProp} ${typeof durationOption === 'string' ? durationOption : formatMs(durationOption)} ${easingOption} ${typeof delay === 'string' ? delay : formatMs(delay)}`).join(',');\n };\n return _extends({\n getAutoHeightDuration,\n create\n }, inputTransitions, {\n easing: mergedEasing,\n duration: mergedDuration\n });\n}","import createTheme from './createTheme';\nconst defaultTheme = createTheme();\nexport default defaultTheme;","export default '$$material';","import { createStyled, shouldForwardProp } from '@mui/system';\nimport defaultTheme from './defaultTheme';\nimport THEME_ID from './identifier';\nexport const rootShouldForwardProp = prop => shouldForwardProp(prop) && prop !== 'classes';\nexport const slotShouldForwardProp = shouldForwardProp;\nconst styled = createStyled({\n themeId: THEME_ID,\n defaultTheme,\n rootShouldForwardProp\n});\nexport default styled;","import * as React from 'react';\nimport { useTheme as useThemeSystem } from '@mui/system';\nimport defaultTheme from './defaultTheme';\nimport THEME_ID from './identifier';\nexport default function useTheme() {\n const theme = useThemeSystem(defaultTheme);\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useDebugValue(theme);\n }\n return theme[THEME_ID] || theme;\n}","import { useThemeProps as systemUseThemeProps } from '@mui/system';\nimport defaultTheme from './defaultTheme';\nimport THEME_ID from './identifier';\nexport default function useThemeProps({\n props,\n name\n}) {\n return systemUseThemeProps({\n props,\n name,\n defaultTheme,\n themeId: THEME_ID\n });\n}","export const reflow = node => node.scrollTop;\nexport function getTransitionProps(props, options) {\n var _style$transitionDura, _style$transitionTimi;\n const {\n timeout,\n easing,\n style = {}\n } = props;\n return {\n duration: (_style$transitionDura = style.transitionDuration) != null ? _style$transitionDura : typeof timeout === 'number' ? timeout : timeout[options.mode] || 0,\n easing: (_style$transitionTimi = style.transitionTimingFunction) != null ? _style$transitionTimi : typeof easing === 'object' ? easing[options.mode] : easing,\n delay: style.transitionDelay\n };\n}","import * as React from 'react';\nimport { getThemeProps, useThemeWithoutDefault as useTheme } from '@mui/system';\nimport useEnhancedEffect from '../utils/useEnhancedEffect';\n\n/**\n * @deprecated Not used internally. Use `MediaQueryListEvent` from lib.dom.d.ts instead.\n */\n\n/**\n * @deprecated Not used internally. Use `MediaQueryList` from lib.dom.d.ts instead.\n */\n\n/**\n * @deprecated Not used internally. Use `(event: MediaQueryListEvent) => void` instead.\n */\n\nfunction useMediaQueryOld(query, defaultMatches, matchMedia, ssrMatchMedia, noSsr) {\n const [match, setMatch] = React.useState(() => {\n if (noSsr && matchMedia) {\n return matchMedia(query).matches;\n }\n if (ssrMatchMedia) {\n return ssrMatchMedia(query).matches;\n }\n\n // Once the component is mounted, we rely on the\n // event listeners to return the correct matches value.\n return defaultMatches;\n });\n useEnhancedEffect(() => {\n let active = true;\n if (!matchMedia) {\n return undefined;\n }\n const queryList = matchMedia(query);\n const updateMatch = () => {\n // Workaround Safari wrong implementation of matchMedia\n // TODO can we remove it?\n // https://github.com/mui/material-ui/pull/17315#issuecomment-528286677\n if (active) {\n setMatch(queryList.matches);\n }\n };\n updateMatch();\n // TODO: Use `addEventListener` once support for Safari < 14 is dropped\n queryList.addListener(updateMatch);\n return () => {\n active = false;\n queryList.removeListener(updateMatch);\n };\n }, [query, matchMedia]);\n return match;\n}\n\n// eslint-disable-next-line no-useless-concat -- Workaround for https://github.com/webpack/webpack/issues/14814\nconst maybeReactUseSyncExternalStore = React['useSyncExternalStore' + ''];\nfunction useMediaQueryNew(query, defaultMatches, matchMedia, ssrMatchMedia, noSsr) {\n const getDefaultSnapshot = React.useCallback(() => defaultMatches, [defaultMatches]);\n const getServerSnapshot = React.useMemo(() => {\n if (noSsr && matchMedia) {\n return () => matchMedia(query).matches;\n }\n if (ssrMatchMedia !== null) {\n const {\n matches\n } = ssrMatchMedia(query);\n return () => matches;\n }\n return getDefaultSnapshot;\n }, [getDefaultSnapshot, query, ssrMatchMedia, noSsr, matchMedia]);\n const [getSnapshot, subscribe] = React.useMemo(() => {\n if (matchMedia === null) {\n return [getDefaultSnapshot, () => () => {}];\n }\n const mediaQueryList = matchMedia(query);\n return [() => mediaQueryList.matches, notify => {\n // TODO: Use `addEventListener` once support for Safari < 14 is dropped\n mediaQueryList.addListener(notify);\n return () => {\n mediaQueryList.removeListener(notify);\n };\n }];\n }, [getDefaultSnapshot, matchMedia, query]);\n const match = maybeReactUseSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);\n return match;\n}\nexport default function useMediaQuery(queryInput, options = {}) {\n const theme = useTheme();\n // Wait for jsdom to support the match media feature.\n // All the browsers MUI support have this built-in.\n // This defensive check is here for simplicity.\n // Most of the time, the match media logic isn't central to people tests.\n const supportMatchMedia = typeof window !== 'undefined' && typeof window.matchMedia !== 'undefined';\n const {\n defaultMatches = false,\n matchMedia = supportMatchMedia ? window.matchMedia : null,\n ssrMatchMedia = null,\n noSsr = false\n } = getThemeProps({\n name: 'MuiUseMediaQuery',\n props: options,\n theme\n });\n if (process.env.NODE_ENV !== 'production') {\n if (typeof queryInput === 'function' && theme === null) {\n console.error(['MUI: The `query` argument provided is invalid.', 'You are providing a function without a theme in the context.', 'One of the parent elements needs to use a ThemeProvider.'].join('\\n'));\n }\n }\n let query = typeof queryInput === 'function' ? queryInput(theme) : queryInput;\n query = query.replace(/^@media( ?)/m, '');\n\n // TODO: Drop `useMediaQueryOld` and use `use-sync-external-store` shim in `useMediaQueryNew` once the package is stable\n const useMediaQueryImplementation = maybeReactUseSyncExternalStore !== undefined ? useMediaQueryNew : useMediaQueryOld;\n const match = useMediaQueryImplementation(query, defaultMatches, matchMedia, ssrMatchMedia, noSsr);\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useDebugValue({\n query,\n match\n });\n }\n return match;\n}","import { unstable_capitalize as capitalize } from '@mui/utils';\nexport default capitalize;","import { unstable_createChainedFunction as createChainedFunction } from '@mui/utils';\nexport default createChainedFunction;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport SvgIcon from '../SvgIcon';\n\n/**\n * Private module reserved for @mui packages.\n */\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default function createSvgIcon(path, displayName) {\n function Component(props, ref) {\n return /*#__PURE__*/_jsx(SvgIcon, _extends({\n \"data-testid\": `${displayName}Icon`,\n ref: ref\n }, props, {\n children: path\n }));\n }\n if (process.env.NODE_ENV !== 'production') {\n // Need to set `displayName` on the inner component for React.memo.\n // React prior to 16.14 ignores `displayName` on the wrapper.\n Component.displayName = `${displayName}Icon`;\n }\n Component.muiName = SvgIcon.muiName;\n return /*#__PURE__*/React.memo( /*#__PURE__*/React.forwardRef(Component));\n}","import { unstable_debounce as debounce } from '@mui/utils';\nexport default debounce;","import { unstable_deprecatedPropType as deprecatedPropType } from '@mui/utils';\nexport default deprecatedPropType;","export default function deprecatedPropType(validator, reason) {\n if (process.env.NODE_ENV === 'production') {\n return () => null;\n }\n return (props, propName, componentName, location, propFullName) => {\n const componentNameSafe = componentName || '<>';\n const propFullNameSafe = propFullName || propName;\n if (typeof props[propName] !== 'undefined') {\n return new Error(`The ${location} \\`${propFullNameSafe}\\` of ` + `\\`${componentNameSafe}\\` is deprecated. ${reason}`);\n }\n return null;\n };\n}","import { unstable_requirePropFactory as requirePropFactory } from '@mui/utils';\nexport default requirePropFactory;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nexport default function requirePropFactory(componentNameInError, Component) {\n if (process.env.NODE_ENV === 'production') {\n return () => null;\n }\n\n // eslint-disable-next-line react/forbid-foreign-prop-types\n const prevPropTypes = Component ? _extends({}, Component.propTypes) : null;\n const requireProp = requiredProp => (props, propName, componentName, location, propFullName, ...args) => {\n const propFullNameSafe = propFullName || propName;\n const defaultTypeChecker = prevPropTypes == null ? void 0 : prevPropTypes[propFullNameSafe];\n if (defaultTypeChecker) {\n const typeCheckerResult = defaultTypeChecker(props, propName, componentName, location, propFullName, ...args);\n if (typeCheckerResult) {\n return typeCheckerResult;\n }\n }\n if (typeof props[propName] !== 'undefined' && !props[requiredProp]) {\n return new Error(`The prop \\`${propFullNameSafe}\\` of ` + `\\`${componentNameInError}\\` can only be used together with the \\`${requiredProp}\\` prop.`);\n }\n return null;\n };\n return requireProp;\n}","import { unstable_setRef as setRef } from '@mui/utils';\nexport default setRef;","import { unstable_unsupportedProp as unsupportedProp } from '@mui/utils';\nexport default unsupportedProp;","export default function unsupportedProp(props, propName, componentName, location, propFullName) {\n if (process.env.NODE_ENV === 'production') {\n return null;\n }\n const propFullNameSafe = propFullName || propName;\n if (typeof props[propName] !== 'undefined') {\n return new Error(`The prop \\`${propFullNameSafe}\\` is not supported. Please remove it.`);\n }\n return null;\n}","import { unstable_ClassNameGenerator as ClassNameGenerator } from '@mui/base/className';\nexport { default as capitalize } from './capitalize';\nexport { default as createChainedFunction } from './createChainedFunction';\nexport { default as createSvgIcon } from './createSvgIcon';\nexport { default as debounce } from './debounce';\nexport { default as deprecatedPropType } from './deprecatedPropType';\nexport { default as isMuiElement } from './isMuiElement';\nexport { default as ownerDocument } from './ownerDocument';\nexport { default as ownerWindow } from './ownerWindow';\nexport { default as requirePropFactory } from './requirePropFactory';\nexport { default as setRef } from './setRef';\nexport { default as unstable_useEnhancedEffect } from './useEnhancedEffect';\nexport { default as unstable_useId } from './useId';\nexport { default as unsupportedProp } from './unsupportedProp';\nexport { default as useControlled } from './useControlled';\nexport { default as useEventCallback } from './useEventCallback';\nexport { default as useForkRef } from './useForkRef';\nexport { default as useIsFocusVisible } from './useIsFocusVisible';\n// TODO: remove this export once ClassNameGenerator is stable\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport const unstable_ClassNameGenerator = {\n configure: generator => {\n if (process.env.NODE_ENV !== 'production') {\n console.warn(['MUI: `ClassNameGenerator` import from `@mui/material/utils` is outdated and might cause unexpected issues.', '', \"You should use `import { unstable_ClassNameGenerator } from '@mui/material/className'` instead\", '', 'The detail of the issue: https://github.com/mui/material-ui/issues/30011#issuecomment-1024993401', '', 'The updated documentation: https://mui.com/guides/classname-generator/'].join('\\n'));\n }\n ClassNameGenerator.configure(generator);\n }\n};","import { unstable_isMuiElement as isMuiElement } from '@mui/utils';\nexport default isMuiElement;","import * as React from 'react';\nexport default function isMuiElement(element, muiNames) {\n return /*#__PURE__*/React.isValidElement(element) && muiNames.indexOf(element.type.muiName) !== -1;\n}","import { unstable_ownerDocument as ownerDocument } from '@mui/utils';\nexport default ownerDocument;","import { unstable_ownerWindow as ownerWindow } from '@mui/utils';\nexport default ownerWindow;","import { unstable_useControlled as useControlled } from '@mui/utils';\nexport default useControlled;","import { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';\nexport default useEnhancedEffect;","import { unstable_useEventCallback as useEventCallback } from '@mui/utils';\nexport default useEventCallback;","import { unstable_useForkRef as useForkRef } from '@mui/utils';\nexport default useForkRef;","import { unstable_useId as useId } from '@mui/utils';\nexport default useId;","// based on https://github.com/WICG/focus-visible/blob/v4.1.5/src/focus-visible.js\nimport * as React from 'react';\nlet hadKeyboardEvent = true;\nlet hadFocusVisibleRecently = false;\nlet hadFocusVisibleRecentlyTimeout;\nconst 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/**\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 * @returns {boolean}\n */\nfunction focusTriggersKeyboardModality(node) {\n const {\n type,\n tagName\n } = node;\n if (tagName === 'INPUT' && inputTypesWhitelist[type] && !node.readOnly) {\n return true;\n }\n if (tagName === 'TEXTAREA' && !node.readOnly) {\n return true;\n }\n if (node.isContentEditable) {\n return true;\n }\n return false;\n}\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 */\nfunction handleKeyDown(event) {\n if (event.metaKey || event.altKey || event.ctrlKey) {\n return;\n }\n hadKeyboardEvent = true;\n}\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 */\nfunction handlePointerDown() {\n hadKeyboardEvent = false;\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}\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}\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}\nfunction isFocusVisible(event) {\n const {\n target\n } = event;\n try {\n return target.matches(':focus-visible');\n } catch (error) {\n // 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 }\n\n // No need for validFocusTarget check. The user does that by attaching it to\n // focusable events only.\n return hadKeyboardEvent || focusTriggersKeyboardModality(target);\n}\nexport default function useIsFocusVisible() {\n const ref = React.useCallback(node => {\n if (node != null) {\n prepare(node.ownerDocument);\n }\n }, []);\n const isFocusVisibleRef = React.useRef(false);\n\n /**\n * Should be called if a blur event is fired\n */\n function handleBlurVisible() {\n // checking against potential state variable does not suffice if we focus and blur synchronously.\n // React wouldn't have time to trigger a re-render so `focusVisible` would be stale.\n // Ideally we would adjust `isFocusVisible(event)` to look at `relatedTarget` for blur events.\n // This doesn't work in IE11 due to https://github.com/facebook/react/issues/3751\n // TODO: check again if React releases their internal changes to focus event handling (https://github.com/facebook/react/pull/19186).\n if (isFocusVisibleRef.current) {\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(() => {\n hadFocusVisibleRecently = false;\n }, 100);\n isFocusVisibleRef.current = false;\n return true;\n }\n return false;\n }\n\n /**\n * Should be called if a blur event is fired\n */\n function handleFocusVisible(event) {\n if (isFocusVisible(event)) {\n isFocusVisibleRef.current = true;\n return true;\n }\n return false;\n }\n return {\n isFocusVisibleRef,\n onFocus: handleFocusVisible,\n onBlur: handleBlurVisible,\n ref\n };\n}","import { unstable_useIsFocusVisible as useIsFocusVisible } from '@mui/utils';\nexport default useIsFocusVisible;","import memoize from '@emotion/memoize';\n\nvar reactPropsRegex = /^((children|dangerouslySetInnerHTML|key|ref|autoFocus|defaultValue|defaultChecked|innerHTML|suppressContentEditableWarning|suppressHydrationWarning|valueLink|abbr|accept|acceptCharset|accessKey|action|allow|allowUserMedia|allowPaymentRequest|allowFullScreen|allowTransparency|alt|async|autoComplete|autoPlay|capture|cellPadding|cellSpacing|challenge|charSet|checked|cite|classID|className|cols|colSpan|content|contentEditable|contextMenu|controls|controlsList|coords|crossOrigin|data|dateTime|decoding|default|defer|dir|disabled|disablePictureInPicture|download|draggable|encType|enterKeyHint|form|formAction|formEncType|formMethod|formNoValidate|formTarget|frameBorder|headers|height|hidden|high|href|hrefLang|htmlFor|httpEquiv|id|inputMode|integrity|is|keyParams|keyType|kind|label|lang|list|loading|loop|low|marginHeight|marginWidth|max|maxLength|media|mediaGroup|method|min|minLength|multiple|muted|name|nonce|noValidate|open|optimum|pattern|placeholder|playsInline|poster|preload|profile|radioGroup|readOnly|referrerPolicy|rel|required|reversed|role|rows|rowSpan|sandbox|scope|scoped|scrolling|seamless|selected|shape|size|sizes|slot|span|spellCheck|src|srcDoc|srcLang|srcSet|start|step|style|summary|tabIndex|target|title|translate|type|useMap|value|width|wmode|wrap|about|datatype|inlist|prefix|property|resource|typeof|vocab|autoCapitalize|autoCorrect|autoSave|color|incremental|fallback|inert|itemProp|itemScope|itemType|itemID|itemRef|on|option|results|security|unselectable|accentHeight|accumulate|additive|alignmentBaseline|allowReorder|alphabetic|amplitude|arabicForm|ascent|attributeName|attributeType|autoReverse|azimuth|baseFrequency|baselineShift|baseProfile|bbox|begin|bias|by|calcMode|capHeight|clip|clipPathUnits|clipPath|clipRule|colorInterpolation|colorInterpolationFilters|colorProfile|colorRendering|contentScriptType|contentStyleType|cursor|cx|cy|d|decelerate|descent|diffuseConstant|direction|display|divisor|dominantBaseline|dur|dx|dy|edgeMode|elevation|enableBackground|end|exponent|externalResourcesRequired|fill|fillOpacity|fillRule|filter|filterRes|filterUnits|floodColor|floodOpacity|focusable|fontFamily|fontSize|fontSizeAdjust|fontStretch|fontStyle|fontVariant|fontWeight|format|from|fr|fx|fy|g1|g2|glyphName|glyphOrientationHorizontal|glyphOrientationVertical|glyphRef|gradientTransform|gradientUnits|hanging|horizAdvX|horizOriginX|ideographic|imageRendering|in|in2|intercept|k|k1|k2|k3|k4|kernelMatrix|kernelUnitLength|kerning|keyPoints|keySplines|keyTimes|lengthAdjust|letterSpacing|lightingColor|limitingConeAngle|local|markerEnd|markerMid|markerStart|markerHeight|markerUnits|markerWidth|mask|maskContentUnits|maskUnits|mathematical|mode|numOctaves|offset|opacity|operator|order|orient|orientation|origin|overflow|overlinePosition|overlineThickness|panose1|paintOrder|pathLength|patternContentUnits|patternTransform|patternUnits|pointerEvents|points|pointsAtX|pointsAtY|pointsAtZ|preserveAlpha|preserveAspectRatio|primitiveUnits|r|radius|refX|refY|renderingIntent|repeatCount|repeatDur|requiredExtensions|requiredFeatures|restart|result|rotate|rx|ry|scale|seed|shapeRendering|slope|spacing|specularConstant|specularExponent|speed|spreadMethod|startOffset|stdDeviation|stemh|stemv|stitchTiles|stopColor|stopOpacity|strikethroughPosition|strikethroughThickness|string|stroke|strokeDasharray|strokeDashoffset|strokeLinecap|strokeLinejoin|strokeMiterlimit|strokeOpacity|strokeWidth|surfaceScale|systemLanguage|tableValues|targetX|targetY|textAnchor|textDecoration|textRendering|textLength|to|transform|u1|u2|underlinePosition|underlineThickness|unicode|unicodeBidi|unicodeRange|unitsPerEm|vAlphabetic|vHanging|vIdeographic|vMathematical|values|vectorEffect|version|vertAdvY|vertOriginX|vertOriginY|viewBox|viewTarget|visibility|widths|wordSpacing|writingMode|x|xHeight|x1|x2|xChannelSelector|xlinkActuate|xlinkArcrole|xlinkHref|xlinkRole|xlinkShow|xlinkTitle|xlinkType|xmlBase|xmlns|xmlnsXlink|xmlLang|xmlSpace|y|y1|y2|yChannelSelector|z|zoomAndPan|for|class|autofocus)|(([Dd][Aa][Tt][Aa]|[Aa][Rr][Ii][Aa]|x)-.*))$/; // https://esbench.com/bench/5bfee68a4cd7e6009ef61d23\n\nvar isPropValid = /* #__PURE__ */memoize(function (prop) {\n return reactPropsRegex.test(prop) || prop.charCodeAt(0) === 111\n /* o */\n && prop.charCodeAt(1) === 110\n /* n */\n && prop.charCodeAt(2) < 91;\n}\n/* Z+1 */\n);\n\nexport { isPropValid as default };\n","import _extends from '@babel/runtime/helpers/esm/extends';\nimport * as React from 'react';\nimport isPropValid from '@emotion/is-prop-valid';\nimport { withEmotionCache, ThemeContext } from '@emotion/react';\nimport { getRegisteredStyles, registerStyles, insertStyles } from '@emotion/utils';\nimport { serializeStyles } from '@emotion/serialize';\nimport { useInsertionEffectAlwaysWithSyncFallback } from '@emotion/use-insertion-effect-with-fallbacks';\n\nvar testOmitPropsOnStringTag = isPropValid;\n\nvar testOmitPropsOnComponent = function testOmitPropsOnComponent(key) {\n return key !== 'theme';\n};\n\nvar getDefaultShouldForwardProp = function getDefaultShouldForwardProp(tag) {\n return typeof tag === 'string' && // 96 is one less than the char code\n // for \"a\" so this is checking that\n // it's a lowercase character\n tag.charCodeAt(0) > 96 ? testOmitPropsOnStringTag : testOmitPropsOnComponent;\n};\nvar composeShouldForwardProps = function composeShouldForwardProps(tag, options, isReal) {\n var shouldForwardProp;\n\n if (options) {\n var optionsShouldForwardProp = options.shouldForwardProp;\n shouldForwardProp = tag.__emotion_forwardProp && optionsShouldForwardProp ? function (propName) {\n return tag.__emotion_forwardProp(propName) && optionsShouldForwardProp(propName);\n } : optionsShouldForwardProp;\n }\n\n if (typeof shouldForwardProp !== 'function' && isReal) {\n shouldForwardProp = tag.__emotion_forwardProp;\n }\n\n return shouldForwardProp;\n};\n\nvar ILLEGAL_ESCAPE_SEQUENCE_ERROR = \"You have illegal escape sequence in your template literal, most likely inside content's property value.\\nBecause you write your CSS inside a JavaScript string you actually have to do double escaping, so for example \\\"content: '\\\\00d7';\\\" should become \\\"content: '\\\\\\\\00d7';\\\".\\nYou can read more about this here:\\nhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences\";\n\nvar Insertion = function Insertion(_ref) {\n var cache = _ref.cache,\n serialized = _ref.serialized,\n isStringTag = _ref.isStringTag;\n registerStyles(cache, serialized, isStringTag);\n useInsertionEffectAlwaysWithSyncFallback(function () {\n return insertStyles(cache, serialized, isStringTag);\n });\n\n return null;\n};\n\nvar createStyled = function createStyled(tag, options) {\n if (process.env.NODE_ENV !== 'production') {\n if (tag === undefined) {\n throw new Error('You are trying to create a styled element with an undefined component.\\nYou may have forgotten to import it.');\n }\n }\n\n var isReal = tag.__emotion_real === tag;\n var baseTag = isReal && tag.__emotion_base || tag;\n var identifierName;\n var targetClassName;\n\n if (options !== undefined) {\n identifierName = options.label;\n targetClassName = options.target;\n }\n\n var shouldForwardProp = composeShouldForwardProps(tag, options, isReal);\n var defaultShouldForwardProp = shouldForwardProp || getDefaultShouldForwardProp(baseTag);\n var shouldUseAs = !defaultShouldForwardProp('as');\n return function () {\n var args = arguments;\n var styles = isReal && tag.__emotion_styles !== undefined ? tag.__emotion_styles.slice(0) : [];\n\n if (identifierName !== undefined) {\n styles.push(\"label:\" + identifierName + \";\");\n }\n\n if (args[0] == null || args[0].raw === undefined) {\n styles.push.apply(styles, args);\n } else {\n if (process.env.NODE_ENV !== 'production' && args[0][0] === undefined) {\n console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR);\n }\n\n styles.push(args[0][0]);\n var len = args.length;\n var i = 1;\n\n for (; i < len; i++) {\n if (process.env.NODE_ENV !== 'production' && args[0][i] === undefined) {\n console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR);\n }\n\n styles.push(args[i], args[0][i]);\n }\n } // $FlowFixMe: we need to cast StatelessFunctionalComponent to our PrivateStyledComponent class\n\n\n var Styled = withEmotionCache(function (props, cache, ref) {\n var FinalTag = shouldUseAs && props.as || baseTag;\n var className = '';\n var classInterpolations = [];\n var mergedProps = props;\n\n if (props.theme == null) {\n mergedProps = {};\n\n for (var key in props) {\n mergedProps[key] = props[key];\n }\n\n mergedProps.theme = React.useContext(ThemeContext);\n }\n\n if (typeof props.className === 'string') {\n className = getRegisteredStyles(cache.registered, classInterpolations, props.className);\n } else if (props.className != null) {\n className = props.className + \" \";\n }\n\n var serialized = serializeStyles(styles.concat(classInterpolations), cache.registered, mergedProps);\n className += cache.key + \"-\" + serialized.name;\n\n if (targetClassName !== undefined) {\n className += \" \" + targetClassName;\n }\n\n var finalShouldForwardProp = shouldUseAs && shouldForwardProp === undefined ? getDefaultShouldForwardProp(FinalTag) : defaultShouldForwardProp;\n var newProps = {};\n\n for (var _key in props) {\n if (shouldUseAs && _key === 'as') continue;\n\n if ( // $FlowFixMe\n finalShouldForwardProp(_key)) {\n newProps[_key] = props[_key];\n }\n }\n\n newProps.className = className;\n newProps.ref = ref;\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Insertion, {\n cache: cache,\n serialized: serialized,\n isStringTag: typeof FinalTag === 'string'\n }), /*#__PURE__*/React.createElement(FinalTag, newProps));\n });\n Styled.displayName = identifierName !== undefined ? identifierName : \"Styled(\" + (typeof baseTag === 'string' ? baseTag : baseTag.displayName || baseTag.name || 'Component') + \")\";\n Styled.defaultProps = tag.defaultProps;\n Styled.__emotion_real = Styled;\n Styled.__emotion_base = baseTag;\n Styled.__emotion_styles = styles;\n Styled.__emotion_forwardProp = shouldForwardProp;\n Object.defineProperty(Styled, 'toString', {\n value: function value() {\n if (targetClassName === undefined && process.env.NODE_ENV !== 'production') {\n return 'NO_COMPONENT_SELECTOR';\n } // $FlowFixMe: coerce undefined to string\n\n\n return \".\" + targetClassName;\n }\n });\n\n Styled.withComponent = function (nextTag, nextOptions) {\n return createStyled(nextTag, _extends({}, options, nextOptions, {\n shouldForwardProp: composeShouldForwardProps(Styled, nextOptions, true)\n })).apply(void 0, styles);\n };\n\n return Styled;\n };\n};\n\nexport { createStyled as default };\n","import createStyled from '../base/dist/emotion-styled-base.browser.esm.js';\nimport '@babel/runtime/helpers/extends';\nimport 'react';\nimport '@emotion/is-prop-valid';\nimport '@emotion/react';\nimport '@emotion/utils';\nimport '@emotion/serialize';\nimport '@emotion/use-insertion-effect-with-fallbacks';\n\nvar tags = ['a', 'abbr', 'address', 'area', 'article', 'aside', 'audio', 'b', 'base', 'bdi', 'bdo', 'big', 'blockquote', 'body', 'br', 'button', 'canvas', 'caption', 'cite', 'code', 'col', 'colgroup', 'data', 'datalist', 'dd', 'del', 'details', 'dfn', 'dialog', 'div', 'dl', 'dt', 'em', 'embed', 'fieldset', 'figcaption', 'figure', 'footer', 'form', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'head', 'header', 'hgroup', 'hr', 'html', 'i', 'iframe', 'img', 'input', 'ins', 'kbd', 'keygen', 'label', 'legend', 'li', 'link', 'main', 'map', 'mark', 'marquee', 'menu', 'menuitem', 'meta', 'meter', 'nav', 'noscript', 'object', 'ol', 'optgroup', 'option', 'output', 'p', 'param', 'picture', 'pre', 'progress', 'q', 'rp', 'rt', 'ruby', 's', 'samp', 'script', 'section', 'select', 'small', 'source', 'span', 'strong', 'style', 'sub', 'summary', 'sup', 'table', 'tbody', 'td', 'textarea', 'tfoot', 'th', 'thead', 'time', 'title', 'tr', 'track', 'u', 'ul', 'var', 'video', 'wbr', // SVG\n'circle', 'clipPath', 'defs', 'ellipse', 'foreignObject', 'g', 'image', 'line', 'linearGradient', 'mask', 'path', 'pattern', 'polygon', 'polyline', 'radialGradient', 'rect', 'stop', 'svg', 'text', 'tspan'];\n\nvar newStyled = createStyled.bind();\ntags.forEach(function (tagName) {\n // $FlowFixMe: we can ignore this because its exposed type is defined by the CreateStyled type\n newStyled[tagName] = newStyled(tagName);\n});\n\nexport { newStyled as default };\n","/**\n * @mui/styled-engine v5.13.2\n *\n * @license MIT\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n/* eslint-disable no-underscore-dangle */\nimport emStyled from '@emotion/styled';\nexport default function styled(tag, options) {\n const stylesFactory = emStyled(tag, options);\n if (process.env.NODE_ENV !== 'production') {\n return (...styles) => {\n const component = typeof tag === 'string' ? `\"${tag}\"` : 'component';\n if (styles.length === 0) {\n console.error([`MUI: Seems like you called \\`styled(${component})()\\` without a \\`style\\` argument.`, 'You must provide a `styles` argument: `styled(\"div\")(styleYouForgotToPass)`.'].join('\\n'));\n } else if (styles.some(style => style === undefined)) {\n console.error(`MUI: the styled(${component})(...args) API requires all its args to be defined.`);\n }\n return stylesFactory(...styles);\n };\n }\n return stylesFactory;\n}\n\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport const internal_processStyles = (tag, processor) => {\n // Emotion attaches all the styles as `__emotion_styles`.\n // Ref: https://github.com/emotion-js/emotion/blob/16d971d0da229596d6bcc39d282ba9753c9ee7cf/packages/styled/src/base.js#L186\n if (Array.isArray(tag.__emotion_styles)) {\n tag.__emotion_styles = processor(tag.__emotion_styles);\n }\n};\nexport { ThemeContext, keyframes, css } from '@emotion/react';\nexport { default as StyledEngineProvider } from './StyledEngineProvider';\nexport { default as GlobalStyles } from './GlobalStyles';","import PropTypes from 'prop-types';\nimport createBox from '../createBox';\nconst Box = createBox();\nprocess.env.NODE_ENV !== \"production\" ? Box.propTypes /* remove-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 * @ignore\n */\n children: PropTypes.node,\n /**\n * The component used for the root node.\n * Either a string to use a HTML element or a component.\n */\n component: PropTypes.elementType,\n /**\n * The system prop that allows defining system overrides as well as additional CSS styles.\n */\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])\n} : void 0;\nexport default Box;","import PropTypes from 'prop-types';\nimport createStack from './createStack';\n/**\n *\n * Demos:\n *\n * - [Stack (Joy UI)](https://mui.com/joy-ui/react-stack/)\n * - [Stack (Material UI)](https://mui.com/material-ui/react-stack/)\n * - [Stack (MUI System)](https://mui.com/system/react-stack/)\n *\n * API:\n *\n * - [Stack API](https://mui.com/system/api/stack/)\n */\nconst Stack = createStack();\nprocess.env.NODE_ENV !== \"production\" ? Stack.propTypes /* remove-proptypes */ = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n /**\n * The content of the component.\n */\n children: PropTypes.node,\n /**\n * The component used for the root node.\n * Either a string to use a HTML element or a component.\n */\n component: PropTypes.elementType,\n /**\n * Defines the `flex-direction` style property.\n * It is applied for all screen sizes.\n * @default 'column'\n */\n direction: PropTypes.oneOfType([PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']), PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])), PropTypes.object]),\n /**\n * Add an element between each child.\n */\n divider: PropTypes.node,\n /**\n * Defines the space between immediate children.\n * @default 0\n */\n spacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),\n /**\n * The system prop, which allows defining system overrides as well as additional CSS styles.\n */\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),\n /**\n * If `true`, the CSS flexbox `gap` is used instead of applying `margin` to children.\n *\n * While CSS `gap` removes the [known limitations](https://mui.com/joy-ui/react-stack/#limitations),\n * it is not fully supported in some browsers. We recommend checking https://caniuse.com/?search=flex%20gap before using this flag.\n *\n * To enable this flag globally, follow the theme's default props configuration.\n * @default false\n */\n useFlexGap: PropTypes.bool\n} : void 0;\nexport default Stack;","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"component\", \"direction\", \"spacing\", \"divider\", \"children\", \"className\", \"useFlexGap\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { deepmerge, unstable_composeClasses as composeClasses, unstable_generateUtilityClass as generateUtilityClass } from '@mui/utils';\nimport systemStyled from '../styled';\nimport useThemePropsSystem from '../useThemeProps';\nimport { extendSxProp } from '../styleFunctionSx';\nimport createTheme from '../createTheme';\nimport { handleBreakpoints, mergeBreakpointsInOrder, resolveBreakpointValues } from '../breakpoints';\nimport { createUnarySpacing, getValue } from '../spacing';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst defaultTheme = createTheme();\n// widening Theme to any so that the consumer can own the theme structure.\nconst defaultCreateStyledComponent = systemStyled('div', {\n name: 'MuiStack',\n slot: 'Root',\n overridesResolver: (props, styles) => styles.root\n});\nfunction useThemePropsDefault(props) {\n return useThemePropsSystem({\n props,\n name: 'MuiStack',\n defaultTheme\n });\n}\n\n/**\n * Return an array with the separator React element interspersed between\n * each React node of the input children.\n *\n * > joinChildren([1,2,3], 0)\n * [1,0,2,0,3]\n */\nfunction joinChildren(children, separator) {\n const childrenArray = React.Children.toArray(children).filter(Boolean);\n return childrenArray.reduce((output, child, index) => {\n output.push(child);\n if (index < childrenArray.length - 1) {\n output.push( /*#__PURE__*/React.cloneElement(separator, {\n key: `separator-${index}`\n }));\n }\n return output;\n }, []);\n}\nconst getSideFromDirection = direction => {\n return {\n row: 'Left',\n 'row-reverse': 'Right',\n column: 'Top',\n 'column-reverse': 'Bottom'\n }[direction];\n};\nexport const style = ({\n ownerState,\n theme\n}) => {\n let styles = _extends({\n display: 'flex',\n flexDirection: 'column'\n }, handleBreakpoints({\n theme\n }, resolveBreakpointValues({\n values: ownerState.direction,\n breakpoints: theme.breakpoints.values\n }), propValue => ({\n flexDirection: propValue\n })));\n if (ownerState.spacing) {\n const transformer = createUnarySpacing(theme);\n const base = Object.keys(theme.breakpoints.values).reduce((acc, breakpoint) => {\n if (typeof ownerState.spacing === 'object' && ownerState.spacing[breakpoint] != null || typeof ownerState.direction === 'object' && ownerState.direction[breakpoint] != null) {\n acc[breakpoint] = true;\n }\n return acc;\n }, {});\n const directionValues = resolveBreakpointValues({\n values: ownerState.direction,\n base\n });\n const spacingValues = resolveBreakpointValues({\n values: ownerState.spacing,\n base\n });\n if (typeof directionValues === 'object') {\n Object.keys(directionValues).forEach((breakpoint, index, breakpoints) => {\n const directionValue = directionValues[breakpoint];\n if (!directionValue) {\n const previousDirectionValue = index > 0 ? directionValues[breakpoints[index - 1]] : 'column';\n directionValues[breakpoint] = previousDirectionValue;\n }\n });\n }\n const styleFromPropValue = (propValue, breakpoint) => {\n if (ownerState.useFlexGap) {\n return {\n gap: getValue(transformer, propValue)\n };\n }\n return {\n '& > :not(style) ~ :not(style)': {\n margin: 0,\n [`margin${getSideFromDirection(breakpoint ? directionValues[breakpoint] : ownerState.direction)}`]: getValue(transformer, propValue)\n }\n };\n };\n styles = deepmerge(styles, handleBreakpoints({\n theme\n }, spacingValues, styleFromPropValue));\n }\n styles = mergeBreakpointsInOrder(theme.breakpoints, styles);\n return styles;\n};\nexport default function createStack(options = {}) {\n const {\n // This will allow adding custom styled fn (for example for custom sx style function)\n createStyledComponent = defaultCreateStyledComponent,\n useThemeProps = useThemePropsDefault,\n componentName = 'MuiStack'\n } = options;\n const useUtilityClasses = () => {\n const slots = {\n root: ['root']\n };\n return composeClasses(slots, slot => generateUtilityClass(componentName, slot), {});\n };\n const StackRoot = createStyledComponent(style);\n const Stack = /*#__PURE__*/React.forwardRef(function Grid(inProps, ref) {\n const themeProps = useThemeProps(inProps);\n const props = extendSxProp(themeProps); // `color` type conflicts with html color attribute.\n const {\n component = 'div',\n direction = 'column',\n spacing = 0,\n divider,\n children,\n className,\n useFlexGap = false\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const ownerState = {\n direction,\n spacing,\n useFlexGap\n };\n const classes = useUtilityClasses();\n return /*#__PURE__*/_jsx(StackRoot, _extends({\n as: component,\n ownerState: ownerState,\n ref: ref,\n className: clsx(classes.root, className)\n }, other, {\n children: divider ? joinChildren(children, divider) : children\n }));\n });\n process.env.NODE_ENV !== \"production\" ? Stack.propTypes /* remove-proptypes */ = {\n children: PropTypes.node,\n direction: PropTypes.oneOfType([PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']), PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])), PropTypes.object]),\n divider: PropTypes.node,\n spacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])\n } : void 0;\n return Stack;\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport PropTypes from 'prop-types';\nimport { deepmerge } from '@mui/utils';\nimport merge from './merge';\n\n// The breakpoint **start** at this value.\n// For instance with the first breakpoint xs: [xs, sm[.\nexport const values = {\n xs: 0,\n // phone\n sm: 600,\n // tablet\n md: 900,\n // small laptop\n lg: 1200,\n // desktop\n xl: 1536 // large screen\n};\n\nconst defaultBreakpoints = {\n // Sorted ASC by size. That's important.\n // It can't be configured as it's used statically for propTypes.\n keys: ['xs', 'sm', 'md', 'lg', 'xl'],\n up: key => `@media (min-width:${values[key]}px)`\n};\nexport function handleBreakpoints(props, propValue, styleFromPropValue) {\n const theme = props.theme || {};\n if (Array.isArray(propValue)) {\n const themeBreakpoints = theme.breakpoints || defaultBreakpoints;\n return propValue.reduce((acc, item, index) => {\n acc[themeBreakpoints.up(themeBreakpoints.keys[index])] = styleFromPropValue(propValue[index]);\n return acc;\n }, {});\n }\n if (typeof propValue === 'object') {\n const themeBreakpoints = theme.breakpoints || defaultBreakpoints;\n return Object.keys(propValue).reduce((acc, breakpoint) => {\n // key is breakpoint\n if (Object.keys(themeBreakpoints.values || values).indexOf(breakpoint) !== -1) {\n const mediaKey = themeBreakpoints.up(breakpoint);\n acc[mediaKey] = styleFromPropValue(propValue[breakpoint], breakpoint);\n } else {\n const cssKey = breakpoint;\n acc[cssKey] = propValue[cssKey];\n }\n return acc;\n }, {});\n }\n const output = styleFromPropValue(propValue);\n return output;\n}\nfunction breakpoints(styleFunction) {\n // false positive\n // eslint-disable-next-line react/function-component-definition\n const newStyleFunction = props => {\n const theme = props.theme || {};\n const base = styleFunction(props);\n const themeBreakpoints = theme.breakpoints || defaultBreakpoints;\n const extended = themeBreakpoints.keys.reduce((acc, key) => {\n if (props[key]) {\n acc = acc || {};\n acc[themeBreakpoints.up(key)] = styleFunction(_extends({\n theme\n }, props[key]));\n }\n return acc;\n }, null);\n return merge(base, extended);\n };\n newStyleFunction.propTypes = process.env.NODE_ENV !== 'production' ? _extends({}, styleFunction.propTypes, {\n xs: PropTypes.object,\n sm: PropTypes.object,\n md: PropTypes.object,\n lg: PropTypes.object,\n xl: PropTypes.object\n }) : {};\n newStyleFunction.filterProps = ['xs', 'sm', 'md', 'lg', 'xl', ...styleFunction.filterProps];\n return newStyleFunction;\n}\nexport function createEmptyBreakpointObject(breakpointsInput = {}) {\n var _breakpointsInput$key;\n const breakpointsInOrder = (_breakpointsInput$key = breakpointsInput.keys) == null ? void 0 : _breakpointsInput$key.reduce((acc, key) => {\n const breakpointStyleKey = breakpointsInput.up(key);\n acc[breakpointStyleKey] = {};\n return acc;\n }, {});\n return breakpointsInOrder || {};\n}\nexport function removeUnusedBreakpoints(breakpointKeys, style) {\n return breakpointKeys.reduce((acc, key) => {\n const breakpointOutput = acc[key];\n const isBreakpointUnused = !breakpointOutput || Object.keys(breakpointOutput).length === 0;\n if (isBreakpointUnused) {\n delete acc[key];\n }\n return acc;\n }, style);\n}\nexport function mergeBreakpointsInOrder(breakpointsInput, ...styles) {\n const emptyBreakpoints = createEmptyBreakpointObject(breakpointsInput);\n const mergedOutput = [emptyBreakpoints, ...styles].reduce((prev, next) => deepmerge(prev, next), {});\n return removeUnusedBreakpoints(Object.keys(emptyBreakpoints), mergedOutput);\n}\n\n// compute base for responsive values; e.g.,\n// [1,2,3] => {xs: true, sm: true, md: true}\n// {xs: 1, sm: 2, md: 3} => {xs: true, sm: true, md: true}\nexport function computeBreakpointsBase(breakpointValues, themeBreakpoints) {\n // fixed value\n if (typeof breakpointValues !== 'object') {\n return {};\n }\n const base = {};\n const breakpointsKeys = Object.keys(themeBreakpoints);\n if (Array.isArray(breakpointValues)) {\n breakpointsKeys.forEach((breakpoint, i) => {\n if (i < breakpointValues.length) {\n base[breakpoint] = true;\n }\n });\n } else {\n breakpointsKeys.forEach(breakpoint => {\n if (breakpointValues[breakpoint] != null) {\n base[breakpoint] = true;\n }\n });\n }\n return base;\n}\nexport function resolveBreakpointValues({\n values: breakpointValues,\n breakpoints: themeBreakpoints,\n base: customBase\n}) {\n const base = customBase || computeBreakpointsBase(breakpointValues, themeBreakpoints);\n const keys = Object.keys(base);\n if (keys.length === 0) {\n return breakpointValues;\n }\n let previous;\n return keys.reduce((acc, breakpoint, i) => {\n if (Array.isArray(breakpointValues)) {\n acc[breakpoint] = breakpointValues[i] != null ? breakpointValues[i] : breakpointValues[previous];\n previous = i;\n } else if (typeof breakpointValues === 'object') {\n acc[breakpoint] = breakpointValues[breakpoint] != null ? breakpointValues[breakpoint] : breakpointValues[previous];\n previous = breakpoint;\n } else {\n acc[breakpoint] = breakpointValues;\n }\n return acc;\n }, {});\n}\nexport default breakpoints;","import { formatMuiErrorMessage as _formatMuiErrorMessage } from \"@mui/utils\";\n/* eslint-disable @typescript-eslint/naming-convention */\n/**\n * Returns a number whose value is limited to the given range.\n * @param {number} value The value to be clamped\n * @param {number} min The lower boundary of the output range\n * @param {number} max The upper boundary of the output range\n * @returns {number} A number in the range [min, max]\n */\nfunction clamp(value, min = 0, max = 1) {\n if (process.env.NODE_ENV !== 'production') {\n if (value < min || value > max) {\n console.error(`MUI: The value provided ${value} is out of range [${min}, ${max}].`);\n }\n }\n return Math.min(Math.max(min, value), max);\n}\n\n/**\n * Converts a color from CSS hex format to CSS rgb format.\n * @param {string} color - Hex color, i.e. #nnn or #nnnnnn\n * @returns {string} A CSS rgb color string\n */\nexport function hexToRgb(color) {\n color = color.slice(1);\n const re = new RegExp(`.{1,${color.length >= 6 ? 2 : 1}}`, 'g');\n let colors = color.match(re);\n if (colors && colors[0].length === 1) {\n colors = colors.map(n => n + n);\n }\n return colors ? `rgb${colors.length === 4 ? 'a' : ''}(${colors.map((n, index) => {\n return index < 3 ? parseInt(n, 16) : Math.round(parseInt(n, 16) / 255 * 1000) / 1000;\n }).join(', ')})` : '';\n}\nfunction intToHex(int) {\n const hex = int.toString(16);\n return hex.length === 1 ? `0${hex}` : hex;\n}\n\n/**\n * Returns an object with the type and values of a color.\n *\n * Note: Does not support rgb % values.\n * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()\n * @returns {object} - A MUI color object: {type: string, values: number[]}\n */\nexport function decomposeColor(color) {\n // Idempotent\n if (color.type) {\n return color;\n }\n if (color.charAt(0) === '#') {\n return decomposeColor(hexToRgb(color));\n }\n const marker = color.indexOf('(');\n const type = color.substring(0, marker);\n if (['rgb', 'rgba', 'hsl', 'hsla', 'color'].indexOf(type) === -1) {\n throw new Error(process.env.NODE_ENV !== \"production\" ? `MUI: Unsupported \\`${color}\\` color.\nThe following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().` : _formatMuiErrorMessage(9, color));\n }\n let values = color.substring(marker + 1, color.length - 1);\n let colorSpace;\n if (type === 'color') {\n values = values.split(' ');\n colorSpace = values.shift();\n if (values.length === 4 && values[3].charAt(0) === '/') {\n values[3] = values[3].slice(1);\n }\n if (['srgb', 'display-p3', 'a98-rgb', 'prophoto-rgb', 'rec-2020'].indexOf(colorSpace) === -1) {\n throw new Error(process.env.NODE_ENV !== \"production\" ? `MUI: unsupported \\`${colorSpace}\\` color space.\nThe following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rgb, rec-2020.` : _formatMuiErrorMessage(10, colorSpace));\n }\n } else {\n values = values.split(',');\n }\n values = values.map(value => parseFloat(value));\n return {\n type,\n values,\n colorSpace\n };\n}\n\n/**\n * Returns a channel created from the input color.\n *\n * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()\n * @returns {string} - The channel for the color, that can be used in rgba or hsla colors\n */\nexport const colorChannel = color => {\n const decomposedColor = decomposeColor(color);\n return decomposedColor.values.slice(0, 3).map((val, idx) => decomposedColor.type.indexOf('hsl') !== -1 && idx !== 0 ? `${val}%` : val).join(' ');\n};\nexport const private_safeColorChannel = (color, warning) => {\n try {\n return colorChannel(color);\n } catch (error) {\n if (warning && process.env.NODE_ENV !== 'production') {\n console.warn(warning);\n }\n return color;\n }\n};\n\n/**\n * Converts a color object with type and values to a string.\n * @param {object} color - Decomposed color\n * @param {string} color.type - One of: 'rgb', 'rgba', 'hsl', 'hsla', 'color'\n * @param {array} color.values - [n,n,n] or [n,n,n,n]\n * @returns {string} A CSS color string\n */\nexport function recomposeColor(color) {\n const {\n type,\n colorSpace\n } = color;\n let {\n values\n } = color;\n if (type.indexOf('rgb') !== -1) {\n // Only convert the first 3 values to int (i.e. not alpha)\n values = values.map((n, i) => i < 3 ? parseInt(n, 10) : n);\n } else if (type.indexOf('hsl') !== -1) {\n values[1] = `${values[1]}%`;\n values[2] = `${values[2]}%`;\n }\n if (type.indexOf('color') !== -1) {\n values = `${colorSpace} ${values.join(' ')}`;\n } else {\n values = `${values.join(', ')}`;\n }\n return `${type}(${values})`;\n}\n\n/**\n * Converts a color from CSS rgb format to CSS hex format.\n * @param {string} color - RGB color, i.e. rgb(n, n, n)\n * @returns {string} A CSS rgb color string, i.e. #nnnnnn\n */\nexport function rgbToHex(color) {\n // Idempotent\n if (color.indexOf('#') === 0) {\n return color;\n }\n const {\n values\n } = decomposeColor(color);\n return `#${values.map((n, i) => intToHex(i === 3 ? Math.round(255 * n) : n)).join('')}`;\n}\n\n/**\n * Converts a color from hsl format to rgb format.\n * @param {string} color - HSL color values\n * @returns {string} rgb color values\n */\nexport function hslToRgb(color) {\n color = decomposeColor(color);\n const {\n values\n } = color;\n const h = values[0];\n const s = values[1] / 100;\n const l = values[2] / 100;\n const a = s * Math.min(l, 1 - l);\n const f = (n, k = (n + h / 30) % 12) => l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);\n let type = 'rgb';\n const rgb = [Math.round(f(0) * 255), Math.round(f(8) * 255), Math.round(f(4) * 255)];\n if (color.type === 'hsla') {\n type += 'a';\n rgb.push(values[3]);\n }\n return recomposeColor({\n type,\n values: rgb\n });\n}\n/**\n * The relative brightness of any point in a color space,\n * normalized to 0 for darkest black and 1 for lightest white.\n *\n * Formula: https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests\n * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()\n * @returns {number} The relative brightness of the color in the range 0 - 1\n */\nexport function getLuminance(color) {\n color = decomposeColor(color);\n let rgb = color.type === 'hsl' || color.type === 'hsla' ? decomposeColor(hslToRgb(color)).values : color.values;\n rgb = rgb.map(val => {\n if (color.type !== 'color') {\n val /= 255; // normalized\n }\n\n return val <= 0.03928 ? val / 12.92 : ((val + 0.055) / 1.055) ** 2.4;\n });\n\n // Truncate at 3 digits\n return Number((0.2126 * rgb[0] + 0.7152 * rgb[1] + 0.0722 * rgb[2]).toFixed(3));\n}\n\n/**\n * Calculates the contrast ratio between two colors.\n *\n * Formula: https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests\n * @param {string} foreground - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()\n * @param {string} background - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()\n * @returns {number} A contrast ratio value in the range 0 - 21.\n */\nexport function getContrastRatio(foreground, background) {\n const lumA = getLuminance(foreground);\n const lumB = getLuminance(background);\n return (Math.max(lumA, lumB) + 0.05) / (Math.min(lumA, lumB) + 0.05);\n}\n\n/**\n * Sets the absolute transparency of a color.\n * Any existing alpha values are overwritten.\n * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()\n * @param {number} value - value to set the alpha channel to in the range 0 - 1\n * @returns {string} A CSS color string. Hex input values are returned as rgb\n */\nexport function alpha(color, value) {\n color = decomposeColor(color);\n value = clamp(value);\n if (color.type === 'rgb' || color.type === 'hsl') {\n color.type += 'a';\n }\n if (color.type === 'color') {\n color.values[3] = `/${value}`;\n } else {\n color.values[3] = value;\n }\n return recomposeColor(color);\n}\nexport function private_safeAlpha(color, value, warning) {\n try {\n return alpha(color, value);\n } catch (error) {\n if (warning && process.env.NODE_ENV !== 'production') {\n console.warn(warning);\n }\n return color;\n }\n}\n\n/**\n * Darkens a color.\n * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()\n * @param {number} coefficient - multiplier in the range 0 - 1\n * @returns {string} A CSS color string. Hex input values are returned as rgb\n */\nexport function darken(color, coefficient) {\n color = decomposeColor(color);\n coefficient = clamp(coefficient);\n if (color.type.indexOf('hsl') !== -1) {\n color.values[2] *= 1 - coefficient;\n } else if (color.type.indexOf('rgb') !== -1 || color.type.indexOf('color') !== -1) {\n for (let i = 0; i < 3; i += 1) {\n color.values[i] *= 1 - coefficient;\n }\n }\n return recomposeColor(color);\n}\nexport function private_safeDarken(color, coefficient, warning) {\n try {\n return darken(color, coefficient);\n } catch (error) {\n if (warning && process.env.NODE_ENV !== 'production') {\n console.warn(warning);\n }\n return color;\n }\n}\n\n/**\n * Lightens a color.\n * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()\n * @param {number} coefficient - multiplier in the range 0 - 1\n * @returns {string} A CSS color string. Hex input values are returned as rgb\n */\nexport function lighten(color, coefficient) {\n color = decomposeColor(color);\n coefficient = clamp(coefficient);\n if (color.type.indexOf('hsl') !== -1) {\n color.values[2] += (100 - color.values[2]) * coefficient;\n } else if (color.type.indexOf('rgb') !== -1) {\n for (let i = 0; i < 3; i += 1) {\n color.values[i] += (255 - color.values[i]) * coefficient;\n }\n } else if (color.type.indexOf('color') !== -1) {\n for (let i = 0; i < 3; i += 1) {\n color.values[i] += (1 - color.values[i]) * coefficient;\n }\n }\n return recomposeColor(color);\n}\nexport function private_safeLighten(color, coefficient, warning) {\n try {\n return lighten(color, coefficient);\n } catch (error) {\n if (warning && process.env.NODE_ENV !== 'production') {\n console.warn(warning);\n }\n return color;\n }\n}\n\n/**\n * Darken or lighten a color, depending on its luminance.\n * Light colors are darkened, dark colors are lightened.\n * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()\n * @param {number} coefficient=0.15 - multiplier in the range 0 - 1\n * @returns {string} A CSS color string. Hex input values are returned as rgb\n */\nexport function emphasize(color, coefficient = 0.15) {\n return getLuminance(color) > 0.5 ? darken(color, coefficient) : lighten(color, coefficient);\n}\nexport function private_safeEmphasize(color, coefficient, warning) {\n try {\n return private_safeEmphasize(color, coefficient);\n } catch (error) {\n if (warning && process.env.NODE_ENV !== 'production') {\n console.warn(warning);\n }\n return color;\n }\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"className\", \"component\"];\nimport * as React from 'react';\nimport clsx from 'clsx';\nimport styled from '@mui/styled-engine';\nimport styleFunctionSx, { extendSxProp } from './styleFunctionSx';\nimport useTheme from './useTheme';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default function createBox(options = {}) {\n const {\n themeId,\n defaultTheme,\n defaultClassName = 'MuiBox-root',\n generateClassName\n } = options;\n const BoxRoot = styled('div', {\n shouldForwardProp: prop => prop !== 'theme' && prop !== 'sx' && prop !== 'as'\n })(styleFunctionSx);\n const Box = /*#__PURE__*/React.forwardRef(function Box(inProps, ref) {\n const theme = useTheme(defaultTheme);\n const _extendSxProp = extendSxProp(inProps),\n {\n className,\n component = 'div'\n } = _extendSxProp,\n other = _objectWithoutPropertiesLoose(_extendSxProp, _excluded);\n return /*#__PURE__*/_jsx(BoxRoot, _extends({\n as: component,\n ref: ref,\n className: clsx(className, generateClassName ? generateClassName(defaultClassName) : defaultClassName),\n theme: themeId ? theme[themeId] || theme : theme\n }, other));\n });\n return Box;\n}","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"variant\"];\nimport { unstable_capitalize as capitalize } from '@mui/utils';\nfunction isEmpty(string) {\n return string.length === 0;\n}\n\n/**\n * Generates string classKey based on the properties provided. It starts with the\n * variant if defined, and then it appends all other properties in alphabetical order.\n * @param {object} props - the properties for which the classKey should be created.\n */\nexport default function propsToClassKey(props) {\n const {\n variant\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n let classKey = variant || '';\n Object.keys(other).sort().forEach(key => {\n if (key === 'color') {\n classKey += isEmpty(classKey) ? props[key] : capitalize(props[key]);\n } else {\n classKey += `${isEmpty(classKey) ? key : capitalize(key)}${capitalize(props[key].toString())}`;\n }\n });\n return classKey;\n}","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"name\", \"slot\", \"skipVariantsResolver\", \"skipSx\", \"overridesResolver\"];\n/* eslint-disable no-underscore-dangle */\nimport styledEngineStyled, { internal_processStyles as processStyles } from '@mui/styled-engine';\nimport { getDisplayName } from '@mui/utils';\nimport createTheme from './createTheme';\nimport propsToClassKey from './propsToClassKey';\nimport styleFunctionSx from './styleFunctionSx';\nfunction isEmpty(obj) {\n return Object.keys(obj).length === 0;\n}\n\n// https://github.com/emotion-js/emotion/blob/26ded6109fcd8ca9875cc2ce4564fee678a3f3c5/packages/styled/src/utils.js#L40\nfunction isStringTag(tag) {\n return typeof tag === 'string' &&\n // 96 is one less than the char code\n // for \"a\" so this is checking that\n // it's a lowercase character\n tag.charCodeAt(0) > 96;\n}\nconst getStyleOverrides = (name, theme) => {\n if (theme.components && theme.components[name] && theme.components[name].styleOverrides) {\n return theme.components[name].styleOverrides;\n }\n return null;\n};\nconst getVariantStyles = (name, theme) => {\n let variants = [];\n if (theme && theme.components && theme.components[name] && theme.components[name].variants) {\n variants = theme.components[name].variants;\n }\n const variantsStyles = {};\n variants.forEach(definition => {\n const key = propsToClassKey(definition.props);\n variantsStyles[key] = definition.style;\n });\n return variantsStyles;\n};\nconst variantsResolver = (props, styles, theme, name) => {\n var _theme$components, _theme$components$nam;\n const {\n ownerState = {}\n } = props;\n const variantsStyles = [];\n const themeVariants = theme == null ? void 0 : (_theme$components = theme.components) == null ? void 0 : (_theme$components$nam = _theme$components[name]) == null ? void 0 : _theme$components$nam.variants;\n if (themeVariants) {\n themeVariants.forEach(themeVariant => {\n let isMatch = true;\n Object.keys(themeVariant.props).forEach(key => {\n if (ownerState[key] !== themeVariant.props[key] && props[key] !== themeVariant.props[key]) {\n isMatch = false;\n }\n });\n if (isMatch) {\n variantsStyles.push(styles[propsToClassKey(themeVariant.props)]);\n }\n });\n }\n return variantsStyles;\n};\n\n// Update /system/styled/#api in case if this changes\nexport function shouldForwardProp(prop) {\n return prop !== 'ownerState' && prop !== 'theme' && prop !== 'sx' && prop !== 'as';\n}\nexport const systemDefaultTheme = createTheme();\nconst lowercaseFirstLetter = string => {\n return string.charAt(0).toLowerCase() + string.slice(1);\n};\nfunction resolveTheme({\n defaultTheme,\n theme,\n themeId\n}) {\n return isEmpty(theme) ? defaultTheme : theme[themeId] || theme;\n}\nexport default function createStyled(input = {}) {\n const {\n themeId,\n defaultTheme = systemDefaultTheme,\n rootShouldForwardProp = shouldForwardProp,\n slotShouldForwardProp = shouldForwardProp\n } = input;\n const systemSx = props => {\n return styleFunctionSx(_extends({}, props, {\n theme: resolveTheme(_extends({}, props, {\n defaultTheme,\n themeId\n }))\n }));\n };\n systemSx.__mui_systemSx = true;\n return (tag, inputOptions = {}) => {\n // Filter out the `sx` style function from the previous styled component to prevent unnecessary styles generated by the composite components.\n processStyles(tag, styles => styles.filter(style => !(style != null && style.__mui_systemSx)));\n const {\n name: componentName,\n slot: componentSlot,\n skipVariantsResolver: inputSkipVariantsResolver,\n skipSx: inputSkipSx,\n overridesResolver\n } = inputOptions,\n options = _objectWithoutPropertiesLoose(inputOptions, _excluded);\n\n // if skipVariantsResolver option is defined, take the value, otherwise, true for root and false for other slots.\n const skipVariantsResolver = inputSkipVariantsResolver !== undefined ? inputSkipVariantsResolver : componentSlot && componentSlot !== 'Root' || false;\n const skipSx = inputSkipSx || false;\n let label;\n if (process.env.NODE_ENV !== 'production') {\n if (componentName) {\n label = `${componentName}-${lowercaseFirstLetter(componentSlot || 'Root')}`;\n }\n }\n let shouldForwardPropOption = shouldForwardProp;\n if (componentSlot === 'Root') {\n shouldForwardPropOption = rootShouldForwardProp;\n } else if (componentSlot) {\n // any other slot specified\n shouldForwardPropOption = slotShouldForwardProp;\n } else if (isStringTag(tag)) {\n // for string (html) tag, preserve the behavior in emotion & styled-components.\n shouldForwardPropOption = undefined;\n }\n const defaultStyledResolver = styledEngineStyled(tag, _extends({\n shouldForwardProp: shouldForwardPropOption,\n label\n }, options));\n const muiStyledResolver = (styleArg, ...expressions) => {\n const expressionsWithDefaultTheme = expressions ? expressions.map(stylesArg => {\n // On the server Emotion doesn't use React.forwardRef for creating components, so the created\n // component stays as a function. This condition makes sure that we do not interpolate functions\n // which are basically components used as a selectors.\n return typeof stylesArg === 'function' && stylesArg.__emotion_real !== stylesArg ? props => {\n return stylesArg(_extends({}, props, {\n theme: resolveTheme(_extends({}, props, {\n defaultTheme,\n themeId\n }))\n }));\n } : stylesArg;\n }) : [];\n let transformedStyleArg = styleArg;\n if (componentName && overridesResolver) {\n expressionsWithDefaultTheme.push(props => {\n const theme = resolveTheme(_extends({}, props, {\n defaultTheme,\n themeId\n }));\n const styleOverrides = getStyleOverrides(componentName, theme);\n if (styleOverrides) {\n const resolvedStyleOverrides = {};\n Object.entries(styleOverrides).forEach(([slotKey, slotStyle]) => {\n resolvedStyleOverrides[slotKey] = typeof slotStyle === 'function' ? slotStyle(_extends({}, props, {\n theme\n })) : slotStyle;\n });\n return overridesResolver(props, resolvedStyleOverrides);\n }\n return null;\n });\n }\n if (componentName && !skipVariantsResolver) {\n expressionsWithDefaultTheme.push(props => {\n const theme = resolveTheme(_extends({}, props, {\n defaultTheme,\n themeId\n }));\n return variantsResolver(props, getVariantStyles(componentName, theme), theme, componentName);\n });\n }\n if (!skipSx) {\n expressionsWithDefaultTheme.push(systemSx);\n }\n const numOfCustomFnsApplied = expressionsWithDefaultTheme.length - expressions.length;\n if (Array.isArray(styleArg) && numOfCustomFnsApplied > 0) {\n const placeholders = new Array(numOfCustomFnsApplied).fill('');\n // If the type is array, than we need to add placeholders in the template for the overrides, variants and the sx styles.\n transformedStyleArg = [...styleArg, ...placeholders];\n transformedStyleArg.raw = [...styleArg.raw, ...placeholders];\n } else if (typeof styleArg === 'function' &&\n // On the server Emotion doesn't use React.forwardRef for creating components, so the created\n // component stays as a function. This condition makes sure that we do not interpolate functions\n // which are basically components used as a selectors.\n styleArg.__emotion_real !== styleArg) {\n // If the type is function, we need to define the default theme.\n transformedStyleArg = props => styleArg(_extends({}, props, {\n theme: resolveTheme(_extends({}, props, {\n defaultTheme,\n themeId\n }))\n }));\n }\n const Component = defaultStyledResolver(transformedStyleArg, ...expressionsWithDefaultTheme);\n if (process.env.NODE_ENV !== 'production') {\n let displayName;\n if (componentName) {\n displayName = `${componentName}${componentSlot || ''}`;\n }\n if (displayName === undefined) {\n displayName = `Styled(${getDisplayName(tag)})`;\n }\n Component.displayName = displayName;\n }\n if (tag.muiName) {\n Component.muiName = tag.muiName;\n }\n return Component;\n };\n if (defaultStyledResolver.withConfig) {\n muiStyledResolver.withConfig = defaultStyledResolver.withConfig;\n }\n return muiStyledResolver;\n };\n}","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"values\", \"unit\", \"step\"];\n// Sorted ASC by size. That's important.\n// It can't be configured as it's used statically for propTypes.\nexport const breakpointKeys = ['xs', 'sm', 'md', 'lg', 'xl'];\nconst sortBreakpointsValues = values => {\n const breakpointsAsArray = Object.keys(values).map(key => ({\n key,\n val: values[key]\n })) || [];\n // Sort in ascending order\n breakpointsAsArray.sort((breakpoint1, breakpoint2) => breakpoint1.val - breakpoint2.val);\n return breakpointsAsArray.reduce((acc, obj) => {\n return _extends({}, acc, {\n [obj.key]: obj.val\n });\n }, {});\n};\n\n// Keep in mind that @media is inclusive by the CSS specification.\nexport default function createBreakpoints(breakpoints) {\n const {\n // The breakpoint **start** at this value.\n // For instance with the first breakpoint xs: [xs, sm).\n values = {\n xs: 0,\n // phone\n sm: 600,\n // tablet\n md: 900,\n // small laptop\n lg: 1200,\n // desktop\n xl: 1536 // large screen\n },\n\n unit = 'px',\n step = 5\n } = breakpoints,\n other = _objectWithoutPropertiesLoose(breakpoints, _excluded);\n const sortedValues = sortBreakpointsValues(values);\n const keys = Object.keys(sortedValues);\n function up(key) {\n const value = typeof values[key] === 'number' ? values[key] : key;\n return `@media (min-width:${value}${unit})`;\n }\n function down(key) {\n const value = typeof values[key] === 'number' ? values[key] : key;\n return `@media (max-width:${value - step / 100}${unit})`;\n }\n function between(start, end) {\n const endIndex = keys.indexOf(end);\n return `@media (min-width:${typeof values[start] === 'number' ? values[start] : start}${unit}) and ` + `(max-width:${(endIndex !== -1 && typeof values[keys[endIndex]] === 'number' ? values[keys[endIndex]] : end) - step / 100}${unit})`;\n }\n function only(key) {\n if (keys.indexOf(key) + 1 < keys.length) {\n return between(key, keys[keys.indexOf(key) + 1]);\n }\n return up(key);\n }\n function not(key) {\n // handle first and last key separately, for better readability\n const keyIndex = keys.indexOf(key);\n if (keyIndex === 0) {\n return up(keys[1]);\n }\n if (keyIndex === keys.length - 1) {\n return down(keys[keyIndex]);\n }\n return between(key, keys[keys.indexOf(key) + 1]).replace('@media', '@media not all and');\n }\n return _extends({\n keys,\n values: sortedValues,\n up,\n down,\n between,\n only,\n not,\n unit\n }, other);\n}","const shape = {\n borderRadius: 4\n};\nexport default shape;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"breakpoints\", \"palette\", \"spacing\", \"shape\"];\nimport { deepmerge } from '@mui/utils';\nimport createBreakpoints from './createBreakpoints';\nimport shape from './shape';\nimport createSpacing from './createSpacing';\nimport styleFunctionSx from '../styleFunctionSx/styleFunctionSx';\nimport defaultSxConfig from '../styleFunctionSx/defaultSxConfig';\nfunction createTheme(options = {}, ...args) {\n const {\n breakpoints: breakpointsInput = {},\n palette: paletteInput = {},\n spacing: spacingInput,\n shape: shapeInput = {}\n } = options,\n other = _objectWithoutPropertiesLoose(options, _excluded);\n const breakpoints = createBreakpoints(breakpointsInput);\n const spacing = createSpacing(spacingInput);\n let muiTheme = deepmerge({\n breakpoints,\n direction: 'ltr',\n components: {},\n // Inject component definitions.\n palette: _extends({\n mode: 'light'\n }, paletteInput),\n spacing,\n shape: _extends({}, shape, shapeInput)\n }, other);\n muiTheme = args.reduce((acc, argument) => deepmerge(acc, argument), muiTheme);\n muiTheme.unstable_sxConfig = _extends({}, defaultSxConfig, other == null ? void 0 : other.unstable_sxConfig);\n muiTheme.unstable_sx = function sx(props) {\n return styleFunctionSx({\n sx: props,\n theme: this\n });\n };\n return muiTheme;\n}\nexport default createTheme;","import { createUnarySpacing } from '../spacing';\n\n// The different signatures imply different meaning for their arguments that can't be expressed structurally.\n// We express the difference with variable names.\n/* tslint:disable:unified-signatures */\n/* tslint:enable:unified-signatures */\n\nexport default function createSpacing(spacingInput = 8) {\n // Already transformed.\n if (spacingInput.mui) {\n return spacingInput;\n }\n\n // Material Design layouts are visually balanced. Most measurements align to an 8dp grid, which aligns both spacing and the overall layout.\n // Smaller components, such as icons, can align to a 4dp grid.\n // https://m2.material.io/design/layout/understanding-layout.html\n const transform = createUnarySpacing({\n spacing: spacingInput\n });\n const spacing = (...argsInput) => {\n if (process.env.NODE_ENV !== 'production') {\n if (!(argsInput.length <= 4)) {\n console.error(`MUI: Too many arguments provided, expected between 0 and 4, got ${argsInput.length}`);\n }\n }\n const args = argsInput.length === 0 ? [1] : argsInput;\n return args.map(argument => {\n const output = transform(argument);\n return typeof output === 'number' ? `${output}px` : output;\n }).join(' ');\n };\n spacing.mui = true;\n return spacing;\n}","import { deepmerge } from '@mui/utils';\nfunction merge(acc, item) {\n if (!item) {\n return acc;\n }\n return deepmerge(acc, item, {\n clone: false // No need to clone deep, it's way faster.\n });\n}\n\nexport default merge;","import responsivePropType from './responsivePropType';\nimport { handleBreakpoints } from './breakpoints';\nimport { getPath } from './style';\nimport merge from './merge';\nimport memoize from './memoize';\nconst properties = {\n m: 'margin',\n p: 'padding'\n};\nconst directions = {\n t: 'Top',\n r: 'Right',\n b: 'Bottom',\n l: 'Left',\n x: ['Left', 'Right'],\n y: ['Top', 'Bottom']\n};\nconst aliases = {\n marginX: 'mx',\n marginY: 'my',\n paddingX: 'px',\n paddingY: 'py'\n};\n\n// memoize() impact:\n// From 300,000 ops/sec\n// To 350,000 ops/sec\nconst getCssProperties = memoize(prop => {\n // It's not a shorthand notation.\n if (prop.length > 2) {\n if (aliases[prop]) {\n prop = aliases[prop];\n } else {\n return [prop];\n }\n }\n const [a, b] = prop.split('');\n const property = properties[a];\n const direction = directions[b] || '';\n return Array.isArray(direction) ? direction.map(dir => property + dir) : [property + direction];\n});\nexport const marginKeys = ['m', 'mt', 'mr', 'mb', 'ml', 'mx', 'my', 'margin', 'marginTop', 'marginRight', 'marginBottom', 'marginLeft', 'marginX', 'marginY', 'marginInline', 'marginInlineStart', 'marginInlineEnd', 'marginBlock', 'marginBlockStart', 'marginBlockEnd'];\nexport const paddingKeys = ['p', 'pt', 'pr', 'pb', 'pl', 'px', 'py', 'padding', 'paddingTop', 'paddingRight', 'paddingBottom', 'paddingLeft', 'paddingX', 'paddingY', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd'];\nconst spacingKeys = [...marginKeys, ...paddingKeys];\nexport function createUnaryUnit(theme, themeKey, defaultValue, propName) {\n var _getPath;\n const themeSpacing = (_getPath = getPath(theme, themeKey, false)) != null ? _getPath : defaultValue;\n if (typeof themeSpacing === 'number') {\n return abs => {\n if (typeof abs === 'string') {\n return abs;\n }\n if (process.env.NODE_ENV !== 'production') {\n if (typeof abs !== 'number') {\n console.error(`MUI: Expected ${propName} argument to be a number or a string, got ${abs}.`);\n }\n }\n return themeSpacing * abs;\n };\n }\n if (Array.isArray(themeSpacing)) {\n return abs => {\n if (typeof abs === 'string') {\n return abs;\n }\n if (process.env.NODE_ENV !== 'production') {\n if (!Number.isInteger(abs)) {\n console.error([`MUI: The \\`theme.${themeKey}\\` array type cannot be combined with non integer values.` + `You should either use an integer value that can be used as index, or define the \\`theme.${themeKey}\\` as a number.`].join('\\n'));\n } else if (abs > themeSpacing.length - 1) {\n console.error([`MUI: The value provided (${abs}) overflows.`, `The supported values are: ${JSON.stringify(themeSpacing)}.`, `${abs} > ${themeSpacing.length - 1}, you need to add the missing values.`].join('\\n'));\n }\n }\n return themeSpacing[abs];\n };\n }\n if (typeof themeSpacing === 'function') {\n return themeSpacing;\n }\n if (process.env.NODE_ENV !== 'production') {\n console.error([`MUI: The \\`theme.${themeKey}\\` value (${themeSpacing}) is invalid.`, 'It should be a number, an array or a function.'].join('\\n'));\n }\n return () => undefined;\n}\nexport function createUnarySpacing(theme) {\n return createUnaryUnit(theme, 'spacing', 8, 'spacing');\n}\nexport function getValue(transformer, propValue) {\n if (typeof propValue === 'string' || propValue == null) {\n return propValue;\n }\n const abs = Math.abs(propValue);\n const transformed = transformer(abs);\n if (propValue >= 0) {\n return transformed;\n }\n if (typeof transformed === 'number') {\n return -transformed;\n }\n return `-${transformed}`;\n}\nexport function getStyleFromPropValue(cssProperties, transformer) {\n return propValue => cssProperties.reduce((acc, cssProperty) => {\n acc[cssProperty] = getValue(transformer, propValue);\n return acc;\n }, {});\n}\nfunction resolveCssProperty(props, keys, prop, transformer) {\n // Using a hash computation over an array iteration could be faster, but with only 28 items,\n // it's doesn't worth the bundle size.\n if (keys.indexOf(prop) === -1) {\n return null;\n }\n const cssProperties = getCssProperties(prop);\n const styleFromPropValue = getStyleFromPropValue(cssProperties, transformer);\n const propValue = props[prop];\n return handleBreakpoints(props, propValue, styleFromPropValue);\n}\nfunction style(props, keys) {\n const transformer = createUnarySpacing(props.theme);\n return Object.keys(props).map(prop => resolveCssProperty(props, keys, prop, transformer)).reduce(merge, {});\n}\nexport function margin(props) {\n return style(props, marginKeys);\n}\nmargin.propTypes = process.env.NODE_ENV !== 'production' ? marginKeys.reduce((obj, key) => {\n obj[key] = responsivePropType;\n return obj;\n}, {}) : {};\nmargin.filterProps = marginKeys;\nexport function padding(props) {\n return style(props, paddingKeys);\n}\npadding.propTypes = process.env.NODE_ENV !== 'production' ? paddingKeys.reduce((obj, key) => {\n obj[key] = responsivePropType;\n return obj;\n}, {}) : {};\npadding.filterProps = paddingKeys;\nfunction spacing(props) {\n return style(props, spacingKeys);\n}\nspacing.propTypes = process.env.NODE_ENV !== 'production' ? spacingKeys.reduce((obj, key) => {\n obj[key] = responsivePropType;\n return obj;\n}, {}) : {};\nspacing.filterProps = spacingKeys;\nexport default spacing;","export default function memoize(fn) {\n const cache = {};\n return arg => {\n if (cache[arg] === undefined) {\n cache[arg] = fn(arg);\n }\n return cache[arg];\n };\n}","import { unstable_capitalize as capitalize } from '@mui/utils';\nimport responsivePropType from './responsivePropType';\nimport { handleBreakpoints } from './breakpoints';\nexport function getPath(obj, path, checkVars = true) {\n if (!path || typeof path !== 'string') {\n return null;\n }\n\n // Check if CSS variables are used\n if (obj && obj.vars && checkVars) {\n const val = `vars.${path}`.split('.').reduce((acc, item) => acc && acc[item] ? acc[item] : null, obj);\n if (val != null) {\n return val;\n }\n }\n return path.split('.').reduce((acc, item) => {\n if (acc && acc[item] != null) {\n return acc[item];\n }\n return null;\n }, obj);\n}\nexport function getStyleValue(themeMapping, transform, propValueFinal, userValue = propValueFinal) {\n let value;\n if (typeof themeMapping === 'function') {\n value = themeMapping(propValueFinal);\n } else if (Array.isArray(themeMapping)) {\n value = themeMapping[propValueFinal] || userValue;\n } else {\n value = getPath(themeMapping, propValueFinal) || userValue;\n }\n if (transform) {\n value = transform(value, userValue, themeMapping);\n }\n return value;\n}\nfunction style(options) {\n const {\n prop,\n cssProperty = options.prop,\n themeKey,\n transform\n } = options;\n\n // false positive\n // eslint-disable-next-line react/function-component-definition\n const fn = props => {\n if (props[prop] == null) {\n return null;\n }\n const propValue = props[prop];\n const theme = props.theme;\n const themeMapping = getPath(theme, themeKey) || {};\n const styleFromPropValue = propValueFinal => {\n let value = getStyleValue(themeMapping, transform, propValueFinal);\n if (propValueFinal === value && typeof propValueFinal === 'string') {\n // Haven't found value\n value = getStyleValue(themeMapping, transform, `${prop}${propValueFinal === 'default' ? '' : capitalize(propValueFinal)}`, propValueFinal);\n }\n if (cssProperty === false) {\n return value;\n }\n return {\n [cssProperty]: value\n };\n };\n return handleBreakpoints(props, propValue, styleFromPropValue);\n };\n fn.propTypes = process.env.NODE_ENV !== 'production' ? {\n [prop]: responsivePropType\n } : {};\n fn.filterProps = [prop];\n return fn;\n}\nexport default style;","import merge from './merge';\nfunction compose(...styles) {\n const handlers = styles.reduce((acc, style) => {\n style.filterProps.forEach(prop => {\n acc[prop] = style;\n });\n return acc;\n }, {});\n\n // false positive\n // eslint-disable-next-line react/function-component-definition\n const fn = props => {\n return Object.keys(props).reduce((acc, prop) => {\n if (handlers[prop]) {\n return merge(acc, handlers[prop](props));\n }\n return acc;\n }, {});\n };\n fn.propTypes = process.env.NODE_ENV !== 'production' ? styles.reduce((acc, style) => Object.assign(acc, style.propTypes), {}) : {};\n fn.filterProps = styles.reduce((acc, style) => acc.concat(style.filterProps), []);\n return fn;\n}\nexport default compose;","import responsivePropType from './responsivePropType';\nimport style from './style';\nimport compose from './compose';\nimport { createUnaryUnit, getValue } from './spacing';\nimport { handleBreakpoints } from './breakpoints';\nexport function borderTransform(value) {\n if (typeof value !== 'number') {\n return value;\n }\n return `${value}px solid`;\n}\nexport const border = style({\n prop: 'border',\n themeKey: 'borders',\n transform: borderTransform\n});\nexport const borderTop = style({\n prop: 'borderTop',\n themeKey: 'borders',\n transform: borderTransform\n});\nexport const borderRight = style({\n prop: 'borderRight',\n themeKey: 'borders',\n transform: borderTransform\n});\nexport const borderBottom = style({\n prop: 'borderBottom',\n themeKey: 'borders',\n transform: borderTransform\n});\nexport const borderLeft = style({\n prop: 'borderLeft',\n themeKey: 'borders',\n transform: borderTransform\n});\nexport const borderColor = style({\n prop: 'borderColor',\n themeKey: 'palette'\n});\nexport const borderTopColor = style({\n prop: 'borderTopColor',\n themeKey: 'palette'\n});\nexport const borderRightColor = style({\n prop: 'borderRightColor',\n themeKey: 'palette'\n});\nexport const borderBottomColor = style({\n prop: 'borderBottomColor',\n themeKey: 'palette'\n});\nexport const borderLeftColor = style({\n prop: 'borderLeftColor',\n themeKey: 'palette'\n});\n\n// false positive\n// eslint-disable-next-line react/function-component-definition\nexport const borderRadius = props => {\n if (props.borderRadius !== undefined && props.borderRadius !== null) {\n const transformer = createUnaryUnit(props.theme, 'shape.borderRadius', 4, 'borderRadius');\n const styleFromPropValue = propValue => ({\n borderRadius: getValue(transformer, propValue)\n });\n return handleBreakpoints(props, props.borderRadius, styleFromPropValue);\n }\n return null;\n};\nborderRadius.propTypes = process.env.NODE_ENV !== 'production' ? {\n borderRadius: responsivePropType\n} : {};\nborderRadius.filterProps = ['borderRadius'];\nconst borders = compose(border, borderTop, borderRight, borderBottom, borderLeft, borderColor, borderTopColor, borderRightColor, borderBottomColor, borderLeftColor, borderRadius);\nexport default borders;","import style from './style';\nimport compose from './compose';\nimport { createUnaryUnit, getValue } from './spacing';\nimport { handleBreakpoints } from './breakpoints';\nimport responsivePropType from './responsivePropType';\n\n// false positive\n// eslint-disable-next-line react/function-component-definition\nexport const gap = props => {\n if (props.gap !== undefined && props.gap !== null) {\n const transformer = createUnaryUnit(props.theme, 'spacing', 8, 'gap');\n const styleFromPropValue = propValue => ({\n gap: getValue(transformer, propValue)\n });\n return handleBreakpoints(props, props.gap, styleFromPropValue);\n }\n return null;\n};\ngap.propTypes = process.env.NODE_ENV !== 'production' ? {\n gap: responsivePropType\n} : {};\ngap.filterProps = ['gap'];\n\n// false positive\n// eslint-disable-next-line react/function-component-definition\nexport const columnGap = props => {\n if (props.columnGap !== undefined && props.columnGap !== null) {\n const transformer = createUnaryUnit(props.theme, 'spacing', 8, 'columnGap');\n const styleFromPropValue = propValue => ({\n columnGap: getValue(transformer, propValue)\n });\n return handleBreakpoints(props, props.columnGap, styleFromPropValue);\n }\n return null;\n};\ncolumnGap.propTypes = process.env.NODE_ENV !== 'production' ? {\n columnGap: responsivePropType\n} : {};\ncolumnGap.filterProps = ['columnGap'];\n\n// false positive\n// eslint-disable-next-line react/function-component-definition\nexport const rowGap = props => {\n if (props.rowGap !== undefined && props.rowGap !== null) {\n const transformer = createUnaryUnit(props.theme, 'spacing', 8, 'rowGap');\n const styleFromPropValue = propValue => ({\n rowGap: getValue(transformer, propValue)\n });\n return handleBreakpoints(props, props.rowGap, styleFromPropValue);\n }\n return null;\n};\nrowGap.propTypes = process.env.NODE_ENV !== 'production' ? {\n rowGap: responsivePropType\n} : {};\nrowGap.filterProps = ['rowGap'];\nexport const gridColumn = style({\n prop: 'gridColumn'\n});\nexport const gridRow = style({\n prop: 'gridRow'\n});\nexport const gridAutoFlow = style({\n prop: 'gridAutoFlow'\n});\nexport const gridAutoColumns = style({\n prop: 'gridAutoColumns'\n});\nexport const gridAutoRows = style({\n prop: 'gridAutoRows'\n});\nexport const gridTemplateColumns = style({\n prop: 'gridTemplateColumns'\n});\nexport const gridTemplateRows = style({\n prop: 'gridTemplateRows'\n});\nexport const gridTemplateAreas = style({\n prop: 'gridTemplateAreas'\n});\nexport const gridArea = style({\n prop: 'gridArea'\n});\nconst grid = compose(gap, columnGap, rowGap, gridColumn, gridRow, gridAutoFlow, gridAutoColumns, gridAutoRows, gridTemplateColumns, gridTemplateRows, gridTemplateAreas, gridArea);\nexport default grid;","import style from './style';\nimport compose from './compose';\nexport function paletteTransform(value, userValue) {\n if (userValue === 'grey') {\n return userValue;\n }\n return value;\n}\nexport const color = style({\n prop: 'color',\n themeKey: 'palette',\n transform: paletteTransform\n});\nexport const bgcolor = style({\n prop: 'bgcolor',\n cssProperty: 'backgroundColor',\n themeKey: 'palette',\n transform: paletteTransform\n});\nexport const backgroundColor = style({\n prop: 'backgroundColor',\n themeKey: 'palette',\n transform: paletteTransform\n});\nconst palette = compose(color, bgcolor, backgroundColor);\nexport default palette;","import style from './style';\nimport compose from './compose';\nimport { handleBreakpoints, values as breakpointsValues } from './breakpoints';\nexport function sizingTransform(value) {\n return value <= 1 && value !== 0 ? `${value * 100}%` : value;\n}\nexport const width = style({\n prop: 'width',\n transform: sizingTransform\n});\nexport const maxWidth = props => {\n if (props.maxWidth !== undefined && props.maxWidth !== null) {\n const styleFromPropValue = propValue => {\n var _props$theme, _props$theme$breakpoi, _props$theme$breakpoi2;\n const breakpoint = ((_props$theme = props.theme) == null ? void 0 : (_props$theme$breakpoi = _props$theme.breakpoints) == null ? void 0 : (_props$theme$breakpoi2 = _props$theme$breakpoi.values) == null ? void 0 : _props$theme$breakpoi2[propValue]) || breakpointsValues[propValue];\n return {\n maxWidth: breakpoint || sizingTransform(propValue)\n };\n };\n return handleBreakpoints(props, props.maxWidth, styleFromPropValue);\n }\n return null;\n};\nmaxWidth.filterProps = ['maxWidth'];\nexport const minWidth = style({\n prop: 'minWidth',\n transform: sizingTransform\n});\nexport const height = style({\n prop: 'height',\n transform: sizingTransform\n});\nexport const maxHeight = style({\n prop: 'maxHeight',\n transform: sizingTransform\n});\nexport const minHeight = style({\n prop: 'minHeight',\n transform: sizingTransform\n});\nexport const sizeWidth = style({\n prop: 'size',\n cssProperty: 'width',\n transform: sizingTransform\n});\nexport const sizeHeight = style({\n prop: 'size',\n cssProperty: 'height',\n transform: sizingTransform\n});\nexport const boxSizing = style({\n prop: 'boxSizing'\n});\nconst sizing = compose(width, maxWidth, minWidth, height, maxHeight, minHeight, boxSizing);\nexport default sizing;","import { padding, margin } from '../spacing';\nimport { borderRadius, borderTransform } from '../borders';\nimport { gap, rowGap, columnGap } from '../cssGrid';\nimport { paletteTransform } from '../palette';\nimport { maxWidth, sizingTransform } from '../sizing';\nconst defaultSxConfig = {\n // borders\n border: {\n themeKey: 'borders',\n transform: borderTransform\n },\n borderTop: {\n themeKey: 'borders',\n transform: borderTransform\n },\n borderRight: {\n themeKey: 'borders',\n transform: borderTransform\n },\n borderBottom: {\n themeKey: 'borders',\n transform: borderTransform\n },\n borderLeft: {\n themeKey: 'borders',\n transform: borderTransform\n },\n borderColor: {\n themeKey: 'palette'\n },\n borderTopColor: {\n themeKey: 'palette'\n },\n borderRightColor: {\n themeKey: 'palette'\n },\n borderBottomColor: {\n themeKey: 'palette'\n },\n borderLeftColor: {\n themeKey: 'palette'\n },\n borderRadius: {\n themeKey: 'shape.borderRadius',\n style: borderRadius\n },\n // palette\n color: {\n themeKey: 'palette',\n transform: paletteTransform\n },\n bgcolor: {\n themeKey: 'palette',\n cssProperty: 'backgroundColor',\n transform: paletteTransform\n },\n backgroundColor: {\n themeKey: 'palette',\n transform: paletteTransform\n },\n // spacing\n p: {\n style: padding\n },\n pt: {\n style: padding\n },\n pr: {\n style: padding\n },\n pb: {\n style: padding\n },\n pl: {\n style: padding\n },\n px: {\n style: padding\n },\n py: {\n style: padding\n },\n padding: {\n style: padding\n },\n paddingTop: {\n style: padding\n },\n paddingRight: {\n style: padding\n },\n paddingBottom: {\n style: padding\n },\n paddingLeft: {\n style: padding\n },\n paddingX: {\n style: padding\n },\n paddingY: {\n style: padding\n },\n paddingInline: {\n style: padding\n },\n paddingInlineStart: {\n style: padding\n },\n paddingInlineEnd: {\n style: padding\n },\n paddingBlock: {\n style: padding\n },\n paddingBlockStart: {\n style: padding\n },\n paddingBlockEnd: {\n style: padding\n },\n m: {\n style: margin\n },\n mt: {\n style: margin\n },\n mr: {\n style: margin\n },\n mb: {\n style: margin\n },\n ml: {\n style: margin\n },\n mx: {\n style: margin\n },\n my: {\n style: margin\n },\n margin: {\n style: margin\n },\n marginTop: {\n style: margin\n },\n marginRight: {\n style: margin\n },\n marginBottom: {\n style: margin\n },\n marginLeft: {\n style: margin\n },\n marginX: {\n style: margin\n },\n marginY: {\n style: margin\n },\n marginInline: {\n style: margin\n },\n marginInlineStart: {\n style: margin\n },\n marginInlineEnd: {\n style: margin\n },\n marginBlock: {\n style: margin\n },\n marginBlockStart: {\n style: margin\n },\n marginBlockEnd: {\n style: margin\n },\n // display\n displayPrint: {\n cssProperty: false,\n transform: value => ({\n '@media print': {\n display: value\n }\n })\n },\n display: {},\n overflow: {},\n textOverflow: {},\n visibility: {},\n whiteSpace: {},\n // flexbox\n flexBasis: {},\n flexDirection: {},\n flexWrap: {},\n justifyContent: {},\n alignItems: {},\n alignContent: {},\n order: {},\n flex: {},\n flexGrow: {},\n flexShrink: {},\n alignSelf: {},\n justifyItems: {},\n justifySelf: {},\n // grid\n gap: {\n style: gap\n },\n rowGap: {\n style: rowGap\n },\n columnGap: {\n style: columnGap\n },\n gridColumn: {},\n gridRow: {},\n gridAutoFlow: {},\n gridAutoColumns: {},\n gridAutoRows: {},\n gridTemplateColumns: {},\n gridTemplateRows: {},\n gridTemplateAreas: {},\n gridArea: {},\n // positions\n position: {},\n zIndex: {\n themeKey: 'zIndex'\n },\n top: {},\n right: {},\n bottom: {},\n left: {},\n // shadows\n boxShadow: {\n themeKey: 'shadows'\n },\n // sizing\n width: {\n transform: sizingTransform\n },\n maxWidth: {\n style: maxWidth\n },\n minWidth: {\n transform: sizingTransform\n },\n height: {\n transform: sizingTransform\n },\n maxHeight: {\n transform: sizingTransform\n },\n minHeight: {\n transform: sizingTransform\n },\n boxSizing: {},\n // typography\n fontFamily: {\n themeKey: 'typography'\n },\n fontSize: {\n themeKey: 'typography'\n },\n fontStyle: {\n themeKey: 'typography'\n },\n fontWeight: {\n themeKey: 'typography'\n },\n letterSpacing: {},\n textTransform: {},\n lineHeight: {},\n textAlign: {},\n typography: {\n cssProperty: false,\n themeKey: 'typography'\n }\n};\nexport default defaultSxConfig;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"sx\"];\nimport { isPlainObject } from '@mui/utils';\nimport defaultSxConfig from './defaultSxConfig';\nconst splitProps = props => {\n var _props$theme$unstable, _props$theme;\n const result = {\n systemProps: {},\n otherProps: {}\n };\n const config = (_props$theme$unstable = props == null ? void 0 : (_props$theme = props.theme) == null ? void 0 : _props$theme.unstable_sxConfig) != null ? _props$theme$unstable : defaultSxConfig;\n Object.keys(props).forEach(prop => {\n if (config[prop]) {\n result.systemProps[prop] = props[prop];\n } else {\n result.otherProps[prop] = props[prop];\n }\n });\n return result;\n};\nexport default function extendSxProp(props) {\n const {\n sx: inSx\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const {\n systemProps,\n otherProps\n } = splitProps(other);\n let finalSx;\n if (Array.isArray(inSx)) {\n finalSx = [systemProps, ...inSx];\n } else if (typeof inSx === 'function') {\n finalSx = (...args) => {\n const result = inSx(...args);\n if (!isPlainObject(result)) {\n return systemProps;\n }\n return _extends({}, systemProps, result);\n };\n } else {\n finalSx = _extends({}, systemProps, inSx);\n }\n return _extends({}, otherProps, {\n sx: finalSx\n });\n}","import { unstable_capitalize as capitalize } from '@mui/utils';\nimport merge from '../merge';\nimport { getPath, getStyleValue as getValue } from '../style';\nimport { handleBreakpoints, createEmptyBreakpointObject, removeUnusedBreakpoints } from '../breakpoints';\nimport defaultSxConfig from './defaultSxConfig';\nfunction objectsHaveSameKeys(...objects) {\n const allKeys = objects.reduce((keys, object) => keys.concat(Object.keys(object)), []);\n const union = new Set(allKeys);\n return objects.every(object => union.size === Object.keys(object).length);\n}\nfunction callIfFn(maybeFn, arg) {\n return typeof maybeFn === 'function' ? maybeFn(arg) : maybeFn;\n}\n\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport function unstable_createStyleFunctionSx() {\n function getThemeValue(prop, val, theme, config) {\n const props = {\n [prop]: val,\n theme\n };\n const options = config[prop];\n if (!options) {\n return {\n [prop]: val\n };\n }\n const {\n cssProperty = prop,\n themeKey,\n transform,\n style\n } = options;\n if (val == null) {\n return null;\n }\n if (themeKey === 'typography' && val === 'inherit') {\n return {\n [prop]: val\n };\n }\n const themeMapping = getPath(theme, themeKey) || {};\n if (style) {\n return style(props);\n }\n const styleFromPropValue = propValueFinal => {\n let value = getValue(themeMapping, transform, propValueFinal);\n if (propValueFinal === value && typeof propValueFinal === 'string') {\n // Haven't found value\n value = getValue(themeMapping, transform, `${prop}${propValueFinal === 'default' ? '' : capitalize(propValueFinal)}`, propValueFinal);\n }\n if (cssProperty === false) {\n return value;\n }\n return {\n [cssProperty]: value\n };\n };\n return handleBreakpoints(props, val, styleFromPropValue);\n }\n function styleFunctionSx(props) {\n var _theme$unstable_sxCon;\n const {\n sx,\n theme = {}\n } = props || {};\n if (!sx) {\n return null; // Emotion & styled-components will neglect null\n }\n\n const config = (_theme$unstable_sxCon = theme.unstable_sxConfig) != null ? _theme$unstable_sxCon : defaultSxConfig;\n\n /*\n * Receive `sxInput` as object or callback\n * and then recursively check keys & values to create media query object styles.\n * (the result will be used in `styled`)\n */\n function traverse(sxInput) {\n let sxObject = sxInput;\n if (typeof sxInput === 'function') {\n sxObject = sxInput(theme);\n } else if (typeof sxInput !== 'object') {\n // value\n return sxInput;\n }\n if (!sxObject) {\n return null;\n }\n const emptyBreakpoints = createEmptyBreakpointObject(theme.breakpoints);\n const breakpointsKeys = Object.keys(emptyBreakpoints);\n let css = emptyBreakpoints;\n Object.keys(sxObject).forEach(styleKey => {\n const value = callIfFn(sxObject[styleKey], theme);\n if (value !== null && value !== undefined) {\n if (typeof value === 'object') {\n if (config[styleKey]) {\n css = merge(css, getThemeValue(styleKey, value, theme, config));\n } else {\n const breakpointsValues = handleBreakpoints({\n theme\n }, value, x => ({\n [styleKey]: x\n }));\n if (objectsHaveSameKeys(breakpointsValues, value)) {\n css[styleKey] = styleFunctionSx({\n sx: value,\n theme\n });\n } else {\n css = merge(css, breakpointsValues);\n }\n }\n } else {\n css = merge(css, getThemeValue(styleKey, value, theme, config));\n }\n }\n });\n return removeUnusedBreakpoints(breakpointsKeys, css);\n }\n return Array.isArray(sx) ? sx.map(traverse) : traverse(sx);\n }\n return styleFunctionSx;\n}\nconst styleFunctionSx = unstable_createStyleFunctionSx();\nstyleFunctionSx.filterProps = ['sx'];\nexport default styleFunctionSx;","import createStyled from './createStyled';\nconst styled = createStyled();\nexport default styled;","import createTheme from './createTheme';\nimport useThemeWithoutDefault from './useThemeWithoutDefault';\nexport const systemDefaultTheme = createTheme();\nfunction useTheme(defaultTheme = systemDefaultTheme) {\n return useThemeWithoutDefault(defaultTheme);\n}\nexport default useTheme;","import { internal_resolveProps as resolveProps } from '@mui/utils';\nexport default function getThemeProps(params) {\n const {\n theme,\n name,\n props\n } = params;\n if (!theme || !theme.components || !theme.components[name] || !theme.components[name].defaultProps) {\n return props;\n }\n return resolveProps(theme.components[name].defaultProps, props);\n}","import getThemeProps from './getThemeProps';\nimport useTheme from '../useTheme';\nexport default function useThemeProps({\n props,\n name,\n defaultTheme,\n themeId\n}) {\n let theme = useTheme(defaultTheme);\n if (themeId) {\n theme = theme[themeId] || theme;\n }\n const mergedProps = getThemeProps({\n theme,\n name,\n props\n });\n return mergedProps;\n}","import * as React from 'react';\nimport { ThemeContext } from '@mui/styled-engine';\nfunction isObjectEmpty(obj) {\n return Object.keys(obj).length === 0;\n}\nfunction useTheme(defaultTheme = null) {\n const contextTheme = React.useContext(ThemeContext);\n return !contextTheme || isObjectEmpty(contextTheme) ? defaultTheme : contextTheme;\n}\nexport default useTheme;","function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e))for(t=0;t componentName;\nconst createClassNameGenerator = () => {\n let generate = defaultGenerator;\n return {\n configure(generator) {\n generate = generator;\n },\n generate(componentName) {\n return generate(componentName);\n },\n reset() {\n generate = defaultGenerator;\n }\n };\n};\nconst ClassNameGenerator = createClassNameGenerator();\nexport default ClassNameGenerator;","import _formatMuiErrorMessage from \"../formatMuiErrorMessage\";\n// It should to be noted that this function isn't equivalent to `text-transform: capitalize`.\n//\n// A strict capitalization should uppercase the first letter of each word in the sentence.\n// We only handle the first word.\nexport default function capitalize(string) {\n if (typeof string !== 'string') {\n throw new Error(process.env.NODE_ENV !== \"production\" ? `MUI: \\`capitalize(string)\\` expects a string argument.` : _formatMuiErrorMessage(7));\n }\n return string.charAt(0).toUpperCase() + string.slice(1);\n}","export default function composeClasses(slots, getUtilityClass, classes = undefined) {\n const output = {};\n Object.keys(slots).forEach(\n // `Objet.keys(slots)` can't be wider than `T` because we infer `T` from `slots`.\n // @ts-expect-error https://github.com/microsoft/TypeScript/pull/12253#issuecomment-263132208\n slot => {\n output[slot] = slots[slot].reduce((acc, key) => {\n if (key) {\n const utilityClass = getUtilityClass(key);\n if (utilityClass !== '') {\n acc.push(utilityClass);\n }\n if (classes && classes[key]) {\n acc.push(classes[key]);\n }\n }\n return acc;\n }, []).join(' ');\n });\n return output;\n}","/**\n * Safe chained function.\n *\n * Will only create a new function if needed,\n * otherwise will pass back existing functions or null.\n */\nexport default function createChainedFunction(...funcs) {\n return funcs.reduce((acc, func) => {\n if (func == null) {\n return acc;\n }\n return function chainedFunction(...args) {\n acc.apply(this, args);\n func.apply(this, args);\n };\n }, () => {});\n}","// 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, wait = 166) {\n let timeout;\n function debounced(...args) {\n const later = () => {\n // @ts-ignore\n func.apply(this, args);\n };\n clearTimeout(timeout);\n timeout = setTimeout(later, wait);\n }\n debounced.clear = () => {\n clearTimeout(timeout);\n };\n return debounced;\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nexport function isPlainObject(item) {\n return item !== null && typeof item === 'object' && item.constructor === Object;\n}\nfunction deepClone(source) {\n if (!isPlainObject(source)) {\n return source;\n }\n const output = {};\n Object.keys(source).forEach(key => {\n output[key] = deepClone(source[key]);\n });\n return output;\n}\nexport default function deepmerge(target, source, options = {\n clone: true\n}) {\n const output = options.clone ? _extends({}, target) : target;\n if (isPlainObject(target) && isPlainObject(source)) {\n Object.keys(source).forEach(key => {\n // Avoid prototype pollution\n if (key === '__proto__') {\n return;\n }\n if (isPlainObject(source[key]) && key in target && isPlainObject(target[key])) {\n // Since `output` is a clone of `target` and we have narrowed `target` in this block we can cast to the same type.\n output[key] = deepmerge(target[key], source[key], options);\n } else if (options.clone) {\n output[key] = isPlainObject(source[key]) ? deepClone(source[key]) : source[key];\n } else {\n output[key] = source[key];\n }\n });\n }\n return output;\n}","/**\n * WARNING: Don't import this directly.\n * Use `MuiError` from `@mui/utils/macros/MuiError.macro` instead.\n * @param {number} code\n */\nexport default function formatMuiErrorMessage(code) {\n // Apply babel-plugin-transform-template-literals in loose mode\n // loose mode is safe iff we're concatenating primitives\n // see https://babeljs.io/docs/en/babel-plugin-transform-template-literals#loose\n /* eslint-disable prefer-template */\n let url = 'https://mui.com/production-error/?code=' + code;\n for (let i = 1; i < arguments.length; i += 1) {\n // rest params over-transpile for this case\n // eslint-disable-next-line prefer-rest-params\n url += '&args[]=' + encodeURIComponent(arguments[i]);\n }\n return 'Minified MUI error #' + code + '; visit ' + url + ' for the full message.';\n /* eslint-enable prefer-template */\n}","import ClassNameGenerator from '../ClassNameGenerator';\nconst globalStateClassesMapping = {\n active: 'active',\n checked: 'checked',\n completed: 'completed',\n disabled: 'disabled',\n readOnly: 'readOnly',\n error: 'error',\n expanded: 'expanded',\n focused: 'focused',\n focusVisible: 'focusVisible',\n required: 'required',\n selected: 'selected'\n};\nexport default function generateUtilityClass(componentName, slot, globalStatePrefix = 'Mui') {\n const globalStateClass = globalStateClassesMapping[slot];\n return globalStateClass ? `${globalStatePrefix}-${globalStateClass}` : `${ClassNameGenerator.generate(componentName)}-${slot}`;\n}","import generateUtilityClass from '../generateUtilityClass';\nexport default function generateUtilityClasses(componentName, slots, globalStatePrefix = 'Mui') {\n const result = {};\n slots.forEach(slot => {\n result[slot] = generateUtilityClass(componentName, slot, globalStatePrefix);\n });\n return result;\n}","// A change of the browser zoom change the scrollbar size.\n// Credit https://github.com/twbs/bootstrap/blob/488fd8afc535ca3a6ad4dc581f5e89217b6a36ac/js/src/util/scrollbar.js#L14-L18\nexport default function getScrollbarSize(doc) {\n // https://developer.mozilla.org/en-US/docs/Web/API/Window/innerWidth#usage_notes\n const documentWidth = doc.documentElement.clientWidth;\n return Math.abs(window.innerWidth - documentWidth);\n}","export default function ownerDocument(node) {\n return node && node.ownerDocument || document;\n}","import ownerDocument from '../ownerDocument';\nexport default function ownerWindow(node) {\n const doc = ownerDocument(node);\n return doc.defaultView || window;\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\n/**\n * Add keys, values of `defaultProps` that does not exist in `props`\n * @param {object} defaultProps\n * @param {object} props\n * @returns {object} resolved props\n */\nexport default function resolveProps(defaultProps, props) {\n const output = _extends({}, props);\n Object.keys(defaultProps).forEach(propName => {\n if (propName.toString().match(/^(components|slots)$/)) {\n output[propName] = _extends({}, defaultProps[propName], output[propName]);\n } else if (propName.toString().match(/^(componentsProps|slotProps)$/)) {\n const defaultSlotProps = defaultProps[propName] || {};\n const slotProps = props[propName];\n output[propName] = {};\n if (!slotProps || !Object.keys(slotProps)) {\n // Reduce the iteration if the slot props is empty\n output[propName] = defaultSlotProps;\n } else if (!defaultSlotProps || !Object.keys(defaultSlotProps)) {\n // Reduce the iteration if the default slot props is empty\n output[propName] = slotProps;\n } else {\n output[propName] = _extends({}, slotProps);\n Object.keys(defaultSlotProps).forEach(slotPropName => {\n output[propName][slotPropName] = resolveProps(defaultSlotProps[slotPropName], slotProps[slotPropName]);\n });\n }\n } else if (output[propName] === undefined) {\n output[propName] = defaultProps[propName];\n }\n });\n return output;\n}","/**\n * TODO v5: consider making it private\n *\n * passes {value} to {ref}\n *\n * WARNING: Be sure to only call this inside a callback that is passed as a ref.\n * Otherwise, make sure to cleanup the previous {ref} if it changes. See\n * https://github.com/mui/material-ui/issues/13539\n *\n * Useful if you want to expose the ref of an inner component to the public API\n * while still using it inside the component.\n * @param ref A ref callback or ref object. If anything falsy, this is a no-op.\n */\nexport default function setRef(ref, value) {\n if (typeof ref === 'function') {\n ref(value);\n } else if (ref) {\n ref.current = value;\n }\n}","/* eslint-disable react-hooks/rules-of-hooks, react-hooks/exhaustive-deps */\nimport * as React from 'react';\nexport default function useControlled({\n controlled,\n default: defaultProp,\n name,\n state = 'value'\n}) {\n // isControlled is ignored in the hook dependency lists as it should never change.\n const {\n current: isControlled\n } = React.useRef(controlled !== undefined);\n const [valueState, setValue] = React.useState(defaultProp);\n const value = isControlled ? controlled : valueState;\n if (process.env.NODE_ENV !== 'production') {\n React.useEffect(() => {\n if (isControlled !== (controlled !== undefined)) {\n console.error([`MUI: A component is changing the ${isControlled ? '' : 'un'}controlled ${state} state of ${name} to be ${isControlled ? 'un' : ''}controlled.`, 'Elements should not switch from uncontrolled to controlled (or vice versa).', `Decide between using a controlled or uncontrolled ${name} ` + 'element for the lifetime of the component.', \"The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.\", 'More info: https://fb.me/react-controlled-components'].join('\\n'));\n }\n }, [state, name, controlled]);\n const {\n current: defaultValue\n } = React.useRef(defaultProp);\n React.useEffect(() => {\n if (!isControlled && defaultValue !== defaultProp) {\n console.error([`MUI: A component is changing the default ${state} state of an uncontrolled ${name} after being initialized. ` + `To suppress this warning opt to use a controlled ${name}.`].join('\\n'));\n }\n }, [JSON.stringify(defaultProp)]);\n }\n const setValueIfUncontrolled = React.useCallback(newValue => {\n if (!isControlled) {\n setValue(newValue);\n }\n }, []);\n return [value, setValueIfUncontrolled];\n}","import * as React from 'react';\nconst useEnhancedEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;\nexport default useEnhancedEffect;","import * as React from 'react';\nimport useEnhancedEffect from '../useEnhancedEffect';\n\n/**\n * https://github.com/facebook/react/issues/14099#issuecomment-440013892\n */\nexport default function useEventCallback(fn) {\n const ref = React.useRef(fn);\n useEnhancedEffect(() => {\n ref.current = fn;\n });\n return React.useCallback((...args) =>\n // @ts-expect-error hide `this`\n // tslint:disable-next-line:ban-comma-operator\n (0, ref.current)(...args), []);\n}","import * as React from 'react';\nimport setRef from '../setRef';\nexport default function useForkRef(...refs) {\n /**\n * This will create a new function if the refs passed to this hook change and are all defined.\n * This means react will call the old forkRef with `null` and the new forkRef\n * with the ref. Cleanup naturally emerges from this behavior.\n */\n return React.useMemo(() => {\n if (refs.every(ref => ref == null)) {\n return null;\n }\n return instance => {\n refs.forEach(ref => {\n setRef(ref, instance);\n });\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, refs);\n}","import * as React from 'react';\nlet globalId = 0;\nfunction useGlobalId(idOverride) {\n const [defaultId, setDefaultId] = React.useState(idOverride);\n const id = idOverride || defaultId;\n React.useEffect(() => {\n if (defaultId == null) {\n // Fallback to this default id when possible.\n // Use the incrementing value for client-side rendering only.\n // We can't use it server-side.\n // If you want to use random values please consider the Birthday Problem: https://en.wikipedia.org/wiki/Birthday_problem\n globalId += 1;\n setDefaultId(`mui-${globalId}`);\n }\n }, [defaultId]);\n return id;\n}\n\n// downstream bundlers may remove unnecessary concatenation, but won't remove toString call -- Workaround for https://github.com/webpack/webpack/issues/14814\nconst maybeReactUseId = React['useId'.toString()];\n/**\n *\n * @example
\n * @param idOverride\n * @returns {string}\n */\nexport default function useId(idOverride) {\n if (maybeReactUseId !== undefined) {\n const reactId = maybeReactUseId();\n return idOverride != null ? idOverride : reactId;\n }\n // eslint-disable-next-line react-hooks/rules-of-hooks -- `React.useId` is invariant at runtime.\n return useGlobalId(idOverride);\n}","import * as React from 'react';\nconst usePreviousProps = value => {\n const ref = React.useRef({});\n React.useEffect(() => {\n ref.current = value;\n });\n return ref.current;\n};\nexport default usePreviousProps;","export default function _extends() {\n _extends = Object.assign ? Object.assign.bind() : function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n return target;\n };\n return _extends.apply(this, arguments);\n}","export const gridPinnedColumnsSelector = state => state.pinnedColumns;","export default function _objectWithoutPropertiesLoose(source, excluded) {\n if (source == null) return {};\n var target = {};\n var sourceKeys = Object.keys(source);\n var key, i;\n for (i = 0; i < sourceKeys.length; i++) {\n key = sourceKeys[i];\n if (excluded.indexOf(key) >= 0) continue;\n target[key] = source[key];\n }\n return target;\n}","import { useGridPrivateApiContext as useCommunityGridPrivateApiContext } from '@mui/x-data-grid/internals';\nexport const useGridPrivateApiContext = useCommunityGridPrivateApiContext;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"rowId\", \"height\", \"style\"];\nimport * as React from 'react';\nimport Box from '@mui/material/Box';\nimport { styled } from '@mui/material/styles';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { useGridPrivateApiContext } from '../hooks/utils/useGridPrivateApiContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst DetailPanel = styled(Box, {\n name: 'MuiDataGrid',\n slot: 'DetailPanel',\n overridesResolver: (props, styles) => styles.detailPanel\n})(({\n theme\n}) => ({\n zIndex: 2,\n width: '100%',\n position: 'absolute',\n backgroundColor: (theme.vars || theme).palette.background.default,\n overflow: 'auto'\n}));\nfunction GridDetailPanel(props) {\n const {\n rowId,\n height,\n style: styleProp = {}\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const apiRef = useGridPrivateApiContext();\n const ref = React.useRef();\n const rootProps = useGridRootProps();\n const ownerState = rootProps;\n React.useLayoutEffect(() => {\n if (height === 'auto' && typeof ResizeObserver === 'undefined') {\n // Fallback for IE\n apiRef.current.storeDetailPanelHeight(rowId, ref.current.clientHeight);\n }\n }, [apiRef, height, rowId]);\n React.useLayoutEffect(() => {\n const hasFixedHeight = height !== 'auto';\n if (hasFixedHeight || typeof ResizeObserver === 'undefined') {\n return undefined;\n }\n const resizeObserver = new ResizeObserver(entries => {\n const [entry] = entries;\n const observedHeight = entry.borderBoxSize && entry.borderBoxSize.length > 0 ? entry.borderBoxSize[0].blockSize : entry.contentRect.height;\n apiRef.current.storeDetailPanelHeight(rowId, observedHeight);\n });\n resizeObserver.observe(ref.current);\n return () => resizeObserver.disconnect();\n }, [apiRef, height, rowId]);\n const style = _extends({}, styleProp, {\n height\n });\n return /*#__PURE__*/_jsx(DetailPanel, _extends({\n ref: ref,\n ownerState: ownerState,\n style: style\n }, other));\n}\nexport { GridDetailPanel };","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"className\", \"disableVirtualization\"];\nimport * as React from 'react';\nimport { styled, alpha, useTheme } from '@mui/material/styles';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { useGridSelector, getDataGridUtilityClass, gridClasses, gridVisibleColumnFieldsSelector, gridRowsMetaSelector, useGridApiEventHandler, GridOverlays } from '@mui/x-data-grid';\nimport { GridVirtualScroller, GridVirtualScrollerContent, GridVirtualScrollerRenderZone, useGridVirtualScroller, calculatePinnedRowsHeight } from '@mui/x-data-grid/internals';\nimport { useGridPrivateApiContext } from '../hooks/utils/useGridPrivateApiContext';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { gridPinnedColumnsSelector, GridPinnedPosition } from '../hooks/features/columnPinning';\nimport { gridDetailPanelExpandedRowsContentCacheSelector, gridDetailPanelExpandedRowsHeightCacheSelector, gridDetailPanelExpandedRowIdsSelector } from '../hooks/features/detailPanel';\nimport { GridDetailPanel } from './GridDetailPanel';\nimport { gridPinnedRowsSelector } from '../hooks/features/rowPinning/gridRowPinningSelector';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nexport const filterColumns = (pinnedColumns, columns, invert) => {\n var _pinnedColumns$left, _pinnedColumns$right;\n if (!Array.isArray(pinnedColumns.left) && !Array.isArray(pinnedColumns.right)) {\n return [[], []];\n }\n if (((_pinnedColumns$left = pinnedColumns.left) == null ? void 0 : _pinnedColumns$left.length) === 0 && ((_pinnedColumns$right = pinnedColumns.right) == null ? void 0 : _pinnedColumns$right.length) === 0) {\n return [[], []];\n }\n const filter = (newPinnedColumns, remainingColumns) => {\n if (!Array.isArray(newPinnedColumns)) {\n return [];\n }\n return newPinnedColumns.filter(field => remainingColumns.includes(field));\n };\n const leftPinnedColumns = filter(pinnedColumns.left, columns);\n const columnsWithoutLeftPinnedColumns = columns.filter(\n // Filter out from the remaining columns those columns already pinned to the left\n field => !leftPinnedColumns.includes(field));\n const rightPinnedColumns = filter(pinnedColumns.right, columnsWithoutLeftPinnedColumns);\n if (invert) {\n return [rightPinnedColumns, leftPinnedColumns];\n }\n return [leftPinnedColumns, rightPinnedColumns];\n};\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n leftPinnedColumns: ['pinnedColumns', 'pinnedColumns--left'],\n rightPinnedColumns: ['pinnedColumns', 'pinnedColumns--right', 'withBorderColor'],\n topPinnedRows: ['pinnedRows', 'pinnedRows--top'],\n bottomPinnedRows: ['pinnedRows', 'pinnedRows--bottom'],\n pinnedRowsRenderZone: ['pinnedRowsRenderZone'],\n detailPanels: ['detailPanels'],\n detailPanel: ['detailPanel']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n// Inspired by https://github.com/material-components/material-components-ios/blob/bca36107405594d5b7b16265a5b0ed698f85a5ee/components/Elevation/src/UIColor%2BMaterialElevation.m#L61\nconst getOverlayAlpha = elevation => {\n let alphaValue;\n if (elevation < 1) {\n alphaValue = 5.11916 * elevation ** 2;\n } else {\n alphaValue = 4.5 * Math.log(elevation + 1) + 2;\n }\n return alphaValue / 100;\n};\nconst getBoxShadowColor = theme => {\n return theme.vars ? `rgba(0 0 0 / 0.21)` : alpha(theme.palette.common.black, 0.21);\n};\nconst VirtualScrollerDetailPanels = styled('div', {\n name: 'MuiDataGrid',\n slot: 'DetailPanels',\n overridesResolver: (props, styles) => styles.detailPanels\n})({\n position: 'relative'\n});\nconst darkModeBackgroundImage = `linear-gradient(${alpha('#fff', getOverlayAlpha(2))}, ${alpha('#fff', getOverlayAlpha(2))})`;\nconst VirtualScrollerPinnedColumns = styled('div', {\n name: 'MuiDataGrid',\n slot: 'PinnedColumns',\n overridesResolver: (props, styles) => [{\n [`&.${gridClasses['pinnedColumns--left']}`]: styles['pinnedColumns--left']\n }, {\n [`&.${gridClasses['pinnedColumns--right']}`]: styles['pinnedColumns--right']\n }, styles.pinnedColumns]\n})(({\n theme,\n ownerState\n}) => {\n var _theme$vars$overlays;\n const boxShadowColor = getBoxShadowColor(theme);\n return _extends({\n position: 'sticky',\n overflow: 'hidden',\n zIndex: 1,\n backgroundColor: (theme.vars || theme).palette.background.default\n }, theme.vars ? {\n backgroundImage: (_theme$vars$overlays = theme.vars.overlays) == null ? void 0 : _theme$vars$overlays[2]\n } : _extends({}, theme.palette.mode === 'dark' && {\n backgroundImage: darkModeBackgroundImage\n }), ownerState.side === GridPinnedPosition.left && {\n left: 0,\n float: 'left',\n boxShadow: `2px 0px 4px -2px ${boxShadowColor}`\n }, ownerState.side === GridPinnedPosition.right && {\n right: 0,\n float: 'right',\n boxShadow: `-2px 0px 4px -2px ${boxShadowColor}`\n }, ownerState.side === GridPinnedPosition.right && ownerState.showCellVerticalBorder && {\n borderLeftWidth: '1px',\n borderLeftStyle: 'solid'\n });\n});\nvar PinnedRowsPosition = /*#__PURE__*/function (PinnedRowsPosition) {\n PinnedRowsPosition[\"top\"] = \"top\";\n PinnedRowsPosition[\"bottom\"] = \"bottom\";\n return PinnedRowsPosition;\n}(PinnedRowsPosition || {});\nconst VirtualScrollerPinnedRows = styled('div', {\n name: 'MuiDataGrid',\n slot: 'PinnedRows',\n overridesResolver: (props, styles) => [{\n [`&.${gridClasses['pinnedRows--top']}`]: styles['pinnedRows--top']\n }, {\n [`&.${gridClasses['pinnedRows--bottom']}`]: styles['pinnedRows--bottom']\n }, styles.pinnedRows]\n})(({\n theme,\n ownerState\n}) => {\n var _theme$vars$overlays2;\n const boxShadowColor = getBoxShadowColor(theme);\n return _extends({\n position: 'sticky',\n // should be above the no rows overlay\n zIndex: 4,\n backgroundColor: (theme.vars || theme).palette.background.default\n }, theme.vars ? {\n backgroundImage: (_theme$vars$overlays2 = theme.vars.overlays) == null ? void 0 : _theme$vars$overlays2[2]\n } : _extends({}, theme.palette.mode === 'dark' && {\n backgroundImage: darkModeBackgroundImage\n }), ownerState.position === 'top' && {\n top: 0,\n boxShadow: `0px 3px 4px -2px ${boxShadowColor}`\n }, ownerState.position === PinnedRowsPosition.bottom && {\n boxShadow: `0px -3px 4px -2px ${boxShadowColor}`,\n bottom: 0\n });\n});\nconst VirtualScrollerPinnedRowsRenderZone = styled('div')({\n position: 'absolute'\n});\nconst DataGridProVirtualScroller = /*#__PURE__*/React.forwardRef(function DataGridProVirtualScroller(props, ref) {\n const other = _objectWithoutPropertiesLoose(props, _excluded);\n const apiRef = useGridPrivateApiContext();\n const rootProps = useGridRootProps();\n const visibleColumnFields = useGridSelector(apiRef, gridVisibleColumnFieldsSelector);\n const expandedRowIds = useGridSelector(apiRef, gridDetailPanelExpandedRowIdsSelector);\n const detailPanelsContent = useGridSelector(apiRef, gridDetailPanelExpandedRowsContentCacheSelector);\n const detailPanelsHeights = useGridSelector(apiRef, gridDetailPanelExpandedRowsHeightCacheSelector);\n const leftColumns = React.useRef(null);\n const rightColumns = React.useRef(null);\n const topPinnedRowsRenderZoneRef = React.useRef(null);\n const bottomPinnedRowsRenderZoneRef = React.useRef(null);\n const theme = useTheme();\n const handleRenderZonePositioning = React.useCallback(({\n top,\n left\n }) => {\n if (leftColumns.current) {\n leftColumns.current.style.transform = `translate3d(0px, ${top}px, 0px)`;\n }\n if (rightColumns.current) {\n rightColumns.current.style.transform = `translate3d(0px, ${top}px, 0px)`;\n }\n if (topPinnedRowsRenderZoneRef.current) {\n topPinnedRowsRenderZoneRef.current.style.transform = `translate3d(${left}px, 0px, 0px)`;\n }\n if (bottomPinnedRowsRenderZoneRef.current) {\n bottomPinnedRowsRenderZoneRef.current.style.transform = `translate3d(${left}px, 0px, 0px)`;\n }\n }, []);\n\n // Create a lookup for faster check if the row is expanded\n const expandedRowIdsLookup = React.useMemo(() => {\n const lookup = new Set();\n expandedRowIds.forEach(id => {\n lookup.add(id);\n });\n return lookup;\n }, [expandedRowIds]);\n const getRowProps = React.useCallback(id => {\n if (!expandedRowIdsLookup.has(id)) {\n return null;\n }\n const height = detailPanelsHeights[id];\n return {\n style: {\n marginBottom: height\n }\n };\n }, [detailPanelsHeights, expandedRowIdsLookup]);\n const pinnedColumns = useGridSelector(apiRef, gridPinnedColumnsSelector);\n const [leftPinnedColumns, rightPinnedColumns] = filterColumns(pinnedColumns, visibleColumnFields, theme.direction === 'rtl');\n const pinnedRows = useGridSelector(apiRef, gridPinnedRowsSelector);\n const topPinnedRowsData = React.useMemo(() => (pinnedRows == null ? void 0 : pinnedRows.top) || [], [pinnedRows == null ? void 0 : pinnedRows.top]);\n const bottomPinnedRowsData = React.useMemo(() => (pinnedRows == null ? void 0 : pinnedRows.bottom) || [], [pinnedRows == null ? void 0 : pinnedRows.bottom]);\n const ownerState = _extends({}, rootProps, {\n classes: rootProps.classes\n });\n const classes = useUtilityClasses(ownerState);\n const {\n renderContext,\n getRows,\n getRootProps,\n getContentProps,\n getRenderZoneProps,\n updateRenderZonePosition\n } = useGridVirtualScroller(_extends({\n ref,\n renderZoneMinColumnIndex: leftPinnedColumns.length,\n renderZoneMaxColumnIndex: visibleColumnFields.length - rightPinnedColumns.length,\n onRenderZonePositioning: handleRenderZonePositioning,\n getRowProps\n }, props));\n const refreshRenderZonePosition = React.useCallback(() => {\n if (renderContext) {\n updateRenderZonePosition(renderContext);\n }\n }, [renderContext, updateRenderZonePosition]);\n useGridApiEventHandler(apiRef, 'columnWidthChange', refreshRenderZonePosition);\n useGridApiEventHandler(apiRef, 'columnOrderChange', refreshRenderZonePosition);\n useGridApiEventHandler(apiRef, 'rowOrderChange', refreshRenderZonePosition);\n const leftRenderContext = renderContext && leftPinnedColumns.length > 0 ? _extends({}, renderContext, {\n firstColumnIndex: 0,\n lastColumnIndex: leftPinnedColumns.length\n }) : null;\n const rightRenderContext = renderContext && rightPinnedColumns.length > 0 ? _extends({}, renderContext, {\n firstColumnIndex: visibleColumnFields.length - rightPinnedColumns.length,\n lastColumnIndex: visibleColumnFields.length\n }) : null;\n const getDetailPanel = rowId => {\n const rowsMeta = gridRowsMetaSelector(apiRef.current.state);\n const content = detailPanelsContent[rowId];\n\n // Check if the id exists in the current page\n const rowIndex = apiRef.current.getRowIndexRelativeToVisibleRows(rowId);\n const exists = rowIndex !== undefined;\n if ( /*#__PURE__*/React.isValidElement(content) && exists) {\n const hasAutoHeight = apiRef.current.detailPanelHasAutoHeight(rowId);\n const height = hasAutoHeight ? 'auto' : detailPanelsHeights[rowId];\n const sizes = apiRef.current.unstable_getRowInternalSizes(rowId);\n const spacingTop = (sizes == null ? void 0 : sizes.spacingTop) || 0;\n const top = rowsMeta.positions[rowIndex] + apiRef.current.unstable_getRowHeight(rowId) + spacingTop;\n return /*#__PURE__*/_jsx(GridDetailPanel, {\n rowId: rowId,\n style: {\n top\n },\n height: height,\n className: classes.detailPanel,\n children: content\n }, rowId);\n }\n return null;\n };\n const detailPanels = [];\n const topPinnedRows = getRows({\n renderContext,\n rows: topPinnedRowsData,\n position: 'center'\n });\n const pinnedRowsHeight = calculatePinnedRowsHeight(apiRef);\n const mainRows = getRows({\n renderContext,\n rowIndexOffset: topPinnedRowsData.length,\n position: 'center',\n onRowRender: rowId => {\n if (rootProps.getDetailPanelContent == null) {\n return;\n }\n if (!expandedRowIdsLookup.has(rowId)) {\n return;\n }\n const detailPanel = getDetailPanel(rowId);\n if (detailPanel) {\n detailPanels.push(detailPanel);\n }\n }\n });\n const bottomPinnedRows = getRows({\n renderContext,\n rows: bottomPinnedRowsData,\n rowIndexOffset: topPinnedRowsData.length + (mainRows ? mainRows.length : 0),\n position: 'center'\n });\n const contentProps = getContentProps();\n const pinnedColumnsStyle = {\n minHeight: contentProps.style.minHeight\n };\n if (contentProps.style.minHeight && contentProps.style.minHeight === '100%') {\n contentProps.style.minHeight = `calc(100% - ${pinnedRowsHeight.top}px - ${pinnedRowsHeight.bottom}px)`;\n }\n return /*#__PURE__*/_jsxs(GridVirtualScroller, _extends({}, getRootProps(other), {\n children: [/*#__PURE__*/_jsx(GridOverlays, {}), topPinnedRowsData.length > 0 ? /*#__PURE__*/_jsxs(VirtualScrollerPinnedRows, {\n className: classes.topPinnedRows,\n ownerState: _extends({}, ownerState, {\n position: PinnedRowsPosition.top\n }),\n style: {\n width: contentProps.style.width,\n height: pinnedRowsHeight.top\n },\n role: \"rowgroup\",\n children: [leftRenderContext && /*#__PURE__*/_jsx(VirtualScrollerPinnedColumns, {\n className: classes.leftPinnedColumns,\n ownerState: _extends({}, ownerState, {\n side: GridPinnedPosition.left,\n showCellVerticalBorder: rootProps.showCellVerticalBorder\n }),\n children: getRows({\n renderContext: leftRenderContext,\n minFirstColumn: leftRenderContext.firstColumnIndex,\n maxLastColumn: leftRenderContext.lastColumnIndex,\n availableSpace: 0,\n rows: topPinnedRowsData,\n position: 'left'\n })\n }), /*#__PURE__*/_jsx(VirtualScrollerPinnedRowsRenderZone, {\n className: classes.pinnedRowsRenderZone,\n ref: topPinnedRowsRenderZoneRef,\n role: \"presentation\",\n children: topPinnedRows\n }), rightRenderContext && /*#__PURE__*/_jsx(VirtualScrollerPinnedColumns, {\n className: classes.rightPinnedColumns,\n ownerState: _extends({}, ownerState, {\n side: GridPinnedPosition.right,\n showCellVerticalBorder: rootProps.showCellVerticalBorder\n }),\n children: getRows({\n renderContext: rightRenderContext,\n minFirstColumn: rightRenderContext.firstColumnIndex,\n maxLastColumn: rightRenderContext.lastColumnIndex,\n availableSpace: 0,\n rows: topPinnedRowsData,\n position: 'right'\n })\n })]\n }) : null, /*#__PURE__*/_jsxs(GridVirtualScrollerContent, _extends({}, contentProps, {\n children: [leftRenderContext && /*#__PURE__*/_jsx(VirtualScrollerPinnedColumns, {\n ref: leftColumns,\n className: classes.leftPinnedColumns,\n ownerState: _extends({}, ownerState, {\n side: GridPinnedPosition.left,\n showCellVerticalBorder: rootProps.showCellVerticalBorder\n }),\n style: pinnedColumnsStyle,\n children: getRows({\n renderContext: leftRenderContext,\n minFirstColumn: leftRenderContext.firstColumnIndex,\n maxLastColumn: leftRenderContext.lastColumnIndex,\n availableSpace: 0,\n rowIndexOffset: topPinnedRowsData.length,\n position: 'left'\n })\n }), /*#__PURE__*/_jsx(GridVirtualScrollerRenderZone, _extends({}, getRenderZoneProps(), {\n children: mainRows\n })), rightRenderContext && /*#__PURE__*/_jsx(VirtualScrollerPinnedColumns, {\n ref: rightColumns,\n ownerState: _extends({}, ownerState, {\n side: GridPinnedPosition.right,\n showCellVerticalBorder: rootProps.showCellVerticalBorder\n }),\n className: classes.rightPinnedColumns,\n style: pinnedColumnsStyle,\n children: getRows({\n renderContext: rightRenderContext,\n minFirstColumn: rightRenderContext.firstColumnIndex,\n maxLastColumn: rightRenderContext.lastColumnIndex,\n availableSpace: 0,\n rowIndexOffset: topPinnedRowsData.length,\n position: 'right'\n })\n }), detailPanels.length > 0 && /*#__PURE__*/_jsx(VirtualScrollerDetailPanels, {\n className: classes.detailPanels,\n ownerState: ownerState,\n children: detailPanels\n })]\n })), bottomPinnedRowsData.length > 0 ? /*#__PURE__*/_jsxs(VirtualScrollerPinnedRows, {\n className: classes.bottomPinnedRows,\n ownerState: _extends({}, ownerState, {\n position: PinnedRowsPosition.bottom\n }),\n style: {\n width: contentProps.style.width,\n height: pinnedRowsHeight.bottom\n },\n role: \"rowgroup\",\n children: [leftRenderContext && /*#__PURE__*/_jsx(VirtualScrollerPinnedColumns, {\n className: classes.leftPinnedColumns,\n ownerState: _extends({}, ownerState, {\n side: GridPinnedPosition.left,\n showCellVerticalBorder: rootProps.showCellVerticalBorder\n }),\n children: getRows({\n renderContext: leftRenderContext,\n minFirstColumn: leftRenderContext.firstColumnIndex,\n maxLastColumn: leftRenderContext.lastColumnIndex,\n availableSpace: 0,\n rows: bottomPinnedRowsData,\n rowIndexOffset: topPinnedRowsData.length + (mainRows ? mainRows.length : 0),\n position: 'left'\n })\n }), /*#__PURE__*/_jsx(VirtualScrollerPinnedRowsRenderZone, {\n className: classes.pinnedRowsRenderZone,\n ref: bottomPinnedRowsRenderZoneRef,\n role: \"presentation\",\n children: bottomPinnedRows\n }), rightRenderContext && /*#__PURE__*/_jsx(VirtualScrollerPinnedColumns, {\n className: classes.rightPinnedColumns,\n ownerState: _extends({}, ownerState, {\n side: GridPinnedPosition.right,\n showCellVerticalBorder: rootProps.showCellVerticalBorder\n }),\n children: getRows({\n renderContext: rightRenderContext,\n minFirstColumn: rightRenderContext.firstColumnIndex,\n maxLastColumn: rightRenderContext.lastColumnIndex,\n availableSpace: 0,\n rows: bottomPinnedRowsData,\n rowIndexOffset: topPinnedRowsData.length + (mainRows ? mainRows.length : 0),\n position: 'right'\n })\n })]\n }) : null]\n }));\n});\nexport { DataGridProVirtualScroller };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { gridRowMaximumTreeDepthSelector, gridSortModelSelector, useGridApiContext, useGridSelector, getDataGridUtilityClass } from '@mui/x-data-grid';\nimport { gridEditRowsStateSelector } from '@mui/x-data-grid/internals';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n isDraggable,\n classes\n } = ownerState;\n const slots = {\n root: ['rowReorderCell', isDraggable && 'rowReorderCell--draggable'],\n placeholder: ['rowReorderCellPlaceholder']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nfunction GridRowReorderCell(params) {\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const sortModel = useGridSelector(apiRef, gridSortModelSelector);\n const treeDepth = useGridSelector(apiRef, gridRowMaximumTreeDepthSelector);\n const editRowsState = useGridSelector(apiRef, gridEditRowsStateSelector);\n // eslint-disable-next-line no-underscore-dangle\n const cellValue = params.row.__reorder__ || params.id;\n\n // TODO: remove sortModel and treeDepth checks once row reorder is compatible\n const isDraggable = React.useMemo(() => !!rootProps.rowReordering && !sortModel.length && treeDepth === 1 && Object.keys(editRowsState).length === 0, [rootProps.rowReordering, sortModel, treeDepth, editRowsState]);\n const ownerState = {\n isDraggable,\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n const publish = React.useCallback((eventName, propHandler) => event => {\n // Ignore portal\n // The target is not an element when triggered by a Select inside the cell\n // See https://github.com/mui/material-ui/issues/10534\n if (event.target.nodeType === 1 && !event.currentTarget.contains(event.target)) {\n return;\n }\n\n // The row might have been deleted\n if (!apiRef.current.getRow(params.id)) {\n return;\n }\n apiRef.current.publishEvent(eventName, apiRef.current.getRowParams(params.id), event);\n if (propHandler) {\n propHandler(event);\n }\n }, [apiRef, params.id]);\n const draggableEventHandlers = isDraggable ? {\n onDragStart: publish('rowDragStart'),\n onDragOver: publish('rowDragOver'),\n onDragEnd: publish('rowDragEnd')\n } : null;\n if (params.rowNode.type === 'footer') {\n return null;\n }\n return /*#__PURE__*/_jsxs(\"div\", _extends({\n className: classes.root,\n draggable: isDraggable\n }, draggableEventHandlers, {\n children: [/*#__PURE__*/_jsx(rootProps.slots.rowReorderIcon, {}), /*#__PURE__*/_jsx(\"div\", {\n className: classes.placeholder,\n children: cellValue\n })]\n }));\n}\nexport { GridRowReorderCell };\nexport const renderRowReorderCell = params => {\n if (params.rowNode.type === 'footer' || params.rowNode.type === 'pinnedRow') {\n return null;\n }\n return /*#__PURE__*/_jsx(GridRowReorderCell, _extends({}, params));\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { GRID_STRING_COL_DEF } from '@mui/x-data-grid';\nimport { renderRowReorderCell } from '../../../components/GridRowReorderCell';\nexport const GRID_REORDER_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {\n field: '__reorder__',\n type: 'reorder',\n sortable: false,\n filterable: false,\n width: 50,\n align: 'center',\n headerAlign: 'center',\n disableColumnMenu: true,\n disableExport: true,\n disableReorder: true,\n resizable: false,\n // @ts-ignore\n aggregable: false,\n renderHeader: () => ' ',\n renderCell: renderRowReorderCell\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { getDataGridUtilityClass } from '@mui/x-data-grid';\nimport { useGridRegisterPipeProcessor } from '@mui/x-data-grid/internals';\nimport { GRID_REORDER_COL_DEF } from './gridRowReorderColDef';\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n return React.useMemo(() => {\n const slots = {\n rowReorderCellContainer: ['rowReorderCellContainer'],\n columnHeaderReorder: ['columnHeaderReorder']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n }, [classes]);\n};\nexport const useGridRowReorderPreProcessors = (privateApiRef, props) => {\n const ownerState = {\n classes: props.classes\n };\n const classes = useUtilityClasses(ownerState);\n const updateReorderColumn = React.useCallback(columnsState => {\n const reorderColumn = _extends({}, GRID_REORDER_COL_DEF, {\n cellClassName: classes.rowReorderCellContainer,\n headerClassName: classes.columnHeaderReorder,\n headerName: privateApiRef.current.getLocaleText('rowReorderingHeaderName')\n });\n const shouldHaveReorderColumn = props.rowReordering;\n const haveReorderColumn = columnsState.lookup[reorderColumn.field] != null;\n if (shouldHaveReorderColumn && haveReorderColumn) {\n return columnsState;\n }\n if (shouldHaveReorderColumn && !haveReorderColumn) {\n columnsState.lookup[reorderColumn.field] = reorderColumn;\n columnsState.orderedFields = [reorderColumn.field, ...columnsState.orderedFields];\n } else if (!shouldHaveReorderColumn && haveReorderColumn) {\n delete columnsState.lookup[reorderColumn.field];\n columnsState.orderedFields = columnsState.orderedFields.filter(field => field !== reorderColumn.field);\n }\n return columnsState;\n }, [privateApiRef, classes, props.rowReordering]);\n useGridRegisterPipeProcessor(privateApiRef, 'hydrateColumns', updateReorderColumn);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { GRID_STRING_COL_DEF } from '@mui/x-data-grid';\n\n/**\n * TODO: Add sorting and filtering on the value and the filteredDescendantCount\n */\nexport const GRID_TREE_DATA_GROUPING_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {\n type: 'treeDataGroup',\n sortable: false,\n filterable: false,\n disableColumnMenu: true,\n disableReorder: true,\n align: 'left',\n width: 200,\n valueGetter: params => params.rowNode.type === 'group' || params.rowNode.type === 'leaf' ? params.rowNode.groupingKey : undefined\n});\nexport const GRID_TREE_DATA_GROUPING_FIELD = '__tree_data_group__';\nexport const GRID_TREE_DATA_GROUPING_COL_DEF_FORCED_PROPERTIES = {\n field: GRID_TREE_DATA_GROUPING_FIELD,\n editable: false,\n groupable: false\n};","import { passFilterLogic } from '@mui/x-data-grid/internals';\nexport const TREE_DATA_STRATEGY = 'tree-data';\n\n/**\n * A node is visible if one of the following criteria is met:\n * - One of its children is passing the filter\n * - It is passing the filter\n */\nexport const filterRowTreeFromTreeData = params => {\n const {\n apiRef,\n rowTree,\n disableChildrenFiltering,\n isRowMatchingFilters\n } = params;\n const filteredRowsLookup = {};\n const filteredDescendantCountLookup = {};\n const filterCache = {};\n const filterResults = {\n passingFilterItems: null,\n passingQuickFilterValues: null\n };\n const filterTreeNode = (node, isParentMatchingFilters, areAncestorsExpanded) => {\n const shouldSkipFilters = disableChildrenFiltering && node.depth > 0;\n let isMatchingFilters;\n if (shouldSkipFilters) {\n isMatchingFilters = null;\n } else if (!isRowMatchingFilters || node.type === 'footer') {\n isMatchingFilters = true;\n } else {\n const row = apiRef.current.getRow(node.id);\n isRowMatchingFilters(row, undefined, filterResults);\n isMatchingFilters = passFilterLogic([filterResults.passingFilterItems], [filterResults.passingQuickFilterValues], params.filterModel, params.apiRef, filterCache);\n }\n let filteredDescendantCount = 0;\n if (node.type === 'group') {\n node.children.forEach(childId => {\n var _isMatchingFilters;\n const childNode = rowTree[childId];\n const childSubTreeSize = filterTreeNode(childNode, (_isMatchingFilters = isMatchingFilters) != null ? _isMatchingFilters : isParentMatchingFilters, areAncestorsExpanded && !!node.childrenExpanded);\n filteredDescendantCount += childSubTreeSize;\n });\n }\n let shouldPassFilters;\n switch (isMatchingFilters) {\n case true:\n {\n shouldPassFilters = true;\n break;\n }\n case false:\n {\n shouldPassFilters = filteredDescendantCount > 0;\n break;\n }\n default:\n {\n shouldPassFilters = isParentMatchingFilters;\n break;\n }\n }\n filteredRowsLookup[node.id] = shouldPassFilters;\n if (!shouldPassFilters) {\n return 0;\n }\n filteredDescendantCountLookup[node.id] = filteredDescendantCount;\n if (node.type === 'footer') {\n return filteredDescendantCount;\n }\n return filteredDescendantCount + 1;\n };\n const nodes = Object.values(rowTree);\n for (let i = 0; i < nodes.length; i += 1) {\n const node = nodes[i];\n if (node.depth === 0) {\n filterTreeNode(node, true, true);\n }\n }\n return {\n filteredRowsLookup,\n filteredDescendantCountLookup\n };\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport Box from '@mui/material/Box';\nimport { useGridSelector, gridFilteredDescendantCountLookupSelector, getDataGridUtilityClass } from '@mui/x-data-grid';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['treeDataGroupingCell'],\n toggle: ['treeDataGroupingCellToggle']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nfunction GridTreeDataGroupingCell(props) {\n var _filteredDescendantCo, _rootProps$slotProps;\n const {\n id,\n field,\n formattedValue,\n rowNode,\n hideDescendantCount,\n offsetMultiplier = 2\n } = props;\n const rootProps = useGridRootProps();\n const apiRef = useGridApiContext();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n const filteredDescendantCountLookup = useGridSelector(apiRef, gridFilteredDescendantCountLookupSelector);\n const filteredDescendantCount = (_filteredDescendantCo = filteredDescendantCountLookup[rowNode.id]) != null ? _filteredDescendantCo : 0;\n const Icon = rowNode.childrenExpanded ? rootProps.slots.treeDataCollapseIcon : rootProps.slots.treeDataExpandIcon;\n const handleClick = event => {\n apiRef.current.setRowChildrenExpansion(id, !rowNode.childrenExpanded);\n apiRef.current.setCellFocus(id, field);\n event.stopPropagation(); // TODO remove event.stopPropagation\n };\n\n return /*#__PURE__*/_jsxs(Box, {\n className: classes.root,\n sx: {\n ml: rowNode.depth * offsetMultiplier\n },\n children: [/*#__PURE__*/_jsx(\"div\", {\n className: classes.toggle,\n children: filteredDescendantCount > 0 && /*#__PURE__*/_jsx(rootProps.slots.baseIconButton, _extends({\n size: \"small\",\n onClick: handleClick,\n tabIndex: -1,\n \"aria-label\": rowNode.childrenExpanded ? apiRef.current.getLocaleText('treeDataCollapse') : apiRef.current.getLocaleText('treeDataExpand')\n }, rootProps == null || (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseIconButton, {\n children: /*#__PURE__*/_jsx(Icon, {\n fontSize: \"inherit\"\n })\n }))\n }), /*#__PURE__*/_jsxs(\"span\", {\n children: [formattedValue === undefined ? rowNode.groupingKey : formattedValue, !hideDescendantCount && filteredDescendantCount > 0 ? ` (${filteredDescendantCount})` : '']\n })]\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? GridTreeDataGroupingCell.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n /**\n * GridApi that let you manipulate the grid.\n */\n api: PropTypes.object.isRequired,\n /**\n * The mode of the cell.\n */\n cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,\n /**\n * The column of the row that the current cell belongs to.\n */\n colDef: PropTypes.object.isRequired,\n /**\n * The column field of the cell that triggered the event.\n */\n field: PropTypes.string.isRequired,\n /**\n * A ref allowing to set imperative focus.\n * It can be passed to the element that should receive focus.\n * @ignore - do not document.\n */\n focusElementRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({\n current: PropTypes.shape({\n focus: PropTypes.func.isRequired\n })\n })]),\n /**\n * The cell value formatted with the column valueFormatter.\n */\n formattedValue: PropTypes.any,\n /**\n * If true, the cell is the active element.\n */\n hasFocus: PropTypes.bool.isRequired,\n hideDescendantCount: PropTypes.bool,\n /**\n * The grid row id.\n */\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n /**\n * If true, the cell is editable.\n */\n isEditable: PropTypes.bool,\n /**\n * The cell offset multiplier used for calculating cell offset (`rowNode.depth * offsetMultiplier` px).\n * @default 2\n */\n offsetMultiplier: PropTypes.number,\n /**\n * The row model of the row that the current cell belongs to.\n */\n row: PropTypes.any.isRequired,\n /**\n * The node of the row that the current cell belongs to.\n */\n rowNode: PropTypes.object.isRequired,\n /**\n * the tabIndex value.\n */\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\n /**\n * The cell value.\n * If the column has `valueGetter`, use `params.row` to directly access the fields.\n */\n value: PropTypes.any\n} : void 0;\nexport { GridTreeDataGroupingCell };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { GRID_ROOT_GROUP_ID } from '@mui/x-data-grid';\nexport const getGroupRowIdFromPath = path => {\n const pathStr = path.map(groupingCriteria => `${groupingCriteria.field}/${groupingCriteria.key}`).join('-');\n return `auto-generated-row-${pathStr}`;\n};\nexport const getNodePathInTree = ({\n id,\n tree\n}) => {\n const path = [];\n let node = tree[id];\n while (node.id !== GRID_ROOT_GROUP_ID) {\n path.push({\n field: node.type === 'leaf' ? null : node.groupingField,\n key: node.groupingKey\n });\n node = tree[node.parent];\n }\n path.reverse();\n return path;\n};\nexport const updateGroupDefaultExpansion = (node, defaultGroupingExpansionDepth, isGroupExpandedByDefault) => {\n let childrenExpanded;\n if (node.id === GRID_ROOT_GROUP_ID) {\n childrenExpanded = true;\n } else if (isGroupExpandedByDefault) {\n childrenExpanded = isGroupExpandedByDefault(node);\n } else {\n childrenExpanded = defaultGroupingExpansionDepth === -1 || defaultGroupingExpansionDepth > node.depth;\n }\n node.childrenExpanded = childrenExpanded;\n return node;\n};\n\n/**\n * Insert a node in the tree\n */\nexport const insertNodeInTree = (node, tree, treeDepths, previousTree) => {\n var _treeDepths$node$dept;\n // 1. Insert node in the tree.\n tree[node.id] = node;\n\n // 2. Increment the `treeDepths` object for the node's depth.\n treeDepths[node.depth] = ((_treeDepths$node$dept = treeDepths[node.depth]) != null ? _treeDepths$node$dept : 0) + 1;\n\n // 3. Register the new node in its parent.\n const parentNode = tree[node.parent];\n if (node.type === 'group' || node.type === 'leaf') {\n var _groupingField, _groupingKey, _parentNode$childrenF;\n // For groups and leaves,\n // Register the node from its parents `children` and `childrenFromPath` properties.\n const groupingFieldName = (_groupingField = node.groupingField) != null ? _groupingField : '__no_field__';\n const groupingKeyName = (_groupingKey = node.groupingKey) != null ? _groupingKey : '__no_key__';\n const groupingField = (_parentNode$childrenF = parentNode.childrenFromPath) == null ? void 0 : _parentNode$childrenF[groupingFieldName];\n if (previousTree !== null && previousTree[parentNode.id] === tree[parentNode.id]) {\n parentNode.children = [...parentNode.children, node.id];\n } else {\n parentNode.children.push(node.id);\n }\n if (groupingField == null) {\n parentNode.childrenFromPath[groupingFieldName] = {\n [groupingKeyName.toString()]: node.id\n };\n } else {\n groupingField[groupingKeyName.toString()] = node.id;\n }\n } else if (node.type === 'footer') {\n // For footers,\n // Register the node from its parent `footerId` property.\n parentNode.footerId = node.id;\n }\n};\n\n/**\n * Removes a node from the tree\n */\nexport const removeNodeFromTree = ({\n node,\n tree,\n treeDepths\n}) => {\n // 1. Remove node from the tree.\n delete tree[node.id];\n\n // 2. Decrement the `treeDepths` object for the node's depth.\n const nodeDepth = node.depth;\n const currentNodeCount = treeDepths[nodeDepth];\n if (currentNodeCount === 1) {\n delete treeDepths[nodeDepth];\n } else {\n treeDepths[nodeDepth] = currentNodeCount - 1;\n }\n\n // 3. Unregister the new node in its parent.\n const parentNode = tree[node.parent];\n // For footers,\n // Unregister the node from its parent `footerId` property.\n if (node.type === 'footer') {\n tree[parentNode.id] = _extends({}, parentNode, {\n footerId: null\n });\n }\n // For groups and leaves,\n // Unregister the node from its parents `children` and `childrenFromPath` properties.\n else {\n var _groupingField2, _groupingKey2;\n const groupingField = (_groupingField2 = node.groupingField) != null ? _groupingField2 : '__no_field__';\n const groupingKey = (_groupingKey2 = node.groupingKey) != null ? _groupingKey2 : '__no_key__';\n\n // TODO rows v6: Can we avoid this linear complexity ?\n const children = parentNode.children.filter(childId => childId !== node.id);\n const childrenFromPath = parentNode.childrenFromPath;\n delete childrenFromPath[groupingField][groupingKey.toString()];\n tree[parentNode.id] = _extends({}, parentNode, {\n children,\n childrenFromPath\n });\n }\n};\n\n/**\n * Updates the `id` and `isAutoGenerated` properties of a group node.\n */\nexport const updateGroupNodeIdAndAutoGenerated = ({\n node,\n updatedNode,\n previousTree,\n tree,\n treeDepths\n}) => {\n // 1. Set the new parent for all children from the old group\n node.children.forEach(childId => {\n tree[childId] = _extends({}, tree[childId], {\n parent: updatedNode.id\n });\n });\n\n // 2. Remove the old group from the tree\n removeNodeFromTree({\n node,\n tree,\n treeDepths\n });\n\n // 3. Add the new group in the tree\n const groupNode = _extends({}, node, updatedNode);\n insertNodeInTree(groupNode, tree, treeDepths, previousTree);\n};\nexport const createUpdatedGroupsManager = () => ({\n value: {},\n addAction(groupId, action) {\n if (!this.value[groupId]) {\n this.value[groupId] = {};\n }\n this.value[groupId][action] = true;\n }\n});\nexport const getVisibleRowsLookup = ({\n tree,\n filteredRowsLookup\n}) => {\n if (!filteredRowsLookup) {\n return {};\n }\n const visibleRowsLookup = {};\n const handleTreeNode = (node, areAncestorsExpanded) => {\n const isPassingFiltering = filteredRowsLookup[node.id];\n if (node.type === 'group') {\n node.children.forEach(childId => {\n const childNode = tree[childId];\n handleTreeNode(childNode, areAncestorsExpanded && !!node.childrenExpanded);\n });\n }\n visibleRowsLookup[node.id] = isPassingFiltering && areAncestorsExpanded;\n\n // TODO rows v6: Should we keep storing the visibility status of footer independently or rely on the group visibility in the selector ?\n if (node.type === 'group' && node.footerId != null) {\n visibleRowsLookup[node.footerId] = isPassingFiltering && areAncestorsExpanded && !!node.childrenExpanded;\n }\n };\n const nodes = Object.values(tree);\n for (let i = 0; i < nodes.length; i += 1) {\n const node = nodes[i];\n if (node.depth === 0) {\n handleTreeNode(node, true);\n }\n }\n return visibleRowsLookup;\n};","import { GRID_ROOT_GROUP_ID } from '@mui/x-data-grid';\nimport { updateGroupDefaultExpansion, getGroupRowIdFromPath, insertNodeInTree, updateGroupNodeIdAndAutoGenerated } from './utils';\n/**\n * Inserts a data row in a tree.\n * For each steps of its path:\n * - if a node exists with the same partial path, it will register this node as the ancestor of the data row.\n * - if not, it will create an auto-generated node and register it as ancestor of the data row.\n */\nexport const insertDataRowInTree = ({\n id,\n path,\n updatedGroupsManager,\n previousTree,\n tree,\n treeDepths,\n onDuplicatePath,\n isGroupExpandedByDefault,\n defaultGroupingExpansionDepth\n}) => {\n let parentNodeId = GRID_ROOT_GROUP_ID;\n for (let depth = 0; depth < path.length; depth += 1) {\n var _childrenFromPath;\n const {\n key,\n field\n } = path[depth];\n const fieldWithDefaultValue = field != null ? field : '__no_field__';\n const keyWithDefaultValue = key != null ? key : '__no_key__';\n const existingNodeIdWithPartialPath = (_childrenFromPath = tree[parentNodeId].childrenFromPath) == null || (_childrenFromPath = _childrenFromPath[fieldWithDefaultValue]) == null ? void 0 : _childrenFromPath[keyWithDefaultValue.toString()];\n\n // When we reach the last step of the path,\n // We need to create a node for the row passed to `insertNodeInTree`\n if (depth === path.length - 1) {\n // If no node matches the full path,\n // We create a leaf node for the data row.\n if (existingNodeIdWithPartialPath == null) {\n const leafNode = {\n type: 'leaf',\n id,\n depth,\n parent: parentNodeId,\n groupingKey: key\n };\n updatedGroupsManager == null || updatedGroupsManager.addAction(parentNodeId, 'insertChildren');\n insertNodeInTree(leafNode, tree, treeDepths, previousTree);\n } else {\n const existingNodeWithPartialPath = tree[existingNodeIdWithPartialPath];\n\n // If we already have an auto-generated group matching the partial path,\n // We replace it with the node from of data row passed to `insertNodeInTree`\n if (existingNodeWithPartialPath.type === 'group' && existingNodeWithPartialPath.isAutoGenerated) {\n updatedGroupsManager == null || updatedGroupsManager.addAction(parentNodeId, 'removeChildren');\n updatedGroupsManager == null || updatedGroupsManager.addAction(parentNodeId, 'insertChildren');\n updateGroupNodeIdAndAutoGenerated({\n tree,\n previousTree,\n treeDepths,\n node: existingNodeWithPartialPath,\n updatedNode: {\n id,\n isAutoGenerated: false\n }\n });\n } else {\n // If we have another row matching the partial path, then there is a duplicate in the dataset.\n // We warn the user and skip the current row.\n onDuplicatePath == null || onDuplicatePath(existingNodeIdWithPartialPath, id, path);\n }\n }\n }\n // For the intermediary steps of the path,\n // We need to make sure that there is a node matching the partial path.\n //\n // If no node matches the partial path,\n // We create an auto-generated group node.\n else if (existingNodeIdWithPartialPath == null) {\n const nodeId = getGroupRowIdFromPath(path.slice(0, depth + 1));\n const autoGeneratedGroupNode = {\n type: 'group',\n id: nodeId,\n parent: parentNodeId,\n depth,\n isAutoGenerated: true,\n groupingKey: key,\n groupingField: field,\n children: [],\n childrenFromPath: {},\n childrenExpanded: false\n };\n updatedGroupsManager == null || updatedGroupsManager.addAction(parentNodeId, 'insertChildren');\n insertNodeInTree(updateGroupDefaultExpansion(autoGeneratedGroupNode, defaultGroupingExpansionDepth, isGroupExpandedByDefault), tree, treeDepths, previousTree);\n parentNodeId = nodeId;\n }\n // For the intermediary steps of the path\n // If a node matches the partial path, we use it as parent for the next step\n else {\n const currentGroupNode = tree[existingNodeIdWithPartialPath];\n\n // If the node matching the partial path is not a group, we turn it into a group\n if (currentGroupNode.type !== 'group') {\n const groupNode = {\n type: 'group',\n id: currentGroupNode.id,\n parent: currentGroupNode.parent,\n depth: currentGroupNode.depth,\n isAutoGenerated: false,\n groupingKey: key,\n groupingField: field,\n children: [],\n childrenFromPath: {},\n childrenExpanded: false\n };\n tree[existingNodeIdWithPartialPath] = updateGroupDefaultExpansion(groupNode, defaultGroupingExpansionDepth, isGroupExpandedByDefault);\n }\n parentNodeId = currentGroupNode.id;\n }\n }\n};","import { GRID_ROOT_GROUP_ID } from '@mui/x-data-grid';\nimport { buildRootGroup } from '@mui/x-data-grid/internals';\nimport { insertDataRowInTree } from './insertDataRowInTree';\n/**\n * Transform a list of rows into a tree structure where each row references its parent and children.\n */\nexport const createRowTree = params => {\n const dataRowIds = [];\n const tree = {\n [GRID_ROOT_GROUP_ID]: buildRootGroup()\n };\n const treeDepths = {};\n for (let i = 0; i < params.nodes.length; i += 1) {\n const node = params.nodes[i];\n dataRowIds.push(node.id);\n insertDataRowInTree({\n tree,\n previousTree: params.previousTree,\n id: node.id,\n path: node.path,\n onDuplicatePath: params.onDuplicatePath,\n treeDepths,\n isGroupExpandedByDefault: params.isGroupExpandedByDefault,\n defaultGroupingExpansionDepth: params.defaultGroupingExpansionDepth\n });\n }\n return {\n tree,\n treeDepths,\n groupingName: params.groupingName,\n dataRowIds\n };\n};","import { GRID_ROOT_GROUP_ID } from '@mui/x-data-grid';\n// Single-linked list node\nclass Node {\n constructor(data, next) {\n this.next = void 0;\n this.data = void 0;\n this.next = next;\n this.data = data;\n }\n insertAfter(list) {\n if (!list.first || !list.last) {\n return;\n }\n const next = this.next;\n this.next = list.first;\n list.last.next = next;\n }\n}\n\n// Single-linked list container\nclass List {\n constructor(first, last) {\n this.first = void 0;\n this.last = void 0;\n this.first = first;\n this.last = last;\n }\n data() {\n const array = [];\n this.forEach(node => {\n array.push(node.data);\n });\n return array;\n }\n forEach(fn) {\n let current = this.first;\n while (current !== null) {\n fn(current);\n current = current.next;\n }\n }\n static from(array) {\n if (array.length === 0) {\n return new List(null, null);\n }\n let index = 0;\n const first = new Node(array[index], null);\n let current = first;\n while (index + 1 < array.length) {\n index += 1;\n const node = new Node(array[index], null);\n current.next = node;\n current = node;\n }\n return new List(first, current);\n }\n}\nexport const sortRowTree = params => {\n const {\n rowTree,\n disableChildrenSorting,\n sortRowList,\n shouldRenderGroupBelowLeaves\n } = params;\n const sortedGroupedByParentRows = new Map();\n const sortGroup = node => {\n const shouldSortGroup = !!sortRowList && (!disableChildrenSorting || node.depth === -1);\n let sortedRowIds;\n if (shouldSortGroup) {\n for (let i = 0; i < node.children.length; i += 1) {\n const childNode = rowTree[node.children[i]];\n if (childNode.type === 'group') {\n sortGroup(childNode);\n }\n }\n sortedRowIds = sortRowList(node.children.map(childId => rowTree[childId]));\n } else if (shouldRenderGroupBelowLeaves) {\n const childrenLeaves = [];\n const childrenGroups = [];\n for (let i = 0; i < node.children.length; i += 1) {\n const childId = node.children[i];\n const childNode = rowTree[childId];\n if (childNode.type === 'group') {\n sortGroup(childNode);\n childrenGroups.push(childId);\n } else if (childNode.type === 'leaf') {\n childrenLeaves.push(childId);\n }\n }\n sortedRowIds = [...childrenLeaves, ...childrenGroups];\n } else {\n for (let i = 0; i < node.children.length; i += 1) {\n const childNode = rowTree[node.children[i]];\n if (childNode.type === 'group') {\n sortGroup(childNode);\n }\n }\n sortedRowIds = [...node.children];\n }\n if (node.footerId != null) {\n sortedRowIds.push(node.footerId);\n }\n sortedGroupedByParentRows.set(node.id, sortedRowIds);\n };\n sortGroup(rowTree[GRID_ROOT_GROUP_ID]);\n const rootList = List.from(sortedGroupedByParentRows.get(GRID_ROOT_GROUP_ID));\n rootList.forEach(node => {\n const children = sortedGroupedByParentRows.get(node.data);\n if (children != null && children.length) {\n node.insertAfter(List.from(children));\n }\n });\n return rootList.data();\n};","import { GRID_ROOT_GROUP_ID } from '@mui/x-data-grid';\nimport { getNodePathInTree, getGroupRowIdFromPath, removeNodeFromTree, updateGroupNodeIdAndAutoGenerated } from './utils';\nconst removeNodeAndCleanParent = ({\n node,\n tree,\n treeDepths,\n updatedGroupsManager\n}) => {\n removeNodeFromTree({\n node,\n tree,\n treeDepths\n });\n if (node.type === 'group' && node.footerId != null) {\n removeNodeFromTree({\n node: tree[node.footerId],\n tree,\n treeDepths\n });\n }\n const parentNode = tree[node.parent];\n updatedGroupsManager == null || updatedGroupsManager.addAction(parentNode.id, 'removeChildren');\n const shouldDeleteGroup = parentNode.id !== GRID_ROOT_GROUP_ID && parentNode.children.length === 0;\n if (shouldDeleteGroup) {\n if (parentNode.isAutoGenerated) {\n removeNodeAndCleanParent({\n node: parentNode,\n tree,\n treeDepths\n });\n } else {\n tree[parentNode.id] = {\n type: 'leaf',\n id: parentNode.id,\n depth: parentNode.depth,\n parent: parentNode.parent,\n groupingKey: parentNode.groupingKey\n };\n }\n }\n};\nconst replaceDataGroupWithAutoGeneratedGroup = ({\n node,\n tree,\n treeDepths,\n updatedGroupsManager\n}) => {\n updatedGroupsManager == null || updatedGroupsManager.addAction(node.parent, 'removeChildren');\n updatedGroupsManager == null || updatedGroupsManager.addAction(node.parent, 'insertChildren');\n updateGroupNodeIdAndAutoGenerated({\n previousTree: null,\n tree,\n treeDepths,\n node,\n updatedNode: {\n id: getGroupRowIdFromPath(getNodePathInTree({\n id: node.id,\n tree\n })),\n isAutoGenerated: true\n }\n });\n};\n\n/**\n * Removed a data row from the tree.\n * If the node is a non-empty group, replace it with an auto-generated group to be able to keep displaying its children.\n * If not, remove it and recursively clean its parent with the following rules:\n * - An empty auto-generated should be removed from the tree\n * - An empty non-auto-generated should be turned into a leaf\n */\nexport const removeDataRowFromTree = ({\n id,\n tree,\n treeDepths,\n updatedGroupsManager\n}) => {\n const node = tree[id];\n if (node.type === 'group' && node.children.length > 0) {\n replaceDataGroupWithAutoGeneratedGroup({\n node,\n tree,\n treeDepths,\n updatedGroupsManager\n });\n } else {\n removeNodeAndCleanParent({\n node,\n tree,\n treeDepths,\n updatedGroupsManager\n });\n }\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { GRID_ROOT_GROUP_ID } from '@mui/x-data-grid';\nimport { isDeepEqual, getTreeNodeDescendants } from '@mui/x-data-grid/internals';\nimport { insertDataRowInTree } from './insertDataRowInTree';\nimport { removeDataRowFromTree } from './removeDataRowFromTree';\nimport { createUpdatedGroupsManager, getNodePathInTree } from './utils';\nexport const updateRowTree = params => {\n const tree = _extends({}, params.previousTree);\n const treeDepths = _extends({}, params.previousTreeDepth);\n const updatedGroupsManager = createUpdatedGroupsManager();\n for (let i = 0; i < params.nodes.inserted.length; i += 1) {\n const {\n id,\n path\n } = params.nodes.inserted[i];\n insertDataRowInTree({\n previousTree: params.previousTree,\n tree,\n treeDepths,\n updatedGroupsManager,\n id,\n path,\n onDuplicatePath: params.onDuplicatePath,\n isGroupExpandedByDefault: params.isGroupExpandedByDefault,\n defaultGroupingExpansionDepth: params.defaultGroupingExpansionDepth\n });\n }\n for (let i = 0; i < params.nodes.removed.length; i += 1) {\n const nodeId = params.nodes.removed[i];\n removeDataRowFromTree({\n tree,\n treeDepths,\n updatedGroupsManager,\n id: nodeId\n });\n }\n for (let i = 0; i < params.nodes.modified.length; i += 1) {\n const {\n id,\n path\n } = params.nodes.modified[i];\n const pathInPreviousTree = getNodePathInTree({\n tree,\n id\n });\n const isInSameGroup = isDeepEqual(pathInPreviousTree, path);\n if (!isInSameGroup) {\n removeDataRowFromTree({\n tree,\n treeDepths,\n updatedGroupsManager,\n id\n });\n insertDataRowInTree({\n previousTree: params.previousTree,\n tree,\n treeDepths,\n updatedGroupsManager,\n id,\n path,\n onDuplicatePath: params.onDuplicatePath,\n isGroupExpandedByDefault: params.isGroupExpandedByDefault,\n defaultGroupingExpansionDepth: params.defaultGroupingExpansionDepth\n });\n } else {\n updatedGroupsManager == null || updatedGroupsManager.addAction(tree[id].parent, 'modifyChildren');\n }\n }\n\n // TODO rows v6: Avoid walking the whole tree, we should be able to generate the new list only using slices.\n const dataRowIds = getTreeNodeDescendants(tree, GRID_ROOT_GROUP_ID, true);\n return {\n tree,\n treeDepths,\n groupingName: params.groupingName,\n dataRowIds,\n updatedGroupsManager\n };\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"hideDescendantCount\"];\nimport * as React from 'react';\nimport { gridRowTreeSelector, useFirstRender, GRID_CHECKBOX_SELECTION_FIELD } from '@mui/x-data-grid';\nimport { useGridRegisterPipeProcessor, useGridRegisterStrategyProcessor } from '@mui/x-data-grid/internals';\nimport { GRID_TREE_DATA_GROUPING_COL_DEF, GRID_TREE_DATA_GROUPING_COL_DEF_FORCED_PROPERTIES } from './gridTreeDataGroupColDef';\nimport { filterRowTreeFromTreeData, TREE_DATA_STRATEGY } from './gridTreeDataUtils';\nimport { GridTreeDataGroupingCell } from '../../../components';\nimport { createRowTree } from '../../../utils/tree/createRowTree';\nimport { sortRowTree } from '../../../utils/tree/sortRowTree';\nimport { updateRowTree } from '../../../utils/tree/updateRowTree';\nimport { getVisibleRowsLookup } from '../../../utils/tree/utils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const useGridTreeDataPreProcessors = (privateApiRef, props) => {\n const setStrategyAvailability = React.useCallback(() => {\n privateApiRef.current.setStrategyAvailability('rowTree', TREE_DATA_STRATEGY, props.treeData ? () => true : () => false);\n }, [privateApiRef, props.treeData]);\n const getGroupingColDef = React.useCallback(() => {\n var _colDefOverride;\n const groupingColDefProp = props.groupingColDef;\n let colDefOverride;\n if (typeof groupingColDefProp === 'function') {\n const params = {\n groupingName: TREE_DATA_STRATEGY,\n fields: []\n };\n colDefOverride = groupingColDefProp(params);\n } else {\n colDefOverride = groupingColDefProp;\n }\n const _ref = (_colDefOverride = colDefOverride) != null ? _colDefOverride : {},\n {\n hideDescendantCount\n } = _ref,\n colDefOverrideProperties = _objectWithoutPropertiesLoose(_ref, _excluded);\n const commonProperties = _extends({}, GRID_TREE_DATA_GROUPING_COL_DEF, {\n renderCell: params => /*#__PURE__*/_jsx(GridTreeDataGroupingCell, _extends({}, params, {\n hideDescendantCount: hideDescendantCount\n })),\n headerName: privateApiRef.current.getLocaleText('treeDataGroupingHeaderName')\n });\n return _extends({}, commonProperties, colDefOverrideProperties, GRID_TREE_DATA_GROUPING_COL_DEF_FORCED_PROPERTIES);\n }, [privateApiRef, props.groupingColDef]);\n const updateGroupingColumn = React.useCallback(columnsState => {\n const groupingColDefField = GRID_TREE_DATA_GROUPING_COL_DEF_FORCED_PROPERTIES.field;\n const shouldHaveGroupingColumn = props.treeData;\n const prevGroupingColumn = columnsState.lookup[groupingColDefField];\n if (shouldHaveGroupingColumn) {\n const newGroupingColumn = getGroupingColDef();\n if (prevGroupingColumn) {\n newGroupingColumn.width = prevGroupingColumn.width;\n newGroupingColumn.flex = prevGroupingColumn.flex;\n }\n columnsState.lookup[groupingColDefField] = newGroupingColumn;\n if (prevGroupingColumn == null) {\n const index = columnsState.orderedFields[0] === GRID_CHECKBOX_SELECTION_FIELD ? 1 : 0;\n columnsState.orderedFields = [...columnsState.orderedFields.slice(0, index), groupingColDefField, ...columnsState.orderedFields.slice(index)];\n }\n } else if (!shouldHaveGroupingColumn && prevGroupingColumn) {\n delete columnsState.lookup[groupingColDefField];\n columnsState.orderedFields = columnsState.orderedFields.filter(field => field !== groupingColDefField);\n }\n return columnsState;\n }, [props.treeData, getGroupingColDef]);\n const createRowTreeForTreeData = React.useCallback(params => {\n if (!props.getTreeDataPath) {\n throw new Error('MUI: No getTreeDataPath given.');\n }\n const getRowTreeBuilderNode = rowId => ({\n id: rowId,\n path: props.getTreeDataPath(params.dataRowIdToModelLookup[rowId]).map(key => ({\n key,\n field: null\n }))\n });\n const onDuplicatePath = (firstId, secondId, path) => {\n throw new Error(['MUI: The path returned by `getTreeDataPath` should be unique.', `The rows with id #${firstId} and #${secondId} have the same.`, `Path: ${JSON.stringify(path.map(step => step.key))}.`].join('\\n'));\n };\n if (params.updates.type === 'full') {\n return createRowTree({\n previousTree: params.previousTree,\n nodes: params.updates.rows.map(getRowTreeBuilderNode),\n defaultGroupingExpansionDepth: props.defaultGroupingExpansionDepth,\n isGroupExpandedByDefault: props.isGroupExpandedByDefault,\n groupingName: TREE_DATA_STRATEGY,\n onDuplicatePath\n });\n }\n return updateRowTree({\n nodes: {\n inserted: params.updates.actions.insert.map(getRowTreeBuilderNode),\n modified: params.updates.actions.modify.map(getRowTreeBuilderNode),\n removed: params.updates.actions.remove\n },\n previousTree: params.previousTree,\n previousTreeDepth: params.previousTreeDepths,\n defaultGroupingExpansionDepth: props.defaultGroupingExpansionDepth,\n isGroupExpandedByDefault: props.isGroupExpandedByDefault,\n groupingName: TREE_DATA_STRATEGY\n });\n }, [props.getTreeDataPath, props.defaultGroupingExpansionDepth, props.isGroupExpandedByDefault]);\n const filterRows = React.useCallback(params => {\n const rowTree = gridRowTreeSelector(privateApiRef);\n return filterRowTreeFromTreeData({\n rowTree,\n isRowMatchingFilters: params.isRowMatchingFilters,\n disableChildrenFiltering: props.disableChildrenFiltering,\n filterModel: params.filterModel,\n apiRef: privateApiRef\n });\n }, [privateApiRef, props.disableChildrenFiltering]);\n const sortRows = React.useCallback(params => {\n const rowTree = gridRowTreeSelector(privateApiRef);\n return sortRowTree({\n rowTree,\n sortRowList: params.sortRowList,\n disableChildrenSorting: props.disableChildrenSorting,\n shouldRenderGroupBelowLeaves: false\n });\n }, [privateApiRef, props.disableChildrenSorting]);\n useGridRegisterPipeProcessor(privateApiRef, 'hydrateColumns', updateGroupingColumn);\n useGridRegisterStrategyProcessor(privateApiRef, TREE_DATA_STRATEGY, 'rowTreeCreation', createRowTreeForTreeData);\n useGridRegisterStrategyProcessor(privateApiRef, TREE_DATA_STRATEGY, 'filtering', filterRows);\n useGridRegisterStrategyProcessor(privateApiRef, TREE_DATA_STRATEGY, 'sorting', sortRows);\n useGridRegisterStrategyProcessor(privateApiRef, TREE_DATA_STRATEGY, 'visibleRowsLookupCreation', getVisibleRowsLookup);\n\n /**\n * 1ST RENDER\n */\n useFirstRender(() => {\n setStrategyAvailability();\n });\n\n /**\n * EFFECTS\n */\n const isFirstRender = React.useRef(true);\n React.useEffect(() => {\n if (!isFirstRender.current) {\n setStrategyAvailability();\n } else {\n isFirstRender.current = false;\n }\n }, [setStrategyAvailability]);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridRegisterPipeProcessor } from '@mui/x-data-grid/internals';\nimport { GRID_ROOT_GROUP_ID } from '@mui/x-data-grid';\nimport { insertNodeInTree } from '../../../utils/tree/utils';\nexport function addPinnedRow({\n groupingParams,\n rowModel,\n rowId,\n position,\n apiRef,\n isAutoGenerated\n}) {\n var _groupingParams$addit, _groupingParams$addit2;\n const dataRowIdToModelLookup = _extends({}, groupingParams.dataRowIdToModelLookup);\n const dataRowIdToIdLookup = _extends({}, groupingParams.dataRowIdToIdLookup);\n const tree = _extends({}, groupingParams.tree);\n const treeDepths = _extends({}, groupingParams.treeDepths);\n\n // TODO: warn if id is already present in `props.rows`\n\n const node = {\n type: 'pinnedRow',\n id: rowId,\n depth: 0,\n parent: GRID_ROOT_GROUP_ID,\n isAutoGenerated\n };\n insertNodeInTree(node, tree, treeDepths, null);\n if (!isAutoGenerated) {\n dataRowIdToModelLookup[rowId] = rowModel;\n dataRowIdToIdLookup[rowId] = rowId;\n }\n // Do not push it to ids list so that pagination is not affected by pinned rows\n\n apiRef.current.caches.rows.dataRowIdToModelLookup[rowId] = _extends({}, rowModel);\n apiRef.current.caches.rows.dataRowIdToIdLookup[rowId] = rowId;\n const previousPinnedRows = ((_groupingParams$addit = groupingParams.additionalRowGroups) == null ? void 0 : _groupingParams$addit.pinnedRows) || {};\n const newPinnedRow = {\n id: rowId,\n model: rowModel\n };\n if ((_groupingParams$addit2 = groupingParams.additionalRowGroups) != null && (_groupingParams$addit2 = _groupingParams$addit2.pinnedRows) != null && (_groupingParams$addit2 = _groupingParams$addit2[position]) != null && _groupingParams$addit2.includes(newPinnedRow)) {\n return _extends({}, groupingParams, {\n dataRowIdToModelLookup,\n dataRowIdToIdLookup,\n tree,\n treeDepths\n });\n }\n return _extends({}, groupingParams, {\n dataRowIdToModelLookup,\n dataRowIdToIdLookup,\n tree,\n treeDepths,\n additionalRowGroups: _extends({}, groupingParams.additionalRowGroups, {\n pinnedRows: _extends({}, previousPinnedRows, {\n [position]: [...(previousPinnedRows[position] || []), newPinnedRow]\n })\n })\n });\n}\nexport const useGridRowPinningPreProcessors = apiRef => {\n const addPinnedRows = React.useCallback(groupingParams => {\n var _pinnedRowsCache$topI, _pinnedRowsCache$bott, _pinnedRowsCache$bott2, _pinnedRowsCache$topI2;\n const pinnedRowsCache = apiRef.current.caches.pinnedRows || {};\n let newGroupingParams = _extends({}, groupingParams, {\n additionalRowGroups: _extends({}, groupingParams.additionalRowGroups, {\n // reset pinned rows state\n pinnedRows: {}\n })\n });\n (_pinnedRowsCache$topI = pinnedRowsCache.topIds) == null || _pinnedRowsCache$topI.forEach(rowId => {\n newGroupingParams = addPinnedRow({\n groupingParams: newGroupingParams,\n rowModel: pinnedRowsCache.idLookup[rowId],\n rowId,\n position: 'top',\n apiRef,\n isAutoGenerated: false\n });\n });\n (_pinnedRowsCache$bott = pinnedRowsCache.bottomIds) == null || _pinnedRowsCache$bott.forEach(rowId => {\n newGroupingParams = addPinnedRow({\n groupingParams: newGroupingParams,\n rowModel: pinnedRowsCache.idLookup[rowId],\n rowId,\n position: 'bottom',\n apiRef,\n isAutoGenerated: false\n });\n });\n\n // If row with the same `id` is present both in `rows` and `pinnedRows` - remove it from the root group children\n if ((_pinnedRowsCache$bott2 = pinnedRowsCache.bottomIds) != null && _pinnedRowsCache$bott2.length || (_pinnedRowsCache$topI2 = pinnedRowsCache.topIds) != null && _pinnedRowsCache$topI2.length) {\n const shouldKeepRow = rowId => {\n if (newGroupingParams.tree[rowId] && newGroupingParams.tree[rowId].type === 'pinnedRow') {\n return false;\n }\n return true;\n };\n const rootGroupNode = newGroupingParams.tree[GRID_ROOT_GROUP_ID];\n newGroupingParams.tree[GRID_ROOT_GROUP_ID] = _extends({}, rootGroupNode, {\n children: rootGroupNode.children.filter(shouldKeepRow)\n });\n newGroupingParams.dataRowIds = newGroupingParams.dataRowIds.filter(shouldKeepRow);\n }\n return newGroupingParams;\n }, [apiRef]);\n useGridRegisterPipeProcessor(apiRef, 'hydrateRows', addPinnedRows);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useTheme } from '@mui/material/styles';\nimport { useGridSelector, gridVisibleColumnDefinitionsSelector, gridColumnsTotalWidthSelector, gridColumnPositionsSelector, gridVisibleColumnFieldsSelector, useGridApiMethod, useGridApiEventHandler, gridColumnFieldsSelector } from '@mui/x-data-grid';\nimport { useGridRegisterPipeProcessor } from '@mui/x-data-grid/internals';\nimport { GridPinnedPosition } from './gridColumnPinningInterface';\nimport { gridPinnedColumnsSelector } from './gridColumnPinningSelector';\nimport { filterColumns } from '../../../components/DataGridProVirtualScroller';\nexport const columnPinningStateInitializer = (state, props, apiRef) => {\n var _props$initialState;\n apiRef.current.caches.columnPinning = {\n orderedFieldsBeforePinningColumns: null\n };\n let model;\n if (props.disableColumnPinning) {\n model = {};\n } else if (props.pinnedColumns) {\n model = props.pinnedColumns;\n } else if ((_props$initialState = props.initialState) != null && _props$initialState.pinnedColumns) {\n var _props$initialState2;\n model = (_props$initialState2 = props.initialState) == null ? void 0 : _props$initialState2.pinnedColumns;\n } else {\n model = {};\n }\n return _extends({}, state, {\n pinnedColumns: model\n });\n};\nconst mergeStateWithPinnedColumns = pinnedColumns => state => _extends({}, state, {\n pinnedColumns\n});\nexport const useGridColumnPinning = (apiRef, props) => {\n var _props$initialState4;\n const pinnedColumns = useGridSelector(apiRef, gridPinnedColumnsSelector);\n const theme = useTheme();\n\n /**\n * PRE-PROCESSING\n */\n const calculateScrollLeft = React.useCallback((initialValue, params) => {\n if (props.disableColumnPinning) {\n return initialValue;\n }\n const visibleColumnFields = gridVisibleColumnFieldsSelector(apiRef);\n const [leftPinnedColumns, rightPinnedColumns] = filterColumns(pinnedColumns, visibleColumnFields, theme.direction === 'rtl');\n if (!params.colIndex || leftPinnedColumns.length === 0 && rightPinnedColumns.length === 0) {\n return initialValue;\n }\n const visibleColumns = gridVisibleColumnDefinitionsSelector(apiRef);\n const columnsTotalWidth = gridColumnsTotalWidthSelector(apiRef);\n const columnPositions = gridColumnPositionsSelector(apiRef);\n const clientWidth = apiRef.current.virtualScrollerRef.current.clientWidth;\n\n // When using RTL, `scrollLeft` becomes negative, so we must ensure that we only compare values.\n const scrollLeft = Math.abs(apiRef.current.virtualScrollerRef.current.scrollLeft);\n const offsetWidth = visibleColumns[params.colIndex].computedWidth;\n const offsetLeft = columnPositions[params.colIndex];\n const leftPinnedColumnsWidth = columnPositions[leftPinnedColumns.length];\n const rightPinnedColumnsWidth = columnsTotalWidth - columnPositions[columnPositions.length - rightPinnedColumns.length];\n const elementBottom = offsetLeft + offsetWidth;\n if (elementBottom - (clientWidth - rightPinnedColumnsWidth) > scrollLeft) {\n const left = elementBottom - (clientWidth - rightPinnedColumnsWidth);\n return _extends({}, initialValue, {\n left\n });\n }\n if (offsetLeft < scrollLeft + leftPinnedColumnsWidth) {\n const left = offsetLeft - leftPinnedColumnsWidth;\n return _extends({}, initialValue, {\n left\n });\n }\n return initialValue;\n }, [apiRef, pinnedColumns, props.disableColumnPinning, theme.direction]);\n const addColumnMenuItems = React.useCallback((columnMenuItems, colDef) => {\n if (props.disableColumnPinning) {\n return columnMenuItems;\n }\n if (colDef.pinnable === false) {\n return columnMenuItems;\n }\n return [...columnMenuItems, 'columnMenuPinningItem'];\n }, [props.disableColumnPinning]);\n const checkIfCanBeReordered = React.useCallback((initialValue, {\n targetIndex\n }) => {\n const visibleColumnFields = gridVisibleColumnFieldsSelector(apiRef);\n const [leftPinnedColumns, rightPinnedColumns] = filterColumns(pinnedColumns, visibleColumnFields, theme.direction === 'rtl');\n if (leftPinnedColumns.length === 0 && rightPinnedColumns.length === 0) {\n return initialValue;\n }\n if (leftPinnedColumns.length > 0 && targetIndex < leftPinnedColumns.length) {\n return false;\n }\n if (rightPinnedColumns.length > 0) {\n const visibleColumns = gridVisibleColumnDefinitionsSelector(apiRef);\n const firstRightPinnedColumnIndex = visibleColumns.length - rightPinnedColumns.length;\n return targetIndex >= firstRightPinnedColumnIndex ? false : initialValue;\n }\n return initialValue;\n }, [apiRef, pinnedColumns, theme.direction]);\n const stateExportPreProcessing = React.useCallback((prevState, context) => {\n var _props$initialState3, _pinnedColumnsToExpor, _pinnedColumnsToExpor2;\n const pinnedColumnsToExport = gridPinnedColumnsSelector(apiRef.current.state);\n const shouldExportPinnedColumns =\n // Always export if the `exportOnlyDirtyModels` property is not activated\n !context.exportOnlyDirtyModels ||\n // Always export if the model is controlled\n props.pinnedColumns != null ||\n // Always export if the model has been initialized\n ((_props$initialState3 = props.initialState) == null ? void 0 : _props$initialState3.pinnedColumns) != null ||\n // Export if the model is not empty\n ((_pinnedColumnsToExpor = pinnedColumnsToExport.left) != null ? _pinnedColumnsToExpor : []).length > 0 || ((_pinnedColumnsToExpor2 = pinnedColumnsToExport.right) != null ? _pinnedColumnsToExpor2 : []).length > 0;\n if (!shouldExportPinnedColumns) {\n return prevState;\n }\n return _extends({}, prevState, {\n pinnedColumns: pinnedColumnsToExport\n });\n }, [apiRef, props.pinnedColumns, (_props$initialState4 = props.initialState) == null ? void 0 : _props$initialState4.pinnedColumns]);\n const stateRestorePreProcessing = React.useCallback((params, context) => {\n const newPinnedColumns = context.stateToRestore.pinnedColumns;\n if (newPinnedColumns != null) {\n apiRef.current.setState(mergeStateWithPinnedColumns(newPinnedColumns));\n }\n return params;\n }, [apiRef]);\n useGridRegisterPipeProcessor(apiRef, 'scrollToIndexes', calculateScrollLeft);\n useGridRegisterPipeProcessor(apiRef, 'columnMenu', addColumnMenuItems);\n useGridRegisterPipeProcessor(apiRef, 'canBeReordered', checkIfCanBeReordered);\n useGridRegisterPipeProcessor(apiRef, 'exportState', stateExportPreProcessing);\n useGridRegisterPipeProcessor(apiRef, 'restoreState', stateRestorePreProcessing);\n apiRef.current.registerControlState({\n stateId: 'pinnedColumns',\n propModel: props.pinnedColumns,\n propOnChange: props.onPinnedColumnsChange,\n stateSelector: gridPinnedColumnsSelector,\n changeEvent: 'pinnedColumnsChange'\n });\n const checkIfEnabled = React.useCallback(methodName => {\n if (props.disableColumnPinning) {\n throw new Error(`MUI: You cannot call \\`apiRef.current.${methodName}\\` when \\`disableColumnPinning\\` is true.`);\n }\n }, [props.disableColumnPinning]);\n const pinColumn = React.useCallback((field, side) => {\n checkIfEnabled('pinColumn');\n if (apiRef.current.isColumnPinned(field) === side) {\n return;\n }\n const otherSide = side === GridPinnedPosition.right ? GridPinnedPosition.left : GridPinnedPosition.right;\n const newPinnedColumns = {\n [side]: [...(pinnedColumns[side] || []), field],\n [otherSide]: (pinnedColumns[otherSide] || []).filter(column => column !== field)\n };\n apiRef.current.setPinnedColumns(newPinnedColumns);\n }, [apiRef, checkIfEnabled, pinnedColumns]);\n const unpinColumn = React.useCallback(field => {\n checkIfEnabled('unpinColumn');\n apiRef.current.setPinnedColumns({\n left: (pinnedColumns.left || []).filter(column => column !== field),\n right: (pinnedColumns.right || []).filter(column => column !== field)\n });\n }, [apiRef, checkIfEnabled, pinnedColumns.left, pinnedColumns.right]);\n const getPinnedColumns = React.useCallback(() => {\n checkIfEnabled('getPinnedColumns');\n return gridPinnedColumnsSelector(apiRef.current.state);\n }, [apiRef, checkIfEnabled]);\n const setPinnedColumns = React.useCallback(newPinnedColumns => {\n checkIfEnabled('setPinnedColumns');\n apiRef.current.setState(mergeStateWithPinnedColumns(newPinnedColumns));\n apiRef.current.forceUpdate();\n }, [apiRef, checkIfEnabled]);\n const isColumnPinned = React.useCallback(field => {\n checkIfEnabled('isColumnPinned');\n const leftPinnedColumns = pinnedColumns.left || [];\n if (leftPinnedColumns.includes(field)) {\n return GridPinnedPosition.left;\n }\n const rightPinnedColumns = pinnedColumns.right || [];\n if (rightPinnedColumns.includes(field)) {\n return GridPinnedPosition.right;\n }\n return false;\n }, [pinnedColumns.left, pinnedColumns.right, checkIfEnabled]);\n const columnPinningApi = {\n pinColumn,\n unpinColumn,\n getPinnedColumns,\n setPinnedColumns,\n isColumnPinned\n };\n useGridApiMethod(apiRef, columnPinningApi, 'public');\n const handleColumnOrderChange = React.useCallback(params => {\n if (!apiRef.current.caches.columnPinning.orderedFieldsBeforePinningColumns) {\n return;\n }\n const {\n column,\n targetIndex,\n oldIndex\n } = params;\n const delta = targetIndex > oldIndex ? 1 : -1;\n const latestColumnFields = gridColumnFieldsSelector(apiRef);\n\n /**\n * When a column X is reordered to somewhere else, the position where this column X is dropped\n * on must be moved to left or right to make room for it. The ^^^ below represents the column\n * which gave space to receive X.\n *\n * | X | B | C | D | -> | B | C | D | X | (e.g. X moved to after D, so delta=1)\n * ^^^ ^^^\n *\n * | A | B | C | X | -> | X | A | B | C | (e.g. X moved before A, so delta=-1)\n * ^^^ ^^^\n *\n * If column P is pinned, it will not move to provide space. However, it will jump to the next\n * non-pinned column.\n *\n * | X | B | P | D | -> | B | D | P | X | (e.g. X moved to after D, with P pinned)\n * ^^^ ^^^\n */\n const siblingField = latestColumnFields[targetIndex - delta];\n const newOrderedFieldsBeforePinningColumns = [...apiRef.current.caches.columnPinning.orderedFieldsBeforePinningColumns];\n\n // The index to start swapping fields\n let i = newOrderedFieldsBeforePinningColumns.findIndex(currentColumn => currentColumn === column.field);\n // The index of the field to swap with\n let j = i + delta;\n\n // When to stop swapping fields.\n // We stop one field before because the swap is done with i + 1 (if delta=1)\n const stop = newOrderedFieldsBeforePinningColumns.findIndex(currentColumn => currentColumn === siblingField);\n while (delta > 0 ? i < stop : i > stop) {\n // If the field to swap with is a pinned column, jump to the next\n while (apiRef.current.isColumnPinned(newOrderedFieldsBeforePinningColumns[j])) {\n j += delta;\n }\n const temp = newOrderedFieldsBeforePinningColumns[i];\n newOrderedFieldsBeforePinningColumns[i] = newOrderedFieldsBeforePinningColumns[j];\n newOrderedFieldsBeforePinningColumns[j] = temp;\n i = j;\n j = i + delta;\n }\n apiRef.current.caches.columnPinning.orderedFieldsBeforePinningColumns = newOrderedFieldsBeforePinningColumns;\n }, [apiRef]);\n useGridApiEventHandler(apiRef, 'columnOrderChange', handleColumnOrderChange);\n React.useEffect(() => {\n if (props.pinnedColumns) {\n apiRef.current.setPinnedColumns(props.pinnedColumns);\n }\n }, [apiRef, props.pinnedColumns]);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { useGridLogger } from '../../utils';\nimport { gridColumnLookupSelector, gridColumnVisibilityModelSelector, gridColumnFieldsSelector } from '../columns/gridColumnsSelector';\nexport const headerFilteringStateInitializer = state => _extends({}, state, {\n headerFiltering: {\n editing: null,\n menuOpen: null\n }\n});\nexport const useGridHeaderFiltering = (apiRef, props) => {\n const logger = useGridLogger(apiRef, 'useGridHeaderFiltering');\n const setHeaderFilterState = React.useCallback(headerFilterState => {\n apiRef.current.setState(state => {\n var _headerFilterState$ed, _headerFilterState$me;\n // Safety check to avoid MIT users from using it\n // This hook should ultimately be moved to the Pro package\n if (props.signature === 'DataGrid') {\n return state;\n }\n return _extends({}, state, {\n headerFiltering: {\n editing: (_headerFilterState$ed = headerFilterState.editing) != null ? _headerFilterState$ed : null,\n menuOpen: (_headerFilterState$me = headerFilterState.menuOpen) != null ? _headerFilterState$me : null\n }\n });\n });\n apiRef.current.forceUpdate();\n }, [apiRef, props.signature]);\n const startHeaderFilterEditMode = React.useCallback(field => {\n logger.debug(`Starting edit mode on header filter for field: ${field}`);\n apiRef.current.setHeaderFilterState({\n editing: field\n });\n }, [apiRef, logger]);\n const stopHeaderFilterEditMode = React.useCallback(() => {\n logger.debug(`Stopping edit mode on header filter`);\n apiRef.current.setHeaderFilterState({\n editing: null\n });\n }, [apiRef, logger]);\n const showHeaderFilterMenu = React.useCallback(field => {\n logger.debug(`Opening header filter menu for field: ${field}`);\n apiRef.current.setHeaderFilterState({\n menuOpen: field\n });\n }, [apiRef, logger]);\n const hideHeaderFilterMenu = React.useCallback(() => {\n logger.debug(`Hiding header filter menu for active field`);\n let fieldToFocus = apiRef.current.state.headerFiltering.menuOpen;\n if (fieldToFocus) {\n const columnLookup = gridColumnLookupSelector(apiRef);\n const columnVisibilityModel = gridColumnVisibilityModelSelector(apiRef);\n const orderedFields = gridColumnFieldsSelector(apiRef);\n\n // If the column was removed from the grid, we need to find the closest visible field\n if (!columnLookup[fieldToFocus]) {\n fieldToFocus = orderedFields[0];\n }\n\n // If the field to focus is hidden, we need to find the closest visible field\n if (columnVisibilityModel[fieldToFocus] === false) {\n // contains visible column fields + the field that was just hidden\n const visibleOrderedFields = orderedFields.filter(field => {\n if (field === fieldToFocus) {\n return true;\n }\n return columnVisibilityModel[field] !== false;\n });\n const fieldIndex = visibleOrderedFields.indexOf(fieldToFocus);\n fieldToFocus = visibleOrderedFields[fieldIndex + 1] || visibleOrderedFields[fieldIndex - 1];\n }\n apiRef.current.setHeaderFilterState({\n menuOpen: null\n });\n apiRef.current.setColumnHeaderFilterFocus(fieldToFocus);\n }\n }, [apiRef, logger]);\n const headerFilterPrivateApi = {\n setHeaderFilterState\n };\n const headerFilterApi = {\n startHeaderFilterEditMode,\n stopHeaderFilterEditMode,\n showHeaderFilterMenu,\n hideHeaderFilterMenu\n };\n useGridApiMethod(apiRef, headerFilterApi, 'public');\n useGridApiMethod(apiRef, headerFilterPrivateApi, 'private');\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridSelector, useGridApiEventHandler, useGridApiMethod, gridDataRowIdsSelector } from '@mui/x-data-grid';\nimport { useGridRegisterPipeProcessor } from '@mui/x-data-grid/internals';\nimport { GRID_DETAIL_PANEL_TOGGLE_FIELD } from './gridDetailPanelToggleColDef';\nimport { gridDetailPanelExpandedRowIdsSelector, gridDetailPanelExpandedRowsContentCacheSelector, gridDetailPanelExpandedRowsHeightCacheSelector, gridDetailPanelRawHeightCacheSelector } from './gridDetailPanelSelector';\nexport const detailPanelStateInitializer = (state, props) => {\n var _ref, _props$detailPanelExp, _props$initialState;\n return _extends({}, state, {\n detailPanel: {\n heightCache: {},\n expandedRowIds: (_ref = (_props$detailPanelExp = props.detailPanelExpandedRowIds) != null ? _props$detailPanelExp : (_props$initialState = props.initialState) == null || (_props$initialState = _props$initialState.detailPanel) == null ? void 0 : _props$initialState.expandedRowIds) != null ? _ref : []\n }\n });\n};\nfunction cacheContentAndHeight(apiRef, getDetailPanelContent, getDetailPanelHeight, previousHeightCache) {\n if (typeof getDetailPanelContent !== 'function') {\n return {};\n }\n\n // TODO change to lazy approach using a Proxy\n // only call getDetailPanelContent when asked for an id\n const rowIds = gridDataRowIdsSelector(apiRef);\n const contentCache = rowIds.reduce((acc, id) => {\n const params = apiRef.current.getRowParams(id);\n acc[id] = getDetailPanelContent(params);\n return acc;\n }, {});\n const heightCache = rowIds.reduce((acc, id) => {\n var _previousHeightCache$;\n if (contentCache[id] == null) {\n return acc;\n }\n const params = apiRef.current.getRowParams(id);\n const height = getDetailPanelHeight(params);\n const autoHeight = height === 'auto';\n acc[id] = {\n autoHeight,\n height: autoHeight ? (_previousHeightCache$ = previousHeightCache[id]) == null ? void 0 : _previousHeightCache$.height : height\n };\n return acc;\n }, {});\n return {\n contentCache,\n heightCache\n };\n}\nexport const useGridDetailPanel = (apiRef, props) => {\n const expandedRowIds = useGridSelector(apiRef, gridDetailPanelExpandedRowIdsSelector);\n const contentCache = useGridSelector(apiRef, gridDetailPanelExpandedRowsContentCacheSelector);\n const handleCellClick = React.useCallback((params, event) => {\n if (params.field !== GRID_DETAIL_PANEL_TOGGLE_FIELD || props.getDetailPanelContent == null) {\n return;\n }\n const content = contentCache[params.id];\n if (! /*#__PURE__*/React.isValidElement(content)) {\n return;\n }\n\n // Ignore if the user didn't click specifically in the \"i\" button\n if (event.target === event.currentTarget) {\n return;\n }\n apiRef.current.toggleDetailPanel(params.id);\n }, [apiRef, contentCache, props.getDetailPanelContent]);\n const handleCellKeyDown = React.useCallback((params, event) => {\n if (props.getDetailPanelContent == null) {\n return;\n }\n if (params.field === GRID_DETAIL_PANEL_TOGGLE_FIELD && event.key === ' ') {\n apiRef.current.toggleDetailPanel(params.id);\n }\n }, [apiRef, props.getDetailPanelContent]);\n useGridApiEventHandler(apiRef, 'cellClick', handleCellClick);\n useGridApiEventHandler(apiRef, 'cellKeyDown', handleCellKeyDown);\n apiRef.current.registerControlState({\n stateId: 'detailPanels',\n propModel: props.detailPanelExpandedRowIds,\n propOnChange: props.onDetailPanelExpandedRowIdsChange,\n stateSelector: gridDetailPanelExpandedRowIdsSelector,\n changeEvent: 'detailPanelsExpandedRowIdsChange'\n });\n const toggleDetailPanel = React.useCallback(id => {\n if (props.getDetailPanelContent == null) {\n return;\n }\n const content = contentCache[id];\n if (! /*#__PURE__*/React.isValidElement(content)) {\n return;\n }\n const ids = apiRef.current.getExpandedDetailPanels();\n apiRef.current.setExpandedDetailPanels(ids.includes(id) ? ids.filter(rowId => rowId !== id) : [...ids, id]);\n }, [apiRef, contentCache, props.getDetailPanelContent]);\n const getExpandedDetailPanels = React.useCallback(() => gridDetailPanelExpandedRowIdsSelector(apiRef.current.state), [apiRef]);\n const setExpandedDetailPanels = React.useCallback(ids => {\n apiRef.current.setState(state => {\n return _extends({}, state, {\n detailPanel: _extends({}, state.detailPanel, {\n expandedRowIds: ids\n })\n });\n });\n apiRef.current.forceUpdate();\n }, [apiRef]);\n const storeDetailPanelHeight = React.useCallback((id, height) => {\n const heightCache = gridDetailPanelRawHeightCacheSelector(apiRef.current.state);\n if (!heightCache[id] || heightCache[id].height === height) {\n return;\n }\n apiRef.current.setState(state => {\n return _extends({}, state, {\n detailPanel: _extends({}, state.detailPanel, {\n heightCache: _extends({}, heightCache, {\n [id]: _extends({}, heightCache[id], {\n height\n })\n })\n })\n });\n });\n apiRef.current.requestPipeProcessorsApplication('rowHeight');\n }, [apiRef]);\n const detailPanelHasAutoHeight = React.useCallback(id => {\n const heightCache = gridDetailPanelRawHeightCacheSelector(apiRef.current.state);\n return heightCache[id] ? heightCache[id].autoHeight : false;\n }, [apiRef]);\n const detailPanelPubicApi = {\n toggleDetailPanel,\n getExpandedDetailPanels,\n setExpandedDetailPanels\n };\n const detailPanelPrivateApi = {\n storeDetailPanelHeight,\n detailPanelHasAutoHeight\n };\n useGridApiMethod(apiRef, detailPanelPubicApi, 'public');\n useGridApiMethod(apiRef, detailPanelPrivateApi, 'private');\n React.useEffect(() => {\n if (props.detailPanelExpandedRowIds) {\n const currentModel = gridDetailPanelExpandedRowIdsSelector(apiRef.current.state);\n if (currentModel !== props.detailPanelExpandedRowIds) {\n apiRef.current.setExpandedDetailPanels(props.detailPanelExpandedRowIds);\n }\n }\n }, [apiRef, props.detailPanelExpandedRowIds]);\n const updateCachesAndForceUpdate = React.useCallback(() => {\n apiRef.current.setState(state => {\n return _extends({}, state, {\n detailPanel: _extends({}, state.detailPanel, cacheContentAndHeight(apiRef, props.getDetailPanelContent, props.getDetailPanelHeight, state.detailPanel.heightCache))\n });\n });\n apiRef.current.forceUpdate();\n }, [apiRef, props.getDetailPanelContent, props.getDetailPanelHeight]);\n useGridApiEventHandler(apiRef, 'sortedRowsSet', updateCachesAndForceUpdate);\n const previousGetDetailPanelContentProp = React.useRef();\n const previousGetDetailPanelHeightProp = React.useRef();\n const updateCachesIfNeeded = React.useCallback(() => {\n if (props.getDetailPanelContent === previousGetDetailPanelContentProp.current && props.getDetailPanelHeight === previousGetDetailPanelHeightProp.current) {\n return;\n }\n apiRef.current.setState(state => {\n return _extends({}, state, {\n detailPanel: _extends({}, state.detailPanel, cacheContentAndHeight(apiRef, props.getDetailPanelContent, props.getDetailPanelHeight, state.detailPanel.heightCache))\n });\n });\n previousGetDetailPanelContentProp.current = props.getDetailPanelContent;\n previousGetDetailPanelHeightProp.current = props.getDetailPanelHeight;\n }, [apiRef, props.getDetailPanelContent, props.getDetailPanelHeight]);\n const addDetailHeight = React.useCallback((initialValue, row) => {\n var _heightCache$row$id;\n if (!expandedRowIds || expandedRowIds.length === 0 || !expandedRowIds.includes(row.id)) {\n initialValue.detail = 0;\n return initialValue;\n }\n updateCachesIfNeeded();\n const heightCache = gridDetailPanelExpandedRowsHeightCacheSelector(apiRef);\n initialValue.detail = (_heightCache$row$id = heightCache[row.id]) != null ? _heightCache$row$id : 0; // Fallback to zero because the cache might not be ready yet (e.g. page was changed)\n return initialValue;\n }, [apiRef, expandedRowIds, updateCachesIfNeeded]);\n useGridRegisterPipeProcessor(apiRef, 'rowHeight', addDetailHeight);\n const isFirstRender = React.useRef(true);\n if (isFirstRender.current) {\n isFirstRender.current = false;\n updateCachesIfNeeded();\n }\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridApiMethod } from '@mui/x-data-grid';\nimport { getRowIdFromRowModel } from '@mui/x-data-grid/internals';\nfunction createPinnedRowsInternalCache(pinnedRows, getRowId) {\n var _pinnedRows$top, _pinnedRows$bottom;\n const cache = {\n topIds: [],\n bottomIds: [],\n idLookup: {}\n };\n pinnedRows == null || (_pinnedRows$top = pinnedRows.top) == null || _pinnedRows$top.forEach(rowModel => {\n const id = getRowIdFromRowModel(rowModel, getRowId);\n cache.topIds.push(id);\n cache.idLookup[id] = rowModel;\n });\n pinnedRows == null || (_pinnedRows$bottom = pinnedRows.bottom) == null || _pinnedRows$bottom.forEach(rowModel => {\n const id = getRowIdFromRowModel(rowModel, getRowId);\n cache.bottomIds.push(id);\n cache.idLookup[id] = rowModel;\n });\n return cache;\n}\nexport const rowPinningStateInitializer = (state, props, apiRef) => {\n var _state$rows;\n apiRef.current.caches.pinnedRows = createPinnedRowsInternalCache(props.pinnedRows, props.getRowId);\n return _extends({}, state, {\n rows: _extends({}, state.rows, {\n additionalRowGroups: _extends({}, (_state$rows = state.rows) == null ? void 0 : _state$rows.additionalRowGroups, {\n pinnedRows: {\n top: [],\n bottom: []\n }\n })\n })\n });\n};\nexport const useGridRowPinning = (apiRef, props) => {\n const setPinnedRows = React.useCallback(newPinnedRows => {\n apiRef.current.caches.pinnedRows = createPinnedRowsInternalCache(newPinnedRows, props.getRowId);\n apiRef.current.requestPipeProcessorsApplication('hydrateRows');\n }, [apiRef, props.getRowId]);\n useGridApiMethod(apiRef, {\n unstable_setPinnedRows: setPinnedRows\n }, 'public');\n const isFirstRender = React.useRef(true);\n React.useEffect(() => {\n if (isFirstRender.current) {\n isFirstRender.current = false;\n return;\n }\n apiRef.current.unstable_setPinnedRows(props.pinnedRows);\n }, [apiRef, props.pinnedRows]);\n};","import { createSelector } from '@mui/x-data-grid/internals';\nexport const gridColumnReorderSelector = state => state.columnReorder;\nexport const gridColumnReorderDragColSelector = createSelector(gridColumnReorderSelector, columnReorder => columnReorder.dragCol);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { useTheme } from '@mui/material/styles';\nimport { useGridApiEventHandler, getDataGridUtilityClass, useGridLogger, useGridApiOptionHandler } from '@mui/x-data-grid';\nimport { gridColumnReorderDragColSelector } from './columnReorderSelector';\nconst CURSOR_MOVE_DIRECTION_LEFT = 'left';\nconst CURSOR_MOVE_DIRECTION_RIGHT = 'right';\nconst getCursorMoveDirectionX = (currentCoordinates, nextCoordinates) => {\n return currentCoordinates.x <= nextCoordinates.x ? CURSOR_MOVE_DIRECTION_RIGHT : CURSOR_MOVE_DIRECTION_LEFT;\n};\nconst hasCursorPositionChanged = (currentCoordinates, nextCoordinates) => currentCoordinates.x !== nextCoordinates.x || currentCoordinates.y !== nextCoordinates.y;\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n columnHeaderDragging: ['columnHeader--dragging']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nexport const columnReorderStateInitializer = state => _extends({}, state, {\n columnReorder: {\n dragCol: ''\n }\n});\n\n/**\n * @requires useGridColumns (method)\n */\nexport const useGridColumnReorder = (apiRef, props) => {\n const logger = useGridLogger(apiRef, 'useGridColumnReorder');\n const dragColNode = React.useRef(null);\n const cursorPosition = React.useRef({\n x: 0,\n y: 0\n });\n const originColumnIndex = React.useRef(null);\n const forbiddenIndexes = React.useRef({});\n const removeDnDStylesTimeout = React.useRef();\n const ownerState = {\n classes: props.classes\n };\n const classes = useUtilityClasses(ownerState);\n const theme = useTheme();\n React.useEffect(() => {\n return () => {\n clearTimeout(removeDnDStylesTimeout.current);\n };\n }, []);\n const handleDragStart = React.useCallback((params, event) => {\n if (props.disableColumnReorder || params.colDef.disableReorder) {\n return;\n }\n logger.debug(`Start dragging col ${params.field}`);\n // Prevent drag events propagation.\n // For more information check here https://github.com/mui/mui-x/issues/2680.\n event.stopPropagation();\n dragColNode.current = event.currentTarget;\n dragColNode.current.classList.add(classes.columnHeaderDragging);\n if (event.dataTransfer) {\n event.dataTransfer.effectAllowed = 'move';\n }\n apiRef.current.setState(state => _extends({}, state, {\n columnReorder: _extends({}, state.columnReorder, {\n dragCol: params.field\n })\n }));\n apiRef.current.forceUpdate();\n removeDnDStylesTimeout.current = setTimeout(() => {\n dragColNode.current.classList.remove(classes.columnHeaderDragging);\n });\n originColumnIndex.current = apiRef.current.getColumnIndex(params.field, false);\n const draggingColumnGroupPath = apiRef.current.unstable_getColumnGroupPath(params.field);\n const columnIndex = originColumnIndex.current;\n const allColumns = apiRef.current.getAllColumns();\n const groupsLookup = apiRef.current.unstable_getAllGroupDetails();\n const getGroupPathFromColumnIndex = colIndex => {\n const field = allColumns[colIndex].field;\n return apiRef.current.unstable_getColumnGroupPath(field);\n };\n\n // The limitingGroupId is the id of the group from which the dragged column should not escape\n let limitingGroupId = null;\n draggingColumnGroupPath.forEach(groupId => {\n var _groupsLookup$groupId;\n if (!((_groupsLookup$groupId = groupsLookup[groupId]) != null && _groupsLookup$groupId.freeReordering)) {\n // Only consider group that are made of more than one column\n if (columnIndex > 0 && getGroupPathFromColumnIndex(columnIndex - 1).includes(groupId)) {\n limitingGroupId = groupId;\n } else if (columnIndex + 1 < allColumns.length && getGroupPathFromColumnIndex(columnIndex + 1).includes(groupId)) {\n limitingGroupId = groupId;\n }\n }\n });\n forbiddenIndexes.current = {};\n for (let indexToForbid = 0; indexToForbid < allColumns.length; indexToForbid += 1) {\n const leftIndex = indexToForbid <= columnIndex ? indexToForbid - 1 : indexToForbid;\n const rightIndex = indexToForbid < columnIndex ? indexToForbid : indexToForbid + 1;\n if (limitingGroupId !== null) {\n // verify this indexToForbid will be linked to the limiting group. Otherwise forbid it\n let allowIndex = false;\n if (leftIndex >= 0 && getGroupPathFromColumnIndex(leftIndex).includes(limitingGroupId)) {\n allowIndex = true;\n } else if (rightIndex < allColumns.length && getGroupPathFromColumnIndex(rightIndex).includes(limitingGroupId)) {\n allowIndex = true;\n }\n if (!allowIndex) {\n forbiddenIndexes.current[indexToForbid] = true;\n }\n }\n\n // Verify we are not splitting another group\n if (leftIndex >= 0 && rightIndex < allColumns.length) {\n getGroupPathFromColumnIndex(rightIndex).forEach(groupId => {\n if (getGroupPathFromColumnIndex(leftIndex).includes(groupId)) {\n if (!draggingColumnGroupPath.includes(groupId)) {\n var _groupsLookup$groupId2;\n // moving here split the group groupId in two distincts chunks\n if (!((_groupsLookup$groupId2 = groupsLookup[groupId]) != null && _groupsLookup$groupId2.freeReordering)) {\n forbiddenIndexes.current[indexToForbid] = true;\n }\n }\n }\n });\n }\n }\n }, [props.disableColumnReorder, classes.columnHeaderDragging, logger, apiRef]);\n const handleDragEnter = React.useCallback((params, event) => {\n event.preventDefault();\n // Prevent drag events propagation.\n // For more information check here https://github.com/mui/mui-x/issues/2680.\n event.stopPropagation();\n }, []);\n const handleDragOver = React.useCallback((params, event) => {\n const dragColField = gridColumnReorderDragColSelector(apiRef);\n if (!dragColField) {\n return;\n }\n logger.debug(`Dragging over col ${params.field}`);\n event.preventDefault();\n // Prevent drag events propagation.\n // For more information check here https://github.com/mui/mui-x/issues/2680.\n event.stopPropagation();\n const coordinates = {\n x: event.clientX,\n y: event.clientY\n };\n if (params.field !== dragColField && hasCursorPositionChanged(cursorPosition.current, coordinates)) {\n const targetColIndex = apiRef.current.getColumnIndex(params.field, false);\n const targetColVisibleIndex = apiRef.current.getColumnIndex(params.field, true);\n const targetCol = apiRef.current.getColumn(params.field);\n const dragColIndex = apiRef.current.getColumnIndex(dragColField, false);\n const visibleColumns = apiRef.current.getVisibleColumns();\n const allColumns = apiRef.current.getAllColumns();\n const cursorMoveDirectionX = getCursorMoveDirectionX(cursorPosition.current, coordinates);\n const hasMovedLeft = cursorMoveDirectionX === CURSOR_MOVE_DIRECTION_LEFT && (theme.direction === 'rtl' ? dragColIndex < targetColIndex : targetColIndex < dragColIndex);\n const hasMovedRight = cursorMoveDirectionX === CURSOR_MOVE_DIRECTION_RIGHT && (theme.direction === 'rtl' ? targetColIndex < dragColIndex : dragColIndex < targetColIndex);\n if (hasMovedLeft || hasMovedRight) {\n let canBeReordered;\n let indexOffsetInHiddenColumns = 0;\n if (!targetCol.disableReorder) {\n canBeReordered = true;\n } else if (hasMovedLeft) {\n canBeReordered = targetColVisibleIndex > 0 && !visibleColumns[targetColVisibleIndex - 1].disableReorder;\n } else {\n canBeReordered = targetColVisibleIndex < visibleColumns.length - 1 && !visibleColumns[targetColVisibleIndex + 1].disableReorder;\n }\n if (forbiddenIndexes.current[targetColIndex]) {\n let nextVisibleColumnField;\n let indexWithOffset = targetColIndex + indexOffsetInHiddenColumns;\n if (hasMovedLeft) {\n nextVisibleColumnField = targetColVisibleIndex > 0 ? visibleColumns[targetColVisibleIndex - 1].field : null;\n while (indexWithOffset > 0 && allColumns[indexWithOffset].field !== nextVisibleColumnField && forbiddenIndexes.current[indexWithOffset]) {\n indexOffsetInHiddenColumns -= 1;\n indexWithOffset = targetColIndex + indexOffsetInHiddenColumns;\n }\n } else {\n nextVisibleColumnField = targetColVisibleIndex + 1 < visibleColumns.length ? visibleColumns[targetColVisibleIndex + 1].field : null;\n while (indexWithOffset < allColumns.length - 1 && allColumns[indexWithOffset].field !== nextVisibleColumnField && forbiddenIndexes.current[indexWithOffset]) {\n indexOffsetInHiddenColumns += 1;\n indexWithOffset = targetColIndex + indexOffsetInHiddenColumns;\n }\n }\n if (forbiddenIndexes.current[indexWithOffset] || allColumns[indexWithOffset].field === nextVisibleColumnField) {\n // If we ended up on a visible column, or a forbidden one, we can not do the reorder\n canBeReordered = false;\n }\n }\n const canBeReorderedProcessed = apiRef.current.unstable_applyPipeProcessors('canBeReordered', canBeReordered, {\n targetIndex: targetColVisibleIndex\n });\n if (canBeReorderedProcessed) {\n apiRef.current.setColumnIndex(dragColField, targetColIndex + indexOffsetInHiddenColumns);\n }\n }\n cursorPosition.current = coordinates;\n }\n }, [apiRef, logger, theme.direction]);\n const handleDragEnd = React.useCallback((params, event) => {\n const dragColField = gridColumnReorderDragColSelector(apiRef);\n if (props.disableColumnReorder || !dragColField) {\n return;\n }\n logger.debug('End dragging col');\n event.preventDefault();\n // Prevent drag events propagation.\n // For more information check here https://github.com/mui/mui-x/issues/2680.\n event.stopPropagation();\n clearTimeout(removeDnDStylesTimeout.current);\n dragColNode.current = null;\n\n // Check if the column was dropped outside the grid.\n if (event.dataTransfer.dropEffect === 'none' && !props.keepColumnPositionIfDraggedOutside) {\n // Accessing params.field may contain the wrong field as header elements are reused\n apiRef.current.setColumnIndex(dragColField, originColumnIndex.current);\n originColumnIndex.current = null;\n } else {\n // Emit the columnOrderChange event only once when the reordering stops.\n const columnOrderChangeParams = {\n column: apiRef.current.getColumn(dragColField),\n targetIndex: apiRef.current.getColumnIndexRelativeToVisibleColumns(dragColField),\n oldIndex: originColumnIndex.current\n };\n apiRef.current.publishEvent('columnOrderChange', columnOrderChangeParams);\n }\n apiRef.current.setState(state => _extends({}, state, {\n columnReorder: _extends({}, state.columnReorder, {\n dragCol: ''\n })\n }));\n apiRef.current.forceUpdate();\n }, [props.disableColumnReorder, props.keepColumnPositionIfDraggedOutside, logger, apiRef]);\n useGridApiEventHandler(apiRef, 'columnHeaderDragStart', handleDragStart);\n useGridApiEventHandler(apiRef, 'columnHeaderDragEnter', handleDragEnter);\n useGridApiEventHandler(apiRef, 'columnHeaderDragOver', handleDragOver);\n useGridApiEventHandler(apiRef, 'columnHeaderDragEnd', handleDragEnd);\n useGridApiEventHandler(apiRef, 'cellDragEnter', handleDragEnter);\n useGridApiEventHandler(apiRef, 'cellDragOver', handleDragOver);\n useGridApiOptionHandler(apiRef, 'columnOrderChange', props.onColumnOrderChange);\n};","'use client';\n\nimport * as React from 'react';\n\n/**\n * A version of `React.useLayoutEffect` that does not show a warning when server-side rendering.\n * This is useful for effects that are only needed for client-side rendering but not for SSR.\n *\n * Before you use this hook, make sure to read https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85\n * and confirm it doesn't apply to your use-case.\n */\nconst useEnhancedEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;\nexport default useEnhancedEffect;","'use client';\n\nimport * as React from 'react';\nimport useEnhancedEffect from '../useEnhancedEffect';\n\n/**\n * Inspired by https://github.com/facebook/react/issues/14099#issuecomment-440013892\n * See RFC in https://github.com/reactjs/rfcs/pull/220\n */\n\nfunction useEventCallback(fn) {\n const ref = React.useRef(fn);\n useEnhancedEffect(() => {\n ref.current = fn;\n });\n return React.useRef((...args) =>\n // @ts-expect-error hide `this`\n // tslint:disable-next-line:ban-comma-operator\n (0, ref.current)(...args)).current;\n}\nexport default useEventCallback;","export default function ownerDocument(node) {\n return node && node.ownerDocument || document;\n}","import { gridClasses } from '@mui/x-data-grid';\nimport { findParentElementFromClassName } from '@mui/x-data-grid/internals';\nexport function getFieldFromHeaderElem(colCellEl) {\n return colCellEl.getAttribute('data-field');\n}\nexport function findHeaderElementFromField(elem, field) {\n return elem.querySelector(`[data-field=\"${field}\"]`);\n}\nexport function findGroupHeaderElementsFromField(elem, field) {\n var _elem$querySelectorAl;\n return Array.from((_elem$querySelectorAl = elem.querySelectorAll(`[data-fields*=\"|-${field}-|\"]`)) != null ? _elem$querySelectorAl : []);\n}\nexport function findGridCellElementsFromCol(col, api) {\n var _api$virtualScrollerR, _api$virtualScrollerR2;\n const root = findParentElementFromClassName(col, gridClasses.root);\n if (!root) {\n throw new Error('MUI: The root element is not found.');\n }\n const ariaColIndex = col.getAttribute('aria-colindex');\n if (!ariaColIndex) {\n return [];\n }\n const colIndex = Number(ariaColIndex) - 1;\n const cells = [];\n if (!((_api$virtualScrollerR = api.virtualScrollerRef) != null && _api$virtualScrollerR.current)) {\n return [];\n }\n const renderedRowElements = (_api$virtualScrollerR2 = api.virtualScrollerRef) == null ? void 0 : _api$virtualScrollerR2.current.querySelectorAll(`:scope > div > div > .${gridClasses.row}` // Use > to ignore rows from nested data grids (e.g. in detail panel)\n );\n\n renderedRowElements.forEach(rowElement => {\n const rowId = rowElement.getAttribute('data-id');\n if (!rowId) {\n return;\n }\n let columnIndex = colIndex;\n const cellColSpanInfo = api.unstable_getCellColSpanInfo(rowId, colIndex);\n if (cellColSpanInfo && cellColSpanInfo.spannedByColSpan) {\n columnIndex = cellColSpanInfo.leftVisibleCellIndex;\n }\n const cell = rowElement.querySelector(`[data-colindex=\"${columnIndex}\"]`);\n if (cell) {\n cells.push(cell);\n }\n });\n return cells;\n}\nexport function findGridHeader(api, field) {\n const headers = api.columnHeadersContainerElementRef.current;\n return headers.querySelector(`:scope > div > div > [data-field=\"${field}\"][role=\"columnheader\"]`);\n}\nexport function findGridCells(api, field) {\n const container = api.virtualScrollerRef.current;\n const selectorFor = role => `:scope > div > div > div > [data-field=\"${field}\"][role=\"${role}\"]`;\n // TODO(v7): Keep only the selector for the correct role\n return Array.from(container.querySelectorAll(`${selectorFor('cell')}, ${selectorFor('gridcell')}`));\n}","export const DEFAULT_GRID_AUTOSIZE_OPTIONS = {\n includeHeaders: true,\n includeOutliers: false,\n outliersFactor: 1.5,\n expand: false\n};\n\n/**\n * The Resize API interface that is available in the grid `apiRef`.\n */","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { unstable_ownerDocument as ownerDocument, unstable_useEventCallback as useEventCallback } from '@mui/utils';\nimport { gridClasses, useGridApiEventHandler, useGridApiOptionHandler, useGridApiMethod, useGridNativeEventListener, useGridLogger, useGridSelector, gridVirtualizationColumnEnabledSelector } from '@mui/x-data-grid';\nimport { clamp, findParentElementFromClassName, gridColumnsStateSelector, useOnMount, useTimeout, createControllablePromise } from '@mui/x-data-grid/internals';\nimport { useTheme } from '@mui/material/styles';\nimport { findGridCellElementsFromCol, getFieldFromHeaderElem, findHeaderElementFromField, findGroupHeaderElementsFromField, findGridHeader, findGridCells } from '../../../utils/domUtils';\nimport { DEFAULT_GRID_AUTOSIZE_OPTIONS } from './gridColumnResizeApi';\n// TODO: remove support for Safari < 13.\n// https://caniuse.com/#search=touch-action\n//\n// Safari, on iOS, supports touch action since v13.\n// Over 80% of the iOS phones are compatible\n// in August 2020.\n// Utilizing the CSS.supports method to check if touch-action is supported.\n// Since CSS.supports is supported on all but Edge@12 and IE and touch-action\n// is supported on both Edge@12 and IE if CSS.supports is not available that means that\n// touch-action will be supported\nlet cachedSupportsTouchActionNone = false;\nfunction doesSupportTouchActionNone() {\n if (cachedSupportsTouchActionNone === undefined) {\n if (typeof CSS !== 'undefined' && typeof CSS.supports === 'function') {\n cachedSupportsTouchActionNone = CSS.supports('touch-action', 'none');\n } else {\n cachedSupportsTouchActionNone = true;\n }\n }\n return cachedSupportsTouchActionNone;\n}\nfunction trackFinger(event, currentTouchId) {\n if (currentTouchId !== undefined && event.changedTouches) {\n for (let i = 0; i < event.changedTouches.length; i += 1) {\n const touch = event.changedTouches[i];\n if (touch.identifier === currentTouchId) {\n return {\n x: touch.clientX,\n y: touch.clientY\n };\n }\n }\n return false;\n }\n return {\n x: event.clientX,\n y: event.clientY\n };\n}\nfunction computeNewWidth(initialOffsetToSeparator, clickX, columnBounds, resizeDirection) {\n let newWidth = initialOffsetToSeparator;\n if (resizeDirection === 'Right') {\n newWidth += clickX - columnBounds.left;\n } else {\n newWidth += columnBounds.right - clickX;\n }\n return newWidth;\n}\nfunction computeOffsetToSeparator(clickX, columnBounds, resizeDirection) {\n if (resizeDirection === 'Left') {\n return clickX - columnBounds.left;\n }\n return columnBounds.right - clickX;\n}\nfunction flipResizeDirection(side) {\n if (side === 'Right') {\n return 'Left';\n }\n return 'Right';\n}\nfunction getResizeDirection(element, direction) {\n const side = element.classList.contains(gridClasses['columnSeparator--sideRight']) ? 'Right' : 'Left';\n if (direction === 'rtl') {\n // Resizing logic should be mirrored in the RTL case\n return flipResizeDirection(side);\n }\n return side;\n}\nfunction preventClick(event) {\n event.preventDefault();\n event.stopImmediatePropagation();\n}\n\n/**\n * Checker that returns a promise that resolves when the column virtualization\n * is disabled.\n */\nfunction useColumnVirtualizationDisabled(apiRef) {\n const promise = React.useRef();\n const selector = () => gridVirtualizationColumnEnabledSelector(apiRef);\n const value = useGridSelector(apiRef, selector);\n React.useEffect(() => {\n if (promise.current && value === false) {\n promise.current.resolve();\n promise.current = undefined;\n }\n });\n const asyncCheck = () => {\n if (!promise.current) {\n if (selector() === false) {\n return Promise.resolve();\n }\n promise.current = createControllablePromise();\n }\n return promise.current;\n };\n return asyncCheck;\n}\n\n/**\n * Basic statistical outlier detection, checks if the value is `F * IQR` away from\n * the Q1 and Q3 boundaries. IQR: interquartile range.\n */\nfunction excludeOutliers(inputValues, factor) {\n if (inputValues.length < 4) {\n return inputValues;\n }\n const values = inputValues.slice();\n values.sort((a, b) => a - b);\n const q1 = values[Math.floor(values.length * 0.25)];\n const q3 = values[Math.floor(values.length * 0.75) - 1];\n const iqr = q3 - q1;\n\n // We make a small adjustment if `iqr < 5` for the cases where the IQR is\n // very small (e.g. zero) due to very close by values in the input data.\n // Otherwise, with an IQR of `0`, anything outside that would be considered\n // an outlier, but it makes more sense visually to allow for this 5px variance\n // rather than showing a cropped cell.\n const deviation = iqr < 5 ? 5 : iqr * factor;\n return values.filter(v => v > q1 - deviation && v < q3 + deviation);\n}\nfunction extractColumnWidths(apiRef, options, columns) {\n const widthByField = {};\n const root = apiRef.current.rootElementRef.current;\n root.classList.add(gridClasses.autosizing);\n columns.forEach(column => {\n const cells = findGridCells(apiRef.current, column.field);\n const widths = cells.map(cell => {\n var _cell$firstElementChi, _cell$firstElementChi2;\n const style = window.getComputedStyle(cell, null);\n const paddingWidth = parseInt(style.paddingLeft, 10) + parseInt(style.paddingRight, 10);\n const contentWidth = (_cell$firstElementChi = (_cell$firstElementChi2 = cell.firstElementChild) == null ? void 0 : _cell$firstElementChi2.getBoundingClientRect().width) != null ? _cell$firstElementChi : 0;\n return paddingWidth + contentWidth;\n });\n const filteredWidths = options.includeOutliers ? widths : excludeOutliers(widths, options.outliersFactor);\n if (options.includeHeaders) {\n const header = findGridHeader(apiRef.current, column.field);\n if (header) {\n const title = header.querySelector(`.${gridClasses.columnHeaderTitle}`);\n const content = header.querySelector(`.${gridClasses.columnHeaderTitleContainerContent}`);\n const element = title != null ? title : content;\n const style = window.getComputedStyle(header, null);\n const paddingWidth = parseInt(style.paddingLeft, 10) + parseInt(style.paddingRight, 10);\n const contentWidth = element.scrollWidth + 1;\n const width = paddingWidth + contentWidth;\n filteredWidths.push(width);\n }\n }\n const hasColumnMin = column.minWidth !== -Infinity && column.minWidth !== undefined;\n const hasColumnMax = column.maxWidth !== Infinity && column.maxWidth !== undefined;\n const min = hasColumnMin ? column.minWidth : 0;\n const max = hasColumnMax ? column.maxWidth : Infinity;\n const maxContent = filteredWidths.length === 0 ? 0 : Math.max(...filteredWidths);\n widthByField[column.field] = clamp(maxContent, min, max);\n });\n root.classList.remove(gridClasses.autosizing);\n return widthByField;\n}\nexport const columnResizeStateInitializer = state => _extends({}, state, {\n columnResize: {\n resizingColumnField: ''\n }\n});\n/**\n * @requires useGridColumns (method, event)\n * TODO: improve experience for last column\n */\nexport const useGridColumnResize = (apiRef, props) => {\n const logger = useGridLogger(apiRef, 'useGridColumnResize');\n const colDefRef = React.useRef();\n const colElementRef = React.useRef();\n const headerFilterElementRef = React.useRef();\n const colGroupingElementRef = React.useRef();\n const colCellElementsRef = React.useRef();\n const theme = useTheme();\n\n // To improve accessibility, the separator has padding on both sides.\n // Clicking inside the padding area should be treated as a click in the separator.\n // This ref stores the offset between the click and the separator.\n const initialOffsetToSeparator = React.useRef();\n const resizeDirection = React.useRef();\n const stopResizeEventTimeout = useTimeout();\n const touchId = React.useRef();\n const updateWidth = newWidth => {\n logger.debug(`Updating width to ${newWidth} for col ${colDefRef.current.field}`);\n const prevWidth = colElementRef.current.offsetWidth;\n const widthDiff = newWidth - prevWidth;\n colDefRef.current.computedWidth = newWidth;\n colDefRef.current.width = newWidth;\n colDefRef.current.flex = 0;\n colElementRef.current.style.width = `${newWidth}px`;\n colElementRef.current.style.minWidth = `${newWidth}px`;\n colElementRef.current.style.maxWidth = `${newWidth}px`;\n const headerFilterElement = headerFilterElementRef.current;\n if (headerFilterElement) {\n headerFilterElement.style.width = `${newWidth}px`;\n headerFilterElement.style.minWidth = `${newWidth}px`;\n headerFilterElement.style.maxWidth = `${newWidth}px`;\n }\n [...colCellElementsRef.current, ...colGroupingElementRef.current].forEach(element => {\n const div = element;\n let finalWidth;\n if (div.getAttribute('aria-colspan') === '1') {\n finalWidth = `${newWidth}px`;\n } else {\n // Cell with colspan > 1 cannot be just updated width new width.\n // Instead, we add width diff to the current width.\n finalWidth = `${div.offsetWidth + widthDiff}px`;\n }\n div.style.width = finalWidth;\n div.style.minWidth = finalWidth;\n div.style.maxWidth = finalWidth;\n });\n };\n const finishResize = nativeEvent => {\n // eslint-disable-next-line @typescript-eslint/no-use-before-define\n stopListening();\n if (colDefRef.current) {\n apiRef.current.setColumnWidth(colDefRef.current.field, colDefRef.current.width);\n logger.debug(`Updating col ${colDefRef.current.field} with new width: ${colDefRef.current.width}`);\n }\n stopResizeEventTimeout.start(0, () => {\n apiRef.current.publishEvent('columnResizeStop', null, nativeEvent);\n });\n };\n const handleResizeMouseUp = useEventCallback(finishResize);\n const handleResizeMouseMove = useEventCallback(nativeEvent => {\n // Cancel move in case some other element consumed a mouseup event and it was not fired.\n if (nativeEvent.buttons === 0) {\n handleResizeMouseUp(nativeEvent);\n return;\n }\n let newWidth = computeNewWidth(initialOffsetToSeparator.current, nativeEvent.clientX, colElementRef.current.getBoundingClientRect(), resizeDirection.current);\n newWidth = clamp(newWidth, colDefRef.current.minWidth, colDefRef.current.maxWidth);\n updateWidth(newWidth);\n const params = {\n element: colElementRef.current,\n colDef: colDefRef.current,\n width: newWidth\n };\n apiRef.current.publishEvent('columnResize', params, nativeEvent);\n });\n const handleTouchEnd = useEventCallback(nativeEvent => {\n const finger = trackFinger(nativeEvent, touchId.current);\n if (!finger) {\n return;\n }\n finishResize(nativeEvent);\n });\n const handleTouchMove = useEventCallback(nativeEvent => {\n const finger = trackFinger(nativeEvent, touchId.current);\n if (!finger) {\n return;\n }\n\n // Cancel move in case some other element consumed a touchmove event and it was not fired.\n if (nativeEvent.type === 'mousemove' && nativeEvent.buttons === 0) {\n handleTouchEnd(nativeEvent);\n return;\n }\n let newWidth = computeNewWidth(initialOffsetToSeparator.current, finger.x, colElementRef.current.getBoundingClientRect(), resizeDirection.current);\n newWidth = clamp(newWidth, colDefRef.current.minWidth, colDefRef.current.maxWidth);\n updateWidth(newWidth);\n const params = {\n element: colElementRef.current,\n colDef: colDefRef.current,\n width: newWidth\n };\n apiRef.current.publishEvent('columnResize', params, nativeEvent);\n });\n const handleTouchStart = useEventCallback(event => {\n var _apiRef$current$colum, _apiRef$current$colum2;\n const cellSeparator = findParentElementFromClassName(event.target, gridClasses['columnSeparator--resizable']);\n // Let the event bubble if the target is not a col separator\n if (!cellSeparator) {\n return;\n }\n // If touch-action: none; is not supported we need to prevent the scroll manually.\n if (!doesSupportTouchActionNone()) {\n event.preventDefault();\n }\n const touch = event.changedTouches[0];\n if (touch != null) {\n // A number that uniquely identifies the current finger in the touch session.\n touchId.current = touch.identifier;\n }\n colElementRef.current = findParentElementFromClassName(event.target, gridClasses.columnHeader);\n const field = getFieldFromHeaderElem(colElementRef.current);\n const colDef = apiRef.current.getColumn(field);\n colGroupingElementRef.current = findGroupHeaderElementsFromField((_apiRef$current$colum = apiRef.current.columnHeadersContainerElementRef) == null ? void 0 : _apiRef$current$colum.current, field);\n logger.debug(`Start Resize on col ${colDef.field}`);\n apiRef.current.publishEvent('columnResizeStart', {\n field\n }, event);\n colDefRef.current = colDef;\n colElementRef.current = findHeaderElementFromField((_apiRef$current$colum2 = apiRef.current.columnHeadersElementRef) == null ? void 0 : _apiRef$current$colum2.current, colDef.field);\n colCellElementsRef.current = findGridCellElementsFromCol(colElementRef.current, apiRef.current);\n resizeDirection.current = getResizeDirection(event.target, theme.direction);\n initialOffsetToSeparator.current = computeOffsetToSeparator(touch.clientX, colElementRef.current.getBoundingClientRect(), resizeDirection.current);\n const doc = ownerDocument(event.currentTarget);\n doc.addEventListener('touchmove', handleTouchMove);\n doc.addEventListener('touchend', handleTouchEnd);\n });\n const stopListening = React.useCallback(() => {\n const doc = ownerDocument(apiRef.current.rootElementRef.current);\n doc.body.style.removeProperty('cursor');\n doc.removeEventListener('mousemove', handleResizeMouseMove);\n doc.removeEventListener('mouseup', handleResizeMouseUp);\n doc.removeEventListener('touchmove', handleTouchMove);\n doc.removeEventListener('touchend', handleTouchEnd);\n // The click event runs right after the mouseup event, we want to wait until it\n // has been canceled before removing our handler.\n setTimeout(() => {\n doc.removeEventListener('click', preventClick, true);\n }, 100);\n if (colElementRef.current) {\n colElementRef.current.style.pointerEvents = 'unset';\n }\n }, [apiRef, colElementRef, handleResizeMouseMove, handleResizeMouseUp, handleTouchMove, handleTouchEnd]);\n const handleResizeStart = React.useCallback(({\n field\n }) => {\n apiRef.current.setState(state => _extends({}, state, {\n columnResize: _extends({}, state.columnResize, {\n resizingColumnField: field\n })\n }));\n apiRef.current.forceUpdate();\n }, [apiRef]);\n const handleResizeStop = React.useCallback(() => {\n apiRef.current.setState(state => _extends({}, state, {\n columnResize: _extends({}, state.columnResize, {\n resizingColumnField: ''\n })\n }));\n apiRef.current.forceUpdate();\n }, [apiRef]);\n const handleColumnResizeMouseDown = useEventCallback(({\n colDef\n }, event) => {\n var _apiRef$current$colum3, _apiRef$current$heade, _apiRef$current$colum4;\n // Only handle left clicks\n if (event.button !== 0) {\n return;\n }\n\n // Skip if the column isn't resizable\n if (!event.currentTarget.classList.contains(gridClasses['columnSeparator--resizable'])) {\n return;\n }\n\n // Avoid text selection\n event.preventDefault();\n logger.debug(`Start Resize on col ${colDef.field}`);\n apiRef.current.publishEvent('columnResizeStart', {\n field: colDef.field\n }, event);\n colDefRef.current = colDef;\n colElementRef.current = (_apiRef$current$colum3 = apiRef.current.columnHeadersContainerElementRef) == null ? void 0 : _apiRef$current$colum3.current.querySelector(`[data-field=\"${colDef.field}\"]`);\n const headerFilterRowElement = (_apiRef$current$heade = apiRef.current.headerFiltersElementRef) == null ? void 0 : _apiRef$current$heade.current;\n if (headerFilterRowElement) {\n headerFilterElementRef.current = headerFilterRowElement.querySelector(`[data-field=\"${colDef.field}\"]`);\n }\n colGroupingElementRef.current = findGroupHeaderElementsFromField((_apiRef$current$colum4 = apiRef.current.columnHeadersContainerElementRef) == null ? void 0 : _apiRef$current$colum4.current, colDef.field);\n colCellElementsRef.current = findGridCellElementsFromCol(colElementRef.current, apiRef.current);\n const doc = ownerDocument(apiRef.current.rootElementRef.current);\n doc.body.style.cursor = 'col-resize';\n resizeDirection.current = getResizeDirection(event.currentTarget, theme.direction);\n initialOffsetToSeparator.current = computeOffsetToSeparator(event.clientX, colElementRef.current.getBoundingClientRect(), resizeDirection.current);\n doc.addEventListener('mousemove', handleResizeMouseMove);\n doc.addEventListener('mouseup', handleResizeMouseUp);\n\n // Prevent the click event if we have resized the column.\n // Fixes https://github.com/mui/mui-x/issues/4777\n doc.addEventListener('click', preventClick, true);\n });\n const handleColumnSeparatorDoubleClick = useEventCallback((params, event) => {\n if (props.disableAutosize) {\n return;\n }\n\n // Only handle left clicks\n if (event.button !== 0) {\n return;\n }\n const column = apiRef.current.state.columns.lookup[params.field];\n if (column.resizable === false) {\n return;\n }\n apiRef.current.autosizeColumns(_extends({}, props.autosizeOptions, {\n columns: [column.field]\n }));\n });\n\n /**\n * API METHODS\n */\n\n const columnVirtualizationDisabled = useColumnVirtualizationDisabled(apiRef);\n const isAutosizingRef = React.useRef(false);\n const autosizeColumns = React.useCallback(async userOptions => {\n var _apiRef$current$rootE, _userOptions$columns;\n const root = (_apiRef$current$rootE = apiRef.current.rootElementRef) == null ? void 0 : _apiRef$current$rootE.current;\n if (!root) {\n return;\n }\n if (isAutosizingRef.current) {\n return;\n }\n isAutosizingRef.current = true;\n const state = gridColumnsStateSelector(apiRef.current.state);\n const options = _extends({}, DEFAULT_GRID_AUTOSIZE_OPTIONS, userOptions, {\n columns: (_userOptions$columns = userOptions == null ? void 0 : userOptions.columns) != null ? _userOptions$columns : state.orderedFields\n });\n options.columns = options.columns.filter(c => state.columnVisibilityModel[c] !== false);\n const columns = options.columns.map(c => apiRef.current.state.columns.lookup[c]);\n try {\n apiRef.current.unstable_setColumnVirtualization(false);\n await columnVirtualizationDisabled();\n const widthByField = extractColumnWidths(apiRef, options, columns);\n const newColumns = columns.map(column => _extends({}, column, {\n width: widthByField[column.field],\n computedWidth: widthByField[column.field]\n }));\n if (options.expand) {\n var _apiRef$current$getRo, _apiRef$current$getRo2;\n const visibleColumns = state.orderedFields.map(field => state.lookup[field]).filter(c => state.columnVisibilityModel[c.field] !== false);\n const totalWidth = visibleColumns.reduce((total, column) => {\n var _ref, _widthByField$column$;\n return total + ((_ref = (_widthByField$column$ = widthByField[column.field]) != null ? _widthByField$column$ : column.computedWidth) != null ? _ref : column.width);\n }, 0);\n const availableWidth = (_apiRef$current$getRo = (_apiRef$current$getRo2 = apiRef.current.getRootDimensions()) == null ? void 0 : _apiRef$current$getRo2.viewportInnerSize.width) != null ? _apiRef$current$getRo : 0;\n const remainingWidth = availableWidth - totalWidth;\n if (remainingWidth > 0) {\n const widthPerColumn = remainingWidth / (newColumns.length || 1);\n newColumns.forEach(column => {\n column.width += widthPerColumn;\n column.computedWidth += widthPerColumn;\n });\n }\n }\n apiRef.current.updateColumns(newColumns);\n } finally {\n apiRef.current.unstable_setColumnVirtualization(true);\n isAutosizingRef.current = false;\n }\n }, [apiRef, columnVirtualizationDisabled]);\n\n /**\n * EFFECTS\n */\n\n React.useEffect(() => stopListening, [stopListening]);\n useOnMount(() => {\n if (props.autosizeOnMount) {\n Promise.resolve().then(() => {\n apiRef.current.autosizeColumns(props.autosizeOptions);\n });\n }\n });\n useGridNativeEventListener(apiRef, () => {\n var _apiRef$current$colum5;\n return (_apiRef$current$colum5 = apiRef.current.columnHeadersElementRef) == null ? void 0 : _apiRef$current$colum5.current;\n }, 'touchstart', handleTouchStart, {\n passive: doesSupportTouchActionNone()\n });\n useGridApiMethod(apiRef, {\n autosizeColumns\n }, 'public');\n useGridApiEventHandler(apiRef, 'columnResizeStop', handleResizeStop);\n useGridApiEventHandler(apiRef, 'columnResizeStart', handleResizeStart);\n useGridApiEventHandler(apiRef, 'columnSeparatorMouseDown', handleColumnResizeMouseDown);\n useGridApiEventHandler(apiRef, 'columnSeparatorDoubleClick', handleColumnSeparatorDoubleClick);\n useGridApiOptionHandler(apiRef, 'columnResize', props.onColumnResize);\n useGridApiOptionHandler(apiRef, 'columnWidthChange', props.onColumnWidthChange);\n};","export function createControllablePromise() {\n let resolve;\n let reject;\n const promise = new Promise((_resolve, _reject) => {\n resolve = _resolve;\n reject = _reject;\n });\n promise.resolve = resolve;\n promise.reject = reject;\n return promise;\n}","import * as React from 'react';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { useGridLogger, useGridApiEventHandler, getDataGridUtilityClass, useGridSelector, gridSortModelSelector, gridRowMaximumTreeDepthSelector, useGridApiOptionHandler } from '@mui/x-data-grid';\nimport { gridEditRowsStateSelector } from '@mui/x-data-grid/internals';\nimport { GRID_REORDER_COL_DEF } from './gridRowReorderColDef';\nvar Direction = /*#__PURE__*/function (Direction) {\n Direction[Direction[\"UP\"] = 0] = \"UP\";\n Direction[Direction[\"DOWN\"] = 1] = \"DOWN\";\n return Direction;\n}(Direction || {});\nlet previousMousePosition = null;\nlet previousReorderState = {\n previousTargetId: null,\n dragDirection: null\n};\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n rowDragging: ['row--dragging']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\n/**\n * Only available in DataGridPro\n * @requires useGridRows (method)\n */\nexport const useGridRowReorder = (apiRef, props) => {\n const logger = useGridLogger(apiRef, 'useGridRowReorder');\n const sortModel = useGridSelector(apiRef, gridSortModelSelector);\n const treeDepth = useGridSelector(apiRef, gridRowMaximumTreeDepthSelector);\n const dragRowNode = React.useRef(null);\n const originRowIndex = React.useRef(null);\n const removeDnDStylesTimeout = React.useRef();\n const ownerState = {\n classes: props.classes\n };\n const classes = useUtilityClasses(ownerState);\n const [dragRowId, setDragRowId] = React.useState('');\n React.useEffect(() => {\n return () => {\n clearTimeout(removeDnDStylesTimeout.current);\n };\n }, []);\n\n // TODO: remove sortModel check once row reorder is sorting compatible\n // remove treeDepth once row reorder is tree compatible\n const isRowReorderDisabled = React.useMemo(() => {\n return !props.rowReordering || !!sortModel.length || treeDepth !== 1;\n }, [props.rowReordering, sortModel, treeDepth]);\n const handleDragStart = React.useCallback((params, event) => {\n // Call the gridEditRowsStateSelector directly to avoid infnite loop\n const editRowsState = gridEditRowsStateSelector(apiRef.current.state);\n if (isRowReorderDisabled || Object.keys(editRowsState).length !== 0) {\n return;\n }\n logger.debug(`Start dragging row ${params.id}`);\n // Prevent drag events propagation.\n // For more information check here https://github.com/mui/mui-x/issues/2680.\n event.stopPropagation();\n dragRowNode.current = event.currentTarget;\n dragRowNode.current.classList.add(classes.rowDragging);\n setDragRowId(params.id);\n removeDnDStylesTimeout.current = setTimeout(() => {\n dragRowNode.current.classList.remove(classes.rowDragging);\n });\n originRowIndex.current = apiRef.current.getRowIndexRelativeToVisibleRows(params.id);\n apiRef.current.setCellFocus(params.id, GRID_REORDER_COL_DEF.field);\n }, [isRowReorderDisabled, classes.rowDragging, logger, apiRef]);\n const handleDragOver = React.useCallback((params, event) => {\n if (dragRowId === '') {\n return;\n }\n const rowNode = apiRef.current.getRowNode(params.id);\n if (!rowNode || rowNode.type === 'footer' || rowNode.type === 'pinnedRow') {\n return;\n }\n logger.debug(`Dragging over row ${params.id}`);\n event.preventDefault();\n // Prevent drag events propagation.\n // For more information check here https://github.com/mui/mui-x/issues/2680.\n event.stopPropagation();\n const mouseMovementDiff = previousMousePosition ? previousMousePosition.y - event.clientY : event.clientY;\n if (params.id !== dragRowId) {\n const targetRowIndex = apiRef.current.getRowIndexRelativeToVisibleRows(params.id);\n const dragDirection = mouseMovementDiff > 0 ? Direction.DOWN : Direction.UP;\n const currentReorderState = {\n dragDirection,\n previousTargetId: params.id\n };\n const isStateChanged = currentReorderState.dragDirection !== previousReorderState.dragDirection || currentReorderState.previousTargetId !== previousReorderState.previousTargetId;\n if (previousReorderState.dragDirection === null || Math.abs(mouseMovementDiff) >= 1 && isStateChanged) {\n apiRef.current.setRowIndex(dragRowId, targetRowIndex);\n previousReorderState = currentReorderState;\n }\n }\n previousMousePosition = {\n x: event.clientX,\n y: event.clientY\n };\n }, [apiRef, logger, dragRowId]);\n const handleDragEnd = React.useCallback((params, event) => {\n // Call the gridEditRowsStateSelector directly to avoid infnite loop\n const editRowsState = gridEditRowsStateSelector(apiRef.current.state);\n if (dragRowId === '' || isRowReorderDisabled || Object.keys(editRowsState).length !== 0) {\n return;\n }\n logger.debug('End dragging row');\n event.preventDefault();\n // Prevent drag events propagation.\n // For more information check here https://github.com/mui/mui-x/issues/2680.\n event.stopPropagation();\n clearTimeout(removeDnDStylesTimeout.current);\n dragRowNode.current = null;\n previousReorderState.dragDirection = null;\n\n // Check if the row was dropped outside the grid.\n if (event.dataTransfer.dropEffect === 'none') {\n // Accessing params.field may contain the wrong field as header elements are reused\n apiRef.current.setRowIndex(dragRowId, originRowIndex.current);\n originRowIndex.current = null;\n } else {\n // Emit the rowOrderChange event only once when the reordering stops.\n const rowOrderChangeParams = {\n row: apiRef.current.getRow(dragRowId),\n targetIndex: apiRef.current.getRowIndexRelativeToVisibleRows(params.id),\n oldIndex: originRowIndex.current\n };\n apiRef.current.publishEvent('rowOrderChange', rowOrderChangeParams);\n }\n setDragRowId('');\n }, [isRowReorderDisabled, logger, apiRef, dragRowId]);\n useGridApiEventHandler(apiRef, 'rowDragStart', handleDragStart);\n useGridApiEventHandler(apiRef, 'rowDragOver', handleDragOver);\n useGridApiEventHandler(apiRef, 'rowDragEnd', handleDragEnd);\n useGridApiEventHandler(apiRef, 'cellDragOver', handleDragOver);\n useGridApiOptionHandler(apiRef, 'rowOrderChange', props.onRowOrderChange);\n};","import * as React from 'react';\nimport { useGridApiEventHandler, useGridSelector, gridSortModelSelector, gridFilterModelSelector, useGridApiOptionHandler } from '@mui/x-data-grid';\nimport { useGridVisibleRows, getRenderableIndexes } from '@mui/x-data-grid/internals';\nfunction findSkeletonRowsSection({\n apiRef,\n visibleRows,\n range\n}) {\n let {\n firstRowIndex,\n lastRowIndex\n } = range;\n const visibleRowsSection = visibleRows.slice(range.firstRowIndex, range.lastRowIndex);\n let startIndex = 0;\n let endIndex = visibleRowsSection.length - 1;\n let isSkeletonSectionFound = false;\n while (!isSkeletonSectionFound && firstRowIndex < lastRowIndex) {\n var _apiRef$current$getRo, _apiRef$current$getRo2;\n const isStartingWithASkeletonRow = ((_apiRef$current$getRo = apiRef.current.getRowNode(visibleRowsSection[startIndex].id)) == null ? void 0 : _apiRef$current$getRo.type) === 'skeletonRow';\n const isEndingWithASkeletonRow = ((_apiRef$current$getRo2 = apiRef.current.getRowNode(visibleRowsSection[endIndex].id)) == null ? void 0 : _apiRef$current$getRo2.type) === 'skeletonRow';\n if (isStartingWithASkeletonRow && isEndingWithASkeletonRow) {\n isSkeletonSectionFound = true;\n }\n if (!isStartingWithASkeletonRow) {\n startIndex += 1;\n firstRowIndex += 1;\n }\n if (!isEndingWithASkeletonRow) {\n endIndex -= 1;\n lastRowIndex -= 1;\n }\n }\n return isSkeletonSectionFound ? {\n firstRowIndex,\n lastRowIndex\n } : undefined;\n}\nfunction isLazyLoadingDisabled({\n lazyLoadingFeatureFlag,\n rowsLoadingMode,\n gridDimensions\n}) {\n if (!lazyLoadingFeatureFlag || !gridDimensions) {\n return true;\n }\n if (rowsLoadingMode !== 'server') {\n return true;\n }\n return false;\n}\n\n/**\n * @requires useGridRows (state)\n * @requires useGridPagination (state)\n * @requires useGridDimensions (method) - can be after\n * @requires useGridScroll (method\n */\nexport const useGridLazyLoader = (privateApiRef, props) => {\n var _props$experimentalFe;\n const visibleRows = useGridVisibleRows(privateApiRef, props);\n const sortModel = useGridSelector(privateApiRef, gridSortModelSelector);\n const filterModel = useGridSelector(privateApiRef, gridFilterModelSelector);\n const renderedRowsIntervalCache = React.useRef({\n firstRowToRender: 0,\n lastRowToRender: 0\n });\n const {\n lazyLoading\n } = (_props$experimentalFe = props.experimentalFeatures) != null ? _props$experimentalFe : {};\n const getCurrentIntervalToRender = React.useCallback(() => {\n const currentRenderContext = privateApiRef.current.getRenderContext();\n const [firstRowToRender, lastRowToRender] = getRenderableIndexes({\n firstIndex: currentRenderContext.firstRowIndex,\n lastIndex: currentRenderContext.lastRowIndex,\n minFirstIndex: 0,\n maxLastIndex: visibleRows.rows.length,\n buffer: props.rowBuffer\n });\n return {\n firstRowToRender,\n lastRowToRender\n };\n }, [privateApiRef, props.rowBuffer, visibleRows.rows.length]);\n const handleRenderedRowsIntervalChange = React.useCallback(params => {\n const dimensions = privateApiRef.current.getRootDimensions();\n if (isLazyLoadingDisabled({\n lazyLoadingFeatureFlag: lazyLoading,\n rowsLoadingMode: props.rowsLoadingMode,\n gridDimensions: dimensions\n })) {\n return;\n }\n const fetchRowsParams = {\n firstRowToRender: params.firstRowToRender,\n lastRowToRender: params.lastRowToRender,\n sortModel,\n filterModel\n };\n if (renderedRowsIntervalCache.current.firstRowToRender === params.firstRowToRender && renderedRowsIntervalCache.current.lastRowToRender === params.lastRowToRender) {\n return;\n }\n if (sortModel.length === 0 && filterModel.items.length === 0) {\n const skeletonRowsSection = findSkeletonRowsSection({\n apiRef: privateApiRef,\n visibleRows: visibleRows.rows,\n range: {\n firstRowIndex: params.firstRowToRender,\n lastRowIndex: params.lastRowToRender\n }\n });\n if (!skeletonRowsSection) {\n return;\n }\n fetchRowsParams.firstRowToRender = skeletonRowsSection.firstRowIndex;\n fetchRowsParams.lastRowToRender = skeletonRowsSection.lastRowIndex;\n }\n renderedRowsIntervalCache.current = params;\n privateApiRef.current.publishEvent('fetchRows', fetchRowsParams);\n }, [privateApiRef, props.rowsLoadingMode, sortModel, filterModel, visibleRows.rows, lazyLoading]);\n const handleGridSortModelChange = React.useCallback(newSortModel => {\n const dimensions = privateApiRef.current.getRootDimensions();\n if (isLazyLoadingDisabled({\n lazyLoadingFeatureFlag: lazyLoading,\n rowsLoadingMode: props.rowsLoadingMode,\n gridDimensions: dimensions\n })) {\n return;\n }\n privateApiRef.current.requestPipeProcessorsApplication('hydrateRows');\n const {\n firstRowToRender,\n lastRowToRender\n } = getCurrentIntervalToRender();\n const fetchRowsParams = {\n firstRowToRender,\n lastRowToRender,\n sortModel: newSortModel,\n filterModel\n };\n privateApiRef.current.publishEvent('fetchRows', fetchRowsParams);\n }, [privateApiRef, props.rowsLoadingMode, filterModel, lazyLoading, getCurrentIntervalToRender]);\n const handleGridFilterModelChange = React.useCallback(newFilterModel => {\n const dimensions = privateApiRef.current.getRootDimensions();\n if (isLazyLoadingDisabled({\n lazyLoadingFeatureFlag: lazyLoading,\n rowsLoadingMode: props.rowsLoadingMode,\n gridDimensions: dimensions\n })) {\n return;\n }\n privateApiRef.current.requestPipeProcessorsApplication('hydrateRows');\n const {\n firstRowToRender,\n lastRowToRender\n } = getCurrentIntervalToRender();\n const fetchRowsParams = {\n firstRowToRender,\n lastRowToRender,\n sortModel,\n filterModel: newFilterModel\n };\n privateApiRef.current.publishEvent('fetchRows', fetchRowsParams);\n }, [privateApiRef, props.rowsLoadingMode, sortModel, lazyLoading, getCurrentIntervalToRender]);\n useGridApiEventHandler(privateApiRef, 'renderedRowsIntervalChange', handleRenderedRowsIntervalChange);\n useGridApiEventHandler(privateApiRef, 'sortModelChange', handleGridSortModelChange);\n useGridApiEventHandler(privateApiRef, 'filterModelChange', handleGridFilterModelChange);\n useGridApiOptionHandler(privateApiRef, 'fetchRows', props.onFetchRows);\n};","import { createSelector } from '@mui/x-data-grid-pro/internals';\nexport const gridAggregationStateSelector = state => state.aggregation;\n\n/**\n * Get the aggregation model, containing the aggregation function of each column.\n * If a column is not in the model, it is not aggregated.\n * @category Aggregation\n */\nexport const gridAggregationModelSelector = createSelector(gridAggregationStateSelector, aggregationState => aggregationState.model);\n\n/**\n * Get the aggregation results as a lookup.\n * @category Aggregation\n */\nexport const gridAggregationLookupSelector = createSelector(gridAggregationStateSelector, aggregationState => aggregationState.lookup);","import _formatMuiErrorMessage from \"../formatMuiErrorMessage\";\n// It should to be noted that this function isn't equivalent to `text-transform: capitalize`.\n//\n// A strict capitalization should uppercase the first letter of each word in the sentence.\n// We only handle the first word.\nexport default function capitalize(string) {\n if (typeof string !== 'string') {\n throw new Error(process.env.NODE_ENV !== \"production\" ? `MUI: \\`capitalize(string)\\` expects a string argument.` : _formatMuiErrorMessage(7));\n }\n return string.charAt(0).toUpperCase() + string.slice(1);\n}","/**\n * WARNING: Don't import this directly.\n * Use `MuiError` from `@mui/utils/macros/MuiError.macro` instead.\n * @param {number} code\n */\nexport default function formatMuiErrorMessage(code) {\n // Apply babel-plugin-transform-template-literals in loose mode\n // loose mode is safe iff we're concatenating primitives\n // see https://babeljs.io/docs/en/babel-plugin-transform-template-literals#loose\n /* eslint-disable prefer-template */\n let url = 'https://mui.com/production-error/?code=' + code;\n for (let i = 1; i < arguments.length; i += 1) {\n // rest params over-transpile for this case\n // eslint-disable-next-line prefer-rest-params\n url += '&args[]=' + encodeURIComponent(arguments[i]);\n }\n return 'Minified MUI error #' + code + '; visit ' + url + ' for the full message.';\n /* eslint-enable prefer-template */\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { unstable_capitalize as capitalize } from '@mui/utils';\nimport { GRID_ID_AUTOGENERATED } from '@mui/x-data-grid/internals';\nimport { GRID_ROOT_GROUP_ID } from '@mui/x-data-grid-pro';\nimport { addPinnedRow, isDeepEqual, insertNodeInTree, removeNodeFromTree } from '@mui/x-data-grid-pro/internals';\nexport const GRID_AGGREGATION_ROOT_FOOTER_ROW_ID = 'auto-generated-group-footer-root';\nexport const getAggregationFooterRowIdFromGroupId = groupId => {\n if (groupId == null) {\n return GRID_AGGREGATION_ROOT_FOOTER_ROW_ID;\n }\n return `auto-generated-group-footer-${groupId}`;\n};\nexport const canColumnHaveAggregationFunction = ({\n colDef,\n aggregationFunctionName,\n aggregationFunction\n}) => {\n if (!colDef || !colDef.aggregable) {\n return false;\n }\n if (!aggregationFunction) {\n return false;\n }\n if (colDef.availableAggregationFunctions != null) {\n return colDef.availableAggregationFunctions.includes(aggregationFunctionName);\n }\n if (!aggregationFunction.columnTypes) {\n return true;\n }\n return aggregationFunction.columnTypes.includes(colDef.type);\n};\nexport const getAvailableAggregationFunctions = ({\n aggregationFunctions,\n colDef\n}) => Object.keys(aggregationFunctions).filter(aggregationFunctionName => canColumnHaveAggregationFunction({\n colDef,\n aggregationFunctionName,\n aggregationFunction: aggregationFunctions[aggregationFunctionName]\n}));\nexport const mergeStateWithAggregationModel = aggregationModel => state => _extends({}, state, {\n aggregation: _extends({}, state.aggregation, {\n model: aggregationModel\n })\n});\nexport const getAggregationRules = ({\n columnsLookup,\n aggregationModel,\n aggregationFunctions\n}) => {\n const aggregationRules = {};\n Object.entries(aggregationModel).forEach(([field, columnItem]) => {\n if (columnsLookup[field] && canColumnHaveAggregationFunction({\n colDef: columnsLookup[field],\n aggregationFunctionName: columnItem,\n aggregationFunction: aggregationFunctions[columnItem]\n })) {\n aggregationRules[field] = {\n aggregationFunctionName: columnItem,\n aggregationFunction: aggregationFunctions[columnItem]\n };\n }\n });\n return aggregationRules;\n};\n/**\n * Add a footer for each group that has at least one column with an aggregated value.\n */\nexport const addFooterRows = ({\n groupingParams,\n apiRef,\n getAggregationPosition,\n hasAggregationRule\n}) => {\n let newGroupingParams = _extends({}, groupingParams, {\n tree: _extends({}, groupingParams.tree),\n treeDepths: _extends({}, groupingParams.treeDepths)\n });\n const updateChildGroupFooter = groupNode => {\n const shouldHaveFooter = hasAggregationRule && getAggregationPosition(groupNode) === 'footer';\n if (shouldHaveFooter) {\n const footerId = getAggregationFooterRowIdFromGroupId(groupNode.id);\n if (groupNode.footerId !== footerId) {\n if (groupNode.footerId != null) {\n removeNodeFromTree({\n node: newGroupingParams.tree[groupNode.footerId],\n tree: newGroupingParams.tree,\n treeDepths: newGroupingParams.treeDepths\n });\n }\n const footerNode = {\n id: footerId,\n parent: groupNode.id,\n depth: groupNode ? groupNode.depth + 1 : 0,\n type: 'footer'\n };\n insertNodeInTree(footerNode, newGroupingParams.tree, newGroupingParams.treeDepths, null);\n }\n } else if (groupNode.footerId != null) {\n removeNodeFromTree({\n node: newGroupingParams.tree[groupNode.footerId],\n tree: newGroupingParams.tree,\n treeDepths: newGroupingParams.treeDepths\n });\n newGroupingParams.tree[groupNode.id] = _extends({}, newGroupingParams.tree[groupNode.id], {\n footerId: null\n });\n }\n };\n const updateRootGroupFooter = groupNode => {\n const shouldHaveFooter = hasAggregationRule && getAggregationPosition(groupNode) === 'footer';\n if (shouldHaveFooter) {\n const rowId = getAggregationFooterRowIdFromGroupId(null);\n newGroupingParams = addPinnedRow({\n groupingParams: newGroupingParams,\n rowModel: {\n [GRID_ID_AUTOGENERATED]: rowId\n },\n rowId,\n position: 'bottom',\n apiRef,\n isAutoGenerated: true\n });\n }\n };\n const updateGroupFooter = groupNode => {\n if (groupNode.id === GRID_ROOT_GROUP_ID) {\n updateRootGroupFooter(groupNode);\n } else {\n updateChildGroupFooter(groupNode);\n }\n groupNode.children.forEach(childId => {\n const childNode = newGroupingParams.tree[childId];\n if (childNode.type === 'group') {\n updateGroupFooter(childNode);\n }\n });\n };\n updateGroupFooter(newGroupingParams.tree[GRID_ROOT_GROUP_ID]);\n return newGroupingParams;\n};\n\n/**\n * Compares two sets of aggregation rules to determine if they are equal or not.\n */\nexport const areAggregationRulesEqual = (previousValue, newValue) => {\n const previousFields = Object.keys(previousValue != null ? previousValue : {});\n const newFields = Object.keys(newValue);\n if (!isDeepEqual(previousFields, newFields)) {\n return false;\n }\n return newFields.every(field => {\n const previousRule = previousValue == null ? void 0 : previousValue[field];\n const newRule = newValue[field];\n if ((previousRule == null ? void 0 : previousRule.aggregationFunction) !== (newRule == null ? void 0 : newRule.aggregationFunction)) {\n return false;\n }\n if ((previousRule == null ? void 0 : previousRule.aggregationFunctionName) !== (newRule == null ? void 0 : newRule.aggregationFunctionName)) {\n return false;\n }\n return true;\n });\n};\nexport const getAggregationFunctionLabel = ({\n apiRef,\n aggregationRule\n}) => {\n if (aggregationRule.aggregationFunction.label != null) {\n return aggregationRule.aggregationFunction.label;\n }\n try {\n return apiRef.current.getLocaleText(`aggregationFunctionLabel${capitalize(aggregationRule.aggregationFunctionName)}`);\n } catch (e) {\n return aggregationRule.aggregationFunctionName;\n }\n};","import { gridColumnLookupSelector, gridFilteredRowsLookupSelector, gridRowTreeSelector, GRID_ROOT_GROUP_ID } from '@mui/x-data-grid-pro';\nimport { getAggregationRules } from './gridAggregationUtils';\nimport { gridAggregationModelSelector } from './gridAggregationSelectors';\nconst getAggregationCellValue = ({\n apiRef,\n groupId,\n field,\n aggregationFunction,\n aggregationRowsScope\n}) => {\n const filteredRowsLookup = gridFilteredRowsLookupSelector(apiRef);\n const rowIds = apiRef.current.getRowGroupChildren({\n groupId\n });\n const values = [];\n rowIds.forEach(rowId => {\n if (aggregationRowsScope === 'filtered' && filteredRowsLookup[rowId] === false) {\n return;\n }\n\n // If the row is a group, we want to aggregate based on its children\n // For instance in the following tree, we want the aggregated values of A to be based on A.A, A.B.A and A.B.B but not A.B\n // A\n // A.A\n // A.B\n // A.B.A\n // A.B.B\n const rowNode = apiRef.current.getRowNode(rowId);\n if (rowNode.type === 'group') {\n return;\n }\n if (typeof aggregationFunction.getCellValue === 'function') {\n const row = apiRef.current.getRow(rowId);\n values.push(aggregationFunction.getCellValue({\n row\n }));\n } else {\n values.push(apiRef.current.getCellValue(rowId, field));\n }\n });\n return aggregationFunction.apply({\n values,\n groupId,\n field // Added per user request in https://github.com/mui/mui-x/issues/6995#issuecomment-1327423455\n });\n};\n\nconst getGroupAggregatedValue = ({\n groupId,\n apiRef,\n aggregationRowsScope,\n aggregatedFields,\n aggregationRules,\n position\n}) => {\n const groupAggregationLookup = {};\n for (let j = 0; j < aggregatedFields.length; j += 1) {\n const aggregatedField = aggregatedFields[j];\n const columnAggregationRules = aggregationRules[aggregatedField];\n groupAggregationLookup[aggregatedField] = {\n position,\n value: getAggregationCellValue({\n apiRef,\n groupId,\n field: aggregatedField,\n aggregationFunction: columnAggregationRules.aggregationFunction,\n aggregationRowsScope\n })\n };\n }\n return groupAggregationLookup;\n};\nexport const createAggregationLookup = ({\n apiRef,\n aggregationFunctions,\n aggregationRowsScope,\n getAggregationPosition\n}) => {\n const aggregationRules = getAggregationRules({\n columnsLookup: gridColumnLookupSelector(apiRef),\n aggregationModel: gridAggregationModelSelector(apiRef),\n aggregationFunctions\n });\n const aggregatedFields = Object.keys(aggregationRules);\n if (aggregatedFields.length === 0) {\n return {};\n }\n const aggregationLookup = {};\n const rowTree = gridRowTreeSelector(apiRef);\n const createGroupAggregationLookup = groupNode => {\n for (let i = 0; i < groupNode.children.length; i += 1) {\n const childId = groupNode.children[i];\n const childNode = rowTree[childId];\n if (childNode.type === 'group') {\n createGroupAggregationLookup(childNode);\n }\n }\n const hasAggregableChildren = groupNode.children.length;\n if (hasAggregableChildren) {\n const position = getAggregationPosition(groupNode);\n if (position != null) {\n aggregationLookup[groupNode.id] = getGroupAggregatedValue({\n groupId: groupNode.id,\n apiRef,\n aggregatedFields,\n aggregationRowsScope,\n aggregationRules,\n position\n });\n }\n }\n };\n createGroupAggregationLookup(rowTree[GRID_ROOT_GROUP_ID]);\n return aggregationLookup;\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { gridColumnLookupSelector, useGridApiEventHandler, useGridApiMethod } from '@mui/x-data-grid-pro';\nimport { gridAggregationModelSelector } from './gridAggregationSelectors';\nimport { getAggregationRules, mergeStateWithAggregationModel, areAggregationRulesEqual } from './gridAggregationUtils';\nimport { createAggregationLookup } from './createAggregationLookup';\nexport const aggregationStateInitializer = (state, props, apiRef) => {\n var _ref, _props$aggregationMod, _props$initialState;\n apiRef.current.caches.aggregation = {\n rulesOnLastColumnHydration: {},\n rulesOnLastRowHydration: {}\n };\n return _extends({}, state, {\n aggregation: {\n model: (_ref = (_props$aggregationMod = props.aggregationModel) != null ? _props$aggregationMod : (_props$initialState = props.initialState) == null || (_props$initialState = _props$initialState.aggregation) == null ? void 0 : _props$initialState.model) != null ? _ref : {}\n }\n });\n};\nexport const useGridAggregation = (apiRef, props) => {\n apiRef.current.registerControlState({\n stateId: 'aggregation',\n propModel: props.aggregationModel,\n propOnChange: props.onAggregationModelChange,\n stateSelector: gridAggregationModelSelector,\n changeEvent: 'aggregationModelChange'\n });\n\n /**\n * API METHODS\n */\n const setAggregationModel = React.useCallback(model => {\n const currentModel = gridAggregationModelSelector(apiRef);\n if (currentModel !== model) {\n apiRef.current.setState(mergeStateWithAggregationModel(model));\n apiRef.current.forceUpdate();\n }\n }, [apiRef]);\n const applyAggregation = React.useCallback(() => {\n const aggregationLookup = createAggregationLookup({\n apiRef,\n getAggregationPosition: props.getAggregationPosition,\n aggregationFunctions: props.aggregationFunctions,\n aggregationRowsScope: props.aggregationRowsScope\n });\n apiRef.current.setState(state => _extends({}, state, {\n aggregation: _extends({}, state.aggregation, {\n lookup: aggregationLookup\n })\n }));\n }, [apiRef, props.getAggregationPosition, props.aggregationFunctions, props.aggregationRowsScope]);\n const aggregationApi = {\n setAggregationModel\n };\n useGridApiMethod(apiRef, aggregationApi, 'public');\n\n /**\n * EVENTS\n */\n const checkAggregationRulesDiff = React.useCallback(() => {\n const {\n rulesOnLastRowHydration,\n rulesOnLastColumnHydration\n } = apiRef.current.caches.aggregation;\n const aggregationRules = props.disableAggregation ? {} : getAggregationRules({\n columnsLookup: gridColumnLookupSelector(apiRef),\n aggregationModel: gridAggregationModelSelector(apiRef),\n aggregationFunctions: props.aggregationFunctions\n });\n\n // Re-apply the row hydration to add / remove the aggregation footers\n if (!areAggregationRulesEqual(rulesOnLastRowHydration, aggregationRules)) {\n apiRef.current.requestPipeProcessorsApplication('hydrateRows');\n applyAggregation();\n }\n\n // Re-apply the column hydration to wrap / unwrap the aggregated columns\n if (!areAggregationRulesEqual(rulesOnLastColumnHydration, aggregationRules)) {\n apiRef.current.caches.aggregation.rulesOnLastColumnHydration = aggregationRules;\n apiRef.current.requestPipeProcessorsApplication('hydrateColumns');\n }\n }, [apiRef, applyAggregation, props.aggregationFunctions, props.disableAggregation]);\n useGridApiEventHandler(apiRef, 'aggregationModelChange', checkAggregationRulesDiff);\n useGridApiEventHandler(apiRef, 'columnsChange', checkAggregationRulesDiff);\n useGridApiEventHandler(apiRef, 'filteredRowsSet', applyAggregation);\n\n /**\n * EFFECTS\n */\n React.useEffect(() => {\n if (props.aggregationModel !== undefined) {\n apiRef.current.setAggregationModel(props.aggregationModel);\n }\n }, [apiRef, props.aggregationModel]);\n};","export default function _objectWithoutPropertiesLoose(source, excluded) {\n if (source == null) return {};\n var target = {};\n var sourceKeys = Object.keys(source);\n var key, i;\n for (i = 0; i < sourceKeys.length; i++) {\n key = sourceKeys[i];\n if (excluded.indexOf(key) >= 0) continue;\n target[key] = source[key];\n }\n return target;\n}","export default function composeClasses(slots, getUtilityClass, classes = undefined) {\n const output = {};\n Object.keys(slots).forEach(\n // `Object.keys(slots)` can't be wider than `T` because we infer `T` from `slots`.\n // @ts-expect-error https://github.com/microsoft/TypeScript/pull/12253#issuecomment-263132208\n slot => {\n output[slot] = slots[slot].reduce((acc, key) => {\n if (key) {\n const utilityClass = getUtilityClass(key);\n if (utilityClass !== '') {\n acc.push(utilityClass);\n }\n if (classes && classes[key]) {\n acc.push(classes[key]);\n }\n }\n return acc;\n }, []).join(' ');\n });\n return output;\n}","import { useGridRootProps as useCommunityGridRootProps } from '@mui/x-data-grid-pro';\nexport const useGridRootProps = useCommunityGridRootProps;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"formattedValue\", \"colDef\", \"cellMode\", \"row\", \"api\", \"id\", \"value\", \"rowNode\", \"field\", \"focusElementRef\", \"hasFocus\", \"tabIndex\", \"isEditable\"];\nimport * as React from 'react';\nimport { getDataGridUtilityClass } from '@mui/x-data-grid';\nimport { styled } from '@mui/material/styles';\nimport Box from '@mui/material/Box';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst GridFooterCellRoot = styled(Box, {\n name: 'MuiDataGrid',\n slot: 'FooterCell',\n overridesResolver: (_, styles) => styles.footerCell\n})(({\n theme\n}) => ({\n fontWeight: theme.typography.fontWeightMedium,\n color: (theme.vars || theme).palette.primary.dark\n}));\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['footerCell']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nfunction GridFooterCell(props) {\n const {\n formattedValue\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const rootProps = useGridRootProps();\n const ownerState = rootProps;\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(GridFooterCellRoot, _extends({\n ownerState: ownerState,\n className: classes.root\n }, other, {\n children: formattedValue\n }));\n}\nexport { GridFooterCell };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"renderHeader\"];\nimport * as React from 'react';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport Box from '@mui/material/Box';\nimport { styled } from '@mui/material/styles';\nimport { getDataGridUtilityClass, gridClasses, GridColumnHeaderTitle } from '@mui/x-data-grid';\nimport { getAggregationFunctionLabel } from '../hooks/features/aggregation/gridAggregationUtils';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst GridAggregationHeaderRoot = styled(Box, {\n name: 'MuiDataGrid',\n slot: 'AggregationColumnHeader',\n overridesResolver: (_, styles) => styles.aggregationColumnHeader\n})({\n display: 'flex',\n flexDirection: 'column',\n [`&.${gridClasses['aggregationColumnHeader--alignRight']}`]: {\n alignItems: 'flex-end'\n },\n [`&.${gridClasses['aggregationColumnHeader--alignCenter']}`]: {\n alignItems: 'center'\n }\n});\nconst GridAggregationFunctionLabel = styled('div', {\n name: 'MuiDataGrid',\n slot: 'AggregationColumnHeaderLabel',\n overridesResolver: (_, styles) => styles.aggregationColumnHeaderLabel\n})(({\n theme\n}) => {\n return {\n fontSize: theme.typography.caption.fontSize,\n lineHeight: theme.typography.caption.fontSize,\n position: 'absolute',\n bottom: 4,\n fontWeight: theme.typography.fontWeightMedium,\n color: (theme.vars || theme).palette.primary.dark,\n textTransform: 'uppercase'\n };\n});\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n colDef\n } = ownerState;\n const slots = {\n root: ['aggregationColumnHeader', colDef.headerAlign === 'left' && 'aggregationColumnHeader--alignLeft', colDef.headerAlign === 'center' && 'aggregationColumnHeader--alignCenter', colDef.headerAlign === 'right' && 'aggregationColumnHeader--alignRight'],\n aggregationLabel: ['aggregationColumnHeaderLabel']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nfunction GridAggregationHeader(props) {\n var _colDef$headerName;\n const {\n renderHeader\n } = props,\n params = _objectWithoutPropertiesLoose(props, _excluded);\n const {\n colDef,\n aggregation\n } = params;\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const ownerState = _extends({}, rootProps, {\n classes: rootProps.classes,\n colDef\n });\n const classes = useUtilityClasses(ownerState);\n if (!aggregation) {\n return null;\n }\n const aggregationLabel = getAggregationFunctionLabel({\n apiRef,\n aggregationRule: aggregation.aggregationRule\n });\n return /*#__PURE__*/_jsxs(GridAggregationHeaderRoot, {\n ownerState: ownerState,\n className: classes.root,\n children: [renderHeader ? renderHeader(params) : /*#__PURE__*/_jsx(GridColumnHeaderTitle, {\n label: (_colDef$headerName = colDef.headerName) != null ? _colDef$headerName : colDef.field,\n description: colDef.description,\n columnWidth: colDef.computedWidth\n }), /*#__PURE__*/_jsx(GridAggregationFunctionLabel, {\n ownerState: ownerState,\n className: classes.aggregationLabel,\n children: aggregationLabel\n })]\n });\n}\nexport { GridAggregationHeader };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { tagInternalFilter } from '@mui/x-data-grid-pro/internals';\nimport { gridAggregationLookupSelector } from './gridAggregationSelectors';\nimport { GridFooterCell } from '../../../components/GridFooterCell';\nimport { GridAggregationHeader } from '../../../components/GridAggregationHeader';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst AGGREGATION_WRAPPABLE_PROPERTIES = ['valueGetter', 'valueFormatter', 'renderCell', 'renderHeader', 'filterOperators'];\nconst getAggregationValueWrappedValueGetter = ({\n value: valueGetter,\n getCellAggregationResult\n}) => {\n const wrappedValueGetter = params => {\n const cellAggregationResult = getCellAggregationResult(params.id, params.field);\n if (cellAggregationResult != null) {\n var _cellAggregationResul;\n return (_cellAggregationResul = cellAggregationResult == null ? void 0 : cellAggregationResult.value) != null ? _cellAggregationResul : null;\n }\n if (valueGetter) {\n return valueGetter(params);\n }\n return params.row[params.field];\n };\n return wrappedValueGetter;\n};\nconst getAggregationValueWrappedValueFormatter = ({\n value: valueFormatter,\n aggregationRule,\n getCellAggregationResult\n}) => {\n // If neither the inline aggregation function nor the footer aggregation function have a custom value formatter,\n // Then we don't wrap the column value formatter\n if (!aggregationRule.aggregationFunction.valueFormatter) {\n return valueFormatter;\n }\n const wrappedValueFormatter = params => {\n if (params.id != null) {\n const cellAggregationResult = getCellAggregationResult(params.id, params.field);\n if (cellAggregationResult != null) {\n return aggregationRule.aggregationFunction.valueFormatter(params);\n }\n }\n if (valueFormatter) {\n return valueFormatter(params);\n }\n return params.value;\n };\n return wrappedValueFormatter;\n};\nconst getAggregationValueWrappedRenderCell = ({\n value: renderCell,\n aggregationRule,\n getCellAggregationResult\n}) => {\n const wrappedRenderCell = params => {\n const cellAggregationResult = getCellAggregationResult(params.id, params.field);\n if (cellAggregationResult != null) {\n var _aggregationFunction$;\n if (!renderCell) {\n if (cellAggregationResult.position === 'footer') {\n return /*#__PURE__*/_jsx(GridFooterCell, _extends({}, params));\n }\n return params.formattedValue;\n }\n const aggregationMeta = {\n hasCellUnit: (_aggregationFunction$ = aggregationRule.aggregationFunction.hasCellUnit) != null ? _aggregationFunction$ : true,\n aggregationFunctionName: aggregationRule.aggregationFunctionName\n };\n return renderCell(_extends({}, params, {\n aggregation: aggregationMeta\n }));\n }\n if (!renderCell) {\n return params.formattedValue;\n }\n return renderCell(params);\n };\n return wrappedRenderCell;\n};\n\n/**\n * Skips the filtering for aggregated rows\n */\nconst getWrappedFilterOperators = ({\n value: filterOperators,\n apiRef,\n getCellAggregationResult\n}) => filterOperators.map(operator => {\n const baseGetApplyFilterFn = operator.getApplyFilterFn;\n const baseGetApplyFilterFnV7 = operator.getApplyFilterFnV7;\n const getApplyFilterFn = tagInternalFilter((filterItem, colDef) => {\n const filterFn = baseGetApplyFilterFn(filterItem, colDef);\n if (!filterFn) {\n return null;\n }\n return params => {\n if (getCellAggregationResult(params.id, params.field) != null) {\n return true;\n }\n return filterFn(params);\n };\n });\n const getApplyFilterFnV7 = baseGetApplyFilterFnV7 === undefined ? undefined : tagInternalFilter((filterItem, colDef) => {\n const filterFn = baseGetApplyFilterFnV7(filterItem, colDef);\n if (!filterFn) {\n return null;\n }\n return (value, row, column, api) => {\n if (getCellAggregationResult(apiRef.current.getRowId(row), column.field) != null) {\n return true;\n }\n return filterFn(value, row, column, api);\n };\n });\n return _extends({}, operator, {\n getApplyFilterFn,\n getApplyFilterFnV7\n });\n});\n\n/**\n * Add the aggregation method around the header name\n */\nconst getWrappedRenderHeader = ({\n value: renderHeader,\n aggregationRule\n}) => {\n const wrappedRenderHeader = params => {\n return /*#__PURE__*/_jsx(GridAggregationHeader, _extends({}, params, {\n aggregation: {\n aggregationRule\n },\n renderHeader: renderHeader\n }));\n };\n return wrappedRenderHeader;\n};\n\n/**\n * Add a wrapper around each wrappable property of the column to customize the behavior of the aggregation cells.\n */\nexport const wrapColumnWithAggregationValue = ({\n column,\n apiRef,\n aggregationRule\n}) => {\n const getCellAggregationResult = (id, field) => {\n var _rowNode$parent, _gridAggregationLooku;\n let cellAggregationPosition = null;\n const rowNode = apiRef.current.getRowNode(id);\n if (rowNode.type === 'group') {\n cellAggregationPosition = 'inline';\n } else if (id.toString().startsWith('auto-generated-group-footer-')) {\n cellAggregationPosition = 'footer';\n }\n if (cellAggregationPosition == null) {\n return null;\n }\n\n // TODO: Add custom root id\n const groupId = cellAggregationPosition === 'inline' ? id : (_rowNode$parent = rowNode.parent) != null ? _rowNode$parent : '';\n const aggregationResult = (_gridAggregationLooku = gridAggregationLookupSelector(apiRef)) == null || (_gridAggregationLooku = _gridAggregationLooku[groupId]) == null ? void 0 : _gridAggregationLooku[field];\n if (!aggregationResult || aggregationResult.position !== cellAggregationPosition) {\n return null;\n }\n return aggregationResult;\n };\n let didWrapSomeProperty = false;\n const wrappedColumn = _extends({}, column, {\n aggregationWrappedColumn: column\n });\n const wrapColumnProperty = (property, wrapper) => {\n const originalValue = column[property];\n const wrappedProperty = wrapper({\n apiRef,\n value: originalValue,\n colDef: column,\n aggregationRule,\n getCellAggregationResult\n });\n if (wrappedProperty !== originalValue) {\n didWrapSomeProperty = true;\n wrappedColumn[property] = wrappedProperty;\n }\n };\n wrapColumnProperty('valueGetter', getAggregationValueWrappedValueGetter);\n wrapColumnProperty('valueFormatter', getAggregationValueWrappedValueFormatter);\n wrapColumnProperty('renderCell', getAggregationValueWrappedRenderCell);\n wrapColumnProperty('renderHeader', getWrappedRenderHeader);\n wrapColumnProperty('filterOperators', getWrappedFilterOperators);\n if (!didWrapSomeProperty) {\n return column;\n }\n return wrappedColumn;\n};\n\n/**\n * Remove the aggregation wrappers around the wrappable properties of the column.\n */\nexport const unwrapColumnFromAggregation = ({\n column\n}) => {\n var _aggregationWrappedCo;\n return (_aggregationWrappedCo = column.aggregationWrappedColumn) != null ? _aggregationWrappedCo : column;\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { gridColumnLookupSelector } from '@mui/x-data-grid-pro';\nimport { useGridRegisterPipeProcessor } from '@mui/x-data-grid-pro/internals';\nimport { getAvailableAggregationFunctions, addFooterRows, getAggregationRules, mergeStateWithAggregationModel } from './gridAggregationUtils';\nimport { wrapColumnWithAggregationValue, unwrapColumnFromAggregation } from './wrapColumnWithAggregation';\nimport { gridAggregationModelSelector } from './gridAggregationSelectors';\nexport const useGridAggregationPreProcessors = (apiRef, props) => {\n // apiRef.current.caches.aggregation.rulesOnLastColumnHydration is not used because by the time\n // that the pre-processor is called it will already have been updated with the current rules.\n const rulesOnLastColumnHydration = React.useRef({});\n const updateAggregatedColumns = React.useCallback(columnsState => {\n const aggregationRules = props.disableAggregation ? {} : getAggregationRules({\n columnsLookup: columnsState.lookup,\n aggregationModel: gridAggregationModelSelector(apiRef),\n aggregationFunctions: props.aggregationFunctions\n });\n columnsState.orderedFields.forEach(field => {\n const shouldHaveAggregationValue = !!aggregationRules[field];\n const haveAggregationColumnValue = !!rulesOnLastColumnHydration.current[field];\n let column = columnsState.lookup[field];\n if (haveAggregationColumnValue) {\n column = unwrapColumnFromAggregation({\n column\n });\n }\n if (shouldHaveAggregationValue) {\n column = wrapColumnWithAggregationValue({\n column,\n aggregationRule: aggregationRules[field],\n apiRef\n });\n }\n columnsState.lookup[field] = column;\n });\n rulesOnLastColumnHydration.current = aggregationRules;\n return columnsState;\n }, [apiRef, props.aggregationFunctions, props.disableAggregation]);\n const addGroupFooterRows = React.useCallback(value => {\n const aggregationRules = props.disableAggregation ? {} : getAggregationRules({\n columnsLookup: gridColumnLookupSelector(apiRef),\n aggregationModel: gridAggregationModelSelector(apiRef),\n aggregationFunctions: props.aggregationFunctions\n });\n const hasAggregationRule = Object.keys(aggregationRules).length > 0;\n\n // If we did not have any aggregation footer before, and we still don't have any,\n // Then we can skip this step\n if (Object.keys(apiRef.current.caches.aggregation.rulesOnLastRowHydration).length === 0 && !hasAggregationRule) {\n return value;\n }\n apiRef.current.caches.aggregation.rulesOnLastRowHydration = aggregationRules;\n return addFooterRows({\n apiRef,\n groupingParams: value,\n getAggregationPosition: props.getAggregationPosition,\n hasAggregationRule\n });\n }, [apiRef, props.disableAggregation, props.getAggregationPosition, props.aggregationFunctions]);\n const addColumnMenuButtons = React.useCallback((columnMenuItems, colDef) => {\n if (props.disableAggregation) {\n return columnMenuItems;\n }\n const availableAggregationFunctions = getAvailableAggregationFunctions({\n aggregationFunctions: props.aggregationFunctions,\n colDef\n });\n if (availableAggregationFunctions.length === 0) {\n return columnMenuItems;\n }\n return [...columnMenuItems, 'columnMenuAggregationItem'];\n }, [props.aggregationFunctions, props.disableAggregation]);\n const stateExportPreProcessing = React.useCallback(prevState => {\n if (props.disableAggregation) {\n return prevState;\n }\n const aggregationModelToExport = gridAggregationModelSelector(apiRef);\n if (Object.values(aggregationModelToExport).length === 0) {\n return prevState;\n }\n return _extends({}, prevState, {\n aggregation: {\n model: aggregationModelToExport\n }\n });\n }, [apiRef, props.disableAggregation]);\n const stateRestorePreProcessing = React.useCallback((params, context) => {\n var _context$stateToResto;\n if (props.disableAggregation) {\n return params;\n }\n const aggregationModel = (_context$stateToResto = context.stateToRestore.aggregation) == null ? void 0 : _context$stateToResto.model;\n if (aggregationModel != null) {\n apiRef.current.setState(mergeStateWithAggregationModel(aggregationModel));\n }\n return params;\n }, [apiRef, props.disableAggregation]);\n useGridRegisterPipeProcessor(apiRef, 'hydrateColumns', updateAggregatedColumns);\n useGridRegisterPipeProcessor(apiRef, 'hydrateRows', addGroupFooterRows);\n useGridRegisterPipeProcessor(apiRef, 'columnMenu', addColumnMenuButtons);\n useGridRegisterPipeProcessor(apiRef, 'exportState', stateExportPreProcessing);\n useGridRegisterPipeProcessor(apiRef, 'restoreState', stateRestorePreProcessing);\n};","import { gridColumnLookupSelector } from '@mui/x-data-grid-pro';\nimport { createSelector, createSelectorMemoized } from '@mui/x-data-grid/internals';\nconst gridRowGroupingStateSelector = state => state.rowGrouping;\nexport const gridRowGroupingModelSelector = createSelector(gridRowGroupingStateSelector, rowGrouping => rowGrouping.model);\nexport const gridRowGroupingSanitizedModelSelector = createSelectorMemoized(gridRowGroupingModelSelector, gridColumnLookupSelector, (model, columnsLookup) => model.filter(field => !!columnsLookup[field] && columnsLookup[field].groupable));","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { passFilterLogic } from '@mui/x-data-grid-pro/internals';\nimport { gridRowGroupingSanitizedModelSelector } from './gridRowGroupingSelector';\nexport const GRID_ROW_GROUPING_SINGLE_GROUPING_FIELD = '__row_group_by_columns_group__';\nexport const ROW_GROUPING_STRATEGY = 'grouping-columns';\nexport const getRowGroupingFieldFromGroupingCriteria = groupingCriteria => {\n if (groupingCriteria === null) {\n return GRID_ROW_GROUPING_SINGLE_GROUPING_FIELD;\n }\n return `__row_group_by_columns_group_${groupingCriteria}__`;\n};\nexport const getRowGroupingCriteriaFromGroupingField = groupingColDefField => {\n const match = groupingColDefField.match(/^__row_group_by_columns_group_(.*)__$/);\n if (!match) {\n return null;\n }\n return match[1];\n};\nexport const isGroupingColumn = field => field === GRID_ROW_GROUPING_SINGLE_GROUPING_FIELD || getRowGroupingCriteriaFromGroupingField(field) !== null;\n/**\n * When filtering a group, we only want to filter according to the items related to this grouping column.\n */\nconst shouldApplyFilterItemOnGroup = (columnField, node) => {\n if (columnField === GRID_ROW_GROUPING_SINGLE_GROUPING_FIELD) {\n return true;\n }\n const groupingCriteriaField = getRowGroupingCriteriaFromGroupingField(columnField);\n return groupingCriteriaField === node.groupingField;\n};\n\n/**\n * A leaf is visible if it passed the filter\n * A group is visible if all the following criteria are met:\n * - One of its children is passing the filter\n * - It is passing the filter\n */\nexport const filterRowTreeFromGroupingColumns = params => {\n const {\n apiRef,\n rowTree,\n isRowMatchingFilters,\n filterModel\n } = params;\n const filteredRowsLookup = {};\n const filteredDescendantCountLookup = {};\n const filterCache = {};\n const filterTreeNode = (node, areAncestorsExpanded, ancestorsResults) => {\n const filterResults = {\n passingFilterItems: null,\n passingQuickFilterValues: null\n };\n let isPassingFiltering = false;\n if (isRowMatchingFilters && node.type !== 'footer') {\n const shouldApplyItem = node.type === 'group' && node.isAutoGenerated ? columnField => shouldApplyFilterItemOnGroup(columnField, node) : undefined;\n const row = apiRef.current.getRow(node.id);\n isRowMatchingFilters(row, shouldApplyItem, filterResults);\n } else {\n isPassingFiltering = true;\n }\n let filteredDescendantCount = 0;\n if (node.type === 'group') {\n node.children.forEach(childId => {\n const childNode = rowTree[childId];\n const childSubTreeSize = filterTreeNode(childNode, areAncestorsExpanded && !!node.childrenExpanded, [...ancestorsResults, filterResults]);\n filteredDescendantCount += childSubTreeSize;\n });\n }\n if (isPassingFiltering === false) {\n if (node.type === 'group') {\n // If node has children - it's passing if at least one child passes filters\n isPassingFiltering = filteredDescendantCount > 0;\n } else {\n const allResults = [...ancestorsResults, filterResults];\n isPassingFiltering = passFilterLogic(allResults.map(result => result.passingFilterItems), allResults.map(result => result.passingQuickFilterValues), filterModel, params.apiRef, filterCache);\n }\n }\n filteredRowsLookup[node.id] = isPassingFiltering;\n if (!isPassingFiltering) {\n return 0;\n }\n filteredDescendantCountLookup[node.id] = filteredDescendantCount;\n if (node.type !== 'group') {\n return filteredDescendantCount + 1;\n }\n return filteredDescendantCount;\n };\n const nodes = Object.values(rowTree);\n for (let i = 0; i < nodes.length; i += 1) {\n const node = nodes[i];\n if (node.depth === 0) {\n filterTreeNode(node, true, []);\n }\n }\n return {\n filteredRowsLookup,\n filteredDescendantCountLookup\n };\n};\nexport const getColDefOverrides = (groupingColDefProp, fields) => {\n if (typeof groupingColDefProp === 'function') {\n return groupingColDefProp({\n groupingName: ROW_GROUPING_STRATEGY,\n fields\n });\n }\n return groupingColDefProp;\n};\nexport const mergeStateWithRowGroupingModel = rowGroupingModel => state => _extends({}, state, {\n rowGrouping: _extends({}, state.rowGrouping, {\n model: rowGroupingModel\n })\n});\nexport const setStrategyAvailability = (privateApiRef, disableRowGrouping) => {\n let isAvailable;\n if (disableRowGrouping) {\n isAvailable = () => false;\n } else {\n isAvailable = () => {\n const rowGroupingSanitizedModel = gridRowGroupingSanitizedModelSelector(privateApiRef);\n return rowGroupingSanitizedModel.length > 0;\n };\n }\n privateApiRef.current.setStrategyAvailability('rowTree', ROW_GROUPING_STRATEGY, isAvailable);\n};\nexport const getCellGroupingCriteria = ({\n row,\n id,\n colDef,\n groupingRule\n}) => {\n let key;\n if (groupingRule.groupingValueGetter) {\n const groupingValueGetterParams = {\n colDef,\n field: groupingRule.field,\n value: row[groupingRule.field],\n id,\n row,\n rowNode: {\n isAutoGenerated: false,\n id\n }\n };\n key = groupingRule.groupingValueGetter(groupingValueGetterParams);\n } else {\n key = row[groupingRule.field];\n }\n return {\n key,\n field: groupingRule.field\n };\n};\nexport const getGroupingRules = ({\n sanitizedRowGroupingModel,\n columnsLookup\n}) => sanitizedRowGroupingModel.map(field => {\n var _columnsLookup$field;\n return {\n field,\n groupingValueGetter: (_columnsLookup$field = columnsLookup[field]) == null ? void 0 : _columnsLookup$field.groupingValueGetter\n };\n});\n\n/**\n * Compares two sets of grouping rules to determine if they are equal or not.\n */\nexport const areGroupingRulesEqual = (newValue, previousValue) => {\n if (previousValue.length !== newValue.length) {\n return false;\n }\n return newValue.every((newRule, newRuleIndex) => {\n const previousRule = previousValue[newRuleIndex];\n if (previousRule.groupingValueGetter !== newRule.groupingValueGetter) {\n return false;\n }\n if (previousRule.field !== newRule.field) {\n return false;\n }\n return true;\n });\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridApiEventHandler, useGridApiMethod, gridColumnLookupSelector } from '@mui/x-data-grid-pro';\nimport { useGridRegisterPipeProcessor } from '@mui/x-data-grid-pro/internals';\nimport { gridRowGroupingModelSelector, gridRowGroupingSanitizedModelSelector } from './gridRowGroupingSelector';\nimport { getRowGroupingFieldFromGroupingCriteria, ROW_GROUPING_STRATEGY, isGroupingColumn, mergeStateWithRowGroupingModel, setStrategyAvailability, getGroupingRules, areGroupingRulesEqual } from './gridRowGroupingUtils';\nexport const rowGroupingStateInitializer = (state, props, apiRef) => {\n var _ref, _props$rowGroupingMod, _props$initialState;\n apiRef.current.caches.rowGrouping = {\n rulesOnLastRowTreeCreation: []\n };\n return _extends({}, state, {\n rowGrouping: {\n model: (_ref = (_props$rowGroupingMod = props.rowGroupingModel) != null ? _props$rowGroupingMod : (_props$initialState = props.initialState) == null || (_props$initialState = _props$initialState.rowGrouping) == null ? void 0 : _props$initialState.model) != null ? _ref : []\n }\n });\n};\n\n/**\n * @requires useGridColumns (state, method) - can be after, async only\n * @requires useGridRows (state, method) - can be after, async only\n * @requires useGridParamsApi (method) - can be after, async only\n */\nexport const useGridRowGrouping = (apiRef, props) => {\n var _props$initialState3;\n apiRef.current.registerControlState({\n stateId: 'rowGrouping',\n propModel: props.rowGroupingModel,\n propOnChange: props.onRowGroupingModelChange,\n stateSelector: gridRowGroupingModelSelector,\n changeEvent: 'rowGroupingModelChange'\n });\n\n /**\n * API METHODS\n */\n const setRowGroupingModel = React.useCallback(model => {\n const currentModel = gridRowGroupingModelSelector(apiRef);\n if (currentModel !== model) {\n apiRef.current.setState(mergeStateWithRowGroupingModel(model));\n setStrategyAvailability(apiRef, props.disableRowGrouping);\n apiRef.current.forceUpdate();\n }\n }, [apiRef, props.disableRowGrouping]);\n const addRowGroupingCriteria = React.useCallback((field, groupingIndex) => {\n const currentModel = gridRowGroupingModelSelector(apiRef);\n if (currentModel.includes(field)) {\n return;\n }\n const cleanGroupingIndex = groupingIndex != null ? groupingIndex : currentModel.length;\n const updatedModel = [...currentModel.slice(0, cleanGroupingIndex), field, ...currentModel.slice(cleanGroupingIndex)];\n apiRef.current.setRowGroupingModel(updatedModel);\n }, [apiRef]);\n const removeRowGroupingCriteria = React.useCallback(field => {\n const currentModel = gridRowGroupingModelSelector(apiRef);\n if (!currentModel.includes(field)) {\n return;\n }\n apiRef.current.setRowGroupingModel(currentModel.filter(el => el !== field));\n }, [apiRef]);\n const setRowGroupingCriteriaIndex = React.useCallback((field, targetIndex) => {\n const currentModel = gridRowGroupingModelSelector(apiRef);\n const currentTargetIndex = currentModel.indexOf(field);\n if (currentTargetIndex === -1) {\n return;\n }\n const updatedModel = [...currentModel];\n updatedModel.splice(targetIndex, 0, updatedModel.splice(currentTargetIndex, 1)[0]);\n apiRef.current.setRowGroupingModel(updatedModel);\n }, [apiRef]);\n const rowGroupingApi = {\n setRowGroupingModel,\n addRowGroupingCriteria,\n removeRowGroupingCriteria,\n setRowGroupingCriteriaIndex\n };\n useGridApiMethod(apiRef, rowGroupingApi, 'public');\n\n /**\n * PRE-PROCESSING\n */\n const addColumnMenuButtons = React.useCallback((columnMenuItems, colDef) => {\n if (props.disableRowGrouping) {\n return columnMenuItems;\n }\n if (isGroupingColumn(colDef.field) || colDef.groupable) {\n return [...columnMenuItems, 'columnMenuGroupingItem'];\n }\n return columnMenuItems;\n }, [props.disableRowGrouping]);\n const stateExportPreProcessing = React.useCallback((prevState, context) => {\n var _props$initialState2;\n const rowGroupingModelToExport = gridRowGroupingModelSelector(apiRef);\n const shouldExportRowGroupingModel =\n // Always export if the `exportOnlyDirtyModels` property is not activated\n !context.exportOnlyDirtyModels ||\n // Always export if the model is controlled\n props.rowGroupingModel != null ||\n // Always export if the model has been initialized\n ((_props$initialState2 = props.initialState) == null || (_props$initialState2 = _props$initialState2.rowGrouping) == null ? void 0 : _props$initialState2.model) != null ||\n // Export if the model is not empty\n Object.keys(rowGroupingModelToExport).length > 0;\n if (!shouldExportRowGroupingModel) {\n return prevState;\n }\n return _extends({}, prevState, {\n rowGrouping: {\n model: rowGroupingModelToExport\n }\n });\n }, [apiRef, props.rowGroupingModel, (_props$initialState3 = props.initialState) == null || (_props$initialState3 = _props$initialState3.rowGrouping) == null ? void 0 : _props$initialState3.model]);\n const stateRestorePreProcessing = React.useCallback((params, context) => {\n var _context$stateToResto;\n if (props.disableRowGrouping) {\n return params;\n }\n const rowGroupingModel = (_context$stateToResto = context.stateToRestore.rowGrouping) == null ? void 0 : _context$stateToResto.model;\n if (rowGroupingModel != null) {\n apiRef.current.setState(mergeStateWithRowGroupingModel(rowGroupingModel));\n }\n return params;\n }, [apiRef, props.disableRowGrouping]);\n useGridRegisterPipeProcessor(apiRef, 'columnMenu', addColumnMenuButtons);\n useGridRegisterPipeProcessor(apiRef, 'exportState', stateExportPreProcessing);\n useGridRegisterPipeProcessor(apiRef, 'restoreState', stateRestorePreProcessing);\n\n /**\n * EVENTS\n */\n const handleCellKeyDown = React.useCallback((params, event) => {\n const cellParams = apiRef.current.getCellParams(params.id, params.field);\n if (isGroupingColumn(cellParams.field) && event.key === ' ' && !event.shiftKey) {\n event.stopPropagation();\n event.preventDefault();\n if (params.rowNode.type !== 'group') {\n return;\n }\n const isOnGroupingCell = props.rowGroupingColumnMode === 'single' || getRowGroupingFieldFromGroupingCriteria(params.rowNode.groupingField) === params.field;\n if (!isOnGroupingCell) {\n return;\n }\n apiRef.current.setRowChildrenExpansion(params.id, !params.rowNode.childrenExpanded);\n }\n }, [apiRef, props.rowGroupingColumnMode]);\n const checkGroupingColumnsModelDiff = React.useCallback(() => {\n const sanitizedRowGroupingModel = gridRowGroupingSanitizedModelSelector(apiRef);\n const rulesOnLastRowTreeCreation = apiRef.current.caches.rowGrouping.rulesOnLastRowTreeCreation || [];\n const groupingRules = getGroupingRules({\n sanitizedRowGroupingModel,\n columnsLookup: gridColumnLookupSelector(apiRef)\n });\n if (!areGroupingRulesEqual(rulesOnLastRowTreeCreation, groupingRules)) {\n apiRef.current.caches.rowGrouping.rulesOnLastRowTreeCreation = groupingRules;\n apiRef.current.requestPipeProcessorsApplication('hydrateColumns');\n setStrategyAvailability(apiRef, props.disableRowGrouping);\n\n // Refresh the row tree creation strategy processing\n // TODO: Add a clean way to re-run a strategy processing without publishing a private event\n if (apiRef.current.getActiveStrategy('rowTree') === ROW_GROUPING_STRATEGY) {\n apiRef.current.publishEvent('activeStrategyProcessorChange', 'rowTreeCreation');\n }\n }\n }, [apiRef, props.disableRowGrouping]);\n useGridApiEventHandler(apiRef, 'cellKeyDown', handleCellKeyDown);\n useGridApiEventHandler(apiRef, 'columnsChange', checkGroupingColumnsModelDiff);\n useGridApiEventHandler(apiRef, 'rowGroupingModelChange', checkGroupingColumnsModelDiff);\n\n /**\n * EFFECTS\n */\n React.useEffect(() => {\n if (props.rowGroupingModel !== undefined) {\n apiRef.current.setRowGroupingModel(props.rowGroupingModel);\n }\n }, [apiRef, props.rowGroupingModel]);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { GridFooterCell } from './GridFooterCell';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction GridGroupingColumnFooterCell(props) {\n const rootProps = useGridRootProps();\n const sx = {\n ml: 0\n };\n if (props.rowNode.parent == null) {\n sx.ml = 0;\n } else if (rootProps.rowGroupingColumnMode === 'multiple') {\n sx.ml = 2;\n } else {\n sx.ml = theme => `calc(var(--DataGrid-cellOffsetMultiplier) * ${theme.spacing(props.rowNode.depth)})`;\n }\n return /*#__PURE__*/_jsx(GridFooterCell, _extends({\n sx: sx\n }, props));\n}\nexport { GridGroupingColumnFooterCell };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport Box from '@mui/material/Box';\nimport { useGridSelector, gridFilteredDescendantCountLookupSelector, getDataGridUtilityClass } from '@mui/x-data-grid-pro';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['groupingCriteriaCell'],\n toggle: ['groupingCriteriaCellToggle']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nexport function GridGroupingCriteriaCell(props) {\n var _filteredDescendantCo, _rootProps$slotProps;\n const {\n id,\n field,\n rowNode,\n hideDescendantCount,\n formattedValue\n } = props;\n const rootProps = useGridRootProps();\n const apiRef = useGridApiContext();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n const filteredDescendantCountLookup = useGridSelector(apiRef, gridFilteredDescendantCountLookupSelector);\n const filteredDescendantCount = (_filteredDescendantCo = filteredDescendantCountLookup[rowNode.id]) != null ? _filteredDescendantCo : 0;\n const Icon = rowNode.childrenExpanded ? rootProps.slots.groupingCriteriaCollapseIcon : rootProps.slots.groupingCriteriaExpandIcon;\n const handleKeyDown = event => {\n if (event.key === ' ') {\n // We call event.stopPropagation to avoid unfolding the row and also scrolling to bottom\n // TODO: Remove and add a check inside useGridKeyboardNavigation\n event.stopPropagation();\n }\n apiRef.current.publishEvent('cellKeyDown', props, event);\n };\n const handleClick = event => {\n apiRef.current.setRowChildrenExpansion(id, !rowNode.childrenExpanded);\n apiRef.current.setCellFocus(id, field);\n event.stopPropagation();\n };\n let cellContent;\n const colDef = apiRef.current.getColumn(rowNode.groupingField);\n if (typeof colDef.renderCell === 'function') {\n cellContent = colDef.renderCell(props);\n } else if (typeof formattedValue !== 'undefined') {\n cellContent = /*#__PURE__*/_jsx(\"span\", {\n children: formattedValue\n });\n } else {\n cellContent = /*#__PURE__*/_jsx(\"span\", {\n children: rowNode.groupingKey\n });\n }\n return /*#__PURE__*/_jsxs(Box, {\n className: classes.root,\n sx: {\n ml: rootProps.rowGroupingColumnMode === 'multiple' ? 0 : theme => `calc(var(--DataGrid-cellOffsetMultiplier) * ${theme.spacing(rowNode.depth)})`\n },\n children: [/*#__PURE__*/_jsx(\"div\", {\n className: classes.toggle,\n children: filteredDescendantCount > 0 && /*#__PURE__*/_jsx(rootProps.slots.baseIconButton, _extends({\n size: \"small\",\n onClick: handleClick,\n onKeyDown: handleKeyDown,\n tabIndex: -1,\n \"aria-label\": rowNode.childrenExpanded ? apiRef.current.getLocaleText('treeDataCollapse') : apiRef.current.getLocaleText('treeDataExpand')\n }, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseIconButton, {\n children: /*#__PURE__*/_jsx(Icon, {\n fontSize: \"inherit\"\n })\n }))\n }), cellContent, !hideDescendantCount && filteredDescendantCount > 0 ? /*#__PURE__*/_jsxs(\"span\", {\n style: {\n whiteSpace: 'pre'\n },\n children: [\" (\", filteredDescendantCount, \")\"]\n }) : null]\n });\n}","import * as React from 'react';\nimport Box from '@mui/material/Box';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction GridGroupingColumnLeafCell(props) {\n var _props$formattedValue;\n const {\n rowNode\n } = props;\n const rootProps = useGridRootProps();\n return /*#__PURE__*/_jsx(Box, {\n sx: {\n ml: rootProps.rowGroupingColumnMode === 'multiple' ? 1 : theme => `calc(var(--DataGrid-cellOffsetMultiplier) * ${theme.spacing(rowNode.depth)})`\n },\n children: (_props$formattedValue = props.formattedValue) != null ? _props$formattedValue : props.value\n });\n}\nexport { GridGroupingColumnLeafCell };","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"leafField\", \"mainGroupingCriteria\", \"hideDescendantCount\"],\n _excluded2 = [\"leafField\", \"mainGroupingCriteria\", \"hideDescendantCount\"];\nimport * as React from 'react';\nimport { GRID_STRING_COL_DEF } from '@mui/x-data-grid-pro';\nimport { isSingleSelectColDef } from '@mui/x-data-grid-pro/internals';\nimport { GridGroupingColumnFooterCell } from '../../../components/GridGroupingColumnFooterCell';\nimport { GridGroupingCriteriaCell } from '../../../components/GridGroupingCriteriaCell';\nimport { GridGroupingColumnLeafCell } from '../../../components/GridGroupingColumnLeafCell';\nimport { getRowGroupingFieldFromGroupingCriteria, GRID_ROW_GROUPING_SINGLE_GROUPING_FIELD } from './gridRowGroupingUtils';\nimport { gridRowGroupingSanitizedModelSelector } from './gridRowGroupingSelector';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst GROUPING_COL_DEF_DEFAULT_PROPERTIES = _extends({}, GRID_STRING_COL_DEF, {\n disableReorder: true\n});\nconst GROUPING_COL_DEF_FORCED_PROPERTIES = {\n type: 'rowGroupByColumnsGroup',\n editable: false,\n groupable: false\n};\n\n/**\n * When sorting two cells with different grouping criteria, we consider that the cell with the grouping criteria coming first in the model should be displayed below.\n * This can occur when some rows don't have all the fields. In which case we want the rows with the missing field to be displayed above.\n * TODO: Make this index comparator depth invariant, the logic should not be inverted when sorting in the \"desc\" direction (but the current return format of `sortComparator` does not support this behavior).\n */\nconst groupingFieldIndexComparator = (v1, v2, cellParams1, cellParams2) => {\n var _groupingField, _groupingField2;\n const model = gridRowGroupingSanitizedModelSelector(cellParams1.api.state, cellParams1.api.instanceId);\n const groupingField1 = (_groupingField = cellParams1.rowNode.groupingField) != null ? _groupingField : null;\n const groupingField2 = (_groupingField2 = cellParams2.rowNode.groupingField) != null ? _groupingField2 : null;\n if (groupingField1 === groupingField2) {\n return 0;\n }\n if (groupingField1 == null) {\n return -1;\n }\n if (groupingField2 == null) {\n return 1;\n }\n if (model.indexOf(groupingField1) < model.indexOf(groupingField2)) {\n return -1;\n }\n return 1;\n};\nconst getLeafProperties = leafColDef => {\n var _leafColDef$headerNam;\n return {\n headerName: (_leafColDef$headerNam = leafColDef.headerName) != null ? _leafColDef$headerNam : leafColDef.field,\n sortable: leafColDef.sortable,\n filterable: leafColDef.filterable,\n valueOptions: isSingleSelectColDef(leafColDef) ? leafColDef.valueOptions : undefined,\n filterOperators: leafColDef.filterOperators,\n sortComparator: (v1, v2, cellParams1, cellParams2) => {\n // We only want to sort the leaves\n if (cellParams1.rowNode.type === 'leaf' && cellParams2.rowNode.type === 'leaf') {\n return leafColDef.sortComparator(v1, v2, cellParams1, cellParams2);\n }\n return groupingFieldIndexComparator(v1, v2, cellParams1, cellParams2);\n }\n };\n};\nconst getGroupingCriteriaProperties = (groupedByColDef, applyHeaderName) => {\n const properties = {\n sortable: groupedByColDef.sortable,\n filterable: groupedByColDef.filterable,\n valueOptions: isSingleSelectColDef(groupedByColDef) ? groupedByColDef.valueOptions : undefined,\n sortComparator: (v1, v2, cellParams1, cellParams2) => {\n // We only want to sort the groups of the current grouping criteria\n if (cellParams1.rowNode.type === 'group' && cellParams1.rowNode.groupingField === groupedByColDef.field && cellParams2.rowNode.type === 'group' && cellParams2.rowNode.groupingField === groupedByColDef.field) {\n return groupedByColDef.sortComparator(v1, v2, cellParams1, cellParams2);\n }\n return groupingFieldIndexComparator(v1, v2, cellParams1, cellParams2);\n },\n filterOperators: groupedByColDef.filterOperators\n };\n if (applyHeaderName) {\n var _groupedByColDef$head;\n properties.headerName = (_groupedByColDef$head = groupedByColDef.headerName) != null ? _groupedByColDef$head : groupedByColDef.field;\n }\n return properties;\n};\n/**\n * Creates the `GridColDef` for a grouping column that only takes care of a single grouping criteria\n */\nexport const createGroupingColDefForOneGroupingCriteria = ({\n columnsLookup,\n groupedByColDef,\n groupingCriteria,\n colDefOverride\n}) => {\n var _groupedByColDef$widt, _leafColDef$width;\n const _ref = colDefOverride != null ? colDefOverride : {},\n {\n leafField,\n mainGroupingCriteria,\n hideDescendantCount\n } = _ref,\n colDefOverrideProperties = _objectWithoutPropertiesLoose(_ref, _excluded);\n const leafColDef = leafField ? columnsLookup[leafField] : null;\n\n // The properties that do not depend on the presence of a `leafColDef` and that can be overridden by `colDefOverride`\n const commonProperties = {\n width: Math.max(((_groupedByColDef$widt = groupedByColDef.width) != null ? _groupedByColDef$widt : GRID_STRING_COL_DEF.width) + 40, (_leafColDef$width = leafColDef == null ? void 0 : leafColDef.width) != null ? _leafColDef$width : 0),\n renderCell: params => {\n // Render footer\n if (params.rowNode.type === 'footer' || params.rowNode.type === 'pinnedRow') {\n return /*#__PURE__*/_jsx(GridGroupingColumnFooterCell, _extends({}, params));\n }\n\n // Render leaves\n if (params.rowNode.type === 'leaf') {\n if (leafColDef) {\n const leafParams = _extends({}, params.api.getCellParams(params.id, leafField), {\n api: params.api,\n hasFocus: params.hasFocus\n });\n if (leafColDef.renderCell) {\n return leafColDef.renderCell(leafParams);\n }\n return /*#__PURE__*/_jsx(GridGroupingColumnLeafCell, _extends({}, leafParams));\n }\n return '';\n }\n\n // Render current grouping criteria groups\n if (params.rowNode.groupingField === groupingCriteria) {\n return /*#__PURE__*/_jsx(GridGroupingCriteriaCell, _extends({}, params, {\n hideDescendantCount: hideDescendantCount\n }));\n }\n return '';\n },\n valueGetter: params => {\n if (!params.rowNode || params.rowNode.type === 'footer' || params.rowNode.type === 'pinnedRow') {\n return undefined;\n }\n if (params.rowNode.type === 'leaf') {\n if (leafColDef) {\n return params.api.getCellValue(params.id, leafField);\n }\n return undefined;\n }\n if (params.rowNode.groupingField === groupingCriteria) {\n return params.rowNode.groupingKey;\n }\n return undefined;\n }\n };\n\n // If we have a `mainGroupingCriteria` defined and matching the `groupingCriteria`\n // Then we apply the sorting / filtering on the groups of this column's grouping criteria based on the properties of `groupedByColDef`.\n // It can be useful to define a `leafField` for leaves rendering but still use the grouping criteria for the sorting / filtering\n //\n // If we have a `leafField` defined and matching an existing column\n // Then we apply the sorting / filtering on the leaves based on the properties of `leavesColDef`\n //\n // By default, we apply the sorting / filtering on the groups of this column's grouping criteria based on the properties of `groupedColDef`.\n let sourceProperties;\n if (mainGroupingCriteria && mainGroupingCriteria === groupingCriteria) {\n sourceProperties = getGroupingCriteriaProperties(groupedByColDef, true);\n } else if (leafColDef) {\n sourceProperties = getLeafProperties(leafColDef);\n } else {\n sourceProperties = getGroupingCriteriaProperties(groupedByColDef, true);\n }\n\n // The properties that can't be overridden with `colDefOverride`\n const forcedProperties = _extends({\n field: getRowGroupingFieldFromGroupingCriteria(groupingCriteria)\n }, GROUPING_COL_DEF_FORCED_PROPERTIES);\n return _extends({}, GROUPING_COL_DEF_DEFAULT_PROPERTIES, commonProperties, sourceProperties, colDefOverrideProperties, forcedProperties);\n};\n/**\n * Creates the `GridColDef` for a grouping column that takes care of all the grouping criteria\n */\nexport const createGroupingColDefForAllGroupingCriteria = ({\n apiRef,\n columnsLookup,\n rowGroupingModel,\n colDefOverride\n}) => {\n var _leafColDef$width2;\n const _ref2 = colDefOverride != null ? colDefOverride : {},\n {\n leafField,\n mainGroupingCriteria,\n hideDescendantCount\n } = _ref2,\n colDefOverrideProperties = _objectWithoutPropertiesLoose(_ref2, _excluded2);\n const leafColDef = leafField ? columnsLookup[leafField] : null;\n\n // The properties that do not depend on the presence of a `leafColDef` and that can be overridden by `colDefOverride`\n const commonProperties = {\n headerName: apiRef.current.getLocaleText('groupingColumnHeaderName'),\n width: Math.max(...rowGroupingModel.map(field => {\n var _columnsLookup$field$;\n return ((_columnsLookup$field$ = columnsLookup[field].width) != null ? _columnsLookup$field$ : GRID_STRING_COL_DEF.width) + 40;\n }), (_leafColDef$width2 = leafColDef == null ? void 0 : leafColDef.width) != null ? _leafColDef$width2 : 0),\n renderCell: params => {\n // Render footer\n if (params.rowNode.type === 'footer' || params.rowNode.type === 'pinnedRow') {\n return /*#__PURE__*/_jsx(GridGroupingColumnFooterCell, _extends({}, params));\n }\n\n // Render the leaves\n if (params.rowNode.type === 'leaf') {\n if (leafColDef) {\n const leafParams = _extends({}, params.api.getCellParams(params.id, leafField), {\n api: params.api,\n hasFocus: params.hasFocus\n });\n if (leafColDef.renderCell) {\n return leafColDef.renderCell(leafParams);\n }\n return /*#__PURE__*/_jsx(GridGroupingColumnLeafCell, _extends({}, leafParams));\n }\n return '';\n }\n\n // Render the groups\n return /*#__PURE__*/_jsx(GridGroupingCriteriaCell, _extends({}, params, {\n hideDescendantCount: hideDescendantCount\n }));\n },\n valueGetter: params => {\n if (!params.rowNode || params.rowNode.type === 'footer' || params.rowNode.type === 'pinnedRow') {\n return undefined;\n }\n if (params.rowNode.type === 'leaf') {\n if (leafColDef) {\n return params.api.getCellValue(params.id, leafField);\n }\n return undefined;\n }\n return params.rowNode.groupingKey;\n }\n };\n\n // If we have a `mainGroupingCriteria` defined and matching one of the `orderedGroupedByFields`\n // Then we apply the sorting / filtering on the groups of this column's grouping criteria based on the properties of `columnsLookup[mainGroupingCriteria]`.\n // It can be useful to use another grouping criteria than the top level one for the sorting / filtering\n //\n // If we have a `leafField` defined and matching an existing column\n // Then we apply the sorting / filtering on the leaves based on the properties of `leavesColDef`\n //\n // By default, we apply the sorting / filtering on the groups of the top level grouping criteria based on the properties of `columnsLookup[orderedGroupedByFields[0]]`.\n let sourceProperties;\n if (mainGroupingCriteria && rowGroupingModel.includes(mainGroupingCriteria)) {\n sourceProperties = getGroupingCriteriaProperties(columnsLookup[mainGroupingCriteria], true);\n } else if (leafColDef) {\n sourceProperties = getLeafProperties(leafColDef);\n } else {\n sourceProperties = getGroupingCriteriaProperties(columnsLookup[rowGroupingModel[0]], rowGroupingModel.length === 1);\n }\n\n // The properties that can't be overridden with `colDefOverride`\n const forcedProperties = _extends({\n field: GRID_ROW_GROUPING_SINGLE_GROUPING_FIELD\n }, GROUPING_COL_DEF_FORCED_PROPERTIES);\n return _extends({}, GROUPING_COL_DEF_DEFAULT_PROPERTIES, commonProperties, sourceProperties, colDefOverrideProperties, forcedProperties);\n};","import * as React from 'react';\nimport { gridColumnLookupSelector, gridRowTreeSelector, useFirstRender, GRID_CHECKBOX_SELECTION_FIELD } from '@mui/x-data-grid-pro';\nimport { useGridRegisterPipeProcessor, useGridRegisterStrategyProcessor, sortRowTree, createRowTree, updateRowTree, getVisibleRowsLookup } from '@mui/x-data-grid-pro/internals';\nimport { gridRowGroupingModelSelector, gridRowGroupingSanitizedModelSelector } from './gridRowGroupingSelector';\nimport { createGroupingColDefForAllGroupingCriteria, createGroupingColDefForOneGroupingCriteria } from './createGroupingColDef';\nimport { filterRowTreeFromGroupingColumns, getColDefOverrides, ROW_GROUPING_STRATEGY, isGroupingColumn, setStrategyAvailability, getCellGroupingCriteria, getGroupingRules } from './gridRowGroupingUtils';\nexport const useGridRowGroupingPreProcessors = (apiRef, props) => {\n const getGroupingColDefs = React.useCallback(columnsState => {\n if (props.disableRowGrouping) {\n return [];\n }\n const groupingColDefProp = props.groupingColDef;\n\n // We can't use `gridGroupingRowsSanitizedModelSelector` here because the new columns are not in the state yet\n const rowGroupingModel = gridRowGroupingModelSelector(apiRef).filter(field => !!columnsState.lookup[field]);\n if (rowGroupingModel.length === 0) {\n return [];\n }\n switch (props.rowGroupingColumnMode) {\n case 'single':\n {\n return [createGroupingColDefForAllGroupingCriteria({\n apiRef,\n rowGroupingModel,\n colDefOverride: getColDefOverrides(groupingColDefProp, rowGroupingModel),\n columnsLookup: columnsState.lookup\n })];\n }\n case 'multiple':\n {\n return rowGroupingModel.map(groupingCriteria => createGroupingColDefForOneGroupingCriteria({\n groupingCriteria,\n colDefOverride: getColDefOverrides(groupingColDefProp, [groupingCriteria]),\n groupedByColDef: columnsState.lookup[groupingCriteria],\n columnsLookup: columnsState.lookup\n }));\n }\n default:\n {\n return [];\n }\n }\n }, [apiRef, props.groupingColDef, props.rowGroupingColumnMode, props.disableRowGrouping]);\n const updateGroupingColumn = React.useCallback(columnsState => {\n const groupingColDefs = getGroupingColDefs(columnsState);\n let newColumnFields = [];\n const newColumnsLookup = {};\n\n // We only keep the non-grouping columns\n columnsState.orderedFields.forEach(field => {\n if (!isGroupingColumn(field)) {\n newColumnFields.push(field);\n newColumnsLookup[field] = columnsState.lookup[field];\n }\n });\n\n // We add the grouping column\n groupingColDefs.forEach(groupingColDef => {\n const matchingGroupingColDef = columnsState.lookup[groupingColDef.field];\n if (matchingGroupingColDef) {\n groupingColDef.width = matchingGroupingColDef.width;\n groupingColDef.flex = matchingGroupingColDef.flex;\n }\n newColumnsLookup[groupingColDef.field] = groupingColDef;\n });\n const startIndex = newColumnFields[0] === GRID_CHECKBOX_SELECTION_FIELD ? 1 : 0;\n newColumnFields = [...newColumnFields.slice(0, startIndex), ...groupingColDefs.map(colDef => colDef.field), ...newColumnFields.slice(startIndex)];\n columnsState.orderedFields = newColumnFields;\n columnsState.lookup = newColumnsLookup;\n return columnsState;\n }, [getGroupingColDefs]);\n const createRowTreeForRowGrouping = React.useCallback(params => {\n const sanitizedRowGroupingModel = gridRowGroupingSanitizedModelSelector(apiRef);\n const columnsLookup = gridColumnLookupSelector(apiRef);\n const groupingRules = getGroupingRules({\n sanitizedRowGroupingModel,\n columnsLookup\n });\n apiRef.current.caches.rowGrouping.rulesOnLastRowTreeCreation = groupingRules;\n const getRowTreeBuilderNode = rowId => {\n const row = params.dataRowIdToModelLookup[rowId];\n const parentPath = groupingRules.map(groupingRule => getCellGroupingCriteria({\n row,\n id: rowId,\n groupingRule,\n colDef: columnsLookup[groupingRule.field]\n })).filter(cell => cell.key != null);\n const leafGroupingCriteria = {\n key: rowId.toString(),\n field: null\n };\n return {\n path: [...parentPath, leafGroupingCriteria],\n id: rowId\n };\n };\n if (params.updates.type === 'full') {\n return createRowTree({\n previousTree: params.previousTree,\n nodes: params.updates.rows.map(getRowTreeBuilderNode),\n defaultGroupingExpansionDepth: props.defaultGroupingExpansionDepth,\n isGroupExpandedByDefault: props.isGroupExpandedByDefault,\n groupingName: ROW_GROUPING_STRATEGY\n });\n }\n return updateRowTree({\n nodes: {\n inserted: params.updates.actions.insert.map(getRowTreeBuilderNode),\n modified: params.updates.actions.modify.map(getRowTreeBuilderNode),\n removed: params.updates.actions.remove\n },\n previousTree: params.previousTree,\n previousTreeDepth: params.previousTreeDepths,\n defaultGroupingExpansionDepth: props.defaultGroupingExpansionDepth,\n isGroupExpandedByDefault: props.isGroupExpandedByDefault,\n groupingName: ROW_GROUPING_STRATEGY\n });\n }, [apiRef, props.defaultGroupingExpansionDepth, props.isGroupExpandedByDefault]);\n const filterRows = React.useCallback(params => {\n const rowTree = gridRowTreeSelector(apiRef);\n return filterRowTreeFromGroupingColumns({\n rowTree,\n isRowMatchingFilters: params.isRowMatchingFilters,\n filterModel: params.filterModel,\n apiRef\n });\n }, [apiRef]);\n const sortRows = React.useCallback(params => {\n const rowTree = gridRowTreeSelector(apiRef);\n return sortRowTree({\n rowTree,\n sortRowList: params.sortRowList,\n disableChildrenSorting: false,\n shouldRenderGroupBelowLeaves: true\n });\n }, [apiRef]);\n useGridRegisterPipeProcessor(apiRef, 'hydrateColumns', updateGroupingColumn);\n useGridRegisterStrategyProcessor(apiRef, ROW_GROUPING_STRATEGY, 'rowTreeCreation', createRowTreeForRowGrouping);\n useGridRegisterStrategyProcessor(apiRef, ROW_GROUPING_STRATEGY, 'filtering', filterRows);\n useGridRegisterStrategyProcessor(apiRef, ROW_GROUPING_STRATEGY, 'sorting', sortRows);\n useGridRegisterStrategyProcessor(apiRef, ROW_GROUPING_STRATEGY, 'visibleRowsLookupCreation', getVisibleRowsLookup);\n\n /**\n * 1ST RENDER\n */\n useFirstRender(() => {\n setStrategyAvailability(apiRef, props.disableRowGrouping);\n });\n\n /**\n * EFFECTS\n */\n const isFirstRender = React.useRef(true);\n React.useEffect(() => {\n if (!isFirstRender.current) {\n setStrategyAvailability(apiRef, props.disableRowGrouping);\n } else {\n isFirstRender.current = false;\n }\n }, [apiRef, props.disableRowGrouping]);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { GRID_DATE_COL_DEF, GRID_DATETIME_COL_DEF } from '@mui/x-data-grid-pro';\nimport { buildWarning, isObject, isSingleSelectColDef } from '@mui/x-data-grid/internals';\nconst getExcelJs = async () => {\n var _excelJsModule$defaul;\n const excelJsModule = await import('exceljs');\n return (_excelJsModule$defaul = excelJsModule.default) != null ? _excelJsModule$defaul : excelJsModule;\n};\nconst warnInvalidFormattedValue = buildWarning(['MUI: When the value of a field is an object or a `renderCell` is provided, the Excel export might not display the value correctly.', 'You can provide a `valueFormatter` with a string representation to be used.']);\nconst getFormattedValueOptions = (colDef, valueOptions, api) => {\n if (!colDef.valueOptions) {\n return [];\n }\n let valueOptionsFormatted = valueOptions;\n if (colDef.valueFormatter) {\n valueOptionsFormatted = valueOptionsFormatted.map(option => {\n if (typeof option === 'object') {\n return option;\n }\n const params = {\n field: colDef.field,\n api,\n value: option\n };\n return String(colDef.valueFormatter(params));\n });\n }\n return valueOptionsFormatted.map(option => typeof option === 'object' ? option.label : option);\n};\nexport const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {\n const row = {};\n const dataValidation = {};\n const mergedCells = [];\n const firstCellParams = api.getCellParams(id, columns[0].field);\n const outlineLevel = firstCellParams.rowNode.depth;\n\n // `colSpan` is only calculated for rendered rows, so we need to calculate it during export for every row\n api.calculateColSpan({\n rowId: id,\n minFirstColumn: 0,\n maxLastColumn: columns.length,\n columns\n });\n columns.forEach((column, colIndex) => {\n const colSpanInfo = api.unstable_getCellColSpanInfo(id, colIndex);\n if (colSpanInfo && colSpanInfo.spannedByColSpan) {\n return;\n }\n if (colSpanInfo && colSpanInfo.cellProps.colSpan > 1) {\n mergedCells.push({\n leftIndex: colIndex + 1,\n rightIndex: colIndex + colSpanInfo.cellProps.colSpan\n });\n }\n const cellParams = api.getCellParams(id, column.field);\n switch (cellParams.colDef.type) {\n case 'singleSelect':\n {\n const castColumn = cellParams.colDef;\n if (typeof castColumn.valueOptions === 'function') {\n // If value option depends on the row, set specific options to the cell\n // This dataValidation is buggy with LibreOffice and does not allow to have coma\n const valueOptions = castColumn.valueOptions({\n id,\n row,\n field: cellParams.field\n });\n const formattedValueOptions = getFormattedValueOptions(castColumn, valueOptions, api);\n dataValidation[castColumn.field] = {\n type: 'list',\n allowBlank: true,\n formulae: [`\"${formattedValueOptions.map(x => x.toString().replaceAll(',', 'CHAR(44)')).join(',')}\"`]\n };\n } else {\n const address = defaultValueOptionsFormulae[column.field].address;\n\n // If value option is defined for the column, refer to another sheet\n dataValidation[castColumn.field] = {\n type: 'list',\n allowBlank: true,\n formulae: [address]\n };\n }\n const formattedValue = api.getCellParams(id, castColumn.field).formattedValue;\n if (process.env.NODE_ENV !== 'production') {\n if (String(cellParams.formattedValue) === '[object Object]') {\n warnInvalidFormattedValue();\n }\n }\n if (isObject(formattedValue)) {\n row[castColumn.field] = formattedValue == null ? void 0 : formattedValue.label;\n } else {\n row[castColumn.field] = formattedValue;\n }\n break;\n }\n case 'boolean':\n case 'number':\n row[column.field] = api.getCellParams(id, column.field).value;\n break;\n case 'date':\n case 'dateTime':\n {\n // Excel does not do any timezone conversion, so we create a date using UTC instead of local timezone\n // Solution from: https://github.com/exceljs/exceljs/issues/486#issuecomment-432557582\n // About Date.UTC(): https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/UTC#exemples\n const value = api.getCellParams(id, column.field).value;\n // value may be `undefined` in auto-generated grouping rows\n if (!value) {\n break;\n }\n const utcDate = new Date(Date.UTC(value.getFullYear(), value.getMonth(), value.getDate(), value.getHours(), value.getMinutes(), value.getSeconds()));\n row[column.field] = utcDate;\n break;\n }\n case 'actions':\n break;\n default:\n row[column.field] = api.getCellParams(id, column.field).formattedValue;\n if (process.env.NODE_ENV !== 'production') {\n if (String(cellParams.formattedValue) === '[object Object]') {\n warnInvalidFormattedValue();\n }\n }\n break;\n }\n });\n return {\n row,\n dataValidation,\n outlineLevel,\n mergedCells\n };\n};\nconst defaultColumnsStyles = {\n [GRID_DATE_COL_DEF.type]: {\n numFmt: 'dd.mm.yyyy'\n },\n [GRID_DATETIME_COL_DEF.type]: {\n numFmt: 'dd.mm.yyyy hh:mm'\n }\n};\nexport const serializeColumn = (column, columnsStyles) => {\n var _column$headerName;\n const {\n field,\n type\n } = column;\n return {\n key: field,\n headerText: (_column$headerName = column.headerName) != null ? _column$headerName : column.field,\n // Excel width must stay between 0 and 255 (https://support.microsoft.com/en-us/office/change-the-column-width-and-row-height-72f5e3cc-994d-43e8-ae58-9774a0905f46)\n // From the example of column width behavior (https://docs.microsoft.com/en-US/office/troubleshoot/excel/determine-column-widths#example-of-column-width-behavior)\n // a value of 10 corresponds to 75px. This is an approximation, because column width depends on the font-size\n width: Math.min(255, column.width ? column.width / 7.5 : 8.43),\n style: _extends({}, type && (defaultColumnsStyles == null ? void 0 : defaultColumnsStyles[type]), columnsStyles == null ? void 0 : columnsStyles[field])\n };\n};\nconst addColumnGroupingHeaders = (worksheet, columns, columnGroupPaths, columnGroupDetails) => {\n const maxDepth = Math.max(...columns.map(({\n key\n }) => {\n var _columnGroupPaths$key, _columnGroupPaths$key2;\n return (_columnGroupPaths$key = (_columnGroupPaths$key2 = columnGroupPaths[key]) == null ? void 0 : _columnGroupPaths$key2.length) != null ? _columnGroupPaths$key : 0;\n }));\n if (maxDepth === 0) {\n return;\n }\n for (let rowIndex = 0; rowIndex < maxDepth; rowIndex += 1) {\n const row = columns.map(({\n key\n }) => {\n const groupingPath = columnGroupPaths[key];\n if (groupingPath.length <= rowIndex) {\n return {\n groupId: null,\n parents: groupingPath\n };\n }\n return _extends({}, columnGroupDetails[groupingPath[rowIndex]], {\n parents: groupingPath.slice(0, rowIndex)\n });\n });\n const newRow = worksheet.addRow(row.map(group => {\n var _group$headerName;\n return group.groupId === null ? null : (_group$headerName = group == null ? void 0 : group.headerName) != null ? _group$headerName : group.groupId;\n }));\n\n // use `rowCount`, since worksheet can have additional rows added in `exceljsPreProcess`\n const lastRowIndex = newRow.worksheet.rowCount;\n let leftIndex = 0;\n let rightIndex = 1;\n while (rightIndex < columns.length) {\n const {\n groupId: leftGroupId,\n parents: leftParents\n } = row[leftIndex];\n const {\n groupId: rightGroupId,\n parents: rightParents\n } = row[rightIndex];\n const areInSameGroup = leftGroupId === rightGroupId && leftParents.length === rightParents.length && leftParents.every((leftParent, index) => rightParents[index] === leftParent);\n if (areInSameGroup) {\n rightIndex += 1;\n } else {\n if (rightIndex - leftIndex > 1) {\n worksheet.mergeCells(lastRowIndex, leftIndex + 1, lastRowIndex, rightIndex);\n }\n leftIndex = rightIndex;\n rightIndex += 1;\n }\n }\n if (rightIndex - leftIndex > 1) {\n worksheet.mergeCells(lastRowIndex, leftIndex + 1, lastRowIndex, rightIndex);\n }\n }\n};\nexport function serializeColumns(columns, styles) {\n return columns.map(column => serializeColumn(column, styles));\n}\nexport async function getDataForValueOptionsSheet(columns, valueOptionsSheetName, api) {\n const candidateColumns = columns.filter(column => isSingleSelectColDef(column) && Array.isArray(column.valueOptions));\n\n // Creates a temp worksheet to obtain the column letters\n const excelJS = await getExcelJs();\n const workbook = new excelJS.Workbook();\n const worksheet = workbook.addWorksheet('Sheet1');\n worksheet.columns = candidateColumns.map(column => ({\n key: column.field\n }));\n return candidateColumns.reduce((acc, column) => {\n var _column$headerName2;\n const singleSelectColumn = column;\n const formattedValueOptions = getFormattedValueOptions(singleSelectColumn, singleSelectColumn.valueOptions, api);\n const header = (_column$headerName2 = column.headerName) != null ? _column$headerName2 : column.field;\n const values = [header, ...formattedValueOptions];\n const letter = worksheet.getColumn(column.field).letter;\n const address = `${valueOptionsSheetName}!$${letter}$2:$${letter}$${values.length}`;\n acc[column.field] = {\n values,\n address\n };\n return acc;\n }, {});\n}\nfunction addSerializedRowToWorksheet(serializedRow, worksheet) {\n const {\n row,\n dataValidation,\n outlineLevel,\n mergedCells\n } = serializedRow;\n const newRow = worksheet.addRow(row);\n Object.keys(dataValidation).forEach(field => {\n newRow.getCell(field).dataValidation = _extends({}, dataValidation[field]);\n });\n if (outlineLevel) {\n newRow.outlineLevel = outlineLevel;\n }\n\n // use `rowCount`, since worksheet can have additional rows added in `exceljsPreProcess`\n const lastRowIndex = newRow.worksheet.rowCount;\n mergedCells.forEach(mergedCell => {\n worksheet.mergeCells(lastRowIndex, mergedCell.leftIndex, lastRowIndex, mergedCell.rightIndex);\n });\n}\nasync function createValueOptionsSheetIfNeeded(valueOptionsData, sheetName, workbook) {\n if (Object.keys(valueOptionsData).length === 0) {\n return;\n }\n const valueOptionsWorksheet = workbook.addWorksheet(sheetName);\n valueOptionsWorksheet.columns = Object.keys(valueOptionsData).map(key => ({\n key\n }));\n Object.entries(valueOptionsData).forEach(([field, {\n values\n }]) => {\n valueOptionsWorksheet.getColumn(field).values = values;\n });\n}\nexport async function buildExcel(options, api) {\n const {\n columns,\n rowIds,\n includeHeaders,\n includeColumnGroupsHeaders,\n valueOptionsSheetName = 'Options',\n exceljsPreProcess,\n exceljsPostProcess,\n columnsStyles = {}\n } = options;\n const excelJS = await getExcelJs();\n const workbook = new excelJS.Workbook();\n const worksheet = workbook.addWorksheet('Sheet1');\n const serializedColumns = serializeColumns(columns, columnsStyles);\n worksheet.columns = serializedColumns;\n if (exceljsPreProcess) {\n await exceljsPreProcess({\n workbook,\n worksheet\n });\n }\n if (includeColumnGroupsHeaders) {\n const columnGroupPaths = columns.reduce((acc, column) => {\n acc[column.field] = api.unstable_getColumnGroupPath(column.field);\n return acc;\n }, {});\n addColumnGroupingHeaders(worksheet, serializedColumns, columnGroupPaths, api.unstable_getAllGroupDetails());\n }\n if (includeHeaders) {\n worksheet.addRow(columns.map(column => {\n var _column$headerName3;\n return (_column$headerName3 = column.headerName) != null ? _column$headerName3 : column.field;\n }));\n }\n const valueOptionsData = await getDataForValueOptionsSheet(columns, valueOptionsSheetName, api);\n createValueOptionsSheetIfNeeded(valueOptionsData, valueOptionsSheetName, workbook);\n rowIds.forEach(id => {\n const serializedRow = serializeRow(id, columns, api, valueOptionsData);\n addSerializedRowToWorksheet(serializedRow, worksheet);\n });\n if (exceljsPostProcess) {\n await exceljsPostProcess({\n workbook,\n worksheet\n });\n }\n return workbook;\n}\nexport function setupExcelExportWebWorker(workerOptions = {}) {\n // eslint-disable-next-line no-restricted-globals\n addEventListener('message', async event => {\n var _options$includeHeade;\n const {\n serializedColumns,\n serializedRows,\n options,\n valueOptionsSheetName,\n valueOptionsData,\n columnGroupDetails,\n columnGroupPaths\n } = event.data;\n const {\n exceljsPostProcess,\n exceljsPreProcess\n } = workerOptions;\n const excelJS = await getExcelJs();\n const workbook = new excelJS.Workbook();\n const worksheet = workbook.addWorksheet('Sheet1');\n worksheet.columns = serializedColumns;\n if (exceljsPreProcess) {\n await exceljsPreProcess({\n workbook,\n worksheet\n });\n }\n if (options.includeColumnGroupsHeaders) {\n addColumnGroupingHeaders(worksheet, serializedColumns, columnGroupPaths, columnGroupDetails);\n }\n const includeHeaders = (_options$includeHeade = options.includeHeaders) != null ? _options$includeHeade : true;\n if (includeHeaders) {\n worksheet.addRow(serializedColumns.map(column => column.headerText));\n }\n createValueOptionsSheetIfNeeded(valueOptionsData, valueOptionsSheetName, workbook);\n serializedRows.forEach(serializedRow => {\n addSerializedRowToWorksheet(serializedRow, worksheet);\n });\n if (exceljsPostProcess) {\n await exceljsPostProcess({\n workbook,\n worksheet\n });\n }\n postMessage(await workbook.xlsx.writeBuffer());\n });\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"hideMenu\", \"options\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport MenuItem from '@mui/material/MenuItem';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction GridExcelExportMenuItem(props) {\n const apiRef = useGridApiContext();\n const {\n hideMenu,\n options\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n return /*#__PURE__*/_jsx(MenuItem, _extends({\n onClick: () => {\n apiRef.current.exportDataAsExcel(options);\n hideMenu == null || hideMenu();\n }\n }, other, {\n children: apiRef.current.getLocaleText('toolbarExportExcel')\n }));\n}\nprocess.env.NODE_ENV !== \"production\" ? GridExcelExportMenuItem.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n hideMenu: PropTypes.func,\n options: PropTypes.shape({\n allColumns: PropTypes.bool,\n columnsStyles: PropTypes.object,\n disableToolbarButton: PropTypes.bool,\n exceljsPostProcess: PropTypes.func,\n exceljsPreProcess: PropTypes.func,\n fields: PropTypes.arrayOf(PropTypes.string),\n fileName: PropTypes.string,\n getRowsToExport: PropTypes.func,\n includeColumnGroupsHeaders: PropTypes.bool,\n includeHeaders: PropTypes.bool,\n valueOptionsSheetName: PropTypes.string,\n worker: PropTypes.func\n })\n} : void 0;\nexport { GridExcelExportMenuItem };","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"worker\", \"exceljsPostProcess\", \"exceljsPreProcess\", \"columnsStyles\", \"includeHeaders\", \"getRowsToExport\", \"valueOptionsSheetName\"];\nimport * as React from 'react';\nimport { useGridApiMethod, useGridLogger, useGridApiOptionHandler } from '@mui/x-data-grid';\nimport { useGridRegisterPipeProcessor, exportAs, getColumnsToExport, defaultGetRowsToExport } from '@mui/x-data-grid/internals';\nimport { buildExcel, getDataForValueOptionsSheet, serializeColumns, serializeRow } from './serializer/excelSerializer';\nimport { GridExcelExportMenuItem } from '../../../components';\n\n/**\n * @requires useGridColumns (state)\n * @requires useGridFilter (state)\n * @requires useGridSorting (state)\n * @requires useGridSelection (state)\n * @requires useGridParamsApi (method)\n */\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const useGridExcelExport = (apiRef, props) => {\n const logger = useGridLogger(apiRef, 'useGridExcelExport');\n const getDataAsExcel = React.useCallback((options = {}) => {\n var _options$getRowsToExp, _options$includeHeade, _options$includeColum;\n logger.debug(`Get data as excel`);\n const getRowsToExport = (_options$getRowsToExp = options.getRowsToExport) != null ? _options$getRowsToExp : defaultGetRowsToExport;\n const exportedRowIds = getRowsToExport({\n apiRef\n });\n const exportedColumns = getColumnsToExport({\n apiRef,\n options\n });\n return buildExcel({\n columns: exportedColumns,\n rowIds: exportedRowIds,\n includeHeaders: (_options$includeHeade = options.includeHeaders) != null ? _options$includeHeade : true,\n includeColumnGroupsHeaders: (_options$includeColum = options.includeColumnGroupsHeaders) != null ? _options$includeColum : true,\n valueOptionsSheetName: (options == null ? void 0 : options.valueOptionsSheetName) || 'Options',\n columnsStyles: options == null ? void 0 : options.columnsStyles,\n exceljsPreProcess: options == null ? void 0 : options.exceljsPreProcess,\n exceljsPostProcess: options == null ? void 0 : options.exceljsPostProcess\n }, apiRef.current);\n }, [logger, apiRef]);\n const exportDataAsExcel = React.useCallback(async (options = {}) => {\n const {\n worker: workerFn,\n exceljsPostProcess,\n exceljsPreProcess,\n getRowsToExport = defaultGetRowsToExport,\n valueOptionsSheetName = 'Options'\n } = options,\n cloneableOptions = _objectWithoutPropertiesLoose(options, _excluded);\n const sendExcelToUser = buffer => {\n const blob = new Blob([buffer], {\n type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'\n });\n exportAs(blob, 'xlsx', options == null ? void 0 : options.fileName);\n };\n if (!workerFn) {\n apiRef.current.publishEvent('excelExportStateChange', 'pending');\n const workbook = await getDataAsExcel(options);\n if (workbook === null) {\n return;\n }\n const content = await workbook.xlsx.writeBuffer();\n apiRef.current.publishEvent('excelExportStateChange', 'finished');\n sendExcelToUser(content);\n return;\n }\n if (exceljsPostProcess && process.env.NODE_ENV !== 'production') {\n console.warn([`MUI: The exceljsPostProcess option is not supported when a web worker is used.`, 'As alternative, pass the callback to the same option in setupExcelExportWebWorker.'].join('\\n'));\n }\n if (exceljsPreProcess && process.env.NODE_ENV !== 'production') {\n console.warn([`MUI: The exceljsPreProcess option is not supported when a web worker is used.`, 'As alternative, pass the callback to the same option in setupExcelExportWebWorker.'].join('\\n'));\n }\n const worker = workerFn();\n apiRef.current.publishEvent('excelExportStateChange', 'pending');\n worker.onmessage = async event => {\n sendExcelToUser(event.data);\n apiRef.current.publishEvent('excelExportStateChange', 'finished');\n worker.terminate();\n };\n const exportedRowIds = getRowsToExport({\n apiRef\n });\n const exportedColumns = getColumnsToExport({\n apiRef,\n options\n });\n const valueOptionsData = await getDataForValueOptionsSheet(exportedColumns, valueOptionsSheetName, apiRef.current);\n const serializedColumns = serializeColumns(exportedColumns, options.columnsStyles || {});\n const serializedRows = exportedRowIds.map(id => serializeRow(id, exportedColumns, apiRef.current, valueOptionsData));\n const columnGroupPaths = exportedColumns.reduce((acc, column) => {\n acc[column.field] = apiRef.current.unstable_getColumnGroupPath(column.field);\n return acc;\n }, {});\n const message = {\n serializedColumns,\n serializedRows,\n valueOptionsData,\n columnGroupPaths,\n columnGroupDetails: apiRef.current.unstable_getAllGroupDetails(),\n options: cloneableOptions,\n valueOptionsSheetName\n };\n worker.postMessage(message);\n }, [apiRef, getDataAsExcel]);\n const excelExportApi = {\n getDataAsExcel,\n exportDataAsExcel\n };\n useGridApiMethod(apiRef, excelExportApi, 'public');\n\n /**\n * PRE-PROCESSING\n */\n const addExportMenuButtons = React.useCallback((initialValue, options) => {\n var _options$excelOptions;\n if ((_options$excelOptions = options.excelOptions) != null && _options$excelOptions.disableToolbarButton) {\n return initialValue;\n }\n return [...initialValue, {\n component: /*#__PURE__*/_jsx(GridExcelExportMenuItem, {\n options: options.excelOptions\n }),\n componentName: 'excelExport'\n }];\n }, []);\n useGridRegisterPipeProcessor(apiRef, 'exportMenu', addExportMenuButtons);\n useGridApiOptionHandler(apiRef, 'excelExportStateChange', props.onExcelExportStateChange);\n};","export const gridCellSelectionStateSelector = state => state.cellSelection;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { ownerDocument, useEventCallback } from '@mui/material/utils';\nimport { isNavigationKey, serializeCellValue, useGridRegisterPipeProcessor, useGridVisibleRows } from '@mui/x-data-grid-pro/internals';\nimport { useGridApiEventHandler, useGridApiMethod, GRID_ACTIONS_COLUMN_TYPE, GRID_CHECKBOX_SELECTION_COL_DEF, GRID_DETAIL_PANEL_TOGGLE_FIELD, gridRowsDataRowIdToIdLookupSelector, gridClasses, gridFocusCellSelector } from '@mui/x-data-grid-pro';\nimport { gridCellSelectionStateSelector } from './gridCellSelectionSelector';\nexport const cellSelectionStateInitializer = (state, props) => {\n var _props$unstable_cellS, _props$initialState;\n return _extends({}, state, {\n cellSelection: _extends({}, (_props$unstable_cellS = props.unstable_cellSelectionModel) != null ? _props$unstable_cellS : (_props$initialState = props.initialState) == null ? void 0 : _props$initialState.cellSelection)\n });\n};\nfunction isKeyboardEvent(event) {\n return !!event.key;\n}\nconst AUTO_SCROLL_SENSITIVITY = 50; // The distance from the edge to start scrolling\nconst AUTO_SCROLL_SPEED = 20; // The speed to scroll once the mouse enters the sensitivity area\n\nexport const useGridCellSelection = (apiRef, props) => {\n const visibleRows = useGridVisibleRows(apiRef, props);\n const cellWithVirtualFocus = React.useRef();\n const lastMouseDownCell = React.useRef();\n const mousePosition = React.useRef(null);\n const autoScrollRAF = React.useRef();\n const ignoreValueFormatterProp = props.unstable_ignoreValueFormatterDuringExport;\n const ignoreValueFormatter = (typeof ignoreValueFormatterProp === 'object' ? ignoreValueFormatterProp == null ? void 0 : ignoreValueFormatterProp.clipboardExport : ignoreValueFormatterProp) || false;\n const clipboardCopyCellDelimiter = props.clipboardCopyCellDelimiter;\n apiRef.current.registerControlState({\n stateId: 'cellSelection',\n propModel: props.unstable_cellSelectionModel,\n propOnChange: props.unstable_onCellSelectionModelChange,\n stateSelector: gridCellSelectionStateSelector,\n changeEvent: 'cellSelectionChange'\n });\n const runIfCellSelectionIsEnabled = callback => (...args) => {\n if (props.unstable_cellSelection) {\n callback(...args);\n }\n };\n const isCellSelected = React.useCallback((id, field) => {\n if (!props.unstable_cellSelection) {\n return false;\n }\n const cellSelectionModel = gridCellSelectionStateSelector(apiRef.current.state);\n return cellSelectionModel[id] ? !!cellSelectionModel[id][field] : false;\n }, [apiRef, props.unstable_cellSelection]);\n const getCellSelectionModel = React.useCallback(() => {\n return gridCellSelectionStateSelector(apiRef.current.state);\n }, [apiRef]);\n const setCellSelectionModel = React.useCallback(newModel => {\n if (!props.unstable_cellSelection) {\n return;\n }\n apiRef.current.setState(prevState => _extends({}, prevState, {\n cellSelection: newModel\n }));\n apiRef.current.forceUpdate();\n }, [apiRef, props.unstable_cellSelection]);\n const selectCellRange = React.useCallback((start, end, keepOtherSelected = false) => {\n const startRowIndex = apiRef.current.getRowIndexRelativeToVisibleRows(start.id);\n const startColumnIndex = apiRef.current.getColumnIndex(start.field);\n const endRowIndex = apiRef.current.getRowIndexRelativeToVisibleRows(end.id);\n const endColumnIndex = apiRef.current.getColumnIndex(end.field);\n let finalStartRowIndex = startRowIndex;\n let finalStartColumnIndex = startColumnIndex;\n let finalEndRowIndex = endRowIndex;\n let finalEndColumnIndex = endColumnIndex;\n if (finalStartRowIndex > finalEndRowIndex) {\n finalStartRowIndex = endRowIndex;\n finalEndRowIndex = startRowIndex;\n }\n if (finalStartColumnIndex > finalEndColumnIndex) {\n finalStartColumnIndex = endColumnIndex;\n finalEndColumnIndex = startColumnIndex;\n }\n const visibleColumns = apiRef.current.getVisibleColumns();\n const rowsInRange = visibleRows.rows.slice(finalStartRowIndex, finalEndRowIndex + 1);\n const columnsInRange = visibleColumns.slice(finalStartColumnIndex, finalEndColumnIndex + 1);\n const newModel = keepOtherSelected ? apiRef.current.unstable_getCellSelectionModel() : {};\n rowsInRange.forEach(row => {\n if (!newModel[row.id]) {\n newModel[row.id] = {};\n }\n columnsInRange.forEach(column => {\n newModel[row.id][column.field] = true;\n }, {});\n });\n apiRef.current.unstable_setCellSelectionModel(newModel);\n }, [apiRef, visibleRows.rows]);\n const getSelectedCellsAsArray = React.useCallback(() => {\n const model = apiRef.current.unstable_getCellSelectionModel();\n const idToIdLookup = gridRowsDataRowIdToIdLookupSelector(apiRef);\n return Object.entries(model).reduce((acc, [id, fields]) => [...acc, ...Object.entries(fields).reduce((acc2, [field, isSelected]) => {\n return isSelected ? [...acc2, {\n id: idToIdLookup[id],\n field\n }] : acc2;\n }, [])], []);\n }, [apiRef]);\n const cellSelectionApi = {\n unstable_isCellSelected: isCellSelected,\n unstable_getCellSelectionModel: getCellSelectionModel,\n unstable_setCellSelectionModel: setCellSelectionModel,\n unstable_selectCellRange: selectCellRange,\n unstable_getSelectedCellsAsArray: getSelectedCellsAsArray\n };\n useGridApiMethod(apiRef, cellSelectionApi, 'public');\n const hasClickedValidCellForRangeSelection = React.useCallback(params => {\n if (params.field === GRID_CHECKBOX_SELECTION_COL_DEF.field) {\n return false;\n }\n if (params.field === GRID_DETAIL_PANEL_TOGGLE_FIELD) {\n return false;\n }\n const column = apiRef.current.getColumn(params.field);\n if (column.type === GRID_ACTIONS_COLUMN_TYPE) {\n return false;\n }\n return params.rowNode.type !== 'pinnedRow';\n }, [apiRef]);\n const handleMouseUp = useEventCallback(() => {\n var _apiRef$current$rootE;\n lastMouseDownCell.current = null;\n (_apiRef$current$rootE = apiRef.current.rootElementRef) == null || (_apiRef$current$rootE = _apiRef$current$rootE.current) == null || _apiRef$current$rootE.classList.remove(gridClasses['root--disableUserSelection']);\n\n // eslint-disable-next-line @typescript-eslint/no-use-before-define\n stopAutoScroll();\n });\n const handleCellMouseDown = React.useCallback((params, event) => {\n var _apiRef$current$rootE2, _apiRef$current$rootE3;\n // Skip if the click comes from the right-button or, only on macOS, Ctrl is pressed\n // Fix for https://github.com/mui/mui-x/pull/6567#issuecomment-1329155578\n const isMacOs = window.navigator.platform.toUpperCase().indexOf('MAC') >= 0;\n if (event.button !== 0 || event.ctrlKey && isMacOs) {\n return;\n }\n const focusedCell = gridFocusCellSelector(apiRef);\n if (hasClickedValidCellForRangeSelection(params) && event.shiftKey && focusedCell) {\n event.preventDefault();\n }\n lastMouseDownCell.current = {\n id: params.id,\n field: params.field\n };\n (_apiRef$current$rootE2 = apiRef.current.rootElementRef) == null || (_apiRef$current$rootE2 = _apiRef$current$rootE2.current) == null || _apiRef$current$rootE2.classList.add(gridClasses['root--disableUserSelection']);\n const document = ownerDocument((_apiRef$current$rootE3 = apiRef.current.rootElementRef) == null ? void 0 : _apiRef$current$rootE3.current);\n document.addEventListener('mouseup', handleMouseUp, {\n once: true\n });\n }, [apiRef, handleMouseUp, hasClickedValidCellForRangeSelection]);\n const stopAutoScroll = React.useCallback(() => {\n if (autoScrollRAF.current) {\n cancelAnimationFrame(autoScrollRAF.current);\n autoScrollRAF.current = null;\n }\n }, []);\n const handleCellFocusIn = React.useCallback(params => {\n cellWithVirtualFocus.current = {\n id: params.id,\n field: params.field\n };\n }, []);\n const startAutoScroll = React.useCallback(() => {\n var _apiRef$current$virtu, _apiRef$current$virtu2;\n if (autoScrollRAF.current) {\n return;\n }\n if (!((_apiRef$current$virtu = apiRef.current.virtualScrollerRef) != null && _apiRef$current$virtu.current)) {\n return;\n }\n const virtualScrollerRect = (_apiRef$current$virtu2 = apiRef.current.virtualScrollerRef) == null || (_apiRef$current$virtu2 = _apiRef$current$virtu2.current) == null ? void 0 : _apiRef$current$virtu2.getBoundingClientRect();\n if (!virtualScrollerRect) {\n return;\n }\n function autoScroll() {\n var _apiRef$current$virtu3;\n if (!mousePosition.current || !((_apiRef$current$virtu3 = apiRef.current.virtualScrollerRef) != null && _apiRef$current$virtu3.current)) {\n return;\n }\n const {\n x: mouseX,\n y: mouseY\n } = mousePosition.current;\n const {\n height,\n width\n } = virtualScrollerRect;\n let deltaX = 0;\n let deltaY = 0;\n let factor = 0;\n const dimensions = apiRef.current.getRootDimensions();\n if (mouseY <= AUTO_SCROLL_SENSITIVITY && dimensions != null && dimensions.hasScrollY) {\n // When scrolling up, the multiplier increases going closer to the top edge\n factor = (AUTO_SCROLL_SENSITIVITY - mouseY) / -AUTO_SCROLL_SENSITIVITY;\n deltaY = AUTO_SCROLL_SPEED;\n } else if (mouseY >= height - AUTO_SCROLL_SENSITIVITY && dimensions != null && dimensions.hasScrollY) {\n // When scrolling down, the multiplier increases going closer to the bottom edge\n factor = (mouseY - (height - AUTO_SCROLL_SENSITIVITY)) / AUTO_SCROLL_SENSITIVITY;\n deltaY = AUTO_SCROLL_SPEED;\n } else if (mouseX <= AUTO_SCROLL_SENSITIVITY && dimensions != null && dimensions.hasScrollX) {\n // When scrolling left, the multiplier increases going closer to the left edge\n factor = (AUTO_SCROLL_SENSITIVITY - mouseX) / -AUTO_SCROLL_SENSITIVITY;\n deltaX = AUTO_SCROLL_SPEED;\n } else if (mouseX >= width - AUTO_SCROLL_SENSITIVITY && dimensions != null && dimensions.hasScrollX) {\n // When scrolling right, the multiplier increases going closer to the right edge\n factor = (mouseX - (width - AUTO_SCROLL_SENSITIVITY)) / AUTO_SCROLL_SENSITIVITY;\n deltaX = AUTO_SCROLL_SPEED;\n }\n if (deltaX !== 0 || deltaY !== 0) {\n const {\n scrollLeft,\n scrollTop\n } = apiRef.current.virtualScrollerRef.current;\n apiRef.current.scroll({\n top: scrollTop + deltaY * factor,\n left: scrollLeft + deltaX * factor\n });\n }\n autoScrollRAF.current = requestAnimationFrame(autoScroll);\n }\n autoScroll();\n }, [apiRef]);\n const handleCellMouseOver = React.useCallback((params, event) => {\n var _apiRef$current$virtu4;\n if (!lastMouseDownCell.current) {\n return;\n }\n const {\n id,\n field\n } = params;\n apiRef.current.unstable_selectCellRange(lastMouseDownCell.current, {\n id,\n field\n }, event.ctrlKey || event.metaKey);\n const virtualScrollerRect = (_apiRef$current$virtu4 = apiRef.current.virtualScrollerRef) == null || (_apiRef$current$virtu4 = _apiRef$current$virtu4.current) == null ? void 0 : _apiRef$current$virtu4.getBoundingClientRect();\n if (!virtualScrollerRect) {\n return;\n }\n const {\n height,\n width,\n x,\n y\n } = virtualScrollerRect;\n const mouseX = event.clientX - x;\n const mouseY = event.clientY - y;\n mousePosition.current = {\n x: mouseX,\n y: mouseY\n };\n const hasEnteredVerticalSensitivityArea = mouseY <= AUTO_SCROLL_SENSITIVITY || mouseY >= height - AUTO_SCROLL_SENSITIVITY;\n const hasEnteredHorizontalSensitivityArea = mouseX <= AUTO_SCROLL_SENSITIVITY || mouseX >= width - AUTO_SCROLL_SENSITIVITY;\n const hasEnteredSensitivityArea = hasEnteredVerticalSensitivityArea || hasEnteredHorizontalSensitivityArea;\n if (hasEnteredSensitivityArea) {\n // Mouse has entered the sensitity area for the first time\n startAutoScroll();\n } else {\n // Mouse has left the sensitivity area while auto scroll is on\n stopAutoScroll();\n }\n }, [apiRef, startAutoScroll, stopAutoScroll]);\n const handleCellClick = useEventCallback((params, event) => {\n const {\n id,\n field\n } = params;\n if (!hasClickedValidCellForRangeSelection(params)) {\n return;\n }\n const focusedCell = gridFocusCellSelector(apiRef);\n if (event.shiftKey && focusedCell) {\n apiRef.current.unstable_selectCellRange(focusedCell, {\n id,\n field\n });\n cellWithVirtualFocus.current = {\n id,\n field\n };\n return;\n }\n if (event.ctrlKey || event.metaKey) {\n // Add the clicked cell to the selection\n const prevModel = apiRef.current.unstable_getCellSelectionModel();\n apiRef.current.unstable_setCellSelectionModel(_extends({}, prevModel, {\n [id]: _extends({}, prevModel[id], {\n [field]: !apiRef.current.unstable_isCellSelected(id, field)\n })\n }));\n } else {\n // Clear the selection and keep only the clicked cell selected\n apiRef.current.unstable_setCellSelectionModel({\n [id]: {\n [field]: true\n }\n });\n }\n });\n const handleCellKeyDown = useEventCallback((params, event) => {\n if (!isNavigationKey(event.key) || !cellWithVirtualFocus.current) {\n return;\n }\n if (!event.shiftKey) {\n apiRef.current.unstable_setCellSelectionModel({});\n return;\n }\n const {\n current: otherCell\n } = cellWithVirtualFocus;\n let endRowIndex = apiRef.current.getRowIndexRelativeToVisibleRows(otherCell.id);\n let endColumnIndex = apiRef.current.getColumnIndex(otherCell.field);\n if (event.key === 'ArrowDown') {\n endRowIndex += 1;\n } else if (event.key === 'ArrowUp') {\n endRowIndex -= 1;\n } else if (event.key === 'ArrowRight') {\n endColumnIndex += 1;\n } else if (event.key === 'ArrowLeft') {\n endColumnIndex -= 1;\n }\n if (endRowIndex < 0 || endRowIndex >= visibleRows.rows.length) {\n return;\n }\n const visibleColumns = apiRef.current.getVisibleColumns();\n if (endColumnIndex < 0 || endColumnIndex >= visibleColumns.length) {\n return;\n }\n cellWithVirtualFocus.current = {\n id: visibleRows.rows[endRowIndex].id,\n field: visibleColumns[endColumnIndex].field\n };\n apiRef.current.scrollToIndexes({\n rowIndex: endRowIndex,\n colIndex: endColumnIndex\n });\n const {\n id,\n field\n } = params;\n apiRef.current.unstable_selectCellRange({\n id,\n field\n }, cellWithVirtualFocus.current);\n });\n useGridApiEventHandler(apiRef, 'cellClick', runIfCellSelectionIsEnabled(handleCellClick));\n useGridApiEventHandler(apiRef, 'cellFocusIn', runIfCellSelectionIsEnabled(handleCellFocusIn));\n useGridApiEventHandler(apiRef, 'cellKeyDown', runIfCellSelectionIsEnabled(handleCellKeyDown));\n useGridApiEventHandler(apiRef, 'cellMouseDown', runIfCellSelectionIsEnabled(handleCellMouseDown));\n useGridApiEventHandler(apiRef, 'cellMouseOver', runIfCellSelectionIsEnabled(handleCellMouseOver));\n React.useEffect(() => {\n if (props.unstable_cellSelectionModel) {\n apiRef.current.unstable_setCellSelectionModel(props.unstable_cellSelectionModel);\n }\n }, [apiRef, props.unstable_cellSelectionModel]);\n React.useEffect(() => {\n var _apiRef$current$rootE4;\n const rootRef = (_apiRef$current$rootE4 = apiRef.current.rootElementRef) == null ? void 0 : _apiRef$current$rootE4.current;\n return () => {\n stopAutoScroll();\n const document = ownerDocument(rootRef);\n document.removeEventListener('mouseup', handleMouseUp);\n };\n }, [apiRef, handleMouseUp, stopAutoScroll]);\n const checkIfCellIsSelected = React.useCallback((isSelected, {\n id,\n field\n }) => {\n return apiRef.current.unstable_isCellSelected(id, field);\n }, [apiRef]);\n const addClassesToCells = React.useCallback((classes, {\n id,\n field\n }) => {\n const newClasses = [...classes];\n if (!visibleRows.range || !apiRef.current.unstable_isCellSelected(id, field)) {\n return classes;\n }\n const rowIndex = apiRef.current.getRowIndexRelativeToVisibleRows(id);\n const columnIndex = apiRef.current.getColumnIndex(field);\n const visibleColumns = apiRef.current.getVisibleColumns();\n if (rowIndex > 0) {\n const {\n id: previousRowId\n } = visibleRows.rows[rowIndex - 1];\n if (!apiRef.current.unstable_isCellSelected(previousRowId, field)) {\n newClasses.push(gridClasses['cell--rangeTop']);\n }\n } else {\n newClasses.push(gridClasses['cell--rangeTop']);\n }\n if (rowIndex + visibleRows.range.firstRowIndex < visibleRows.range.lastRowIndex) {\n const {\n id: nextRowId\n } = visibleRows.rows[rowIndex + 1];\n if (!apiRef.current.unstable_isCellSelected(nextRowId, field)) {\n newClasses.push(gridClasses['cell--rangeBottom']);\n }\n } else {\n newClasses.push(gridClasses['cell--rangeBottom']);\n }\n if (columnIndex > 0) {\n const {\n field: previousColumnField\n } = visibleColumns[columnIndex - 1];\n if (!apiRef.current.unstable_isCellSelected(id, previousColumnField)) {\n newClasses.push(gridClasses['cell--rangeLeft']);\n }\n } else {\n newClasses.push(gridClasses['cell--rangeLeft']);\n }\n if (columnIndex < visibleColumns.length - 1) {\n const {\n field: nextColumnField\n } = visibleColumns[columnIndex + 1];\n if (!apiRef.current.unstable_isCellSelected(id, nextColumnField)) {\n newClasses.push(gridClasses['cell--rangeRight']);\n }\n } else {\n newClasses.push(gridClasses['cell--rangeRight']);\n }\n return newClasses;\n }, [apiRef, visibleRows.range, visibleRows.rows]);\n const canUpdateFocus = React.useCallback((initialValue, {\n event,\n cell\n }) => {\n if (!cell || !props.unstable_cellSelection || !event.shiftKey) {\n return initialValue;\n }\n if (isKeyboardEvent(event)) {\n return isNavigationKey(event.key) ? false : initialValue;\n }\n const focusedCell = gridFocusCellSelector(apiRef);\n if (hasClickedValidCellForRangeSelection(cell) && focusedCell) {\n return false;\n }\n return initialValue;\n }, [apiRef, props.unstable_cellSelection, hasClickedValidCellForRangeSelection]);\n const handleClipboardCopy = React.useCallback(value => {\n if (apiRef.current.unstable_getSelectedCellsAsArray().length <= 1) {\n return value;\n }\n const cellSelectionModel = apiRef.current.unstable_getCellSelectionModel();\n const copyData = Object.keys(cellSelectionModel).reduce((acc, rowId) => {\n const fieldsMap = cellSelectionModel[rowId];\n const rowString = Object.keys(fieldsMap).reduce((acc2, field) => {\n let cellData;\n if (fieldsMap[field]) {\n const cellParams = apiRef.current.getCellParams(rowId, field);\n cellData = serializeCellValue(cellParams, {\n delimiterCharacter: clipboardCopyCellDelimiter,\n ignoreValueFormatter\n });\n } else {\n cellData = '';\n }\n return acc2 === '' ? cellData : [acc2, cellData].join(clipboardCopyCellDelimiter);\n }, '');\n return acc === '' ? rowString : [acc, rowString].join('\\r\\n');\n }, '');\n return copyData;\n }, [apiRef, ignoreValueFormatter, clipboardCopyCellDelimiter]);\n useGridRegisterPipeProcessor(apiRef, 'isCellSelected', checkIfCellIsSelected);\n useGridRegisterPipeProcessor(apiRef, 'cellClassName', addClassesToCells);\n useGridRegisterPipeProcessor(apiRef, 'canUpdateFocus', canUpdateFocus);\n useGridRegisterPipeProcessor(apiRef, 'clipboardCopy', handleClipboardCopy);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { GRID_CHECKBOX_SELECTION_FIELD, gridFocusCellSelector, gridVisibleColumnFieldsSelector, useGridApiOptionHandler, useGridApiEventHandler, gridPaginatedVisibleSortedGridRowIdsSelector, gridExpandedSortedRowIdsSelector } from '@mui/x-data-grid';\nimport { buildWarning, getRowIdFromRowModel, getActiveElement, useGridRegisterPipeProcessor, getPublicApiRef } from '@mui/x-data-grid/internals';\nimport { GRID_DETAIL_PANEL_TOGGLE_FIELD, GRID_REORDER_COL_DEF } from '@mui/x-data-grid-pro';\nimport { unstable_debounce as debounce } from '@mui/utils';\nconst missingOnProcessRowUpdateErrorWarning = buildWarning(['MUI: A call to `processRowUpdate` threw an error which was not handled because `onProcessRowUpdateError` is missing.', 'To handle the error pass a callback to the `onProcessRowUpdateError` prop, e.g. ` ...} />`.', 'For more detail, see http://mui.com/components/data-grid/editing/#server-side-persistence.'], 'error');\nconst columnFieldsToExcludeFromPaste = [GRID_CHECKBOX_SELECTION_FIELD, GRID_REORDER_COL_DEF.field, GRID_DETAIL_PANEL_TOGGLE_FIELD];\n\n// Batches rows that are updated during clipboard paste to reduce `updateRows` calls\nfunction batchRowUpdates(func, wait) {\n let rows = [];\n const debounced = debounce(() => {\n func(rows);\n rows = [];\n }, wait);\n return row => {\n rows.push(row);\n debounced();\n };\n}\nasync function getTextFromClipboard(rootEl) {\n return new Promise(resolve => {\n const focusedCell = getActiveElement(document);\n const el = document.createElement('input');\n el.style.width = '0px';\n el.style.height = '0px';\n el.style.border = 'none';\n el.style.margin = '0';\n el.style.padding = '0';\n el.style.outline = 'none';\n el.style.position = 'absolute';\n el.style.top = '0';\n el.style.left = '0';\n const handlePasteEvent = event => {\n var _event$clipboardData;\n el.removeEventListener('paste', handlePasteEvent);\n const text = (_event$clipboardData = event.clipboardData) == null ? void 0 : _event$clipboardData.getData('text/plain');\n if (focusedCell instanceof HTMLElement) {\n focusedCell.focus({\n preventScroll: true\n });\n }\n el.remove();\n resolve(text || '');\n };\n el.addEventListener('paste', handlePasteEvent);\n rootEl.appendChild(el);\n el.focus({\n preventScroll: true\n });\n });\n}\n\n// Keeps track of updated rows during clipboard paste\nclass CellValueUpdater {\n constructor(options) {\n this.rowsToUpdate = {};\n this.updateRow = void 0;\n this.options = void 0;\n this.options = options;\n this.updateRow = batchRowUpdates(options.apiRef.current.updateRows, 50);\n }\n updateCell({\n rowId,\n field,\n pastedCellValue\n }) {\n if (pastedCellValue === undefined) {\n return;\n }\n const {\n apiRef,\n getRowId\n } = this.options;\n const colDef = apiRef.current.getColumn(field);\n if (!colDef || !colDef.editable) {\n return;\n }\n const row = this.rowsToUpdate[rowId] || _extends({}, apiRef.current.getRow(rowId));\n if (!row) {\n return;\n }\n const cellParams = apiRef.current.getCellParams(rowId, field);\n let parsedValue = pastedCellValue;\n if (colDef.pastedValueParser) {\n parsedValue = colDef.pastedValueParser(pastedCellValue, cellParams);\n } else if (colDef.valueParser) {\n parsedValue = colDef.valueParser(parsedValue, cellParams);\n }\n if (parsedValue === undefined) {\n return;\n }\n let rowCopy = _extends({}, row);\n if (typeof colDef.valueSetter === 'function') {\n rowCopy = colDef.valueSetter({\n value: parsedValue,\n row: rowCopy\n });\n } else {\n rowCopy[field] = parsedValue;\n }\n const newRowId = getRowIdFromRowModel(rowCopy, getRowId);\n if (String(newRowId) !== String(rowId)) {\n // We cannot update row id, so this cell value update should be ignored\n return;\n }\n this.rowsToUpdate[rowId] = rowCopy;\n }\n applyUpdates() {\n const {\n apiRef,\n processRowUpdate,\n onProcessRowUpdateError\n } = this.options;\n const rowsToUpdate = this.rowsToUpdate;\n const rowIdsToUpdate = Object.keys(rowsToUpdate);\n if (rowIdsToUpdate.length === 0) {\n apiRef.current.publishEvent('clipboardPasteEnd');\n return;\n }\n const handleRowUpdate = async rowId => {\n const newRow = rowsToUpdate[rowId];\n if (typeof processRowUpdate === 'function') {\n const handleError = errorThrown => {\n if (onProcessRowUpdateError) {\n onProcessRowUpdateError(errorThrown);\n } else {\n missingOnProcessRowUpdateErrorWarning();\n }\n };\n try {\n const oldRow = apiRef.current.getRow(rowId);\n const finalRowUpdate = await processRowUpdate(newRow, oldRow);\n this.updateRow(finalRowUpdate);\n } catch (error) {\n handleError(error);\n }\n } else {\n this.updateRow(newRow);\n }\n };\n const promises = rowIdsToUpdate.map(rowId => {\n // Wrap in promise that always resolves to avoid Promise.all from stopping on first error.\n // This is to avoid using `Promise.allSettled` that has worse browser support.\n return new Promise(resolve => {\n handleRowUpdate(rowId).then(resolve).catch(resolve);\n });\n });\n Promise.all(promises).then(() => {\n this.rowsToUpdate = {};\n apiRef.current.publishEvent('clipboardPasteEnd');\n });\n }\n}\nfunction defaultPasteResolver({\n pastedData,\n apiRef,\n updateCell,\n pagination\n}) {\n const isSingleValuePasted = pastedData.length === 1 && pastedData[0].length === 1;\n const cellSelectionModel = apiRef.current.unstable_getCellSelectionModel();\n if (cellSelectionModel && apiRef.current.unstable_getSelectedCellsAsArray().length > 1) {\n Object.keys(cellSelectionModel).forEach((rowId, rowIndex) => {\n const rowDataArr = pastedData[isSingleValuePasted ? 0 : rowIndex];\n const hasRowData = isSingleValuePasted ? true : rowDataArr !== undefined;\n if (!hasRowData) {\n return;\n }\n Object.keys(cellSelectionModel[rowId]).forEach((field, colIndex) => {\n const cellValue = isSingleValuePasted ? rowDataArr[0] : rowDataArr[colIndex];\n updateCell({\n rowId,\n field,\n pastedCellValue: cellValue\n });\n });\n });\n return;\n }\n const visibleColumnFields = gridVisibleColumnFieldsSelector(apiRef).filter(field => {\n if (columnFieldsToExcludeFromPaste.includes(field)) {\n return false;\n }\n return true;\n });\n const selectedRows = apiRef.current.getSelectedRows();\n if (selectedRows.size > 0 && !isSingleValuePasted) {\n // Multiple values are pasted starting from the first and top-most cell\n const pastedRowsDataCount = pastedData.length;\n\n // There's no guarantee that the selected rows are in the same order as the pasted rows\n selectedRows.forEach((row, rowId) => {\n let rowData;\n if (pastedRowsDataCount === 1) {\n // If only one row is pasted - paste it to all selected rows\n rowData = pastedData[0];\n } else {\n rowData = pastedData.shift();\n }\n if (rowData === undefined) {\n return;\n }\n rowData.forEach((newCellValue, cellIndex) => {\n updateCell({\n rowId,\n field: visibleColumnFields[cellIndex],\n pastedCellValue: newCellValue\n });\n });\n });\n return;\n }\n const selectedCell = gridFocusCellSelector(apiRef);\n if (!selectedCell) {\n return;\n }\n if (columnFieldsToExcludeFromPaste.includes(selectedCell.field)) {\n return;\n }\n const selectedRowId = selectedCell.id;\n const selectedRowIndex = apiRef.current.getRowIndexRelativeToVisibleRows(selectedRowId);\n const visibleRowIds = pagination ? gridPaginatedVisibleSortedGridRowIdsSelector(apiRef) : gridExpandedSortedRowIdsSelector(apiRef);\n const selectedFieldIndex = visibleColumnFields.indexOf(selectedCell.field);\n pastedData.forEach((rowData, index) => {\n const rowId = visibleRowIds[selectedRowIndex + index];\n if (typeof rowId === 'undefined') {\n return;\n }\n for (let i = selectedFieldIndex; i < visibleColumnFields.length; i += 1) {\n const field = visibleColumnFields[i];\n const stringValue = rowData[i - selectedFieldIndex];\n updateCell({\n rowId,\n field,\n pastedCellValue: stringValue\n });\n }\n });\n}\nfunction isPasteShortcut(event) {\n return (event.ctrlKey || event.metaKey) && event.key === 'v';\n}\nexport const useGridClipboardImport = (apiRef, props) => {\n var _ref, _props$experimentalFe, _apiRef$current$rootE;\n const processRowUpdate = props.processRowUpdate;\n const onProcessRowUpdateError = props.onProcessRowUpdateError;\n const getRowId = props.getRowId;\n const enableClipboardPaste = (_ref = !props.disableClipboardPaste && ((_props$experimentalFe = props.experimentalFeatures) == null ? void 0 : _props$experimentalFe.clipboardPaste)) != null ? _ref : false;\n const rootEl = (_apiRef$current$rootE = apiRef.current.rootElementRef) == null ? void 0 : _apiRef$current$rootE.current;\n const splitClipboardPastedText = props.unstable_splitClipboardPastedText;\n const handlePaste = React.useCallback(async (params, event) => {\n if (!enableClipboardPaste) {\n return;\n }\n if (!isPasteShortcut(event)) {\n return;\n }\n const focusedCell = gridFocusCellSelector(apiRef);\n if (focusedCell !== null) {\n const cellMode = apiRef.current.getCellMode(focusedCell.id, focusedCell.field);\n if (cellMode === 'edit') {\n // Do not paste data when the cell is in edit mode\n return;\n }\n }\n if (!rootEl) {\n return;\n }\n const text = await getTextFromClipboard(rootEl);\n if (!text) {\n return;\n }\n const pastedData = splitClipboardPastedText(text);\n if (!pastedData) {\n return;\n }\n const cellUpdater = new CellValueUpdater({\n apiRef,\n processRowUpdate,\n onProcessRowUpdateError,\n getRowId\n });\n apiRef.current.publishEvent('clipboardPasteStart', {\n data: pastedData\n });\n defaultPasteResolver({\n pastedData,\n apiRef: getPublicApiRef(apiRef),\n updateCell: (...args) => {\n cellUpdater.updateCell(...args);\n },\n pagination: props.pagination\n });\n cellUpdater.applyUpdates();\n }, [apiRef, processRowUpdate, onProcessRowUpdateError, getRowId, enableClipboardPaste, rootEl, splitClipboardPastedText, props.pagination]);\n const checkIfCanStartEditing = React.useCallback((initialValue, {\n event\n }) => {\n if (isPasteShortcut(event) && enableClipboardPaste) {\n // Do not enter cell edit mode on paste\n return false;\n }\n return initialValue;\n }, [enableClipboardPaste]);\n useGridApiEventHandler(apiRef, 'cellKeyDown', handlePaste);\n useGridApiOptionHandler(apiRef, 'clipboardPasteStart', props.onClipboardPasteStart);\n useGridApiOptionHandler(apiRef, 'clipboardPasteEnd', props.onClipboardPasteEnd);\n useGridRegisterPipeProcessor(apiRef, 'canStartEditing', checkIfCanStartEditing);\n};","// 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, wait = 166) {\n let timeout;\n function debounced(...args) {\n const later = () => {\n // @ts-ignore\n func.apply(this, args);\n };\n clearTimeout(timeout);\n timeout = setTimeout(later, wait);\n }\n debounced.clear = () => {\n clearTimeout(timeout);\n };\n return debounced;\n}","import { useGridInitialization, useGridInitializeState, useGridClipboard, useGridColumnMenu, useGridColumns, columnsStateInitializer, useGridDensity, useGridCsvExport, useGridPrintExport, useGridFilter, filterStateInitializer, useGridFocus, useGridKeyboardNavigation, useGridPagination, paginationStateInitializer, useGridPreferencesPanel, useGridEditing, editingStateInitializer, useGridRows, useGridRowsPreProcessors, rowsStateInitializer, useGridRowsMeta, useGridParamsApi, useGridRowSelection, useGridSorting, sortingStateInitializer, useGridScroll, useGridEvents, useGridDimensions, useGridStatePersistence, useGridRowSelectionPreProcessors, columnMenuStateInitializer, densityStateInitializer, focusStateInitializer, preferencePanelStateInitializer, rowsMetaStateInitializer, rowSelectionStateInitializer, useGridColumnReorder, columnReorderStateInitializer, useGridColumnResize, columnResizeStateInitializer, useGridTreeData, useGridTreeDataPreProcessors, useGridColumnPinning, columnPinningStateInitializer, useGridColumnPinningPreProcessors, useGridDetailPanel, detailPanelStateInitializer, useGridDetailPanelPreProcessors, useGridInfiniteLoader, useGridColumnSpanning, useGridRowReorder, useGridRowReorderPreProcessors, useGridRowPinning, useGridRowPinningPreProcessors, rowPinningStateInitializer, useGridColumnGrouping, columnGroupsStateInitializer, useGridLazyLoader, useGridLazyLoaderPreProcessors, headerFilteringStateInitializer, useGridHeaderFiltering, virtualizationStateInitializer, useGridVirtualization } from '@mui/x-data-grid-pro/internals';\n// Premium-only features\nimport { useGridAggregation, aggregationStateInitializer } from '../hooks/features/aggregation/useGridAggregation';\nimport { useGridAggregationPreProcessors } from '../hooks/features/aggregation/useGridAggregationPreProcessors';\nimport { useGridRowGrouping, rowGroupingStateInitializer } from '../hooks/features/rowGrouping/useGridRowGrouping';\nimport { useGridRowGroupingPreProcessors } from '../hooks/features/rowGrouping/useGridRowGroupingPreProcessors';\nimport { useGridExcelExport } from '../hooks/features/export/useGridExcelExport';\nimport { cellSelectionStateInitializer, useGridCellSelection } from '../hooks/features/cellSelection/useGridCellSelection';\nimport { useGridClipboardImport } from '../hooks/features/clipboard/useGridClipboardImport';\nexport const useDataGridPremiumComponent = (inputApiRef, props) => {\n const apiRef = useGridInitialization(inputApiRef, props);\n\n /**\n * Register all pre-processors called during state initialization here.\n */\n useGridRowSelectionPreProcessors(apiRef, props);\n useGridRowReorderPreProcessors(apiRef, props);\n useGridRowGroupingPreProcessors(apiRef, props);\n useGridTreeDataPreProcessors(apiRef, props);\n useGridLazyLoaderPreProcessors(apiRef, props);\n useGridRowPinningPreProcessors(apiRef);\n useGridAggregationPreProcessors(apiRef, props);\n useGridDetailPanelPreProcessors(apiRef, props);\n // The column pinning `hydrateColumns` pre-processor must be after every other `hydrateColumns` pre-processors\n // Because it changes the order of the columns.\n useGridColumnPinningPreProcessors(apiRef, props);\n useGridRowsPreProcessors(apiRef);\n\n /**\n * Register all state initializers here.\n */\n useGridInitializeState(headerFilteringStateInitializer, apiRef, props);\n useGridInitializeState(rowGroupingStateInitializer, apiRef, props);\n useGridInitializeState(aggregationStateInitializer, apiRef, props);\n useGridInitializeState(rowSelectionStateInitializer, apiRef, props);\n useGridInitializeState(cellSelectionStateInitializer, apiRef, props);\n useGridInitializeState(detailPanelStateInitializer, apiRef, props);\n useGridInitializeState(columnPinningStateInitializer, apiRef, props);\n useGridInitializeState(columnsStateInitializer, apiRef, props);\n useGridInitializeState(rowPinningStateInitializer, apiRef, props);\n useGridInitializeState(rowsStateInitializer, apiRef, props);\n useGridInitializeState(editingStateInitializer, apiRef, props);\n useGridInitializeState(focusStateInitializer, apiRef, props);\n useGridInitializeState(sortingStateInitializer, apiRef, props);\n useGridInitializeState(preferencePanelStateInitializer, apiRef, props);\n useGridInitializeState(filterStateInitializer, apiRef, props);\n useGridInitializeState(densityStateInitializer, apiRef, props);\n useGridInitializeState(columnReorderStateInitializer, apiRef, props);\n useGridInitializeState(columnResizeStateInitializer, apiRef, props);\n useGridInitializeState(paginationStateInitializer, apiRef, props);\n useGridInitializeState(rowsMetaStateInitializer, apiRef, props);\n useGridInitializeState(columnMenuStateInitializer, apiRef, props);\n useGridInitializeState(columnGroupsStateInitializer, apiRef, props);\n useGridInitializeState(virtualizationStateInitializer, apiRef, props);\n useGridRowGrouping(apiRef, props);\n useGridHeaderFiltering(apiRef, props);\n useGridTreeData(apiRef);\n useGridAggregation(apiRef, props);\n useGridKeyboardNavigation(apiRef, props);\n useGridRowSelection(apiRef, props);\n useGridCellSelection(apiRef, props);\n useGridColumnPinning(apiRef, props);\n useGridRowPinning(apiRef, props);\n useGridColumns(apiRef, props);\n useGridRows(apiRef, props);\n useGridParamsApi(apiRef, props);\n useGridDetailPanel(apiRef, props);\n useGridColumnSpanning(apiRef);\n useGridColumnGrouping(apiRef, props);\n useGridClipboardImport(apiRef, props);\n useGridEditing(apiRef, props);\n useGridFocus(apiRef, props);\n useGridPreferencesPanel(apiRef, props);\n useGridFilter(apiRef, props);\n useGridSorting(apiRef, props);\n useGridDensity(apiRef, props);\n useGridColumnReorder(apiRef, props);\n useGridColumnResize(apiRef, props);\n useGridPagination(apiRef, props);\n useGridRowsMeta(apiRef, props);\n useGridRowReorder(apiRef, props);\n useGridScroll(apiRef, props);\n useGridInfiniteLoader(apiRef, props);\n useGridLazyLoader(apiRef, props);\n useGridColumnMenu(apiRef);\n useGridCsvExport(apiRef, props);\n useGridPrintExport(apiRef, props);\n useGridExcelExport(apiRef, props);\n useGridClipboard(apiRef, props);\n useGridDimensions(apiRef, props);\n useGridEvents(apiRef, props);\n useGridStatePersistence(apiRef);\n useGridVirtualization(apiRef, props);\n return apiRef;\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridRegisterPipeProcessor } from '@mui/x-data-grid/internals';\nimport { GRID_ROOT_GROUP_ID } from '@mui/x-data-grid';\nexport const GRID_SKELETON_ROW_ROOT_ID = 'auto-generated-skeleton-row-root';\nconst getSkeletonRowId = index => `${GRID_SKELETON_ROW_ROOT_ID}-${index}`;\nexport const useGridLazyLoaderPreProcessors = (privateApiRef, props) => {\n var _props$experimentalFe;\n const {\n lazyLoading\n } = (_props$experimentalFe = props.experimentalFeatures) != null ? _props$experimentalFe : {};\n const addSkeletonRows = React.useCallback(groupingParams => {\n const rootGroup = groupingParams.tree[GRID_ROOT_GROUP_ID];\n if (!lazyLoading || props.rowsLoadingMode !== 'server' || !props.rowCount || rootGroup.children.length >= props.rowCount) {\n return groupingParams;\n }\n const tree = _extends({}, groupingParams.tree);\n const rootGroupChildren = [...rootGroup.children];\n for (let i = 0; i < props.rowCount - rootGroup.children.length; i += 1) {\n const skeletonId = getSkeletonRowId(i);\n rootGroupChildren.push(skeletonId);\n const skeletonRowNode = {\n type: 'skeletonRow',\n id: skeletonId,\n parent: GRID_ROOT_GROUP_ID,\n depth: 0\n };\n tree[skeletonId] = skeletonRowNode;\n }\n tree[GRID_ROOT_GROUP_ID] = _extends({}, rootGroup, {\n children: rootGroupChildren\n });\n return _extends({}, groupingParams, {\n tree\n });\n }, [props.rowCount, props.rowsLoadingMode, lazyLoading]);\n useGridRegisterPipeProcessor(privateApiRef, 'hydrateRows', addSkeletonRows);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { gridClasses } from '@mui/x-data-grid';\nimport { useGridRegisterPipeProcessor } from '@mui/x-data-grid/internals';\nimport { GRID_DETAIL_PANEL_TOGGLE_FIELD, GRID_DETAIL_PANEL_TOGGLE_COL_DEF } from './gridDetailPanelToggleColDef';\nimport { gridDetailPanelExpandedRowIdsSelector } from './gridDetailPanelSelector';\nexport const useGridDetailPanelPreProcessors = (privateApiRef, props) => {\n const addToggleColumn = React.useCallback(columnsState => {\n if (props.getDetailPanelContent == null) {\n // Remove the toggle column, when it exists\n if (columnsState.lookup[GRID_DETAIL_PANEL_TOGGLE_FIELD]) {\n delete columnsState.lookup[GRID_DETAIL_PANEL_TOGGLE_FIELD];\n columnsState.orderedFields = columnsState.orderedFields.filter(field => field !== GRID_DETAIL_PANEL_TOGGLE_FIELD);\n }\n return columnsState;\n }\n\n // Don't add the toggle column if there's already one\n // The user might have manually added it to have it in a custom position\n if (columnsState.lookup[GRID_DETAIL_PANEL_TOGGLE_FIELD]) {\n return columnsState;\n }\n\n // Otherwise, add the toggle column at the beginning\n columnsState.orderedFields = [GRID_DETAIL_PANEL_TOGGLE_FIELD, ...columnsState.orderedFields];\n columnsState.lookup[GRID_DETAIL_PANEL_TOGGLE_FIELD] = _extends({}, GRID_DETAIL_PANEL_TOGGLE_COL_DEF, {\n headerName: privateApiRef.current.getLocaleText('detailPanelToggle')\n });\n return columnsState;\n }, [privateApiRef, props.getDetailPanelContent]);\n const addExpandedClassToRow = React.useCallback((classes, id) => {\n if (props.getDetailPanelContent == null) {\n return classes;\n }\n const expandedRowIds = gridDetailPanelExpandedRowIdsSelector(privateApiRef.current.state);\n if (!expandedRowIds.includes(id)) {\n return classes;\n }\n return [...classes, gridClasses['row--detailPanelExpanded']];\n }, [privateApiRef, props.getDetailPanelContent]);\n useGridRegisterPipeProcessor(privateApiRef, 'hydrateColumns', addToggleColumn);\n useGridRegisterPipeProcessor(privateApiRef, 'rowClassName', addExpandedClassToRow);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useTheme } from '@mui/material/styles';\nimport { useGridRegisterPipeProcessor } from '@mui/x-data-grid/internals';\nimport { gridPinnedColumnsSelector } from './gridColumnPinningSelector';\nimport { columnPinningStateInitializer } from './useGridColumnPinning';\nimport { filterColumns } from '../../../components/DataGridProVirtualScroller';\nexport const useGridColumnPinningPreProcessors = (apiRef, props) => {\n const {\n disableColumnPinning,\n pinnedColumns: pinnedColumnsProp,\n initialState\n } = props;\n const theme = useTheme();\n let pinnedColumns = gridPinnedColumnsSelector(apiRef.current.state);\n if (pinnedColumns == null) {\n // Since the state is not ready yet lets use the initializer to get which\n // columns should be pinned initially.\n const initializedState = columnPinningStateInitializer(apiRef.current.state, {\n disableColumnPinning,\n pinnedColumns: pinnedColumnsProp,\n initialState\n }, apiRef);\n pinnedColumns = gridPinnedColumnsSelector(initializedState);\n }\n const prevAllPinnedColumns = React.useRef([]);\n const reorderPinnedColumns = React.useCallback(columnsState => {\n if (columnsState.orderedFields.length === 0 || disableColumnPinning) {\n return columnsState;\n }\n const [leftPinnedColumns, rightPinnedColumns] = filterColumns(pinnedColumns, columnsState.orderedFields, theme.direction === 'rtl');\n let newOrderedFields;\n const allPinnedColumns = [...leftPinnedColumns, ...rightPinnedColumns];\n const {\n orderedFieldsBeforePinningColumns\n } = apiRef.current.caches.columnPinning;\n if (orderedFieldsBeforePinningColumns) {\n newOrderedFields = new Array(columnsState.orderedFields.length).fill(null);\n const newOrderedFieldsBeforePinningColumns = [...newOrderedFields];\n\n // Contains the fields not added to the orderedFields array yet\n const remainingFields = [...columnsState.orderedFields];\n\n // First, we check if the column was unpinned since the last processing.\n // If yes and it still exists, we move it back to the same position it was before pinning\n prevAllPinnedColumns.current.forEach(field => {\n if (!allPinnedColumns.includes(field) && columnsState.lookup[field]) {\n // Get the position before pinning\n const index = orderedFieldsBeforePinningColumns.indexOf(field);\n newOrderedFields[index] = field;\n newOrderedFieldsBeforePinningColumns[index] = field;\n // This field was already consumed so we prevent from being added again\n remainingFields.splice(remainingFields.indexOf(field), 1);\n }\n });\n\n // For columns still pinned, we keep stored their original positions\n allPinnedColumns.forEach(field => {\n let index = orderedFieldsBeforePinningColumns.indexOf(field);\n // If index = -1, the pinned field didn't exist in the last processing, it's possibly being added now\n // If index >= newOrderedFieldsBeforePinningColumns.length, then one or more columns were removed\n // In both cases, use the position from the columns array\n // TODO: detect removed columns and decrease the positions after it\n if (index === -1 || index >= newOrderedFieldsBeforePinningColumns.length) {\n index = columnsState.orderedFields.indexOf(field);\n }\n\n // The fallback above may make the column to be inserted in a position already occupied\n // In this case, put it in any empty slot available\n if (newOrderedFieldsBeforePinningColumns[index] !== null) {\n index = 0;\n while (newOrderedFieldsBeforePinningColumns[index] !== null) {\n index += 1;\n }\n }\n newOrderedFields[index] = field;\n newOrderedFieldsBeforePinningColumns[index] = field;\n // This field was already consumed so we prevent from being added again\n remainingFields.splice(remainingFields.indexOf(field), 1);\n });\n\n // The fields remaining are those that're neither pinnned nor were unpinned\n // For these, we spread them across both arrays making sure to not override existing values\n let i = 0;\n remainingFields.forEach(field => {\n while (newOrderedFieldsBeforePinningColumns[i] !== null) {\n i += 1;\n }\n newOrderedFieldsBeforePinningColumns[i] = field;\n newOrderedFields[i] = field;\n });\n apiRef.current.caches.columnPinning.orderedFieldsBeforePinningColumns = newOrderedFieldsBeforePinningColumns;\n } else {\n newOrderedFields = [...columnsState.orderedFields];\n apiRef.current.caches.columnPinning.orderedFieldsBeforePinningColumns = [...columnsState.orderedFields];\n }\n prevAllPinnedColumns.current = allPinnedColumns;\n const centerColumns = newOrderedFields.filter(field => {\n return !leftPinnedColumns.includes(field) && !rightPinnedColumns.includes(field);\n });\n return _extends({}, columnsState, {\n orderedFields: [...leftPinnedColumns, ...centerColumns, ...rightPinnedColumns]\n });\n }, [apiRef, disableColumnPinning, pinnedColumns, theme.direction]);\n useGridRegisterPipeProcessor(apiRef, 'hydrateColumns', reorderPinnedColumns);\n};","import * as React from 'react';\nimport { useGridApiEventHandler } from '@mui/x-data-grid';\nexport const useGridTreeData = apiRef => {\n /**\n * EVENTS\n */\n const handleCellKeyDown = React.useCallback((params, event) => {\n const cellParams = apiRef.current.getCellParams(params.id, params.field);\n if (cellParams.colDef.type === 'treeDataGroup' && event.key === ' ' && !event.shiftKey) {\n if (params.rowNode.type !== 'group') {\n return;\n }\n apiRef.current.setRowChildrenExpansion(params.id, !params.rowNode.childrenExpanded);\n }\n }, [apiRef]);\n useGridApiEventHandler(apiRef, 'cellKeyDown', handleCellKeyDown);\n};","import * as React from 'react';\nimport { useGridSelector, useGridApiEventHandler, useGridApiOptionHandler, gridVisibleColumnDefinitionsSelector, gridRowsMetaSelector } from '@mui/x-data-grid';\nimport { useGridVisibleRows } from '@mui/x-data-grid/internals';\n/**\n * @requires useGridColumns (state)\n * @requires useGridDimensions (method) - can be after\n * @requires useGridScroll (method\n */\nexport const useGridInfiniteLoader = (apiRef, props) => {\n const visibleColumns = useGridSelector(apiRef, gridVisibleColumnDefinitionsSelector);\n const currentPage = useGridVisibleRows(apiRef, props);\n const rowsMeta = useGridSelector(apiRef, gridRowsMetaSelector);\n const contentHeight = Math.max(rowsMeta.currentPageTotalHeight, 1);\n const isInScrollBottomArea = React.useRef(false);\n const handleRowsScrollEnd = React.useCallback(scrollPosition => {\n const dimensions = apiRef.current.getRootDimensions();\n\n // Prevent the infite loading working in combination with lazy loading\n if (!dimensions || props.rowsLoadingMode !== 'client') {\n return;\n }\n const scrollPositionBottom = scrollPosition.top + dimensions.viewportOuterSize.height;\n const viewportPageSize = apiRef.current.getViewportPageSize();\n if (scrollPositionBottom < contentHeight - props.scrollEndThreshold) {\n isInScrollBottomArea.current = false;\n }\n if (scrollPositionBottom >= contentHeight - props.scrollEndThreshold && !isInScrollBottomArea.current) {\n const rowScrollEndParam = {\n visibleColumns,\n viewportPageSize,\n visibleRowsCount: currentPage.rows.length\n };\n apiRef.current.publishEvent('rowsScrollEnd', rowScrollEndParam);\n isInScrollBottomArea.current = true;\n }\n }, [contentHeight, props.scrollEndThreshold, props.rowsLoadingMode, visibleColumns, apiRef, currentPage.rows.length]);\n const handleGridScroll = React.useCallback(({\n left,\n top\n }) => {\n handleRowsScrollEnd({\n left,\n top\n });\n }, [handleRowsScrollEnd]);\n useGridApiEventHandler(apiRef, 'scrollPositionChange', handleGridScroll);\n useGridApiOptionHandler(apiRef, 'rowsScrollEnd', props.onRowsScrollEnd);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { GridGenericColumnMenu, GRID_COLUMN_MENU_SLOTS, GRID_COLUMN_MENU_SLOT_PROPS } from '@mui/x-data-grid';\nimport { GridColumnMenuPinningItem } from './GridColumnMenuPinningItem';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const GRID_COLUMN_MENU_SLOTS_PRO = _extends({}, GRID_COLUMN_MENU_SLOTS, {\n columnMenuPinningItem: GridColumnMenuPinningItem\n});\nexport const GRID_COLUMN_MENU_SLOT_PROPS_PRO = _extends({}, GRID_COLUMN_MENU_SLOT_PROPS, {\n columnMenuPinningItem: {\n displayOrder: 15\n }\n});\nconst GridProColumnMenu = /*#__PURE__*/React.forwardRef(function GridProColumnMenu(props, ref) {\n return /*#__PURE__*/_jsx(GridGenericColumnMenu, _extends({\n ref: ref\n }, props, {\n defaultSlots: GRID_COLUMN_MENU_SLOTS_PRO,\n defaultSlotProps: GRID_COLUMN_MENU_SLOT_PROPS_PRO\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridProColumnMenu.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n colDef: PropTypes.object.isRequired,\n hideMenu: PropTypes.func.isRequired,\n open: PropTypes.bool.isRequired\n} : void 0;\nexport { GridProColumnMenu };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"getColumnsToRender\", \"getRootProps\"];\nimport * as React from 'react';\nimport { unstable_gridFocusColumnHeaderFilterSelector, useGridSelector, gridFilterModelSelector, unstable_gridTabIndexColumnHeaderFilterSelector, getDataGridUtilityClass } from '@mui/x-data-grid';\nimport { styled } from '@mui/system';\nimport { useGridColumnHeaders as useGridColumnHeadersCommunity, getTotalHeaderHeight, useGridPrivateApiContext, getGridFilter } from '@mui/x-data-grid/internals';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { useGridRootProps } from '../../utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n return React.useMemo(() => {\n const slots = {\n headerFilterRow: ['headerFilterRow']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n }, [classes]);\n};\nconst GridHeaderFilterRow = styled('div', {\n name: 'MuiDataGrid',\n slot: 'HeaderFilterRow',\n overridesResolver: (props, styles) => styles.headerFilterRow\n})(() => ({\n display: 'flex'\n}));\nconst filterItemsCache = Object.create(null);\nexport const useGridColumnHeaders = props => {\n const apiRef = useGridPrivateApiContext();\n const {\n headerGroupingMaxDepth,\n hasOtherElementInTabSequence\n } = props;\n const columnHeaderFilterTabIndexState = useGridSelector(apiRef, unstable_gridTabIndexColumnHeaderFilterSelector);\n const _useGridColumnHeaders = useGridColumnHeadersCommunity(_extends({}, props, {\n hasOtherElementInTabSequence: hasOtherElementInTabSequence || columnHeaderFilterTabIndexState !== null\n })),\n {\n getColumnsToRender,\n getRootProps\n } = _useGridColumnHeaders,\n otherProps = _objectWithoutPropertiesLoose(_useGridColumnHeaders, _excluded);\n const headerFiltersRef = React.useRef(null);\n apiRef.current.register('private', {\n headerFiltersElementRef: headerFiltersRef\n });\n const headerFilterMenuRef = React.useRef(null);\n const rootProps = useGridRootProps();\n const classes = useUtilityClasses(rootProps);\n const disableHeaderFiltering = !rootProps.unstable_headerFilters;\n const headerHeight = Math.floor(rootProps.columnHeaderHeight * props.densityFactor);\n const filterModel = useGridSelector(apiRef, gridFilterModelSelector);\n const totalHeaderHeight = getTotalHeaderHeight(apiRef, rootProps.columnHeaderHeight) + (disableHeaderFiltering ? 0 : headerHeight);\n const columnHeaderFilterFocus = useGridSelector(apiRef, unstable_gridFocusColumnHeaderFilterSelector);\n const getFilterItem = React.useCallback(colDef => {\n const filterModelItem = filterModel == null ? void 0 : filterModel.items.find(it => it.field === colDef.field && it.operator !== 'isAnyOf');\n if (filterModelItem != null) {\n // there's a valid `filterModelItem` for this column\n return filterModelItem;\n }\n const defaultCachedItem = filterItemsCache[colDef.field];\n if (defaultCachedItem != null) {\n // there's a cached `defaultItem` for this column\n return defaultCachedItem;\n }\n // there's no cached `defaultItem` for this column, let's generate one and cache it\n const defaultItem = getGridFilter(colDef);\n filterItemsCache[colDef.field] = defaultItem;\n return defaultItem;\n }, [filterModel]);\n const getColumnFilters = (params, other = {}) => {\n if (disableHeaderFiltering) {\n return null;\n }\n const columnsToRender = getColumnsToRender(params);\n if (columnsToRender == null) {\n return null;\n }\n const {\n renderedColumns,\n firstColumnToRender\n } = columnsToRender;\n const filters = [];\n for (let i = 0; i < renderedColumns.length; i += 1) {\n var _colDef$filterOperato, _colDef$filterOperato2, _rootProps$slotProps;\n const colDef = renderedColumns[i];\n const columnIndex = firstColumnToRender + i;\n const hasFocus = (columnHeaderFilterFocus == null ? void 0 : columnHeaderFilterFocus.field) === colDef.field;\n const isFirstColumn = columnIndex === 0;\n const tabIndexField = columnHeaderFilterTabIndexState == null ? void 0 : columnHeaderFilterTabIndexState.field;\n const tabIndex = tabIndexField === colDef.field || isFirstColumn && !props.hasOtherElementInTabSequence ? 0 : -1;\n const headerClassName = typeof colDef.headerClassName === 'function' ? colDef.headerClassName({\n field: colDef.field,\n colDef\n }) : colDef.headerClassName;\n\n // TODO: Support for `isAnyOf` operator\n const filterOperators = (_colDef$filterOperato = (_colDef$filterOperato2 = colDef.filterOperators) == null ? void 0 : _colDef$filterOperato2.filter(operator => operator.value !== 'isAnyOf')) != null ? _colDef$filterOperato : [];\n const item = getFilterItem(colDef);\n filters.push( /*#__PURE__*/_jsx(rootProps.slots.headerFilterCell, _extends({\n colIndex: columnIndex,\n height: headerHeight,\n width: colDef.computedWidth,\n colDef: colDef,\n hasFocus: hasFocus,\n tabIndex: tabIndex,\n headerFilterMenuRef: headerFilterMenuRef,\n headerClassName: headerClassName,\n filterOperators: filterOperators,\n \"data-field\": colDef.field,\n item: item\n }, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.headerFilterCell, other), `${colDef.field}-filter`));\n }\n return /*#__PURE__*/_jsx(GridHeaderFilterRow, {\n ref: headerFiltersRef,\n ownerState: rootProps,\n className: classes.headerFilterRow,\n role: \"row\",\n \"aria-rowindex\": headerGroupingMaxDepth + 2,\n children: filters\n });\n };\n const rootStyle = {\n minHeight: totalHeaderHeight,\n maxHeight: totalHeaderHeight,\n lineHeight: `${headerHeight}px`\n };\n return _extends({}, otherProps, {\n getColumnFilters,\n getRootProps: disableHeaderFiltering ? getRootProps : (other = {}) => _extends({\n style: rootStyle\n }, other)\n });\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses, unstable_useEventCallback as useEventCallback } from '@mui/utils';\nimport { styled } from '@mui/system';\nimport { getTotalHeaderHeight, useTimeout } from '@mui/x-data-grid/internals';\nimport { getDataGridUtilityClass, gridClasses, gridDensityFactorSelector, useGridApiContext, useGridApiEventHandler, useGridSelector, gridColumnsTotalWidthSelector } from '@mui/x-data-grid';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst CLIFF = 1;\nconst SLOP = 1.5;\nconst useUtilityClasses = ownerState => {\n const {\n scrollDirection,\n classes\n } = ownerState;\n const slots = {\n root: ['scrollArea', `scrollArea--${scrollDirection}`]\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nconst GridScrollAreaRawRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'ScrollArea',\n overridesResolver: (props, styles) => [{\n [`&.${gridClasses['scrollArea--left']}`]: styles['scrollArea--left']\n }, {\n [`&.${gridClasses['scrollArea--right']}`]: styles['scrollArea--right']\n }, styles.scrollArea]\n})(() => ({\n position: 'absolute',\n top: 0,\n zIndex: 101,\n width: 20,\n bottom: 0,\n [`&.${gridClasses['scrollArea--left']}`]: {\n left: 0\n },\n [`&.${gridClasses['scrollArea--right']}`]: {\n right: 0\n }\n}));\nfunction GridScrollAreaRaw(props) {\n const {\n scrollDirection\n } = props;\n const rootRef = React.useRef(null);\n const apiRef = useGridApiContext();\n const timeout = useTimeout();\n const [dragging, setDragging] = React.useState(false);\n const [canScrollMore, setCanScrollMore] = React.useState(true);\n const densityFactor = useGridSelector(apiRef, gridDensityFactorSelector);\n const columnsTotalWidth = useGridSelector(apiRef, gridColumnsTotalWidthSelector);\n const scrollPosition = React.useRef({\n left: 0,\n top: 0\n });\n const rootProps = useGridRootProps();\n const ownerState = _extends({}, rootProps, {\n scrollDirection\n });\n const classes = useUtilityClasses(ownerState);\n const totalHeaderHeight = getTotalHeaderHeight(apiRef, rootProps.columnHeaderHeight);\n const headerHeight = Math.floor(rootProps.columnHeaderHeight * densityFactor);\n const handleScrolling = React.useCallback(newScrollPosition => {\n scrollPosition.current = newScrollPosition;\n const dimensions = apiRef.current.getRootDimensions();\n setCanScrollMore(() => {\n if (scrollDirection === 'left') {\n // Only render if the user has not reached yet the start of the list\n return scrollPosition.current.left > 0;\n }\n if (scrollDirection === 'right') {\n // Only render if the user has not reached yet the end of the list\n const maxScrollLeft = columnsTotalWidth - dimensions.viewportInnerSize.width;\n return scrollPosition.current.left < maxScrollLeft;\n }\n return false;\n });\n }, [apiRef, columnsTotalWidth, scrollDirection]);\n const handleDragOver = React.useCallback(event => {\n let offset;\n\n // Prevents showing the forbidden cursor\n event.preventDefault();\n if (scrollDirection === 'left') {\n offset = event.clientX - rootRef.current.getBoundingClientRect().right;\n } else if (scrollDirection === 'right') {\n offset = Math.max(1, event.clientX - rootRef.current.getBoundingClientRect().left);\n } else {\n throw new Error('MUI: Wrong drag direction');\n }\n offset = (offset - CLIFF) * SLOP + CLIFF;\n\n // Avoid freeze and inertia.\n timeout.start(0, () => {\n apiRef.current.scroll({\n left: scrollPosition.current.left + offset,\n top: scrollPosition.current.top\n });\n });\n }, [scrollDirection, apiRef, timeout]);\n const handleColumnHeaderDragStart = useEventCallback(() => {\n setDragging(true);\n });\n const handleColumnHeaderDragEnd = useEventCallback(() => {\n setDragging(false);\n });\n useGridApiEventHandler(apiRef, 'scrollPositionChange', handleScrolling);\n useGridApiEventHandler(apiRef, 'columnHeaderDragStart', handleColumnHeaderDragStart);\n useGridApiEventHandler(apiRef, 'columnHeaderDragEnd', handleColumnHeaderDragEnd);\n if (!dragging || !canScrollMore) {\n return null;\n }\n return /*#__PURE__*/_jsx(GridScrollAreaRawRoot, {\n ref: rootRef,\n className: clsx(classes.root),\n ownerState: ownerState,\n onDragOver: handleDragOver,\n style: {\n height: headerHeight,\n top: totalHeaderHeight - headerHeight\n }\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? GridScrollAreaRaw.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n scrollDirection: PropTypes.oneOf(['left', 'right']).isRequired\n} : void 0;\nconst GridScrollArea = /*#__PURE__*/React.memo(GridScrollAreaRaw);\nexport { GridScrollArea };","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"style\", \"className\", \"innerRef\", \"visibleColumns\", \"sortColumnLookup\", \"filterColumnLookup\", \"columnPositions\", \"columnHeaderTabIndexState\", \"columnGroupHeaderTabIndexState\", \"columnHeaderFocus\", \"columnGroupHeaderFocus\", \"densityFactor\", \"headerGroupingMaxDepth\", \"columnMenuState\", \"columnVisibility\", \"columnGroupsHeaderStructure\", \"hasOtherElementInTabSequence\", \"pinnedColumns\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { refType, unstable_composeClasses as composeClasses, unstable_useEventCallback as useEventCallback } from '@mui/utils';\nimport { styled, alpha, useTheme } from '@mui/material/styles';\nimport { getDataGridUtilityClass, gridClasses, useGridApiEventHandler, GridColumnHeaderSeparatorSides } from '@mui/x-data-grid';\nimport { GridBaseColumnHeaders, GridColumnHeadersInner } from '@mui/x-data-grid/internals';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { GridPinnedPosition } from '../hooks/features/columnPinning';\nimport { useGridColumnHeaders } from '../hooks/features/columnHeaders/useGridColumnHeaders';\nimport { filterColumns } from './DataGridProVirtualScroller';\nimport { GridScrollArea } from './GridScrollArea';\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n leftPinnedColumns,\n rightPinnedColumns,\n classes\n } = ownerState;\n const slots = {\n leftPinnedColumns: ['pinnedColumnHeaders', leftPinnedColumns && leftPinnedColumns.length > 0 && `pinnedColumnHeaders--left`],\n rightPinnedColumns: ['pinnedColumnHeaders', rightPinnedColumns && rightPinnedColumns.length > 0 && `pinnedColumnHeaders--right`, 'withBorderColor']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n// Inspired by https://github.com/material-components/material-components-ios/blob/bca36107405594d5b7b16265a5b0ed698f85a5ee/components/Elevation/src/UIColor%2BMaterialElevation.m#L61\nconst getOverlayAlpha = elevation => {\n let alphaValue;\n if (elevation < 1) {\n alphaValue = 5.11916 * elevation ** 2;\n } else {\n alphaValue = 4.5 * Math.log(elevation + 1) + 2;\n }\n return alphaValue / 100;\n};\nconst GridColumnHeadersPinnedColumnHeaders = styled('div', {\n name: 'MuiDataGrid',\n slot: 'PinnedColumnHeaders',\n overridesResolver: (props, styles) => [{\n [`&.${gridClasses['pinnedColumnHeaders--left']}`]: styles['pinnedColumnHeaders--left']\n }, {\n [`&.${gridClasses['pinnedColumnHeaders--right']}`]: styles['pinnedColumnHeaders--right']\n }, styles.pinnedColumnHeaders]\n})(({\n theme,\n ownerState\n}) => {\n var _theme$vars$overlays;\n return _extends({\n position: 'absolute',\n top: 0,\n overflow: 'hidden',\n zIndex: 1,\n display: 'flex',\n flexDirection: 'column',\n boxShadow: theme.shadows[2],\n backgroundColor: (theme.vars || theme).palette.background.default\n }, theme.vars ? {\n backgroundImage: (_theme$vars$overlays = theme.vars.overlays) == null ? void 0 : _theme$vars$overlays[2]\n } : _extends({}, theme.palette.mode === 'dark' && {\n backgroundImage: `linear-gradient(${alpha('#fff', getOverlayAlpha(2))}, ${alpha('#fff', getOverlayAlpha(2))})`\n }), ownerState.side === GridPinnedPosition.left && {\n left: 0\n }, ownerState.side === GridPinnedPosition.right && {\n right: 0\n }, ownerState.side === GridPinnedPosition.right && ownerState.showCellVerticalBorder && {\n borderLeftWidth: '1px',\n borderLeftStyle: 'solid'\n });\n});\nGridColumnHeadersPinnedColumnHeaders.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n ownerState: PropTypes.object.isRequired\n};\nconst GridColumnHeaders = /*#__PURE__*/React.forwardRef(function GridColumnHeaders(props, ref) {\n const {\n className,\n innerRef,\n visibleColumns,\n sortColumnLookup,\n filterColumnLookup,\n columnPositions,\n columnHeaderTabIndexState,\n columnGroupHeaderTabIndexState,\n columnHeaderFocus,\n columnGroupHeaderFocus,\n densityFactor,\n headerGroupingMaxDepth,\n columnMenuState,\n columnVisibility,\n columnGroupsHeaderStructure,\n hasOtherElementInTabSequence,\n pinnedColumns\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const rootProps = useGridRootProps();\n const apiRef = useGridApiContext();\n const [scrollbarSize, setScrollbarSize] = React.useState(0);\n const theme = useTheme();\n const handleContentSizeChange = useEventCallback(() => {\n const rootDimensions = apiRef.current.getRootDimensions();\n if (!rootDimensions) {\n return;\n }\n const newScrollbarSize = rootDimensions.hasScrollY ? rootDimensions.scrollBarSize : 0;\n if (scrollbarSize !== newScrollbarSize) {\n setScrollbarSize(newScrollbarSize);\n }\n });\n useGridApiEventHandler(apiRef, 'virtualScrollerContentSizeChange', handleContentSizeChange);\n const visibleColumnFields = React.useMemo(() => visibleColumns.map(({\n field\n }) => field), [visibleColumns]);\n const [leftPinnedColumns, rightPinnedColumns] = filterColumns(pinnedColumns, visibleColumnFields, theme.direction === 'rtl');\n const {\n isDragging,\n renderContext,\n getRootProps,\n getInnerProps,\n getColumnHeaders,\n getColumnFilters,\n getColumnGroupHeaders\n } = useGridColumnHeaders({\n innerRef,\n visibleColumns,\n sortColumnLookup,\n filterColumnLookup,\n columnPositions,\n columnHeaderTabIndexState,\n hasOtherElementInTabSequence,\n columnGroupHeaderTabIndexState,\n columnHeaderFocus,\n columnGroupHeaderFocus,\n densityFactor,\n headerGroupingMaxDepth,\n columnMenuState,\n columnVisibility,\n columnGroupsHeaderStructure,\n minColumnIndex: leftPinnedColumns.length\n });\n const ownerState = _extends({}, rootProps, {\n leftPinnedColumns,\n rightPinnedColumns,\n classes: rootProps.classes\n });\n const classes = useUtilityClasses(ownerState);\n const leftRenderContext = renderContext && leftPinnedColumns.length ? _extends({}, renderContext, {\n firstColumnIndex: 0,\n lastColumnIndex: leftPinnedColumns.length\n }) : null;\n const rightRenderContext = renderContext && rightPinnedColumns.length ? _extends({}, renderContext, {\n firstColumnIndex: visibleColumnFields.length - rightPinnedColumns.length,\n lastColumnIndex: visibleColumnFields.length\n }) : null;\n const innerProps = getInnerProps();\n const pinnedColumnHeadersProps = {\n role: innerProps.role\n };\n return /*#__PURE__*/_jsxs(GridBaseColumnHeaders, _extends({\n ref: ref,\n className: className\n }, getRootProps(other), {\n children: [leftRenderContext && /*#__PURE__*/_jsxs(GridColumnHeadersPinnedColumnHeaders, _extends({\n className: classes.leftPinnedColumns,\n ownerState: _extends({}, ownerState, {\n side: GridPinnedPosition.left,\n showCellVerticalBorder: rootProps.showCellVerticalBorder\n })\n }, pinnedColumnHeadersProps, {\n children: [getColumnGroupHeaders({\n renderContext: leftRenderContext,\n minFirstColumn: leftRenderContext.firstColumnIndex,\n maxLastColumn: leftRenderContext.lastColumnIndex\n }), getColumnHeaders({\n renderContext: leftRenderContext,\n minFirstColumn: leftRenderContext.firstColumnIndex,\n maxLastColumn: leftRenderContext.lastColumnIndex\n }, {\n disableReorder: true\n }), getColumnFilters({\n renderContext: leftRenderContext,\n minFirstColumn: leftRenderContext.firstColumnIndex,\n maxLastColumn: leftRenderContext.lastColumnIndex\n })]\n })), /*#__PURE__*/_jsx(GridScrollArea, {\n scrollDirection: \"left\"\n }), /*#__PURE__*/_jsxs(GridColumnHeadersInner, _extends({\n isDragging: isDragging\n }, innerProps, {\n children: [getColumnGroupHeaders({\n renderContext,\n minFirstColumn: leftPinnedColumns.length,\n maxLastColumn: visibleColumnFields.length - rightPinnedColumns.length\n }), getColumnHeaders({\n renderContext,\n minFirstColumn: leftPinnedColumns.length,\n maxLastColumn: visibleColumnFields.length - rightPinnedColumns.length\n }), getColumnFilters({\n renderContext,\n minFirstColumn: leftPinnedColumns.length,\n maxLastColumn: visibleColumnFields.length - rightPinnedColumns.length\n })]\n })), /*#__PURE__*/_jsx(GridScrollArea, {\n scrollDirection: \"right\"\n }), rightRenderContext && /*#__PURE__*/_jsxs(GridColumnHeadersPinnedColumnHeaders, _extends({\n ownerState: _extends({}, ownerState, {\n side: GridPinnedPosition.right,\n showCellVerticalBorder: rootProps.showCellVerticalBorder\n }),\n className: classes.rightPinnedColumns,\n style: {\n paddingRight: scrollbarSize\n }\n }, pinnedColumnHeadersProps, {\n children: [getColumnGroupHeaders({\n renderContext: rightRenderContext,\n minFirstColumn: rightRenderContext.firstColumnIndex,\n maxLastColumn: rightRenderContext.lastColumnIndex\n }), getColumnHeaders({\n renderContext: rightRenderContext,\n minFirstColumn: rightRenderContext.firstColumnIndex,\n maxLastColumn: rightRenderContext.lastColumnIndex\n }, {\n disableReorder: true,\n separatorSide: GridColumnHeaderSeparatorSides.Left\n }), getColumnFilters({\n renderContext: rightRenderContext,\n minFirstColumn: rightRenderContext.firstColumnIndex,\n maxLastColumn: rightRenderContext.lastColumnIndex\n })]\n }))]\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridColumnHeaders.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n columnGroupHeaderFocus: PropTypes.shape({\n depth: PropTypes.number.isRequired,\n field: PropTypes.string.isRequired\n }),\n columnGroupHeaderTabIndexState: PropTypes.shape({\n depth: PropTypes.number.isRequired,\n field: PropTypes.string.isRequired\n }),\n columnGroupsHeaderStructure: PropTypes.arrayOf(PropTypes.arrayOf(PropTypes.shape({\n columnFields: PropTypes.arrayOf(PropTypes.string).isRequired,\n groupId: PropTypes.string\n }))).isRequired,\n columnHeaderFocus: PropTypes.shape({\n field: PropTypes.string.isRequired\n }),\n columnHeaderTabIndexState: PropTypes.shape({\n field: PropTypes.string.isRequired\n }),\n columnMenuState: PropTypes.shape({\n field: PropTypes.string,\n open: PropTypes.bool.isRequired\n }).isRequired,\n columnPositions: PropTypes.arrayOf(PropTypes.number).isRequired,\n columnVisibility: PropTypes.object.isRequired,\n densityFactor: PropTypes.number.isRequired,\n filterColumnLookup: PropTypes.object.isRequired,\n hasOtherElementInTabSequence: PropTypes.bool.isRequired,\n headerGroupingMaxDepth: PropTypes.number.isRequired,\n innerRef: refType,\n minColumnIndex: PropTypes.number,\n pinnedColumns: PropTypes.shape({\n left: PropTypes.arrayOf(PropTypes.string),\n right: PropTypes.arrayOf(PropTypes.string)\n }).isRequired,\n sortColumnLookup: PropTypes.object.isRequired,\n visibleColumns: PropTypes.arrayOf(PropTypes.object).isRequired\n} : void 0;\nexport { GridColumnHeaders };","import _formatMuiErrorMessage from \"../formatMuiErrorMessage\";\n// It should to be noted that this function isn't equivalent to `text-transform: capitalize`.\n//\n// A strict capitalization should uppercase the first letter of each word in the sentence.\n// We only handle the first word.\nexport default function capitalize(string) {\n if (typeof string !== 'string') {\n throw new Error(process.env.NODE_ENV !== \"production\" ? `MUI: \\`capitalize(string)\\` expects a string argument.` : _formatMuiErrorMessage(7));\n }\n return string.charAt(0).toUpperCase() + string.slice(1);\n}","/**\n * WARNING: Don't import this directly.\n * Use `MuiError` from `@mui/utils/macros/MuiError.macro` instead.\n * @param {number} code\n */\nexport default function formatMuiErrorMessage(code) {\n // Apply babel-plugin-transform-template-literals in loose mode\n // loose mode is safe iff we're concatenating primitives\n // see https://babeljs.io/docs/en/babel-plugin-transform-template-literals#loose\n /* eslint-disable prefer-template */\n let url = 'https://mui.com/production-error/?code=' + code;\n for (let i = 1; i < arguments.length; i += 1) {\n // rest params over-transpile for this case\n // eslint-disable-next-line prefer-rest-params\n url += '&args[]=' + encodeURIComponent(arguments[i]);\n }\n return 'Minified MUI error #' + code + '; visit ' + url + ' for the full message.';\n /* eslint-enable prefer-template */\n}","'use client';\n\nimport * as React from 'react';\nlet globalId = 0;\nfunction useGlobalId(idOverride) {\n const [defaultId, setDefaultId] = React.useState(idOverride);\n const id = idOverride || defaultId;\n React.useEffect(() => {\n if (defaultId == null) {\n // Fallback to this default id when possible.\n // Use the incrementing value for client-side rendering only.\n // We can't use it server-side.\n // If you want to use random values please consider the Birthday Problem: https://en.wikipedia.org/wiki/Birthday_problem\n globalId += 1;\n setDefaultId(`mui-${globalId}`);\n }\n }, [defaultId]);\n return id;\n}\n\n// downstream bundlers may remove unnecessary concatenation, but won't remove toString call -- Workaround for https://github.com/webpack/webpack/issues/14814\nconst maybeReactUseId = React['useId'.toString()];\n/**\n *\n * @example
\n * @param idOverride\n * @returns {string}\n */\nexport default function useId(idOverride) {\n if (maybeReactUseId !== undefined) {\n const reactId = maybeReactUseId();\n return idOverride != null ? idOverride : reactId;\n }\n // eslint-disable-next-line react-hooks/rules-of-hooks -- `React.useId` is invariant at runtime.\n return useGlobalId(idOverride);\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"operators\", \"item\", \"field\", \"buttonRef\", \"headerFilterMenuRef\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { useGridApiContext } from '@mui/x-data-grid';\nimport { refType, unstable_useId as useId } from '@mui/utils';\nimport { unstable_gridHeaderFilteringMenuSelector } from '@mui/x-data-grid/internals';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst sx = {\n width: 22,\n height: 22,\n margin: 'auto 0 10px 5px'\n};\nfunction GridHeaderFilterMenuContainer(props) {\n var _rootProps$slotProps;\n const {\n operators,\n item,\n field,\n buttonRef,\n headerFilterMenuRef\n } = props,\n others = _objectWithoutPropertiesLoose(props, _excluded);\n const buttonId = useId();\n const menuId = useId();\n const rootProps = useGridRootProps();\n const apiRef = useGridApiContext();\n const open = Boolean(unstable_gridHeaderFilteringMenuSelector(apiRef) === field && headerFilterMenuRef.current);\n const handleClick = event => {\n headerFilterMenuRef.current = event.currentTarget;\n apiRef.current.showHeaderFilterMenu(field);\n };\n if (!rootProps.slots.headerFilterMenu) {\n return null;\n }\n return /*#__PURE__*/_jsxs(React.Fragment, {\n children: [/*#__PURE__*/_jsx(rootProps.slots.baseIconButton, _extends({\n id: buttonId,\n ref: buttonRef,\n \"aria-label\": apiRef.current.getLocaleText('filterPanelOperator'),\n title: apiRef.current.getLocaleText('filterPanelOperator'),\n \"aria-controls\": menuId,\n \"aria-expanded\": open ? 'true' : undefined,\n \"aria-haspopup\": \"true\",\n tabIndex: -1,\n size: \"small\",\n onClick: handleClick,\n sx: sx\n }, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseIconButton, {\n children: /*#__PURE__*/_jsx(rootProps.slots.openFilterButtonIcon, {\n fontSize: \"small\"\n })\n })), /*#__PURE__*/_jsx(rootProps.slots.headerFilterMenu, _extends({\n field: field,\n open: open,\n item: item,\n target: headerFilterMenuRef.current,\n operators: operators,\n labelledBy: buttonId,\n id: menuId\n }, others))]\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? GridHeaderFilterMenuContainer.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n applyFilterChanges: PropTypes.func.isRequired,\n buttonRef: refType,\n field: PropTypes.string.isRequired,\n headerFilterMenuRef: PropTypes.shape({\n current: PropTypes.object\n }).isRequired,\n item: PropTypes.shape({\n field: PropTypes.string.isRequired,\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n operator: PropTypes.string.isRequired,\n value: PropTypes.any\n }).isRequired,\n operators: PropTypes.arrayOf(PropTypes.shape({\n getApplyFilterFn: PropTypes.func.isRequired,\n getApplyFilterFnV7: PropTypes.func,\n getValueAsString: PropTypes.func,\n headerLabel: PropTypes.string,\n InputComponent: PropTypes.elementType,\n InputComponentProps: PropTypes.object,\n label: PropTypes.string,\n requiresFilterValue: PropTypes.bool,\n value: PropTypes.string.isRequired\n })).isRequired\n} : void 0;\nexport { GridHeaderFilterMenuContainer };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst sx = {\n padding: '2px'\n};\nfunction GridHeaderFilterClearButton({\n onClick\n}) {\n var _rootProps$slotProps;\n const rootProps = useGridRootProps();\n return /*#__PURE__*/_jsx(rootProps.slots.baseIconButton, _extends({\n tabIndex: -1,\n \"aria-label\": \"Clear filter\",\n size: \"small\",\n onClick: onClick,\n sx: sx\n }, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseIconButton, {\n children: /*#__PURE__*/_jsx(rootProps.slots.columnMenuClearIcon, {\n fontSize: \"inherit\"\n })\n }));\n}\nexport { GridHeaderFilterClearButton };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"colIndex\", \"height\", \"hasFocus\", \"filterOperators\", \"width\", \"headerClassName\", \"colDef\", \"item\", \"headerFilterMenuRef\", \"InputComponentProps\", \"showClearIcon\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_useForkRef as useForkRef, unstable_composeClasses as composeClasses, unstable_capitalize as capitalize } from '@mui/utils';\nimport { gridVisibleColumnFieldsSelector, getDataGridUtilityClass } from '@mui/x-data-grid';\nimport { useGridPrivateApiContext, unstable_gridHeaderFilteringEditFieldSelector, unstable_gridHeaderFilteringMenuSelector, isNavigationKey } from '@mui/x-data-grid/internals';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { GridHeaderFilterMenuContainer } from './GridHeaderFilterMenuContainer';\nimport { GridHeaderFilterClearButton } from './GridHeaderFilterClearButton';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n colDef,\n classes,\n showColumnVerticalBorder\n } = ownerState;\n const slots = {\n root: ['columnHeader', colDef.headerAlign === 'left' && 'columnHeader--alignLeft', colDef.headerAlign === 'center' && 'columnHeader--alignCenter', colDef.headerAlign === 'right' && 'columnHeader--alignRight', 'withBorderColor', showColumnVerticalBorder && 'columnHeader--withRightBorder']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nconst dateSx = {\n [`& input[value=\"\"]:not(:focus)`]: {\n color: 'transparent'\n }\n};\nconst GridHeaderFilterCell = /*#__PURE__*/React.forwardRef((props, ref) => {\n var _filterOperators$find, _currentOperator$head, _colDef$headerName;\n const {\n colIndex,\n height,\n hasFocus,\n filterOperators,\n width,\n headerClassName,\n colDef,\n item,\n headerFilterMenuRef,\n InputComponentProps,\n showClearIcon = true\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const apiRef = useGridPrivateApiContext();\n const columnFields = gridVisibleColumnFieldsSelector(apiRef);\n const rootProps = useGridRootProps();\n const cellRef = React.useRef(null);\n const handleRef = useForkRef(ref, cellRef);\n const inputRef = React.useRef(null);\n const buttonRef = React.useRef(null);\n const isEditing = unstable_gridHeaderFilteringEditFieldSelector(apiRef) === colDef.field;\n const isMenuOpen = unstable_gridHeaderFilteringMenuSelector(apiRef) === colDef.field;\n const currentOperator = filterOperators[0];\n const InputComponent = colDef.filterable ? currentOperator.InputComponent : null;\n const applyFilterChanges = React.useCallback(updatedItem => {\n if (item.value && !updatedItem.value) {\n apiRef.current.deleteFilterItem(updatedItem);\n return;\n }\n apiRef.current.upsertFilterItem(updatedItem);\n }, [apiRef, item]);\n const clearFilterItem = React.useCallback(() => {\n apiRef.current.deleteFilterItem(item);\n }, [apiRef, item]);\n let headerFilterComponent;\n if (colDef.renderHeaderFilter) {\n headerFilterComponent = colDef.renderHeaderFilter(props);\n }\n React.useLayoutEffect(() => {\n if (hasFocus && !isMenuOpen) {\n let focusableElement = cellRef.current.querySelector('[tabindex=\"0\"]');\n if (isEditing && InputComponent) {\n focusableElement = inputRef.current;\n }\n const elementToFocus = focusableElement || cellRef.current;\n elementToFocus == null || elementToFocus.focus();\n apiRef.current.columnHeadersContainerElementRef.current.scrollLeft = 0;\n }\n }, [InputComponent, apiRef, hasFocus, isEditing, isMenuOpen]);\n const onKeyDown = React.useCallback(event => {\n if (isMenuOpen || isNavigationKey(event.key)) {\n return;\n }\n switch (event.key) {\n case 'Escape':\n if (isEditing) {\n apiRef.current.stopHeaderFilterEditMode();\n }\n break;\n case 'Enter':\n if (isEditing) {\n apiRef.current.stopHeaderFilterEditMode();\n break;\n }\n if (event.metaKey || event.ctrlKey) {\n headerFilterMenuRef.current = buttonRef.current;\n apiRef.current.showHeaderFilterMenu(colDef.field);\n break;\n }\n apiRef.current.startHeaderFilterEditMode(colDef.field);\n break;\n case 'Tab':\n {\n if (isEditing) {\n var _columnFields;\n const fieldToFocus = (_columnFields = columnFields[colIndex + (event.shiftKey ? -1 : 1)]) != null ? _columnFields : null;\n if (fieldToFocus) {\n apiRef.current.startHeaderFilterEditMode(fieldToFocus);\n apiRef.current.setColumnHeaderFilterFocus(fieldToFocus, event);\n }\n }\n break;\n }\n default:\n if (isEditing || event.metaKey || event.ctrlKey || event.altKey || event.shiftKey) {\n break;\n }\n apiRef.current.startHeaderFilterEditMode(colDef.field);\n break;\n }\n }, [apiRef, colDef.field, colIndex, columnFields, headerFilterMenuRef, isEditing, isMenuOpen]);\n const publish = React.useCallback((eventName, propHandler) => event => {\n apiRef.current.publishEvent(eventName, apiRef.current.getColumnHeaderParams(colDef.field), event);\n if (propHandler) {\n propHandler(event);\n }\n }, [apiRef, colDef.field]);\n const onMouseDown = React.useCallback(event => {\n if (!hasFocus) {\n if (inputRef.current && inputRef.current.contains(event.target)) {\n inputRef.current.focus();\n }\n apiRef.current.setColumnHeaderFilterFocus(colDef.field, event);\n }\n }, [apiRef, colDef.field, hasFocus]);\n const mouseEventsHandlers = React.useMemo(() => ({\n onKeyDown: publish('headerFilterKeyDown', onKeyDown),\n onClick: publish('headerFilterClick'),\n onMouseDown: publish('headerFilterMouseDown', onMouseDown),\n onBlur: publish('headerFilterBlur')\n }), [onMouseDown, onKeyDown, publish]);\n const ownerState = _extends({}, rootProps, {\n colDef\n });\n const classes = useUtilityClasses(ownerState);\n const isNoInputOperator = (filterOperators == null || (_filterOperators$find = filterOperators.find(({\n value\n }) => item.operator === value)) == null ? void 0 : _filterOperators$find.requiresFilterValue) === false;\n const isApplied = Boolean(item == null ? void 0 : item.value) || isNoInputOperator;\n const label = (_currentOperator$head = currentOperator.headerLabel) != null ? _currentOperator$head : apiRef.current.getLocaleText(`headerFilterOperator${capitalize(item.operator)}`);\n const isFilterActive = isApplied || hasFocus;\n return /*#__PURE__*/_jsxs(\"div\", _extends({\n className: clsx(classes.root, headerClassName),\n ref: handleRef,\n style: {\n height,\n width,\n minWidth: width,\n maxWidth: width\n },\n role: \"columnheader\",\n \"aria-colindex\": colIndex + 1,\n \"aria-label\": headerFilterComponent == null ? (_colDef$headerName = colDef.headerName) != null ? _colDef$headerName : colDef.field : undefined\n }, other, mouseEventsHandlers, {\n children: [headerFilterComponent, InputComponent && headerFilterComponent === undefined ? /*#__PURE__*/_jsxs(React.Fragment, {\n children: [/*#__PURE__*/_jsx(InputComponent, _extends({\n apiRef: apiRef,\n item: item,\n inputRef: inputRef,\n applyValue: applyFilterChanges,\n onFocus: () => apiRef.current.startHeaderFilterEditMode(colDef.field),\n onBlur: event => {\n var _event$relatedTarget;\n apiRef.current.stopHeaderFilterEditMode();\n // Blurring an input element should reset focus state only if `relatedTarget` is not the header filter cell\n if (!((_event$relatedTarget = event.relatedTarget) != null && _event$relatedTarget.className.includes('columnHeader'))) {\n apiRef.current.setState(state => _extends({}, state, {\n focus: {\n cell: null,\n columnHeader: null,\n columnHeaderFilter: null,\n columnGroupHeader: null\n }\n }));\n }\n },\n label: capitalize(label),\n placeholder: \"\",\n isFilterActive: isFilterActive,\n clearButton: showClearIcon && isApplied ? /*#__PURE__*/_jsx(GridHeaderFilterClearButton, {\n onClick: clearFilterItem\n }) : null,\n disabled: isNoInputOperator,\n tabIndex: -1,\n InputLabelProps: null,\n sx: colDef.type === 'date' || colDef.type === 'dateTime' ? dateSx : undefined\n }, isNoInputOperator ? {\n value: ''\n } : {}, currentOperator == null ? void 0 : currentOperator.InputComponentProps, InputComponentProps)), /*#__PURE__*/_jsx(GridHeaderFilterMenuContainer, {\n operators: filterOperators,\n item: item,\n field: colDef.field,\n applyFilterChanges: applyFilterChanges,\n headerFilterMenuRef: headerFilterMenuRef,\n buttonRef: buttonRef\n })]\n }) : null]\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridHeaderFilterCell.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n colDef: PropTypes.object.isRequired,\n colIndex: PropTypes.number.isRequired,\n filterOperators: PropTypes.arrayOf(PropTypes.shape({\n getApplyFilterFn: PropTypes.func.isRequired,\n getApplyFilterFnV7: PropTypes.func,\n getValueAsString: PropTypes.func,\n headerLabel: PropTypes.string,\n InputComponent: PropTypes.elementType,\n InputComponentProps: PropTypes.object,\n label: PropTypes.string,\n requiresFilterValue: PropTypes.bool,\n value: PropTypes.string.isRequired\n })),\n hasFocus: PropTypes.bool,\n /**\n * Class name that will be added in the column header cell.\n */\n headerClassName: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),\n headerFilterMenuRef: PropTypes.shape({\n current: PropTypes.object\n }).isRequired,\n height: PropTypes.number.isRequired,\n InputComponentProps: PropTypes.object,\n item: PropTypes.shape({\n field: PropTypes.string.isRequired,\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n operator: PropTypes.string.isRequired,\n value: PropTypes.any\n }).isRequired,\n showClearIcon: PropTypes.bool,\n sortIndex: PropTypes.number,\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\n width: PropTypes.number.isRequired\n} : void 0;\nexport { GridHeaderFilterCell };","'use client';\n\nimport * as React from 'react';\nimport setRef from '../setRef';\nexport default function useForkRef(...refs) {\n /**\n * This will create a new function if the refs passed to this hook change and are all defined.\n * This means react will call the old forkRef with `null` and the new forkRef\n * with the ref. Cleanup naturally emerges from this behavior.\n */\n return React.useMemo(() => {\n if (refs.every(ref => ref == null)) {\n return null;\n }\n return instance => {\n refs.forEach(ref => {\n setRef(ref, instance);\n });\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, refs);\n}","/**\n * TODO v5: consider making it private\n *\n * passes {value} to {ref}\n *\n * WARNING: Be sure to only call this inside a callback that is passed as a ref.\n * Otherwise, make sure to cleanup the previous {ref} if it changes. See\n * https://github.com/mui/material-ui/issues/13539\n *\n * Useful if you want to expose the ref of an inner component to the public API\n * while still using it inside the component.\n * @param ref A ref callback or ref object. If anything falsy, this is a no-op.\n */\nexport default function setRef(ref, value) {\n if (typeof ref === 'function') {\n ref(value);\n } else if (ref) {\n ref.current = value;\n }\n}","import * as React from 'react';\nimport { createSvgIcon } from '@mui/material/utils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const GridPushPinRightIcon = createSvgIcon( /*#__PURE__*/_jsx(\"g\", {\n transform: \"rotate(-30 15 10)\",\n children: /*#__PURE__*/_jsx(\"path\", {\n d: \"M16,9V4l1,0c0.55,0,1-0.45,1-1v0c0-0.55-0.45-1-1-1H7C6.45,2,6,2.45,6,3v0 c0,0.55,0.45,1,1,1l1,0v5c0,1.66-1.34,3-3,3h0v2h5.97v7l1,1l1-1v-7H19v-2h0C17.34,12,16,10.66,16,9z\",\n fillRule: \"evenodd\"\n })\n}), 'PushPinRight');\nexport const GridPushPinLeftIcon = createSvgIcon( /*#__PURE__*/_jsx(\"g\", {\n transform: \"rotate(30 8 12)\",\n children: /*#__PURE__*/_jsx(\"path\", {\n d: \"M16,9V4l1,0c0.55,0,1-0.45,1-1v0c0-0.55-0.45-1-1-1H7C6.45,2,6,2.45,6,3v0 c0,0.55,0.45,1,1,1l1,0v5c0,1.66-1.34,3-3,3h0v2h5.97v7l1,1l1-1v-7H19v-2h0C17.34,12,16,10.66,16,9z\",\n fillRule: \"evenodd\"\n })\n}), 'PushPinLeft');","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { GridPushPinRightIcon, GridPushPinLeftIcon } from './icons';\nconst iconSlots = {\n ColumnMenuPinRightIcon: GridPushPinRightIcon,\n ColumnMenuPinLeftIcon: GridPushPinLeftIcon\n};\nconst materialSlots = _extends({}, iconSlots);\nexport default materialSlots;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { DATA_GRID_DEFAULT_SLOTS_COMPONENTS } from '@mui/x-data-grid/internals';\nimport { GridProColumnMenu } from '../components/GridProColumnMenu';\nimport { GridColumnHeaders } from '../components/GridColumnHeaders';\nimport { GridHeaderFilterMenu } from '../components/headerFiltering/GridHeaderFilterMenu';\nimport { GridHeaderFilterCell } from '../components/headerFiltering/GridHeaderFilterCell';\nimport materialSlots from '../material';\nexport const DATA_GRID_PRO_DEFAULT_SLOTS_COMPONENTS = _extends({}, DATA_GRID_DEFAULT_SLOTS_COMPONENTS, materialSlots, {\n ColumnMenu: GridProColumnMenu,\n ColumnHeaders: GridColumnHeaders,\n HeaderFilterCell: GridHeaderFilterCell,\n HeaderFilterMenu: GridHeaderFilterMenu\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport MenuList from '@mui/material/MenuList';\nimport MenuItem from '@mui/material/MenuItem';\nimport { unstable_capitalize as capitalize, HTMLElementType } from '@mui/utils';\nimport { useGridApiContext, GridMenu } from '@mui/x-data-grid';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction GridHeaderFilterMenu({\n open,\n field,\n target,\n applyFilterChanges,\n operators,\n item,\n id,\n labelledBy\n}) {\n const apiRef = useGridApiContext();\n const hideMenu = React.useCallback(() => {\n apiRef.current.hideHeaderFilterMenu();\n }, [apiRef]);\n const handleListKeyDown = React.useCallback(event => {\n if (event.key === 'Tab') {\n event.preventDefault();\n }\n if (event.key === 'Escape' || event.key === 'Tab') {\n hideMenu();\n }\n }, [hideMenu]);\n if (!target) {\n return null;\n }\n return /*#__PURE__*/_jsx(GridMenu, {\n placement: \"bottom-end\",\n open: open,\n target: target,\n onClose: hideMenu,\n children: /*#__PURE__*/_jsx(MenuList, {\n \"aria-labelledby\": labelledBy,\n id: id,\n onKeyDown: handleListKeyDown,\n children: operators.map((op, i) => {\n var _op$headerLabel;\n const label = (_op$headerLabel = op == null ? void 0 : op.headerLabel) != null ? _op$headerLabel : apiRef.current.getLocaleText(`headerFilterOperator${capitalize(op.value)}`);\n return /*#__PURE__*/_jsx(MenuItem, {\n onClick: () => {\n applyFilterChanges(_extends({}, item, {\n operator: op.value\n }));\n hideMenu();\n },\n autoFocus: i === 0 ? open : false,\n selected: op.value === item.operator,\n children: label\n }, `${field}-${op.value}`);\n })\n })\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? GridHeaderFilterMenu.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n applyFilterChanges: PropTypes.func.isRequired,\n field: PropTypes.string.isRequired,\n id: PropTypes.string.isRequired,\n item: PropTypes.shape({\n field: PropTypes.string.isRequired,\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n operator: PropTypes.string.isRequired,\n value: PropTypes.any\n }).isRequired,\n labelledBy: PropTypes.string.isRequired,\n open: PropTypes.bool.isRequired,\n operators: PropTypes.arrayOf(PropTypes.shape({\n getApplyFilterFn: PropTypes.func.isRequired,\n getApplyFilterFnV7: PropTypes.func,\n getValueAsString: PropTypes.func,\n headerLabel: PropTypes.string,\n InputComponent: PropTypes.elementType,\n InputComponentProps: PropTypes.object,\n label: PropTypes.string,\n requiresFilterValue: PropTypes.bool,\n value: PropTypes.string.isRequired\n })).isRequired,\n target: HTMLElementType\n} : void 0;\nexport { GridHeaderFilterMenu };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useThemeProps } from '@mui/material/styles';\nimport { GRID_DEFAULT_LOCALE_TEXT, DATA_GRID_PROPS_DEFAULT_VALUES } from '@mui/x-data-grid';\nimport { computeSlots, uncapitalizeObjectKeys, useProps } from '@mui/x-data-grid/internals';\nimport { DATA_GRID_PRO_DEFAULT_SLOTS_COMPONENTS } from '../constants/dataGridProDefaultSlotsComponents';\n\n/**\n * The default values of `DataGridProPropsWithDefaultValue` to inject in the props of DataGridPro.\n */\nexport const DATA_GRID_PRO_PROPS_DEFAULT_VALUES = _extends({}, DATA_GRID_PROPS_DEFAULT_VALUES, {\n scrollEndThreshold: 80,\n treeData: false,\n defaultGroupingExpansionDepth: 0,\n autosizeOnMount: false,\n disableAutosize: false,\n disableColumnPinning: false,\n keepColumnPositionIfDraggedOutside: false,\n disableChildrenFiltering: false,\n disableChildrenSorting: false,\n rowReordering: false,\n rowsLoadingMode: 'client',\n getDetailPanelHeight: () => 500,\n unstable_headerFilters: false\n});\nconst defaultSlots = uncapitalizeObjectKeys(DATA_GRID_PRO_DEFAULT_SLOTS_COMPONENTS);\nexport const useDataGridProProps = inProps => {\n const [components, componentsProps, themedProps] = useProps(useThemeProps({\n props: inProps,\n name: 'MuiDataGrid'\n }));\n const localeText = React.useMemo(() => _extends({}, GRID_DEFAULT_LOCALE_TEXT, themedProps.localeText), [themedProps.localeText]);\n const slots = React.useMemo(() => computeSlots({\n defaultSlots,\n slots: themedProps.slots,\n components\n }), [components, themedProps.slots]);\n return React.useMemo(() => {\n var _themedProps$slotProp;\n return _extends({}, DATA_GRID_PRO_PROPS_DEFAULT_VALUES, themedProps, {\n localeText,\n slots,\n slotProps: (_themedProps$slotProp = themedProps.slotProps) != null ? _themedProps$slotProp : componentsProps,\n signature: 'DataGridPro'\n });\n }, [themedProps, localeText, slots, componentsProps]);\n};","import { isNumber } from '@mui/x-data-grid-pro/internals';\nconst sumAgg = {\n apply: ({\n values\n }) => {\n let sum = 0;\n for (let i = 0; i < values.length; i += 1) {\n const value = values[i];\n if (isNumber(value)) {\n sum += value;\n }\n }\n return sum;\n },\n columnTypes: ['number']\n};\nconst avgAgg = {\n apply: ({\n values\n }) => {\n if (values.length === 0) {\n return null;\n }\n let sum = 0;\n let valuesCount = 0;\n for (let i = 0; i < values.length; i += 1) {\n const value = values[i];\n if (isNumber(value)) {\n valuesCount += 1;\n sum += value;\n }\n }\n return sum / valuesCount;\n },\n columnTypes: ['number']\n};\nconst minAgg = {\n apply: ({\n values\n }) => {\n if (values.length === 0) {\n return null;\n }\n let min = +Infinity;\n for (let i = 0; i < values.length; i += 1) {\n const value = values[i];\n if (value != null && value < min) {\n min = value;\n }\n }\n return min;\n },\n columnTypes: ['number', 'date', 'dateTime']\n};\nconst maxAgg = {\n apply: ({\n values\n }) => {\n if (values.length === 0) {\n return null;\n }\n let max = -Infinity;\n for (let i = 0; i < values.length; i += 1) {\n const value = values[i];\n if (value != null && value > max) {\n max = value;\n }\n }\n return max;\n },\n columnTypes: ['number', 'date', 'dateTime']\n};\nconst sizeAgg = {\n apply: ({\n values\n }) => {\n return values.filter(value => typeof value !== 'undefined').length;\n },\n valueFormatter: params => {\n if (params.value == null || !isNumber(params.value)) {\n return params.value;\n }\n return params.value.toLocaleString();\n },\n hasCellUnit: false\n};\nexport const GRID_AGGREGATION_FUNCTIONS = {\n sum: sumAgg,\n avg: avgAgg,\n min: minAgg,\n max: maxAgg,\n size: sizeAgg\n};","export default function _typeof(o) {\n \"@babel/helpers - typeof\";\n\n return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) {\n return typeof o;\n } : function (o) {\n return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o;\n }, _typeof(o);\n}","import _typeof from \"./typeof.js\";\nimport toPrimitive from \"./toPrimitive.js\";\nexport default function _toPropertyKey(arg) {\n var key = toPrimitive(arg, \"string\");\n return _typeof(key) === \"symbol\" ? key : String(key);\n}","import _typeof from \"./typeof.js\";\nexport default function _toPrimitive(input, hint) {\n if (_typeof(input) !== \"object\" || input === null) return input;\n var prim = input[Symbol.toPrimitive];\n if (prim !== undefined) {\n var res = prim.call(input, hint || \"default\");\n if (_typeof(res) !== \"object\") return res;\n throw new TypeError(\"@@toPrimitive must return a primitive value.\");\n }\n return (hint === \"string\" ? String : Number)(input);\n}","'use client';\n\nimport * as React from 'react';\nlet globalId = 0;\nfunction useGlobalId(idOverride) {\n const [defaultId, setDefaultId] = React.useState(idOverride);\n const id = idOverride || defaultId;\n React.useEffect(() => {\n if (defaultId == null) {\n // Fallback to this default id when possible.\n // Use the incrementing value for client-side rendering only.\n // We can't use it server-side.\n // If you want to use random values please consider the Birthday Problem: https://en.wikipedia.org/wiki/Birthday_problem\n globalId += 1;\n setDefaultId(`mui-${globalId}`);\n }\n }, [defaultId]);\n return id;\n}\n\n// downstream bundlers may remove unnecessary concatenation, but won't remove toString call -- Workaround for https://github.com/webpack/webpack/issues/14814\nconst maybeReactUseId = React['useId'.toString()];\n/**\n *\n * @example
\n * @param idOverride\n * @returns {string}\n */\nexport default function useId(idOverride) {\n if (maybeReactUseId !== undefined) {\n const reactId = maybeReactUseId();\n return idOverride != null ? idOverride : reactId;\n }\n // eslint-disable-next-line react-hooks/rules-of-hooks -- `React.useId` is invariant at runtime.\n return useGlobalId(idOverride);\n}","import * as React from 'react';\nimport PropTypes from 'prop-types';\nimport MenuItem from '@mui/material/MenuItem';\nimport ListItemIcon from '@mui/material/ListItemIcon';\nimport ListItemText from '@mui/material/ListItemText';\nimport { useGridSelector, gridColumnLookupSelector } from '@mui/x-data-grid-pro';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { gridRowGroupingSanitizedModelSelector } from '../hooks/features/rowGrouping/gridRowGroupingSelector';\nimport { getRowGroupingCriteriaFromGroupingField, GRID_ROW_GROUPING_SINGLE_GROUPING_FIELD, isGroupingColumn } from '../hooks/features/rowGrouping/gridRowGroupingUtils';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nfunction GridColumnMenuRowGroupItem(props) {\n const {\n colDef,\n onClick\n } = props;\n const apiRef = useGridApiContext();\n const rowGroupingModel = useGridSelector(apiRef, gridRowGroupingSanitizedModelSelector);\n const columnsLookup = useGridSelector(apiRef, gridColumnLookupSelector);\n const rootProps = useGridRootProps();\n const renderUnGroupingMenuItem = field => {\n var _columnsLookup$field$;\n const ungroupColumn = event => {\n apiRef.current.removeRowGroupingCriteria(field);\n onClick(event);\n };\n const name = (_columnsLookup$field$ = columnsLookup[field].headerName) != null ? _columnsLookup$field$ : field;\n return /*#__PURE__*/_jsxs(MenuItem, {\n onClick: ungroupColumn,\n children: [/*#__PURE__*/_jsx(ListItemIcon, {\n children: /*#__PURE__*/_jsx(rootProps.slots.columnMenuUngroupIcon, {\n fontSize: \"small\"\n })\n }), /*#__PURE__*/_jsx(ListItemText, {\n children: apiRef.current.getLocaleText('unGroupColumn')(name)\n })]\n }, field);\n };\n if (!colDef || !isGroupingColumn(colDef.field)) {\n return null;\n }\n if (colDef.field === GRID_ROW_GROUPING_SINGLE_GROUPING_FIELD) {\n return /*#__PURE__*/_jsx(React.Fragment, {\n children: rowGroupingModel.map(renderUnGroupingMenuItem)\n });\n }\n return renderUnGroupingMenuItem(getRowGroupingCriteriaFromGroupingField(colDef.field));\n}\nprocess.env.NODE_ENV !== \"production\" ? GridColumnMenuRowGroupItem.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n colDef: PropTypes.object.isRequired,\n onClick: PropTypes.func.isRequired\n} : void 0;\nexport { GridColumnMenuRowGroupItem };","import * as React from 'react';\nimport PropTypes from 'prop-types';\nimport MenuItem from '@mui/material/MenuItem';\nimport ListItemIcon from '@mui/material/ListItemIcon';\nimport ListItemText from '@mui/material/ListItemText';\nimport { gridColumnLookupSelector, useGridSelector } from '@mui/x-data-grid-pro';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { gridRowGroupingSanitizedModelSelector } from '../hooks/features/rowGrouping/gridRowGroupingSelector';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nfunction GridColumnMenuRowUngroupItem(props) {\n var _columnsLookup$colDef;\n const {\n colDef,\n onClick\n } = props;\n const apiRef = useGridApiContext();\n const rowGroupingModel = useGridSelector(apiRef, gridRowGroupingSanitizedModelSelector);\n const columnsLookup = useGridSelector(apiRef, gridColumnLookupSelector);\n const rootProps = useGridRootProps();\n if (!colDef.groupable) {\n return null;\n }\n const ungroupColumn = event => {\n apiRef.current.removeRowGroupingCriteria(colDef.field);\n onClick(event);\n };\n const groupColumn = event => {\n apiRef.current.addRowGroupingCriteria(colDef.field);\n onClick(event);\n };\n const name = (_columnsLookup$colDef = columnsLookup[colDef.field].headerName) != null ? _columnsLookup$colDef : colDef.field;\n if (rowGroupingModel.includes(colDef.field)) {\n return /*#__PURE__*/_jsxs(MenuItem, {\n onClick: ungroupColumn,\n children: [/*#__PURE__*/_jsx(ListItemIcon, {\n children: /*#__PURE__*/_jsx(rootProps.slots.columnMenuUngroupIcon, {\n fontSize: \"small\"\n })\n }), /*#__PURE__*/_jsx(ListItemText, {\n children: apiRef.current.getLocaleText('unGroupColumn')(name)\n })]\n });\n }\n return /*#__PURE__*/_jsxs(MenuItem, {\n onClick: groupColumn,\n children: [/*#__PURE__*/_jsx(ListItemIcon, {\n children: /*#__PURE__*/_jsx(rootProps.slots.columnMenuGroupIcon, {\n fontSize: \"small\"\n })\n }), /*#__PURE__*/_jsx(ListItemText, {\n children: apiRef.current.getLocaleText('groupColumn')(name)\n })]\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? GridColumnMenuRowUngroupItem.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n colDef: PropTypes.object.isRequired,\n onClick: PropTypes.func.isRequired\n} : void 0;\nexport { GridColumnMenuRowUngroupItem };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { GridGenericColumnMenu, GRID_COLUMN_MENU_SLOTS, GRID_COLUMN_MENU_SLOT_PROPS } from '@mui/x-data-grid-pro';\nimport { GridColumnMenuAggregationItem } from './GridColumnMenuAggregationItem';\nimport { isGroupingColumn } from '../hooks/features/rowGrouping';\nimport { GridColumnMenuRowGroupItem } from './GridColumnMenuRowGroupItem';\nimport { GridColumnMenuRowUngroupItem } from './GridColumnMenuRowUngroupItem';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport function GridColumnMenuGroupingItem(props) {\n const {\n colDef\n } = props;\n if (isGroupingColumn(colDef.field)) {\n return /*#__PURE__*/_jsx(GridColumnMenuRowGroupItem, _extends({}, props));\n }\n if (colDef.groupable) {\n return /*#__PURE__*/_jsx(GridColumnMenuRowUngroupItem, _extends({}, props));\n }\n return null;\n}\nexport const GRID_COLUMN_MENU_SLOTS_PREMIUM = _extends({}, GRID_COLUMN_MENU_SLOTS, {\n columnMenuAggregationItem: GridColumnMenuAggregationItem,\n columnMenuGroupingItem: GridColumnMenuGroupingItem\n});\nexport const GRID_COLUMN_MENU_SLOT_PROPS_PREMIUM = _extends({}, GRID_COLUMN_MENU_SLOT_PROPS, {\n columnMenuAggregationItem: {\n displayOrder: 23\n },\n columnMenuGroupingItem: {\n displayOrder: 27\n }\n});\nconst GridPremiumColumnMenu = /*#__PURE__*/React.forwardRef(function GridPremiumColumnMenuSimple(props, ref) {\n return /*#__PURE__*/_jsx(GridGenericColumnMenu, _extends({\n ref: ref\n }, props, {\n defaultSlots: GRID_COLUMN_MENU_SLOTS_PREMIUM,\n defaultSlotProps: GRID_COLUMN_MENU_SLOT_PROPS_PREMIUM\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridPremiumColumnMenu.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n colDef: PropTypes.object.isRequired,\n hideMenu: PropTypes.func.isRequired,\n open: PropTypes.bool.isRequired\n} : void 0;\nexport { GridPremiumColumnMenu };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _toPropertyKey from \"@babel/runtime/helpers/esm/toPropertyKey\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { useGridSelector } from '@mui/x-data-grid-pro';\nimport MenuItem from '@mui/material/MenuItem';\nimport ListItemIcon from '@mui/material/ListItemIcon';\nimport ListItemText from '@mui/material/ListItemText';\nimport FormControl from '@mui/material/FormControl';\nimport InputLabel from '@mui/material/InputLabel';\nimport { unstable_useId as useId } from '@mui/utils';\nimport Select from '@mui/material/Select';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { canColumnHaveAggregationFunction, getAggregationFunctionLabel, getAvailableAggregationFunctions } from '../hooks/features/aggregation/gridAggregationUtils';\nimport { gridAggregationModelSelector } from '../hooks/features/aggregation/gridAggregationSelectors';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nfunction GridColumnMenuAggregationItem(props) {\n const {\n colDef\n } = props;\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const id = useId();\n const aggregationModel = useGridSelector(apiRef, gridAggregationModelSelector);\n const availableAggregationFunctions = React.useMemo(() => getAvailableAggregationFunctions({\n aggregationFunctions: rootProps.aggregationFunctions,\n colDef\n }), [colDef, rootProps.aggregationFunctions]);\n const selectedAggregationRule = React.useMemo(() => {\n if (!colDef || !aggregationModel[colDef.field]) {\n return '';\n }\n const aggregationFunctionName = aggregationModel[colDef.field];\n if (canColumnHaveAggregationFunction({\n colDef,\n aggregationFunctionName,\n aggregationFunction: rootProps.aggregationFunctions[aggregationFunctionName]\n })) {\n return aggregationFunctionName;\n }\n return '';\n }, [rootProps.aggregationFunctions, aggregationModel, colDef]);\n const handleAggregationItemChange = event => {\n var _event$target;\n const newAggregationItem = ((_event$target = event.target) == null ? void 0 : _event$target.value) || undefined;\n const currentModel = gridAggregationModelSelector(apiRef);\n const _colDef$field = colDef.field,\n otherColumnItems = _objectWithoutPropertiesLoose(currentModel, [_colDef$field].map(_toPropertyKey));\n const newModel = newAggregationItem == null ? otherColumnItems : _extends({}, otherColumnItems, {\n [colDef == null ? void 0 : colDef.field]: newAggregationItem\n });\n apiRef.current.setAggregationModel(newModel);\n apiRef.current.hideColumnMenu();\n };\n const label = apiRef.current.getLocaleText('aggregationMenuItemHeader');\n return /*#__PURE__*/_jsxs(MenuItem, {\n disableRipple: true,\n children: [/*#__PURE__*/_jsx(ListItemIcon, {\n children: /*#__PURE__*/_jsx(rootProps.slots.columnMenuAggregationIcon, {\n fontSize: \"small\"\n })\n }), /*#__PURE__*/_jsx(ListItemText, {\n children: /*#__PURE__*/_jsxs(FormControl, {\n size: \"small\",\n fullWidth: true,\n sx: {\n minWidth: 150\n },\n children: [/*#__PURE__*/_jsx(InputLabel, {\n id: `${id}-label`,\n children: label\n }), /*#__PURE__*/_jsxs(Select, {\n labelId: `${id}-label`,\n id: `${id}-input`,\n value: selectedAggregationRule,\n label: label,\n color: \"primary\",\n onChange: handleAggregationItemChange,\n onBlur: e => e.stopPropagation(),\n fullWidth: true,\n children: [/*#__PURE__*/_jsx(MenuItem, {\n value: \"\",\n children: \"...\"\n }), availableAggregationFunctions.map(aggFunc => /*#__PURE__*/_jsx(MenuItem, {\n value: aggFunc,\n children: getAggregationFunctionLabel({\n apiRef,\n aggregationRule: {\n aggregationFunctionName: aggFunc,\n aggregationFunction: rootProps.aggregationFunctions[aggFunc]\n }\n })\n }, aggFunc))]\n })]\n })\n })]\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? GridColumnMenuAggregationItem.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n colDef: PropTypes.object.isRequired,\n onClick: PropTypes.func.isRequired\n} : void 0;\nexport { GridColumnMenuAggregationItem };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { GridWorkspacesIcon, GridGroupWorkIcon, GridFunctionsIcon } from './icons';\nconst iconsSlots = {\n ColumnMenuUngroupIcon: GridWorkspacesIcon,\n ColumnMenuGroupIcon: GridGroupWorkIcon,\n ColumnMenuAggregationIcon: GridFunctionsIcon\n};\nconst materialSlots = _extends({}, iconsSlots);\nexport default materialSlots;","import * as React from 'react';\nimport { createSvgIcon } from '@mui/material/utils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const GridWorkspacesIcon = createSvgIcon( /*#__PURE__*/_jsx(\"g\", {\n children: /*#__PURE__*/_jsx(\"path\", {\n d: \"M6,13c-2.2,0-4,1.8-4,4s1.8,4,4,4s4-1.8,4-4S8.2,13,6,13z M12,3C9.8,3,8,4.8,8,7s1.8,4,4,4s4-1.8,4-4S14.2,3,12,3z M18,13 c-2.2,0-4,1.8-4,4s1.8,4,4,4s4-1.8,4-4S20.2,13,18,13z\"\n })\n}), 'Workspaces');\nexport const GridGroupWorkIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zM8 17.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5zM9.5 8c0-1.38 1.12-2.5 2.5-2.5s2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5S9.5 9.38 9.5 8zm6.5 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z\"\n}), 'GroupWork');\nexport const GridFunctionsIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M18 4H6v2l6.5 6L6 18v2h12v-3h-7l5-5-5-5h7z\"\n}), 'Functions');","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { DATA_GRID_PRO_DEFAULT_SLOTS_COMPONENTS } from '@mui/x-data-grid-pro/internals';\nimport { GridPremiumColumnMenu } from '../components/GridPremiumColumnMenu';\nimport materialSlots from '../material';\nexport const DATA_GRID_PREMIUM_DEFAULT_SLOTS_COMPONENTS = _extends({}, DATA_GRID_PRO_DEFAULT_SLOTS_COMPONENTS, materialSlots, {\n ColumnMenu: GridPremiumColumnMenu\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useThemeProps } from '@mui/material/styles';\nimport { DATA_GRID_PRO_PROPS_DEFAULT_VALUES, GRID_DEFAULT_LOCALE_TEXT } from '@mui/x-data-grid-pro';\nimport { computeSlots, useProps, uncapitalizeObjectKeys } from '@mui/x-data-grid-pro/internals';\nimport { GRID_AGGREGATION_FUNCTIONS } from '../hooks/features/aggregation';\nimport { DATA_GRID_PREMIUM_DEFAULT_SLOTS_COMPONENTS } from '../constants/dataGridPremiumDefaultSlotsComponents';\n\n/**\n * The default values of `DataGridPremiumPropsWithDefaultValue` to inject in the props of DataGridPremium.\n */\nexport const DATA_GRID_PREMIUM_PROPS_DEFAULT_VALUES = _extends({}, DATA_GRID_PRO_PROPS_DEFAULT_VALUES, {\n unstable_cellSelection: false,\n disableAggregation: false,\n disableRowGrouping: false,\n rowGroupingColumnMode: 'single',\n aggregationFunctions: GRID_AGGREGATION_FUNCTIONS,\n aggregationRowsScope: 'filtered',\n getAggregationPosition: groupNode => groupNode.depth === -1 ? 'footer' : 'inline',\n disableClipboardPaste: false,\n unstable_splitClipboardPastedText: pastedText => {\n // Excel on Windows adds an empty line break at the end of the copied text.\n // See https://github.com/mui/mui-x/issues/9103\n const text = pastedText.replace(/\\r?\\n$/, '');\n return text.split(/\\r\\n|\\n|\\r/).map(row => row.split('\\t'));\n }\n});\nconst defaultSlots = uncapitalizeObjectKeys(DATA_GRID_PREMIUM_DEFAULT_SLOTS_COMPONENTS);\nexport const useDataGridPremiumProps = inProps => {\n const [components, componentsProps, themedProps] = useProps(useThemeProps({\n props: inProps,\n name: 'MuiDataGrid'\n }));\n const localeText = React.useMemo(() => _extends({}, GRID_DEFAULT_LOCALE_TEXT, themedProps.localeText), [themedProps.localeText]);\n const slots = React.useMemo(() => computeSlots({\n defaultSlots,\n components,\n slots: themedProps.slots\n }), [components, themedProps.slots]);\n return React.useMemo(() => {\n var _themedProps$slotProp;\n return _extends({}, DATA_GRID_PREMIUM_PROPS_DEFAULT_VALUES, themedProps, {\n slotProps: (_themedProps$slotProp = themedProps.slotProps) != null ? _themedProps$slotProp : componentsProps,\n localeText,\n slots,\n signature: 'DataGridPremium'\n });\n }, [themedProps, componentsProps, localeText, slots]);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { useLicenseVerifier, Watermark } from '@mui/x-license-pro';\nimport { chainPropTypes } from '@mui/utils';\nimport { GridBody, GridFooterPlaceholder, GridHeader, GridRoot, GridContextProvider, useGridSelector, gridPinnedColumnsSelector } from '@mui/x-data-grid-pro';\nimport { DataGridProVirtualScroller } from '@mui/x-data-grid-pro/internals';\nimport { useDataGridPremiumComponent } from './useDataGridPremiumComponent';\nimport { useDataGridPremiumProps } from './useDataGridPremiumProps';\nimport { getReleaseInfo } from '../utils/releaseInfo';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst releaseInfo = getReleaseInfo();\nconst DataGridPremiumRaw = /*#__PURE__*/React.forwardRef(function DataGridPremium(inProps, ref) {\n const props = useDataGridPremiumProps(inProps);\n const privateApiRef = useDataGridPremiumComponent(props.apiRef, props);\n useLicenseVerifier('x-data-grid-premium', releaseInfo);\n const pinnedColumns = useGridSelector(privateApiRef, gridPinnedColumnsSelector);\n return /*#__PURE__*/_jsx(GridContextProvider, {\n privateApiRef: privateApiRef,\n props: props,\n children: /*#__PURE__*/_jsxs(GridRoot, _extends({\n className: props.className,\n style: props.style,\n sx: props.sx,\n ref: ref\n }, props.forwardedProps, {\n children: [/*#__PURE__*/_jsx(GridHeader, {}), /*#__PURE__*/_jsx(GridBody, {\n VirtualScrollerComponent: DataGridProVirtualScroller,\n ColumnHeadersProps: {\n pinnedColumns\n },\n children: /*#__PURE__*/_jsx(Watermark, {\n packageName: \"x-data-grid-premium\",\n releaseInfo: releaseInfo\n })\n }), /*#__PURE__*/_jsx(GridFooterPlaceholder, {})]\n }))\n });\n});\n/**\n * Demos:\n * - [DataGridPremium](https://mui.com/x/react-data-grid/demo/)\n *\n * API:\n * - [DataGridPremium API](https://mui.com/x/api/data-grid/data-grid-premium/)\n */\nexport const DataGridPremium = /*#__PURE__*/React.memo(DataGridPremiumRaw);\nprocess.env.NODE_ENV !== \"production\" ? DataGridPremiumRaw.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n /**\n * Aggregation functions available on the grid.\n * @default GRID_AGGREGATION_FUNCTIONS\n */\n aggregationFunctions: PropTypes.object,\n /**\n * Set the aggregation model of the grid.\n */\n aggregationModel: PropTypes.object,\n /**\n * Rows used to generate the aggregated value.\n * If `filtered`, the aggregated values are generated using only the rows currently passing the filtering process.\n * If `all`, the aggregated values are generated using all the rows.\n * @default \"filtered\"\n */\n aggregationRowsScope: PropTypes.oneOf(['all', 'filtered']),\n /**\n * The ref object that allows grid manipulation. Can be instantiated with `useGridApiRef()`.\n */\n apiRef: PropTypes.shape({\n current: PropTypes.object.isRequired\n }),\n /**\n * The label of the grid.\n */\n 'aria-label': PropTypes.string,\n /**\n * The id of the element containing a label for the grid.\n */\n 'aria-labelledby': PropTypes.string,\n /**\n * If `true`, the grid height is dynamic and follow the number of rows in the grid.\n * @default false\n */\n autoHeight: PropTypes.bool,\n /**\n * If `true`, the pageSize is calculated according to the container size and the max number of rows to avoid rendering a vertical scroll bar.\n * @default false\n */\n autoPageSize: PropTypes.bool,\n /**\n * If `true`, columns are autosized after the datagrid is mounted.\n * @default false\n */\n autosizeOnMount: PropTypes.bool,\n /**\n * The options for autosize when user-initiated.\n */\n autosizeOptions: PropTypes.shape({\n columns: PropTypes.arrayOf(PropTypes.string),\n expand: PropTypes.bool,\n includeHeaders: PropTypes.bool,\n includeOutliers: PropTypes.bool,\n outliersFactor: PropTypes.number\n }),\n /**\n * Controls the modes of the cells.\n */\n cellModesModel: PropTypes.object,\n /**\n * If `true`, the grid get a first column with a checkbox that allows to select rows.\n * @default false\n */\n checkboxSelection: PropTypes.bool,\n /**\n * If `true`, the \"Select All\" header checkbox selects only the rows on the current page. To be used in combination with `checkboxSelection`.\n * It only works if the pagination is enabled.\n * @default false\n */\n checkboxSelectionVisibleOnly: chainPropTypes(PropTypes.bool, props => {\n if (!props.pagination && props.checkboxSelectionVisibleOnly) {\n return new Error('MUI: The `checkboxSelectionVisibleOnly` prop has no effect when the pagination is not enabled.');\n }\n return null;\n }),\n /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n /**\n * The character used to separate cell values when copying to the clipboard.\n * @default '\\t'\n */\n clipboardCopyCellDelimiter: PropTypes.string,\n /**\n * Number of extra columns to be rendered before/after the visible slice.\n * @default 3\n */\n columnBuffer: PropTypes.number,\n columnGroupingModel: PropTypes.arrayOf(PropTypes.object),\n /**\n * Sets the height in pixel of the column headers in the grid.\n * @default 56\n */\n columnHeaderHeight: PropTypes.number,\n /**\n * Set of columns of type [[GridColDef[]]].\n */\n columns: PropTypes.arrayOf(PropTypes.object).isRequired,\n /**\n * Number of rows from the `columnBuffer` that can be visible before a new slice is rendered.\n * @default 3\n */\n columnThreshold: PropTypes.number,\n /**\n * Set the column visibility model of the grid.\n * If defined, the grid will ignore the `hide` property in [[GridColDef]].\n */\n columnVisibilityModel: PropTypes.object,\n /**\n * Overridable components.\n * @deprecated Use the `slots` prop instead.\n */\n components: PropTypes.object,\n /**\n * Overridable components props dynamically passed to the component at rendering.\n * @deprecated Use the `slotProps` prop instead.\n */\n componentsProps: PropTypes.object,\n /**\n * If above 0, the row children will be expanded up to this depth.\n * If equal to -1, all the row children will be expanded.\n * @default 0\n */\n defaultGroupingExpansionDepth: PropTypes.number,\n /**\n * Set the density of the grid.\n * @default \"standard\"\n */\n density: PropTypes.oneOf(['comfortable', 'compact', 'standard']),\n /**\n * The row ids to show the detail panel.\n */\n detailPanelExpandedRowIds: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired),\n /**\n * If `true`, aggregation is disabled.\n * @default false\n */\n disableAggregation: PropTypes.bool,\n /**\n * If `true`, column autosizing on header separator double-click is disabled.\n * @default false\n */\n disableAutosize: PropTypes.bool,\n /**\n * If `true`, the filtering will only be applied to the top level rows when grouping rows with the `treeData` prop.\n * @default false\n */\n disableChildrenFiltering: PropTypes.bool,\n /**\n * If `true`, the sorting will only be applied to the top level rows when grouping rows with the `treeData` prop.\n * @default false\n */\n disableChildrenSorting: PropTypes.bool,\n /**\n * If `true`, the clipboard paste is disabled.\n * @default false\n */\n disableClipboardPaste: PropTypes.bool,\n /**\n * If `true`, column filters are disabled.\n * @default false\n */\n disableColumnFilter: PropTypes.bool,\n /**\n * If `true`, the column menu is disabled.\n * @default false\n */\n disableColumnMenu: PropTypes.bool,\n /**\n * If `true`, the column pinning is disabled.\n * @default false\n */\n disableColumnPinning: PropTypes.bool,\n /**\n * If `true`, reordering columns is disabled.\n * @default false\n */\n disableColumnReorder: PropTypes.bool,\n /**\n * If `true`, resizing columns is disabled.\n * @default false\n */\n disableColumnResize: PropTypes.bool,\n /**\n * If `true`, hiding/showing columns is disabled.\n * @default false\n */\n disableColumnSelector: PropTypes.bool,\n /**\n * If `true`, the density selector is disabled.\n * @default false\n */\n disableDensitySelector: PropTypes.bool,\n /**\n * If `true`, `eval()` is not used for performance optimization.\n * @default false\n * @ignore - do not document\n */\n disableEval: PropTypes.bool,\n /**\n * If `true`, filtering with multiple columns is disabled.\n * @default false\n */\n disableMultipleColumnsFiltering: PropTypes.bool,\n /**\n * If `true`, sorting with multiple columns is disabled.\n * @default false\n */\n disableMultipleColumnsSorting: PropTypes.bool,\n /**\n * If `true`, multiple selection using the Ctrl or CMD key is disabled.\n * @default false\n */\n disableMultipleRowSelection: PropTypes.bool,\n /**\n * If `true`, the row grouping is disabled.\n * @default false\n */\n disableRowGrouping: PropTypes.bool,\n /**\n * If `true`, the selection on click on a row or cell is disabled.\n * @default false\n */\n disableRowSelectionOnClick: PropTypes.bool,\n /**\n * If `true`, the virtualization is disabled.\n * @default false\n */\n disableVirtualization: PropTypes.bool,\n /**\n * Controls whether to use the cell or row editing.\n * @default \"cell\"\n */\n editMode: PropTypes.oneOf(['cell', 'row']),\n /**\n * Unstable features, breaking changes might be introduced.\n * For each feature, if the flag is not explicitly set to `true`, then the feature is fully disabled, and neither property nor method calls will have any effect.\n */\n experimentalFeatures: PropTypes.shape({\n ariaV7: PropTypes.bool,\n clipboardPaste: PropTypes.bool,\n columnGrouping: PropTypes.bool,\n lazyLoading: PropTypes.bool,\n warnIfFocusStateIsNotSynced: PropTypes.bool\n }),\n /**\n * The milliseconds delay to wait after a keystroke before triggering filtering.\n * @default 150\n */\n filterDebounceMs: PropTypes.number,\n /**\n * Filtering can be processed on the server or client-side.\n * Set it to 'server' if you would like to handle filtering on the server-side.\n * @default \"client\"\n */\n filterMode: chainPropTypes(PropTypes.oneOf(['client', 'server']), props => {\n if (props.treeData && props.filterMode === 'server') {\n return new Error('MUI: The `filterMode=\"server\"` prop is not available when the `treeData` is enabled.');\n }\n return null;\n }),\n /**\n * Set the filter model of the grid.\n */\n filterModel: PropTypes.shape({\n items: PropTypes.arrayOf(PropTypes.shape({\n field: PropTypes.string.isRequired,\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n operator: PropTypes.string.isRequired,\n value: PropTypes.any\n })).isRequired,\n logicOperator: PropTypes.oneOf(['and', 'or']),\n quickFilterExcludeHiddenColumns: PropTypes.bool,\n quickFilterLogicOperator: PropTypes.oneOf(['and', 'or']),\n quickFilterValues: PropTypes.array\n }),\n /**\n * Forwarded props for the grid root element.\n * @ignore - do not document.\n */\n forwardedProps: PropTypes.object,\n /**\n * Determines the position of an aggregated value.\n * @param {GridGroupNode} groupNode The current group.\n * @returns {GridAggregationPosition | null} Position of the aggregated value (if `null`, the group isn't aggregated).\n * @default `(groupNode) => groupNode == null ? 'footer' : 'inline'`\n */\n getAggregationPosition: PropTypes.func,\n /**\n * Function that applies CSS classes dynamically on cells.\n * @param {GridCellParams} params With all properties from [[GridCellParams]].\n * @returns {string} The CSS class to apply to the cell.\n */\n getCellClassName: PropTypes.func,\n /**\n * Function that returns the element to render in row detail.\n * @param {GridRowParams} params With all properties from [[GridRowParams]].\n * @returns {React.JSX.Element} The row detail element.\n */\n getDetailPanelContent: PropTypes.func,\n /**\n * Function that returns the height of the row detail panel.\n * @param {GridRowParams} params With all properties from [[GridRowParams]].\n * @returns {number | string} The height in pixels or \"auto\" to use the content height.\n * @default \"() => 500\"\n */\n getDetailPanelHeight: PropTypes.func,\n /**\n * Function that returns the estimated height for a row.\n * Only works if dynamic row height is used.\n * Once the row height is measured this value is discarded.\n * @param {GridRowHeightParams} params With all properties from [[GridRowHeightParams]].\n * @returns {number | null} The estimated row height value. If `null` or `undefined` then the default row height, based on the density, is applied.\n */\n getEstimatedRowHeight: PropTypes.func,\n /**\n * Function that applies CSS classes dynamically on rows.\n * @param {GridRowClassNameParams} params With all properties from [[GridRowClassNameParams]].\n * @returns {string} The CSS class to apply to the row.\n */\n getRowClassName: PropTypes.func,\n /**\n * Function that sets the row height per row.\n * @param {GridRowHeightParams} params With all properties from [[GridRowHeightParams]].\n * @returns {GridRowHeightReturnValue} The row height value. If `null` or `undefined` then the default row height is applied. If \"auto\" then the row height is calculated based on the content.\n */\n getRowHeight: PropTypes.func,\n /**\n * Return the id of a given [[GridRowModel]].\n */\n getRowId: PropTypes.func,\n /**\n * Function that allows to specify the spacing between rows.\n * @param {GridRowSpacingParams} params With all properties from [[GridRowSpacingParams]].\n * @returns {GridRowSpacing} The row spacing values.\n */\n getRowSpacing: PropTypes.func,\n /**\n * Determines the path of a row in the tree data.\n * For instance, a row with the path [\"A\", \"B\"] is the child of the row with the path [\"A\"].\n * Note that all paths must contain at least one element.\n * @template R\n * @param {R} row The row from which we want the path.\n * @returns {string[]} The path to the row.\n */\n getTreeDataPath: PropTypes.func,\n /**\n * The grouping column used by the tree data.\n */\n groupingColDef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),\n /**\n * If `true`, the footer component is hidden.\n * @default false\n */\n hideFooter: PropTypes.bool,\n /**\n * If `true`, the pagination component in the footer is hidden.\n * @default false\n */\n hideFooterPagination: PropTypes.bool,\n /**\n * If `true`, the row count in the footer is hidden.\n * It has no effect if the pagination is enabled.\n * @default false\n */\n hideFooterRowCount: chainPropTypes(PropTypes.bool, props => {\n if (props.pagination && props.hideFooterRowCount) {\n return new Error('MUI: The `hideFooterRowCount` prop has no effect when the pagination is enabled.');\n }\n return null;\n }),\n /**\n * If `true`, the selected row count in the footer is hidden.\n * @default false\n */\n hideFooterSelectedRowCount: PropTypes.bool,\n /**\n * If `true`, the diacritics (accents) are ignored when filtering or quick filtering.\n * E.g. when filter value is `cafe`, the rows with `café` will be visible.\n * @default false\n */\n ignoreDiacritics: PropTypes.bool,\n /**\n * The initial state of the DataGridPremium.\n * The data in it is set in the state on initialization but isn't controlled.\n * If one of the data in `initialState` is also being controlled, then the control state wins.\n */\n initialState: PropTypes.object,\n /**\n * Callback fired when a cell is rendered, returns true if the cell is editable.\n * @param {GridCellParams} params With all properties from [[GridCellParams]].\n * @returns {boolean} A boolean indicating if the cell is editable.\n */\n isCellEditable: PropTypes.func,\n /**\n * Determines if a group should be expanded after its creation.\n * This prop takes priority over the `defaultGroupingExpansionDepth` prop.\n * @param {GridGroupNode} node The node of the group to test.\n * @returns {boolean} A boolean indicating if the group is expanded.\n */\n isGroupExpandedByDefault: PropTypes.func,\n /**\n * Determines if a row can be selected.\n * @param {GridRowParams} params With all properties from [[GridRowParams]].\n * @returns {boolean} A boolean indicating if the cell is selectable.\n */\n isRowSelectable: PropTypes.func,\n /**\n * If `true`, moving the mouse pointer outside the grid before releasing the mouse button\n * in a column re-order action will not cause the column to jump back to its original position.\n * @default false\n */\n keepColumnPositionIfDraggedOutside: PropTypes.bool,\n /**\n * If `true`, the selection model will retain selected rows that do not exist.\n * Useful when using server side pagination and row selections need to be retained\n * when changing pages.\n * @default false\n */\n keepNonExistentRowsSelected: PropTypes.bool,\n /**\n * If `true`, a loading overlay is displayed.\n */\n loading: PropTypes.bool,\n /**\n * Set the locale text of the grid.\n * You can find all the translation keys supported in [the source](https://github.com/mui/mui-x/blob/HEAD/packages/grid/x-data-grid/src/constants/localeTextConstants.ts) in the GitHub repository.\n */\n localeText: PropTypes.object,\n /**\n * Pass a custom logger in the components that implements the [[Logger]] interface.\n * @default console\n */\n logger: PropTypes.shape({\n debug: PropTypes.func.isRequired,\n error: PropTypes.func.isRequired,\n info: PropTypes.func.isRequired,\n warn: PropTypes.func.isRequired\n }),\n /**\n * Allows to pass the logging level or false to turn off logging.\n * @default \"error\" (\"warn\" in dev mode)\n */\n logLevel: PropTypes.oneOf(['debug', 'error', 'info', 'warn', false]),\n /**\n * Nonce of the inline styles for [Content Security Policy](https://www.w3.org/TR/2016/REC-CSP2-20161215/#script-src-the-nonce-attribute).\n */\n nonce: PropTypes.string,\n /**\n * Callback fired when the row grouping model changes.\n * @param {GridAggregationModel} model The aggregated columns.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onAggregationModelChange: PropTypes.func,\n /**\n * Callback fired when any cell is clicked.\n * @param {GridCellParams} params With all properties from [[GridCellParams]].\n * @param {MuiEvent} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onCellClick: PropTypes.func,\n /**\n * Callback fired when a double click event comes from a cell element.\n * @param {GridCellParams} params With all properties from [[GridCellParams]].\n * @param {MuiEvent} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onCellDoubleClick: PropTypes.func,\n /**\n * Callback fired when the cell turns to edit mode.\n * @param {GridCellParams} params With all properties from [[GridCellParams]].\n * @param {MuiEvent} event The event that caused this prop to be called.\n */\n onCellEditStart: PropTypes.func,\n /**\n * Callback fired when the cell turns to view mode.\n * @param {GridCellParams} params With all properties from [[GridCellParams]].\n * @param {MuiEvent} event The event that caused this prop to be called.\n */\n onCellEditStop: PropTypes.func,\n /**\n * Callback fired when a keydown event comes from a cell element.\n * @param {GridCellParams} params With all properties from [[GridCellParams]].\n * @param {MuiEvent} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onCellKeyDown: PropTypes.func,\n /**\n * Callback fired when the `cellModesModel` prop changes.\n * @param {GridCellModesModel} cellModesModel Object containing which cells are in \"edit\" mode.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onCellModesModelChange: PropTypes.func,\n /**\n * Callback called when the data is copied to the clipboard.\n * @param {string} data The data copied to the clipboard.\n */\n onClipboardCopy: PropTypes.func,\n /**\n * Callback fired when the clipboard paste operation ends.\n */\n onClipboardPasteEnd: PropTypes.func,\n /**\n * Callback fired when the clipboard paste operation starts.\n */\n onClipboardPasteStart: PropTypes.func,\n /**\n * Callback fired when a click event comes from a column header element.\n * @param {GridColumnHeaderParams} params With all properties from [[GridColumnHeaderParams]].\n * @param {MuiEvent} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onColumnHeaderClick: PropTypes.func,\n /**\n * Callback fired when a double click event comes from a column header element.\n * @param {GridColumnHeaderParams} params With all properties from [[GridColumnHeaderParams]].\n * @param {MuiEvent} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onColumnHeaderDoubleClick: PropTypes.func,\n /**\n * Callback fired when a mouse enter event comes from a column header element.\n * @param {GridColumnHeaderParams} params With all properties from [[GridColumnHeaderParams]].\n * @param {MuiEvent} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onColumnHeaderEnter: PropTypes.func,\n /**\n * Callback fired when a mouse leave event comes from a column header element.\n * @param {GridColumnHeaderParams} params With all properties from [[GridColumnHeaderParams]].\n * @param {MuiEvent} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onColumnHeaderLeave: PropTypes.func,\n /**\n * Callback fired when a mouseout event comes from a column header element.\n * @param {GridColumnHeaderParams} params With all properties from [[GridColumnHeaderParams]].\n * @param {MuiEvent} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onColumnHeaderOut: PropTypes.func,\n /**\n * Callback fired when a mouseover event comes from a column header element.\n * @param {GridColumnHeaderParams} params With all properties from [[GridColumnHeaderParams]].\n * @param {MuiEvent} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onColumnHeaderOver: PropTypes.func,\n /**\n * Callback fired when a column is reordered.\n * @param {GridColumnOrderChangeParams} params With all properties from [[GridColumnOrderChangeParams]].\n * @param {MuiEvent<{}>} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onColumnOrderChange: PropTypes.func,\n /**\n * Callback fired while a column is being resized.\n * @param {GridColumnResizeParams} params With all properties from [[GridColumnResizeParams]].\n * @param {MuiEvent} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onColumnResize: PropTypes.func,\n /**\n * Callback fired when the column visibility model changes.\n * @param {GridColumnVisibilityModel} model The new model.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onColumnVisibilityModelChange: PropTypes.func,\n /**\n * Callback fired when the width of a column is changed.\n * @param {GridColumnResizeParams} params With all properties from [[GridColumnResizeParams]].\n * @param {MuiEvent} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onColumnWidthChange: PropTypes.func,\n /**\n * Callback fired when the detail panel of a row is opened or closed.\n * @param {GridRowId[]} ids The ids of the rows which have the detail panel open.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onDetailPanelExpandedRowIdsChange: PropTypes.func,\n /**\n * Callback fired when the state of the Excel export changes.\n * @param {string} inProgress Indicates if the task is in progress.\n */\n onExcelExportStateChange: PropTypes.func,\n /**\n * Callback fired when rowCount is set and the next batch of virtualized rows is rendered.\n * @param {GridFetchRowsParams} params With all properties from [[GridFetchRowsParams]].\n * @param {MuiEvent<{}>} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onFetchRows: PropTypes.func,\n /**\n * Callback fired when the Filter model changes before the filters are applied.\n * @param {GridFilterModel} model With all properties from [[GridFilterModel]].\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onFilterModelChange: PropTypes.func,\n /**\n * Callback fired when the menu is closed.\n * @param {GridMenuParams} params With all properties from [[GridMenuParams]].\n * @param {MuiEvent<{}>} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onMenuClose: PropTypes.func,\n /**\n * Callback fired when the menu is opened.\n * @param {GridMenuParams} params With all properties from [[GridMenuParams]].\n * @param {MuiEvent<{}>} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onMenuOpen: PropTypes.func,\n /**\n * Callback fired when the pagination model has changed.\n * @param {GridPaginationModel} model Updated pagination model.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onPaginationModelChange: PropTypes.func,\n /**\n * Callback fired when the pinned columns have changed.\n * @param {GridPinnedColumns} pinnedColumns The changed pinned columns.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onPinnedColumnsChange: PropTypes.func,\n /**\n * Callback fired when the preferences panel is closed.\n * @param {GridPreferencePanelParams} params With all properties from [[GridPreferencePanelParams]].\n * @param {MuiEvent<{}>} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onPreferencePanelClose: PropTypes.func,\n /**\n * Callback fired when the preferences panel is opened.\n * @param {GridPreferencePanelParams} params With all properties from [[GridPreferencePanelParams]].\n * @param {MuiEvent<{}>} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onPreferencePanelOpen: PropTypes.func,\n /**\n * Callback called when `processRowUpdate` throws an error or rejects.\n * @param {any} error The error thrown.\n */\n onProcessRowUpdateError: PropTypes.func,\n /**\n * Callback fired when the grid is resized.\n * @param {ElementSize} containerSize With all properties from [[ElementSize]].\n * @param {MuiEvent<{}>} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onResize: PropTypes.func,\n /**\n * Callback fired when a row is clicked.\n * Not called if the target clicked is an interactive element added by the built-in columns.\n * @param {GridRowParams} params With all properties from [[GridRowParams]].\n * @param {MuiEvent} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onRowClick: PropTypes.func,\n /**\n * Callback fired when a double click event comes from a row container element.\n * @param {GridRowParams} params With all properties from [[RowParams]].\n * @param {MuiEvent} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onRowDoubleClick: PropTypes.func,\n /**\n * Callback fired when the row changes are committed.\n * @param {GridRowId} id The row id.\n * @param {MuiEvent} event The event that caused this prop to be called.\n */\n onRowEditCommit: PropTypes.func,\n /**\n * Callback fired when the row turns to edit mode.\n * @param {GridRowParams} params With all properties from [[GridRowParams]].\n * @param {MuiEvent} event The event that caused this prop to be called.\n */\n onRowEditStart: PropTypes.func,\n /**\n * Callback fired when the row turns to view mode.\n * @param {GridRowParams} params With all properties from [[GridRowParams]].\n * @param {MuiEvent} event The event that caused this prop to be called.\n */\n onRowEditStop: PropTypes.func,\n /**\n * Callback fired when the row grouping model changes.\n * @param {GridRowGroupingModel} model Columns used as grouping criteria.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onRowGroupingModelChange: PropTypes.func,\n /**\n * Callback fired when the `rowModesModel` prop changes.\n * @param {GridRowModesModel} rowModesModel Object containing which rows are in \"edit\" mode.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onRowModesModelChange: PropTypes.func,\n /**\n * Callback fired when a row is being reordered.\n * @param {GridRowOrderChangeParams} params With all properties from [[GridRowOrderChangeParams]].\n * @param {MuiEvent<{}>} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onRowOrderChange: PropTypes.func,\n /**\n * Callback fired when the selection state of one or multiple rows changes.\n * @param {GridRowSelectionModel} rowSelectionModel With all the row ids [[GridSelectionModel]].\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onRowSelectionModelChange: PropTypes.func,\n /**\n * Callback fired when scrolling to the bottom of the grid viewport.\n * @param {GridRowScrollEndParams} params With all properties from [[GridRowScrollEndParams]].\n * @param {MuiEvent<{}>} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onRowsScrollEnd: PropTypes.func,\n /**\n * Callback fired when the sort model changes before a column is sorted.\n * @param {GridSortModel} model With all properties from [[GridSortModel]].\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onSortModelChange: PropTypes.func,\n /**\n * Callback fired when the state of the grid is updated.\n * @param {GridState} state The new state.\n * @param {MuiEvent<{}>} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n * @ignore - do not document.\n */\n onStateChange: PropTypes.func,\n /**\n * Select the pageSize dynamically using the component UI.\n * @default [25, 50, 100]\n */\n pageSizeOptions: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.shape({\n label: PropTypes.string.isRequired,\n value: PropTypes.number.isRequired\n })]).isRequired),\n /**\n * If `true`, pagination is enabled.\n * @default false\n */\n pagination: PropTypes.bool,\n /**\n * Pagination can be processed on the server or client-side.\n * Set it to 'client' if you would like to handle the pagination on the client-side.\n * Set it to 'server' if you would like to handle the pagination on the server-side.\n * @default \"client\"\n */\n paginationMode: PropTypes.oneOf(['client', 'server']),\n /**\n * The pagination model of type [[GridPaginationModel]] which refers to current `page` and `pageSize`.\n */\n paginationModel: PropTypes.shape({\n page: PropTypes.number.isRequired,\n pageSize: PropTypes.number.isRequired\n }),\n /**\n * The column fields to display pinned to left or right.\n */\n pinnedColumns: PropTypes.shape({\n left: PropTypes.arrayOf(PropTypes.string),\n right: PropTypes.arrayOf(PropTypes.string)\n }),\n /**\n * Rows data to pin on top or bottom.\n */\n pinnedRows: PropTypes.shape({\n bottom: PropTypes.arrayOf(PropTypes.object),\n top: PropTypes.arrayOf(PropTypes.object)\n }),\n /**\n * Callback called before updating a row with new values in the row and cell editing.\n * @template R\n * @param {R} newRow Row object with the new values.\n * @param {R} oldRow Row object with the old values.\n * @returns {Promise | R} The final values to update the row.\n */\n processRowUpdate: PropTypes.func,\n /**\n * Number of extra rows to be rendered before/after the visible slice.\n * @default 3\n */\n rowBuffer: PropTypes.number,\n /**\n * Set the total number of rows, if it is different from the length of the value `rows` prop.\n * If some rows have children (for instance in the tree data), this number represents the amount of top level rows.\n */\n rowCount: PropTypes.number,\n /**\n * If `single`, all the columns that are grouped are represented in the same grid column.\n * If `multiple`, each column that is grouped is represented in its own grid column.\n * @default 'single'\n */\n rowGroupingColumnMode: PropTypes.oneOf(['multiple', 'single']),\n /**\n * Set the row grouping model of the grid.\n */\n rowGroupingModel: PropTypes.arrayOf(PropTypes.string),\n /**\n * Sets the height in pixel of a row in the grid.\n * @default 52\n */\n rowHeight: PropTypes.number,\n /**\n * Controls the modes of the rows.\n */\n rowModesModel: PropTypes.object,\n /**\n * The milliseconds delay to wait after measuring the row height before recalculating row positions.\n * Setting it to a lower value could be useful when using dynamic row height,\n * but might reduce performance when displaying a large number of rows.\n * @default 166\n */\n rowPositionsDebounceMs: PropTypes.number,\n /**\n * If `true`, the reordering of rows is enabled.\n * @default false\n */\n rowReordering: PropTypes.bool,\n /**\n * Set of rows of type [[GridRowsProp]].\n */\n rows: PropTypes.arrayOf(PropTypes.object).isRequired,\n /**\n * If `false`, the row selection mode is disabled.\n * @default true\n */\n rowSelection: PropTypes.bool,\n /**\n * Sets the row selection model of the grid.\n */\n rowSelectionModel: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired), PropTypes.number, PropTypes.string]),\n /**\n * Loading rows can be processed on the server or client-side.\n * Set it to 'client' if you would like enable infnite loading.\n * Set it to 'server' if you would like to enable lazy loading.\n * * @default \"client\"\n */\n rowsLoadingMode: PropTypes.oneOf(['client', 'server']),\n /**\n * Sets the type of space between rows added by `getRowSpacing`.\n * @default \"margin\"\n */\n rowSpacingType: PropTypes.oneOf(['border', 'margin']),\n /**\n * Number of rows from the `rowBuffer` that can be visible before a new slice is rendered.\n * @default 3\n */\n rowThreshold: PropTypes.number,\n /**\n * Override the height/width of the grid inner scrollbar.\n */\n scrollbarSize: PropTypes.number,\n /**\n * Set the area in `px` at the bottom of the grid viewport where onRowsScrollEnd is called.\n * @default 80\n */\n scrollEndThreshold: PropTypes.number,\n /**\n * If `true`, the vertical borders of the cells are displayed.\n * @default false\n */\n showCellVerticalBorder: PropTypes.bool,\n /**\n * If `true`, the right border of the column headers are displayed.\n * @default false\n */\n showColumnVerticalBorder: PropTypes.bool,\n /**\n * Overridable components props dynamically passed to the component at rendering.\n */\n slotProps: PropTypes.object,\n /**\n * Overridable components.\n */\n slots: PropTypes.object,\n /**\n * Sorting can be processed on the server or client-side.\n * Set it to 'client' if you would like to handle sorting on the client-side.\n * Set it to 'server' if you would like to handle sorting on the server-side.\n * @default \"client\"\n */\n sortingMode: PropTypes.oneOf(['client', 'server']),\n /**\n * The order of the sorting sequence.\n * @default ['asc', 'desc', null]\n */\n sortingOrder: PropTypes.arrayOf(PropTypes.oneOf(['asc', 'desc'])),\n /**\n * Set the sort model of the grid.\n */\n sortModel: PropTypes.arrayOf(PropTypes.shape({\n field: PropTypes.string.isRequired,\n sort: PropTypes.oneOf(['asc', 'desc'])\n })),\n /**\n * The system prop that allows defining system overrides as well as additional CSS styles.\n */\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),\n /**\n * If positive, the Grid will throttle updates coming from `apiRef.current.updateRows` and `apiRef.current.setRows`.\n * It can be useful if you have a high update rate but do not want to do heavy work like filtering / sorting or rendering on each individual update.\n * @default 0\n */\n throttleRowsMs: PropTypes.number,\n /**\n * If `true`, the rows will be gathered in a tree structure according to the `getTreeDataPath` prop.\n * @default false\n */\n treeData: PropTypes.bool,\n /**\n * If `true`, the cell selection mode is enabled.\n * @default false\n */\n unstable_cellSelection: PropTypes.bool,\n /**\n * Set the cell selection model of the grid.\n */\n unstable_cellSelectionModel: PropTypes.object,\n /**\n * If `true`, enables the data grid filtering on header feature.\n * @default false\n */\n unstable_headerFilters: PropTypes.bool,\n /**\n * If `true`, the grid will not use `valueFormatter` when exporting to CSV or copying to clipboard.\n * If an object is provided, you can choose to ignore the `valueFormatter` for CSV export or clipboard export.\n * @default false\n */\n unstable_ignoreValueFormatterDuringExport: PropTypes.oneOfType([PropTypes.shape({\n clipboardExport: PropTypes.bool,\n csvExport: PropTypes.bool\n }), PropTypes.bool]),\n /**\n * Callback fired when the selection state of one or multiple cells changes.\n * @param {GridCellSelectionModel} cellSelectionModel Object in the shape of [[GridCellSelectionModel]] containing the selected cells.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n unstable_onCellSelectionModelChange: PropTypes.func,\n /**\n * The function is used to split the pasted text into rows and cells.\n * @param {string} text The text pasted from the clipboard.\n * @returns {string[][] | null} A 2D array of strings. The first dimension is the rows, the second dimension is the columns.\n * @default `(pastedText) => { const text = pastedText.replace(/\\r?\\n$/, ''); return text.split(/\\r\\n|\\n|\\r/).map((row) => row.split('\\t')); }`\n */\n unstable_splitClipboardPastedText: PropTypes.func\n} : void 0;","import { ponyfillGlobal } from '@mui/utils';\nexport const getReleaseInfo = () => {\n const releaseInfo = \"MTcwMDY5MDQwMDAwMA==\";\n if (process.env.NODE_ENV !== 'production') {\n // A simple hack to set the value in the test environment (has no build step).\n // eslint-disable-next-line no-useless-concat\n if (releaseInfo === '__RELEASE' + '_INFO__') {\n // eslint-disable-next-line no-underscore-dangle\n return ponyfillGlobal.__MUI_RELEASE_INFO__;\n }\n }\n return releaseInfo;\n};","import { useGridApiContext as useCommunityGridApiContext } from '@mui/x-data-grid';\nexport const useGridApiContext = useCommunityGridApiContext;","import * as React from 'react';\n/**\n * Hook that instantiate a [[GridApiRef]].\n */\nexport const useGridApiRef = () => React.useRef({});","import { useGridApiRef as useCommunityGridApiRef } from '@mui/x-data-grid';\nexport const useGridApiRef = useCommunityGridApiRef;","import * as React from 'react';\nimport { useTheme } from '@mui/material/styles';\nimport PropTypes from 'prop-types';\nimport MenuItem from '@mui/material/MenuItem';\nimport ListItemIcon from '@mui/material/ListItemIcon';\nimport ListItemText from '@mui/material/ListItemText';\nimport { GridPinnedPosition } from '../hooks/features/columnPinning';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nfunction GridColumnMenuPinningItem(props) {\n const {\n colDef,\n onClick\n } = props;\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const theme = useTheme();\n const pinColumn = React.useCallback(side => event => {\n apiRef.current.pinColumn(colDef.field, side);\n onClick(event);\n }, [apiRef, colDef.field, onClick]);\n const unpinColumn = event => {\n apiRef.current.unpinColumn(colDef.field);\n onClick(event);\n };\n const pinToLeftMenuItem = /*#__PURE__*/_jsxs(MenuItem, {\n onClick: pinColumn(GridPinnedPosition.left),\n children: [/*#__PURE__*/_jsx(ListItemIcon, {\n children: /*#__PURE__*/_jsx(rootProps.slots.columnMenuPinLeftIcon, {\n fontSize: \"small\"\n })\n }), /*#__PURE__*/_jsx(ListItemText, {\n children: apiRef.current.getLocaleText('pinToLeft')\n })]\n });\n const pinToRightMenuItem = /*#__PURE__*/_jsxs(MenuItem, {\n onClick: pinColumn(GridPinnedPosition.right),\n children: [/*#__PURE__*/_jsx(ListItemIcon, {\n children: /*#__PURE__*/_jsx(rootProps.slots.columnMenuPinRightIcon, {\n fontSize: \"small\"\n })\n }), /*#__PURE__*/_jsx(ListItemText, {\n children: apiRef.current.getLocaleText('pinToRight')\n })]\n });\n if (!colDef) {\n return null;\n }\n const side = apiRef.current.isColumnPinned(colDef.field);\n if (side) {\n const otherSide = side === GridPinnedPosition.right ? GridPinnedPosition.left : GridPinnedPosition.right;\n const label = otherSide === GridPinnedPosition.right ? 'pinToRight' : 'pinToLeft';\n const Icon = side === GridPinnedPosition.right ? rootProps.slots.columnMenuPinLeftIcon : rootProps.slots.columnMenuPinRightIcon;\n return /*#__PURE__*/_jsxs(React.Fragment, {\n children: [/*#__PURE__*/_jsxs(MenuItem, {\n onClick: pinColumn(otherSide),\n children: [/*#__PURE__*/_jsx(ListItemIcon, {\n children: /*#__PURE__*/_jsx(Icon, {\n fontSize: \"small\"\n })\n }), /*#__PURE__*/_jsx(ListItemText, {\n children: apiRef.current.getLocaleText(label)\n })]\n }), /*#__PURE__*/_jsxs(MenuItem, {\n onClick: unpinColumn,\n children: [/*#__PURE__*/_jsx(ListItemIcon, {}), /*#__PURE__*/_jsx(ListItemText, {\n children: apiRef.current.getLocaleText('unpin')\n })]\n })]\n });\n }\n if (theme.direction === 'rtl') {\n return /*#__PURE__*/_jsxs(React.Fragment, {\n children: [pinToRightMenuItem, pinToLeftMenuItem]\n });\n }\n return /*#__PURE__*/_jsxs(React.Fragment, {\n children: [pinToLeftMenuItem, pinToRightMenuItem]\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? GridColumnMenuPinningItem.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n colDef: PropTypes.object.isRequired,\n onClick: PropTypes.func.isRequired\n} : void 0;\nexport { GridColumnMenuPinningItem };","var GridPinnedPosition = /*#__PURE__*/function (GridPinnedPosition) {\n GridPinnedPosition[\"left\"] = \"left\";\n GridPinnedPosition[\"right\"] = \"right\";\n return GridPinnedPosition;\n}(GridPinnedPosition || {});\n/**\n * The column pinning API interface that is available in the grid [[apiRef]].\n */\nexport { GridPinnedPosition };","import { createSelectorMemoized } from '@mui/x-data-grid/internals';\nexport const gridDetailPanelExpandedRowIdsSelector = state => state.detailPanel.expandedRowIds;\nexport const gridDetailPanelExpandedRowsContentCacheSelector = state => state.detailPanel.contentCache;\nexport const gridDetailPanelRawHeightCacheSelector = state => state.detailPanel.heightCache;\n\n// TODO v6: Make this selector return the full object, including the autoHeight flag\nexport const gridDetailPanelExpandedRowsHeightCacheSelector = createSelectorMemoized(gridDetailPanelRawHeightCacheSelector, heightCache => Object.entries(heightCache).reduce((acc, [id, {\n height\n}]) => {\n acc[id] = height || 0;\n return acc;\n}, {}));","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { getDataGridUtilityClass, useGridSelector } from '@mui/x-data-grid';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { gridDetailPanelExpandedRowsContentCacheSelector } from '../hooks/features/detailPanel/gridDetailPanelSelector';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n isExpanded\n } = ownerState;\n const slots = {\n root: ['detailPanelToggleCell', isExpanded && 'detailPanelToggleCell--expanded']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nfunction GridDetailPanelToggleCell(props) {\n var _rootProps$slotProps;\n const {\n id,\n value: isExpanded\n } = props;\n const rootProps = useGridRootProps();\n const apiRef = useGridApiContext();\n const ownerState = {\n classes: rootProps.classes,\n isExpanded\n };\n const classes = useUtilityClasses(ownerState);\n const contentCache = useGridSelector(apiRef, gridDetailPanelExpandedRowsContentCacheSelector);\n const hasContent = /*#__PURE__*/React.isValidElement(contentCache[id]);\n const Icon = isExpanded ? rootProps.slots.detailPanelCollapseIcon : rootProps.slots.detailPanelExpandIcon;\n return /*#__PURE__*/_jsx(rootProps.slots.baseIconButton, _extends({\n size: \"small\",\n tabIndex: -1,\n disabled: !hasContent,\n className: classes.root,\n \"aria-label\": isExpanded ? apiRef.current.getLocaleText('collapseDetailPanel') : apiRef.current.getLocaleText('expandDetailPanel')\n }, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseIconButton, {\n children: /*#__PURE__*/_jsx(Icon, {\n fontSize: \"inherit\"\n })\n }));\n}\nprocess.env.NODE_ENV !== \"production\" ? GridDetailPanelToggleCell.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n /**\n * GridApi that let you manipulate the grid.\n */\n api: PropTypes.object.isRequired,\n /**\n * The mode of the cell.\n */\n cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,\n /**\n * The column of the row that the current cell belongs to.\n */\n colDef: PropTypes.object.isRequired,\n /**\n * The column field of the cell that triggered the event.\n */\n field: PropTypes.string.isRequired,\n /**\n * A ref allowing to set imperative focus.\n * It can be passed to the element that should receive focus.\n * @ignore - do not document.\n */\n focusElementRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({\n current: PropTypes.shape({\n focus: PropTypes.func.isRequired\n })\n })]),\n /**\n * The cell value formatted with the column valueFormatter.\n */\n formattedValue: PropTypes.any,\n /**\n * If true, the cell is the active element.\n */\n hasFocus: PropTypes.bool.isRequired,\n /**\n * The grid row id.\n */\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n /**\n * If true, the cell is editable.\n */\n isEditable: PropTypes.bool,\n /**\n * The row model of the row that the current cell belongs to.\n */\n row: PropTypes.any.isRequired,\n /**\n * The node of the row that the current cell belongs to.\n */\n rowNode: PropTypes.object.isRequired,\n /**\n * the tabIndex value.\n */\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\n /**\n * The cell value.\n * If the column has `valueGetter`, use `params.row` to directly access the fields.\n */\n value: PropTypes.any\n} : void 0;\nexport { GridDetailPanelToggleCell };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { GRID_STRING_COL_DEF } from '@mui/x-data-grid';\nimport { GridDetailPanelToggleCell } from '../../../components/GridDetailPanelToggleCell';\nimport { gridDetailPanelExpandedRowIdsSelector } from './gridDetailPanelSelector';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const GRID_DETAIL_PANEL_TOGGLE_FIELD = '__detail_panel_toggle__';\nexport const GRID_DETAIL_PANEL_TOGGLE_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {\n field: GRID_DETAIL_PANEL_TOGGLE_FIELD,\n type: 'detailPanelToggle',\n editable: false,\n sortable: false,\n filterable: false,\n resizable: false,\n // @ts-ignore\n aggregable: false,\n disableColumnMenu: true,\n disableReorder: true,\n disableExport: true,\n align: 'left',\n width: 40,\n valueGetter: params => {\n const expandedRowIds = gridDetailPanelExpandedRowIdsSelector(params.api.state);\n return expandedRowIds.includes(params.id);\n },\n renderCell: params => /*#__PURE__*/_jsx(GridDetailPanelToggleCell, _extends({}, params)),\n renderHeader: () => null\n});","import { useGridApiContext as useCommunityGridApiContext } from '@mui/x-data-grid';\nexport const useGridApiContext = useCommunityGridApiContext;","import { useGridRootProps as useCommunityGridRootProps } from '@mui/x-data-grid';\nexport const useGridRootProps = useCommunityGridRootProps;","export default function composeClasses(slots, getUtilityClass, classes = undefined) {\n const output = {};\n Object.keys(slots).forEach(\n // `Object.keys(slots)` can't be wider than `T` because we infer `T` from `slots`.\n // @ts-expect-error https://github.com/microsoft/TypeScript/pull/12253#issuecomment-263132208\n slot => {\n output[slot] = slots[slot].reduce((acc, key) => {\n if (key) {\n const utilityClass = getUtilityClass(key);\n if (utilityClass !== '') {\n acc.push(utilityClass);\n }\n if (classes && classes[key]) {\n acc.push(classes[key]);\n }\n }\n return acc;\n }, []).join(' ');\n });\n return output;\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useThemeProps } from '@mui/material/styles';\nimport { GRID_DEFAULT_LOCALE_TEXT } from '../constants';\nimport { DATA_GRID_DEFAULT_SLOTS_COMPONENTS } from '../constants/defaultGridSlotsComponents';\nimport { GridEditModes } from '../models';\nimport { computeSlots, useProps, uncapitalizeObjectKeys } from '../internals/utils';\nconst DATA_GRID_FORCED_PROPS = {\n disableMultipleColumnsFiltering: true,\n disableMultipleColumnsSorting: true,\n disableMultipleRowSelection: true,\n throttleRowsMs: undefined,\n hideFooterRowCount: false,\n pagination: true,\n checkboxSelectionVisibleOnly: false,\n disableColumnReorder: true,\n disableColumnResize: true,\n keepColumnPositionIfDraggedOutside: false,\n signature: 'DataGrid'\n};\n\n/**\n * The default values of `DataGridPropsWithDefaultValues` to inject in the props of DataGrid.\n */\nexport const DATA_GRID_PROPS_DEFAULT_VALUES = {\n autoHeight: false,\n autoPageSize: false,\n checkboxSelection: false,\n checkboxSelectionVisibleOnly: false,\n columnBuffer: 3,\n rowBuffer: 3,\n columnThreshold: 3,\n rowThreshold: 3,\n rowSelection: true,\n density: 'standard',\n disableColumnFilter: false,\n disableColumnMenu: false,\n disableColumnSelector: false,\n disableDensitySelector: false,\n disableEval: false,\n disableMultipleColumnsFiltering: false,\n disableMultipleRowSelection: false,\n disableMultipleColumnsSorting: false,\n disableRowSelectionOnClick: false,\n disableVirtualization: false,\n editMode: GridEditModes.Cell,\n filterMode: 'client',\n filterDebounceMs: 150,\n columnHeaderHeight: 56,\n hideFooter: false,\n hideFooterPagination: false,\n hideFooterRowCount: false,\n hideFooterSelectedRowCount: false,\n ignoreDiacritics: false,\n logger: console,\n logLevel: process.env.NODE_ENV === 'production' ? 'error' : 'warn',\n pagination: false,\n paginationMode: 'client',\n rowHeight: 52,\n pageSizeOptions: [25, 50, 100],\n rowSpacingType: 'margin',\n showCellVerticalBorder: false,\n showColumnVerticalBorder: false,\n sortingOrder: ['asc', 'desc', null],\n sortingMode: 'client',\n throttleRowsMs: 0,\n disableColumnReorder: false,\n disableColumnResize: false,\n keepNonExistentRowsSelected: false,\n keepColumnPositionIfDraggedOutside: false,\n unstable_ignoreValueFormatterDuringExport: false,\n clipboardCopyCellDelimiter: '\\t',\n rowPositionsDebounceMs: 166\n};\nconst defaultSlots = uncapitalizeObjectKeys(DATA_GRID_DEFAULT_SLOTS_COMPONENTS);\nexport const useDataGridProps = inProps => {\n const [components, componentsProps, themedProps] = useProps(useThemeProps({\n props: inProps,\n name: 'MuiDataGrid'\n }));\n const localeText = React.useMemo(() => _extends({}, GRID_DEFAULT_LOCALE_TEXT, themedProps.localeText), [themedProps.localeText]);\n const slots = React.useMemo(() => computeSlots({\n defaultSlots,\n slots: themedProps.slots,\n components\n }), [components, themedProps.slots]);\n return React.useMemo(() => {\n var _themedProps$slotProp;\n return _extends({}, DATA_GRID_PROPS_DEFAULT_VALUES, themedProps, {\n localeText,\n slots,\n slotProps: (_themedProps$slotProp = themedProps.slotProps) != null ? _themedProps$slotProp : componentsProps\n }, DATA_GRID_FORCED_PROPS);\n }, [themedProps, localeText, slots, componentsProps]);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"api\", \"colDef\", \"id\", \"hasFocus\", \"isEditable\", \"field\", \"value\", \"formattedValue\", \"row\", \"rowNode\", \"cellMode\", \"tabIndex\", \"position\", \"focusElementRef\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport MenuList from '@mui/material/MenuList';\nimport { useTheme } from '@mui/material/styles';\nimport { unstable_useId as useId } from '@mui/utils';\nimport { gridClasses } from '../../constants/gridClasses';\nimport { GridMenu } from '../menu/GridMenu';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst hasActions = colDef => typeof colDef.getActions === 'function';\nfunction GridActionsCell(props) {\n var _rootProps$slotProps;\n const {\n colDef,\n id,\n hasFocus,\n tabIndex,\n position = 'bottom-end',\n focusElementRef\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const [focusedButtonIndex, setFocusedButtonIndex] = React.useState(-1);\n const [open, setOpen] = React.useState(false);\n const apiRef = useGridApiContext();\n const rootRef = React.useRef(null);\n const buttonRef = React.useRef(null);\n const ignoreCallToFocus = React.useRef(false);\n const touchRippleRefs = React.useRef({});\n const theme = useTheme();\n const menuId = useId();\n const buttonId = useId();\n const rootProps = useGridRootProps();\n if (!hasActions(colDef)) {\n throw new Error('MUI: Missing the `getActions` property in the `GridColDef`.');\n }\n const options = colDef.getActions(apiRef.current.getRowParams(id));\n const iconButtons = options.filter(option => !option.props.showInMenu);\n const menuButtons = options.filter(option => option.props.showInMenu);\n const numberOfButtons = iconButtons.length + (menuButtons.length ? 1 : 0);\n React.useLayoutEffect(() => {\n if (!hasFocus) {\n Object.entries(touchRippleRefs.current).forEach(([index, ref]) => {\n ref == null || ref.stop({}, () => {\n delete touchRippleRefs.current[index];\n });\n });\n }\n }, [hasFocus]);\n React.useEffect(() => {\n if (focusedButtonIndex < 0 || !rootRef.current) {\n return;\n }\n if (focusedButtonIndex >= rootRef.current.children.length) {\n return;\n }\n const child = rootRef.current.children[focusedButtonIndex];\n child.focus({\n preventScroll: true\n });\n }, [focusedButtonIndex]);\n React.useEffect(() => {\n if (!hasFocus) {\n setFocusedButtonIndex(-1);\n ignoreCallToFocus.current = false;\n }\n }, [hasFocus]);\n React.useImperativeHandle(focusElementRef, () => ({\n focus() {\n // If ignoreCallToFocus is true, then one of the buttons was clicked and the focus is already set\n if (!ignoreCallToFocus.current) {\n // find the first focusable button and pass the index to the state\n const focusableButtonIndex = options.findIndex(o => !o.props.disabled);\n setFocusedButtonIndex(focusableButtonIndex);\n }\n }\n }), [options]);\n React.useEffect(() => {\n if (focusedButtonIndex >= numberOfButtons) {\n setFocusedButtonIndex(numberOfButtons - 1);\n }\n }, [focusedButtonIndex, numberOfButtons]);\n const showMenu = () => {\n setOpen(true);\n setFocusedButtonIndex(numberOfButtons - 1);\n ignoreCallToFocus.current = true;\n };\n const hideMenu = () => {\n setOpen(false);\n };\n const handleTouchRippleRef = index => instance => {\n touchRippleRefs.current[index] = instance;\n };\n const handleButtonClick = (index, onClick) => event => {\n setFocusedButtonIndex(index);\n ignoreCallToFocus.current = true;\n if (onClick) {\n onClick(event);\n }\n };\n const handleRootKeyDown = event => {\n if (numberOfButtons <= 1) {\n return;\n }\n const getNewIndex = (index, direction) => {\n var _options;\n if (index < 0 || index > options.length) {\n return index;\n }\n\n // for rtl mode we need to reverse the direction\n const rtlMod = theme.direction === 'rtl' ? -1 : 1;\n const indexMod = (direction === 'left' ? -1 : 1) * rtlMod;\n\n // if the button that should receive focus is disabled go one more step\n return (_options = options[index + indexMod]) != null && _options.props.disabled ? getNewIndex(index + indexMod, direction) : index + indexMod;\n };\n let newIndex = focusedButtonIndex;\n if (event.key === 'ArrowRight') {\n newIndex = getNewIndex(focusedButtonIndex, 'right');\n } else if (event.key === 'ArrowLeft') {\n newIndex = getNewIndex(focusedButtonIndex, 'left');\n }\n if (newIndex < 0 || newIndex >= numberOfButtons) {\n return; // We're already in the first or last item = do nothing and let the grid listen the event\n }\n\n if (newIndex !== focusedButtonIndex) {\n event.preventDefault(); // Prevent scrolling\n event.stopPropagation(); // Don't stop propagation for other keys, e.g. ArrowUp\n setFocusedButtonIndex(newIndex);\n }\n };\n const handleListKeyDown = event => {\n if (event.key === 'Tab') {\n event.preventDefault();\n }\n if (['Tab', 'Enter', 'Escape'].includes(event.key)) {\n hideMenu();\n }\n };\n return /*#__PURE__*/_jsxs(\"div\", _extends({\n role: \"menu\",\n ref: rootRef,\n tabIndex: -1,\n className: gridClasses.actionsCell,\n onKeyDown: handleRootKeyDown\n }, other, {\n children: [iconButtons.map((button, index) => /*#__PURE__*/React.cloneElement(button, {\n key: index,\n touchRippleRef: handleTouchRippleRef(index),\n onClick: handleButtonClick(index, button.props.onClick),\n tabIndex: focusedButtonIndex === index ? tabIndex : -1\n })), menuButtons.length > 0 && buttonId && /*#__PURE__*/_jsx(rootProps.slots.baseIconButton, _extends({\n ref: buttonRef,\n id: buttonId,\n \"aria-label\": apiRef.current.getLocaleText('actionsCellMore'),\n \"aria-haspopup\": \"menu\",\n \"aria-expanded\": open,\n \"aria-controls\": open ? menuId : undefined,\n role: \"menuitem\",\n size: \"small\",\n onClick: showMenu,\n touchRippleRef: handleTouchRippleRef(buttonId),\n tabIndex: focusedButtonIndex === iconButtons.length ? tabIndex : -1\n }, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseIconButton, {\n children: /*#__PURE__*/_jsx(rootProps.slots.moreActionsIcon, {\n fontSize: \"small\"\n })\n })), menuButtons.length > 0 && /*#__PURE__*/_jsx(GridMenu, {\n open: open,\n target: buttonRef.current,\n position: position,\n onClose: hideMenu,\n onClick: hideMenu,\n children: /*#__PURE__*/_jsx(MenuList, {\n id: menuId,\n className: gridClasses.menuList,\n onKeyDown: handleListKeyDown,\n \"aria-labelledby\": buttonId,\n variant: \"menu\",\n autoFocusItem: true,\n children: menuButtons.map((button, index) => /*#__PURE__*/React.cloneElement(button, {\n key: index\n }))\n })\n })]\n }));\n}\nprocess.env.NODE_ENV !== \"production\" ? GridActionsCell.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n api: PropTypes.object,\n /**\n * The mode of the cell.\n */\n cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,\n /**\n * The column of the row that the current cell belongs to.\n */\n colDef: PropTypes.object.isRequired,\n /**\n * The column field of the cell that triggered the event.\n */\n field: PropTypes.string.isRequired,\n /**\n * A ref allowing to set imperative focus.\n * It can be passed to the element that should receive focus.\n * @ignore - do not document.\n */\n focusElementRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({\n current: PropTypes.shape({\n focus: PropTypes.func.isRequired\n })\n })]),\n /**\n * The cell value formatted with the column valueFormatter.\n */\n formattedValue: PropTypes.any,\n /**\n * If true, the cell is the active element.\n */\n hasFocus: PropTypes.bool.isRequired,\n /**\n * The grid row id.\n */\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n /**\n * If true, the cell is editable.\n */\n isEditable: PropTypes.bool,\n position: PropTypes.oneOf(['bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),\n /**\n * The row model of the row that the current cell belongs to.\n */\n row: PropTypes.any.isRequired,\n /**\n * The node of the row that the current cell belongs to.\n */\n rowNode: PropTypes.object.isRequired,\n /**\n * the tabIndex value.\n */\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\n /**\n * The cell value.\n * If the column has `valueGetter`, use `params.row` to directly access the fields.\n */\n value: PropTypes.any\n} : void 0;\nexport { GridActionsCell };\nexport const renderActionsCell = params => /*#__PURE__*/_jsx(GridActionsCell, _extends({}, params));","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { GRID_STRING_COL_DEF } from './gridStringColDef';\nimport { renderActionsCell } from '../components/cell/GridActionsCell';\nexport const GRID_ACTIONS_COLUMN_TYPE = 'actions';\nexport const GRID_ACTIONS_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {\n sortable: false,\n filterable: false,\n // @ts-ignore\n aggregable: false,\n width: 100,\n align: 'center',\n headerAlign: 'center',\n headerName: '',\n disableColumnMenu: true,\n disableExport: true,\n renderCell: renderActionsCell,\n getApplyQuickFilterFn: undefined,\n getApplyQuickFilterFnV7: undefined\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"id\", \"value\", \"formattedValue\", \"api\", \"field\", \"row\", \"rowNode\", \"colDef\", \"cellMode\", \"isEditable\", \"hasFocus\", \"tabIndex\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { isAutoGeneratedRow } from '../../hooks/features/rows/gridRowsUtils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['booleanCell']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nfunction GridBooleanCellRaw(props) {\n const {\n value\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n const Icon = React.useMemo(() => value ? rootProps.slots.booleanCellTrueIcon : rootProps.slots.booleanCellFalseIcon, [rootProps.slots.booleanCellFalseIcon, rootProps.slots.booleanCellTrueIcon, value]);\n return /*#__PURE__*/_jsx(Icon, _extends({\n fontSize: \"small\",\n className: classes.root,\n titleAccess: apiRef.current.getLocaleText(value ? 'booleanCellTrueLabel' : 'booleanCellFalseLabel'),\n \"data-value\": Boolean(value)\n }, other));\n}\nprocess.env.NODE_ENV !== \"production\" ? GridBooleanCellRaw.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n /**\n * GridApi that let you manipulate the grid.\n */\n api: PropTypes.object.isRequired,\n /**\n * The mode of the cell.\n */\n cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,\n /**\n * The column of the row that the current cell belongs to.\n */\n colDef: PropTypes.object.isRequired,\n /**\n * The column field of the cell that triggered the event.\n */\n field: PropTypes.string.isRequired,\n /**\n * A ref allowing to set imperative focus.\n * It can be passed to the element that should receive focus.\n * @ignore - do not document.\n */\n focusElementRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({\n current: PropTypes.shape({\n focus: PropTypes.func.isRequired\n })\n })]),\n /**\n * The cell value formatted with the column valueFormatter.\n */\n formattedValue: PropTypes.any,\n /**\n * If true, the cell is the active element.\n */\n hasFocus: PropTypes.bool.isRequired,\n /**\n * The grid row id.\n */\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n /**\n * If true, the cell is editable.\n */\n isEditable: PropTypes.bool,\n /**\n * The row model of the row that the current cell belongs to.\n */\n row: PropTypes.any.isRequired,\n /**\n * The node of the row that the current cell belongs to.\n */\n rowNode: PropTypes.object.isRequired,\n /**\n * the tabIndex value.\n */\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\n /**\n * The cell value.\n * If the column has `valueGetter`, use `params.row` to directly access the fields.\n */\n value: PropTypes.any\n} : void 0;\nconst GridBooleanCell = /*#__PURE__*/React.memo(GridBooleanCellRaw);\nexport { GridBooleanCell };\nexport const renderBooleanCell = params => {\n if (isAutoGeneratedRow(params.rowNode)) {\n return '';\n }\n return /*#__PURE__*/_jsx(GridBooleanCell, _extends({}, params));\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"id\", \"value\", \"formattedValue\", \"api\", \"field\", \"row\", \"rowNode\", \"colDef\", \"cellMode\", \"isEditable\", \"tabIndex\", \"className\", \"hasFocus\", \"isValidating\", \"isProcessingProps\", \"error\", \"onValueChange\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses, unstable_useId as useId, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['editBooleanCell']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nfunction GridEditBooleanCell(props) {\n var _rootProps$slotProps;\n const {\n id: idProp,\n value,\n field,\n className,\n hasFocus,\n onValueChange\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const apiRef = useGridApiContext();\n const inputRef = React.useRef(null);\n const id = useId();\n const [valueState, setValueState] = React.useState(value);\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n const handleChange = React.useCallback(async event => {\n const newValue = event.target.checked;\n if (onValueChange) {\n await onValueChange(event, newValue);\n }\n setValueState(newValue);\n await apiRef.current.setEditCellValue({\n id: idProp,\n field,\n value: newValue\n }, event);\n }, [apiRef, field, idProp, onValueChange]);\n React.useEffect(() => {\n setValueState(value);\n }, [value]);\n useEnhancedEffect(() => {\n if (hasFocus) {\n inputRef.current.focus();\n }\n }, [hasFocus]);\n return /*#__PURE__*/_jsx(\"label\", _extends({\n htmlFor: id,\n className: clsx(classes.root, className)\n }, other, {\n children: /*#__PURE__*/_jsx(rootProps.slots.baseCheckbox, _extends({\n id: id,\n inputRef: inputRef,\n checked: Boolean(valueState),\n onChange: handleChange,\n size: \"small\"\n }, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseCheckbox))\n }));\n}\nprocess.env.NODE_ENV !== \"production\" ? GridEditBooleanCell.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n /**\n * GridApi that let you manipulate the grid.\n */\n api: PropTypes.object.isRequired,\n /**\n * The mode of the cell.\n */\n cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,\n changeReason: PropTypes.oneOf(['debouncedSetEditCellValue', 'setEditCellValue']),\n /**\n * The column of the row that the current cell belongs to.\n */\n colDef: PropTypes.object.isRequired,\n /**\n * The column field of the cell that triggered the event.\n */\n field: PropTypes.string.isRequired,\n /**\n * The cell value formatted with the column valueFormatter.\n */\n formattedValue: PropTypes.any,\n /**\n * If true, the cell is the active element.\n */\n hasFocus: PropTypes.bool.isRequired,\n /**\n * The grid row id.\n */\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n /**\n * If true, the cell is editable.\n */\n isEditable: PropTypes.bool,\n isProcessingProps: PropTypes.bool,\n isValidating: PropTypes.bool,\n /**\n * Callback called when the value is changed by the user.\n * @param {React.ChangeEvent} event The event source of the callback.\n * @param {boolean} newValue The value that is going to be passed to `apiRef.current.setEditCellValue`.\n * @returns {Promise | void} A promise to be awaited before calling `apiRef.current.setEditCellValue`\n */\n onValueChange: PropTypes.func,\n /**\n * The row model of the row that the current cell belongs to.\n */\n row: PropTypes.any.isRequired,\n /**\n * The node of the row that the current cell belongs to.\n */\n rowNode: PropTypes.object.isRequired,\n /**\n * the tabIndex value.\n */\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\n /**\n * The cell value.\n * If the column has `valueGetter`, use `params.row` to directly access the fields.\n */\n value: PropTypes.any\n} : void 0;\nexport { GridEditBooleanCell };\nexport const renderEditBooleanCell = params => /*#__PURE__*/_jsx(GridEditBooleanCell, _extends({}, params));","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"item\", \"applyValue\", \"apiRef\", \"focusElementRef\", \"isFilterActive\", \"clearButton\", \"tabIndex\", \"label\", \"InputLabelProps\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { refType, unstable_useId as useId } from '@mui/utils';\nimport { styled } from '@mui/material/styles';\nimport { useGridRootProps } from '../../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst BooleanOperatorContainer = styled('div')({\n display: 'flex',\n alignItems: 'center',\n width: '100%',\n [`& button`]: {\n margin: 'auto 0px 5px 5px'\n }\n});\nfunction GridFilterInputBoolean(props) {\n var _rootProps$slotProps, _baseSelectProps$nati, _rootProps$slotProps2, _rootProps$slotProps3;\n const {\n item,\n applyValue,\n apiRef,\n focusElementRef,\n clearButton,\n tabIndex,\n label: labelProp\n } = props,\n others = _objectWithoutPropertiesLoose(props, _excluded);\n const [filterValueState, setFilterValueState] = React.useState(item.value || '');\n const rootProps = useGridRootProps();\n const labelId = useId();\n const selectId = useId();\n const baseSelectProps = ((_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseSelect) || {};\n const isSelectNative = (_baseSelectProps$nati = baseSelectProps.native) != null ? _baseSelectProps$nati : true;\n const baseSelectOptionProps = ((_rootProps$slotProps2 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps2.baseSelectOption) || {};\n const onFilterChange = React.useCallback(event => {\n const value = event.target.value;\n setFilterValueState(value);\n applyValue(_extends({}, item, {\n value\n }));\n }, [applyValue, item]);\n React.useEffect(() => {\n setFilterValueState(item.value || '');\n }, [item.value]);\n const label = labelProp != null ? labelProp : apiRef.current.getLocaleText('filterPanelInputLabel');\n return /*#__PURE__*/_jsxs(BooleanOperatorContainer, {\n children: [/*#__PURE__*/_jsxs(rootProps.slots.baseFormControl, {\n fullWidth: true,\n children: [/*#__PURE__*/_jsx(rootProps.slots.baseInputLabel, _extends({}, (_rootProps$slotProps3 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps3.baseInputLabel, {\n id: labelId,\n shrink: true,\n variant: \"standard\",\n children: label\n })), /*#__PURE__*/_jsxs(rootProps.slots.baseSelect, _extends({\n labelId: labelId,\n id: selectId,\n label: label,\n value: filterValueState,\n onChange: onFilterChange,\n variant: \"standard\",\n native: isSelectNative,\n displayEmpty: true,\n inputProps: {\n ref: focusElementRef,\n tabIndex\n }\n }, others, baseSelectProps, {\n children: [/*#__PURE__*/_jsx(rootProps.slots.baseSelectOption, _extends({}, baseSelectOptionProps, {\n native: isSelectNative,\n value: \"\",\n children: apiRef.current.getLocaleText('filterValueAny')\n })), /*#__PURE__*/_jsx(rootProps.slots.baseSelectOption, _extends({}, baseSelectOptionProps, {\n native: isSelectNative,\n value: \"true\",\n children: apiRef.current.getLocaleText('filterValueTrue')\n })), /*#__PURE__*/_jsx(rootProps.slots.baseSelectOption, _extends({}, baseSelectOptionProps, {\n native: isSelectNative,\n value: \"false\",\n children: apiRef.current.getLocaleText('filterValueFalse')\n }))]\n }))]\n }), clearButton]\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? GridFilterInputBoolean.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n apiRef: PropTypes.shape({\n current: PropTypes.object.isRequired\n }).isRequired,\n applyValue: PropTypes.func.isRequired,\n clearButton: PropTypes.node,\n focusElementRef: refType,\n /**\n * It is `true` if the filter either has a value or an operator with no value\n * required is selected (e.g. `isEmpty`)\n */\n isFilterActive: PropTypes.bool,\n item: PropTypes.shape({\n field: PropTypes.string.isRequired,\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n operator: PropTypes.string.isRequired,\n value: PropTypes.any\n }).isRequired\n} : void 0;\nexport { GridFilterInputBoolean };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { GRID_STRING_COL_DEF } from './gridStringColDef';\nimport { renderBooleanCell } from '../components/cell/GridBooleanCell';\nimport { renderEditBooleanCell } from '../components/cell/GridEditBooleanCell';\nimport { gridNumberComparator } from '../hooks/features/sorting/gridSortingUtils';\nimport { getGridBooleanOperators } from './gridBooleanOperators';\nfunction gridBooleanFormatter({\n value,\n api\n}) {\n return value ? api.getLocaleText('booleanCellTrueLabel') : api.getLocaleText('booleanCellFalseLabel');\n}\nconst stringToBoolean = value => {\n switch (value.toLowerCase().trim()) {\n case 'true':\n case 'yes':\n case '1':\n return true;\n case 'false':\n case 'no':\n case '0':\n case 'null':\n case 'undefined':\n return false;\n default:\n return undefined;\n }\n};\nexport const GRID_BOOLEAN_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {\n type: 'boolean',\n align: 'center',\n headerAlign: 'center',\n renderCell: renderBooleanCell,\n renderEditCell: renderEditBooleanCell,\n sortComparator: gridNumberComparator,\n valueFormatter: gridBooleanFormatter,\n filterOperators: getGridBooleanOperators(),\n getApplyQuickFilterFn: undefined,\n getApplyQuickFilterFnV7: undefined,\n // @ts-ignore\n aggregable: false,\n // @ts-ignore\n pastedValueParser: value => stringToBoolean(value)\n});","import { GridFilterInputBoolean } from '../components/panel/filterPanel/GridFilterInputBoolean';\nimport { convertLegacyOperators } from './utils';\nexport const getGridBooleanOperators = () => convertLegacyOperators([{\n value: 'is',\n getApplyFilterFnV7: filterItem => {\n if (!filterItem.value) {\n return null;\n }\n const valueAsBoolean = filterItem.value === 'true';\n return value => {\n return Boolean(value) === valueAsBoolean;\n };\n },\n InputComponent: GridFilterInputBoolean\n}]);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"field\", \"id\", \"value\", \"formattedValue\", \"row\", \"rowNode\", \"colDef\", \"isEditable\", \"cellMode\", \"hasFocus\", \"tabIndex\", \"api\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_composeClasses as composeClasses, unstable_useForkRef as useForkRef } from '@mui/utils';\nimport { isSpaceKey } from '../../utils/keyboardUtils';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['checkboxInput']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nconst GridCellCheckboxForwardRef = /*#__PURE__*/React.forwardRef(function GridCellCheckboxRenderer(props, ref) {\n var _rootProps$slotProps;\n const {\n field,\n id,\n value: isChecked,\n rowNode,\n hasFocus,\n tabIndex\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n const checkboxElement = React.useRef(null);\n const rippleRef = React.useRef(null);\n const handleRef = useForkRef(checkboxElement, ref);\n const element = apiRef.current.getCellElement(id, field);\n const handleChange = event => {\n const params = {\n value: event.target.checked,\n id\n };\n apiRef.current.publishEvent('rowSelectionCheckboxChange', params, event);\n };\n React.useLayoutEffect(() => {\n if (tabIndex === 0 && element) {\n element.tabIndex = -1;\n }\n }, [element, tabIndex]);\n React.useEffect(() => {\n if (hasFocus) {\n var _checkboxElement$curr;\n const input = (_checkboxElement$curr = checkboxElement.current) == null ? void 0 : _checkboxElement$curr.querySelector('input');\n input == null || input.focus({\n preventScroll: true\n });\n } else if (rippleRef.current) {\n // Only available in @mui/material v5.4.1 or later\n rippleRef.current.stop({});\n }\n }, [hasFocus]);\n const handleKeyDown = React.useCallback(event => {\n if (isSpaceKey(event.key)) {\n // We call event.stopPropagation to avoid selecting the row and also scrolling to bottom\n // TODO: Remove and add a check inside useGridKeyboardNavigation\n event.stopPropagation();\n }\n }, []);\n if (rowNode.type === 'footer' || rowNode.type === 'pinnedRow') {\n return null;\n }\n const isSelectable = apiRef.current.isRowSelectable(id);\n const label = apiRef.current.getLocaleText(isChecked ? 'checkboxSelectionUnselectRow' : 'checkboxSelectionSelectRow');\n return /*#__PURE__*/_jsx(rootProps.slots.baseCheckbox, _extends({\n ref: handleRef,\n tabIndex: tabIndex,\n checked: isChecked,\n onChange: handleChange,\n className: classes.root,\n inputProps: {\n 'aria-label': label\n },\n onKeyDown: handleKeyDown,\n disabled: !isSelectable,\n touchRippleRef: rippleRef\n }, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseCheckbox, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridCellCheckboxForwardRef.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n /**\n * GridApi that let you manipulate the grid.\n */\n api: PropTypes.object.isRequired,\n /**\n * The mode of the cell.\n */\n cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,\n /**\n * The column of the row that the current cell belongs to.\n */\n colDef: PropTypes.object.isRequired,\n /**\n * The column field of the cell that triggered the event.\n */\n field: PropTypes.string.isRequired,\n /**\n * A ref allowing to set imperative focus.\n * It can be passed to the element that should receive focus.\n * @ignore - do not document.\n */\n focusElementRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({\n current: PropTypes.shape({\n focus: PropTypes.func.isRequired\n })\n })]),\n /**\n * The cell value formatted with the column valueFormatter.\n */\n formattedValue: PropTypes.any,\n /**\n * If true, the cell is the active element.\n */\n hasFocus: PropTypes.bool.isRequired,\n /**\n * The grid row id.\n */\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n /**\n * If true, the cell is editable.\n */\n isEditable: PropTypes.bool,\n /**\n * The row model of the row that the current cell belongs to.\n */\n row: PropTypes.any.isRequired,\n /**\n * The node of the row that the current cell belongs to.\n */\n rowNode: PropTypes.object.isRequired,\n /**\n * the tabIndex value.\n */\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\n /**\n * The cell value.\n * If the column has `valueGetter`, use `params.row` to directly access the fields.\n */\n value: PropTypes.any\n} : void 0;\nexport { GridCellCheckboxForwardRef };\nexport const GridCellCheckboxRenderer = GridCellCheckboxForwardRef;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"field\", \"colDef\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { useGridSelector } from '../../hooks/utils/useGridSelector';\nimport { gridTabIndexColumnHeaderSelector } from '../../hooks/features/focus/gridFocusStateSelector';\nimport { gridRowSelectionStateSelector } from '../../hooks/features/rowSelection/gridRowSelectionSelector';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { gridExpandedSortedRowIdsSelector } from '../../hooks/features/filter/gridFilterSelector';\nimport { gridPaginatedVisibleSortedGridRowIdsSelector } from '../../hooks/features/pagination/gridPaginationSelector';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['checkboxInput']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nconst GridHeaderCheckbox = /*#__PURE__*/React.forwardRef(function GridHeaderCheckbox(props, ref) {\n var _rootProps$slotProps;\n const other = _objectWithoutPropertiesLoose(props, _excluded);\n const [, forceUpdate] = React.useState(false);\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n const tabIndexState = useGridSelector(apiRef, gridTabIndexColumnHeaderSelector);\n const selection = useGridSelector(apiRef, gridRowSelectionStateSelector);\n const visibleRowIds = useGridSelector(apiRef, gridExpandedSortedRowIdsSelector);\n const paginatedVisibleRowIds = useGridSelector(apiRef, gridPaginatedVisibleSortedGridRowIdsSelector);\n const filteredSelection = React.useMemo(() => {\n if (typeof rootProps.isRowSelectable !== 'function') {\n return selection;\n }\n return selection.filter(id => {\n // The row might have been deleted\n if (!apiRef.current.getRow(id)) {\n return false;\n }\n return rootProps.isRowSelectable(apiRef.current.getRowParams(id));\n });\n }, [apiRef, rootProps.isRowSelectable, selection]);\n\n // All the rows that could be selected / unselected by toggling this checkbox\n const selectionCandidates = React.useMemo(() => {\n const rowIds = !rootProps.pagination || !rootProps.checkboxSelectionVisibleOnly ? visibleRowIds : paginatedVisibleRowIds;\n\n // Convert to an object to make O(1) checking if a row exists or not\n // TODO create selector that returns visibleRowIds/paginatedVisibleRowIds as an object\n return rowIds.reduce((acc, id) => {\n acc[id] = true;\n return acc;\n }, {});\n }, [rootProps.pagination, rootProps.checkboxSelectionVisibleOnly, paginatedVisibleRowIds, visibleRowIds]);\n\n // Amount of rows selected and that are visible in the current page\n const currentSelectionSize = React.useMemo(() => filteredSelection.filter(id => selectionCandidates[id]).length, [filteredSelection, selectionCandidates]);\n const isIndeterminate = currentSelectionSize > 0 && currentSelectionSize < Object.keys(selectionCandidates).length;\n const isChecked = currentSelectionSize > 0;\n const handleChange = event => {\n const params = {\n value: event.target.checked\n };\n apiRef.current.publishEvent('headerSelectionCheckboxChange', params);\n };\n const tabIndex = tabIndexState !== null && tabIndexState.field === props.field ? 0 : -1;\n React.useLayoutEffect(() => {\n const element = apiRef.current.getColumnHeaderElement(props.field);\n if (tabIndex === 0 && element) {\n element.tabIndex = -1;\n }\n }, [tabIndex, apiRef, props.field]);\n const handleKeyDown = React.useCallback(event => {\n if (event.key === ' ') {\n // imperative toggle the checkbox because Space is disable by some preventDefault\n apiRef.current.publishEvent('headerSelectionCheckboxChange', {\n value: !isChecked\n });\n }\n }, [apiRef, isChecked]);\n const handleSelectionChange = React.useCallback(() => {\n forceUpdate(p => !p);\n }, []);\n React.useEffect(() => {\n return apiRef.current.subscribeEvent('rowSelectionChange', handleSelectionChange);\n }, [apiRef, handleSelectionChange]);\n const label = apiRef.current.getLocaleText(isChecked ? 'checkboxSelectionUnselectAllRows' : 'checkboxSelectionSelectAllRows');\n return /*#__PURE__*/_jsx(rootProps.slots.baseCheckbox, _extends({\n ref: ref,\n indeterminate: isIndeterminate,\n checked: isChecked,\n onChange: handleChange,\n className: classes.root,\n inputProps: {\n 'aria-label': label\n },\n tabIndex: tabIndex,\n onKeyDown: handleKeyDown\n }, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseCheckbox, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridHeaderCheckbox.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n /**\n * The column of the current header component.\n */\n colDef: PropTypes.object.isRequired,\n /**\n * The column field of the column that triggered the event\n */\n field: PropTypes.string.isRequired\n} : void 0;\nexport { GridHeaderCheckbox };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { GridCellCheckboxRenderer } from '../components/columnSelection/GridCellCheckboxRenderer';\nimport { GridHeaderCheckbox } from '../components/columnSelection/GridHeaderCheckbox';\nimport { selectedIdsLookupSelector } from '../hooks/features/rowSelection/gridRowSelectionSelector';\nimport { GRID_BOOLEAN_COL_DEF } from './gridBooleanColDef';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const GRID_CHECKBOX_SELECTION_FIELD = '__check__';\nexport const GRID_CHECKBOX_SELECTION_COL_DEF = _extends({}, GRID_BOOLEAN_COL_DEF, {\n field: GRID_CHECKBOX_SELECTION_FIELD,\n type: 'checkboxSelection',\n width: 50,\n resizable: false,\n sortable: false,\n filterable: false,\n // @ts-ignore\n aggregable: false,\n disableColumnMenu: true,\n disableReorder: true,\n disableExport: true,\n getApplyQuickFilterFn: undefined,\n getApplyQuickFilterFnV7: undefined,\n valueGetter: params => {\n const selectionLookup = selectedIdsLookupSelector(params.api.state, params.api.instanceId);\n return selectionLookup[params.id] !== undefined;\n },\n renderHeader: params => /*#__PURE__*/_jsx(GridHeaderCheckbox, _extends({}, params)),\n renderCell: params => /*#__PURE__*/_jsx(GridCellCheckboxRenderer, _extends({}, params))\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"id\", \"value\", \"formattedValue\", \"api\", \"field\", \"row\", \"rowNode\", \"colDef\", \"cellMode\", \"isEditable\", \"tabIndex\", \"hasFocus\", \"inputProps\", \"isValidating\", \"isProcessingProps\", \"onValueChange\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_composeClasses as composeClasses, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';\nimport InputBase from '@mui/material/InputBase';\nimport { styled } from '@mui/material/styles';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst StyledInputBase = styled(InputBase)({\n fontSize: 'inherit'\n});\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['editInputCell']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nfunction GridEditDateCell(props) {\n const {\n id,\n value: valueProp,\n field,\n colDef,\n hasFocus,\n inputProps,\n onValueChange\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const isDateTime = colDef.type === 'dateTime';\n const apiRef = useGridApiContext();\n const inputRef = React.useRef();\n const valueTransformed = React.useMemo(() => {\n let parsedDate;\n if (valueProp == null) {\n parsedDate = null;\n } else if (valueProp instanceof Date) {\n parsedDate = valueProp;\n } else {\n parsedDate = new Date((valueProp != null ? valueProp : '').toString());\n }\n let formattedDate;\n if (parsedDate == null || Number.isNaN(parsedDate.getTime())) {\n formattedDate = '';\n } else {\n const localDate = new Date(parsedDate.getTime() - parsedDate.getTimezoneOffset() * 60 * 1000);\n formattedDate = localDate.toISOString().substr(0, isDateTime ? 16 : 10);\n }\n return {\n parsed: parsedDate,\n formatted: formattedDate\n };\n }, [valueProp, isDateTime]);\n const [valueState, setValueState] = React.useState(valueTransformed);\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n const hasUpdatedEditValueOnMount = React.useRef(false);\n const parseValueToDate = React.useCallback(value => {\n if (value === '') {\n return null;\n }\n const [date, time] = value.split('T');\n const [year, month, day] = date.split('-');\n const parsedDate = new Date();\n parsedDate.setFullYear(Number(year), Number(month) - 1, Number(day));\n parsedDate.setHours(0, 0, 0, 0);\n if (time) {\n const [hours, minutes] = time.split(':');\n parsedDate.setHours(Number(hours), Number(minutes), 0, 0);\n }\n return parsedDate;\n }, []);\n const handleChange = React.useCallback(async event => {\n const newFormattedDate = event.target.value;\n const newParsedDate = parseValueToDate(newFormattedDate);\n if (onValueChange) {\n await onValueChange(event, newParsedDate);\n }\n setValueState({\n parsed: newParsedDate,\n formatted: newFormattedDate\n });\n apiRef.current.setEditCellValue({\n id,\n field,\n value: newParsedDate\n }, event);\n }, [apiRef, field, id, onValueChange, parseValueToDate]);\n React.useEffect(() => {\n setValueState(state => {\n var _valueTransformed$par, _state$parsed;\n if (valueTransformed.parsed !== state.parsed && ((_valueTransformed$par = valueTransformed.parsed) == null ? void 0 : _valueTransformed$par.getTime()) !== ((_state$parsed = state.parsed) == null ? void 0 : _state$parsed.getTime())) {\n return valueTransformed;\n }\n return state;\n });\n }, [valueTransformed]);\n useEnhancedEffect(() => {\n if (hasFocus) {\n inputRef.current.focus();\n }\n }, [hasFocus]);\n const meta = apiRef.current.unstable_getEditCellMeta(id, field);\n const handleInputRef = el => {\n inputRef.current = el;\n if (meta != null && meta.unstable_updateValueOnRender && !hasUpdatedEditValueOnMount.current) {\n const inputValue = inputRef.current.value;\n const parsedDate = parseValueToDate(inputValue);\n setValueState({\n parsed: parsedDate,\n formatted: inputValue\n });\n apiRef.current.setEditCellValue({\n id,\n field,\n value: parsedDate\n });\n hasUpdatedEditValueOnMount.current = true;\n }\n };\n return /*#__PURE__*/_jsx(StyledInputBase, _extends({\n inputRef: handleInputRef,\n fullWidth: true,\n className: classes.root,\n type: isDateTime ? 'datetime-local' : 'date',\n inputProps: _extends({\n max: isDateTime ? '9999-12-31T23:59' : '9999-12-31'\n }, inputProps),\n value: valueState.formatted,\n onChange: handleChange\n }, other));\n}\nprocess.env.NODE_ENV !== \"production\" ? GridEditDateCell.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n /**\n * GridApi that let you manipulate the grid.\n */\n api: PropTypes.object.isRequired,\n /**\n * The mode of the cell.\n */\n cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,\n changeReason: PropTypes.oneOf(['debouncedSetEditCellValue', 'setEditCellValue']),\n /**\n * The column of the row that the current cell belongs to.\n */\n colDef: PropTypes.object.isRequired,\n /**\n * The column field of the cell that triggered the event.\n */\n field: PropTypes.string.isRequired,\n /**\n * The cell value formatted with the column valueFormatter.\n */\n formattedValue: PropTypes.any,\n /**\n * If true, the cell is the active element.\n */\n hasFocus: PropTypes.bool.isRequired,\n /**\n * The grid row id.\n */\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n /**\n * If true, the cell is editable.\n */\n isEditable: PropTypes.bool,\n isProcessingProps: PropTypes.bool,\n isValidating: PropTypes.bool,\n /**\n * Callback called when the value is changed by the user.\n * @param {React.ChangeEvent} event The event source of the callback.\n * @param {Date | null} newValue The value that is going to be passed to `apiRef.current.setEditCellValue`.\n * @returns {Promise | void} A promise to be awaited before calling `apiRef.current.setEditCellValue`\n */\n onValueChange: PropTypes.func,\n /**\n * The row model of the row that the current cell belongs to.\n */\n row: PropTypes.any.isRequired,\n /**\n * The node of the row that the current cell belongs to.\n */\n rowNode: PropTypes.object.isRequired,\n /**\n * the tabIndex value.\n */\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\n /**\n * The cell value.\n * If the column has `valueGetter`, use `params.row` to directly access the fields.\n */\n value: PropTypes.any\n} : void 0;\nexport { GridEditDateCell };\nexport const renderEditDateCell = params => /*#__PURE__*/_jsx(GridEditDateCell, _extends({}, params));","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { gridDateComparator } from '../hooks/features/sorting/gridSortingUtils';\nimport { getGridDateOperators } from './gridDateOperators';\nimport { GRID_STRING_COL_DEF } from './gridStringColDef';\nimport { renderEditDateCell } from '../components/cell/GridEditDateCell';\nfunction throwIfNotDateObject({\n value,\n columnType,\n rowId,\n field\n}) {\n if (!(value instanceof Date)) {\n throw new Error([`MUI: \\`${columnType}\\` column type only accepts \\`Date\\` objects as values.`, 'Use `valueGetter` to transform the value into a `Date` object.', `Row ID: ${rowId}, field: \"${field}\".`].join('\\n'));\n }\n}\nexport function gridDateFormatter({\n value,\n field,\n id\n}) {\n if (!value) {\n return '';\n }\n throwIfNotDateObject({\n value,\n columnType: 'date',\n rowId: id,\n field\n });\n return value.toLocaleDateString();\n}\nexport function gridDateTimeFormatter({\n value,\n field,\n id\n}) {\n if (!value) {\n return '';\n }\n throwIfNotDateObject({\n value,\n columnType: 'dateTime',\n rowId: id,\n field\n });\n return value.toLocaleString();\n}\nexport const GRID_DATE_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {\n type: 'date',\n sortComparator: gridDateComparator,\n valueFormatter: gridDateFormatter,\n filterOperators: getGridDateOperators(),\n renderEditCell: renderEditDateCell,\n // @ts-ignore\n pastedValueParser: value => new Date(value)\n});\nexport const GRID_DATETIME_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {\n type: 'dateTime',\n sortComparator: gridDateComparator,\n valueFormatter: gridDateTimeFormatter,\n filterOperators: getGridDateOperators(true),\n renderEditCell: renderEditDateCell,\n // @ts-ignore\n pastedValueParser: value => new Date(value)\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"item\", \"applyValue\", \"type\", \"apiRef\", \"focusElementRef\", \"InputProps\", \"isFilterActive\", \"clearButton\", \"tabIndex\", \"disabled\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_useId as useId } from '@mui/utils';\nimport { useTimeout } from '../../../hooks/utils/useTimeout';\nimport { useGridRootProps } from '../../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction GridFilterInputDate(props) {\n var _item$value, _rootProps$slotProps;\n const {\n item,\n applyValue,\n type,\n apiRef,\n focusElementRef,\n InputProps,\n clearButton,\n tabIndex,\n disabled\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const filterTimeout = useTimeout();\n const [filterValueState, setFilterValueState] = React.useState((_item$value = item.value) != null ? _item$value : '');\n const [applying, setIsApplying] = React.useState(false);\n const id = useId();\n const rootProps = useGridRootProps();\n const onFilterChange = React.useCallback(event => {\n const value = event.target.value;\n setFilterValueState(String(value));\n setIsApplying(true);\n filterTimeout.start(rootProps.filterDebounceMs, () => {\n applyValue(_extends({}, item, {\n value\n }));\n setIsApplying(false);\n });\n }, [applyValue, item, rootProps.filterDebounceMs, filterTimeout]);\n React.useEffect(() => {\n var _item$value2;\n const itemValue = (_item$value2 = item.value) != null ? _item$value2 : '';\n setFilterValueState(String(itemValue));\n }, [item.value]);\n return /*#__PURE__*/_jsx(rootProps.slots.baseTextField, _extends({\n fullWidth: true,\n id: id,\n label: apiRef.current.getLocaleText('filterPanelInputLabel'),\n placeholder: apiRef.current.getLocaleText('filterPanelInputPlaceholder'),\n value: filterValueState,\n onChange: onFilterChange,\n variant: \"standard\",\n type: type || 'text',\n InputLabelProps: {\n shrink: true\n },\n inputRef: focusElementRef,\n InputProps: _extends({}, applying || clearButton ? {\n endAdornment: applying ? /*#__PURE__*/_jsx(rootProps.slots.loadIcon, {\n fontSize: \"small\",\n color: \"action\"\n }) : clearButton\n } : {}, {\n disabled\n }, InputProps, {\n inputProps: _extends({\n max: type === 'datetime-local' ? '9999-12-31T23:59' : '9999-12-31',\n tabIndex\n }, InputProps == null ? void 0 : InputProps.inputProps)\n })\n }, other, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseTextField));\n}\nprocess.env.NODE_ENV !== \"production\" ? GridFilterInputDate.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n apiRef: PropTypes.shape({\n current: PropTypes.object.isRequired\n }).isRequired,\n applyValue: PropTypes.func.isRequired,\n clearButton: PropTypes.node,\n focusElementRef: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.func, PropTypes.object]),\n /**\n * It is `true` if the filter either has a value or an operator with no value\n * required is selected (e.g. `isEmpty`)\n */\n isFilterActive: PropTypes.bool,\n item: PropTypes.shape({\n field: PropTypes.string.isRequired,\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n operator: PropTypes.string.isRequired,\n value: PropTypes.any\n }).isRequired\n} : void 0;\nexport { GridFilterInputDate };","import { GridFilterInputDate } from '../components/panel/filterPanel/GridFilterInputDate';\nimport { convertLegacyOperators } from './utils';\nconst dateRegex = /(\\d+)-(\\d+)-(\\d+)/;\nconst dateTimeRegex = /(\\d+)-(\\d+)-(\\d+)T(\\d+):(\\d+)/;\nfunction buildApplyFilterFn(filterItem, compareFn, showTime, keepHours) {\n if (!filterItem.value) {\n return null;\n }\n const [year, month, day, hour, minute] = filterItem.value.match(showTime ? dateTimeRegex : dateRegex).slice(1).map(Number);\n const time = new Date(year, month - 1, day, hour || 0, minute || 0).getTime();\n return value => {\n if (!value) {\n return false;\n }\n if (keepHours) {\n return compareFn(value.getTime(), time);\n }\n\n // Make a copy of the date to not reset the hours in the original object\n const dateCopy = new Date(value);\n const timeToCompare = dateCopy.setHours(showTime ? value.getHours() : 0, showTime ? value.getMinutes() : 0, 0, 0);\n return compareFn(timeToCompare, time);\n };\n}\nexport const getGridDateOperators = showTime => convertLegacyOperators([{\n value: 'is',\n getApplyFilterFnV7: filterItem => {\n return buildApplyFilterFn(filterItem, (value1, value2) => value1 === value2, showTime);\n },\n InputComponent: GridFilterInputDate,\n InputComponentProps: {\n type: showTime ? 'datetime-local' : 'date'\n }\n}, {\n value: 'not',\n getApplyFilterFnV7: filterItem => {\n return buildApplyFilterFn(filterItem, (value1, value2) => value1 !== value2, showTime);\n },\n InputComponent: GridFilterInputDate,\n InputComponentProps: {\n type: showTime ? 'datetime-local' : 'date'\n }\n}, {\n value: 'after',\n getApplyFilterFnV7: filterItem => {\n return buildApplyFilterFn(filterItem, (value1, value2) => value1 > value2, showTime);\n },\n InputComponent: GridFilterInputDate,\n InputComponentProps: {\n type: showTime ? 'datetime-local' : 'date'\n }\n}, {\n value: 'onOrAfter',\n getApplyFilterFnV7: filterItem => {\n return buildApplyFilterFn(filterItem, (value1, value2) => value1 >= value2, showTime);\n },\n InputComponent: GridFilterInputDate,\n InputComponentProps: {\n type: showTime ? 'datetime-local' : 'date'\n }\n}, {\n value: 'before',\n getApplyFilterFnV7: filterItem => {\n return buildApplyFilterFn(filterItem, (value1, value2) => value1 < value2, showTime, !showTime);\n },\n InputComponent: GridFilterInputDate,\n InputComponentProps: {\n type: showTime ? 'datetime-local' : 'date'\n }\n}, {\n value: 'onOrBefore',\n getApplyFilterFnV7: filterItem => {\n return buildApplyFilterFn(filterItem, (value1, value2) => value1 <= value2, showTime);\n },\n InputComponent: GridFilterInputDate,\n InputComponentProps: {\n type: showTime ? 'datetime-local' : 'date'\n }\n}, {\n value: 'isEmpty',\n getApplyFilterFnV7: () => {\n return value => {\n return value == null;\n };\n },\n requiresFilterValue: false\n}, {\n value: 'isNotEmpty',\n getApplyFilterFnV7: () => {\n return value => {\n return value != null;\n };\n },\n requiresFilterValue: false\n}]);","import { GridFilterInputValue } from '../components/panel/filterPanel/GridFilterInputValue';\nimport { GridFilterInputMultipleValue } from '../components/panel/filterPanel/GridFilterInputMultipleValue';\nimport { convertLegacyOperators, tagInternalFilter } from './utils';\nconst parseNumericValue = value => {\n if (value == null) {\n return null;\n }\n return Number(value);\n};\nexport const getGridNumericQuickFilterFn = tagInternalFilter(value => {\n if (value == null || Number.isNaN(value) || value === '') {\n return null;\n }\n return columnValue => {\n return parseNumericValue(columnValue) === parseNumericValue(value);\n };\n});\nexport const getGridNumericOperators = () => convertLegacyOperators([{\n value: '=',\n getApplyFilterFnV7: filterItem => {\n if (filterItem.value == null || Number.isNaN(filterItem.value)) {\n return null;\n }\n return value => {\n return parseNumericValue(value) === filterItem.value;\n };\n },\n InputComponent: GridFilterInputValue,\n InputComponentProps: {\n type: 'number'\n }\n}, {\n value: '!=',\n getApplyFilterFnV7: filterItem => {\n if (filterItem.value == null || Number.isNaN(filterItem.value)) {\n return null;\n }\n return value => {\n return parseNumericValue(value) !== filterItem.value;\n };\n },\n InputComponent: GridFilterInputValue,\n InputComponentProps: {\n type: 'number'\n }\n}, {\n value: '>',\n getApplyFilterFnV7: filterItem => {\n if (filterItem.value == null || Number.isNaN(filterItem.value)) {\n return null;\n }\n return value => {\n if (value == null) {\n return false;\n }\n return parseNumericValue(value) > filterItem.value;\n };\n },\n InputComponent: GridFilterInputValue,\n InputComponentProps: {\n type: 'number'\n }\n}, {\n value: '>=',\n getApplyFilterFnV7: filterItem => {\n if (filterItem.value == null || Number.isNaN(filterItem.value)) {\n return null;\n }\n return value => {\n if (value == null) {\n return false;\n }\n return parseNumericValue(value) >= filterItem.value;\n };\n },\n InputComponent: GridFilterInputValue,\n InputComponentProps: {\n type: 'number'\n }\n}, {\n value: '<',\n getApplyFilterFnV7: filterItem => {\n if (filterItem.value == null || Number.isNaN(filterItem.value)) {\n return null;\n }\n return value => {\n if (value == null) {\n return false;\n }\n return parseNumericValue(value) < filterItem.value;\n };\n },\n InputComponent: GridFilterInputValue,\n InputComponentProps: {\n type: 'number'\n }\n}, {\n value: '<=',\n getApplyFilterFnV7: filterItem => {\n if (filterItem.value == null || Number.isNaN(filterItem.value)) {\n return null;\n }\n return value => {\n if (value == null) {\n return false;\n }\n return parseNumericValue(value) <= filterItem.value;\n };\n },\n InputComponent: GridFilterInputValue,\n InputComponentProps: {\n type: 'number'\n }\n}, {\n value: 'isEmpty',\n getApplyFilterFnV7: () => {\n return value => {\n return value == null;\n };\n },\n requiresFilterValue: false\n}, {\n value: 'isNotEmpty',\n getApplyFilterFnV7: () => {\n return value => {\n return value != null;\n };\n },\n requiresFilterValue: false\n}, {\n value: 'isAnyOf',\n getApplyFilterFnV7: filterItem => {\n if (!Array.isArray(filterItem.value) || filterItem.value.length === 0) {\n return null;\n }\n return value => {\n return value != null && filterItem.value.includes(Number(value));\n };\n },\n InputComponent: GridFilterInputMultipleValue,\n InputComponentProps: {\n type: 'number'\n }\n}]);","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { gridNumberComparator } from '../hooks/features/sorting/gridSortingUtils';\nimport { isNumber } from '../utils/utils';\nimport { getGridNumericOperators, getGridNumericQuickFilterFn } from './gridNumericOperators';\nimport { GRID_STRING_COL_DEF } from './gridStringColDef';\nimport { convertQuickFilterV7ToLegacy } from './utils';\nexport const GRID_NUMERIC_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {\n type: 'number',\n align: 'right',\n headerAlign: 'right',\n sortComparator: gridNumberComparator,\n valueParser: value => value === '' ? null : Number(value),\n valueFormatter: ({\n value\n }) => isNumber(value) ? value.toLocaleString() : value || '',\n filterOperators: getGridNumericOperators(),\n getApplyQuickFilterFn: convertQuickFilterV7ToLegacy(getGridNumericQuickFilterFn),\n getApplyQuickFilterFnV7: getGridNumericQuickFilterFn\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"id\", \"value\", \"formattedValue\", \"api\", \"field\", \"row\", \"rowNode\", \"colDef\", \"cellMode\", \"isEditable\", \"tabIndex\", \"className\", \"hasFocus\", \"isValidating\", \"isProcessingProps\", \"error\", \"onValueChange\", \"initialOpen\", \"getOptionLabel\", \"getOptionValue\"],\n _excluded2 = [\"MenuProps\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';\nimport { GridCellEditStopReasons } from '../../models/params/gridEditCellParams';\nimport { isEscapeKey } from '../../utils/keyboardUtils';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { GridEditModes } from '../../models/gridEditRowModel';\nimport { getValueFromValueOptions, isSingleSelectColDef } from '../panel/filterPanel/filterPanelUtils';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { createElement as _createElement } from \"react\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction isKeyboardEvent(event) {\n return !!event.key;\n}\nfunction GridEditSingleSelectCell(props) {\n var _rootProps$slotProps, _baseSelectProps$nati, _rootProps$slotProps2;\n const rootProps = useGridRootProps();\n const {\n id,\n value: valueProp,\n field,\n row,\n colDef,\n hasFocus,\n error,\n onValueChange,\n initialOpen = rootProps.editMode === GridEditModes.Cell,\n getOptionLabel: getOptionLabelProp,\n getOptionValue: getOptionValueProp\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const apiRef = useGridApiContext();\n const ref = React.useRef();\n const inputRef = React.useRef();\n const [open, setOpen] = React.useState(initialOpen);\n const baseSelectProps = ((_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseSelect) || {};\n const isSelectNative = (_baseSelectProps$nati = baseSelectProps.native) != null ? _baseSelectProps$nati : false;\n const _ref = ((_rootProps$slotProps2 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps2.baseSelect) || {},\n {\n MenuProps\n } = _ref,\n otherBaseSelectProps = _objectWithoutPropertiesLoose(_ref, _excluded2);\n useEnhancedEffect(() => {\n if (hasFocus) {\n var _inputRef$current;\n (_inputRef$current = inputRef.current) == null || _inputRef$current.focus();\n }\n }, [hasFocus]);\n if (!isSingleSelectColDef(colDef)) {\n return null;\n }\n let valueOptions;\n if (typeof (colDef == null ? void 0 : colDef.valueOptions) === 'function') {\n valueOptions = colDef == null ? void 0 : colDef.valueOptions({\n id,\n row,\n field\n });\n } else {\n valueOptions = colDef == null ? void 0 : colDef.valueOptions;\n }\n if (!valueOptions) {\n return null;\n }\n const getOptionValue = getOptionValueProp || colDef.getOptionValue;\n const getOptionLabel = getOptionLabelProp || colDef.getOptionLabel;\n const handleChange = async event => {\n if (!isSingleSelectColDef(colDef) || !valueOptions) {\n return;\n }\n setOpen(false);\n const target = event.target;\n // NativeSelect casts the value to a string.\n const formattedTargetValue = getValueFromValueOptions(target.value, valueOptions, getOptionValue);\n if (onValueChange) {\n await onValueChange(event, formattedTargetValue);\n }\n await apiRef.current.setEditCellValue({\n id,\n field,\n value: formattedTargetValue\n }, event);\n };\n const handleClose = (event, reason) => {\n if (rootProps.editMode === GridEditModes.Row) {\n setOpen(false);\n return;\n }\n if (reason === 'backdropClick' || isEscapeKey(event.key)) {\n const params = apiRef.current.getCellParams(id, field);\n apiRef.current.publishEvent('cellEditStop', _extends({}, params, {\n reason: isEscapeKey(event.key) ? GridCellEditStopReasons.escapeKeyDown : GridCellEditStopReasons.cellFocusOut\n }));\n }\n };\n const handleOpen = event => {\n if (isKeyboardEvent(event) && event.key === 'Enter') {\n return;\n }\n setOpen(true);\n };\n if (!valueOptions || !colDef) {\n return null;\n }\n return /*#__PURE__*/_jsx(rootProps.slots.baseSelect, _extends({\n ref: ref,\n inputRef: inputRef,\n value: valueProp,\n onChange: handleChange,\n open: open,\n onOpen: handleOpen,\n MenuProps: _extends({\n onClose: handleClose\n }, MenuProps),\n error: error,\n native: isSelectNative,\n fullWidth: true\n }, other, otherBaseSelectProps, {\n children: valueOptions.map(valueOption => {\n var _rootProps$slotProps3;\n const value = getOptionValue(valueOption);\n return /*#__PURE__*/_createElement(rootProps.slots.baseSelectOption, _extends({}, ((_rootProps$slotProps3 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps3.baseSelectOption) || {}, {\n native: isSelectNative,\n key: value,\n value: value\n }), getOptionLabel(valueOption));\n })\n }));\n}\nprocess.env.NODE_ENV !== \"production\" ? GridEditSingleSelectCell.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n /**\n * GridApi that let you manipulate the grid.\n */\n api: PropTypes.object.isRequired,\n /**\n * The mode of the cell.\n */\n cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,\n changeReason: PropTypes.oneOf(['debouncedSetEditCellValue', 'setEditCellValue']),\n /**\n * The column of the row that the current cell belongs to.\n */\n colDef: PropTypes.object.isRequired,\n /**\n * The column field of the cell that triggered the event.\n */\n field: PropTypes.string.isRequired,\n /**\n * The cell value formatted with the column valueFormatter.\n */\n formattedValue: PropTypes.any,\n /**\n * Used to determine the label displayed for a given value option.\n * @param {ValueOptions} value The current value option.\n * @returns {string} The text to be displayed.\n */\n getOptionLabel: PropTypes.func,\n /**\n * Used to determine the value used for a value option.\n * @param {ValueOptions} value The current value option.\n * @returns {string} The value to be used.\n */\n getOptionValue: PropTypes.func,\n /**\n * If true, the cell is the active element.\n */\n hasFocus: PropTypes.bool.isRequired,\n /**\n * The grid row id.\n */\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n /**\n * If true, the select opens by default.\n */\n initialOpen: PropTypes.bool,\n /**\n * If true, the cell is editable.\n */\n isEditable: PropTypes.bool,\n isProcessingProps: PropTypes.bool,\n isValidating: PropTypes.bool,\n /**\n * Callback called when the value is changed by the user.\n * @param {SelectChangeEvent} event The event source of the callback.\n * @param {any} newValue The value that is going to be passed to `apiRef.current.setEditCellValue`.\n * @returns {Promise | void} A promise to be awaited before calling `apiRef.current.setEditCellValue`\n */\n onValueChange: PropTypes.func,\n /**\n * The row model of the row that the current cell belongs to.\n */\n row: PropTypes.any.isRequired,\n /**\n * The node of the row that the current cell belongs to.\n */\n rowNode: PropTypes.object.isRequired,\n /**\n * the tabIndex value.\n */\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\n /**\n * The cell value.\n * If the column has `valueGetter`, use `params.row` to directly access the fields.\n */\n value: PropTypes.any\n} : void 0;\nexport { GridEditSingleSelectCell };\nexport const renderEditSingleSelectCell = params => /*#__PURE__*/_jsx(GridEditSingleSelectCell, _extends({}, params));","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { GRID_STRING_COL_DEF } from './gridStringColDef';\nimport { renderEditSingleSelectCell } from '../components/cell/GridEditSingleSelectCell';\nimport { getGridSingleSelectOperators } from './gridSingleSelectOperators';\nimport { isSingleSelectColDef } from '../components/panel/filterPanel/filterPanelUtils';\nimport { isObject } from '../utils/utils';\nconst isArrayOfObjects = options => {\n return typeof options[0] === 'object';\n};\nconst defaultGetOptionValue = value => {\n return isObject(value) ? value.value : value;\n};\nconst defaultGetOptionLabel = value => {\n return isObject(value) ? value.label : String(value);\n};\nexport const GRID_SINGLE_SELECT_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {\n type: 'singleSelect',\n getOptionLabel: defaultGetOptionLabel,\n getOptionValue: defaultGetOptionValue,\n valueFormatter(params) {\n const {\n id,\n field,\n value,\n api\n } = params;\n const colDef = params.api.getColumn(field);\n if (!isSingleSelectColDef(colDef)) {\n return '';\n }\n let valueOptions;\n if (typeof colDef.valueOptions === 'function') {\n valueOptions = colDef.valueOptions({\n id,\n row: id ? api.getRow(id) : null,\n field\n });\n } else {\n valueOptions = colDef.valueOptions;\n }\n if (value == null) {\n return '';\n }\n if (!valueOptions) {\n return value;\n }\n if (!isArrayOfObjects(valueOptions)) {\n return colDef.getOptionLabel(value);\n }\n const valueOption = valueOptions.find(option => colDef.getOptionValue(option) === value);\n return valueOption ? colDef.getOptionLabel(valueOption) : '';\n },\n renderEditCell: renderEditSingleSelectCell,\n filterOperators: getGridSingleSelectOperators(),\n // @ts-ignore\n pastedValueParser: (value, params) => {\n const colDef = params.colDef;\n const colDefValueOptions = colDef.valueOptions;\n const valueOptions = typeof colDefValueOptions === 'function' ? colDefValueOptions({\n field: colDef.field\n }) : colDefValueOptions || [];\n const getOptionValue = colDef.getOptionValue;\n const valueOption = valueOptions.find(option => {\n if (getOptionValue(option) === value) {\n return true;\n }\n return false;\n });\n if (valueOption) {\n return value;\n }\n // do not paste the value if it is not in the valueOptions\n return undefined;\n }\n});","import { GRID_STRING_COL_DEF } from './gridStringColDef';\nimport { GRID_NUMERIC_COL_DEF } from './gridNumericColDef';\nimport { GRID_DATE_COL_DEF, GRID_DATETIME_COL_DEF } from './gridDateColDef';\nimport { GRID_BOOLEAN_COL_DEF } from './gridBooleanColDef';\nimport { GRID_SINGLE_SELECT_COL_DEF } from './gridSingleSelectColDef';\nimport { GRID_ACTIONS_COL_DEF, GRID_ACTIONS_COLUMN_TYPE } from './gridActionsColDef';\nexport const DEFAULT_GRID_COL_TYPE_KEY = '__default__';\nexport const getGridDefaultColumnTypes = () => {\n const nativeColumnTypes = {\n string: GRID_STRING_COL_DEF,\n number: GRID_NUMERIC_COL_DEF,\n date: GRID_DATE_COL_DEF,\n dateTime: GRID_DATETIME_COL_DEF,\n boolean: GRID_BOOLEAN_COL_DEF,\n singleSelect: GRID_SINGLE_SELECT_COL_DEF,\n [GRID_ACTIONS_COLUMN_TYPE]: GRID_ACTIONS_COL_DEF,\n [DEFAULT_GRID_COL_TYPE_KEY]: GRID_STRING_COL_DEF\n };\n return nativeColumnTypes;\n};","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"item\", \"applyValue\", \"type\", \"apiRef\", \"focusElementRef\", \"getOptionLabel\", \"getOptionValue\", \"placeholder\", \"tabIndex\", \"label\", \"isFilterActive\", \"clearButton\", \"InputLabelProps\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_useId as useId } from '@mui/utils';\nimport { styled } from '@mui/material/styles';\nimport { useGridRootProps } from '../../../hooks/utils/useGridRootProps';\nimport { getValueFromValueOptions, isSingleSelectColDef } from './filterPanelUtils';\nimport { createElement as _createElement } from \"react\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst renderSingleSelectOptions = ({\n column: {\n valueOptions,\n field\n },\n OptionComponent,\n getOptionLabel,\n getOptionValue,\n isSelectNative,\n baseSelectOptionProps\n}) => {\n const iterableColumnValues = typeof valueOptions === 'function' ? ['', ...valueOptions({\n field\n })] : ['', ...(valueOptions || [])];\n return iterableColumnValues.map(option => {\n const value = getOptionValue(option);\n const label = getOptionLabel(option);\n return /*#__PURE__*/_createElement(OptionComponent, _extends({}, baseSelectOptionProps, {\n native: isSelectNative,\n key: value,\n value: value\n }), label);\n });\n};\nconst SingleSelectOperatorContainer = styled('div')({\n display: 'flex',\n alignItems: 'flex-end',\n width: '100%',\n [`& button`]: {\n margin: 'auto 0px 5px 5px'\n }\n});\nfunction GridFilterInputSingleSelect(props) {\n var _item$value, _rootProps$slotProps$, _rootProps$slotProps, _resolvedColumn, _resolvedColumn2, _rootProps$slotProps2, _rootProps$slotProps3, _rootProps$slotProps4;\n const {\n item,\n applyValue,\n type,\n apiRef,\n focusElementRef,\n getOptionLabel: getOptionLabelProp,\n getOptionValue: getOptionValueProp,\n placeholder,\n tabIndex,\n label: labelProp,\n clearButton\n } = props,\n others = _objectWithoutPropertiesLoose(props, _excluded);\n const [filterValueState, setFilterValueState] = React.useState((_item$value = item.value) != null ? _item$value : '');\n const id = useId();\n const labelId = useId();\n const rootProps = useGridRootProps();\n const isSelectNative = (_rootProps$slotProps$ = (_rootProps$slotProps = rootProps.slotProps) == null || (_rootProps$slotProps = _rootProps$slotProps.baseSelect) == null ? void 0 : _rootProps$slotProps.native) != null ? _rootProps$slotProps$ : true;\n let resolvedColumn = null;\n if (item.field) {\n const column = apiRef.current.getColumn(item.field);\n if (isSingleSelectColDef(column)) {\n resolvedColumn = column;\n }\n }\n const getOptionValue = getOptionValueProp || ((_resolvedColumn = resolvedColumn) == null ? void 0 : _resolvedColumn.getOptionValue);\n const getOptionLabel = getOptionLabelProp || ((_resolvedColumn2 = resolvedColumn) == null ? void 0 : _resolvedColumn2.getOptionLabel);\n const currentValueOptions = React.useMemo(() => {\n if (!resolvedColumn) {\n return undefined;\n }\n return typeof resolvedColumn.valueOptions === 'function' ? resolvedColumn.valueOptions({\n field: resolvedColumn.field\n }) : resolvedColumn.valueOptions;\n }, [resolvedColumn]);\n const onFilterChange = React.useCallback(event => {\n let value = event.target.value;\n\n // NativeSelect casts the value to a string.\n value = getValueFromValueOptions(value, currentValueOptions, getOptionValue);\n setFilterValueState(String(value));\n applyValue(_extends({}, item, {\n value\n }));\n }, [currentValueOptions, getOptionValue, applyValue, item]);\n React.useEffect(() => {\n var _itemValue;\n let itemValue;\n if (currentValueOptions !== undefined) {\n // sanitize if valueOptions are provided\n itemValue = getValueFromValueOptions(item.value, currentValueOptions, getOptionValue);\n if (itemValue !== item.value) {\n applyValue(_extends({}, item, {\n value: itemValue\n }));\n return;\n }\n } else {\n itemValue = item.value;\n }\n itemValue = (_itemValue = itemValue) != null ? _itemValue : '';\n setFilterValueState(String(itemValue));\n }, [item, currentValueOptions, applyValue, getOptionValue]);\n if (!isSingleSelectColDef(resolvedColumn)) {\n return null;\n }\n if (!isSingleSelectColDef(resolvedColumn)) {\n return null;\n }\n const label = labelProp != null ? labelProp : apiRef.current.getLocaleText('filterPanelInputLabel');\n return /*#__PURE__*/_jsxs(SingleSelectOperatorContainer, {\n children: [/*#__PURE__*/_jsxs(rootProps.slots.baseFormControl, {\n children: [/*#__PURE__*/_jsx(rootProps.slots.baseInputLabel, _extends({}, (_rootProps$slotProps2 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps2.baseInputLabel, {\n id: labelId,\n htmlFor: id,\n shrink: true,\n variant: \"standard\",\n children: label\n })), /*#__PURE__*/_jsx(rootProps.slots.baseSelect, _extends({\n id: id,\n label: label,\n labelId: labelId,\n value: filterValueState,\n onChange: onFilterChange,\n variant: \"standard\",\n type: type || 'text',\n inputProps: {\n tabIndex,\n ref: focusElementRef,\n placeholder: placeholder != null ? placeholder : apiRef.current.getLocaleText('filterPanelInputPlaceholder')\n },\n native: isSelectNative\n }, others, (_rootProps$slotProps3 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps3.baseSelect, {\n children: renderSingleSelectOptions({\n column: resolvedColumn,\n OptionComponent: rootProps.slots.baseSelectOption,\n getOptionLabel,\n getOptionValue,\n isSelectNative,\n baseSelectOptionProps: (_rootProps$slotProps4 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps4.baseSelectOption\n })\n }))]\n }), clearButton]\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? GridFilterInputSingleSelect.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n apiRef: PropTypes.shape({\n current: PropTypes.object.isRequired\n }).isRequired,\n applyValue: PropTypes.func.isRequired,\n clearButton: PropTypes.node,\n focusElementRef: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.func, PropTypes.object]),\n /**\n * Used to determine the label displayed for a given value option.\n * @param {ValueOptions} value The current value option.\n * @returns {string} The text to be displayed.\n */\n getOptionLabel: PropTypes.func,\n /**\n * Used to determine the value used for a value option.\n * @param {ValueOptions} value The current value option.\n * @returns {string} The value to be used.\n */\n getOptionValue: PropTypes.func,\n /**\n * It is `true` if the filter either has a value or an operator with no value\n * required is selected (e.g. `isEmpty`)\n */\n isFilterActive: PropTypes.bool,\n item: PropTypes.shape({\n field: PropTypes.string.isRequired,\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n operator: PropTypes.string.isRequired,\n value: PropTypes.any\n }).isRequired\n} : void 0;\nexport { GridFilterInputSingleSelect };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"item\", \"applyValue\", \"type\", \"apiRef\", \"focusElementRef\", \"color\", \"error\", \"helperText\", \"size\", \"variant\", \"getOptionLabel\", \"getOptionValue\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport Autocomplete, { createFilterOptions } from '@mui/material/Autocomplete';\nimport { unstable_useId as useId } from '@mui/utils';\nimport { isSingleSelectColDef } from './filterPanelUtils';\nimport { useGridRootProps } from '../../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst filter = createFilterOptions();\nfunction GridFilterInputMultipleSingleSelect(props) {\n var _resolvedColumn, _resolvedColumn2;\n const {\n item,\n applyValue,\n apiRef,\n focusElementRef,\n color,\n error,\n helperText,\n size,\n variant = 'standard',\n getOptionLabel: getOptionLabelProp,\n getOptionValue: getOptionValueProp\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const TextFieldProps = {\n color,\n error,\n helperText,\n size,\n variant\n };\n const id = useId();\n const rootProps = useGridRootProps();\n let resolvedColumn = null;\n if (item.field) {\n const column = apiRef.current.getColumn(item.field);\n if (isSingleSelectColDef(column)) {\n resolvedColumn = column;\n }\n }\n const getOptionValue = getOptionValueProp || ((_resolvedColumn = resolvedColumn) == null ? void 0 : _resolvedColumn.getOptionValue);\n const getOptionLabel = getOptionLabelProp || ((_resolvedColumn2 = resolvedColumn) == null ? void 0 : _resolvedColumn2.getOptionLabel);\n const isOptionEqualToValue = React.useCallback((option, value) => getOptionValue(option) === getOptionValue(value), [getOptionValue]);\n const resolvedValueOptions = React.useMemo(() => {\n var _resolvedColumn3;\n if (!((_resolvedColumn3 = resolvedColumn) != null && _resolvedColumn3.valueOptions)) {\n return [];\n }\n if (typeof resolvedColumn.valueOptions === 'function') {\n return resolvedColumn.valueOptions({\n field: resolvedColumn.field\n });\n }\n return resolvedColumn.valueOptions;\n }, [resolvedColumn]);\n const resolvedFormattedValueOptions = React.useMemo(() => {\n return resolvedValueOptions == null ? void 0 : resolvedValueOptions.map(getOptionValue);\n }, [resolvedValueOptions, getOptionValue]);\n\n // The value is computed from the item.value and used directly\n // If it was done by a useEffect/useState, the Autocomplete could receive incoherent value and options\n const filteredValues = React.useMemo(() => {\n if (!Array.isArray(item.value)) {\n return [];\n }\n if (resolvedValueOptions !== undefined) {\n const itemValueIndexes = item.value.map(element => {\n // Gets the index matching between values and valueOptions\n return resolvedFormattedValueOptions == null ? void 0 : resolvedFormattedValueOptions.findIndex(formattedOption => formattedOption === element);\n });\n return itemValueIndexes.filter(index => index >= 0).map(index => resolvedValueOptions[index]);\n }\n return item.value;\n }, [item.value, resolvedValueOptions, resolvedFormattedValueOptions]);\n React.useEffect(() => {\n if (!Array.isArray(item.value) || filteredValues.length !== item.value.length) {\n // Updates the state if the filter value has been cleaned by the component\n applyValue(_extends({}, item, {\n value: filteredValues.map(getOptionValue)\n }));\n }\n }, [item, filteredValues, applyValue, getOptionValue]);\n const handleChange = React.useCallback((event, value) => {\n applyValue(_extends({}, item, {\n value: value.map(getOptionValue)\n }));\n }, [applyValue, item, getOptionValue]);\n return /*#__PURE__*/_jsx(Autocomplete, _extends({\n multiple: true,\n options: resolvedValueOptions,\n isOptionEqualToValue: isOptionEqualToValue,\n filterOptions: filter,\n id: id,\n value: filteredValues,\n onChange: handleChange,\n getOptionLabel: getOptionLabel,\n renderTags: (value, getTagProps) => value.map((option, index) => /*#__PURE__*/_jsx(rootProps.slots.baseChip, _extends({\n variant: \"outlined\",\n size: \"small\",\n label: getOptionLabel(option)\n }, getTagProps({\n index\n })))),\n renderInput: params => {\n var _rootProps$slotProps;\n return /*#__PURE__*/_jsx(rootProps.slots.baseTextField, _extends({}, params, {\n label: apiRef.current.getLocaleText('filterPanelInputLabel'),\n placeholder: apiRef.current.getLocaleText('filterPanelInputPlaceholder'),\n InputLabelProps: _extends({}, params.InputLabelProps, {\n shrink: true\n }),\n inputRef: focusElementRef,\n type: \"singleSelect\"\n }, TextFieldProps, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseTextField));\n }\n }, other));\n}\nprocess.env.NODE_ENV !== \"production\" ? GridFilterInputMultipleSingleSelect.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n apiRef: PropTypes.shape({\n current: PropTypes.object.isRequired\n }).isRequired,\n applyValue: PropTypes.func.isRequired,\n focusElementRef: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.func, PropTypes.object]),\n /**\n * Used to determine the label displayed for a given value option.\n * @param {ValueOptions} value The current value option.\n * @returns {string} The text to be displayed.\n */\n getOptionLabel: PropTypes.func,\n /**\n * Used to determine the value used for a value option.\n * @param {ValueOptions} value The current value option.\n * @returns {string} The value to be used.\n */\n getOptionValue: PropTypes.func,\n item: PropTypes.shape({\n field: PropTypes.string.isRequired,\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n operator: PropTypes.string.isRequired,\n value: PropTypes.any\n }).isRequired,\n type: PropTypes.oneOf(['singleSelect'])\n} : void 0;\nexport { GridFilterInputMultipleSingleSelect };","import { GridFilterInputSingleSelect } from '../components/panel/filterPanel/GridFilterInputSingleSelect';\nimport { GridFilterInputMultipleSingleSelect } from '../components/panel/filterPanel/GridFilterInputMultipleSingleSelect';\nimport { isObject } from '../utils/utils';\nimport { convertLegacyOperators } from './utils';\nconst parseObjectValue = value => {\n if (value == null || !isObject(value)) {\n return value;\n }\n return value.value;\n};\nexport const getGridSingleSelectOperators = () => convertLegacyOperators([{\n value: 'is',\n getApplyFilterFnV7: filterItem => {\n if (filterItem.value == null || filterItem.value === '') {\n return null;\n }\n return value => parseObjectValue(value) === parseObjectValue(filterItem.value);\n },\n InputComponent: GridFilterInputSingleSelect\n}, {\n value: 'not',\n getApplyFilterFnV7: filterItem => {\n if (filterItem.value == null || filterItem.value === '') {\n return null;\n }\n return value => parseObjectValue(value) !== parseObjectValue(filterItem.value);\n },\n InputComponent: GridFilterInputSingleSelect\n}, {\n value: 'isAnyOf',\n getApplyFilterFnV7: filterItem => {\n if (!Array.isArray(filterItem.value) || filterItem.value.length === 0) {\n return null;\n }\n const filterItemValues = filterItem.value.map(parseObjectValue);\n return value => filterItemValues.includes(parseObjectValue(value));\n },\n InputComponent: GridFilterInputMultipleSingleSelect\n}]);","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"id\", \"value\", \"formattedValue\", \"api\", \"field\", \"row\", \"rowNode\", \"colDef\", \"cellMode\", \"isEditable\", \"tabIndex\", \"hasFocus\", \"isValidating\", \"debounceMs\", \"isProcessingProps\", \"onValueChange\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_composeClasses as composeClasses, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';\nimport { styled } from '@mui/material/styles';\nimport InputBase from '@mui/material/InputBase';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['editInputCell']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nconst GridEditInputCellRoot = styled(InputBase, {\n name: 'MuiDataGrid',\n slot: 'EditInputCell',\n overridesResolver: (props, styles) => styles.editInputCell\n})(({\n theme\n}) => _extends({}, theme.typography.body2, {\n padding: '1px 0',\n '& input': {\n padding: '0 16px',\n height: '100%'\n }\n}));\nconst GridEditInputCell = /*#__PURE__*/React.forwardRef((props, ref) => {\n const rootProps = useGridRootProps();\n const {\n id,\n value,\n field,\n colDef,\n hasFocus,\n debounceMs = 200,\n isProcessingProps,\n onValueChange\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const apiRef = useGridApiContext();\n const inputRef = React.useRef();\n const [valueState, setValueState] = React.useState(value);\n const classes = useUtilityClasses(rootProps);\n const handleChange = React.useCallback(async event => {\n const newValue = event.target.value;\n if (onValueChange) {\n await onValueChange(event, newValue);\n }\n const column = apiRef.current.getColumn(field);\n let parsedValue = newValue;\n if (column.valueParser) {\n parsedValue = column.valueParser(newValue, apiRef.current.getCellParams(id, field));\n }\n setValueState(parsedValue);\n apiRef.current.setEditCellValue({\n id,\n field,\n value: parsedValue,\n debounceMs,\n unstable_skipValueParser: true\n }, event);\n }, [apiRef, debounceMs, field, id, onValueChange]);\n const meta = apiRef.current.unstable_getEditCellMeta(id, field);\n React.useEffect(() => {\n if ((meta == null ? void 0 : meta.changeReason) !== 'debouncedSetEditCellValue') {\n setValueState(value);\n }\n }, [meta, value]);\n useEnhancedEffect(() => {\n if (hasFocus) {\n inputRef.current.focus();\n }\n }, [hasFocus]);\n return /*#__PURE__*/_jsx(GridEditInputCellRoot, _extends({\n ref: ref,\n inputRef: inputRef,\n className: classes.root,\n ownerState: rootProps,\n fullWidth: true,\n type: colDef.type === 'number' ? colDef.type : 'text',\n value: valueState != null ? valueState : '',\n onChange: handleChange,\n endAdornment: isProcessingProps ? /*#__PURE__*/_jsx(rootProps.slots.loadIcon, {\n fontSize: \"small\",\n color: \"action\"\n }) : undefined\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridEditInputCell.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n /**\n * GridApi that let you manipulate the grid.\n */\n api: PropTypes.object.isRequired,\n /**\n * The mode of the cell.\n */\n cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,\n changeReason: PropTypes.oneOf(['debouncedSetEditCellValue', 'setEditCellValue']),\n /**\n * The column of the row that the current cell belongs to.\n */\n colDef: PropTypes.object.isRequired,\n debounceMs: PropTypes.number,\n /**\n * The column field of the cell that triggered the event.\n */\n field: PropTypes.string.isRequired,\n /**\n * The cell value formatted with the column valueFormatter.\n */\n formattedValue: PropTypes.any,\n /**\n * If true, the cell is the active element.\n */\n hasFocus: PropTypes.bool.isRequired,\n /**\n * The grid row id.\n */\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n /**\n * If true, the cell is editable.\n */\n isEditable: PropTypes.bool,\n isProcessingProps: PropTypes.bool,\n isValidating: PropTypes.bool,\n /**\n * Callback called when the value is changed by the user.\n * @param {React.ChangeEvent} event The event source of the callback.\n * @param {Date | null} newValue The value that is going to be passed to `apiRef.current.setEditCellValue`.\n * @returns {Promise | void} A promise to be awaited before calling `apiRef.current.setEditCellValue`\n */\n onValueChange: PropTypes.func,\n /**\n * The row model of the row that the current cell belongs to.\n */\n row: PropTypes.any.isRequired,\n /**\n * The node of the row that the current cell belongs to.\n */\n rowNode: PropTypes.object.isRequired,\n /**\n * the tabIndex value.\n */\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\n /**\n * The cell value.\n * If the column has `valueGetter`, use `params.row` to directly access the fields.\n */\n value: PropTypes.any\n} : void 0;\nexport { GridEditInputCell };\nexport const renderEditInputCell = params => /*#__PURE__*/_jsx(GridEditInputCell, _extends({}, params));","import { renderEditInputCell } from '../components/cell/GridEditInputCell';\nimport { gridStringOrNumberComparator } from '../hooks/features/sorting/gridSortingUtils';\nimport { getGridStringOperators, getGridStringQuickFilterFn } from './gridStringOperators';\nimport { convertQuickFilterV7ToLegacy } from './utils';\n\n/**\n * TODO: Move pro and premium properties outside of this Community file\n */\nexport const GRID_STRING_COL_DEF = {\n width: 100,\n minWidth: 50,\n maxWidth: Infinity,\n hideable: true,\n sortable: true,\n resizable: true,\n filterable: true,\n groupable: true,\n pinnable: true,\n // @ts-ignore\n aggregable: true,\n editable: false,\n sortComparator: gridStringOrNumberComparator,\n type: 'string',\n align: 'left',\n filterOperators: getGridStringOperators(),\n renderEditCell: renderEditInputCell,\n getApplyQuickFilterFn: convertQuickFilterV7ToLegacy(getGridStringQuickFilterFn),\n getApplyQuickFilterFnV7: getGridStringQuickFilterFn\n};","import { GridFilterInputValue } from '../components/panel/filterPanel/GridFilterInputValue';\nimport { escapeRegExp } from '../utils/utils';\nimport { GridFilterInputMultipleValue } from '../components/panel/filterPanel/GridFilterInputMultipleValue';\nimport { convertLegacyOperators, tagInternalFilter } from './utils';\nimport { removeDiacritics } from '../hooks/features/filter/gridFilterUtils';\nexport const getGridStringQuickFilterFn = tagInternalFilter(value => {\n if (!value) {\n return null;\n }\n const filterRegex = new RegExp(escapeRegExp(value), 'i');\n return (_, row, column, apiRef) => {\n let columnValue = apiRef.current.getRowFormattedValue(row, column);\n if (apiRef.current.ignoreDiacritics) {\n columnValue = removeDiacritics(columnValue);\n }\n return columnValue != null ? filterRegex.test(columnValue.toString()) : false;\n };\n});\nexport const getGridStringOperators = (disableTrim = false) => convertLegacyOperators([{\n value: 'contains',\n getApplyFilterFnV7: filterItem => {\n if (!filterItem.value) {\n return null;\n }\n const filterItemValue = disableTrim ? filterItem.value : filterItem.value.trim();\n const filterRegex = new RegExp(escapeRegExp(filterItemValue), 'i');\n return value => {\n return value != null ? filterRegex.test(String(value)) : false;\n };\n },\n InputComponent: GridFilterInputValue\n}, {\n value: 'equals',\n getApplyFilterFnV7: filterItem => {\n if (!filterItem.value) {\n return null;\n }\n const filterItemValue = disableTrim ? filterItem.value : filterItem.value.trim();\n const collator = new Intl.Collator(undefined, {\n sensitivity: 'base',\n usage: 'search'\n });\n return value => {\n return value != null ? collator.compare(filterItemValue, value.toString()) === 0 : false;\n };\n },\n InputComponent: GridFilterInputValue\n}, {\n value: 'startsWith',\n getApplyFilterFnV7: filterItem => {\n if (!filterItem.value) {\n return null;\n }\n const filterItemValue = disableTrim ? filterItem.value : filterItem.value.trim();\n const filterRegex = new RegExp(`^${escapeRegExp(filterItemValue)}.*$`, 'i');\n return value => {\n return value != null ? filterRegex.test(value.toString()) : false;\n };\n },\n InputComponent: GridFilterInputValue\n}, {\n value: 'endsWith',\n getApplyFilterFnV7: filterItem => {\n if (!filterItem.value) {\n return null;\n }\n const filterItemValue = disableTrim ? filterItem.value : filterItem.value.trim();\n const filterRegex = new RegExp(`.*${escapeRegExp(filterItemValue)}$`, 'i');\n return value => {\n return value != null ? filterRegex.test(value.toString()) : false;\n };\n },\n InputComponent: GridFilterInputValue\n}, {\n value: 'isEmpty',\n getApplyFilterFnV7: () => {\n return value => {\n return value === '' || value == null;\n };\n },\n requiresFilterValue: false\n}, {\n value: 'isNotEmpty',\n getApplyFilterFnV7: () => {\n return value => {\n return value !== '' && value != null;\n };\n },\n requiresFilterValue: false\n}, {\n value: 'isAnyOf',\n getApplyFilterFnV7: filterItem => {\n if (!Array.isArray(filterItem.value) || filterItem.value.length === 0) {\n return null;\n }\n const filterItemValue = disableTrim ? filterItem.value : filterItem.value.map(val => val.trim());\n const collator = new Intl.Collator(undefined, {\n sensitivity: 'base',\n usage: 'search'\n });\n return value => value != null ? filterItemValue.some(filterValue => {\n return collator.compare(filterValue, value.toString() || '') === 0;\n }) : false;\n },\n InputComponent: GridFilterInputMultipleValue\n}]);","import _extends from \"@babel/runtime/helpers/esm/extends\";\n/**\n * A global API ref, for v7-to-legacy converter\n */\nexport const GLOBAL_API_REF = {\n current: null\n};\n\n/**\n * A tagger to determine if the filter is internal or custom user-supplied.\n * To be a valid internal filter, the v7 function *must* be defined/redefined at\n * the same time as the legacy one.\n * https://github.com/mui/mui-x/pull/9254#discussion_r1231095551\n */\nexport function tagInternalFilter(fn) {\n fn.isInternal = true;\n return fn;\n}\nexport function isInternalFilter(fn) {\n return fn !== undefined && fn.isInternal === true;\n}\nexport function convertFilterV7ToLegacy(fn) {\n return tagInternalFilter((filterItem, column) => {\n const filterFn = fn(filterItem, column);\n if (!filterFn) {\n return filterFn;\n }\n return cellParams => {\n return filterFn(cellParams.value, cellParams.row, column, GLOBAL_API_REF.current);\n };\n });\n}\nexport function convertLegacyOperators(ops) {\n return ops.map(op => {\n return _extends({}, op, {\n getApplyFilterFn: convertFilterV7ToLegacy(op.getApplyFilterFnV7),\n getApplyFilterFnV7: tagInternalFilter(op.getApplyFilterFnV7)\n });\n });\n}\nexport function convertQuickFilterV7ToLegacy(fn) {\n return tagInternalFilter((filterItem, column, apiRef) => {\n const filterFn = fn(filterItem, column, apiRef);\n if (!filterFn) {\n return filterFn;\n }\n return cellParams => {\n return filterFn(cellParams.value, cellParams.row, column, apiRef);\n };\n });\n}","import * as React from 'react';\nexport const GridApiContext = /*#__PURE__*/React.createContext(undefined);\nif (process.env.NODE_ENV !== 'production') {\n GridApiContext.displayName = 'GridApiContext';\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { useGridSelector } from '../hooks/utils/useGridSelector';\nimport { gridTopLevelRowCountSelector } from '../hooks/features/rows/gridRowsSelector';\nimport { selectedGridRowsCountSelector } from '../hooks/features/rowSelection/gridRowSelectionSelector';\nimport { gridFilteredTopLevelRowCountSelector } from '../hooks/features/filter/gridFilterSelector';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { GridSelectedRowCount } from './GridSelectedRowCount';\nimport { GridFooterContainer } from './containers/GridFooterContainer';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst GridFooter = /*#__PURE__*/React.forwardRef(function GridFooter(props, ref) {\n var _rootProps$slotProps, _rootProps$slotProps2;\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const totalTopLevelRowCount = useGridSelector(apiRef, gridTopLevelRowCountSelector);\n const selectedRowCount = useGridSelector(apiRef, selectedGridRowsCountSelector);\n const visibleTopLevelRowCount = useGridSelector(apiRef, gridFilteredTopLevelRowCountSelector);\n const selectedRowCountElement = !rootProps.hideFooterSelectedRowCount && selectedRowCount > 0 ? /*#__PURE__*/_jsx(GridSelectedRowCount, {\n selectedRowCount: selectedRowCount\n }) : /*#__PURE__*/_jsx(\"div\", {});\n const rowCountElement = !rootProps.hideFooterRowCount && !rootProps.pagination ? /*#__PURE__*/_jsx(rootProps.slots.footerRowCount, _extends({}, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.footerRowCount, {\n rowCount: totalTopLevelRowCount,\n visibleRowCount: visibleTopLevelRowCount\n })) : null;\n const paginationElement = rootProps.pagination && !rootProps.hideFooterPagination && rootProps.slots.pagination && /*#__PURE__*/_jsx(rootProps.slots.pagination, _extends({}, (_rootProps$slotProps2 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps2.pagination));\n return /*#__PURE__*/_jsxs(GridFooterContainer, _extends({\n ref: ref\n }, props, {\n children: [selectedRowCountElement, rowCountElement, paginationElement]\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridFooter.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])\n} : void 0;\nexport { GridFooter };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nexport function GridHeader() {\n var _rootProps$slotProps, _rootProps$slotProps2;\n const rootProps = useGridRootProps();\n return /*#__PURE__*/_jsxs(React.Fragment, {\n children: [/*#__PURE__*/_jsx(rootProps.slots.preferencesPanel, _extends({}, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.preferencesPanel)), rootProps.slots.toolbar && /*#__PURE__*/_jsx(rootProps.slots.toolbar, _extends({}, (_rootProps$slotProps2 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps2.toolbar))]\n });\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"className\", \"rowCount\", \"visibleRowCount\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { styled } from '@mui/system';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { getDataGridUtilityClass } from '../constants/gridClasses';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['rowCount']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nconst GridRowCountRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'RowCount',\n overridesResolver: (props, styles) => styles.rowCount\n})(({\n theme\n}) => ({\n alignItems: 'center',\n display: 'flex',\n margin: theme.spacing(0, 2)\n}));\nconst GridRowCount = /*#__PURE__*/React.forwardRef(function GridRowCount(props, ref) {\n const {\n className,\n rowCount,\n visibleRowCount\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const apiRef = useGridApiContext();\n const ownerState = useGridRootProps();\n const classes = useUtilityClasses(ownerState);\n if (rowCount === 0) {\n return null;\n }\n const text = visibleRowCount < rowCount ? apiRef.current.getLocaleText('footerTotalVisibleRows')(visibleRowCount, rowCount) : rowCount.toLocaleString();\n return /*#__PURE__*/_jsxs(GridRowCountRoot, _extends({\n ref: ref,\n className: clsx(classes.root, className),\n ownerState: ownerState\n }, other, {\n children: [apiRef.current.getLocaleText('footerTotalRows'), \" \", text]\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridRowCount.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n rowCount: PropTypes.number.isRequired,\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),\n visibleRowCount: PropTypes.number.isRequired\n} : void 0;\nexport { GridRowCount };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"className\", \"selectedRowCount\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { styled } from '@mui/system';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { getDataGridUtilityClass } from '../constants/gridClasses';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['selectedRowCount']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nconst GridSelectedRowCountRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'SelectedRowCount',\n overridesResolver: (props, styles) => styles.selectedRowCount\n})(({\n theme\n}) => ({\n alignItems: 'center',\n display: 'flex',\n margin: theme.spacing(0, 2),\n visibility: 'hidden',\n width: 0,\n height: 0,\n [theme.breakpoints.up('sm')]: {\n visibility: 'visible',\n width: 'auto',\n height: 'auto'\n }\n}));\nconst GridSelectedRowCount = /*#__PURE__*/React.forwardRef(function GridSelectedRowCount(props, ref) {\n const {\n className,\n selectedRowCount\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const apiRef = useGridApiContext();\n const ownerState = useGridRootProps();\n const classes = useUtilityClasses(ownerState);\n const rowSelectedText = apiRef.current.getLocaleText('footerRowSelected')(selectedRowCount);\n return /*#__PURE__*/_jsx(GridSelectedRowCountRoot, _extends({\n ref: ref,\n className: clsx(classes.root, className),\n ownerState: ownerState\n }, other, {\n children: rowSelectedText\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridSelectedRowCount.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n selectedRowCount: PropTypes.number.isRequired,\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])\n} : void 0;\nexport { GridSelectedRowCount };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { styled } from '@mui/system';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { useGridAriaAttributes } from '../../hooks/utils/useGridAriaAttributes';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['main']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nconst GridMainContainerRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'Main',\n overridesResolver: (props, styles) => styles.main\n})(() => ({\n position: 'relative',\n flexGrow: 1,\n display: 'flex',\n flexDirection: 'column',\n overflow: 'hidden'\n}));\nexport const GridMainContainer = /*#__PURE__*/React.forwardRef((props, ref) => {\n var _rootProps$experiment;\n const rootProps = useGridRootProps();\n const classes = useUtilityClasses(rootProps);\n const getAriaAttributes = (_rootProps$experiment = rootProps.experimentalFeatures) != null && _rootProps$experiment.ariaV7 // ariaV7 should never change\n ? useGridAriaAttributes : null;\n const ariaAttributes = typeof getAriaAttributes === 'function' ? getAriaAttributes() : null;\n return /*#__PURE__*/_jsx(GridMainContainerRoot, _extends({\n ref: ref,\n className: classes.root,\n ownerState: rootProps\n }, ariaAttributes, {\n children: props.children\n }));\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';\nimport { useGridPrivateApiContext } from '../../hooks/utils/useGridPrivateApiContext';\nimport { useGridSelector } from '../../hooks/utils/useGridSelector';\nimport { GridMainContainer } from '../containers/GridMainContainer';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { gridColumnPositionsSelector, gridColumnVisibilityModelSelector, gridVisibleColumnDefinitionsSelector } from '../../hooks/features/columns/gridColumnsSelector';\nimport { gridFilterActiveItemsLookupSelector } from '../../hooks/features/filter/gridFilterSelector';\nimport { gridSortColumnLookupSelector } from '../../hooks/features/sorting/gridSortingSelector';\nimport { gridTabIndexColumnHeaderSelector, gridTabIndexCellSelector, gridFocusColumnHeaderSelector, unstable_gridTabIndexColumnGroupHeaderSelector, unstable_gridFocusColumnGroupHeaderSelector } from '../../hooks/features/focus/gridFocusStateSelector';\nimport { gridDensityFactorSelector } from '../../hooks/features/density/densitySelector';\nimport { gridColumnGroupsHeaderMaxDepthSelector, gridColumnGroupsHeaderStructureSelector } from '../../hooks/features/columnGrouping/gridColumnGroupsSelector';\nimport { gridColumnMenuSelector } from '../../hooks/features/columnMenu/columnMenuSelector';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nfunction GridBody(props) {\n const {\n VirtualScrollerComponent,\n ColumnHeadersProps,\n children\n } = props;\n const apiRef = useGridPrivateApiContext();\n const rootProps = useGridRootProps();\n const rootRef = React.useRef(null);\n const visibleColumns = useGridSelector(apiRef, gridVisibleColumnDefinitionsSelector);\n const filterColumnLookup = useGridSelector(apiRef, gridFilterActiveItemsLookupSelector);\n const sortColumnLookup = useGridSelector(apiRef, gridSortColumnLookupSelector);\n const columnPositions = useGridSelector(apiRef, gridColumnPositionsSelector);\n const columnHeaderTabIndexState = useGridSelector(apiRef, gridTabIndexColumnHeaderSelector);\n const cellTabIndexState = useGridSelector(apiRef, gridTabIndexCellSelector);\n const columnGroupHeaderTabIndexState = useGridSelector(apiRef, unstable_gridTabIndexColumnGroupHeaderSelector);\n const columnHeaderFocus = useGridSelector(apiRef, gridFocusColumnHeaderSelector);\n const columnGroupHeaderFocus = useGridSelector(apiRef, unstable_gridFocusColumnGroupHeaderSelector);\n const densityFactor = useGridSelector(apiRef, gridDensityFactorSelector);\n const headerGroupingMaxDepth = useGridSelector(apiRef, gridColumnGroupsHeaderMaxDepthSelector);\n const columnMenuState = useGridSelector(apiRef, gridColumnMenuSelector);\n const columnVisibility = useGridSelector(apiRef, gridColumnVisibilityModelSelector);\n const columnGroupsHeaderStructure = useGridSelector(apiRef, gridColumnGroupsHeaderStructureSelector);\n const hasOtherElementInTabSequence = !(columnGroupHeaderTabIndexState === null && columnHeaderTabIndexState === null && cellTabIndexState === null);\n useEnhancedEffect(() => {\n apiRef.current.computeSizeAndPublishResizeEvent();\n const elementToObserve = rootRef.current;\n if (typeof ResizeObserver === 'undefined') {\n return () => {};\n }\n let animationFrame;\n const observer = new ResizeObserver(() => {\n // See https://github.com/mui/mui-x/issues/8733\n animationFrame = requestAnimationFrame(() => {\n apiRef.current.computeSizeAndPublishResizeEvent();\n });\n });\n if (elementToObserve) {\n observer.observe(elementToObserve);\n }\n return () => {\n if (animationFrame) {\n window.cancelAnimationFrame(animationFrame);\n }\n if (elementToObserve) {\n observer.unobserve(elementToObserve);\n }\n };\n }, [apiRef]);\n const columnHeadersRef = React.useRef(null);\n const columnsContainerRef = React.useRef(null);\n const virtualScrollerRef = React.useRef(null);\n apiRef.current.register('private', {\n columnHeadersContainerElementRef: columnsContainerRef,\n columnHeadersElementRef: columnHeadersRef,\n virtualScrollerRef,\n mainElementRef: rootRef\n });\n const hasDimensions = !!apiRef.current.getRootDimensions();\n return /*#__PURE__*/_jsxs(GridMainContainer, {\n ref: rootRef,\n children: [/*#__PURE__*/_jsx(rootProps.slots.columnHeaders, _extends({\n ref: columnsContainerRef,\n innerRef: columnHeadersRef,\n visibleColumns: visibleColumns,\n filterColumnLookup: filterColumnLookup,\n sortColumnLookup: sortColumnLookup,\n columnPositions: columnPositions,\n columnHeaderTabIndexState: columnHeaderTabIndexState,\n columnGroupHeaderTabIndexState: columnGroupHeaderTabIndexState,\n columnHeaderFocus: columnHeaderFocus,\n columnGroupHeaderFocus: columnGroupHeaderFocus,\n densityFactor: densityFactor,\n headerGroupingMaxDepth: headerGroupingMaxDepth,\n columnMenuState: columnMenuState,\n columnVisibility: columnVisibility,\n columnGroupsHeaderStructure: columnGroupsHeaderStructure,\n hasOtherElementInTabSequence: hasOtherElementInTabSequence\n }, ColumnHeadersProps)), hasDimensions && /*#__PURE__*/_jsx(VirtualScrollerComponent\n // The content is only rendered after dimensions are computed because\n // the lazy-loading hook is listening to `renderedRowsIntervalChange`,\n // but only does something if the dimensions are also available.\n // If this event is published while dimensions haven't been computed,\n // the `onFetchRows` prop won't be called during mount.\n , {\n ref: virtualScrollerRef\n }), children]\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? GridBody.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n children: PropTypes.node,\n ColumnHeadersProps: PropTypes.object,\n VirtualScrollerComponent: PropTypes.elementType.isRequired\n} : void 0;\nexport { GridBody };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport function GridFooterPlaceholder() {\n var _rootProps$slotProps;\n const rootProps = useGridRootProps();\n if (rootProps.hideFooter) {\n return null;\n }\n return /*#__PURE__*/_jsx(rootProps.slots.footer, _extends({}, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.footer));\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@mui/system';\nimport { unstable_composeClasses as composeClasses, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';\nimport clsx from 'clsx';\nimport { useGridSelector } from '../../hooks/utils/useGridSelector';\nimport { gridExpandedRowCountSelector } from '../../hooks/features/filter/gridFilterSelector';\nimport { gridRowCountSelector, gridRowsLoadingSelector } from '../../hooks/features/rows/gridRowsSelector';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { getMinimalContentHeight } from '../../hooks/features/rows/gridRowsUtils';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst GridOverlayWrapperRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'OverlayWrapper',\n shouldForwardProp: prop => prop !== 'overlayType',\n overridesResolver: (props, styles) => styles.overlayWrapper\n})(({\n overlayType\n}) => ({\n position: 'sticky',\n // To stay in place while scrolling\n top: 0,\n left: 0,\n width: 0,\n // To stay above the content instead of shifting it down\n height: 0,\n // To stay above the content instead of shifting it down\n zIndex: overlayType === 'loadingOverlay' ? 5 // Should be above pinned columns, pinned rows, and detail panel\n : 4 // Should be above pinned columns and detail panel\n}));\n\nconst GridOverlayWrapperInner = styled('div', {\n name: 'MuiDataGrid',\n slot: 'OverlayWrapperInner',\n shouldForwardProp: prop => prop !== 'overlayType',\n overridesResolver: (props, styles) => styles.overlayWrapperInner\n})({});\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['overlayWrapper'],\n inner: ['overlayWrapperInner']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nfunction GridOverlayWrapper(props) {\n var _viewportInnerSize$he, _viewportInnerSize$wi;\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const [viewportInnerSize, setViewportInnerSize] = React.useState(() => {\n var _apiRef$current$getRo, _apiRef$current$getRo2;\n return (_apiRef$current$getRo = (_apiRef$current$getRo2 = apiRef.current.getRootDimensions()) == null ? void 0 : _apiRef$current$getRo2.viewportInnerSize) != null ? _apiRef$current$getRo : null;\n });\n const handleViewportSizeChange = React.useCallback(() => {\n var _apiRef$current$getRo3, _apiRef$current$getRo4;\n setViewportInnerSize((_apiRef$current$getRo3 = (_apiRef$current$getRo4 = apiRef.current.getRootDimensions()) == null ? void 0 : _apiRef$current$getRo4.viewportInnerSize) != null ? _apiRef$current$getRo3 : null);\n }, [apiRef]);\n useEnhancedEffect(() => {\n return apiRef.current.subscribeEvent('viewportInnerSizeChange', handleViewportSizeChange);\n }, [apiRef, handleViewportSizeChange]);\n let height = (_viewportInnerSize$he = viewportInnerSize == null ? void 0 : viewportInnerSize.height) != null ? _viewportInnerSize$he : 0;\n if (rootProps.autoHeight && height === 0) {\n height = getMinimalContentHeight(apiRef, rootProps.rowHeight); // Give room to show the overlay when there no rows.\n }\n\n const classes = useUtilityClasses(_extends({}, props, {\n classes: rootProps.classes\n }));\n if (!viewportInnerSize) {\n return null;\n }\n return /*#__PURE__*/_jsx(GridOverlayWrapperRoot, {\n className: clsx(classes.root),\n overlayType: props.overlayType,\n children: /*#__PURE__*/_jsx(GridOverlayWrapperInner, _extends({\n className: clsx(classes.inner),\n style: {\n height,\n width: (_viewportInnerSize$wi = viewportInnerSize == null ? void 0 : viewportInnerSize.width) != null ? _viewportInnerSize$wi : 0\n }\n }, props))\n });\n}\nprocess.env.NODE_ENV !== \"production\" ? GridOverlayWrapper.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n overlayType: PropTypes.string.isRequired\n} : void 0;\nexport function GridOverlays() {\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const totalRowCount = useGridSelector(apiRef, gridRowCountSelector);\n const visibleRowCount = useGridSelector(apiRef, gridExpandedRowCountSelector);\n const loading = useGridSelector(apiRef, gridRowsLoadingSelector);\n const showNoRowsOverlay = !loading && totalRowCount === 0;\n const showNoResultsOverlay = !loading && totalRowCount > 0 && visibleRowCount === 0;\n let overlay = null;\n let overlayType = '';\n if (showNoRowsOverlay) {\n var _rootProps$slotProps;\n overlay = /*#__PURE__*/_jsx(rootProps.slots.noRowsOverlay, _extends({}, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.noRowsOverlay));\n overlayType = 'noRowsOverlay';\n }\n if (showNoResultsOverlay) {\n var _rootProps$slotProps2;\n overlay = /*#__PURE__*/_jsx(rootProps.slots.noResultsOverlay, _extends({}, (_rootProps$slotProps2 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps2.noResultsOverlay));\n overlayType = 'noResultsOverlay';\n }\n if (loading) {\n var _rootProps$slotProps3;\n overlay = /*#__PURE__*/_jsx(rootProps.slots.loadingOverlay, _extends({}, (_rootProps$slotProps3 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps3.loadingOverlay));\n overlayType = 'loadingOverlay';\n }\n if (overlay === null) {\n return null;\n }\n return /*#__PURE__*/_jsx(GridOverlayWrapper, {\n overlayType: overlayType,\n children: overlay\n });\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"className\"];\nimport * as React from 'react';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { styled } from '@mui/system';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['columnHeaders', 'withBorderColor']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nconst GridColumnHeadersRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'ColumnHeaders',\n overridesResolver: (props, styles) => styles.columnHeaders\n})({\n position: 'relative',\n overflow: 'hidden',\n display: 'flex',\n alignItems: 'center',\n boxSizing: 'border-box',\n borderBottom: '1px solid',\n borderTopLeftRadius: 'var(--unstable_DataGrid-radius)',\n borderTopRightRadius: 'var(--unstable_DataGrid-radius)'\n});\nexport const GridBaseColumnHeaders = /*#__PURE__*/React.forwardRef(function GridColumnHeaders(props, ref) {\n const {\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const rootProps = useGridRootProps();\n const classes = useUtilityClasses(rootProps);\n return /*#__PURE__*/_jsx(GridColumnHeadersRoot, _extends({\n ref: ref,\n className: clsx(className, classes.root),\n ownerState: rootProps\n }, other, {\n role: \"presentation\"\n }));\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"resizable\", \"resizing\", \"height\", \"side\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_composeClasses as composeClasses, unstable_capitalize as capitalize } from '@mui/utils';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nvar GridColumnHeaderSeparatorSides = /*#__PURE__*/function (GridColumnHeaderSeparatorSides) {\n GridColumnHeaderSeparatorSides[\"Left\"] = \"left\";\n GridColumnHeaderSeparatorSides[\"Right\"] = \"right\";\n return GridColumnHeaderSeparatorSides;\n}(GridColumnHeaderSeparatorSides || {});\nconst useUtilityClasses = ownerState => {\n const {\n resizable,\n resizing,\n classes,\n side\n } = ownerState;\n const slots = {\n root: ['columnSeparator', resizable && 'columnSeparator--resizable', resizing && 'columnSeparator--resizing', side && `columnSeparator--side${capitalize(side)}`],\n icon: ['iconSeparator']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nfunction GridColumnHeaderSeparatorRaw(props) {\n const {\n height,\n side = GridColumnHeaderSeparatorSides.Right\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const rootProps = useGridRootProps();\n const ownerState = _extends({}, props, {\n side,\n classes: rootProps.classes\n });\n const classes = useUtilityClasses(ownerState);\n const stopClick = React.useCallback(event => {\n event.preventDefault();\n event.stopPropagation();\n }, []);\n return (\n /*#__PURE__*/\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions\n _jsx(\"div\", _extends({\n className: classes.root,\n style: {\n minHeight: height,\n opacity: rootProps.showColumnVerticalBorder ? 0 : 1\n }\n }, other, {\n onClick: stopClick,\n children: /*#__PURE__*/_jsx(rootProps.slots.columnResizeIcon, {\n className: classes.icon\n })\n }))\n );\n}\nconst GridColumnHeaderSeparator = /*#__PURE__*/React.memo(GridColumnHeaderSeparatorRaw);\nprocess.env.NODE_ENV !== \"production\" ? GridColumnHeaderSeparatorRaw.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n height: PropTypes.number.isRequired,\n resizable: PropTypes.bool.isRequired,\n resizing: PropTypes.bool.isRequired,\n side: PropTypes.oneOf(['left', 'right'])\n} : void 0;\nexport { GridColumnHeaderSeparator, GridColumnHeaderSeparatorSides };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"className\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { styled } from '@mui/system';\nimport { isOverflown } from '../../utils/domUtils';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['columnHeaderTitle']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nconst GridColumnHeaderTitleRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'ColumnHeaderTitle',\n overridesResolver: (props, styles) => styles.columnHeaderTitle\n})({\n textOverflow: 'ellipsis',\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n fontWeight: 'var(--unstable_DataGrid-headWeight)'\n});\nconst ColumnHeaderInnerTitle = /*#__PURE__*/React.forwardRef(function ColumnHeaderInnerTitle(props, ref) {\n const {\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const rootProps = useGridRootProps();\n const classes = useUtilityClasses(rootProps);\n return /*#__PURE__*/_jsx(GridColumnHeaderTitleRoot, _extends({\n ref: ref,\n className: clsx(classes.root, className),\n ownerState: rootProps\n }, other));\n});\n// No React.memo here as if we display the sort icon, we need to recalculate the isOver\nfunction GridColumnHeaderTitle(props) {\n var _rootProps$slotProps;\n const {\n label,\n description\n } = props;\n const rootProps = useGridRootProps();\n const titleRef = React.useRef(null);\n const [tooltip, setTooltip] = React.useState('');\n const handleMouseOver = React.useCallback(() => {\n if (!description && titleRef != null && titleRef.current) {\n const isOver = isOverflown(titleRef.current);\n if (isOver) {\n setTooltip(label);\n } else {\n setTooltip('');\n }\n }\n }, [description, label]);\n return /*#__PURE__*/_jsx(rootProps.slots.baseTooltip, _extends({\n title: description || tooltip\n }, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseTooltip, {\n children: /*#__PURE__*/_jsx(ColumnHeaderInnerTitle, {\n onMouseOver: handleMouseOver,\n ref: titleRef,\n children: label\n })\n }));\n}\nprocess.env.NODE_ENV !== \"production\" ? GridColumnHeaderTitle.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n columnWidth: PropTypes.number.isRequired,\n description: PropTypes.node,\n label: PropTypes.string.isRequired\n} : void 0;\nexport { GridColumnHeaderTitle };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"isDragging\", \"className\"];\nimport * as React from 'react';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { styled } from '@mui/system';\nimport { gridClasses, getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n isDragging,\n hasScrollX,\n classes\n } = ownerState;\n const slots = {\n root: ['columnHeadersInner', isDragging && 'columnHeaderDropZone', hasScrollX && 'columnHeadersInner--scrollable']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nconst GridColumnHeadersInnerRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'columnHeadersInner',\n overridesResolver: (props, styles) => [{\n [`&.${gridClasses.columnHeaderDropZone}`]: styles.columnHeaderDropZone\n }, styles.columnHeadersInner]\n})(() => ({\n display: 'flex',\n alignItems: 'flex-start',\n flexDirection: 'column',\n [`&.${gridClasses.columnHeaderDropZone} .${gridClasses.columnHeaderDraggableContainer}`]: {\n cursor: 'move'\n },\n [`&.${gridClasses['columnHeadersInner--scrollable']} .${gridClasses.columnHeader}:last-child`]: {\n borderRight: 'none'\n }\n}));\nexport const GridColumnHeadersInner = /*#__PURE__*/React.forwardRef(function GridColumnHeadersInner(props, ref) {\n var _apiRef$current$getRo, _apiRef$current$getRo2;\n const {\n isDragging,\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const ownerState = _extends({}, rootProps, {\n isDragging,\n hasScrollX: (_apiRef$current$getRo = (_apiRef$current$getRo2 = apiRef.current.getRootDimensions()) == null ? void 0 : _apiRef$current$getRo2.hasScrollX) != null ? _apiRef$current$getRo : false\n });\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(GridColumnHeadersInnerRoot, _extends({\n ref: ref,\n className: clsx(className, classes.root),\n ownerState: ownerState\n }, other));\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"className\"];\nimport * as React from 'react';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { styled } from '@mui/system';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['iconButtonContainer']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nconst GridIconButtonContainerRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'IconButtonContainer',\n overridesResolver: (props, styles) => styles.iconButtonContainer\n})(() => ({\n display: 'flex',\n visibility: 'hidden',\n width: 0\n}));\nexport const GridIconButtonContainer = /*#__PURE__*/React.forwardRef(function GridIconButtonContainer(props, ref) {\n const {\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const rootProps = useGridRootProps();\n const classes = useUtilityClasses(rootProps);\n return /*#__PURE__*/_jsx(GridIconButtonContainerRoot, _extends({\n ref: ref,\n className: clsx(classes.root, className),\n ownerState: rootProps\n }, other));\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"className\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { styled } from '@mui/system';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['footerContainer', 'withBorderColor']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nconst GridFooterContainerRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'FooterContainer',\n overridesResolver: (props, styles) => styles.footerContainer\n})({\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n minHeight: 52,\n borderTop: '1px solid'\n});\nconst GridFooterContainer = /*#__PURE__*/React.forwardRef(function GridFooterContainer(props, ref) {\n const {\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const rootProps = useGridRootProps();\n const classes = useUtilityClasses(rootProps);\n return /*#__PURE__*/_jsx(GridFooterContainerRoot, _extends({\n ref: ref,\n className: clsx(classes.root, className),\n ownerState: rootProps\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridFooterContainer.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])\n} : void 0;\nexport { GridFooterContainer };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { alpha, styled, darken, lighten } from '@mui/material/styles';\nimport { gridClasses } from '../../constants/gridClasses';\nfunction getBorderColor(theme) {\n if (theme.vars) {\n return theme.vars.palette.TableCell.border;\n }\n if (theme.palette.mode === 'light') {\n return lighten(alpha(theme.palette.divider, 1), 0.88);\n }\n return darken(alpha(theme.palette.divider, 1), 0.68);\n}\nconst columnHeadersStyles = {\n [`.${gridClasses.columnSeparator}, .${gridClasses['columnSeparator--resizing']}`]: {\n visibility: 'visible',\n width: 'auto'\n }\n};\nconst columnHeaderStyles = {\n [`& .${gridClasses.iconButtonContainer}`]: {\n visibility: 'visible',\n width: 'auto'\n },\n [`& .${gridClasses.menuIcon}`]: {\n width: 'auto',\n visibility: 'visible'\n }\n};\nexport const GridRootStyles = styled('div', {\n name: 'MuiDataGrid',\n slot: 'Root',\n overridesResolver: (props, styles) => [{\n [`&.${gridClasses.autoHeight}`]: styles.autoHeight\n }, {\n [`&.${gridClasses.aggregationColumnHeader}`]: styles.aggregationColumnHeader\n }, {\n [`&.${gridClasses['aggregationColumnHeader--alignLeft']}`]: styles['aggregationColumnHeader--alignLeft']\n }, {\n [`&.${gridClasses['aggregationColumnHeader--alignCenter']}`]: styles['aggregationColumnHeader--alignCenter']\n }, {\n [`&.${gridClasses['aggregationColumnHeader--alignRight']}`]: styles['aggregationColumnHeader--alignRight']\n }, {\n [`&.${gridClasses.aggregationColumnHeaderLabel}`]: styles.aggregationColumnHeaderLabel\n }, {\n [`&.${gridClasses['root--disableUserSelection']} .${gridClasses.cell}`]: styles['root--disableUserSelection']\n }, {\n [`&.${gridClasses.autosizing}`]: styles.autosizing\n }, {\n [`& .${gridClasses.editBooleanCell}`]: styles.editBooleanCell\n }, {\n [`& .${gridClasses['cell--editing']}`]: styles['cell--editing']\n }, {\n [`& .${gridClasses['cell--textCenter']}`]: styles['cell--textCenter']\n }, {\n [`& .${gridClasses['cell--textLeft']}`]: styles['cell--textLeft']\n }, {\n [`& .${gridClasses['cell--textRight']}`]: styles['cell--textRight']\n },\n // TODO v6: Remove\n {\n [`& .${gridClasses['cell--withRenderer']}`]: styles['cell--withRenderer']\n }, {\n [`& .${gridClasses.cell}`]: styles.cell\n }, {\n [`& .${gridClasses['cell--rangeTop']}`]: styles['cell--rangeTop']\n }, {\n [`& .${gridClasses['cell--rangeBottom']}`]: styles['cell--rangeBottom']\n }, {\n [`& .${gridClasses['cell--rangeLeft']}`]: styles['cell--rangeLeft']\n }, {\n [`& .${gridClasses['cell--rangeRight']}`]: styles['cell--rangeRight']\n }, {\n [`& .${gridClasses['cell--withRightBorder']}`]: styles['cell--withRightBorder']\n }, {\n [`& .${gridClasses.cellContent}`]: styles.cellContent\n }, {\n [`& .${gridClasses.cellCheckbox}`]: styles.cellCheckbox\n }, {\n [`& .${gridClasses.cellSkeleton}`]: styles.cellSkeleton\n }, {\n [`& .${gridClasses.checkboxInput}`]: styles.checkboxInput\n }, {\n [`& .${gridClasses['columnHeader--alignCenter']}`]: styles['columnHeader--alignCenter']\n }, {\n [`& .${gridClasses['columnHeader--alignLeft']}`]: styles['columnHeader--alignLeft']\n }, {\n [`& .${gridClasses['columnHeader--alignRight']}`]: styles['columnHeader--alignRight']\n }, {\n [`& .${gridClasses['columnHeader--dragging']}`]: styles['columnHeader--dragging']\n }, {\n [`& .${gridClasses['columnHeader--moving']}`]: styles['columnHeader--moving']\n }, {\n [`& .${gridClasses['columnHeader--numeric']}`]: styles['columnHeader--numeric']\n }, {\n [`& .${gridClasses['columnHeader--sortable']}`]: styles['columnHeader--sortable']\n }, {\n [`& .${gridClasses['columnHeader--sorted']}`]: styles['columnHeader--sorted']\n }, {\n [`& .${gridClasses['columnHeader--withRightBorder']}`]: styles['columnHeader--withRightBorder']\n }, {\n [`& .${gridClasses.columnHeader}`]: styles.columnHeader\n }, {\n [`& .${gridClasses.headerFilterRow}`]: styles.headerFilterRow\n }, {\n [`& .${gridClasses.columnHeaderCheckbox}`]: styles.columnHeaderCheckbox\n }, {\n [`& .${gridClasses.columnHeaderDraggableContainer}`]: styles.columnHeaderDraggableContainer\n }, {\n [`& .${gridClasses.columnHeaderTitleContainer}`]: styles.columnHeaderTitleContainer\n }, {\n [`& .${gridClasses['columnSeparator--resizable']}`]: styles['columnSeparator--resizable']\n }, {\n [`& .${gridClasses['columnSeparator--resizing']}`]: styles['columnSeparator--resizing']\n }, {\n [`& .${gridClasses.columnSeparator}`]: styles.columnSeparator\n }, {\n [`& .${gridClasses.filterIcon}`]: styles.filterIcon\n }, {\n [`& .${gridClasses.iconSeparator}`]: styles.iconSeparator\n }, {\n [`& .${gridClasses.menuIcon}`]: styles.menuIcon\n }, {\n [`& .${gridClasses.menuIconButton}`]: styles.menuIconButton\n }, {\n [`& .${gridClasses.menuOpen}`]: styles.menuOpen\n }, {\n [`& .${gridClasses.menuList}`]: styles.menuList\n }, {\n [`& .${gridClasses['row--editable']}`]: styles['row--editable']\n }, {\n [`& .${gridClasses['row--editing']}`]: styles['row--editing']\n }, {\n [`& .${gridClasses['row--dragging']}`]: styles['row--dragging']\n }, {\n [`& .${gridClasses.row}`]: styles.row\n }, {\n [`& .${gridClasses.rowReorderCellPlaceholder}`]: styles.rowReorderCellPlaceholder\n }, {\n [`& .${gridClasses.rowReorderCell}`]: styles.rowReorderCell\n }, {\n [`& .${gridClasses['rowReorderCell--draggable']}`]: styles['rowReorderCell--draggable']\n }, {\n [`& .${gridClasses.sortIcon}`]: styles.sortIcon\n }, {\n [`& .${gridClasses.withBorderColor}`]: styles.withBorderColor\n }, {\n [`& .${gridClasses.treeDataGroupingCell}`]: styles.treeDataGroupingCell\n }, {\n [`& .${gridClasses.treeDataGroupingCellToggle}`]: styles.treeDataGroupingCellToggle\n }, {\n [`& .${gridClasses.detailPanelToggleCell}`]: styles.detailPanelToggleCell\n }, {\n [`& .${gridClasses['detailPanelToggleCell--expanded']}`]: styles['detailPanelToggleCell--expanded']\n }, styles.root]\n})(({\n theme\n}) => {\n const borderColor = getBorderColor(theme);\n const radius = theme.shape.borderRadius;\n const gridStyle = _extends({\n '--unstable_DataGrid-radius': typeof radius === 'number' ? `${radius}px` : radius,\n '--unstable_DataGrid-headWeight': theme.typography.fontWeightMedium,\n '--unstable_DataGrid-overlayBackground': theme.vars ? `rgba(${theme.vars.palette.background.defaultChannel} / ${theme.vars.palette.action.disabledOpacity})` : alpha(theme.palette.background.default, theme.palette.action.disabledOpacity),\n '--DataGrid-cellOffsetMultiplier': 2,\n flex: 1,\n boxSizing: 'border-box',\n position: 'relative',\n borderWidth: '1px',\n borderStyle: 'solid',\n borderColor,\n borderRadius: 'var(--unstable_DataGrid-radius)',\n color: (theme.vars || theme).palette.text.primary\n }, theme.typography.body2, {\n outline: 'none',\n height: '100%',\n display: 'flex',\n minWidth: 0,\n // See https://github.com/mui/mui-x/issues/8547\n minHeight: 0,\n flexDirection: 'column',\n overflowAnchor: 'none',\n // Keep the same scrolling position\n [`&.${gridClasses.autoHeight}`]: {\n height: 'auto',\n [`& .${gridClasses['row--lastVisible']} .${gridClasses.cell}`]: {\n borderBottomColor: 'transparent'\n }\n },\n [`&.${gridClasses.autosizing}`]: {\n [`& .${gridClasses.columnHeaderTitleContainerContent} > *`]: {\n overflow: 'visible !important'\n },\n [`& .${gridClasses.cell} > *`]: {\n overflow: 'visible !important',\n whiteSpace: 'nowrap'\n }\n },\n [`& .${gridClasses['virtualScrollerContent--overflowed']} .${gridClasses['row--lastVisible']} .${gridClasses.cell}`]: {\n borderBottomColor: 'transparent'\n },\n [`& .${gridClasses.columnHeader}, & .${gridClasses.cell}`]: {\n WebkitTapHighlightColor: 'transparent',\n lineHeight: null,\n padding: '0 10px',\n boxSizing: 'border-box'\n },\n [`& .${gridClasses.columnHeader}:focus-within, & .${gridClasses.cell}:focus-within`]: {\n outline: `solid ${theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / 0.5)` : alpha(theme.palette.primary.main, 0.5)} 1px`,\n outlineWidth: 1,\n outlineOffset: -1\n },\n [`& .${gridClasses.columnHeader}:focus, & .${gridClasses.cell}:focus`]: {\n outline: `solid ${theme.palette.primary.main} 1px`\n },\n [`& .${gridClasses.columnHeaderCheckbox}, & .${gridClasses.cellCheckbox}`]: {\n padding: 0,\n justifyContent: 'center',\n alignItems: 'center'\n },\n [`& .${gridClasses.columnHeader}`]: {\n position: 'relative',\n display: 'flex',\n alignItems: 'center'\n },\n [`& .${gridClasses['columnHeader--sorted']} .${gridClasses.iconButtonContainer}, & .${gridClasses['columnHeader--filtered']} .${gridClasses.iconButtonContainer}`]: {\n visibility: 'visible',\n width: 'auto'\n },\n [`& .${gridClasses.columnHeader}:not(.${gridClasses['columnHeader--sorted']}) .${gridClasses.sortIcon}`]: {\n opacity: 0,\n transition: theme.transitions.create(['opacity'], {\n duration: theme.transitions.duration.shorter\n })\n },\n [`& .${gridClasses.columnHeaderTitleContainer}`]: {\n display: 'flex',\n alignItems: 'center',\n minWidth: 0,\n flex: 1,\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n // to anchor the aggregation label\n position: 'relative'\n },\n [`& .${gridClasses.columnHeaderTitleContainerContent}`]: {\n overflow: 'hidden',\n display: 'flex',\n alignItems: 'center'\n },\n [`& .${gridClasses['columnHeader--filledGroup']} .${gridClasses.columnHeaderTitleContainer}`]: {\n borderBottomWidth: '1px',\n borderBottomStyle: 'solid',\n boxSizing: 'border-box'\n },\n [`& .${gridClasses['columnHeader--filledGroup']}.${gridClasses['columnHeader--showColumnBorder']} .${gridClasses.columnHeaderTitleContainer}`]: {\n borderBottom: `none`\n },\n [`& .${gridClasses['columnHeader--filledGroup']}.${gridClasses['columnHeader--showColumnBorder']}`]: {\n borderBottomWidth: '1px',\n borderBottomStyle: 'solid',\n boxSizing: 'border-box'\n },\n [`& .${gridClasses.headerFilterRow}`]: {\n borderTop: `1px solid ${borderColor}`\n },\n [`& .${gridClasses.sortIcon}, & .${gridClasses.filterIcon}`]: {\n fontSize: 'inherit'\n },\n [`& .${gridClasses['columnHeader--sortable']}`]: {\n cursor: 'pointer'\n },\n [`& .${gridClasses['columnHeader--alignCenter']} .${gridClasses.columnHeaderTitleContainer}`]: {\n justifyContent: 'center'\n },\n [`& .${gridClasses['columnHeader--alignRight']} .${gridClasses.columnHeaderDraggableContainer}, & .${gridClasses['columnHeader--alignRight']} .${gridClasses.columnHeaderTitleContainer}`]: {\n flexDirection: 'row-reverse'\n },\n [`& .${gridClasses['columnHeader--alignCenter']} .${gridClasses.menuIcon}, & .${gridClasses['columnHeader--alignRight']} .${gridClasses.menuIcon}`]: {\n marginRight: 'auto',\n marginLeft: -6\n },\n [`& .${gridClasses['columnHeader--alignRight']} .${gridClasses.menuIcon}, & .${gridClasses['columnHeader--alignRight']} .${gridClasses.menuIcon}`]: {\n marginRight: 'auto',\n marginLeft: -10\n },\n [`& .${gridClasses['columnHeader--moving']}`]: {\n backgroundColor: (theme.vars || theme).palette.action.hover\n },\n [`& .${gridClasses.columnSeparator}`]: {\n visibility: 'hidden',\n position: 'absolute',\n zIndex: 100,\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'center',\n color: borderColor\n },\n '@media (hover: hover)': {\n [`& .${gridClasses.columnHeaders}:hover`]: columnHeadersStyles,\n [`& .${gridClasses.columnHeader}:hover`]: columnHeaderStyles,\n [`& .${gridClasses.columnHeader}:not(.${gridClasses['columnHeader--sorted']}):hover .${gridClasses.sortIcon}`]: {\n opacity: 0.5\n }\n },\n '@media (hover: none)': {\n [`& .${gridClasses.columnHeaders}`]: columnHeadersStyles,\n [`& .${gridClasses.columnHeader}`]: columnHeaderStyles\n },\n [`& .${gridClasses['columnSeparator--sideLeft']}`]: {\n left: -12\n },\n [`& .${gridClasses['columnSeparator--sideRight']}`]: {\n right: -12\n },\n [`& .${gridClasses['columnSeparator--resizable']}`]: {\n cursor: 'col-resize',\n touchAction: 'none',\n '&:hover': {\n color: (theme.vars || theme).palette.text.primary,\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n color: borderColor\n }\n },\n [`&.${gridClasses['columnSeparator--resizing']}`]: {\n color: (theme.vars || theme).palette.text.primary\n },\n '& svg': {\n pointerEvents: 'none'\n }\n },\n [`& .${gridClasses.iconSeparator}`]: {\n color: 'inherit'\n },\n [`& .${gridClasses.menuIcon}`]: {\n width: 0,\n visibility: 'hidden',\n fontSize: 20,\n marginRight: -10,\n display: 'flex',\n alignItems: 'center'\n },\n [`.${gridClasses.menuOpen}`]: {\n visibility: 'visible',\n width: 'auto'\n },\n [`& .${gridClasses.row}`]: {\n display: 'flex',\n width: 'fit-content',\n breakInside: 'avoid',\n // Avoid the row to be broken in two different print pages.\n '&:hover, &.Mui-hovered': {\n backgroundColor: (theme.vars || theme).palette.action.hover,\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n },\n '&.Mui-selected': {\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity),\n '&:hover, &.Mui-hovered': {\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / calc(\n ${theme.vars.palette.action.selectedOpacity} + \n ${theme.vars.palette.action.hoverOpacity}\n ))` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + theme.palette.action.hoverOpacity),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity)\n }\n }\n }\n },\n [`& .${gridClasses.cell}`]: {\n display: 'flex',\n alignItems: 'center',\n borderBottom: '1px solid',\n '&.Mui-selected': {\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity),\n '&:hover, &.Mui-hovered': {\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.selectedOpacity + theme.palette.action.hoverOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + theme.palette.action.hoverOpacity),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity)\n }\n }\n }\n },\n [`&.${gridClasses['root--disableUserSelection']} .${gridClasses.cell}`]: {\n userSelect: 'none'\n },\n [`& .${gridClasses.row}:not(.${gridClasses['row--dynamicHeight']}) > .${gridClasses.cell}`]: {\n overflow: 'hidden',\n whiteSpace: 'nowrap'\n },\n [`& .${gridClasses.cellContent}`]: {\n overflow: 'hidden',\n textOverflow: 'ellipsis'\n },\n [`& .${gridClasses.cell}.${gridClasses['cell--selectionMode']}`]: {\n cursor: 'default'\n },\n [`& .${gridClasses.cell}.${gridClasses['cell--editing']}`]: {\n padding: 1,\n display: 'flex',\n boxShadow: theme.shadows[2],\n backgroundColor: (theme.vars || theme).palette.background.paper,\n '&:focus-within': {\n outline: `solid ${(theme.vars || theme).palette.primary.main} 1px`,\n outlineOffset: '-1px'\n }\n },\n [`& .${gridClasses['row--editing']}`]: {\n boxShadow: theme.shadows[2]\n },\n [`& .${gridClasses['row--editing']} .${gridClasses.cell}`]: {\n boxShadow: theme.shadows[0],\n backgroundColor: (theme.vars || theme).palette.background.paper\n },\n [`& .${gridClasses.editBooleanCell}`]: {\n display: 'flex',\n height: '100%',\n width: '100%',\n alignItems: 'center',\n justifyContent: 'center'\n },\n [`& .${gridClasses.booleanCell}[data-value=\"true\"]`]: {\n color: (theme.vars || theme).palette.text.secondary\n },\n [`& .${gridClasses.booleanCell}[data-value=\"false\"]`]: {\n color: (theme.vars || theme).palette.text.disabled\n },\n [`& .${gridClasses.actionsCell}`]: {\n display: 'inline-flex',\n alignItems: 'center',\n gridGap: theme.spacing(1)\n },\n [`& .${gridClasses.rowReorderCell}`]: {\n display: 'inline-flex',\n flex: 1,\n alignItems: 'center',\n justifyContent: 'center',\n opacity: (theme.vars || theme).palette.action.disabledOpacity\n },\n [`& .${gridClasses['rowReorderCell--draggable']}`]: {\n cursor: 'move',\n opacity: 1\n },\n [`& .${gridClasses.rowReorderCellContainer}`]: {\n padding: 0,\n alignItems: 'stretch'\n },\n [`.${gridClasses.withBorderColor}`]: {\n borderColor\n },\n [`& .${gridClasses['cell--withRightBorder']}`]: {\n borderRightWidth: '1px',\n borderRightStyle: 'solid'\n },\n [`& .${gridClasses['columnHeader--withRightBorder']}`]: {\n borderRightWidth: '1px',\n borderRightStyle: 'solid'\n },\n [`& .${gridClasses['cell--textLeft']}`]: {\n justifyContent: 'flex-start'\n },\n [`& .${gridClasses['cell--textRight']}`]: {\n justifyContent: 'flex-end'\n },\n [`& .${gridClasses['cell--textCenter']}`]: {\n justifyContent: 'center'\n },\n [`& .${gridClasses.columnHeaderDraggableContainer}`]: {\n display: 'flex',\n width: '100%',\n height: '100%'\n },\n [`& .${gridClasses.rowReorderCellPlaceholder}`]: {\n display: 'none'\n },\n [`& .${gridClasses['columnHeader--dragging']}, & .${gridClasses['row--dragging']}`]: {\n background: (theme.vars || theme).palette.background.paper,\n padding: '0 12px',\n borderRadius: 'var(--unstable_DataGrid-radius)',\n opacity: (theme.vars || theme).palette.action.disabledOpacity\n },\n [`& .${gridClasses['row--dragging']}`]: {\n background: (theme.vars || theme).palette.background.paper,\n padding: '0 12px',\n borderRadius: 'var(--unstable_DataGrid-radius)',\n opacity: (theme.vars || theme).palette.action.disabledOpacity,\n [`& .${gridClasses.rowReorderCellPlaceholder}`]: {\n display: 'flex'\n }\n },\n [`& .${gridClasses.treeDataGroupingCell}`]: {\n display: 'flex',\n alignItems: 'center',\n width: '100%'\n },\n [`& .${gridClasses.treeDataGroupingCellToggle}`]: {\n flex: '0 0 28px',\n alignSelf: 'stretch',\n marginRight: theme.spacing(2)\n },\n [`& .${gridClasses.groupingCriteriaCell}`]: {\n display: 'flex',\n alignItems: 'center',\n width: '100%'\n },\n [`& .${gridClasses.groupingCriteriaCellToggle}`]: {\n flex: '0 0 28px',\n alignSelf: 'stretch',\n marginRight: theme.spacing(2)\n }\n });\n return gridStyle;\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"children\", \"className\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_useForkRef as useForkRef, unstable_useEnhancedEffect as useEnhancedEffect, unstable_capitalize as capitalize, unstable_composeClasses as composeClasses } from '@mui/utils';\nimport { GridRootStyles } from './GridRootStyles';\nimport { useGridSelector } from '../../hooks/utils/useGridSelector';\nimport { useGridPrivateApiContext } from '../../hooks/utils/useGridPrivateApiContext';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { gridDensityValueSelector } from '../../hooks/features/density/densitySelector';\nimport { useGridAriaAttributes } from '../../hooks/utils/useGridAriaAttributes';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n autoHeight,\n density,\n classes\n } = ownerState;\n const slots = {\n root: ['root', autoHeight && 'autoHeight', `root--density${capitalize(density)}`, 'withBorderColor']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nconst GridRoot = /*#__PURE__*/React.forwardRef(function GridRoot(props, ref) {\n var _rootProps$experiment;\n const rootProps = useGridRootProps();\n const {\n children,\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const apiRef = useGridPrivateApiContext();\n const densityValue = useGridSelector(apiRef, gridDensityValueSelector);\n const rootContainerRef = React.useRef(null);\n const handleRef = useForkRef(rootContainerRef, ref);\n const getAriaAttributes = (_rootProps$experiment = rootProps.experimentalFeatures) != null && _rootProps$experiment.ariaV7 // ariaV7 should never change\n ? null : useGridAriaAttributes;\n const ariaAttributes = typeof getAriaAttributes === 'function' ? getAriaAttributes() : null;\n const ownerState = _extends({}, rootProps, {\n density: densityValue\n });\n const classes = useUtilityClasses(ownerState);\n apiRef.current.register('public', {\n rootElementRef: rootContainerRef\n });\n\n // Our implementation of } event The event source of the callback.\n * You can pull out the new value by accessing `event.target.value` (string).\n * You can pull out the new checked state by accessing `event.target.checked` (boolean).\n */\n onChange: PropTypes.func,\n /**\n * If `true`, the `input` element is required.\n * @default false\n */\n required: PropTypes.bool,\n /**\n * The size of the component.\n * `small` is equivalent to the dense switch styling.\n * @default 'medium'\n */\n size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['medium', 'small']), PropTypes.string]),\n /**\n * The system prop that allows defining system overrides as well as additional CSS styles.\n */\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),\n /**\n * The value of the component. The DOM API casts this to a string.\n * The browser uses \"on\" as the default value.\n */\n value: PropTypes.any\n} : void 0;\nexport default Switch;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"sortingOrder\"];\nimport * as React from 'react';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const GridColumnUnsortedIcon = /*#__PURE__*/React.memo(function GridColumnHeaderSortIcon(props) {\n const {\n sortingOrder\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const rootProps = useGridRootProps();\n const [nextSortDirection] = sortingOrder;\n const Icon = nextSortDirection === 'asc' ? rootProps.slots.columnSortedAscendingIcon : rootProps.slots.columnSortedDescendingIcon;\n return Icon ? /*#__PURE__*/_jsx(Icon, _extends({}, other)) : null;\n});","import * as React from 'react';\nimport { createSvgIcon } from '@mui/material/utils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const GridArrowUpwardIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M4 12l1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8-8 8z\"\n}), 'ArrowUpward');\nexport const GridArrowDownwardIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z\"\n}), 'ArrowDownward');\nexport const GridKeyboardArrowRight = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M8.59 16.59 13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z\"\n}), 'KeyboardArrowRight');\nexport const GridExpandMoreIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6z\"\n}), 'ExpandMore');\nexport const GridFilterListIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z\"\n}), 'FilterList');\nexport const GridFilterAltIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M4.25 5.61C6.27 8.2 10 13 10 13v6c0 .55.45 1 1 1h2c.55 0 1-.45 1-1v-6s3.72-4.8 5.74-7.39c.51-.66.04-1.61-.79-1.61H5.04c-.83 0-1.3.95-.79 1.61z\"\n}), 'FilterAlt');\nexport const GridSearchIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z\"\n}), 'Search');\nexport const GridMenuIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z\"\n}), 'Menu');\nexport const GridCheckCircleIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z\"\n}), 'CheckCircle');\nexport const GridColumnIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M6 5H3c-.55 0-1 .45-1 1v12c0 .55.45 1 1 1h3c.55 0 1-.45 1-1V6c0-.55-.45-1-1-1zm14 0h-3c-.55 0-1 .45-1 1v12c0 .55.45 1 1 1h3c.55 0 1-.45 1-1V6c0-.55-.45-1-1-1zm-7 0h-3c-.55 0-1 .45-1 1v12c0 .55.45 1 1 1h3c.55 0 1-.45 1-1V6c0-.55-.45-1-1-1z\"\n}), 'ColumnIcon');\nexport const GridSeparatorIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M11 19V5h2v14z\"\n}), 'Separator');\nexport const GridViewHeadlineIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M4 15h16v-2H4v2zm0 4h16v-2H4v2zm0-8h16V9H4v2zm0-6v2h16V5H4z\"\n}), 'ViewHeadline');\nexport const GridTableRowsIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M21,8H3V4h18V8z M21,10H3v4h18V10z M21,16H3v4h18V16z\"\n}), 'TableRows');\nexport const GridViewStreamIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M4 18h17v-6H4v6zM4 5v6h17V5H4z\"\n}), 'ViewStream');\nexport const GridTripleDotsVerticalIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z\"\n}), 'TripleDotsVertical');\nexport const GridCloseIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"\n}), 'Close');\nexport const GridAddIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z\"\n}), 'Add');\nexport const GridRemoveIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M19 13H5v-2h14v2z\"\n}), 'Remove');\nexport const GridLoadIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M12 4V1L8 5l4 4V6c3.31 0 6 2.69 6 6 0 1.01-.25 1.97-.7 2.8l1.46 1.46C19.54 15.03 20 13.57 20 12c0-4.42-3.58-8-8-8zm0 14c-3.31 0-6-2.69-6-6 0-1.01.25-1.97.7-2.8L5.24 7.74C4.46 8.97 4 10.43 4 12c0 4.42 3.58 8 8 8v3l4-4-4-4v3z\"\n}), 'Load');\nexport const GridDragIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z\"\n}), 'Drag');\nexport const GridSaveAltIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M19 12v7H5v-7H3v7c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2v-7h-2zm-6 .67l2.59-2.58L17 11.5l-5 5-5-5 1.41-1.41L11 12.67V3h2z\"\n}), 'SaveAlt');\nexport const GridCheckIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z\"\n}), 'Check');\nexport const GridMoreVertIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z\"\n}), 'MoreVert');\nexport const GridVisibilityOffIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M12 7c2.76 0 5 2.24 5 5 0 .65-.13 1.26-.36 1.83l2.92 2.92c1.51-1.26 2.7-2.89 3.43-4.75-1.73-4.39-6-7.5-11-7.5-1.4 0-2.74.25-3.98.7l2.16 2.16C10.74 7.13 11.35 7 12 7zM2 4.27l2.28 2.28.46.46C3.08 8.3 1.78 10.02 1 12c1.73 4.39 6 7.5 11 7.5 1.55 0 3.03-.3 4.38-.84l.42.42L19.73 22 21 20.73 3.27 3 2 4.27zM7.53 9.8l1.55 1.55c-.05.21-.08.43-.08.65 0 1.66 1.34 3 3 3 .22 0 .44-.03.65-.08l1.55 1.55c-.67.33-1.41.53-2.2.53-2.76 0-5-2.24-5-5 0-.79.2-1.53.53-2.2zm4.31-.78l3.15 3.15.02-.16c0-1.66-1.34-3-3-3l-.17.01z\"\n}), 'VisibilityOff');\nexport const GridViewColumnIcon = createSvgIcon( /*#__PURE__*/_jsx(\"g\", {\n children: /*#__PURE__*/_jsx(\"path\", {\n d: \"M14.67,5v14H9.33V5H14.67z M15.67,19H21V5h-5.33V19z M8.33,19V5H3v14H8.33z\"\n })\n}), 'ViewColumn');\nexport const GridClearIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"\n}), 'Clear');\nexport const GridDeleteIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z\"\n}), 'Delete');\nexport const GridDeleteForeverIcon = createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zm2.46-7.12l1.41-1.41L12 12.59l2.12-2.12 1.41 1.41L13.41 14l2.12 2.12-1.41 1.41L12 15.41l-2.12 2.12-1.41-1.41L10.59 14l-2.13-2.12zM15.5 4l-1-1h-5l-1 1H5v2h14V4z\"\n}), 'Delete');","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"native\"];\nimport * as React from 'react';\nimport MUIMenuItem from '@mui/material/MenuItem';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default function MUISelectOption(_ref) {\n let {\n native\n } = _ref,\n props = _objectWithoutPropertiesLoose(_ref, _excluded);\n if (native) {\n return /*#__PURE__*/_jsx(\"option\", _extends({}, props));\n }\n return /*#__PURE__*/_jsx(MUIMenuItem, _extends({}, props));\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport MUICheckbox from '@mui/material/Checkbox';\nimport MUITextField from '@mui/material/TextField';\nimport MUIFormControl from '@mui/material/FormControl';\nimport MUISelect from '@mui/material/Select';\nimport MUISwitch from '@mui/material/Switch';\nimport MUIButton from '@mui/material/Button';\nimport MUIIconButton from '@mui/material/IconButton';\nimport MUIInputAdornment from '@mui/material/InputAdornment';\nimport MUITooltip from '@mui/material/Tooltip';\nimport MUIPopper from '@mui/material/Popper';\nimport MUIInputLabel from '@mui/material/InputLabel';\nimport MUIChip from '@mui/material/Chip';\nimport { GridColumnUnsortedIcon } from './icons/GridColumnUnsortedIcon';\nimport { GridAddIcon, GridArrowDownwardIcon, GridArrowUpwardIcon, GridCheckIcon, GridCloseIcon, GridColumnIcon, GridDragIcon, GridExpandMoreIcon, GridFilterAltIcon, GridFilterListIcon, GridKeyboardArrowRight, GridMoreVertIcon, GridRemoveIcon, GridSaveAltIcon, GridSearchIcon, GridSeparatorIcon, GridTableRowsIcon, GridTripleDotsVerticalIcon, GridViewHeadlineIcon, GridViewStreamIcon, GridVisibilityOffIcon, GridViewColumnIcon, GridClearIcon, GridLoadIcon, GridDeleteForeverIcon } from './icons';\nimport MUISelectOption from './components/MUISelectOption';\nconst iconSlots = {\n BooleanCellTrueIcon: GridCheckIcon,\n BooleanCellFalseIcon: GridCloseIcon,\n ColumnMenuIcon: GridTripleDotsVerticalIcon,\n OpenFilterButtonIcon: GridFilterListIcon,\n FilterPanelDeleteIcon: GridCloseIcon,\n ColumnFilteredIcon: GridFilterAltIcon,\n ColumnSelectorIcon: GridColumnIcon,\n ColumnUnsortedIcon: GridColumnUnsortedIcon,\n ColumnSortedAscendingIcon: GridArrowUpwardIcon,\n ColumnSortedDescendingIcon: GridArrowDownwardIcon,\n ColumnResizeIcon: GridSeparatorIcon,\n DensityCompactIcon: GridViewHeadlineIcon,\n DensityStandardIcon: GridTableRowsIcon,\n DensityComfortableIcon: GridViewStreamIcon,\n ExportIcon: GridSaveAltIcon,\n MoreActionsIcon: GridMoreVertIcon,\n TreeDataCollapseIcon: GridExpandMoreIcon,\n TreeDataExpandIcon: GridKeyboardArrowRight,\n GroupingCriteriaCollapseIcon: GridExpandMoreIcon,\n GroupingCriteriaExpandIcon: GridKeyboardArrowRight,\n DetailPanelExpandIcon: GridAddIcon,\n DetailPanelCollapseIcon: GridRemoveIcon,\n RowReorderIcon: GridDragIcon,\n QuickFilterIcon: GridSearchIcon,\n QuickFilterClearIcon: GridCloseIcon,\n ColumnMenuHideIcon: GridVisibilityOffIcon,\n ColumnMenuSortAscendingIcon: GridArrowUpwardIcon,\n ColumnMenuSortDescendingIcon: GridArrowDownwardIcon,\n ColumnMenuFilterIcon: GridFilterAltIcon,\n ColumnMenuManageColumnsIcon: GridViewColumnIcon,\n ColumnMenuClearIcon: GridClearIcon,\n LoadIcon: GridLoadIcon,\n FilterPanelAddIcon: GridAddIcon,\n FilterPanelRemoveAllIcon: GridDeleteForeverIcon,\n ColumnReorderIcon: GridDragIcon\n};\nconst materialSlots = _extends({}, iconSlots, {\n BaseCheckbox: MUICheckbox,\n BaseTextField: MUITextField,\n BaseFormControl: MUIFormControl,\n BaseSelect: MUISelect,\n BaseSwitch: MUISwitch,\n BaseButton: MUIButton,\n BaseIconButton: MUIIconButton,\n BaseInputAdornment: MUIInputAdornment,\n BaseTooltip: MUITooltip,\n BasePopper: MUIPopper,\n BaseInputLabel: MUIInputLabel,\n BaseSelectOption: MUISelectOption,\n BaseChip: MUIChip\n});\nexport default materialSlots;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { GridSkeletonCell, GridColumnsPanel, GridFilterPanel, GridFooter, GridLoadingOverlay, GridNoRowsOverlay, GridPagination, GridPanel, GridPreferencesPanel, GridRow, GridColumnHeaderFilterIconButton, GridRowCount } from '../components';\nimport { GridCellV7 } from '../components/cell/GridCell';\nimport { GridColumnHeaders } from '../components/GridColumnHeaders';\nimport { GridColumnMenu } from '../components/menu/columnMenu/GridColumnMenu';\nimport { GridNoResultsOverlay } from '../components/GridNoResultsOverlay';\nimport materialSlots from '../material';\n\n// TODO: camelCase these key. It's a private helper now.\n// Remove then need to call `uncapitalizeObjectKeys`.\nexport const DATA_GRID_DEFAULT_SLOTS_COMPONENTS = _extends({}, materialSlots, {\n Cell: GridCellV7,\n SkeletonCell: GridSkeletonCell,\n ColumnHeaderFilterIconButton: GridColumnHeaderFilterIconButton,\n ColumnMenu: GridColumnMenu,\n ColumnHeaders: GridColumnHeaders,\n Footer: GridFooter,\n FooterRowCount: GridRowCount,\n Toolbar: null,\n PreferencesPanel: GridPreferencesPanel,\n LoadingOverlay: GridLoadingOverlay,\n NoResultsOverlay: GridNoResultsOverlay,\n NoRowsOverlay: GridNoRowsOverlay,\n Pagination: GridPagination,\n FilterPanel: GridFilterPanel,\n ColumnsPanel: GridColumnsPanel,\n Panel: GridPanel,\n Row: GridRow\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_composeClasses as composeClasses, unstable_useId as useId } from '@mui/utils';\nimport Badge from '@mui/material/Badge';\nimport { useGridSelector } from '../../hooks';\nimport { gridPreferencePanelStateSelector } from '../../hooks/features/preferencesPanel/gridPreferencePanelSelector';\nimport { GridPreferencePanelsValue } from '../../hooks/features/preferencesPanel/gridPreferencePanelsValue';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { GridIconButtonContainer } from './GridIconButtonContainer';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n icon: ['filterIcon']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\nfunction GridColumnHeaderFilterIconButton(props) {\n var _rootProps$slotProps, _rootProps$slotProps2;\n const {\n counter,\n field,\n onClick\n } = props;\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const ownerState = _extends({}, props, {\n classes: rootProps.classes\n });\n const classes = useUtilityClasses(ownerState);\n const preferencePanel = useGridSelector(apiRef, gridPreferencePanelStateSelector);\n const labelId = useId();\n const panelId = useId();\n const toggleFilter = React.useCallback(event => {\n event.preventDefault();\n event.stopPropagation();\n const {\n open,\n openedPanelValue\n } = gridPreferencePanelStateSelector(apiRef.current.state);\n if (open && openedPanelValue === GridPreferencePanelsValue.filters) {\n apiRef.current.hideFilterPanel();\n } else {\n apiRef.current.showFilterPanel(undefined, panelId, labelId);\n }\n if (onClick) {\n onClick(apiRef.current.getColumnHeaderParams(field), event);\n }\n }, [apiRef, field, onClick, panelId, labelId]);\n if (!counter) {\n return null;\n }\n const open = preferencePanel.open && preferencePanel.labelId === labelId;\n const iconButton = /*#__PURE__*/_jsx(rootProps.slots.baseIconButton, _extends({\n id: labelId,\n onClick: toggleFilter,\n color: \"default\",\n \"aria-label\": apiRef.current.getLocaleText('columnHeaderFiltersLabel'),\n size: \"small\",\n tabIndex: -1,\n \"aria-haspopup\": \"menu\",\n \"aria-expanded\": open,\n \"aria-controls\": open ? panelId : undefined\n }, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseIconButton, {\n children: /*#__PURE__*/_jsx(rootProps.slots.columnFilteredIcon, {\n className: classes.icon,\n fontSize: \"small\"\n })\n }));\n return /*#__PURE__*/_jsx(rootProps.slots.baseTooltip, _extends({\n title: apiRef.current.getLocaleText('columnHeaderFiltersTooltipActive')(counter),\n enterDelay: 1000\n }, (_rootProps$slotProps2 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps2.baseTooltip, {\n children: /*#__PURE__*/_jsxs(GridIconButtonContainer, {\n children: [counter > 1 && /*#__PURE__*/_jsx(Badge, {\n badgeContent: counter,\n color: \"default\",\n children: iconButton\n }), counter === 1 && iconButton]\n })\n }));\n}\nprocess.env.NODE_ENV !== \"production\" ? GridColumnHeaderFilterIconButton.propTypes = {\n // ----------------------------- Warning --------------------------------\n // | These PropTypes are generated from the TypeScript type definitions |\n // | To update them edit the TypeScript types and run \"yarn proptypes\" |\n // ----------------------------------------------------------------------\n counter: PropTypes.number,\n field: PropTypes.string.isRequired,\n onClick: PropTypes.func\n} : void 0;\nexport { GridColumnHeaderFilterIconButton };","import { unstable_generateUtilityClasses as generateUtilityClasses, unstable_generateUtilityClass as generateUtilityClass } from '@mui/utils';\nexport function getDataGridUtilityClass(slot) {\n return generateUtilityClass('MuiDataGrid', slot);\n}\nexport const gridClasses = generateUtilityClasses('MuiDataGrid', ['actionsCell', 'aggregationColumnHeader', 'aggregationColumnHeader--alignLeft', 'aggregationColumnHeader--alignCenter', 'aggregationColumnHeader--alignRight', 'aggregationColumnHeaderLabel', 'autoHeight', 'autosizing', 'booleanCell', 'cell--editable', 'cell--editing', 'cell--textCenter', 'cell--textLeft', 'cell--textRight', 'cell--withRenderer', 'cell--rangeTop', 'cell--rangeBottom', 'cell--rangeLeft', 'cell--rangeRight', 'cell--selectionMode', 'cell', 'cellContent', 'cellCheckbox', 'cellSkeleton', 'checkboxInput', 'columnHeader--alignCenter', 'columnHeader--alignLeft', 'columnHeader--alignRight', 'columnHeader--dragging', 'columnHeader--moving', 'columnHeader--numeric', 'columnHeader--sortable', 'columnHeader--sorted', 'columnHeader--filtered', 'columnHeader', 'columnHeaderCheckbox', 'columnHeaderDraggableContainer', 'columnHeaderDropZone', 'columnHeaderTitle', 'columnHeaderTitleContainer', 'columnHeaderTitleContainerContent', 'columnGroupHeader', 'columnHeader--filledGroup', 'columnHeader--emptyGroup', 'columnHeader--showColumnBorder', 'columnHeaders', 'columnHeadersInner', 'columnHeadersInner--scrollable', 'columnSeparator--resizable', 'columnSeparator--resizing', 'columnSeparator--sideLeft', 'columnSeparator--sideRight', 'columnSeparator', 'columnsPanel', 'columnsPanelRow', 'detailPanel', 'detailPanels', 'detailPanelToggleCell', 'detailPanelToggleCell--expanded', 'footerCell', 'panel', 'panelHeader', 'panelWrapper', 'panelContent', 'panelFooter', 'paper', 'editBooleanCell', 'editInputCell', 'filterForm', 'filterFormDeleteIcon', 'filterFormLogicOperatorInput', 'filterFormColumnInput', 'filterFormOperatorInput', 'filterFormValueInput', 'filterIcon', 'footerContainer', 'headerFilterRow', 'iconButtonContainer', 'iconSeparator', 'main', 'menu', 'menuIcon', 'menuIconButton', 'menuOpen', 'menuList', 'overlay', 'overlayWrapper', 'overlayWrapperInner', 'root', 'root--densityStandard', 'root--densityComfortable', 'root--densityCompact', 'root--disableUserSelection', 'row', 'row--editable', 'row--editing', 'row--lastVisible', 'row--dragging', 'row--dynamicHeight', 'row--detailPanelExpanded', 'rowReorderCellPlaceholder', 'rowCount', 'rowReorderCellContainer', 'rowReorderCell', 'rowReorderCell--draggable', 'scrollArea--left', 'scrollArea--right', 'scrollArea', 'selectedRowCount', 'sortIcon', 'toolbarContainer', 'toolbarFilterList', 'virtualScroller', 'virtualScrollerContent', 'virtualScrollerContent--overflowed', 'virtualScrollerRenderZone', 'pinnedColumns', 'pinnedColumns--left', 'pinnedColumns--right', 'pinnedColumnHeaders', 'pinnedColumnHeaders--left', 'pinnedColumnHeaders--right', 'withBorderColor', 'cell--withRightBorder', 'columnHeader--withRightBorder', 'treeDataGroupingCell', 'treeDataGroupingCellToggle', 'groupingCriteriaCell', 'groupingCriteriaCellToggle', 'pinnedRows', 'pinnedRows--top', 'pinnedRows--bottom', 'pinnedRowsRenderZone']);","// Can't import from pro package - hence duplication\nexport const GRID_DETAIL_PANEL_TOGGLE_FIELD = '__detail_panel_toggle__';","export const GRID_DEFAULT_LOCALE_TEXT = {\n // Root\n noRowsLabel: 'No rows',\n noResultsOverlayLabel: 'No results found.',\n // Density selector toolbar button text\n toolbarDensity: 'Density',\n toolbarDensityLabel: 'Density',\n toolbarDensityCompact: 'Compact',\n toolbarDensityStandard: 'Standard',\n toolbarDensityComfortable: 'Comfortable',\n // Columns selector toolbar button text\n toolbarColumns: 'Columns',\n toolbarColumnsLabel: 'Select columns',\n // Filters toolbar button text\n toolbarFilters: 'Filters',\n toolbarFiltersLabel: 'Show filters',\n toolbarFiltersTooltipHide: 'Hide filters',\n toolbarFiltersTooltipShow: 'Show filters',\n toolbarFiltersTooltipActive: count => count !== 1 ? `${count} active filters` : `${count} active filter`,\n // Quick filter toolbar field\n toolbarQuickFilterPlaceholder: 'Search…',\n toolbarQuickFilterLabel: 'Search',\n toolbarQuickFilterDeleteIconLabel: 'Clear',\n // Export selector toolbar button text\n toolbarExport: 'Export',\n toolbarExportLabel: 'Export',\n toolbarExportCSV: 'Download as CSV',\n toolbarExportPrint: 'Print',\n toolbarExportExcel: 'Download as Excel',\n // Columns panel text\n columnsPanelTextFieldLabel: 'Find column',\n columnsPanelTextFieldPlaceholder: 'Column title',\n columnsPanelDragIconLabel: 'Reorder column',\n columnsPanelShowAllButton: 'Show all',\n columnsPanelHideAllButton: 'Hide all',\n // Filter panel text\n filterPanelAddFilter: 'Add filter',\n filterPanelRemoveAll: 'Remove all',\n filterPanelDeleteIconLabel: 'Delete',\n filterPanelLogicOperator: 'Logic operator',\n filterPanelOperator: 'Operator',\n filterPanelOperatorAnd: 'And',\n filterPanelOperatorOr: 'Or',\n filterPanelColumns: 'Columns',\n filterPanelInputLabel: 'Value',\n filterPanelInputPlaceholder: 'Filter value',\n // Filter operators text\n filterOperatorContains: 'contains',\n filterOperatorEquals: 'equals',\n filterOperatorStartsWith: 'starts with',\n filterOperatorEndsWith: 'ends with',\n filterOperatorIs: 'is',\n filterOperatorNot: 'is not',\n filterOperatorAfter: 'is after',\n filterOperatorOnOrAfter: 'is on or after',\n filterOperatorBefore: 'is before',\n filterOperatorOnOrBefore: 'is on or before',\n filterOperatorIsEmpty: 'is empty',\n filterOperatorIsNotEmpty: 'is not empty',\n filterOperatorIsAnyOf: 'is any of',\n 'filterOperator=': '=',\n 'filterOperator!=': '!=',\n 'filterOperator>': '>',\n 'filterOperator>=': '>=',\n 'filterOperator<': '<',\n 'filterOperator<=': '<=',\n // Header filter operators text\n headerFilterOperatorContains: 'Contains',\n headerFilterOperatorEquals: 'Equals',\n headerFilterOperatorStartsWith: 'Starts with',\n headerFilterOperatorEndsWith: 'Ends with',\n headerFilterOperatorIs: 'Is',\n headerFilterOperatorNot: 'Is not',\n headerFilterOperatorAfter: 'Is after',\n headerFilterOperatorOnOrAfter: 'Is on or after',\n headerFilterOperatorBefore: 'Is before',\n headerFilterOperatorOnOrBefore: 'Is on or before',\n headerFilterOperatorIsEmpty: 'Is empty',\n headerFilterOperatorIsNotEmpty: 'Is not empty',\n headerFilterOperatorIsAnyOf: 'Is any of',\n 'headerFilterOperator=': 'Equals',\n 'headerFilterOperator!=': 'Not equals',\n 'headerFilterOperator>': 'Greater than',\n 'headerFilterOperator>=': 'Greater than or equal to',\n 'headerFilterOperator<': 'Less than',\n 'headerFilterOperator<=': 'Less than or equal to',\n // Filter values text\n filterValueAny: 'any',\n filterValueTrue: 'true',\n filterValueFalse: 'false',\n // Column menu text\n columnMenuLabel: 'Menu',\n columnMenuShowColumns: 'Show columns',\n columnMenuManageColumns: 'Manage columns',\n columnMenuFilter: 'Filter',\n columnMenuHideColumn: 'Hide column',\n columnMenuUnsort: 'Unsort',\n columnMenuSortAsc: 'Sort by ASC',\n columnMenuSortDesc: 'Sort by DESC',\n // Column header text\n columnHeaderFiltersTooltipActive: count => count !== 1 ? `${count} active filters` : `${count} active filter`,\n columnHeaderFiltersLabel: 'Show filters',\n columnHeaderSortIconLabel: 'Sort',\n // Rows selected footer text\n footerRowSelected: count => count !== 1 ? `${count.toLocaleString()} rows selected` : `${count.toLocaleString()} row selected`,\n // Total row amount footer text\n footerTotalRows: 'Total Rows:',\n // Total visible row amount footer text\n footerTotalVisibleRows: (visibleCount, totalCount) => `${visibleCount.toLocaleString()} of ${totalCount.toLocaleString()}`,\n // Checkbox selection text\n checkboxSelectionHeaderName: 'Checkbox selection',\n checkboxSelectionSelectAllRows: 'Select all rows',\n checkboxSelectionUnselectAllRows: 'Unselect all rows',\n checkboxSelectionSelectRow: 'Select row',\n checkboxSelectionUnselectRow: 'Unselect row',\n // Boolean cell text\n booleanCellTrueLabel: 'yes',\n booleanCellFalseLabel: 'no',\n // Actions cell more text\n actionsCellMore: 'more',\n // Column pinning text\n pinToLeft: 'Pin to left',\n pinToRight: 'Pin to right',\n unpin: 'Unpin',\n // Tree Data\n treeDataGroupingHeaderName: 'Group',\n treeDataExpand: 'see children',\n treeDataCollapse: 'hide children',\n // Grouping columns\n groupingColumnHeaderName: 'Group',\n groupColumn: name => `Group by ${name}`,\n unGroupColumn: name => `Stop grouping by ${name}`,\n // Master/detail\n detailPanelToggle: 'Detail panel toggle',\n expandDetailPanel: 'Expand',\n collapseDetailPanel: 'Collapse',\n // Used core components translation keys\n MuiTablePagination: {},\n // Row reordering text\n rowReorderingHeaderName: 'Row reordering',\n // Aggregation\n aggregationMenuItemHeader: 'Aggregation',\n aggregationFunctionLabelSum: 'sum',\n aggregationFunctionLabelAvg: 'avg',\n aggregationFunctionLabelMin: 'min',\n aggregationFunctionLabelMax: 'max',\n aggregationFunctionLabelSize: 'size'\n};","import * as React from 'react';\nimport { GridApiContext } from '../components/GridApiContext';\nimport { GridPrivateApiContext } from '../hooks/utils/useGridPrivateApiContext';\nimport { GridRootPropsContext } from './GridRootPropsContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport function GridContextProvider({\n privateApiRef,\n props,\n children\n}) {\n const apiRef = React.useRef(privateApiRef.current.getPublicApi());\n return /*#__PURE__*/_jsx(GridRootPropsContext.Provider, {\n value: props,\n children: /*#__PURE__*/_jsx(GridPrivateApiContext.Provider, {\n value: privateApiRef,\n children: /*#__PURE__*/_jsx(GridApiContext.Provider, {\n value: apiRef,\n children: children\n })\n })\n });\n}","import * as React from 'react';\nconst GridRootPropsContext = /*#__PURE__*/React.createContext(undefined);\nif (process.env.NODE_ENV !== 'production') {\n GridRootPropsContext.displayName = 'GridRootPropsContext';\n}\nexport { GridRootPropsContext };","import * as React from 'react';\nimport { useFirstRender } from '../../utils/useFirstRender';\nexport const useGridRegisterPipeApplier = (apiRef, group, callback) => {\n const cleanup = React.useRef();\n const id = React.useRef(`mui-${Math.round(Math.random() * 1e9)}`);\n const registerPreProcessor = React.useCallback(() => {\n cleanup.current = apiRef.current.registerPipeApplier(group, id.current, callback);\n }, [apiRef, callback, group]);\n useFirstRender(() => {\n registerPreProcessor();\n });\n const isFirstRender = React.useRef(true);\n React.useEffect(() => {\n if (isFirstRender.current) {\n isFirstRender.current = false;\n } else {\n registerPreProcessor();\n }\n return () => {\n if (cleanup.current) {\n cleanup.current();\n cleanup.current = null;\n }\n };\n }, [registerPreProcessor]);\n};","import * as React from 'react';\nimport { useFirstRender } from '../../utils/useFirstRender';\nexport const useGridRegisterPipeProcessor = (apiRef, group, callback) => {\n const cleanup = React.useRef();\n const id = React.useRef(`mui-${Math.round(Math.random() * 1e9)}`);\n const registerPreProcessor = React.useCallback(() => {\n cleanup.current = apiRef.current.registerPipeProcessor(group, id.current, callback);\n }, [apiRef, callback, group]);\n useFirstRender(() => {\n registerPreProcessor();\n });\n const isFirstRender = React.useRef(true);\n React.useEffect(() => {\n if (isFirstRender.current) {\n isFirstRender.current = false;\n } else {\n registerPreProcessor();\n }\n return () => {\n if (cleanup.current) {\n cleanup.current();\n cleanup.current = null;\n }\n };\n }, [registerPreProcessor]);\n};","import * as React from 'react';\nimport { useFirstRender } from '../../utils/useFirstRender';\nexport const useGridRegisterStrategyProcessor = (apiRef, strategyName, group, processor) => {\n const registerPreProcessor = React.useCallback(() => {\n apiRef.current.registerStrategyProcessor(strategyName, group, processor);\n }, [apiRef, processor, group, strategyName]);\n useFirstRender(() => {\n registerPreProcessor();\n });\n const isFirstRender = React.useRef(true);\n React.useEffect(() => {\n if (isFirstRender.current) {\n isFirstRender.current = false;\n } else {\n registerPreProcessor();\n }\n }, [registerPreProcessor]);\n};","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _toPropertyKey from \"@babel/runtime/helpers/esm/toPropertyKey\";\nimport * as React from 'react';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nexport const GRID_DEFAULT_STRATEGY = 'none';\nexport const GRID_STRATEGIES_PROCESSORS = {\n rowTreeCreation: 'rowTree',\n filtering: 'rowTree',\n sorting: 'rowTree',\n visibleRowsLookupCreation: 'rowTree'\n};\n/**\n * Implements a variant of the Strategy Pattern (see https://en.wikipedia.org/wiki/Strategy_pattern)\n *\n * More information and detailed example in (TODO add link to technical doc when ready)\n *\n * Some plugins contains custom logic that must only be applied if the right strategy is active.\n * For instance, the row grouping plugin has a custom filtering algorithm.\n * This algorithm must be applied by the filtering plugin if the row grouping is the current way of grouping rows,\n * but not if the tree data is the current way of grouping rows.\n *\n * =====================================================================================================================\n *\n * The plugin containing the custom logic must use:\n *\n * - `useGridRegisterStrategyProcessor` to register their processor.\n * When the processor of the active strategy changes, it will fire `\"activeStrategyProcessorChange\"` to re-apply the processor.\n *\n * - `apiRef.current.setStrategyAvailability` to tell if their strategy can be used.\n *\n * =====================================================================================================================\n *\n * The plugin or component that needs to apply the custom logic of the current strategy must use:\n *\n * - `apiRef.current.applyStrategyProcessor` to run the processor of the active strategy for a given processor name.\n *\n * - the \"strategyAvailabilityChange\" event to update something when the active strategy changes.\n * Warning: Be careful not to apply the processor several times.\n * For instance \"rowsSet\" is fired by `useGridRows` whenever the active strategy changes.\n * So listening to both would most likely run your logic twice.\n *\n * - The \"activeStrategyProcessorChange\" event to update something when the processor of the active strategy changes.\n *\n * =====================================================================================================================\n *\n * Each processor name is part of a strategy group which can only have one active strategy at the time.\n * For now, there is only one strategy group named `rowTree` which customize\n * - row tree creation algorithm.\n * - sorting algorithm.\n * - filtering algorithm.\n */\nexport const useGridStrategyProcessing = apiRef => {\n const availableStrategies = React.useRef(new Map());\n const strategiesCache = React.useRef({});\n const registerStrategyProcessor = React.useCallback((strategyName, processorName, processor) => {\n const cleanup = () => {\n const _ref = strategiesCache.current[processorName],\n otherProcessors = _objectWithoutPropertiesLoose(_ref, [strategyName].map(_toPropertyKey));\n strategiesCache.current[processorName] = otherProcessors;\n };\n if (!strategiesCache.current[processorName]) {\n strategiesCache.current[processorName] = {};\n }\n const groupPreProcessors = strategiesCache.current[processorName];\n const previousProcessor = groupPreProcessors[strategyName];\n groupPreProcessors[strategyName] = processor;\n if (!previousProcessor || previousProcessor === processor) {\n return cleanup;\n }\n if (strategyName === apiRef.current.getActiveStrategy(GRID_STRATEGIES_PROCESSORS[processorName])) {\n apiRef.current.publishEvent('activeStrategyProcessorChange', processorName);\n }\n return cleanup;\n }, [apiRef]);\n const applyStrategyProcessor = React.useCallback((processorName, params) => {\n const activeStrategy = apiRef.current.getActiveStrategy(GRID_STRATEGIES_PROCESSORS[processorName]);\n if (activeStrategy == null) {\n throw new Error(\"Can't apply a strategy processor before defining an active strategy\");\n }\n const groupCache = strategiesCache.current[processorName];\n if (!groupCache || !groupCache[activeStrategy]) {\n throw new Error(`No processor found for processor \"${processorName}\" on strategy \"${activeStrategy}\"`);\n }\n const processor = groupCache[activeStrategy];\n return processor(params);\n }, [apiRef]);\n const getActiveStrategy = React.useCallback(strategyGroup => {\n var _availableStrategyEnt;\n const strategyEntries = Array.from(availableStrategies.current.entries());\n const availableStrategyEntry = strategyEntries.find(([, strategy]) => {\n if (strategy.group !== strategyGroup) {\n return false;\n }\n return strategy.isAvailable();\n });\n return (_availableStrategyEnt = availableStrategyEntry == null ? void 0 : availableStrategyEntry[0]) != null ? _availableStrategyEnt : GRID_DEFAULT_STRATEGY;\n }, []);\n const setStrategyAvailability = React.useCallback((strategyGroup, strategyName, isAvailable) => {\n availableStrategies.current.set(strategyName, {\n group: strategyGroup,\n isAvailable\n });\n apiRef.current.publishEvent('strategyAvailabilityChange');\n }, [apiRef]);\n const strategyProcessingApi = {\n registerStrategyProcessor,\n applyStrategyProcessor,\n getActiveStrategy,\n setStrategyAvailability\n };\n useGridApiMethod(apiRef, strategyProcessingApi, 'private');\n};","import * as React from 'react';\nimport { localStorageAvailable } from '../../utils/utils';\nimport { useGridApiMethod } from '../utils';\nconst forceDebug = localStorageAvailable() && window.localStorage.getItem('DEBUG') != null;\nconst noop = () => {};\nconst noopLogger = {\n debug: noop,\n info: noop,\n warn: noop,\n error: noop\n};\nconst LOG_LEVELS = ['debug', 'info', 'warn', 'error'];\nfunction getAppender(name, logLevel, appender = console) {\n const minLogLevelIdx = LOG_LEVELS.indexOf(logLevel);\n if (minLogLevelIdx === -1) {\n throw new Error(`MUI: Log level ${logLevel} not recognized.`);\n }\n const logger = LOG_LEVELS.reduce((loggerObj, method, idx) => {\n if (idx >= minLogLevelIdx) {\n loggerObj[method] = (...args) => {\n const [message, ...other] = args;\n appender[method](`MUI: ${name} - ${message}`, ...other);\n };\n } else {\n loggerObj[method] = noop;\n }\n return loggerObj;\n }, {});\n return logger;\n}\nexport const useGridLoggerFactory = (apiRef, props) => {\n const getLogger = React.useCallback(name => {\n if (forceDebug) {\n return getAppender(name, 'debug', props.logger);\n }\n if (!props.logLevel) {\n return noopLogger;\n }\n return getAppender(name, props.logLevel.toString(), props.logger);\n }, [props.logLevel, props.logger]);\n useGridApiMethod(apiRef, {\n getLogger\n }, 'private');\n};","export class Store {\n static create(value) {\n return new Store(value);\n }\n constructor(_value) {\n this.value = void 0;\n this.listeners = void 0;\n this.subscribe = fn => {\n this.listeners.add(fn);\n return () => {\n this.listeners.delete(fn);\n };\n };\n this.getSnapshot = () => {\n return this.value;\n };\n this.update = value => {\n this.value = value;\n this.listeners.forEach(l => l(value));\n };\n this.value = _value;\n this.listeners = new Set();\n }\n}","// Used https://gist.github.com/mudge/5830382 as a starting point.\n// See https://github.com/browserify/events/blob/master/events.js for\n// the Node.js (https://nodejs.org/api/events.html) polyfill used by webpack.\nexport class EventManager {\n constructor() {\n this.maxListeners = 20;\n this.warnOnce = false;\n this.events = {};\n }\n on(eventName, listener, options = {}) {\n let collection = this.events[eventName];\n if (!collection) {\n collection = {\n highPriority: new Map(),\n regular: new Map()\n };\n this.events[eventName] = collection;\n }\n if (options.isFirst) {\n collection.highPriority.set(listener, true);\n } else {\n collection.regular.set(listener, true);\n }\n if (process.env.NODE_ENV !== 'production') {\n const collectionSize = collection.highPriority.size + collection.regular.size;\n if (collectionSize > this.maxListeners && !this.warnOnce) {\n this.warnOnce = true;\n console.warn([`Possible EventEmitter memory leak detected. ${collectionSize} ${eventName} listeners added.`].join('\\n'));\n }\n }\n }\n removeListener(eventName, listener) {\n if (this.events[eventName]) {\n this.events[eventName].regular.delete(listener);\n this.events[eventName].highPriority.delete(listener);\n }\n }\n removeAllListeners() {\n this.events = {};\n }\n emit(eventName, ...args) {\n const collection = this.events[eventName];\n if (!collection) {\n return;\n }\n const highPriorityListeners = Array.from(collection.highPriority.keys());\n const regularListeners = Array.from(collection.regular.keys());\n for (let i = highPriorityListeners.length - 1; i >= 0; i -= 1) {\n const listener = highPriorityListeners[i];\n if (collection.highPriority.has(listener)) {\n listener.apply(this, args);\n }\n }\n for (let i = 0; i < regularListeners.length; i += 1) {\n const listener = regularListeners[i];\n if (collection.regular.has(listener)) {\n listener.apply(this, args);\n }\n }\n }\n once(eventName, listener) {\n // eslint-disable-next-line consistent-this\n const that = this;\n this.on(eventName, function oneTimeListener(...args) {\n that.removeListener(eventName, oneTimeListener);\n listener.apply(that, args);\n });\n }\n}","import * as React from 'react';\nimport { Store } from '../../utils/Store';\nimport { useGridApiMethod } from '../utils/useGridApiMethod';\nimport { GridSignature } from '../utils/useGridApiEventHandler';\nimport { EventManager } from '../../utils/EventManager';\nconst SYMBOL_API_PRIVATE = Symbol('mui.api_private');\nconst isSyntheticEvent = event => {\n return event.isPropagationStopped !== undefined;\n};\nexport function unwrapPrivateAPI(publicApi) {\n return publicApi[SYMBOL_API_PRIVATE];\n}\nlet globalId = 0;\nfunction createPrivateAPI(publicApiRef) {\n var _publicApiRef$current;\n const existingPrivateApi = (_publicApiRef$current = publicApiRef.current) == null ? void 0 : _publicApiRef$current[SYMBOL_API_PRIVATE];\n if (existingPrivateApi) {\n return existingPrivateApi;\n }\n const state = {};\n const privateApi = {\n state,\n store: Store.create(state),\n instanceId: {\n id: globalId\n }\n };\n globalId += 1;\n privateApi.getPublicApi = () => publicApiRef.current;\n privateApi.register = (visibility, methods) => {\n Object.keys(methods).forEach(methodName => {\n const method = methods[methodName];\n const currentPrivateMethod = privateApi[methodName];\n if ((currentPrivateMethod == null ? void 0 : currentPrivateMethod.spying) === true) {\n currentPrivateMethod.target = method;\n } else {\n privateApi[methodName] = method;\n }\n if (visibility === 'public') {\n const publicApi = publicApiRef.current;\n const currentPublicMethod = publicApi[methodName];\n if ((currentPublicMethod == null ? void 0 : currentPublicMethod.spying) === true) {\n currentPublicMethod.target = method;\n } else {\n publicApi[methodName] = method;\n }\n }\n });\n };\n privateApi.register('private', {\n caches: {},\n eventManager: new EventManager()\n });\n return privateApi;\n}\nfunction createPublicAPI(privateApiRef) {\n const publicApi = {\n get state() {\n return privateApiRef.current.state;\n },\n get store() {\n return privateApiRef.current.store;\n },\n get instanceId() {\n return privateApiRef.current.instanceId;\n },\n [SYMBOL_API_PRIVATE]: privateApiRef.current\n };\n return publicApi;\n}\nexport function useGridApiInitialization(inputApiRef, props) {\n const publicApiRef = React.useRef();\n const privateApiRef = React.useRef();\n if (!privateApiRef.current) {\n privateApiRef.current = createPrivateAPI(publicApiRef);\n }\n if (!publicApiRef.current) {\n publicApiRef.current = createPublicAPI(privateApiRef);\n }\n const publishEvent = React.useCallback((...args) => {\n const [name, params, event = {}] = args;\n event.defaultMuiPrevented = false;\n if (isSyntheticEvent(event) && event.isPropagationStopped()) {\n return;\n }\n const details = props.signature === GridSignature.DataGridPro ? {\n api: privateApiRef.current.getPublicApi()\n } : {};\n privateApiRef.current.eventManager.emit(name, params, event, details);\n }, [privateApiRef, props.signature]);\n const subscribeEvent = React.useCallback((event, handler, options) => {\n privateApiRef.current.eventManager.on(event, handler, options);\n const api = privateApiRef.current;\n return () => {\n api.eventManager.removeListener(event, handler);\n };\n }, [privateApiRef]);\n useGridApiMethod(privateApiRef, {\n subscribeEvent,\n publishEvent\n }, 'public');\n React.useImperativeHandle(inputApiRef, () => publicApiRef.current, [publicApiRef]);\n React.useEffect(() => {\n const api = privateApiRef.current;\n return () => {\n api.publishEvent('unmount');\n };\n }, [privateApiRef]);\n return privateApiRef;\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { GridSignature } from '../utils/useGridApiEventHandler';\nimport { useGridApiMethod } from '../utils';\nimport { isFunction } from '../../utils/utils';\nexport const useGridStateInitialization = (apiRef, props) => {\n const controlStateMapRef = React.useRef({});\n const [, rawForceUpdate] = React.useState();\n const registerControlState = React.useCallback(controlStateItem => {\n controlStateMapRef.current[controlStateItem.stateId] = controlStateItem;\n }, []);\n const setState = React.useCallback((state, reason) => {\n let newState;\n if (isFunction(state)) {\n newState = state(apiRef.current.state);\n } else {\n newState = state;\n }\n if (apiRef.current.state === newState) {\n return false;\n }\n let ignoreSetState = false;\n\n // Apply the control state constraints\n const updatedControlStateIds = [];\n Object.keys(controlStateMapRef.current).forEach(stateId => {\n const controlState = controlStateMapRef.current[stateId];\n const oldSubState = controlState.stateSelector(apiRef.current.state, apiRef.current.instanceId);\n const newSubState = controlState.stateSelector(newState, apiRef.current.instanceId);\n if (newSubState === oldSubState) {\n return;\n }\n updatedControlStateIds.push({\n stateId: controlState.stateId,\n hasPropChanged: newSubState !== controlState.propModel\n });\n\n // The state is controlled, the prop should always win\n if (controlState.propModel !== undefined && newSubState !== controlState.propModel) {\n ignoreSetState = true;\n }\n });\n if (updatedControlStateIds.length > 1) {\n // Each hook modify its own state, and it should not leak\n // Events are here to forward to other hooks and apply changes.\n // You are trying to update several states in a no isolated way.\n throw new Error(`You're not allowed to update several sub-state in one transaction. You already updated ${updatedControlStateIds[0].stateId}, therefore, you're not allowed to update ${updatedControlStateIds.map(el => el.stateId).join(', ')} in the same transaction.`);\n }\n if (!ignoreSetState) {\n // We always assign it as we mutate rows for perf reason.\n apiRef.current.state = newState;\n if (apiRef.current.publishEvent) {\n apiRef.current.publishEvent('stateChange', newState);\n }\n apiRef.current.store.update(newState);\n }\n if (updatedControlStateIds.length === 1) {\n const {\n stateId,\n hasPropChanged\n } = updatedControlStateIds[0];\n const controlState = controlStateMapRef.current[stateId];\n const model = controlState.stateSelector(newState, apiRef.current.instanceId);\n if (controlState.propOnChange && hasPropChanged) {\n const details = props.signature === GridSignature.DataGridPro ? {\n api: apiRef.current,\n reason\n } : {\n reason\n };\n controlState.propOnChange(model, details);\n }\n if (!ignoreSetState) {\n apiRef.current.publishEvent(controlState.changeEvent, model, {\n reason\n });\n }\n }\n return !ignoreSetState;\n }, [apiRef, props.signature]);\n const updateControlState = React.useCallback((key, state, reason) => {\n return apiRef.current.setState(previousState => {\n return _extends({}, previousState, {\n [key]: state(previousState[key])\n });\n }, reason);\n }, [apiRef]);\n const forceUpdate = React.useCallback(() => rawForceUpdate(() => apiRef.current.state), [apiRef]);\n const publicStateApi = {\n setState,\n forceUpdate\n };\n const privateStateApi = {\n updateControlState,\n registerControlState\n };\n useGridApiMethod(apiRef, publicStateApi, 'public');\n useGridApiMethod(apiRef, privateStateApi, 'private');\n};","import { useGridLoggerFactory } from './useGridLoggerFactory';\nimport { useGridApiInitialization } from './useGridApiInitialization';\nimport { useGridLocaleText } from './useGridLocaleText';\nimport { useGridPipeProcessing } from './pipeProcessing';\nimport { useGridStrategyProcessing } from './strategyProcessing';\nimport { useGridStateInitialization } from './useGridStateInitialization';\n\n/**\n * Initialize the technical pieces of the DataGrid (logger, state, ...) that any DataGrid implementation needs\n */\nexport const useGridInitialization = (inputApiRef, props) => {\n const privateApiRef = useGridApiInitialization(inputApiRef, props);\n useGridLoggerFactory(privateApiRef, props);\n useGridStateInitialization(privateApiRef, props);\n useGridPipeProcessing(privateApiRef);\n useGridStrategyProcessing(privateApiRef);\n useGridLocaleText(privateApiRef, props);\n privateApiRef.current.register('private', {\n rootProps: props\n });\n return privateApiRef;\n};","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _toPropertyKey from \"@babel/runtime/helpers/esm/toPropertyKey\";\nimport * as React from 'react';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\n/**\n * Implement the Pipeline Pattern\n *\n * More information and detailed example in (TODO add link to technical doc when ready)\n *\n * Some plugins contains custom logic to enrich data provided by other plugins or components.\n * For instance, the row grouping plugin needs to add / remove the grouping columns when the grid columns are updated.\n *\n * =====================================================================================================================\n *\n * The plugin containing the custom logic must use:\n *\n * - `useGridRegisterPipeProcessor` to register their processor.\n *\n * - `apiRef.current.requestPipeProcessorsApplication` to imperatively re-apply a group.\n * This method should be used in last resort.\n * Most of the time, the application should be triggered by an update on the deps of the processor.\n *\n * =====================================================================================================================\n *\n * The plugin or component that needs to enrich its data must use:\n *\n * - `apiRef.current.unstable_applyPipeProcessors` to run in chain all the processors of a given group.\n *\n * - `useGridRegisterPipeApplier` to re-apply the whole pipe when requested.\n * The applier will be called when:\n * * a processor is registered.\n * * `apiRef.current.requestPipeProcessorsApplication` is called for the given group.\n */\nexport const useGridPipeProcessing = apiRef => {\n const processorsCache = React.useRef({});\n const isRunning = React.useRef(false);\n const runAppliers = React.useCallback(groupCache => {\n if (isRunning.current || !groupCache) {\n return;\n }\n isRunning.current = true;\n Object.values(groupCache.appliers).forEach(callback => {\n callback();\n });\n isRunning.current = false;\n }, []);\n const registerPipeProcessor = React.useCallback((group, id, processor) => {\n if (!processorsCache.current[group]) {\n processorsCache.current[group] = {\n processors: new Map(),\n appliers: {}\n };\n }\n const groupCache = processorsCache.current[group];\n const oldProcessor = groupCache.processors.get(id);\n if (oldProcessor !== processor) {\n groupCache.processors.set(id, processor);\n runAppliers(groupCache);\n }\n return () => {\n processorsCache.current[group].processors.set(id, null);\n };\n }, [runAppliers]);\n const registerPipeApplier = React.useCallback((group, id, applier) => {\n if (!processorsCache.current[group]) {\n processorsCache.current[group] = {\n processors: new Map(),\n appliers: {}\n };\n }\n processorsCache.current[group].appliers[id] = applier;\n return () => {\n const _appliers = processorsCache.current[group].appliers,\n otherAppliers = _objectWithoutPropertiesLoose(_appliers, [id].map(_toPropertyKey));\n processorsCache.current[group].appliers = otherAppliers;\n };\n }, []);\n const requestPipeProcessorsApplication = React.useCallback(group => {\n const groupCache = processorsCache.current[group];\n runAppliers(groupCache);\n }, [runAppliers]);\n const applyPipeProcessors = React.useCallback((...args) => {\n const [group, value, context] = args;\n if (!processorsCache.current[group]) {\n return value;\n }\n const preProcessors = Array.from(processorsCache.current[group].processors.values());\n return preProcessors.reduce((acc, preProcessor) => {\n if (!preProcessor) {\n return acc;\n }\n return preProcessor(acc, context);\n }, value);\n }, []);\n const preProcessingPrivateApi = {\n registerPipeProcessor,\n registerPipeApplier,\n requestPipeProcessorsApplication\n };\n const preProcessingPublicApi = {\n unstable_applyPipeProcessors: applyPipeProcessors\n };\n useGridApiMethod(apiRef, preProcessingPrivateApi, 'private');\n useGridApiMethod(apiRef, preProcessingPublicApi, 'public');\n};","import * as React from 'react';\nexport const useGridLocaleText = (apiRef, props) => {\n const getLocaleText = React.useCallback(key => {\n if (props.localeText[key] == null) {\n throw new Error(`Missing translation for key ${key}.`);\n }\n return props.localeText[key];\n }, [props.localeText]);\n apiRef.current.register('public', {\n getLocaleText\n });\n};","import * as React from 'react';\nimport { useGridApiOptionHandler, useGridNativeEventListener } from '../../utils';\nimport { gridFocusCellSelector } from '../focus/gridFocusStateSelector';\nimport { serializeCellValue } from '../export/serializers/csvSerializer';\nfunction writeToClipboardPolyfill(data) {\n const span = document.createElement('span');\n span.style.whiteSpace = 'pre';\n span.style.userSelect = 'all';\n span.style.opacity = '0px';\n span.textContent = data;\n document.body.appendChild(span);\n const range = document.createRange();\n range.selectNode(span);\n const selection = window.getSelection();\n selection.removeAllRanges();\n selection.addRange(range);\n try {\n document.execCommand('copy');\n } finally {\n document.body.removeChild(span);\n }\n}\nfunction copyToClipboard(data) {\n if (navigator.clipboard) {\n navigator.clipboard.writeText(data).catch(() => {\n writeToClipboardPolyfill(data);\n });\n } else {\n writeToClipboardPolyfill(data);\n }\n}\nfunction hasNativeSelection(element) {\n var _window$getSelection;\n // When getSelection is called on an \n \n );\n};\n","\n import API from \"!../../../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\";\n import domAPI from \"!../../../../../node_modules/style-loader/dist/runtime/styleDomAPI.js\";\n import insertFn from \"!../../../../../node_modules/style-loader/dist/runtime/insertBySelector.js\";\n import setAttributes from \"!../../../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\";\n import insertStyleElement from \"!../../../../../node_modules/style-loader/dist/runtime/insertStyleElement.js\";\n import styleTagTransformFn from \"!../../../../../node_modules/style-loader/dist/runtime/styleTagTransform.js\";\n import content, * as namedExport from \"!!../../../../../node_modules/css-loader/dist/cjs.js!./DisableMobiles.css\";\n \n \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\n\n options.insert = insertFn.bind(null, \"head\");\n \noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../../../node_modules/css-loader/dist/cjs.js!./DisableMobiles.css\";\n export default content && content.locals ? content.locals : undefined;\n","import { useState, useEffect } from \"react\";\n\nconst useWindowDimensions = () => {\n const [useWindowDimensions, setWindowDimensions] = useState(getWindowDimensions());\n\n useEffect(() => {\n function handleResize() {\n setWindowDimensions(getWindowDimensions());\n }\n window.addEventListener(\"resize\", handleResize);\n return () => window.removeEventListener(\"resize\", handleResize);\n }, []);\n\n return useWindowDimensions;\n};\n\nfunction getWindowDimensions() {\n const { innerWidth: width, innerHeight: height } = window;\n return {\n width,\n height,\n };\n}\n\nexport default useWindowDimensions;\n","import { MirageTheme } from \"@mirage/theme/MuiMirage.module\";\nimport { createTheme } from \"@mui/material/styles\";\nimport { alpha } from \"@mui/material/styles\";\nimport type {} from \"@mirage/MuiThemeDeclaration\";\nimport type {} from \"@mui/x-data-grid/themeAugmentation\";\nimport type {} from \"@mui/x-date-pickers/themeAugmentation\";\n\nconst PublicPortalColors = {\n publicPortalPrimary: \"#0357a6\",\n publicPortalPrimaryHover: alpha(\"#0357a6\", 0.8),\n publicPortalSmallHover: alpha(\"#04569f\", 0.8),\n publicPortalSecondaryFocus: alpha(\"#0357a6\", 0.4),\n publicPortalCard: \"#f7f7f7\",\n publicPortalGrey: \"#636363\",\n publicPortalSuccess: \"#146A6A\",\n publicPortalError: \"#E74C3C\",\n publicPortalErrorLight: \"#f44336\",\n};\n\nconst PublicPortalTheme = createTheme(MirageTheme, {\n palette: {\n primary: {\n main: PublicPortalColors.publicPortalPrimary,\n },\n secondary: {\n main: \"#000\",\n },\n success: {\n main: PublicPortalColors.publicPortalSuccess,\n },\n error: {\n main: PublicPortalColors.publicPortalError,\n light: PublicPortalColors.publicPortalErrorLight,\n },\n grey: {\n \"50\": \"#fafafa\",\n \"100\": \"#f5f5f5f5\",\n \"200\": \"#eeeeee\",\n \"300\": \"#e0e0e0\",\n \"400\": \"#bdbdbd\",\n \"500\": \"#9e9e9e\",\n \"600\": \"#757575\",\n \"700\": \"#616161\",\n \"800\": \"#424242\",\n \"900\": \"#212121\",\n A100: \"#f5f5f5\",\n A200: \"#eeeeee\",\n A400: \"#bdbdbd\",\n A700: \"#616161\",\n },\n },\n typography: {\n cardContent: {\n fontSize: \"0.8rem\",\n lineHeight: \"1.2rem\",\n },\n },\n components: {\n MuiButton: {\n styleOverrides: {\n root: {\n borderRadius: 1000,\n },\n },\n },\n MuiContainer: {\n styleOverrides: {\n maxWidthXl: {\n maxWidth: \"90% !important\",\n },\n },\n },\n MuiTypography: {\n defaultProps: {\n variantMapping: {\n cardContent: \"p\",\n },\n },\n styleOverrides: {\n button: {\n color: PublicPortalColors.publicPortalPrimary,\n textTransform: \"none\",\n \":hover\": {\n color: PublicPortalColors.publicPortalPrimaryHover,\n textDecoration: \"underline\",\n cursor: \"pointer\",\n },\n },\n },\n },\n MuiCardHeader: {\n styleOverrides: {\n title: {\n fontSize: \"1rem\",\n },\n subheader: {\n fontSize: \"0.8rem\",\n lineHeight: \"1rem\",\n },\n },\n },\n MuiTab: {\n styleOverrides: {\n root: {\n \"&.Mui-selected\": {\n color: PublicPortalColors.publicPortalPrimary,\n },\n textTransform: \"none\",\n color: PublicPortalColors.publicPortalGrey,\n fontSize: \"1.5rem\",\n },\n },\n },\n MuiTabs: {\n styleOverrides: {\n flexContainer: {\n justifyContent: \"space-evenly\",\n },\n },\n },\n MuiDataGrid: {\n styleOverrides: {\n cellContent: {\n display: \"-webkit-box\",\n \"-webkit-line-clamp\": \"3\",\n \"-webkit-box-orient\": \"vertical\",\n },\n },\n },\n },\n icons: {\n sizeS: { width: \"16px\", height: \"16px\" },\n sizeM: { width: \"24px\", height: \"24px\" },\n sizeL: { width: \"42px\", height: \"42px\" },\n },\n entityTable: {\n publicOnly: true,\n },\n});\n\nexport { PublicPortalTheme };\n","import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';\nimport generateUtilityClass from '../generateUtilityClass';\nexport function getAppBarUtilityClass(slot) {\n return generateUtilityClass('MuiAppBar', slot);\n}\nconst appBarClasses = generateUtilityClasses('MuiAppBar', ['root', 'positionFixed', 'positionAbsolute', 'positionSticky', 'positionStatic', 'positionRelative', 'colorDefault', 'colorPrimary', 'colorSecondary', 'colorInherit', 'colorTransparent']);\nexport default appBarClasses;","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"className\", \"color\", \"enableColorOnDark\", \"position\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/base';\nimport styled from '../styles/styled';\nimport useThemeProps from '../styles/useThemeProps';\nimport capitalize from '../utils/capitalize';\nimport Paper from '../Paper';\nimport { getAppBarUtilityClass } from './appBarClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n color,\n position,\n classes\n } = ownerState;\n const slots = {\n root: ['root', `color${capitalize(color)}`, `position${capitalize(position)}`]\n };\n return composeClasses(slots, getAppBarUtilityClass, classes);\n};\n\n// var2 is the fallback.\n// Ex. var1: 'var(--a)', var2: 'var(--b)'; return: 'var(--a, var(--b))'\nconst joinVars = (var1, var2) => var1 ? `${var1 == null ? void 0 : var1.replace(')', '')}, ${var2})` : var2;\nconst AppBarRoot = styled(Paper, {\n name: 'MuiAppBar',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, styles[`position${capitalize(ownerState.position)}`], styles[`color${capitalize(ownerState.color)}`]];\n }\n})(({\n theme,\n ownerState\n}) => {\n const backgroundColorDefault = theme.palette.mode === 'light' ? theme.palette.grey[100] : theme.palette.grey[900];\n return _extends({\n display: 'flex',\n flexDirection: 'column',\n width: '100%',\n boxSizing: 'border-box',\n // Prevent padding issue with the Modal and fixed positioned AppBar.\n flexShrink: 0\n }, ownerState.position === 'fixed' && {\n position: 'fixed',\n zIndex: (theme.vars || theme).zIndex.appBar,\n top: 0,\n left: 'auto',\n right: 0,\n '@media print': {\n // Prevent the app bar to be visible on each printed page.\n position: 'absolute'\n }\n }, ownerState.position === 'absolute' && {\n position: 'absolute',\n zIndex: (theme.vars || theme).zIndex.appBar,\n top: 0,\n left: 'auto',\n right: 0\n }, ownerState.position === 'sticky' && {\n // ⚠️ sticky is not supported by IE11.\n position: 'sticky',\n zIndex: (theme.vars || theme).zIndex.appBar,\n top: 0,\n left: 'auto',\n right: 0\n }, ownerState.position === 'static' && {\n position: 'static'\n }, ownerState.position === 'relative' && {\n position: 'relative'\n }, !theme.vars && _extends({}, ownerState.color === 'default' && {\n backgroundColor: backgroundColorDefault,\n color: theme.palette.getContrastText(backgroundColorDefault)\n }, ownerState.color && ownerState.color !== 'default' && ownerState.color !== 'inherit' && ownerState.color !== 'transparent' && {\n backgroundColor: theme.palette[ownerState.color].main,\n color: theme.palette[ownerState.color].contrastText\n }, ownerState.color === 'inherit' && {\n color: 'inherit'\n }, theme.palette.mode === 'dark' && !ownerState.enableColorOnDark && {\n backgroundColor: null,\n color: null\n }, ownerState.color === 'transparent' && _extends({\n backgroundColor: 'transparent',\n color: 'inherit'\n }, theme.palette.mode === 'dark' && {\n backgroundImage: 'none'\n })), theme.vars && _extends({}, ownerState.color === 'default' && {\n '--AppBar-background': ownerState.enableColorOnDark ? theme.vars.palette.AppBar.defaultBg : joinVars(theme.vars.palette.AppBar.darkBg, theme.vars.palette.AppBar.defaultBg),\n '--AppBar-color': ownerState.enableColorOnDark ? theme.vars.palette.text.primary : joinVars(theme.vars.palette.AppBar.darkColor, theme.vars.palette.text.primary)\n }, ownerState.color && !ownerState.color.match(/^(default|inherit|transparent)$/) && {\n '--AppBar-background': ownerState.enableColorOnDark ? theme.vars.palette[ownerState.color].main : joinVars(theme.vars.palette.AppBar.darkBg, theme.vars.palette[ownerState.color].main),\n '--AppBar-color': ownerState.enableColorOnDark ? theme.vars.palette[ownerState.color].contrastText : joinVars(theme.vars.palette.AppBar.darkColor, theme.vars.palette[ownerState.color].contrastText)\n }, {\n backgroundColor: 'var(--AppBar-background)',\n color: ownerState.color === 'inherit' ? 'inherit' : 'var(--AppBar-color)'\n }, ownerState.color === 'transparent' && {\n backgroundImage: 'none',\n backgroundColor: 'transparent',\n color: 'inherit'\n }));\n});\nconst AppBar = /*#__PURE__*/React.forwardRef(function AppBar(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiAppBar'\n });\n const {\n className,\n color = 'primary',\n enableColorOnDark = false,\n position = 'fixed'\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const ownerState = _extends({}, props, {\n color,\n position,\n enableColorOnDark\n });\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(AppBarRoot, _extends({\n square: true,\n component: \"header\",\n ownerState: ownerState,\n elevation: 4,\n className: clsx(classes.root, className, position === 'fixed' && 'mui-fixed'),\n ref: ref\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? AppBar.propTypes /* remove-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 * The content of the component.\n */\n children: PropTypes.node,\n /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n /**\n * @ignore\n */\n className: PropTypes.string,\n /**\n * The color of the component.\n * It supports both default and custom theme colors, which can be added as shown in the\n * [palette customization guide](https://mui.com/material-ui/customization/palette/#adding-new-colors).\n * @default 'primary'\n */\n color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['default', 'inherit', 'primary', 'secondary', 'transparent']), PropTypes.string]),\n /**\n * If true, the `color` prop is applied in dark mode.\n * @default false\n */\n enableColorOnDark: PropTypes.bool,\n /**\n * The positioning type. The behavior of the different options is described\n * [in the MDN web docs](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Positioning).\n * Note: `sticky` is not universally supported and will fall back to `static` when unavailable.\n * @default 'fixed'\n */\n position: PropTypes.oneOf(['absolute', 'fixed', 'relative', 'static', 'sticky']),\n /**\n * The system prop that allows defining system overrides as well as additional CSS styles.\n */\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])\n} : void 0;\nexport default AppBar;","\n import API from \"!../../../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\";\n import domAPI from \"!../../../../../node_modules/style-loader/dist/runtime/styleDomAPI.js\";\n import insertFn from \"!../../../../../node_modules/style-loader/dist/runtime/insertBySelector.js\";\n import setAttributes from \"!../../../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\";\n import insertStyleElement from \"!../../../../../node_modules/style-loader/dist/runtime/insertStyleElement.js\";\n import styleTagTransformFn from \"!../../../../../node_modules/style-loader/dist/runtime/styleTagTransform.js\";\n import content, * as namedExport from \"!!../../../../../node_modules/css-loader/dist/cjs.js!./GradientBackground.css\";\n \n \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\n\n options.insert = insertFn.bind(null, \"head\");\n \noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../../../node_modules/css-loader/dist/cjs.js!./GradientBackground.css\";\n export default content && content.locals ? content.locals : undefined;\n","import { memo } from \"react\";\nimport \"./GradientBackground.css\";\nimport useSessionStorage from \"@mirage/hooks/useSessionStorage\";\n\nconst GradientBackground = memo(() => {\n const [sessionStorage] = useSessionStorage(\"publicportal\");\n const gradientLeftColor = sessionStorage?.clientSettings?.GRADIENT_LEFT_COLOR || \"#0357a6\";\n const gradientRightColor = sessionStorage?.clientSettings?.GRADIENT_RIGHT_COLOR || \"#188484\";\n const background = `linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), linear-gradient(89.92deg, ${gradientLeftColor} 0.08%, ${gradientRightColor} 86.41%, ${gradientRightColor} 99.93%)`;\n return (\n \n );\n});\n\nexport default GradientBackground;\n","import AppBar from \"@mui/material/AppBar\";\nimport GradientBackground from \"../gradientBackground/GradientBackground\";\n\nconst BigLogo = () => {\n return (\n <>\n \n \n {\" \"}\n \n \n \n );\n};\n\nexport default BigLogo;\n","\n import API from \"!../../../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\";\n import domAPI from \"!../../../../../node_modules/style-loader/dist/runtime/styleDomAPI.js\";\n import insertFn from \"!../../../../../node_modules/style-loader/dist/runtime/insertBySelector.js\";\n import setAttributes from \"!../../../../../node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js\";\n import insertStyleElement from \"!../../../../../node_modules/style-loader/dist/runtime/insertStyleElement.js\";\n import styleTagTransformFn from \"!../../../../../node_modules/style-loader/dist/runtime/styleTagTransform.js\";\n import content, * as namedExport from \"!!../../../../../node_modules/css-loader/dist/cjs.js!./Board.css\";\n \n \n\nvar options = {};\n\noptions.styleTagTransform = styleTagTransformFn;\noptions.setAttributes = setAttributes;\n\n options.insert = insertFn.bind(null, \"head\");\n \noptions.domAPI = domAPI;\noptions.insertStyleElement = insertStyleElement;\n\nvar update = API(content, options);\n\n\n\nexport * from \"!!../../../../../node_modules/css-loader/dist/cjs.js!./Board.css\";\n export default content && content.locals ? content.locals : undefined;\n","import Skeleton from \"@mui/material/Skeleton\";\nimport \"./Board.css\";\nimport { memo } from \"react\";\nimport useSessionStorage from \"@mirage/hooks/useSessionStorage\";\n\ninterface BoardProps extends React.DetailedHTMLProps, HTMLDivElement> {\n children: React.ReactNode | React.ReactNode[];\n headerText?: string | React.ReactNode;\n loadingHeaderText?: boolean;\n size: \"small\" | \"big\";\n}\n\nconst Board = memo((props: BoardProps): JSX.Element => {\n const { headerText, size, loadingHeaderText, className, ...other } = props;\n const customClass = className || \"\";\n const [sessionStorage] = useSessionStorage(\"publicportal\");\n const gradientLeftColor = sessionStorage?.clientSettings?.GRADIENT_LEFT_COLOR || \"#0357a6\";\n const gradientRightColor = sessionStorage?.clientSettings?.GRADIENT_RIGHT_COLOR || \"#188484\";\n const background = `linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), linear-gradient(89.92deg, ${gradientLeftColor} 0.08%, ${gradientRightColor} 86.41%, ${gradientRightColor} 99.93%)`;\n const boardClass = `board ${size}-board ${customClass}`.trim();\n const boardHeaderBackground = size === \"small\" ? background : undefined;\n\n function getHeaderText() {\n if (loadingHeaderText) {\n return \n {headerText || loadingHeaderText ? (\n \n ) : (\n \"\"\n )}\n {props.children}\n \n );\n});\n\nexport default Board;\nexport type { BoardProps };\n","import \"./DisableMobiles.css\";\nimport useWindowDimensions from \"@mirage/hooks/useWindowDimensions\";\nimport { Box, Typography } from \"@mui/material\";\nimport { PublicPortalTheme } from \"@publicPortal/theme/MuiPublicPortal.module\";\nimport React from \"react\";\nimport { Outlet } from \"react-router-dom\";\nimport BigLogo from \"../bigLogo/BigLogo\";\nimport Board from \"../board/Board\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { faDoNotEnter } from \"@fortawesome/pro-solid-svg-icons\";\n\nconst DisableMobiles = () => {\n const { width } = useWindowDimensions();\n if (width < PublicPortalTheme.breakpoints.values.md) {\n return (\n <>\n \n \n We are sorry, but Public Portal is not yet accessible on phone devices, please use the desktop version instead. \n \n \n \n );\n }\n return = ({ redirectTo }) => {\n const { loggedIn, checkingStatus } = useAuthStatus();\n if (checkingStatus) {\n return (\n \n \n );\n }\n return loggedIn ? {props.button} ;\n};\n\nexport default MobileBottomAppBar;\n","import { BaseApiService } from \"@mirage/services/BaseApiService\";\nimport { UserStore } from \"@mirage/store/UserStore\";\nimport { IUser } from \"@shared/mirage/core/contracts/IUser\";\nimport {\n ChangePasswordRequest,\n ChangePasswordResult,\n CheckEmailExistsRequest,\n CheckEmailExistsResult,\n CheckPasswordLengthRequest,\n CheckPasswordLengthResult,\n ForgotPasswordRequest,\n ForgotPasswordResult,\n LoginRequest,\n LoginResult,\n SetNewPasswordRequest,\n SetNewPasswordResult,\n SignUpRequest,\n SignUpResult,\n UpdateUserDataRequest,\n UpdateUserDataResult,\n ValidateForgottenPasswordTokenRequest,\n ValidateForgottenPasswordTokenResult,\n VerifyEmailResult,\n VerifyRequest,\n} from \"@shared/mirage/core/contracts/User\";\nimport dayjs from \"dayjs\";\nimport { IUserService } from \"@shared/mirage/services/IUserService\";\nexport class UserService extends BaseApiService implements IUserService {\n static _lastCheckTime: Date | null = null;\n static _lastResult = false;\n static SetLastAuthCheckResult(result: boolean): void {\n UserService._lastCheckTime = new Date();\n UserService._lastResult = result;\n }\n\n constructor() {\n super(\"publicportal/users\");\n }\n async logout() {\n await this.httpInstance().post(\"/logout\");\n localStorage.removeItem(\"users.user\");\n UserService.SetLastAuthCheckResult(false);\n }\n async checkAuth(): Promise {\n if (UserService._lastCheckTime === null) {\n const result = (await this.httpInstance().get(\"/checkAuth\")).status === 200;\n UserService.SetLastAuthCheckResult(result);\n } else {\n const now = new Date();\n const diffInMinutes = dayjs(now).diff(UserService._lastCheckTime, \"minutes\");\n if (diffInMinutes > 3) {\n const result = (await this.httpInstance().get(\"/checkAuth\")).status === 200;\n UserService.SetLastAuthCheckResult(result);\n }\n }\n return UserService._lastResult;\n }\n async register(signUpRequest: SignUpRequest): Promise {\n const response = await this.httpInstance().post(\"/register\", signUpRequest);\n return response.data;\n }\n async login(loginRequest: LoginRequest): Promise {\n const response = await this.httpInstance().post(\"/login\", loginRequest);\n const result = response.data as LoginResult;\n if (result.userId) {\n localStorage.setItem(\n \"users.user\",\n JSON.stringify({\n id: result.userId,\n first_name: result.userName,\n last_name: result.userLastName,\n custom_properties: result.userCustomProperties,\n expiryDate: result.expiryDate,\n } as UserStore)\n );\n UserService.SetLastAuthCheckResult(true);\n }\n return result;\n }\n async verifyEmail(verifyEmailRequest: VerifyRequest): Promise {\n const response = await this.httpInstance().post(\"/verifyemail\", verifyEmailRequest);\n return response.data;\n }\n async checkEmailExists(checkEmailExistsRequest: CheckEmailExistsRequest): Promise {\n const response = await this.httpInstance().post(\"/checkEmailExists\", checkEmailExistsRequest);\n return response.data;\n }\n async checkPasswordLength(checkPasswordLengthRequest: CheckPasswordLengthRequest): Promise {\n const response = await this.httpInstance().post(\"/checkPasswordLength\", checkPasswordLengthRequest);\n return response.data;\n }\n async getUserById(): Promise {\n const user = UserService.getLoggedInUser();\n const response = await this.httpInstance().get(`/${user.id}`);\n return response.data;\n }\n async updateUserById(updateUserRequest: Omit): Promise {\n const user = UserService.getLoggedInUser();\n const response = await this.httpInstance().post(`/${user.id}`, updateUserRequest);\n return response.data;\n }\n async changePassword(changePasswordRequest: Omit): Promise {\n const response = await this.httpInstance().post(\"/changePassword\", changePasswordRequest);\n return response.data;\n }\n async forgotPassword(forgotPasswordRequest: ForgotPasswordRequest): Promise {\n const response = await this.httpInstance().post(`/forgotPassword`, forgotPasswordRequest);\n return response.data;\n }\n\n async validateForgottenPasswordToken(validateForgottenPasswordTokenRequest: ValidateForgottenPasswordTokenRequest): Promise {\n const response = await this.httpInstance().post(`/validateForgottenPasswordToken`, validateForgottenPasswordTokenRequest);\n return response.data;\n }\n\n async setNewPassword(setNewPasswordRequest: Omit): Promise