\n {t(\"REJECT\")}\n \n );\n case recommendationStatusEnum.APPROVE:\n return (\n <>\n \n {t(\"ELIGIBLE\")}\n \n );\n default:\n return {t(\"ACTIVE_LOANS.CHECK_MANUALLY\")};\n }\n }\n };\n\n const getFlagForStatus = status => {\n switch (status) {\n case checkFlagEnum.FAILURE:\n return {t(\"FAIL\")};\n case checkFlagEnum.SUCCESS:\n return {t(\"PASS\")};\n default:\n return {t(\"ACTIVE_LOANS.CHECK_MANUALLY\")};\n }\n };\n\n return (\n <>\n {evaluatedRule?.conditions.map(item => {\n return (\n \n {item?.conditionName}\n {getFlagForStatus(item.status)}\n \n );\n })}\n\n \n {t(\"ACTIVE_LOANS.LOAN_RECOMMENDATION\")}\n {getRecommendationStatus()}\n \n\n \n \n {ltvRecommendations && (\n <>\n \n {t(\"ACTIVE_LOANS.LTV_RECOMMENDATION\")}\n \n {ltvRecommendations.map(item => (\n \n {item.lender.toLowerCase()}\n \n {item.ltvPercentage !== null\n ? `${item.ltvPercentage}%`\n : t(\"ACTIVE_LOANS.NOT_ELIGIBLE\")}\n \n
\n ))}\n {//to show the ltv not sent from backend as undefined\n ltvList.map(item => {\n if (ltvRecommendations.find(\n e => e.lender === item) === undefined\n ) {\n return (\n \n {item.toLowerCase()}\n {t(\"ACTIVE_LOANS.NOT_ELIGIBLE\")}\n
\n );\n }\n return \"\";\n })}\n \n )}\n \n );\n}\n\nexport default CreditRecommendation;\n","import styled from \"@emotion/styled\";\n\nconst GoldenUnderline = styled.div`\n font-size: 0.875rem;\n line-height: 1.71;\n letter-spacing: 0.1px;\n\n color: #ce9f29;\n\n text-decoration: underline;\n\n margin: 0.75rem 0;\n\n cursor: pointer;\n`;\n\nexport const GoldenText = styled.span`\n color: #ce9f29;\n margin: 0.75rem 0;\n font-weight: 600;\n`;\nexport default GoldenUnderline;\n","import React from \"react\";\nimport {\n Autocomplete,\n AutocompleteProps,\n FilterOptionsState,\n TextField,\n TextFieldProps,\n capitalize,\n} from \"@mui/material\";\n\ntype Optional = Pick, K> & Omit;\n\nexport interface IGAutocompleteMultipleOption {\n name: string\n}\n\nexport interface IGAutocompleteMultipleProps<\n T extends IGAutocompleteMultipleOption\n>\n extends Optional, \"renderInput\" | \"options\"> {\n label: string\n value: AutocompleteProps[\"value\"]\n onChange: AutocompleteProps[\"onChange\"]\n options: AutocompleteProps[\"options\"]\n error?: TextFieldProps[\"error\"]\n helperText?: TextFieldProps[\"helperText\"]\n touched?: boolean | undefined,\n textFieldProps?: TextFieldProps,\n required?: boolean\n renderInput?: AutocompleteProps[\"renderInput\"]\n}\n\n/**\n * IGAutocompleteMultiple component which uses mui 5 Autocomplete as base\n * @param id\n * @param value\n * @param onChange\n * @param getOptionLabel\n * @param renderInput\n * @param label\n * @param options\n * @param disableClearable\n * @param size\n * @param error\n * @param touched\n * @param helperText\n * @param required\n * @param filterSelectedOptions\n * @param filterOptions\n * @param textFieldProps\n * @param props\n * @constructor\n */\nfunction IGAutocompleteMultiple<\n T extends IGAutocompleteMultipleOption = IGAutocompleteMultipleOption\n>({\n id,\n value,\n onChange,\n getOptionLabel,\n renderInput,\n label,\n options = [],\n disableClearable = false,\n size = \"small\",\n error = false,\n touched = undefined,\n helperText = \"\",\n required = false,\n filterSelectedOptions = true,\n filterOptions,\n textFieldProps = {\n variant: \"outlined\",\n },\n ...props\n}: IGAutocompleteMultipleProps) {\n\n const handleFilterOptions = (\n options: T[],\n state: FilterOptionsState,\n ): T[] => {\n // return if value is null or undefined\n if (!(value)) return options;\n\n // if type is generic then it must have text key, and we are filtering based on that\n const filteredOptions = options.filter(o => {\n const optionFound = value.find(\n i => i.name === o.name,\n );\n if (optionFound) return false;\n if (state.inputValue.length > 0) {\n return o.name\n .toLowerCase()\n .includes(state.inputValue.toLowerCase());\n }\n return true;\n });\n\n // if filterOptions is passed then call the function\n if (filterOptions) return filterOptions(filteredOptions, state);\n return filteredOptions;\n };\n\n const formattedText = (text: string) => {\n return capitalize(text.replaceAll(\"_\", \" \").toLowerCase());\n };\n\n return (\n \n multiple={true}\n disableClearable={disableClearable}\n filterSelectedOptions={filterSelectedOptions}\n filterOptions={handleFilterOptions}\n size={size}\n id={id || label}\n options={options}\n getOptionLabel={(option) => {\n if (getOptionLabel) {\n return getOptionLabel(option);\n }\n return typeof option === \"string\"\n ? formattedText(String(option))\n : formattedText(option.name);\n }}\n value={value}\n onChange={onChange}\n {...props}\n renderInput={params => (\n \n )}\n />\n );\n};\n\nexport default IGAutocompleteMultiple;","import createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M22 3.41 16.71 8.7 20 12h-8V4l3.29 3.29L20.59 2 22 3.41zM3.41 22l5.29-5.29L12 20v-8H4l3.29 3.29L2 20.59 3.41 22z\"\n}), 'CloseFullscreen');","import React, {FC, MouseEventHandler} from \"react\";\nimport {\n Box,\n ButtonProps,\n Dialog,\n DialogActions,\n DialogContent,\n DialogTitle,\n IconButton,\n Slide,\n Typography,\n TypographyProps,\n} from \"@mui/material\";\nimport {CloseFullscreen, CloseRounded} from \"@mui/icons-material\";\nimport IGButton from \"../Button/IGButton\";\n// eslint-disable-next-line no-restricted-imports\nimport {TransitionProps} from \"@mui/material/transitions\";\n\nconst DialogTitleStyle = {\n display: \"flex\",\n justifyContent: \"space-between\",\n alignItems: \"flex-start\",\n};\n\nconst Transition = React.forwardRef(function Transition(\n props: TransitionProps & {\n children: React.ReactElement;\n },\n ref: React.Ref,\n) {\n return (\n \n );\n});\n\ninterface IGDialogActionProps extends ButtonProps {\n text?: string;\n loading?: boolean;\n}\n\nexport interface IGDialogProps {\n open: boolean;\n onClose: () => void;\n onConfirm?: MouseEventHandler;\n onCancel?: MouseEventHandler;\n maxWidth?: \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\" | false;\n fullWidth?: boolean;\n title?: string;\n subtitle?: string;\n confirmProps?: IGDialogActionProps;\n cancelProps?: IGDialogActionProps;\n hideFooter?: boolean;\n headerIcon?: React.ReactNode | null;\n fullScreen?: boolean;\n titleProps?: TypographyProps;\n titleActions?: Array;\n isMinimizeIcon?: boolean;\n}\n\n/**\n * General Dialog component which uses mui 5 Dialog as Base.\n * @param open\n * @param onClose\n * @param maxWidth\n * @param fullWidth\n * @param title\n * @param subtitle\n * @param onConfirm\n * @param onCancel\n * @param confirmProps\n * @param cancelProps\n * @param hideFooter\n * @param children\n * @constructor\n */\nconst IGDialog: FC = ({\n open = false,\n onClose,\n maxWidth = \"xs\",\n fullWidth = true,\n title = \"\",\n subtitle = \"\",\n onConfirm,\n onCancel,\n headerIcon = null,\n confirmProps = {},\n cancelProps = {},\n hideFooter = false,\n children,\n fullScreen = false,\n titleProps = {},\n titleActions=[],\n isMinimizeIcon,\n}) => {\n const {\n text: confirmText,\n loading: confirmLoading,\n disabled: confirmDisabled,\n } = confirmProps;\n\n const {\n text: cancelText,\n loading: cancelLoading,\n disabled: cancelDisabled,\n } = cancelProps;\n\n return (\n \n {title ? (\n \n \n {headerIcon && (\n \n {headerIcon}\n \n )}\n\n \n \n \n {title}\n \n \n {subtitle && (\n \n {subtitle}\n \n )}\n \n \n \n {\n titleActions?.length > 0 && (\n titleActions.map((Action) => (\n <>\n {Action}\n \n ))\n )\n }\n \n {isMinimizeIcon ?\n <>\n \n MINIMIZE\n \n \n \n : }\n \n \n \n ) : (\n \n \n \n )}\n {children}\n {!hideFooter && (\n \n \n {cancelText || \"Cancel\"}\n \n \n {confirmText || \"Confirm\"}\n \n \n )}\n \n );\n};\n\nexport default IGDialog;\n","import createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M4 6H2v14c0 1.1.9 2 2 2h14v-2H4V6zm16-4H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-8 12.5v-9l6 4.5-6 4.5z\"\n}), 'VideoLibrary');","import styled from \"@emotion/styled\";\nimport {Button, Grid} from \"@mui/material\";\n\n// ------> CSS Props Interfaces <------\ninterface StepWrapperProps {\n highLight: boolean;\n}\n\ninterface StyledThumbnailProps {\n thumbHeight?: string | number\n thumbWidth?: string | number\n}\n\n// ------> CSS <------\n\n\nconst StyledThumbnail = styled(\"img\")`\n height: ${({thumbHeight}) => thumbHeight ? thumbHeight : \"5rem\"};\n width: ${({thumbWidth}) => thumbWidth ? thumbWidth : \"5rem\"};\n border-radius: 11px;\n margin-right: 0.25rem;\n`;\n\nconst NoteContainer = styled(Grid)`\n background: white;\n min-height: 60%;\n max-height: 90%;\n overflow-x: hidden;\n width: 100%;\n overflow-y: auto;\n position: relative;\n z-index: inherit;\n`;\n\nconst StepsContainer = styled.div`\n display: flex;\n justify-content: space-evenly;\n margin-top: 10px;\n margin-bottom: 10px;\n`;\n\nconst StepWrapper = styled(Button)`\n cusror: ${({highLight}) => highLight ? \"disabled\" : \"pointer\"};\n color: ${({highLight}) => highLight && \"grey\"};\n`;\n\n\nexport {\n NoteContainer,\n StepsContainer,\n StepWrapper,\n StyledThumbnail,\n};\n","import React, {useState} from \"react\";\nimport {Box, Grid} from \"@mui/material\";\nimport {\n PictureAsPdfOutlined,\n SkipNext,\n SkipPrevious,\n} from \"@mui/icons-material\";\nimport ImageComponent from \"../Image\";\nimport IGModal from \"../Modal/IGModal\";\nimport {StepWrapper, StepsContainer, NoteContainer} from \"./styled\";\nimport IGButton from \"../Button/IGButton\";\n\ninterface DocViewModalProps {\n open: boolean;\n onClose: () => void;\n imageList: {images: string[], fileType: string};\n imageTitles?: string[];\n title?: string;\n CustomBottom?: () => JSX.Element;\n imageTitle?: string;\n style?: React.StyleHTMLAttributes;\n comparisonImage?: string;\n comparisonImageTitle?: string;\n download?: boolean;\n}\n\nconst DocViewModal: React.FC = ({\n open,\n title = \"\",\n CustomBottom,\n onClose,\n imageTitle = \"\",\n imageTitles = [],\n imageList: imageListWithFileType,\n comparisonImage = \"\",\n comparisonImageTitle = \"\",\n download = false,\n}) => {\n const [count, setCount] = useState(0);\n const {innerHeight} = window;\n const imageHeight = innerHeight * (CustomBottom ? 0.45 : 0.65);\n const imageList = imageListWithFileType.images;\n const isPdf = imageListWithFileType?.fileType?.includes(\"pdf\") || imageList[count]?.includes(\".pdf\");\n\n const onClickHandlePrev = () => {\n if (count > 0) {\n setCount((count) => count - 1);\n }\n };\n const onClickHandleNext = () => {\n if (count < imageList.length - 1) {\n setCount((count) => count + 1);\n }\n };\n\n return (\n <>\n \n \n \n {isPdf ? (\n \n ) : (\n \n )}\n {imageList.length > 1 ? (\n \n }\n >\n Prev\n \n }\n >\n Next\n \n \n ) : (\n <>\n )}\n \n {comparisonImage && (\n \n \n \n )}\n \n {CustomBottom ? : <>}\n \n \n {(download || isPdf) && (\n {\n const link = document.createElement(\"a\");\n link.href = imageList[count];\n link.download = \"image.jpg\";\n link.target = \"_blank\";\n document.body.appendChild(link);\n link.click();\n }}\n >\n Download\n \n )}\n \n \n \n \n );\n};\n\nexport default DocViewModal;\n","import React, {useEffect, useMemo, useState} from \"react\";\nimport {PictureAsPdfOutlined, VideoCameraFront, VideoLibrary} from \"@mui/icons-material\";\nimport DocViewModal from \"./DocViewModal\";\nimport {StyledThumbnail} from \"./styled\";\n\nexport interface IGDocumentInterface {\n documentType: string;\n fileUrl: string;\n fileTitle?: string;\n backFileUrl?: string;\n backFileTitle?: string;\n fileType?: string;\n crDocumentImageResponseDtoList?: {fileUrl: string; imageTitle?: string}[];\n}\n\ninterface IGDocumentViewerProps {\n document: IGDocumentInterface;\n open?: boolean;\n onClose?: () => void;\n thumbHeight?: string | number;\n thumbWidth?: string | number;\n download?: boolean;\n}\n\nconst IGDocumentViewer: React.FC = ({\n document,\n open = false,\n onClose = () => {},\n thumbHeight = \"5rem\",\n thumbWidth = \"5rem\",\n download = false,\n}) => {\n const [openDocView, setOpenDocView] = useState(false);\n\n const imagesWithFileType = useMemo(() => {\n const images = [document.fileUrl];\n\n if (document.backFileUrl) {\n images.push(document.backFileUrl);\n }\n\n document.crDocumentImageResponseDtoList &&\n document.crDocumentImageResponseDtoList.forEach((image) => {\n images.push(image.fileUrl);\n });\n return {\n images,\n fileType:\n document.fileType?.toLowerCase() ||\n (document.fileUrl?.includes(\".pdf\") ? \"application/pdf\" : \"image\"),\n };\n }, [document]);\n\n const imageTitles = useMemo(() => {\n const titles = [];\n if (document.fileTitle) {\n titles.push(document.fileTitle);\n }\n if (document.backFileTitle) {\n titles.push(document.backFileTitle);\n }\n document.crDocumentImageResponseDtoList &&\n document.crDocumentImageResponseDtoList.forEach((image) => {\n titles.push(image.imageTitle);\n });\n return titles;\n }, [document]);\n\n const openVideoInNewTab = () => {\n window.open(document.fileUrl, \"_blank\");\n };\n\n useEffect(() => {\n setOpenDocView(open);\n }, [open]);\n\n const thumbnail = imagesWithFileType.images[0];\n const isPdf = imagesWithFileType.fileType?.includes(\"pdf\");\n const isVideo = imagesWithFileType.fileType?.includes(\"video\");\n\n return (\n <>\n <>\n {/* hiding thumbail in case of force open*/}\n {thumbnail && !open && (\n <>\n {isPdf ? (\n setOpenDocView(true)}\n />\n ) : isVideo ? (\n openVideoInNewTab()}\n />\n ) : (\n setOpenDocView(true)}\n />\n )}\n \n )}\n \n\n {\n setOpenDocView(false);\n onClose && onClose();\n }}\n imageList={imagesWithFileType}\n imageTitles={imageTitles}\n title={document?.documentType.replaceAll(\"_\", \" \")}\n download={download}\n />\n \n );\n};\n\nexport default IGDocumentViewer;\n","import styled from \"@emotion/styled\";\nimport {Box} from \"@mui/material\";\n\nexport const IGDrawerContentWrapper = styled(Box)`\n position: relative;\n\n .cls-btn {\n position: absolute;\n top: 10px;\n right: 10px;\n }\n`;\n\nexport const IGDrawerTitle = styled(Box)`\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n align-items: flex-start;\n padding: 1rem;\n`;\n\nexport const IGDrawerContent = styled(Box)`\n //height: calc(100vh - 134px);\n //overflow: auto;\n`;","import React, {FC} from \"react\";\nimport {Box, Divider, Drawer, DrawerProps, IconButton, Typography} from \"@mui/material\";\nimport {IGDrawerContentWrapper, IGDrawerTitle, IGDrawerContent} from \"./style\";\nimport {CloseRounded} from \"@mui/icons-material\";\n\ninterface IGDrawerProps extends Omit {\n open: boolean\n onClose: () => void\n anchor?: \"left\" | \"top\" | \"right\" | \"bottom\"\n title?: string | (() => React.ReactNode)\n subTitle?: string\n}\n\n/**\n * General Drawer component\n * @param open\n * @param onClose\n * @param title\n * @param subTitle\n * @param anchor\n * @param children\n * @param rest\n * @constructor\n */\nconst IGDrawer: FC = ({\n open = false,\n onClose,\n title = () => null,\n subTitle,\n anchor = \"right\",\n children,\n ...rest\n}) => {\n\n return (\n \n \n \n \n \n {typeof title === \"string\" ? (\n <>\n \n \n {title}\n \n {subTitle && (\n \n {subTitle}\n \n )}\n \n \n \n ) : title()}\n \n {children}\n \n \n \n );\n};\n\nexport default IGDrawer;","import React, {FC} from \"react\";\nimport {Grid, Typography} from \"@mui/material\";\n\ninterface IGKeyValueProps {\n label: string;\n value?: string | number;\n labelProps?: React.ComponentProps;\n valueProps?: React.ComponentProps;\n labelContainerProps?: React.ComponentProps;\n valueContainerProps?: React.ComponentProps;\n}\nconst IGKeyValue: FC = ({\n label,\n value,\n labelProps,\n valueProps,\n labelContainerProps,\n valueContainerProps,\n}) => {\n return (\n \n \n \n {label}\n \n \n \n \n {value ?? \"-\"}\n \n \n \n );\n};\n\nexport default IGKeyValue;\n","import React, {ReactNode} from \"react\";\nimport {\n CircularProgress,\n FormControl,\n FormHelperText, IconButton,\n InputLabel,\n MenuItem,\n Select,\n SelectProps,\n} from \"@mui/material\";\nimport {SelectInputProps} from \"@mui/material/Select/SelectInput\";\nimport {CloseRounded} from \"@mui/icons-material\";\n\nexport type IGValueType = string | ReadonlyArray | number | undefined;\n\nexport interface IGSelectOptionInterface {\n text: string | ReactNode\n value: T\n disabled?: boolean\n hidden?: boolean\n}\n\nexport interface IGSelectProps extends SelectProps {\n name: string\n value: T\n onChange: SelectInputProps[\"onChange\"],\n options: IGSelectOptionInterface[]\n helperText?: ReactNode\n touched?: boolean\n multiple?: boolean\n clearable?: boolean\n loading?: boolean\n}\n\nfunction IGSelect({\n label,\n id,\n name,\n required,\n value,\n onChange,\n error,\n sx,\n clearable = false,\n options = [],\n touched = false,\n helperText = \"\",\n variant = \"outlined\",\n size = \"small\",\n fullWidth = true,\n loading = false,\n placeholder = \"\",\n ...props\n}: IGSelectProps) {\n\n const onCloseButtonClick = (e: any) => {\n e.preventDefault();\n e.stopPropagation();\n const event = new PointerEvent(\"click\");\n if (onChange && e.target) {\n onChange(\n {\n ...event,\n target: {\n ...e.target,\n value: \"\" as T,\n name: name,\n },\n isDefaultPrevented(): boolean {\n return false;\n },\n isPropagationStopped(): boolean {\n return false;\n },\n nativeEvent: undefined,\n persist(): void {},\n },\n <>,\n );\n }\n };\n\n return (\n \n {label}\n \n \n \n )\n }\n startAdornment={loading && }\n sx={{\n \"& .MuiSelect-select .notranslate::after\": placeholder\n ? {\n content: `\"${placeholder}\"`,\n opacity: 0.42,\n }\n : {},\n \"& legend\": {display: label ? \"block\" : \"none\"},\n \"& fieldset\": {top: label ? -5 : 0},\n }}\n {...props}\n >\n {options.length > 0 ? (\n options.map((option, index) => (\n \n {option.text}\n \n ))\n ) : (\n \n No Options\n \n )}\n \n {touched && {helperText}}\n \n );\n};\n\nexport default IGSelect;","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 [{\n [`&.${gridClasses.autoHeight}`]: styles.autoHeight\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 }, // TODO v6: Remove\n {\n [`& .${gridClasses['cell--withRenderer']}`]: styles['cell--withRenderer']\n }, {\n [`& .${gridClasses.cell}`]: styles.cell\n }, {\n [`& .${gridClasses.cellContent}`]: styles.cellContent\n }, {\n [`& .${gridClasses.cellCheckbox}`]: styles.cellCheckbox\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}`]: styles.columnHeader\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.withBorder}`]: styles.withBorder\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 = theme.palette.mode === 'light' ? lighten(alpha(theme.palette.divider, 1), 0.88) : darken(alpha(theme.palette.divider, 1), 0.68);\n\n const gridStyle = _extends({\n flex: 1,\n boxSizing: 'border-box',\n position: 'relative',\n border: `1px solid ${borderColor}`,\n borderRadius: theme.shape.borderRadius,\n color: theme.palette.text.primary\n }, theme.typography.body2, {\n outline: 'none',\n height: '100%',\n display: 'flex',\n flexDirection: 'column',\n [`&.${gridClasses.autoHeight}`]: {\n height: 'auto',\n [`& .${gridClasses['row--lastVisible']} .${gridClasses.cell}`]: {\n borderBottomColor: 'transparent'\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 ${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.columnHeader}:not(.${gridClasses['columnHeader--sorted']}):hover .${gridClasses.sortIcon}`]: {\n opacity: 0.5\n },\n [`& .${gridClasses.columnHeaderTitleContainer}`]: {\n display: 'flex',\n alignItems: 'center',\n minWidth: 0,\n flex: 1,\n whiteSpace: 'nowrap',\n overflowX: 'hidden'\n },\n [`& .${gridClasses.columnHeaderTitleContainerContent}`]: {\n overflow: 'hidden',\n display: 'flex',\n alignItems: 'center'\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.palette.action.hover\n },\n [`& .${gridClasses.columnSeparator}`]: {\n position: 'absolute',\n zIndex: 100,\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'center',\n color: borderColor\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.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.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.columnHeader}:hover`]: {\n [`& .${gridClasses.iconButtonContainer}`]: {\n visibility: 'visible',\n width: 'auto'\n },\n [`& .${gridClasses.menuIcon}`]: {\n width: 'auto',\n visibility: 'visible'\n }\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.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: alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity),\n '&:hover, &.Mui-hovered': {\n backgroundColor: 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: 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 ${borderColor}`\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--editing']}`]: {\n padding: 1,\n display: 'flex',\n boxShadow: theme.shadows[2],\n backgroundColor: theme.palette.background.paper,\n '&:focus-within': {\n outline: `solid ${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.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.palette.text.secondary\n },\n [`& .${gridClasses.booleanCell}[data-value=\"false\"]`]: {\n color: 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.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.withBorder}`]: {\n borderRight: `1px solid ${borderColor}`\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 },\n [`& .${gridClasses.rowReorderCellPlaceholder}`]: {\n display: 'none'\n },\n [`& .${gridClasses['columnHeader--dragging']}, & .${gridClasses['row--dragging']}`]: {\n background: theme.palette.background.paper,\n padding: '0 12px',\n borderRadius: theme.shape.borderRadius,\n opacity: theme.palette.action.disabledOpacity\n },\n [`& .${gridClasses['row--dragging']}`]: {\n background: theme.palette.background.paper,\n padding: '0 12px',\n borderRadius: theme.shape.borderRadius,\n opacity: 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\n return gridStyle;\n});","export const buildWarning = (message, gravity = 'warning') => {\n let alreadyWarned = false;\n const cleanMessage = Array.isArray(message) ? message.join('\\n') : message;\n return () => {\n if (!alreadyWarned) {\n alreadyWarned = true;\n\n if (gravity === 'error') {\n console.error(cleanMessage);\n } else {\n console.warn(cleanMessage);\n }\n }\n };\n};\nexport const wrapWithWarningOnCall = (method, message) => {\n if (process.env.NODE_ENV === 'production') {\n return method;\n }\n\n const warning = buildWarning(message);\n return (...args) => {\n warning();\n return method(...args);\n };\n};","import { createSelector as reselectCreateSelector } from 'reselect';\nimport { buildWarning } from './warning';\nconst cacheContainer = {\n cache: null\n};\nconst missingInstanceIdWarning = buildWarning(['MUI: A selector was called without passing the instance ID, which may impact the performance of the grid.', 'To fix, call it with `apiRef`, e.g. `mySelector(apiRef)`, or pass the instance ID explicitly, e.g `mySelector(state, apiRef.current.instanceId)`.']);\nexport const createSelector = (...args) => {\n if (cacheContainer.cache === null) {\n cacheContainer.cache = {};\n }\n\n const selector = (...selectorArgs) => {\n const [stateOrApiRef, instanceId] = selectorArgs;\n const isApiRef = !!stateOrApiRef.current;\n const cacheKey = isApiRef ? stateOrApiRef.current.instanceId : instanceId != null ? instanceId : 'default';\n const state = isApiRef ? stateOrApiRef.current.state : stateOrApiRef;\n\n if (process.env.NODE_ENV !== 'production') {\n if (cacheKey === 'default') {\n missingInstanceIdWarning();\n }\n }\n\n if (cacheContainer.cache === null) {\n cacheContainer.cache = {};\n }\n\n const {\n cache\n } = cacheContainer;\n\n if (cache[cacheKey] && cache[cacheKey].get(args)) {\n // We pass the cache key because the called selector might have as\n // dependency another selector created with this `createSelector`.\n return cache[cacheKey].get(args)(state, cacheKey);\n }\n\n const newSelector = reselectCreateSelector(...args);\n\n if (!cache[cacheKey]) {\n cache[cacheKey] = new Map();\n }\n\n cache[cacheKey].set(args, newSelector);\n return newSelector(state, cacheKey);\n }; // We use this property to detect if the selector was created with createSelector\n // or it's only a simple function the receives the state and returns part of it.\n\n\n selector.acceptsApiRef = true;\n return selector;\n}; // eslint-disable-next-line @typescript-eslint/naming-convention\n\nexport const unstable_resetCreateSelectorCache = () => {\n cacheContainer.cache = null;\n};","import { createSelector } from '../../../utils/createSelector';\nimport { wrapWithWarningOnCall } from '../../../utils/warning';\n/**\n * @category Columns\n * @deprecated Use the selector returning exactly the value you are looking for.\n * @ignore - do not document.\n * TODO v6: Rename `gridColumnsStateSelector`\n */\n\nexport const gridColumnsSelector = state => state.columns;\n/**\n * Get the field of each column.\n * @category Columns\n */\n\nexport const gridColumnFieldsSelector = createSelector(gridColumnsSelector, columnsState => columnsState.all);\n/**\n * Get the columns as a lookup (an object containing the field for keys and the definition for values).\n * @category Columns\n */\n\nexport const gridColumnLookupSelector = createSelector(gridColumnsSelector, columnsState => columnsState.lookup);\n/**\n * Get the columns as an array.\n * @category Columns\n */\n\nexport const gridColumnDefinitionsSelector = createSelector(gridColumnFieldsSelector, gridColumnLookupSelector, (allFields, lookup) => allFields.map(field => lookup[field]));\n/**\n * Get the column visibility model, containing the visibility status of each column.\n * If a column is not registered in the model, it is visible.\n * @category Visible Columns\n */\n\nexport const gridColumnVisibilityModelSelector = createSelector(gridColumnsSelector, columnsState => columnsState.columnVisibilityModel);\n/**\n * Get the visible columns as a lookup (an object containing the field for keys and the definition for values).\n * @category Visible Columns\n */\n\nexport const gridVisibleColumnDefinitionsSelector = createSelector(gridColumnDefinitionsSelector, gridColumnVisibilityModelSelector, (columns, columnVisibilityModel) => columns.filter(column => columnVisibilityModel[column.field] !== false));\n/**\n * Get the field of each visible column.\n * @category Visible Columns\n */\n\nexport const gridVisibleColumnFieldsSelector = createSelector(gridVisibleColumnDefinitionsSelector, visibleColumns => visibleColumns.map(column => column.field));\n/**\n * Get the left position in pixel of each visible columns relative to the left of the first column.\n * @category Visible Columns\n */\n\nexport const gridColumnPositionsSelector = createSelector(gridVisibleColumnDefinitionsSelector, visibleColumns => {\n const positions = [];\n let currentPosition = 0;\n\n for (let i = 0; i < visibleColumns.length; i += 1) {\n positions.push(currentPosition);\n currentPosition += visibleColumns[i].computedWidth;\n }\n\n return positions;\n});\n/**\n * Get the summed width of all the visible columns.\n * @category Visible Columns\n */\n\nexport const gridColumnsTotalWidthSelector = createSelector(gridVisibleColumnDefinitionsSelector, gridColumnPositionsSelector, (visibleColumns, positions) => {\n const colCount = visibleColumns.length;\n\n if (colCount === 0) {\n return 0;\n }\n\n return positions[colCount - 1] + visibleColumns[colCount - 1].computedWidth;\n});\n/**\n * Get the filterable columns as an array.\n * @category Columns\n */\n\nexport const gridFilterableColumnDefinitionsSelector = createSelector(gridColumnDefinitionsSelector, columns => columns.filter(col => col.filterable));\n/**\n * Get the filterable columns as a lookup (an object containing the field for keys and the definition for values).\n * @category Columns\n */\n\nexport const gridFilterableColumnLookupSelector = createSelector(gridColumnDefinitionsSelector, columns => columns.reduce((acc, col) => {\n if (col.filterable) {\n acc[col.field] = col;\n }\n\n return acc;\n}, {}));\n/**\n * @category Columns\n * @deprecated Use `gridColumnFieldsSelector` instead.\n * @ignore - do not document.\n */\n\nexport const allGridColumnsFieldsSelector = wrapWithWarningOnCall(gridColumnFieldsSelector, ['MUI: The method allGridColumnsFieldsSelector is deprecated and will be removed in the next major version.', 'Use gridColumnFieldsSelector instead']);\n/**\n * @category Columns\n * @deprecated Use `gridColumnDefinitionsSelector` instead.\n * @ignore - do not document.\n */\n\nexport const allGridColumnsSelector = wrapWithWarningOnCall(gridColumnDefinitionsSelector, ['MUI: The method allGridColumnsSelector is deprecated and will be removed in the next major version.', 'Use gridColumnDefinitionsSelector instead']);\n/**\n * @category Visible Columns\n * @deprecated Use `gridVisibleColumnDefinitionsSelector` instead.\n * @ignore - do not document.\n */\n\nexport const visibleGridColumnsSelector = wrapWithWarningOnCall(gridVisibleColumnDefinitionsSelector, ['MUI: The method visibleGridColumnsSelector is deprecated and will be removed in the next major version.', 'Use gridVisibleColumnDefinitionsSelector instead']);\n/**\n * @category Columns\n * @deprecated Use `gridFilterableColumnDefinitionsSelector` instead.\n * @ignore - do not document.\n */\n\nexport const filterableGridColumnsSelector = wrapWithWarningOnCall(gridFilterableColumnDefinitionsSelector, ['MUI: The method filterableGridColumnsSelector is deprecated and will be removed in the next major version.', 'Use gridFilterableColumnDefinitionsSelector instead']);\n/**\n * @category Columns\n * @deprecated Use `gridFilterableColumnLookupSelector` instead (not the same return format).\n * @ignore - do not document.\n */\n\nexport const filterableGridColumnsIdsSelector = wrapWithWarningOnCall(createSelector(gridFilterableColumnDefinitionsSelector, columns => columns.map(col => col.field)), ['MUI: The method filterableGridColumnsIdsSelector is deprecated and will be removed in the next major version.', 'Use gridFilterableColumnDefinitionsSelector instead.', 'The return format is now a lookup, if you want to get the same output as before, use the following code:', '', 'const lookup = gridFilterableColumnLookupSelector(apiRef);', 'const fields = gridColumnFieldsSelector(apiRef).filter(field => lookup[field]);']);\n/**\n * Get the amount of visible columns.\n * @category Visible Columns\n * @deprecated Use the length of the array returned by `gridVisibleColumnDefinitionsSelector` instead.\n * @ignore - do not document.\n */\n\nexport const visibleGridColumnsLengthSelector = wrapWithWarningOnCall(createSelector(gridVisibleColumnDefinitionsSelector, visibleColumns => visibleColumns.length), ['MUI: The method visibleGridColumnsLengthSelector is deprecated and will be removed in the next major version.', 'Use the length of the array returned by gridVisibleColumnDefinitionsSelector instead.']);\n/**\n * @category Visible Columns\n * @deprecated Use `gridColumnsTotalWidthSelector` or `gridColumnPositionsSelector` instead.\n * @ignore - do not document.\n */\n\nexport const gridColumnsMetaSelector = wrapWithWarningOnCall(createSelector(gridColumnPositionsSelector, gridColumnsTotalWidthSelector, (positions, totalWidth) => ({\n totalWidth,\n positions\n})), ['MUI: The method gridColumnsMetaSelector is deprecated and will be removed in the next major version.', 'Use gridColumnsTotalWidthSelector or gridColumnPositionsSelector instead']);","import { buildWarning } from '../../utils/warning';\n\nfunction isOutputSelector(selector) {\n return selector.acceptsApiRef;\n}\n\nconst stateNotInitializedWarning = buildWarning(['MUI: `useGridSelector` has been called before the initialization of the state.', 'This hook can only be used inside the context of the grid.']);\nexport const useGridSelector = (apiRef, selector) => {\n if (process.env.NODE_ENV !== 'production') {\n if (!apiRef.current.state) {\n stateNotInitializedWarning();\n }\n }\n\n if (isOutputSelector(selector)) {\n return selector(apiRef);\n }\n\n return selector(apiRef.current.state);\n};","import * as React from 'react';\nexport const GridApiContext = /*#__PURE__*/React.createContext(undefined);\n\nif (process.env.NODE_ENV !== 'production') {\n GridApiContext.displayName = 'GridApiContext';\n}","import * as React from 'react';\nimport { GridApiContext } from '../../components/GridApiContext';\nexport function useGridApiContext() {\n const apiRef = React.useContext(GridApiContext);\n\n if (apiRef === undefined) {\n throw new Error(['MUI: Could not find the data grid context.', 'It looks like you rendered your component outside of a DataGrid or DataGridPro parent component.', 'This can also happen if you are bundling multiple versions of the data grid.'].join('\\n'));\n }\n\n return apiRef;\n}","import * as React from 'react';\nconst GridRootPropsContext = /*#__PURE__*/React.createContext(undefined);\n\nif (process.env.NODE_ENV !== 'production') {\n GridRootPropsContext.displayName = 'GridRootPropsContext';\n}\n\nexport { GridRootPropsContext };","import * as React from 'react';\nimport { GridRootPropsContext } from '../../context/GridRootPropsContext';\nexport const useGridRootProps = () => {\n const contextValue = React.useContext(GridRootPropsContext);\n\n if (!contextValue) {\n throw new Error('MUI: useGridRootProps should only be used inside the DataGrid/DataGridPro component.');\n }\n\n return contextValue;\n};","import { createSelector } from '../../../utils/createSelector';\nexport const gridRowsStateSelector = state => state.rows;\nexport const gridRowCountSelector = createSelector(gridRowsStateSelector, rows => rows.totalRowCount);\nexport const gridRowsLoadingSelector = createSelector(gridRowsStateSelector, rows => rows.loading);\nexport const gridTopLevelRowCountSelector = createSelector(gridRowsStateSelector, rows => rows.totalTopLevelRowCount);\nexport const gridRowsLookupSelector = createSelector(gridRowsStateSelector, rows => rows.idRowsLookup);\nexport const gridRowsIdToIdLookupSelector = createSelector(gridRowsStateSelector, rows => rows.idToIdLookup);\nexport const gridRowTreeSelector = createSelector(gridRowsStateSelector, rows => rows.tree);\nexport const gridRowGroupingNameSelector = createSelector(gridRowsStateSelector, rows => rows.groupingName);\nexport const gridRowTreeDepthSelector = createSelector(gridRowsStateSelector, rows => rows.treeDepth);\nexport const gridRowIdsSelector = createSelector(gridRowsStateSelector, rows => rows.ids);","import { createSelector } from '../../../utils/createSelector';\nexport const gridDensitySelector = state => state.density;\nexport const gridDensityValueSelector = createSelector(gridDensitySelector, density => density.value);\nexport const gridDensityRowHeightSelector = createSelector(gridDensitySelector, density => density.rowHeight);\nexport const gridDensityHeaderHeightSelector = createSelector(gridDensitySelector, density => density.headerHeight);\nexport const gridDensityFactorSelector = createSelector(gridDensitySelector, density => density.factor);","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 { useForkRef, unstable_useEnhancedEffect as useEnhancedEffect, capitalize } from '@mui/material/utils';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { GridRootStyles } from './GridRootStyles';\nimport { gridVisibleColumnDefinitionsSelector } from '../../hooks/features/columns/gridColumnsSelector';\nimport { useGridSelector } from '../../hooks/utils/useGridSelector';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { gridRowCountSelector } from '../../hooks/features/rows/gridRowsSelector';\nimport { gridDensityValueSelector } from '../../hooks/features/density/densitySelector';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\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)}`]\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst GridRoot = /*#__PURE__*/React.forwardRef(function GridRoot(props, ref) {\n const rootProps = useGridRootProps();\n\n const {\n children,\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const apiRef = useGridApiContext();\n const visibleColumns = useGridSelector(apiRef, gridVisibleColumnDefinitionsSelector);\n const totalRowCount = useGridSelector(apiRef, gridRowCountSelector);\n const densityValue = useGridSelector(apiRef, gridDensityValueSelector);\n const rootContainerRef = React.useRef(null);\n const handleRef = useForkRef(rootContainerRef, ref);\n const ownerState = {\n density: densityValue,\n classes: rootProps.classes,\n autoHeight: rootProps.autoHeight\n };\n const classes = useUtilityClasses(ownerState);\n apiRef.current.rootElementRef = rootContainerRef; // Our implementation of \n\n const [mountedState, setMountedState] = React.useState(false);\n useEnhancedEffect(() => {\n setMountedState(true);\n }, []);\n useEnhancedEffect(() => {\n if (mountedState) {\n apiRef.current.unstable_updateGridDimensionsRef();\n }\n }, [apiRef, mountedState]);\n\n if (!mountedState) {\n return null;\n }\n\n return /*#__PURE__*/_jsx(GridRootStyles, _extends({\n ref: handleRef,\n className: clsx(className, classes.root),\n role: \"grid\",\n \"aria-colcount\": visibleColumns.length,\n \"aria-rowcount\": totalRowCount,\n \"aria-multiselectable\": !rootProps.disableMultipleSelection,\n \"aria-label\": rootProps['aria-label'],\n \"aria-labelledby\": rootProps['aria-labelledby']\n }, other, {\n children: children\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridRoot.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 /**\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 { GridRoot };","import * as React from 'react';\nexport function useGridLogger(apiRef, name) {\n const logger = React.useRef(null);\n\n if (logger.current) {\n return logger.current;\n }\n\n const newLogger = apiRef.current.getLogger(name);\n logger.current = newLogger;\n return newLogger;\n}","import * as React from 'react';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { styled } from '@mui/material/styles';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['main']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\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 function GridMainContainer(props) {\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(GridMainContainerRoot, {\n className: classes.root,\n children: props.children\n });\n}","import * as React from 'react';\nexport class ErrorBoundary extends React.Component {\n static getDerivedStateFromError(error) {\n // Update state so the next render will show the fallback UI.\n return {\n hasError: true,\n error\n };\n }\n\n componentDidCatch(error, errorInfo) {\n if (this.props.api.current) {\n this.logError(error); // Allows to trigger the Error event and all listener can run on Error\n\n this.props.api.current.showError({\n error,\n errorInfo\n });\n }\n }\n\n logError(error, errorInfo) {\n this.props.logger.error(`An unexpected error occurred. Error: ${error && error.message}. `, error, errorInfo);\n }\n\n render() {\n var _this$state;\n\n if (this.props.hasError || (_this$state = this.state) != null && _this$state.hasError) {\n // You can render any custom fallback UI\n return this.props.render(this.props.componentProps || this.state);\n }\n\n return this.props.children;\n }\n\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { useGridLogger } from '../../hooks/utils/useGridLogger';\nimport { GridMainContainer } from '../containers/GridMainContainer';\nimport { ErrorBoundary } from '../ErrorBoundary';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nfunction GridErrorHandler(props) {\n const {\n children\n } = props;\n const apiRef = useGridApiContext();\n const logger = useGridLogger(apiRef, 'GridErrorHandler');\n const rootProps = useGridRootProps();\n const error = apiRef.current.state.error;\n return /*#__PURE__*/_jsx(ErrorBoundary, {\n hasError: error != null,\n componentProps: error,\n api: apiRef,\n logger: logger,\n render: errorProps => {\n var _rootProps$components;\n\n return /*#__PURE__*/_jsx(GridMainContainer, {\n children: /*#__PURE__*/_jsx(rootProps.components.ErrorOverlay, _extends({}, errorProps, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.errorOverlay))\n });\n },\n children: children\n });\n}\n\nprocess.env.NODE_ENV !== \"production\" ? GridErrorHandler.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} : void 0;\nexport { GridErrorHandler };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport function GridHeaderPlaceholder() {\n var _rootProps$components;\n\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const headerRef = React.useRef(null);\n apiRef.current.headerRef = headerRef;\n return /*#__PURE__*/_jsx(\"div\", {\n ref: headerRef,\n children: /*#__PURE__*/_jsx(rootProps.components.Header, _extends({}, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.header))\n });\n}","/**\n * Detect Element Resize.\n * https://github.com/sdecima/javascript-detect-element-resize\n * Sebastian Decima\n *\n * Forked from version 0.5.3; includes the following modifications:\n * 1) Guard against unsafe 'window' and 'document' references (to support SSR).\n * 2) Defer initialization code via a top-level function wrapper (to support SSR).\n * 3) Avoid unnecessary reflows by not measuring size for scroll events bubbling from children.\n * 4) Add nonce for style element.\n *\n * TODO replace with https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver\n * once browser support allows it.\n **/\nexport default function createDetectElementResize(nonce, hostWindow) {\n var resetTriggers = function resetTriggers(element) {\n var triggers = element.__resizeTriggers__,\n expand = triggers.firstElementChild,\n contract = triggers.lastElementChild,\n expandChild = expand.firstElementChild;\n contract.scrollLeft = contract.scrollWidth;\n contract.scrollTop = contract.scrollHeight;\n expandChild.style.width = expand.offsetWidth + 1 + 'px';\n expandChild.style.height = expand.offsetHeight + 1 + 'px';\n expand.scrollLeft = expand.scrollWidth;\n expand.scrollTop = expand.scrollHeight;\n };\n\n var checkTriggers = function checkTriggers(element) {\n return element.offsetWidth != element.__resizeLast__.width || element.offsetHeight != element.__resizeLast__.height;\n };\n\n var scrollListener = function scrollListener(e) {\n // Don't measure (which forces) reflow for scrolls that happen inside of children!\n if (e.target.className.indexOf('contract-trigger') < 0 && e.target.className.indexOf('expand-trigger') < 0) {\n return;\n }\n\n var element = this;\n resetTriggers(this);\n\n if (this.__resizeRAF__) {\n hostWindow.cancelAnimationFrame(this.__resizeRAF__);\n }\n\n this.__resizeRAF__ = hostWindow.requestAnimationFrame(function () {\n if (checkTriggers(element)) {\n element.__resizeLast__.width = element.offsetWidth;\n element.__resizeLast__.height = element.offsetHeight;\n\n element.__resizeListeners__.forEach(function (fn) {\n fn.call(element, e);\n });\n }\n });\n };\n /* Detect CSS Animations support to detect element display/re-attach */\n\n\n var animation = false,\n keyframeprefix = '',\n animationstartevent = 'animationstart',\n domPrefixes = 'Webkit Moz O ms'.split(' '),\n startEvents = 'webkitAnimationStart animationstart oAnimationStart MSAnimationStart'.split(' '),\n pfx = '';\n {\n var elm = document.createElement('fakeelement');\n\n if (elm.style.animationName !== undefined) {\n animation = true;\n }\n\n if (animation === false) {\n for (var i = 0; i < domPrefixes.length; i++) {\n if (elm.style[domPrefixes[i] + 'AnimationName'] !== undefined) {\n pfx = domPrefixes[i];\n keyframeprefix = '-' + pfx.toLowerCase() + '-';\n animationstartevent = startEvents[i];\n animation = true;\n break;\n }\n }\n }\n }\n var animationName = 'resizeanim';\n var animationKeyframes = '@' + keyframeprefix + 'keyframes ' + animationName + ' { from { opacity: 0; } to { opacity: 0; } } ';\n var animationStyle = keyframeprefix + 'animation: 1ms ' + animationName + '; ';\n\n var createStyles = function createStyles(doc) {\n if (!doc.getElementById('muiDetectElementResize')) {\n //opacity:0 works around a chrome bug https://code.google.com/p/chromium/issues/detail?id=286360\n var css = (animationKeyframes ? animationKeyframes : '') + '.Mui-resizeTriggers { ' + (animationStyle ? animationStyle : '') + 'visibility: hidden; opacity: 0; } ' + '.Mui-resizeTriggers, .Mui-resizeTriggers > div, .contract-trigger:before { content: \" \"; display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; z-index: -1; } .Mui-resizeTriggers > div { background: #eee; overflow: auto; } .contract-trigger:before { width: 200%; height: 200%; }',\n head = doc.head || doc.getElementsByTagName('head')[0],\n style = doc.createElement('style');\n style.id = 'muiDetectElementResize';\n style.type = 'text/css';\n\n if (nonce != null) {\n style.setAttribute('nonce', nonce);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(doc.createTextNode(css));\n }\n\n head.appendChild(style);\n }\n };\n\n var addResizeListener = function addResizeListener(element, fn) {\n if (!element.__resizeTriggers__) {\n var doc = element.ownerDocument;\n var elementStyle = hostWindow.getComputedStyle(element);\n\n if (elementStyle && elementStyle.position == 'static') {\n element.style.position = 'relative';\n }\n\n createStyles(doc);\n element.__resizeLast__ = {};\n element.__resizeListeners__ = [];\n (element.__resizeTriggers__ = doc.createElement('div')).className = 'Mui-resizeTriggers';\n element.__resizeTriggers__.innerHTML = '' + '';\n element.appendChild(element.__resizeTriggers__);\n resetTriggers(element);\n element.addEventListener('scroll', scrollListener, true);\n /* Listen for a css animation to detect element display/re-attach */\n\n if (animationstartevent) {\n element.__resizeTriggers__.__animationListener__ = function animationListener(e) {\n if (e.animationName == animationName) {\n resetTriggers(element);\n }\n };\n\n element.__resizeTriggers__.addEventListener(animationstartevent, element.__resizeTriggers__.__animationListener__);\n }\n }\n\n element.__resizeListeners__.push(fn);\n };\n\n var removeResizeListener = function removeResizeListener(element, fn) {\n element.__resizeListeners__.splice(element.__resizeListeners__.indexOf(fn), 1);\n\n if (!element.__resizeListeners__.length) {\n element.removeEventListener('scroll', scrollListener, true);\n\n if (element.__resizeTriggers__.__animationListener__) {\n element.__resizeTriggers__.removeEventListener(animationstartevent, element.__resizeTriggers__.__animationListener__);\n\n element.__resizeTriggers__.__animationListener__ = null;\n }\n\n try {\n element.__resizeTriggers__ = !element.removeChild(element.__resizeTriggers__);\n } catch (e) {// Preact compat; see developit/preact-compat/issues/228\n }\n }\n };\n\n return {\n addResizeListener,\n removeResizeListener\n };\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"children\", \"defaultHeight\", \"defaultWidth\", \"disableHeight\", \"disableWidth\", \"nonce\", \"onResize\", \"style\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { useForkRef, ownerWindow, useEventCallback, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/material/utils';\nimport createDetectElementResize from '../lib/createDetectElementResize'; // TODO replace with https://caniuse.com/resizeobserver.\n\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst GridAutoSizer = /*#__PURE__*/React.forwardRef(function AutoSizer(props, ref) {\n const {\n children,\n defaultHeight = null,\n defaultWidth = null,\n disableHeight = false,\n disableWidth = false,\n nonce,\n onResize,\n style\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const [state, setState] = React.useState({\n height: defaultHeight,\n width: defaultWidth\n });\n const rootRef = React.useRef(null);\n const parentElement = React.useRef(null);\n const handleResize = useEventCallback(() => {\n // Guard against AutoSizer component being removed from the DOM immediately after being added.\n // This can result in invalid style values which can result in NaN values if we don't handle them.\n // See issue #150 for more context.\n if (parentElement.current) {\n const height = parentElement.current.offsetHeight || 0;\n const width = parentElement.current.offsetWidth || 0;\n const win = ownerWindow(parentElement.current);\n const computedStyle = win.getComputedStyle(parentElement.current);\n const paddingLeft = parseInt(computedStyle.paddingLeft, 10) || 0;\n const paddingRight = parseInt(computedStyle.paddingRight, 10) || 0;\n const paddingTop = parseInt(computedStyle.paddingTop, 10) || 0;\n const paddingBottom = parseInt(computedStyle.paddingBottom, 10) || 0;\n const newHeight = height - paddingTop - paddingBottom;\n const newWidth = width - paddingLeft - paddingRight;\n\n if (!disableHeight && state.height !== newHeight || !disableWidth && state.width !== newWidth) {\n setState({\n height: newHeight,\n width: newWidth\n });\n\n if (onResize) {\n onResize({\n height: newHeight,\n width: newWidth\n });\n }\n }\n }\n });\n useEnhancedEffect(() => {\n var _parentElement$curren;\n\n parentElement.current = rootRef.current.parentElement;\n\n if (!parentElement) {\n return undefined;\n }\n\n const win = ownerWindow((_parentElement$curren = parentElement.current) != null ? _parentElement$curren : undefined);\n const detectElementResize = createDetectElementResize(nonce, win);\n detectElementResize.addResizeListener(parentElement.current, handleResize);\n handleResize();\n return () => {\n detectElementResize.removeResizeListener(parentElement.current, handleResize);\n };\n }, [nonce, handleResize]); // Outer div should not force width/height since that may prevent containers from shrinking.\n // Inner component should overflow and use calculated width/height.\n // See issue #68 for more information.\n\n const outerStyle = {\n overflow: 'visible'\n };\n const childParams = {};\n\n if (!disableHeight) {\n outerStyle.height = 0;\n childParams.height = state.height;\n }\n\n if (!disableWidth) {\n outerStyle.width = 0;\n childParams.width = state.width;\n }\n\n const handleRef = useForkRef(rootRef, ref);\n return /*#__PURE__*/_jsx(\"div\", _extends({\n ref: handleRef,\n style: _extends({}, outerStyle, style)\n }, other, {\n children: state.height === null && state.width === null ? null : children(childParams)\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridAutoSizer.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 /**\n * Default height to use for initial render; useful for SSR.\n * @default null\n */\n defaultHeight: PropTypes.number,\n\n /**\n * Default width to use for initial render; useful for SSR.\n * @default null\n */\n defaultWidth: PropTypes.number,\n\n /**\n * If `true`, disable dynamic :height property.\n * @default false\n */\n disableHeight: PropTypes.bool,\n\n /**\n * If `true`, disable dynamic :width property.\n * @default false\n */\n disableWidth: PropTypes.bool,\n\n /**\n * Nonce of the inlined stylesheet for Content Security Policy.\n */\n nonce: PropTypes.string,\n\n /**\n * Callback to be invoked on-resize.\n * @param {AutoSizerSize} size The grid's size.\n */\n onResize: PropTypes.func\n} : void 0;\nexport { GridAutoSizer };","import { createSelector } from '../../../utils/createSelector';\nimport { gridRowsLookupSelector } from '../rows/gridRowsSelector';\n/**\n * @category Sorting\n * @ignore - do not document.\n */\n\nexport const gridSortingStateSelector = state => state.sorting;\n/**\n * Get the id of the rows after the sorting process.\n * @category Sorting\n */\n\nexport const gridSortedRowIdsSelector = createSelector(gridSortingStateSelector, sortingState => sortingState.sortedRows);\n/**\n * Get the id and the model of the rows after the sorting process.\n * @category Sorting\n */\n\nexport const gridSortedRowEntriesSelector = createSelector(gridSortedRowIdsSelector, gridRowsLookupSelector, (sortedIds, idRowsLookup) => sortedIds.map(id => ({\n id,\n model: idRowsLookup[id]\n})));\n/**\n * Get the current sorting model.\n * @category Sorting\n */\n\nexport const gridSortModelSelector = createSelector(gridSortingStateSelector, sorting => sorting.sortModel);\n\n/**\n * @category Sorting\n * @ignore - do not document.\n */\nexport const gridSortColumnLookupSelector = createSelector(gridSortModelSelector, sortModel => {\n const result = sortModel.reduce((res, sortItem, index) => {\n res[sortItem.field] = {\n sortDirection: sortItem.sort,\n sortIndex: sortModel.length > 1 ? index + 1 : undefined\n };\n return res;\n }, {});\n return result;\n});","import { createSelector } from '../../../utils/createSelector';\nimport { gridSortedRowEntriesSelector } from '../sorting/gridSortingSelector';\nimport { gridColumnLookupSelector } from '../columns/gridColumnsSelector';\nimport { gridRowTreeDepthSelector, gridRowTreeSelector } from '../rows/gridRowsSelector';\n/**\n * @category Filtering\n */\n\nexport const gridFilterStateSelector = state => state.filter;\n/**\n * Get the current filter model.\n * @category Filtering\n */\n\nexport const gridFilterModelSelector = createSelector(gridFilterStateSelector, filterState => filterState.filterModel);\n/**\n * Get the current quick filter values.\n * @category Filtering\n */\n\nexport const gridQuickFilterValuesSelector = createSelector(gridFilterModelSelector, filterModel => filterModel.quickFilterValues);\n/**\n * @category Filtering\n * @ignore - do not document.\n */\n\nexport const gridVisibleRowsLookupSelector = createSelector(gridFilterStateSelector, filterState => filterState.visibleRowsLookup);\n/**\n * @category Filtering\n * @ignore - do not document.\n */\n\nexport const gridFilteredRowsLookupSelector = createSelector(gridFilterStateSelector, filterState => filterState.filteredRowsLookup);\n/**\n * @category Filtering\n * @ignore - do not document.\n */\n\nexport const gridFilteredDescendantCountLookupSelector = createSelector(gridFilterStateSelector, filterState => filterState.filteredDescendantCountLookup);\n/**\n * Get the id and the model of the rows accessible after the filtering process.\n * Does not contain the collapsed children.\n * @category Filtering\n */\n\nexport const gridVisibleSortedRowEntriesSelector = createSelector(gridVisibleRowsLookupSelector, gridSortedRowEntriesSelector, (visibleRowsLookup, sortedRows) => sortedRows.filter(row => visibleRowsLookup[row.id] !== false));\n/**\n * Get the id of the rows accessible after the filtering process.\n * Does not contain the collapsed children.\n * @category Filtering\n */\n\nexport const gridVisibleSortedRowIdsSelector = createSelector(gridVisibleSortedRowEntriesSelector, visibleSortedRowEntries => visibleSortedRowEntries.map(row => row.id));\n/**\n * Get the id and the model of the rows accessible after the filtering process.\n * Contains the collapsed children.\n * @category Filtering\n */\n\nexport const gridFilteredSortedRowEntriesSelector = createSelector(gridFilteredRowsLookupSelector, gridSortedRowEntriesSelector, (filteredRowsLookup, sortedRows) => sortedRows.filter(row => filteredRowsLookup[row.id] !== false));\n/**\n * Get the id of the rows accessible after the filtering process.\n * Contains the collapsed children.\n * @category Filtering\n */\n\nexport const gridFilteredSortedRowIdsSelector = createSelector(gridFilteredSortedRowEntriesSelector, filteredSortedRowEntries => filteredSortedRowEntries.map(row => row.id));\n/**\n * @category Filtering\n * @deprecated Use `gridVisibleSortedRowIdsSelector` instead\n * @ignore - do not document.\n * TODO: Add deprecation warning once we have the new selectors without the \"visible\" keyword.\n */\n\nexport const gridVisibleRowsSelector = gridVisibleSortedRowIdsSelector;\n/**\n * Get the id and the model of the top level rows accessible after the filtering process.\n * @category Filtering\n */\n\nexport const gridVisibleSortedTopLevelRowEntriesSelector = createSelector(gridVisibleSortedRowEntriesSelector, gridRowTreeSelector, gridRowTreeDepthSelector, (visibleSortedRows, rowTree, rowTreeDepth) => {\n if (rowTreeDepth < 2) {\n return visibleSortedRows;\n }\n\n return visibleSortedRows.filter(row => {\n var _rowTree$row$id;\n\n return ((_rowTree$row$id = rowTree[row.id]) == null ? void 0 : _rowTree$row$id.depth) === 0;\n });\n});\n/**\n * Get the amount of rows accessible after the filtering process.\n * @category Filtering\n */\n\nexport const gridVisibleRowCountSelector = createSelector(gridVisibleSortedRowEntriesSelector, visibleSortedRows => visibleSortedRows.length);\n/**\n * Get the amount of top level rows accessible after the filtering process.\n * @category Filtering\n */\n\nexport const gridVisibleTopLevelRowCountSelector = createSelector(gridVisibleSortedTopLevelRowEntriesSelector, visibleSortedTopLevelRows => visibleSortedTopLevelRows.length);\n/**\n * @category Filtering\n * @ignore - do not document.\n */\n\nexport const gridFilterActiveItemsSelector = createSelector(gridFilterModelSelector, gridColumnLookupSelector, (filterModel, columnLookup) => {\n var _filterModel$items;\n\n return (_filterModel$items = filterModel.items) == null ? void 0 : _filterModel$items.filter(item => {\n var _column$filterOperato, _item$value;\n\n if (!item.columnField) {\n return false;\n }\n\n const column = columnLookup[item.columnField];\n\n if (!(column != null && column.filterOperators) || (column == null ? void 0 : (_column$filterOperato = column.filterOperators) == null ? void 0 : _column$filterOperato.length) === 0) {\n return false;\n }\n\n const filterOperator = column.filterOperators.find(operator => operator.value === item.operatorValue);\n\n if (!filterOperator) {\n return false;\n }\n\n return !filterOperator.InputComponent || item.value != null && ((_item$value = item.value) == null ? void 0 : _item$value.toString()) !== '';\n });\n});\n\n/**\n * @category Filtering\n * @ignore - do not document.\n */\nexport const gridFilterActiveItemsLookupSelector = createSelector(gridFilterActiveItemsSelector, activeFilters => {\n const result = activeFilters.reduce((res, filterItem) => {\n if (!res[filterItem.columnField]) {\n res[filterItem.columnField] = [filterItem];\n } else {\n res[filterItem.columnField].push(filterItem);\n }\n\n return res;\n }, {});\n return result;\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/material/utils';\nimport { useGridSelector } from '../../hooks/utils/useGridSelector';\nimport { gridVisibleRowCountSelector } 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 { gridDensityHeaderHeightSelector } from '../../hooks/features/density/densitySelector';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nfunction GridOverlayWrapper(props) {\n var _viewportInnerSize$he, _viewportInnerSize$wi;\n\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const headerHeight = useGridSelector(apiRef, gridDensityHeaderHeightSelector);\n const [viewportInnerSize, setViewportInnerSize] = React.useState(() => {\n var _apiRef$current$getRo, _apiRef$current$getRo2;\n\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\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\n if (rootProps.autoHeight && height === 0) {\n height = 'auto';\n }\n\n if (!viewportInnerSize) {\n return null;\n }\n\n return /*#__PURE__*/_jsx(\"div\", _extends({\n style: {\n height,\n width: (_viewportInnerSize$wi = viewportInnerSize == null ? void 0 : viewportInnerSize.width) != null ? _viewportInnerSize$wi : 0,\n position: 'absolute',\n top: headerHeight,\n bottom: height === 'auto' ? 0 : undefined\n }\n }, props));\n}\n\nexport function GridOverlays() {\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const totalRowCount = useGridSelector(apiRef, gridRowCountSelector);\n const visibleRowCount = useGridSelector(apiRef, gridVisibleRowCountSelector);\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\n if (showNoRowsOverlay) {\n var _rootProps$components;\n\n overlay = /*#__PURE__*/_jsx(rootProps.components.NoRowsOverlay, _extends({}, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.noRowsOverlay));\n }\n\n if (showNoResultsOverlay) {\n var _rootProps$components2;\n\n overlay = /*#__PURE__*/_jsx(rootProps.components.NoResultsOverlay, _extends({}, (_rootProps$components2 = rootProps.componentsProps) == null ? void 0 : _rootProps$components2.noResultsOverlay));\n }\n\n if (loading) {\n var _rootProps$components3;\n\n overlay = /*#__PURE__*/_jsx(rootProps.components.LoadingOverlay, _extends({}, (_rootProps$components3 = rootProps.componentsProps) == null ? void 0 : _rootProps$components3.loadingOverlay));\n }\n\n if (overlay === null) {\n return null;\n }\n\n return /*#__PURE__*/_jsx(GridOverlayWrapper, {\n children: overlay\n });\n}","import * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { GridMainContainer } from '../containers/GridMainContainer';\nimport { GridAutoSizer } from '../GridAutoSizer';\nimport { GridOverlays } from './GridOverlays';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { useGridSelector } from '../../hooks/utils/useGridSelector';\nimport { gridDensityHeaderHeightSelector } from '../../hooks/features/density/densitySelector';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\n\nfunction GridBody(props) {\n const {\n children,\n VirtualScrollerComponent,\n ColumnHeadersComponent\n } = props;\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const headerHeight = useGridSelector(apiRef, gridDensityHeaderHeightSelector);\n const [isVirtualizationDisabled, setIsVirtualizationDisabled] = React.useState(rootProps.disableVirtualization);\n const disableVirtualization = React.useCallback(() => {\n setIsVirtualizationDisabled(true);\n }, []);\n const enableVirtualization = React.useCallback(() => {\n setIsVirtualizationDisabled(false);\n }, []); // The `useGridApiMethod` hook can't be used here, because it only installs the\n // method if it doesn't exist yet. Once installed, it's never updated again.\n // This break the methods above, since their closure comes from the first time\n // they were installed. Which means that calling `setIsVirtualizationDisabled`\n // will trigger a re-render, but it won't update the state. That can be solved\n // by migrating the virtualization status to the global state.\n\n apiRef.current.unstable_disableVirtualization = disableVirtualization;\n apiRef.current.unstable_enableVirtualization = enableVirtualization;\n const columnHeadersRef = React.useRef(null);\n const columnsContainerRef = React.useRef(null);\n const windowRef = React.useRef(null);\n const renderingZoneRef = React.useRef(null);\n apiRef.current.columnHeadersContainerElementRef = columnsContainerRef;\n apiRef.current.columnHeadersElementRef = columnHeadersRef;\n apiRef.current.windowRef = windowRef; // TODO rename, it's not attached to the window anymore\n\n apiRef.current.renderingZoneRef = renderingZoneRef; // TODO remove, nobody should have access to internal parts of the virtualization\n\n const handleResize = React.useCallback(size => {\n apiRef.current.publishEvent('resize', size);\n }, [apiRef]);\n return /*#__PURE__*/_jsxs(GridMainContainer, {\n children: [/*#__PURE__*/_jsx(GridOverlays, {}), /*#__PURE__*/_jsx(ColumnHeadersComponent, {\n ref: columnsContainerRef,\n innerRef: columnHeadersRef\n }), /*#__PURE__*/_jsx(GridAutoSizer, {\n nonce: rootProps.nonce,\n disableHeight: rootProps.autoHeight,\n onResize: handleResize,\n children: size => {\n const style = {\n width: size.width,\n // If `autoHeight` is on, there will be no height value.\n // In this case, let the container to grow whatever it needs.\n height: size.height ? size.height - headerHeight : 'auto',\n marginTop: headerHeight\n };\n return /*#__PURE__*/_jsx(VirtualScrollerComponent, {\n ref: windowRef,\n style: style,\n disableVirtualization: isVirtualizationDisabled\n });\n }\n }), children]\n });\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 ColumnHeadersComponent: PropTypes.elementType.isRequired,\n VirtualScrollerComponent: PropTypes.elementType.isRequired\n} : void 0;\nexport { GridBody };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport function GridFooterPlaceholder() {\n var _rootProps$components;\n\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const footerRef = React.useRef(null);\n apiRef.current.footerRef = footerRef;\n\n if (rootProps.hideFooter) {\n return null;\n }\n\n return /*#__PURE__*/_jsx(\"div\", {\n ref: footerRef,\n children: /*#__PURE__*/_jsx(rootProps.components.Footer, _extends({}, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.footer))\n });\n}","import * as React from 'react';\nimport { GridApiContext } from '../components/GridApiContext';\nimport { GridRootPropsContext } from './GridRootPropsContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const GridContextProvider = ({\n apiRef,\n props,\n children\n}) => {\n return /*#__PURE__*/_jsx(GridRootPropsContext.Provider, {\n value: props,\n children: /*#__PURE__*/_jsx(GridApiContext.Provider, {\n value: apiRef,\n children: children\n })\n });\n};","export function isNumber(value) {\n return typeof value === 'number';\n}\nexport function isFunction(value) {\n return typeof value === 'function';\n}\nexport function isObject(value) {\n return typeof value === 'object';\n}\nexport function localStorageAvailable() {\n try {\n // Incognito mode might reject access to the localStorage for security reasons.\n // window isn't defined on Node.js\n // https://stackoverflow.com/questions/16427636/check-if-localstorage-is-available\n const key = '__some_random_key_you_are_not_going_to_use__';\n window.localStorage.setItem(key, key);\n window.localStorage.removeItem(key);\n return true;\n } catch (err) {\n return false;\n }\n}\nexport function escapeRegExp(value) {\n return value.replace(/[-[\\]{}()*+?.,\\\\^$|#\\s]/g, '\\\\$&');\n}\n/**\n * Follows the CSS specification behavior for min and max\n * If min > max, then the min have priority\n */\n\nexport const clamp = (value, min, max) => Math.max(min, Math.min(max, value));\n/**\n * Based on `fast-deep-equal`\n *\n * MIT License\n *\n * Copyright (c) 2017 Evgeny Poberezkin\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n * We only type the public interface to avoid dozens of `as` in the function.\n */\n\nexport function isDeepEqual(a, b) {\n if (a === b) {\n return true;\n }\n\n if (a && b && typeof a === 'object' && typeof b === 'object') {\n if (a.constructor !== b.constructor) {\n return false;\n }\n\n if (Array.isArray(a)) {\n const length = a.length;\n\n if (length !== b.length) {\n return false;\n }\n\n for (let i = 0; i < length; i += 1) {\n if (!isDeepEqual(a[i], b[i])) {\n return false;\n }\n }\n\n return true;\n }\n\n if (a instanceof Map && b instanceof Map) {\n if (a.size !== b.size) {\n return false;\n }\n\n const entriesA = Array.from(a.entries());\n\n for (let i = 0; i < entriesA.length; i += 1) {\n if (!b.has(entriesA[i][0])) {\n return false;\n }\n }\n\n for (let i = 0; i < entriesA.length; i += 1) {\n const entryA = entriesA[i];\n\n if (!isDeepEqual(entryA[1], b.get(entryA[0]))) {\n return false;\n }\n }\n\n return true;\n }\n\n if (a instanceof Set && b instanceof Set) {\n if (a.size !== b.size) {\n return false;\n }\n\n const entries = Array.from(a.entries());\n\n for (let i = 0; i < entries.length; i += 1) {\n if (!b.has(entries[i][0])) {\n return false;\n }\n }\n\n return true;\n }\n\n if (ArrayBuffer.isView(a) && ArrayBuffer.isView(b)) {\n const length = a.length;\n\n if (length !== b.length) {\n return false;\n }\n\n for (let i = 0; i < length; i += 1) {\n if (a[i] !== b[i]) {\n return false;\n }\n }\n\n return true;\n }\n\n if (a.constructor === RegExp) {\n return a.source === b.source && a.flags === b.flags;\n }\n\n if (a.valueOf !== Object.prototype.valueOf) {\n return a.valueOf() === b.valueOf();\n }\n\n if (a.toString !== Object.prototype.toString) {\n return a.toString() === b.toString();\n }\n\n const keys = Object.keys(a);\n const length = keys.length;\n\n if (length !== Object.keys(b).length) {\n return false;\n }\n\n for (let i = 0; i < length; i += 1) {\n if (!Object.prototype.hasOwnProperty.call(b, keys[i])) {\n return false;\n }\n }\n\n for (let i = 0; i < length; i += 1) {\n const key = keys[i];\n\n if (!isDeepEqual(a[key], b[key])) {\n return false;\n }\n }\n\n return true;\n } // true if both NaN, false otherwise\n // eslint-disable-next-line no-self-compare\n\n\n return a !== a && b !== b;\n}","import * as React from 'react';\nimport { localStorageAvailable } from '../../utils/utils';\nconst forceDebug = localStorageAvailable() && window.localStorage.getItem('DEBUG') != null;\n\nconst noop = () => {};\n\nconst noopLogger = {\n debug: noop,\n info: noop,\n warn: noop,\n error: noop\n};\nconst LOG_LEVELS = ['debug', 'info', 'warn', 'error'];\n\nfunction getAppender(name, logLevel, appender = console) {\n const minLogLevelIdx = LOG_LEVELS.indexOf(logLevel);\n\n if (minLogLevelIdx === -1) {\n throw new Error(`MUI: Log level ${logLevel} not recognized.`);\n }\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\n return loggerObj;\n }, {});\n return logger;\n}\n\nexport const useGridLoggerFactory = (apiRef, props) => {\n apiRef.current.getLogger = React.useCallback(name => {\n if (forceDebug) {\n return getAppender(name, 'debug', props.logger);\n }\n\n if (!props.logLevel) {\n return noopLogger;\n }\n\n return getAppender(name, props.logLevel.toString(), props.logger);\n }, [props.logLevel, props.logger]);\n};","import * as React from 'react';\nexport function useGridApiMethod(apiRef, apiMethods, // TODO: Remove `apiName\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\napiName) {\n const apiMethodsRef = React.useRef(apiMethods);\n const [apiMethodsNames] = React.useState(Object.keys(apiMethods));\n const installMethods = React.useCallback(() => {\n if (!apiRef.current) {\n return;\n }\n\n apiMethodsNames.forEach(methodName => {\n if (!apiRef.current.hasOwnProperty(methodName)) {\n apiRef.current[methodName] = (...args) => apiMethodsRef.current[methodName](...args);\n }\n });\n }, [apiMethodsNames, apiRef]);\n React.useEffect(() => {\n apiMethodsRef.current = apiMethods;\n }, [apiMethods]);\n React.useEffect(() => {\n installMethods();\n }, [installMethods]);\n installMethods();\n}","// If no effect ran after this amount of time, we assume that the render was not committed by React\nconst CLEANUP_TIMER_LOOP_MILLIS = 1000;\nexport class TimerBasedCleanupTracking {\n constructor(timeout = CLEANUP_TIMER_LOOP_MILLIS) {\n this.timeouts = new Map();\n this.cleanupTimeout = CLEANUP_TIMER_LOOP_MILLIS;\n this.cleanupTimeout = timeout;\n }\n\n register(object, unsubscribe, unregisterToken) {\n if (!this.timeouts) {\n this.timeouts = new Map();\n }\n\n const timeout = setTimeout(() => {\n if (typeof unsubscribe === 'function') {\n unsubscribe();\n }\n\n this.timeouts.delete(unregisterToken.cleanupToken);\n }, this.cleanupTimeout);\n this.timeouts.set(unregisterToken.cleanupToken, timeout);\n }\n\n unregister(unregisterToken) {\n const timeout = this.timeouts.get(unregisterToken.cleanupToken);\n\n if (timeout) {\n this.timeouts.delete(unregisterToken.cleanupToken);\n clearTimeout(timeout);\n }\n }\n\n reset() {\n if (this.timeouts) {\n this.timeouts.forEach((value, key) => {\n this.unregister({\n cleanupToken: key\n });\n });\n this.timeouts = undefined;\n }\n }\n\n}","import * as React from 'react';\nimport { TimerBasedCleanupTracking } from '../../utils/cleanupTracking/TimerBasedCleanupTracking';\nimport { FinalizationRegistryBasedCleanupTracking } from '../../utils/cleanupTracking/FinalizationRegistryBasedCleanupTracking';\n\n/**\n * Signal to the underlying logic what version of the public component API\n * of the data grid is exposed.\n */\nvar GridSignature;\n\n(function (GridSignature) {\n GridSignature[\"DataGrid\"] = \"DataGrid\";\n GridSignature[\"DataGridPro\"] = \"DataGridPro\";\n})(GridSignature || (GridSignature = {}));\n\n// We use class to make it easier to detect in heap snapshots by name\nclass ObjectToBeRetainedByReact {} // Based on https://github.com/Bnaya/use-dispose-uncommitted/blob/main/src/finalization-registry-based-impl.ts\n// Check https://github.com/facebook/react/issues/15317 to get more information\n\n\nexport function createUseGridApiEventHandler(registryContainer) {\n let cleanupTokensCounter = 0;\n return function useGridApiEventHandler(apiRef, eventName, handler, options) {\n if (registryContainer.registry === null) {\n registryContainer.registry = typeof FinalizationRegistry !== 'undefined' ? new FinalizationRegistryBasedCleanupTracking() : new TimerBasedCleanupTracking();\n }\n\n const [objectRetainedByReact] = React.useState(new ObjectToBeRetainedByReact());\n const subscription = React.useRef(null);\n const handlerRef = React.useRef();\n handlerRef.current = handler;\n const cleanupTokenRef = React.useRef(null);\n\n if (!subscription.current && handlerRef.current) {\n const enhancedHandler = (params, event, details) => {\n if (!event.defaultMuiPrevented) {\n var _handlerRef$current;\n\n (_handlerRef$current = handlerRef.current) == null ? void 0 : _handlerRef$current.call(handlerRef, params, event, details);\n }\n };\n\n subscription.current = apiRef.current.subscribeEvent(eventName, enhancedHandler, options);\n cleanupTokensCounter += 1;\n cleanupTokenRef.current = {\n cleanupToken: cleanupTokensCounter\n };\n registryContainer.registry.register(objectRetainedByReact, // The callback below will be called once this reference stops being retained\n () => {\n var _subscription$current;\n\n (_subscription$current = subscription.current) == null ? void 0 : _subscription$current.call(subscription);\n subscription.current = null;\n cleanupTokenRef.current = null;\n }, cleanupTokenRef.current);\n } else if (!handlerRef.current && subscription.current) {\n subscription.current();\n subscription.current = null;\n\n if (cleanupTokenRef.current) {\n registryContainer.registry.unregister(cleanupTokenRef.current);\n cleanupTokenRef.current = null;\n }\n }\n\n React.useEffect(() => {\n if (!subscription.current && handlerRef.current) {\n const enhancedHandler = (params, event, details) => {\n if (!event.defaultMuiPrevented) {\n var _handlerRef$current2;\n\n (_handlerRef$current2 = handlerRef.current) == null ? void 0 : _handlerRef$current2.call(handlerRef, params, event, details);\n }\n };\n\n subscription.current = apiRef.current.subscribeEvent(eventName, enhancedHandler, options);\n }\n\n if (cleanupTokenRef.current && registryContainer.registry) {\n // If the effect was called, it means that this render was committed\n // so we can trust the cleanup function to remove the listener.\n registryContainer.registry.unregister(cleanupTokenRef.current);\n cleanupTokenRef.current = null;\n }\n\n return () => {\n var _subscription$current2;\n\n (_subscription$current2 = subscription.current) == null ? void 0 : _subscription$current2.call(subscription);\n subscription.current = null;\n };\n }, [apiRef, eventName, options]);\n };\n}\nconst registryContainer = {\n registry: null\n}; // TODO: move to @mui/x-data-grid/internals\n// eslint-disable-next-line @typescript-eslint/naming-convention\n\nexport const unstable_resetCleanupTracking = () => {\n var _registryContainer$re;\n\n (_registryContainer$re = registryContainer.registry) == null ? void 0 : _registryContainer$re.reset();\n registryContainer.registry = null;\n};\nexport const useGridApiEventHandler = createUseGridApiEventHandler(registryContainer);\nconst optionsSubscriberOptions = {\n isFirst: true\n};\nexport function useGridApiOptionHandler(apiRef, eventName, handler) {\n // Validate that only one per event name?\n useGridApiEventHandler(apiRef, eventName, handler, optionsSubscriberOptions);\n}\nexport { GridSignature };","export class FinalizationRegistryBasedCleanupTracking {\n constructor() {\n this.registry = new FinalizationRegistry(unsubscribe => {\n if (typeof unsubscribe === 'function') {\n unsubscribe();\n }\n });\n }\n\n register(object, unsubscribe, unregisterToken) {\n this.registry.register(object, unsubscribe, unregisterToken);\n }\n\n unregister(unregisterToken) {\n this.registry.unregister(unregisterToken);\n } // eslint-disable-next-line class-methods-use-this\n\n\n reset() {}\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 = 10;\n this.warnOnce = false;\n this.events = {};\n }\n\n on(eventName, listener, options = {}) {\n let collection = this.events[eventName];\n\n if (!collection) {\n collection = {\n highPriority: new Map(),\n regular: new Map()\n };\n this.events[eventName] = collection;\n }\n\n if (options.isFirst) {\n collection.highPriority.set(listener, true);\n } else {\n collection.regular.set(listener, true);\n }\n\n if (process.env.NODE_ENV !== 'production') {\n const collectionSize = collection.highPriority.size + collection.regular.size;\n\n if (collectionSize > this.maxListeners && !this.warnOnce) {\n this.warnOnce = true;\n console.warn([`Possible EventEmitter memory leak detected. ${collectionSize} ${eventName} listeners added.`, `Use emitter.setMaxListeners() to increase limit.`].join('\\n'));\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\n removeAllListeners() {\n this.events = {};\n }\n\n emit(eventName, ...args) {\n const collection = this.events[eventName];\n\n if (!collection) {\n return;\n }\n\n const highPriorityListeners = Array.from(collection.highPriority.keys());\n const regularListeners = Array.from(collection.regular.keys());\n\n for (let i = highPriorityListeners.length - 1; i >= 0; i -= 1) {\n const listener = highPriorityListeners[i];\n\n if (collection.highPriority.has(listener)) {\n listener.apply(this, args);\n }\n }\n\n for (let i = 0; i < regularListeners.length; i += 1) {\n const listener = regularListeners[i];\n\n if (collection.regular.has(listener)) {\n listener.apply(this, args);\n }\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\n}","import * as React from 'react';\nimport { useGridApiMethod } from '../utils/useGridApiMethod';\nimport { GridSignature } from '../utils/useGridApiEventHandler';\nimport { EventManager } from '../../utils/EventManager';\n\nconst isSyntheticEvent = event => {\n return event.isPropagationStopped !== undefined;\n};\n\nlet globalId = 0;\nexport function useGridApiInitialization(inputApiRef, props) {\n const apiRef = React.useRef();\n\n if (!apiRef.current) {\n apiRef.current = {\n unstable_eventManager: new EventManager(),\n unstable_caches: {},\n state: {},\n instanceId: globalId\n };\n globalId += 1;\n }\n\n React.useImperativeHandle(inputApiRef, () => apiRef.current, [apiRef]);\n const publishEvent = React.useCallback((...args) => {\n const [name, params, event = {}] = args;\n event.defaultMuiPrevented = false;\n\n if (isSyntheticEvent(event) && event.isPropagationStopped()) {\n return;\n }\n\n const details = props.signature === GridSignature.DataGridPro ? {\n api: apiRef.current\n } : {};\n apiRef.current.unstable_eventManager.emit(name, params, event, details);\n }, [apiRef, props.signature]);\n const subscribeEvent = React.useCallback((event, handler, options) => {\n apiRef.current.unstable_eventManager.on(event, handler, options);\n const api = apiRef.current;\n return () => {\n api.unstable_eventManager.removeListener(event, handler);\n };\n }, [apiRef]);\n const showError = React.useCallback(args => {\n apiRef.current.publishEvent('componentError', args);\n }, [apiRef]);\n useGridApiMethod(apiRef, {\n subscribeEvent,\n publishEvent,\n showError\n }, 'GridCoreApi');\n React.useEffect(() => {\n const api = apiRef.current;\n return () => {\n api.publishEvent('unmount');\n };\n }, [apiRef]);\n return apiRef;\n}","import * as React from 'react';\nimport { useGridApiMethod } from '../utils/useGridApiMethod';\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\n return props.localeText[key];\n }, [props.localeText]);\n const localeTextApi = {\n getLocaleText\n };\n useGridApiMethod(apiRef, localeTextApi, 'LocaleTextApi');\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};\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.unstable_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.unstable_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\n strategiesCache.current[processorName] = otherProcessors;\n };\n\n if (!strategiesCache.current[processorName]) {\n strategiesCache.current[processorName] = {};\n }\n\n const groupPreProcessors = strategiesCache.current[processorName];\n const previousProcessor = groupPreProcessors[strategyName];\n groupPreProcessors[strategyName] = processor;\n\n if (!previousProcessor || previousProcessor === processor) {\n return cleanup;\n }\n\n if (strategyName === apiRef.current.unstable_getActiveStrategy(GRID_STRATEGIES_PROCESSORS[processorName])) {\n apiRef.current.publishEvent('activeStrategyProcessorChange', processorName);\n }\n\n return cleanup;\n }, [apiRef]);\n const applyStrategyProcessor = React.useCallback((processorName, params) => {\n const activeStrategy = apiRef.current.unstable_getActiveStrategy(GRID_STRATEGIES_PROCESSORS[processorName]);\n\n if (activeStrategy == null) {\n throw new Error(\"Can't apply a strategy processor before defining an active strategy\");\n }\n\n const groupCache = strategiesCache.current[processorName];\n\n if (!groupCache || !groupCache[activeStrategy]) {\n throw new Error(`No processor found for processor \"${processorName}\" on strategy \"${activeStrategy}\"`);\n }\n\n const processor = groupCache[activeStrategy];\n return processor(params);\n }, [apiRef]);\n const getActiveStrategy = React.useCallback(strategyGroup => {\n var _availableStrategyEnt;\n\n const strategyEntries = Array.from(availableStrategies.current.entries());\n const availableStrategyEntry = strategyEntries.find(([, strategy]) => {\n if (strategy.group !== strategyGroup) {\n return false;\n }\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 unstable_registerStrategyProcessor: registerStrategyProcessor,\n unstable_applyStrategyProcessor: applyStrategyProcessor,\n unstable_getActiveStrategy: getActiveStrategy,\n unstable_setStrategyAvailability: setStrategyAvailability\n };\n useGridApiMethod(apiRef, strategyProcessingApi, 'GridStrategyProcessing');\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"stateId\"];\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 const {\n stateId\n } = controlStateItem,\n others = _objectWithoutPropertiesLoose(controlStateItem, _excluded);\n\n controlStateMapRef.current[stateId] = _extends({}, others, {\n stateId\n });\n }, []);\n const setState = React.useCallback((state, reason) => {\n let newState;\n\n if (isFunction(state)) {\n newState = state(apiRef.current.state);\n } else {\n newState = state;\n }\n\n if (apiRef.current.state === newState) {\n return false;\n }\n\n let ignoreSetState = false; // Apply the control state constraints\n\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\n if (newSubState === oldSubState) {\n return;\n }\n\n updatedControlStateIds.push({\n stateId: controlState.stateId,\n hasPropChanged: newSubState !== controlState.propModel\n }); // The state is controlled, the prop should always win\n\n if (controlState.propModel !== undefined && newSubState !== controlState.propModel) {\n ignoreSetState = true;\n }\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\n if (!ignoreSetState) {\n // We always assign it as we mutate rows for perf reason.\n apiRef.current.state = newState;\n\n if (apiRef.current.publishEvent) {\n apiRef.current.publishEvent('stateChange', newState);\n }\n }\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\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\n if (!ignoreSetState) {\n apiRef.current.publishEvent(controlState.changeEvent, model, {\n reason\n });\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 stateApi = {\n setState,\n forceUpdate,\n unstable_updateControlState: updateControlState,\n unstable_registerControlState: registerControlState\n };\n useGridApiMethod(apiRef, stateApi, 'GridStateApi');\n};","import { useGridLoggerFactory } from './useGridLoggerFactory';\nimport { useGridApiInitialization } from './useGridApiInitialization';\nimport { useGridErrorHandler } from './useGridErrorHandler';\nimport { useGridLocaleText } from './useGridLocaleText';\nimport { useGridPipeProcessing } from './pipeProcessing';\nimport { useGridStrategyProcessing } from './strategyProcessing';\nimport { useGridStateInitialization } from './useGridStateInitialization';\n/**\n * Initialize the technical pieces of the DataGrid (logger, state, ...) that any DataGrid implementation needs\n */\n\nexport const useGridInitialization = (inputApiRef, props) => {\n const apiRef = useGridApiInitialization(inputApiRef, props);\n useGridLoggerFactory(apiRef, props);\n useGridErrorHandler(apiRef, props);\n useGridStateInitialization(apiRef, props);\n useGridPipeProcessing(apiRef);\n useGridStrategyProcessing(apiRef);\n useGridLocaleText(apiRef, props);\n return apiRef;\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridApiEventHandler } from '../utils/useGridApiEventHandler';\nexport function useGridErrorHandler(apiRef, props) {\n const handleError = React.useCallback(args => {\n // We are handling error here, to set up the handler as early as possible and be able to catch error thrown at init time.\n apiRef.current.setState(state => _extends({}, state, {\n error: args\n }));\n }, [apiRef]);\n React.useEffect(() => {\n handleError(props.error);\n }, [handleError, props.error]);\n useGridApiEventHandler(apiRef, 'componentError', handleError);\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/**\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.unstable_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.unstable_requestPipeProcessorsApplication` is called for the given group.\n */\nexport const useGridPipeProcessing = apiRef => {\n const processorsCache = React.useRef({});\n const runAppliers = React.useCallback(groupCache => {\n if (!groupCache) {\n return;\n }\n\n Object.values(groupCache.appliers).forEach(callback => {\n callback();\n });\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\n const groupCache = processorsCache.current[group];\n const oldProcessor = groupCache.processors.get(id);\n\n if (oldProcessor !== processor) {\n groupCache.processors.set(id, processor);\n runAppliers(groupCache);\n }\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\n processorsCache.current[group].appliers[id] = applier;\n return () => {\n const _appliers = processorsCache.current[group].appliers,\n otherAppliers = _objectWithoutPropertiesLoose(_appliers, [id].map(_toPropertyKey));\n\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\n if (!processorsCache.current[group]) {\n return value;\n }\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\n return preProcessor(acc, context);\n }, value);\n }, []);\n const preProcessingApi = {\n unstable_registerPipeProcessor: registerPipeProcessor,\n unstable_registerPipeApplier: registerPipeApplier,\n unstable_requestPipeProcessorsApplication: requestPipeProcessorsApplication,\n unstable_applyPipeProcessors: applyPipeProcessors\n };\n useGridApiMethod(apiRef, preProcessingApi, 'GridPipeProcessingApi');\n};","import * as React from 'react';\nexport const useGridInitializeState = (initializer, apiRef, props) => {\n const isInitialized = React.useRef(false);\n\n if (!isInitialized.current) {\n apiRef.current.state = initializer(apiRef.current.state, props, apiRef);\n isInitialized.current = true;\n }\n};","import * as React from 'react';\nimport { useGridApiMethod, useGridNativeEventListener } from '../../utils';\n\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\n try {\n document.execCommand('copy');\n } finally {\n document.body.removeChild(span);\n }\n}\n/**\n * @requires useGridCsvExport (method)\n * @requires useGridSelection (method)\n */\n\n\nexport const useGridClipboard = apiRef => {\n const copySelectedRowsToClipboard = React.useCallback((includeHeaders = false) => {\n if (apiRef.current.getSelectedRows().size === 0) {\n return;\n }\n\n const data = apiRef.current.getDataAsCsv({\n includeHeaders,\n delimiter: '\\t'\n });\n\n if (navigator.clipboard) {\n navigator.clipboard.writeText(data).catch(() => {\n writeToClipboardPolyfill(data);\n });\n } else {\n writeToClipboardPolyfill(data);\n }\n }, [apiRef]);\n const handleKeydown = React.useCallback(event => {\n var _window$getSelection;\n\n const isModifierKeyPressed = event.ctrlKey || event.metaKey || event.altKey; // event.key === 'c' is not enough as alt+c can lead to ©, ç, or other characters on macOS.\n // event.code === 'KeyC' is not enough as event.code assume a QWERTY keyboard layout which would\n // be wrong with a Dvorak keyboard (as if pressing J).\n\n if (String.fromCharCode(event.keyCode) !== 'C' || !isModifierKeyPressed) {\n return;\n } // Do nothing if there's a native selection\n\n\n if (((_window$getSelection = window.getSelection()) == null ? void 0 : _window$getSelection.toString()) !== '') {\n return;\n }\n\n apiRef.current.unstable_copySelectedRowsToClipboard(event.altKey);\n }, [apiRef]);\n useGridNativeEventListener(apiRef, apiRef.current.rootElementRef, 'keydown', handleKeydown);\n const clipboardApi = {\n unstable_copySelectedRowsToClipboard: copySelectedRowsToClipboard\n };\n useGridApiMethod(apiRef, clipboardApi, 'GridClipboardApi');\n};","import * as React from 'react';\nimport { isFunction } from '../../utils/utils';\nimport { useGridLogger } from './useGridLogger';\nexport const useGridNativeEventListener = (apiRef, ref, eventName, handler, options) => {\n const logger = useGridLogger(apiRef, 'useNativeEventListener');\n const [added, setAdded] = React.useState(false);\n const handlerRef = React.useRef(handler);\n const wrapHandler = React.useCallback(args => {\n return handlerRef.current && handlerRef.current(args);\n }, []);\n React.useEffect(() => {\n handlerRef.current = handler;\n }, [handler]);\n React.useEffect(() => {\n let targetElement;\n\n if (isFunction(ref)) {\n targetElement = ref();\n } else {\n targetElement = ref && ref.current ? ref.current : null;\n }\n\n if (targetElement && wrapHandler && eventName && !added) {\n logger.debug(`Binding native ${eventName} event`);\n targetElement.addEventListener(eventName, wrapHandler, options);\n const boundElem = targetElement;\n setAdded(true);\n\n const unsubscribe = () => {\n logger.debug(`Clearing native ${eventName} event`);\n boundElem.removeEventListener(eventName, wrapHandler, options);\n };\n\n apiRef.current.subscribeEvent('unmount', unsubscribe);\n }\n }, [ref, wrapHandler, eventName, added, logger, options, apiRef]);\n};","export const gridColumnMenuSelector = state => state.columnMenu;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridLogger, useGridApiMethod, useGridApiEventHandler } from '../../utils';\nimport { gridColumnMenuSelector } from './columnMenuSelector';\nimport { gridClasses } from '../../../constants/gridClasses';\nexport const columnMenuStateInitializer = state => _extends({}, state, {\n columnMenu: {\n open: false\n }\n});\n/**\n * @requires useGridColumnResize (event)\n * @requires useGridInfiniteLoader (event)\n */\n\nexport const useGridColumnMenu = apiRef => {\n const logger = useGridLogger(apiRef, 'useGridColumnMenu');\n /**\n * API METHODS\n */\n\n const showColumnMenu = React.useCallback(field => {\n const shouldUpdate = apiRef.current.setState(state => {\n if (state.columnMenu.open && state.columnMenu.field === field) {\n return state;\n }\n\n logger.debug('Opening Column Menu');\n return _extends({}, state, {\n columnMenu: {\n open: true,\n field\n }\n });\n });\n\n if (shouldUpdate) {\n apiRef.current.hidePreferences();\n apiRef.current.forceUpdate();\n }\n }, [apiRef, logger]);\n const hideColumnMenu = React.useCallback(() => {\n const shouldUpdate = apiRef.current.setState(state => {\n if (!state.columnMenu.open && state.columnMenu.field === undefined) {\n return state;\n }\n\n logger.debug('Hiding Column Menu');\n return _extends({}, state, {\n columnMenu: _extends({}, state.columnMenu, {\n open: false,\n field: undefined\n })\n });\n });\n\n if (shouldUpdate) {\n apiRef.current.forceUpdate();\n }\n }, [apiRef, logger]);\n const toggleColumnMenu = React.useCallback(field => {\n logger.debug('Toggle Column Menu');\n const columnMenu = gridColumnMenuSelector(apiRef.current.state);\n\n if (!columnMenu.open || columnMenu.field !== field) {\n showColumnMenu(field);\n } else {\n hideColumnMenu();\n }\n }, [apiRef, logger, showColumnMenu, hideColumnMenu]);\n const columnMenuApi = {\n showColumnMenu,\n hideColumnMenu,\n toggleColumnMenu\n };\n useGridApiMethod(apiRef, columnMenuApi, 'GridColumnMenuApi');\n /**\n * EVENTS\n */\n\n const handleColumnHeaderFocus = React.useCallback((params, event) => {\n // Check if the column menu button received focus\n if (!event.target.classList.contains(gridClasses.menuIconButton)) {\n return;\n } // Check if there's an element which lost focus\n\n\n if (!event.relatedTarget) {\n return;\n } // `true` if the focus was on the column menu itself, not on any item\n\n\n const columnMenuLostFocus = event.relatedTarget.classList.contains(gridClasses.menuList); // `true` if the focus was on an item from the column menu\n\n const columnMenuItemLostFocus = event.relatedTarget.getAttribute('role') === 'menuitem';\n\n if (columnMenuLostFocus || columnMenuItemLostFocus) {\n apiRef.current.setColumnHeaderFocus(params.field);\n }\n }, [apiRef]);\n useGridApiEventHandler(apiRef, 'columnResizeStart', hideColumnMenu);\n useGridApiEventHandler(apiRef, 'columnHeaderFocus', handleColumnHeaderFocus);\n useGridApiEventHandler(apiRef, 'virtualScrollerWheel', apiRef.current.hideColumnMenu);\n useGridApiEventHandler(apiRef, 'virtualScrollerTouchMove', apiRef.current.hideColumnMenu);\n};","import * as React from 'react';\nexport const useFirstRender = callback => {\n const isFirstRender = React.useRef(true);\n\n if (isFirstRender.current) {\n isFirstRender.current = false;\n callback();\n }\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.unstable_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\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 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.unstable_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\n return () => {\n if (cleanup.current) {\n cleanup.current();\n cleanup.current = null;\n }\n };\n }, [registerPreProcessor]);\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');","export function getValueFromOption(option) {\n if (typeof option === 'object' && option !== null) {\n return option.value;\n }\n\n return option;\n}\nexport function getValueFromValueOptions(value, valueOptions) {\n if (valueOptions === undefined) {\n return undefined;\n }\n\n const result = valueOptions.find(option => {\n const optionValue = getValueFromOption(option);\n return String(optionValue) === String(value);\n });\n return getValueFromOption(result);\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"item\", \"applyValue\", \"type\", \"apiRef\", \"focusElementRef\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_useId as useId } from '@mui/material/utils';\nimport MenuItem from '@mui/material/MenuItem';\nimport { GridLoadIcon } from '../../icons';\nimport { useGridRootProps } from '../../../hooks/utils/useGridRootProps';\nimport { getValueFromValueOptions } from './filterPanelUtils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst warnedOnce = {};\n\nfunction warnDeprecatedTypeSupport(type) {\n console.warn([`MUI: Using GridFilterInputValue with a \"${type}\" column is deprecated.`, 'Use GridFilterInputSingleSelect instead.'].join('\\n'));\n warnedOnce[type] = true;\n}\n\nconst renderSingleSelectOptions = ({\n valueOptions,\n valueFormatter,\n field\n}, api, OptionComponent) => {\n const iterableColumnValues = typeof valueOptions === 'function' ? ['', ...valueOptions({\n field\n })] : ['', ...(valueOptions || [])];\n return iterableColumnValues.map(option => {\n const isOptionTypeObject = typeof option === 'object';\n const key = isOptionTypeObject ? option.value : option;\n const value = isOptionTypeObject ? option.value : option;\n const formattedValue = valueFormatter && option !== '' ? valueFormatter({\n value: option,\n field,\n api\n }) : option;\n const content = isOptionTypeObject ? option.label : formattedValue;\n return /*#__PURE__*/_jsx(OptionComponent, {\n value: value,\n children: content\n }, key);\n });\n};\n\nexport const SUBMIT_FILTER_STROKE_TIME = 500;\n\nfunction GridFilterInputValue(props) {\n var _item$value, _rootProps$components, _baseSelectProps$nati, _rootProps$components2, _rootProps$components3;\n\n const {\n item,\n applyValue,\n type,\n apiRef,\n focusElementRef\n } = props,\n others = _objectWithoutPropertiesLoose(props, _excluded);\n\n if (process.env.NODE_ENV !== 'production' && ['date', 'datetime-local', 'singleSelect'].includes(type) && !warnedOnce[type]) {\n warnDeprecatedTypeSupport(type);\n }\n\n const filterTimeout = React.useRef();\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 baseSelectProps = ((_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.baseSelect) || {};\n const isSelectNative = (_baseSelectProps$nati = baseSelectProps.native) != null ? _baseSelectProps$nati : true;\n const singleSelectProps = type === 'singleSelect' ? {\n select: true,\n SelectProps: _extends({\n native: isSelectNative\n }, (_rootProps$components2 = rootProps.componentsProps) == null ? void 0 : _rootProps$components2.baseSelect),\n children: renderSingleSelectOptions(apiRef.current.getColumn(item.columnField), apiRef.current, isSelectNative ? 'option' : MenuItem)\n } : {};\n const onFilterChange = React.useCallback(event => {\n let value = event.target.value; // NativeSelect casts the value to a string.\n\n if (type === 'singleSelect') {\n const column = apiRef.current.getColumn(item.columnField);\n const columnValueOptions = typeof column.valueOptions === 'function' ? column.valueOptions({\n field: column.field\n }) : column.valueOptions;\n value = getValueFromValueOptions(value, columnValueOptions);\n }\n\n clearTimeout(filterTimeout.current);\n setFilterValueState(String(value));\n setIsApplying(true); // TODO singleSelect doesn't debounce\n\n filterTimeout.current = setTimeout(() => {\n applyValue(_extends({}, item, {\n value\n }));\n setIsApplying(false);\n }, SUBMIT_FILTER_STROKE_TIME);\n }, [apiRef, applyValue, item, type]);\n React.useEffect(() => {\n return () => {\n clearTimeout(filterTimeout.current);\n };\n }, []);\n React.useEffect(() => {\n var _item$value2;\n\n const itemValue = (_item$value2 = item.value) != null ? _item$value2 : '';\n setFilterValueState(String(itemValue));\n }, [item.value]);\n const InputProps = applying ? {\n endAdornment: /*#__PURE__*/_jsx(GridLoadIcon, {})\n } : others.InputProps;\n return /*#__PURE__*/_jsx(rootProps.components.BaseTextField, _extends({\n id: id,\n label: apiRef.current.getLocaleText('filterPanelInputLabel'),\n placeholder: apiRef.current.getLocaleText('filterPanelInputPlaceholder'),\n value: filterValueState,\n onChange: onFilterChange,\n type: type || 'text',\n variant: \"standard\",\n InputProps: InputProps,\n InputLabelProps: {\n shrink: true\n },\n inputRef: focusElementRef\n }, singleSelectProps, others, (_rootProps$components3 = rootProps.componentsProps) == null ? void 0 : _rootProps$components3.baseTextField));\n}\n\nprocess.env.NODE_ENV !== \"production\" ? GridFilterInputValue.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.any.isRequired,\n applyValue: PropTypes.func.isRequired,\n focusElementRef: PropTypes\n /* @typescript-to-proptypes-ignore */\n .oneOfType([PropTypes.func, PropTypes.object]),\n item: PropTypes.shape({\n columnField: PropTypes.string.isRequired,\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n operatorValue: PropTypes.string,\n value: PropTypes.any\n }).isRequired\n} : void 0;\nexport { GridFilterInputValue };","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\", \"getValue\", \"isValidating\", \"debounceMs\", \"isProcessingProps\", \"onValueChange\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/material/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 { GridLoadIcon } from '../icons/index';\nimport { SUBMIT_FILTER_STROKE_TIME } from '../panel/filterPanel/GridFilterInputValue';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['editInputCell']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\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}));\n\nfunction GridEditInputCell(props) {\n var _rootProps$experiment;\n\n const rootProps = useGridRootProps();\n\n const {\n id,\n value,\n field,\n colDef,\n hasFocus,\n debounceMs = (_rootProps$experiment = rootProps.experimentalFeatures) != null && _rootProps$experiment.newEditingApi ? 200 : SUBMIT_FILTER_STROKE_TIME,\n isProcessingProps,\n onValueChange\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const apiRef = useGridApiContext();\n const inputRef = React.useRef();\n const [valueState, setValueState] = React.useState(value);\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.value;\n\n if (onValueChange) {\n await onValueChange(event, newValue);\n }\n\n setValueState(newValue);\n apiRef.current.setEditCellValue({\n id,\n field,\n value: newValue,\n debounceMs\n }, event);\n }, [apiRef, debounceMs, field, id, 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(GridEditInputCellRoot, _extends({\n inputRef: inputRef,\n className: classes.root,\n fullWidth: true,\n type: colDef.type === 'number' ? colDef.type : 'text',\n value: valueState != null ? valueState : '',\n onChange: handleChange,\n endAdornment: isProcessingProps ? /*#__PURE__*/_jsx(GridLoadIcon, {}) : undefined\n }, other));\n}\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 /**\n * GridApi that let you manipulate the grid.\n * @deprecated Use the `apiRef` returned by `useGridApiContext` or `useGridApiRef` (only available in `@mui/x-data-grid-pro`)\n */\n api: PropTypes.any.isRequired,\n\n /**\n * The mode of the cell.\n */\n cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,\n\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 /**\n * The column field of the cell that triggered the event.\n */\n field: PropTypes.string.isRequired,\n\n /**\n * The cell value formatted with the column valueFormatter.\n */\n formattedValue: PropTypes.any,\n\n /**\n * Get the cell value of a row and field.\n * @param {GridRowId} id The row id.\n * @param {string} field The field.\n * @returns {any} The cell value.\n * @deprecated Use `params.row` to directly access the fields you want instead.\n */\n getValue: PropTypes.func.isRequired,\n\n /**\n * If true, the cell is the active element.\n */\n hasFocus: PropTypes.bool.isRequired,\n\n /**\n * The grid row id.\n */\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n\n /**\n * If true, the cell is editable.\n */\n isEditable: PropTypes.bool,\n isProcessingProps: PropTypes.bool,\n isValidating: PropTypes.bool,\n\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 /**\n * The row model of the row that the current cell belongs to.\n */\n row: PropTypes.object.isRequired,\n\n /**\n * The node of the row that the current cell belongs to.\n */\n rowNode: PropTypes.object.isRequired,\n\n /**\n * the tabIndex value.\n */\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\n\n /**\n * The cell value, but if the column has valueGetter, use getValue.\n */\n value: PropTypes.any\n} : void 0;\nexport { GridEditInputCell };\nexport const renderEditInputCell = params => /*#__PURE__*/_jsx(GridEditInputCell, _extends({}, params));","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { buildWarning } from '../../../utils/warning';\nconst sortModelDisableMultiColumnsSortingWarning = buildWarning(['MUI: The `sortModel` can only contain a single item when the `disableMultipleColumnsSorting` prop is set to `true`.', 'If you are using the community version of the `DataGrid`, this prop is always `true`.'], 'error');\nexport const sanitizeSortModel = (model, disableMultipleColumnsSorting) => {\n if (disableMultipleColumnsSorting && model.length > 1) {\n sortModelDisableMultiColumnsSortingWarning();\n return [model[0]];\n }\n\n return model;\n};\nexport const mergeStateWithSortModel = (sortModel, disableMultipleColumnsSorting) => state => _extends({}, state, {\n sorting: _extends({}, state.sorting, {\n sortModel: sanitizeSortModel(sortModel, disableMultipleColumnsSorting)\n })\n});\n\nconst isDesc = direction => direction === 'desc';\n/**\n * Transform an item of the sorting model into a method comparing two rows.\n * @param {GridSortItem} sortItem The sort item we want to apply.\n * @param {React.MutableRefObject} apiRef The API of the grid.\n * @returns {GridParsedSortItem | null} The parsed sort item. Returns `null` is the sort item is not valid.\n */\n\n\nconst parseSortItem = (sortItem, apiRef) => {\n const column = apiRef.current.getColumn(sortItem.field);\n\n if (!column) {\n return null;\n }\n\n const comparator = isDesc(sortItem.sort) ? (...args) => -1 * column.sortComparator(...args) : column.sortComparator;\n\n const getSortCellParams = id => ({\n id,\n field: column.field,\n rowNode: apiRef.current.getRowNode(id),\n value: apiRef.current.getCellValue(id, column.field),\n api: apiRef.current\n });\n\n return {\n getSortCellParams,\n comparator\n };\n};\n/**\n * Compare two rows according to a list of valid sort items.\n * The `row1Params` and `row2Params` must have the same length as `parsedSortItems`,\n * and each of their index must contain the `GridSortCellParams` of the sort item with the same index.\n * @param {GridParsedSortItem[]} parsedSortItems All the sort items with which we want to compare the rows.\n * @param {GridSortCellParams} row1Params The params of the 1st row for each sort item.\n * @param {GridSortCellParams} row2Params The params of the 2nd row for each sort item.\n */\n\n\nconst compareRows = (parsedSortItems, row1Params, row2Params) => {\n return parsedSortItems.reduce((res, item, index) => {\n if (res !== 0) {\n // return the results of the first comparator which distinguish the two rows\n return res;\n }\n\n const sortCellParams1 = row1Params[index];\n const sortCellParams2 = row2Params[index];\n res = item.comparator(sortCellParams1.value, sortCellParams2.value, sortCellParams1, sortCellParams2);\n return res;\n }, 0);\n};\n/**\n * Generates a method to easily sort a list of rows according to the current sort model.\n * @param {GridSortModel} sortModel The model with which we want to sort the rows.\n * @param {React.MutableRefObject} apiRef The API of the grid.\n * @returns {GridSortingModelApplier | null} A method that generates a list of sorted row ids from a list of rows according to the current sort model. If `null`, we consider that the rows should remain in the order there were provided.\n */\n\n\nexport const buildAggregatedSortingApplier = (sortModel, apiRef) => {\n const comparatorList = sortModel.map(item => parseSortItem(item, apiRef)).filter(comparator => !!comparator);\n\n if (comparatorList.length === 0) {\n return null;\n }\n\n return rowList => rowList.map(value => ({\n value,\n params: comparatorList.map(el => el.getSortCellParams(value.id))\n })).sort((a, b) => compareRows(comparatorList, a.params, b.params)).map(row => row.value.id);\n};\nexport const getNextGridSortDirection = (sortingOrder, current) => {\n const currentIdx = sortingOrder.indexOf(current);\n\n if (!current || currentIdx === -1 || currentIdx + 1 === sortingOrder.length) {\n return sortingOrder[0];\n }\n\n return sortingOrder[currentIdx + 1];\n};\n\nconst gridNillComparator = (v1, v2) => {\n if (v1 == null && v2 != null) {\n return -1;\n }\n\n if (v2 == null && v1 != null) {\n return 1;\n }\n\n if (v1 == null && v2 == null) {\n return 0;\n }\n\n return null;\n};\n\nconst collator = new Intl.Collator();\nexport const gridStringOrNumberComparator = (value1, value2) => {\n const nillResult = gridNillComparator(value1, value2);\n\n if (nillResult !== null) {\n return nillResult;\n }\n\n if (typeof value1 === 'string') {\n return collator.compare(value1.toString(), value2.toString());\n }\n\n return value1 - value2;\n};\nexport const gridNumberComparator = (value1, value2) => {\n const nillResult = gridNillComparator(value1, value2);\n\n if (nillResult !== null) {\n return nillResult;\n }\n\n return Number(value1) - Number(value2);\n};\nexport const gridDateComparator = (value1, value2) => {\n const nillResult = gridNillComparator(value1, value2);\n\n if (nillResult !== null) {\n return nillResult;\n }\n\n if (value1 > value2) {\n return 1;\n }\n\n if (value1 < value2) {\n return -1;\n }\n\n return 0;\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"item\", \"applyValue\", \"type\", \"apiRef\", \"focusElementRef\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport Autocomplete from '@mui/material/Autocomplete';\nimport Chip from '@mui/material/Chip';\nimport TextField from '@mui/material/TextField';\nimport { unstable_useId as useId } from '@mui/material/utils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nfunction GridFilterInputMultipleValue(props) {\n const {\n item,\n applyValue,\n type,\n apiRef,\n focusElementRef\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const [filterValueState, setFilterValueState] = React.useState(item.value || []);\n const id = useId();\n React.useEffect(() => {\n var _item$value;\n\n const itemValue = (_item$value = item.value) != null ? _item$value : [];\n setFilterValueState(itemValue.map(String));\n }, [item.value]);\n const handleChange = React.useCallback((event, value) => {\n setFilterValueState(value.map(String));\n applyValue(_extends({}, item, {\n value: [...value]\n }));\n }, [applyValue, item]);\n return /*#__PURE__*/_jsx(Autocomplete, _extends({\n multiple: true,\n freeSolo: true,\n limitTags: 1,\n options: [],\n filterOptions: (options, params) => {\n const {\n inputValue\n } = params;\n return inputValue == null || inputValue === '' ? [] : [inputValue];\n },\n id: id,\n value: filterValueState,\n onChange: handleChange,\n renderTags: (value, getTagProps) => value.map((option, index) => /*#__PURE__*/_jsx(Chip, _extends({\n variant: \"outlined\",\n size: \"small\",\n label: option\n }, getTagProps({\n index\n })))),\n renderInput: params => /*#__PURE__*/_jsx(TextField, _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: type || 'text',\n variant: \"standard\"\n }))\n }, other));\n}\n\nprocess.env.NODE_ENV !== \"production\" ? GridFilterInputMultipleValue.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.any.isRequired,\n applyValue: PropTypes.func.isRequired,\n focusElementRef: PropTypes\n /* @typescript-to-proptypes-ignore */\n .oneOfType([PropTypes.func, PropTypes.object]),\n item: PropTypes.shape({\n columnField: PropTypes.string.isRequired,\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n operatorValue: PropTypes.string,\n value: PropTypes.any\n }).isRequired,\n type: PropTypes.oneOf(['number', 'text'])\n} : void 0;\nexport { GridFilterInputMultipleValue };","import { GridFilterInputValue } from '../components/panel/filterPanel/GridFilterInputValue';\nimport { escapeRegExp } from '../utils/utils';\nimport { GridFilterInputMultipleValue } from '../components/panel/filterPanel/GridFilterInputMultipleValue';\nexport const getGridStringQuickFilterFn = value => {\n if (!value) {\n return null;\n }\n\n const filterRegex = new RegExp(escapeRegExp(value), 'i');\n return ({\n value: columnValue\n }) => {\n return columnValue != null ? filterRegex.test(columnValue.toString()) : false;\n };\n};\nexport const getGridStringOperators = () => [{\n value: 'contains',\n getApplyFilterFn: filterItem => {\n if (!filterItem.value) {\n return null;\n }\n\n const filterRegex = new RegExp(escapeRegExp(filterItem.value), 'i');\n return ({\n value\n }) => {\n return value != null ? filterRegex.test(value.toString()) : false;\n };\n },\n InputComponent: GridFilterInputValue\n}, {\n value: 'equals',\n getApplyFilterFn: filterItem => {\n if (!filterItem.value) {\n return null;\n }\n\n const collator = new Intl.Collator(undefined, {\n sensitivity: 'base',\n usage: 'search'\n });\n return ({\n value\n }) => {\n return value != null ? collator.compare(filterItem.value, value.toString()) === 0 : false;\n };\n },\n InputComponent: GridFilterInputValue\n}, {\n value: 'startsWith',\n getApplyFilterFn: filterItem => {\n if (!filterItem.value) {\n return null;\n }\n\n const filterRegex = new RegExp(`^${escapeRegExp(filterItem.value)}.*$`, 'i');\n return ({\n value\n }) => {\n return value != null ? filterRegex.test(value.toString()) : false;\n };\n },\n InputComponent: GridFilterInputValue\n}, {\n value: 'endsWith',\n getApplyFilterFn: filterItem => {\n if (!filterItem.value) {\n return null;\n }\n\n const filterRegex = new RegExp(`.*${escapeRegExp(filterItem.value)}$`, 'i');\n return ({\n value\n }) => {\n return value != null ? filterRegex.test(value.toString()) : false;\n };\n },\n InputComponent: GridFilterInputValue\n}, {\n value: 'isEmpty',\n getApplyFilterFn: () => {\n return ({\n value\n }) => {\n return value === '' || value == null;\n };\n }\n}, {\n value: 'isNotEmpty',\n getApplyFilterFn: () => {\n return ({\n value\n }) => {\n return value !== '' && value != null;\n };\n }\n}, {\n value: 'isAnyOf',\n getApplyFilterFn: filterItem => {\n if (!Array.isArray(filterItem.value) || filterItem.value.length === 0) {\n return null;\n }\n\n const collator = new Intl.Collator(undefined, {\n sensitivity: 'base',\n usage: 'search'\n });\n return ({\n value\n }) => value != null ? filterItem.value.some(filterValue => {\n return collator.compare(filterValue, value.toString() || '') === 0;\n }) : false;\n },\n InputComponent: GridFilterInputMultipleValue\n}];","import { renderEditInputCell } from '../components/cell/GridEditInputCell';\nimport { gridStringOrNumberComparator } from '../hooks/features/sorting/gridSortingUtils';\nimport { getGridStringOperators, getGridStringQuickFilterFn } from './gridStringOperators';\nexport const GRID_STRING_COL_DEF = {\n width: 100,\n minWidth: 50,\n maxWidth: Infinity,\n hide: false,\n hideable: true,\n sortable: true,\n resizable: true,\n filterable: true,\n groupable: true,\n pinnable: true,\n editable: false,\n sortComparator: gridStringOrNumberComparator,\n type: 'string',\n align: 'left',\n filterOperators: getGridStringOperators(),\n renderEditCell: renderEditInputCell,\n getApplyQuickFilterFn: getGridStringQuickFilterFn\n};","import { GridFilterInputValue } from '../components/panel/filterPanel/GridFilterInputValue';\nimport { GridFilterInputMultipleValue } from '../components/panel/filterPanel/GridFilterInputMultipleValue';\nimport { wrapWithWarningOnCall } from '../utils/warning';\n\nconst parseNumericValue = value => {\n if (value == null) {\n return null;\n }\n\n return Number(value);\n};\n\nexport const getGridNumericQuickFilterFn = value => {\n if (value == null || Number.isNaN(value) || value === '') {\n return null;\n }\n\n return ({\n value: columnValue\n }) => {\n return parseNumericValue(columnValue) === parseNumericValue(value);\n };\n};\nexport const getGridNumericOperators = () => [{\n label: '=',\n value: '=',\n getApplyFilterFn: filterItem => {\n if (filterItem.value == null || Number.isNaN(filterItem.value)) {\n return null;\n }\n\n return ({\n value\n }) => {\n return parseNumericValue(value) === filterItem.value;\n };\n },\n InputComponent: GridFilterInputValue,\n InputComponentProps: {\n type: 'number'\n }\n}, {\n label: '!=',\n value: '!=',\n getApplyFilterFn: filterItem => {\n if (filterItem.value == null || Number.isNaN(filterItem.value)) {\n return null;\n }\n\n return ({\n value\n }) => {\n return parseNumericValue(value) !== filterItem.value;\n };\n },\n InputComponent: GridFilterInputValue,\n InputComponentProps: {\n type: 'number'\n }\n}, {\n label: '>',\n value: '>',\n getApplyFilterFn: filterItem => {\n if (filterItem.value == null || Number.isNaN(filterItem.value)) {\n return null;\n }\n\n return ({\n value\n }) => {\n if (value == null) {\n return false;\n }\n\n return parseNumericValue(value) > filterItem.value;\n };\n },\n InputComponent: GridFilterInputValue,\n InputComponentProps: {\n type: 'number'\n }\n}, {\n label: '>=',\n value: '>=',\n getApplyFilterFn: filterItem => {\n if (filterItem.value == null || Number.isNaN(filterItem.value)) {\n return null;\n }\n\n return ({\n value\n }) => {\n if (value == null) {\n return false;\n }\n\n return parseNumericValue(value) >= filterItem.value;\n };\n },\n InputComponent: GridFilterInputValue,\n InputComponentProps: {\n type: 'number'\n }\n}, {\n label: '<',\n value: '<',\n getApplyFilterFn: filterItem => {\n if (filterItem.value == null || Number.isNaN(filterItem.value)) {\n return null;\n }\n\n return ({\n value\n }) => {\n if (value == null) {\n return false;\n }\n\n return parseNumericValue(value) < filterItem.value;\n };\n },\n InputComponent: GridFilterInputValue,\n InputComponentProps: {\n type: 'number'\n }\n}, {\n label: '<=',\n value: '<=',\n getApplyFilterFn: filterItem => {\n if (filterItem.value == null || Number.isNaN(filterItem.value)) {\n return null;\n }\n\n return ({\n value\n }) => {\n if (value == null) {\n return false;\n }\n\n return parseNumericValue(value) <= filterItem.value;\n };\n },\n InputComponent: GridFilterInputValue,\n InputComponentProps: {\n type: 'number'\n }\n}, {\n value: 'isEmpty',\n getApplyFilterFn: () => {\n return ({\n value\n }) => {\n return value == null;\n };\n }\n}, {\n value: 'isNotEmpty',\n getApplyFilterFn: () => {\n return ({\n value\n }) => {\n return value != null;\n };\n }\n}, {\n value: 'isAnyOf',\n getApplyFilterFn: filterItem => {\n if (!Array.isArray(filterItem.value) || filterItem.value.length === 0) {\n return null;\n }\n\n return ({\n value\n }) => {\n return value != null && filterItem.value.includes(Number(value));\n };\n },\n InputComponent: GridFilterInputMultipleValue,\n InputComponentProps: {\n type: 'number'\n }\n}];\n/**\n * @deprecated Use `getGridNumericOperators` instead.\n */\n\nexport const getGridNumericColumnOperators = wrapWithWarningOnCall(getGridNumericOperators, ['MUI: The method getGridNumericColumnOperators is deprecated and will be removed in the next major version.', 'Use getGridNumericOperators instead.']);","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';\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: getGridNumericQuickFilterFn\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\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_useId as useId } from '@mui/material/utils';\nimport { GridLoadIcon } from '../../icons';\nimport { useGridRootProps } from '../../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const SUBMIT_FILTER_DATE_STROKE_TIME = 500;\n\nfunction GridFilterInputDate(props) {\n var _item$value, _rootProps$components;\n\n const {\n item,\n applyValue,\n type,\n apiRef,\n focusElementRef,\n InputProps\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const filterTimeout = React.useRef();\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 clearTimeout(filterTimeout.current);\n setFilterValueState(String(value));\n setIsApplying(true);\n filterTimeout.current = setTimeout(() => {\n applyValue(_extends({}, item, {\n value\n }));\n setIsApplying(false);\n }, SUBMIT_FILTER_DATE_STROKE_TIME);\n }, [applyValue, item]);\n React.useEffect(() => {\n return () => {\n clearTimeout(filterTimeout.current);\n };\n }, []);\n React.useEffect(() => {\n var _item$value2;\n\n const itemValue = (_item$value2 = item.value) != null ? _item$value2 : '';\n setFilterValueState(String(itemValue));\n }, [item.value]);\n return /*#__PURE__*/_jsx(rootProps.components.BaseTextField, _extends({\n id: id,\n label: apiRef.current.getLocaleText('filterPanelInputLabel'),\n placeholder: apiRef.current.getLocaleText('filterPanelInputPlaceholder'),\n value: filterValueState,\n onChange: onFilterChange,\n type: type || 'text',\n variant: \"standard\",\n InputLabelProps: {\n shrink: true\n },\n inputRef: focusElementRef,\n InputProps: _extends({}, applying ? {\n endAdornment: /*#__PURE__*/_jsx(GridLoadIcon, {})\n } : {}, InputProps, {\n inputProps: _extends({\n max: type === 'datetime-local' ? '9999-12-31T23:59' : '9999-12-31'\n }, InputProps == null ? void 0 : InputProps.inputProps)\n })\n }, other, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.baseTextField));\n}\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.any.isRequired,\n applyValue: PropTypes.func.isRequired,\n focusElementRef: PropTypes\n /* @typescript-to-proptypes-ignore */\n .oneOfType([PropTypes.func, PropTypes.object]),\n item: PropTypes.shape({\n columnField: PropTypes.string.isRequired,\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n operatorValue: PropTypes.string,\n value: PropTypes.any\n }).isRequired\n} : void 0;\nexport { GridFilterInputDate };","import { GridFilterInputDate } from '../components/panel/filterPanel/GridFilterInputDate';\nconst dateRegex = /(\\d+)-(\\d+)-(\\d+)/;\nconst dateTimeRegex = /(\\d+)-(\\d+)-(\\d+)T(\\d+):(\\d+)/;\n\nfunction buildApplyFilterFn(filterItem, compareFn, showTime, keepHours) {\n if (!filterItem.value) {\n return null;\n }\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 ({\n value\n }) => {\n if (!value) {\n return false;\n }\n\n const valueAsDate = value instanceof Date ? value : new Date(value.toString());\n\n if (keepHours) {\n return compareFn(valueAsDate.getTime(), time);\n } // Make a copy of the date to not reset the hours in the original object\n\n\n const dateCopy = value instanceof Date ? new Date(valueAsDate) : valueAsDate;\n const timeToCompare = dateCopy.setHours(showTime ? valueAsDate.getHours() : 0, showTime ? valueAsDate.getMinutes() : 0, 0, 0);\n return compareFn(timeToCompare, time);\n };\n}\n\nexport const getGridDateOperators = showTime => [{\n value: 'is',\n getApplyFilterFn: 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 getApplyFilterFn: 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 getApplyFilterFn: 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 getApplyFilterFn: 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 getApplyFilterFn: 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 getApplyFilterFn: 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 getApplyFilterFn: () => {\n return ({\n value\n }) => {\n return value == null;\n };\n }\n}, {\n value: 'isNotEmpty',\n getApplyFilterFn: () => {\n return ({\n value\n }) => {\n return value != null;\n };\n }\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\", \"getValue\", \"inputProps\", \"isValidating\", \"isProcessingProps\", \"onValueChange\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/material/utils';\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\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['editInputCell']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\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\n const isDateTime = colDef.type === 'dateTime';\n const apiRef = useGridApiContext();\n const inputRef = React.useRef();\n const valueTransformed = React.useMemo(() => {\n let parsedDate;\n\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\n let formattedDate;\n\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\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 handleChange = React.useCallback(async event => {\n const newFormattedDate = event.target.value;\n let newParsedDate;\n\n if (newFormattedDate === '') {\n newParsedDate = null;\n } else {\n const [date, time] = newFormattedDate.split('T');\n const [year, month, day] = date.split('-');\n newParsedDate = new Date();\n newParsedDate.setFullYear(year, Number(month) - 1, day);\n newParsedDate.setHours(0, 0, 0, 0);\n\n if (time) {\n const [hours, minutes] = time.split(':');\n newParsedDate.setHours(Number(hours), Number(minutes), 0, 0);\n }\n }\n\n if (onValueChange) {\n await onValueChange(event, newParsedDate);\n }\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]);\n React.useEffect(() => {\n setValueState(state => {\n var _valueTransformed$par, _state$parsed;\n\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\n return state;\n });\n }, [valueTransformed]);\n useEnhancedEffect(() => {\n if (hasFocus) {\n inputRef.current.focus();\n }\n }, [hasFocus]);\n return /*#__PURE__*/_jsx(InputBase, _extends({\n inputRef: inputRef,\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}\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 /**\n * GridApi that let you manipulate the grid.\n * @deprecated Use the `apiRef` returned by `useGridApiContext` or `useGridApiRef` (only available in `@mui/x-data-grid-pro`)\n */\n api: PropTypes.any.isRequired,\n\n /**\n * The mode of the cell.\n */\n cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,\n\n /**\n * The column of the row that the current cell belongs to.\n */\n colDef: PropTypes.object.isRequired,\n\n /**\n * The column field of the cell that triggered the event.\n */\n field: PropTypes.string.isRequired,\n\n /**\n * The cell value formatted with the column valueFormatter.\n */\n formattedValue: PropTypes.any,\n\n /**\n * Get the cell value of a row and field.\n * @param {GridRowId} id The row id.\n * @param {string} field The field.\n * @returns {any} The cell value.\n * @deprecated Use `params.row` to directly access the fields you want instead.\n */\n getValue: PropTypes.func.isRequired,\n\n /**\n * If true, the cell is the active element.\n */\n hasFocus: PropTypes.bool.isRequired,\n\n /**\n * The grid row id.\n */\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n\n /**\n * If true, the cell is editable.\n */\n isEditable: PropTypes.bool,\n isProcessingProps: PropTypes.bool,\n isValidating: PropTypes.bool,\n\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 /**\n * The row model of the row that the current cell belongs to.\n */\n row: PropTypes.object.isRequired,\n\n /**\n * The node of the row that the current cell belongs to.\n */\n rowNode: PropTypes.object.isRequired,\n\n /**\n * the tabIndex value.\n */\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\n\n /**\n * The cell value, but if the column has valueGetter, use getValue.\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';\nexport function gridDateFormatter({\n value\n}) {\n if (value instanceof Date) {\n return value.toLocaleDateString();\n }\n\n return value != null ? value : '';\n}\nexport function gridDateTimeFormatter({\n value\n}) {\n if (value instanceof Date) {\n return value.toLocaleString();\n }\n\n return value != null ? value : '';\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 getApplyQuickFilterFn: undefined\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 getApplyQuickFilterFn: 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\", \"getValue\"];\nimport * as React from 'react';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\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\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['booleanCell']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nexport const GridBooleanCell = /*#__PURE__*/React.memo(props => {\n const {\n value\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\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.components.BooleanCellTrueIcon : rootProps.components.BooleanCellFalseIcon, [rootProps.components.BooleanCellFalseIcon, rootProps.components.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});\nexport const renderBooleanCell = params => {\n if (params.rowNode.isAutoGenerated) {\n return '';\n }\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\", \"getValue\", \"hasFocus\", \"isValidating\", \"isProcessingProps\", \"error\", \"onValueChange\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { unstable_useId as useId, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/material/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\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['editBooleanCell']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nfunction GridEditBooleanCell(props) {\n var _rootProps$components;\n\n const {\n id: idProp,\n value,\n field,\n className,\n hasFocus,\n onValueChange\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\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\n if (onValueChange) {\n await onValueChange(event, newValue);\n }\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.components.BaseCheckbox, _extends({\n id: id,\n inputRef: inputRef,\n checked: Boolean(valueState),\n onChange: handleChange,\n size: \"small\"\n }, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.baseCheckbox))\n }));\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 /**\n * GridApi that let you manipulate the grid.\n * @deprecated Use the `apiRef` returned by `useGridApiContext` or `useGridApiRef` (only available in `@mui/x-data-grid-pro`)\n */\n api: PropTypes.any.isRequired,\n\n /**\n * The mode of the cell.\n */\n cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,\n\n /**\n * The column of the row that the current cell belongs to.\n */\n colDef: PropTypes.object.isRequired,\n\n /**\n * The column field of the cell that triggered the event.\n */\n field: PropTypes.string.isRequired,\n\n /**\n * The cell value formatted with the column valueFormatter.\n */\n formattedValue: PropTypes.any,\n\n /**\n * Get the cell value of a row and field.\n * @param {GridRowId} id The row id.\n * @param {string} field The field.\n * @returns {any} The cell value.\n * @deprecated Use `params.row` to directly access the fields you want instead.\n */\n getValue: PropTypes.func.isRequired,\n\n /**\n * If true, the cell is the active element.\n */\n hasFocus: PropTypes.bool.isRequired,\n\n /**\n * The grid row id.\n */\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n\n /**\n * If true, the cell is editable.\n */\n isEditable: PropTypes.bool,\n isProcessingProps: PropTypes.bool,\n isValidating: PropTypes.bool,\n\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 /**\n * The row model of the row that the current cell belongs to.\n */\n row: PropTypes.object.isRequired,\n\n /**\n * The node of the row that the current cell belongs to.\n */\n rowNode: PropTypes.object.isRequired,\n\n /**\n * the tabIndex value.\n */\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\n\n /**\n * The cell value, but if the column has valueGetter, use getValue.\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\"];\nimport * as React from 'react';\nimport MenuItem from '@mui/material/MenuItem';\nimport { useGridRootProps } from '../../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nexport function GridFilterInputBoolean(props) {\n var _rootProps$components, _baseSelectProps$nati, _rootProps$components2, _rootProps$components3;\n\n const {\n item,\n applyValue,\n apiRef,\n focusElementRef\n } = props,\n others = _objectWithoutPropertiesLoose(props, _excluded);\n\n const [filterValueState, setFilterValueState] = React.useState(item.value || '');\n const rootProps = useGridRootProps();\n const baseSelectProps = ((_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.baseSelect) || {};\n const isSelectNative = (_baseSelectProps$nati = baseSelectProps.native) != null ? _baseSelectProps$nati : true;\n const OptionComponent = isSelectNative ? 'option' : MenuItem;\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 return /*#__PURE__*/_jsxs(rootProps.components.BaseTextField, _extends({\n label: apiRef.current.getLocaleText('filterPanelInputLabel'),\n value: filterValueState,\n onChange: onFilterChange,\n variant: \"standard\",\n select: true,\n SelectProps: _extends({\n native: isSelectNative,\n displayEmpty: true\n }, (_rootProps$components2 = rootProps.componentsProps) == null ? void 0 : _rootProps$components2.baseSelect),\n InputLabelProps: {\n shrink: true\n },\n inputRef: focusElementRef\n }, others, (_rootProps$components3 = rootProps.componentsProps) == null ? void 0 : _rootProps$components3.baseTextField, {\n children: [/*#__PURE__*/_jsx(OptionComponent, {\n value: \"\",\n children: apiRef.current.getLocaleText('filterValueAny')\n }), /*#__PURE__*/_jsx(OptionComponent, {\n value: \"true\",\n children: apiRef.current.getLocaleText('filterValueTrue')\n }), /*#__PURE__*/_jsx(OptionComponent, {\n value: \"false\",\n children: apiRef.current.getLocaleText('filterValueFalse')\n })]\n }));\n}","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';\n\nfunction gridBooleanFormatter({\n value,\n api\n}) {\n return value ? api.getLocaleText('booleanCellTrueLabel') : api.getLocaleText('booleanCellFalseLabel');\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});","// TODO v6: rename to GridEditingState\nvar GridEditModes;\n\n(function (GridEditModes) {\n GridEditModes[\"Cell\"] = \"cell\";\n GridEditModes[\"Row\"] = \"row\";\n})(GridEditModes || (GridEditModes = {}));\n\nvar GridCellModes;\n\n(function (GridCellModes) {\n GridCellModes[\"Edit\"] = \"edit\";\n GridCellModes[\"View\"] = \"view\";\n})(GridCellModes || (GridCellModes = {}));\n\nvar GridRowModes;\n\n(function (GridRowModes) {\n GridRowModes[\"Edit\"] = \"edit\";\n GridRowModes[\"View\"] = \"view\";\n})(GridRowModes || (GridRowModes = {}));\n\nexport { GridEditModes, GridCellModes, GridRowModes };","import { GridFilterInputBoolean } from '../components/panel/filterPanel/GridFilterInputBoolean';\nexport const getGridBooleanOperators = () => [{\n value: 'is',\n getApplyFilterFn: filterItem => {\n if (!filterItem.value) {\n return null;\n }\n\n const valueAsBoolean = filterItem.value === 'true';\n return ({\n value\n }) => {\n return Boolean(value) === valueAsBoolean;\n };\n },\n InputComponent: GridFilterInputBoolean\n}];","export const isEscapeKey = key => key === 'Escape'; // TODO remove\n\nexport const isEnterKey = key => key === 'Enter'; // TODO remove\n\nexport const isTabKey = key => key === 'Tab'; // TODO remove\n\nexport const isSpaceKey = key => key === ' ';\nexport const isArrowKeys = key => key.indexOf('Arrow') === 0;\nexport const isHomeOrEndKeys = key => key === 'Home' || key === 'End';\nexport const isPageKeys = key => key.indexOf('Page') === 0;\nexport const isDeleteKeys = key => key === 'Delete' || key === 'Backspace';\nconst printableCharRegex = /^(\\p{L}|\\p{M}\\p{L}|\\p{M}|\\p{N}|\\p{Z}|\\p{S}|\\p{P})$/iu;\nexport const isPrintableKey = key => printableCharRegex.test(key);\nexport const GRID_MULTIPLE_SELECTION_KEYS = ['Meta', 'Control', 'Shift'];\nexport const GRID_CELL_EXIT_EDIT_MODE_KEYS = ['Enter', 'Escape', 'Tab'];\nexport const GRID_CELL_EDIT_COMMIT_KEYS = ['Enter', 'Tab'];\nexport const isMultipleKey = key => GRID_MULTIPLE_SELECTION_KEYS.indexOf(key) > -1;\nexport const isCellEnterEditModeKeys = key => isEnterKey(key) || isDeleteKeys(key) || isPrintableKey(key);\nexport const isCellExitEditModeKeys = key => GRID_CELL_EXIT_EDIT_MODE_KEYS.indexOf(key) > -1;\nexport const isCellEditCommitKeys = key => GRID_CELL_EDIT_COMMIT_KEYS.indexOf(key) > -1;\nexport const isNavigationKey = key => isHomeOrEndKeys(key) || isArrowKeys(key) || isPageKeys(key) || isSpaceKey(key);\nexport const isKeyboardEvent = event => !!event.key;\nexport const isHideMenuKey = key => isTabKey(key) || isEscapeKey(key);","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\", \"getValue\", \"hasFocus\", \"isValidating\", \"isProcessingProps\", \"error\", \"onValueChange\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/material/utils';\nimport MenuItem from '@mui/material/MenuItem';\nimport { isEscapeKey } from '../../utils/keyboardUtils';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { GridEditModes } from '../../models/gridEditRowModel';\nimport { getValueFromValueOptions } from '../panel/filterPanel/filterPanelUtils';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst renderSingleSelectOptions = (option, OptionComponent) => {\n const isOptionTypeObject = typeof option === 'object';\n const key = isOptionTypeObject ? option.value : option;\n const value = isOptionTypeObject ? option.value : option;\n const content = isOptionTypeObject ? option.label : option;\n return /*#__PURE__*/_jsx(OptionComponent, {\n value: value,\n children: content\n }, key);\n};\n\nfunction GridEditSingleSelectCell(props) {\n var _rootProps$components, _baseSelectProps$nati, _rootProps$components2;\n\n const {\n id,\n value,\n api,\n field,\n row,\n colDef,\n hasFocus,\n error,\n onValueChange\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const apiRef = useGridApiContext();\n const ref = React.useRef();\n const inputRef = React.useRef();\n const rootProps = useGridRootProps();\n const [open, setOpen] = React.useState(rootProps.editMode === 'cell');\n const baseSelectProps = ((_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.baseSelect) || {};\n const isSelectNative = (_baseSelectProps$nati = baseSelectProps.native) != null ? _baseSelectProps$nati : false;\n let valueOptionsFormatted;\n\n if (typeof colDef.valueOptions === 'function') {\n valueOptionsFormatted = colDef.valueOptions({\n id,\n row,\n field\n });\n } else {\n valueOptionsFormatted = colDef.valueOptions;\n }\n\n if (colDef.valueFormatter) {\n valueOptionsFormatted = valueOptionsFormatted.map(option => {\n if (typeof option === 'object') {\n return option;\n }\n\n const params = {\n field,\n api,\n value: option\n };\n return {\n value: option,\n label: String(colDef.valueFormatter(params))\n };\n });\n }\n\n const handleChange = async event => {\n var _rootProps$experiment;\n\n setOpen(false);\n const target = event.target; // NativeSelect casts the value to a string.\n\n const formattedTargetValue = getValueFromValueOptions(target.value, valueOptionsFormatted);\n\n if (onValueChange) {\n await onValueChange(event, formattedTargetValue);\n }\n\n const isValid = await apiRef.current.setEditCellValue({\n id,\n field,\n value: formattedTargetValue\n }, event);\n\n if ((_rootProps$experiment = rootProps.experimentalFeatures) != null && _rootProps$experiment.newEditingApi) {\n return;\n } // We use isValid === false because the default return is undefined which evaluates to true with !isValid\n\n\n if (rootProps.editMode === GridEditModes.Row || isValid === false) {\n return;\n }\n\n const canCommit = await Promise.resolve(apiRef.current.commitCellChange({\n id,\n field\n }, event));\n\n if (canCommit) {\n apiRef.current.setCellMode(id, field, 'view');\n\n if (event.key) {\n // TODO v6: remove once we stop ignoring events fired from portals\n const params = apiRef.current.getCellParams(id, field);\n apiRef.current.publishEvent('cellNavigationKeyDown', params, event);\n }\n }\n };\n\n const handleClose = (event, reason) => {\n if (rootProps.editMode === GridEditModes.Row) {\n setOpen(false);\n return;\n }\n\n if (reason === 'backdropClick' || isEscapeKey(event.key)) {\n var _rootProps$experiment2;\n\n if ((_rootProps$experiment2 = rootProps.experimentalFeatures) != null && _rootProps$experiment2.newEditingApi) {\n apiRef.current.stopCellEditMode({\n id,\n field,\n ignoreModifications: true\n });\n } else {\n apiRef.current.setCellMode(id, field, 'view');\n }\n }\n };\n\n const handleOpen = () => {\n setOpen(true);\n };\n\n useEnhancedEffect(() => {\n if (hasFocus) {\n inputRef.current.focus();\n }\n }, [hasFocus]);\n return /*#__PURE__*/_jsx(rootProps.components.BaseSelect, _extends({\n ref: ref,\n inputRef: inputRef,\n value: value,\n onChange: handleChange,\n open: open,\n onOpen: handleOpen,\n MenuProps: {\n onClose: handleClose\n },\n error: error,\n native: isSelectNative,\n fullWidth: true\n }, other, (_rootProps$components2 = rootProps.componentsProps) == null ? void 0 : _rootProps$components2.baseSelect, {\n children: valueOptionsFormatted.map(valueOptions => renderSingleSelectOptions(valueOptions, isSelectNative ? 'option' : MenuItem))\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 /**\n * GridApi that let you manipulate the grid.\n * @deprecated Use the `apiRef` returned by `useGridApiContext` or `useGridApiRef` (only available in `@mui/x-data-grid-pro`)\n */\n api: PropTypes.any.isRequired,\n\n /**\n * The mode of the cell.\n */\n cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,\n\n /**\n * The column of the row that the current cell belongs to.\n */\n colDef: PropTypes.object.isRequired,\n\n /**\n * The column field of the cell that triggered the event.\n */\n field: PropTypes.string.isRequired,\n\n /**\n * The cell value formatted with the column valueFormatter.\n */\n formattedValue: PropTypes.any,\n\n /**\n * Get the cell value of a row and field.\n * @param {GridRowId} id The row id.\n * @param {string} field The field.\n * @returns {any} The cell value.\n * @deprecated Use `params.row` to directly access the fields you want instead.\n */\n getValue: PropTypes.func.isRequired,\n\n /**\n * If true, the cell is the active element.\n */\n hasFocus: PropTypes.bool.isRequired,\n\n /**\n * The grid row id.\n */\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n\n /**\n * If true, the cell is editable.\n */\n isEditable: PropTypes.bool,\n isProcessingProps: PropTypes.bool,\n isValidating: PropTypes.bool,\n\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 /**\n * The row model of the row that the current cell belongs to.\n */\n row: PropTypes.object.isRequired,\n\n /**\n * The node of the row that the current cell belongs to.\n */\n rowNode: PropTypes.object.isRequired,\n\n /**\n * the tabIndex value.\n */\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\n\n /**\n * The cell value, but if the column has valueGetter, use getValue.\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 _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"item\", \"applyValue\", \"type\", \"apiRef\", \"focusElementRef\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_useId as useId } from '@mui/material/utils';\nimport MenuItem from '@mui/material/MenuItem';\nimport { useGridRootProps } from '../../../hooks/utils/useGridRootProps';\nimport { getValueFromValueOptions } from './filterPanelUtils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst renderSingleSelectOptions = ({\n valueOptions,\n valueFormatter,\n field\n}, api, OptionComponent) => {\n const iterableColumnValues = typeof valueOptions === 'function' ? ['', ...valueOptions({\n field\n })] : ['', ...(valueOptions || [])];\n return iterableColumnValues.map(option => {\n const isOptionTypeObject = typeof option === 'object';\n const key = isOptionTypeObject ? option.value : option;\n const value = isOptionTypeObject ? option.value : option;\n const formattedValue = valueFormatter && option !== '' ? valueFormatter({\n value: option,\n field,\n api\n }) : option;\n const content = isOptionTypeObject ? option.label : formattedValue;\n return /*#__PURE__*/_jsx(OptionComponent, {\n value: value,\n children: content\n }, key);\n });\n};\n\nfunction GridFilterInputSingleSelect(props) {\n var _item$value, _rootProps$components, _baseSelectProps$nati, _rootProps$components2, _rootProps$components3;\n\n const {\n item,\n applyValue,\n type,\n apiRef,\n focusElementRef\n } = props,\n others = _objectWithoutPropertiesLoose(props, _excluded);\n\n const [filterValueState, setFilterValueState] = React.useState((_item$value = item.value) != null ? _item$value : '');\n const id = useId();\n const rootProps = useGridRootProps();\n const baseSelectProps = ((_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.baseSelect) || {};\n const isSelectNative = (_baseSelectProps$nati = baseSelectProps.native) != null ? _baseSelectProps$nati : true;\n const currentColumn = item.columnField ? apiRef.current.getColumn(item.columnField) : null;\n const currentValueOptions = React.useMemo(() => {\n return typeof currentColumn.valueOptions === 'function' ? currentColumn.valueOptions({\n field: currentColumn.field\n }) : currentColumn.valueOptions;\n }, [currentColumn]);\n const onFilterChange = React.useCallback(event => {\n let value = event.target.value; // NativeSelect casts the value to a string.\n\n value = getValueFromValueOptions(value, currentValueOptions);\n setFilterValueState(String(value));\n applyValue(_extends({}, item, {\n value\n }));\n }, [applyValue, item, currentValueOptions]);\n React.useEffect(() => {\n var _itemValue;\n\n let itemValue;\n\n if (currentValueOptions !== undefined) {\n // sanitize if valueOptions are provided\n itemValue = getValueFromValueOptions(item.value, currentValueOptions);\n\n if (itemValue !== item.value) {\n applyValue(_extends({}, item, {\n value: itemValue\n }));\n return;\n }\n } else {\n itemValue = item.value;\n }\n\n itemValue = (_itemValue = itemValue) != null ? _itemValue : '';\n setFilterValueState(String(itemValue));\n }, [item, currentValueOptions, applyValue]);\n return /*#__PURE__*/_jsx(rootProps.components.BaseTextField, _extends({\n id: id,\n label: apiRef.current.getLocaleText('filterPanelInputLabel'),\n placeholder: apiRef.current.getLocaleText('filterPanelInputPlaceholder'),\n value: filterValueState,\n onChange: onFilterChange,\n type: type || 'text',\n variant: \"standard\",\n InputLabelProps: {\n shrink: true\n },\n inputRef: focusElementRef,\n select: true,\n SelectProps: _extends({\n native: isSelectNative\n }, (_rootProps$components2 = rootProps.componentsProps) == null ? void 0 : _rootProps$components2.baseSelect)\n }, others, (_rootProps$components3 = rootProps.componentsProps) == null ? void 0 : _rootProps$components3.baseTextField, {\n children: renderSingleSelectOptions(apiRef.current.getColumn(item.columnField), apiRef.current, isSelectNative ? 'option' : MenuItem)\n }));\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.any.isRequired,\n applyValue: PropTypes.func.isRequired,\n focusElementRef: PropTypes\n /* @typescript-to-proptypes-ignore */\n .oneOfType([PropTypes.func, PropTypes.object]),\n item: PropTypes.shape({\n columnField: PropTypes.string.isRequired,\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n operatorValue: PropTypes.string,\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\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport Autocomplete, { createFilterOptions } from '@mui/material/Autocomplete';\nimport Chip from '@mui/material/Chip';\nimport TextField from '@mui/material/TextField';\nimport { unstable_useId as useId } from '@mui/material/utils';\nimport { getValueFromOption } from './filterPanelUtils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst isOptionEqualToValue = (option, value) => getValueFromOption(option) === getValueFromOption(value);\n\nconst filter = createFilterOptions();\n\nfunction GridFilterInputMultipleSingleSelect(props) {\n const {\n item,\n applyValue,\n apiRef,\n focusElementRef\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const id = useId();\n const resolvedColumn = item.columnField ? apiRef.current.getColumn(item.columnField) : null;\n const resolvedValueOptions = React.useMemo(() => {\n if (!(resolvedColumn != null && resolvedColumn.valueOptions)) {\n return [];\n }\n\n if (typeof resolvedColumn.valueOptions === 'function') {\n return resolvedColumn.valueOptions({\n field: resolvedColumn.field\n });\n }\n\n return resolvedColumn.valueOptions;\n }, [resolvedColumn]);\n const resolvedFormattedValueOptions = React.useMemo(() => {\n return resolvedValueOptions == null ? void 0 : resolvedValueOptions.map(getValueFromOption);\n }, [resolvedValueOptions]);\n const {\n valueFormatter,\n field\n } = apiRef.current.getColumn(item.columnField);\n\n const filterValueOptionFormatter = option => {\n if (typeof option === 'object') {\n return option.label;\n }\n\n return valueFormatter && option !== '' ? valueFormatter({\n value: option,\n field,\n api: apiRef.current\n }) : option;\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\n\n const filterValues = React.useMemo(() => {\n if (!Array.isArray(item.value)) {\n return [];\n }\n\n if (resolvedValueOptions !== undefined) {\n const itemValueIndexes = item.value.map(element => {\n // get the index matching between values and valueoptions\n const formattedElement = getValueFromOption(element);\n const index = (resolvedFormattedValueOptions == null ? void 0 : resolvedFormattedValueOptions.findIndex(formatedOption => formatedOption === formattedElement)) || 0;\n return index;\n });\n return itemValueIndexes.filter(index => index >= 0).map(index => resolvedValueOptions[index]);\n }\n\n return item.value;\n }, [item.value, resolvedValueOptions, resolvedFormattedValueOptions]);\n React.useEffect(() => {\n if (!Array.isArray(item.value) || filterValues.length !== item.value.length) {\n // update the state if the filter value has been cleaned by the component\n applyValue(_extends({}, item, {\n value: filterValues.map(getValueFromOption)\n }));\n }\n }, [item, filterValues, applyValue]);\n const handleChange = React.useCallback((event, value) => {\n applyValue(_extends({}, item, {\n value: [...value.map(getValueFromOption)]\n }));\n }, [applyValue, item]);\n return /*#__PURE__*/_jsx(Autocomplete, _extends({\n multiple: true,\n limitTags: 1,\n options: resolvedValueOptions,\n isOptionEqualToValue: isOptionEqualToValue,\n filterOptions: filter,\n id: id,\n value: filterValues,\n onChange: handleChange,\n renderTags: (value, getTagProps) => value.map((option, index) => /*#__PURE__*/_jsx(Chip, _extends({\n variant: \"outlined\",\n size: \"small\",\n label: filterValueOptionFormatter(option)\n }, getTagProps({\n index\n })))),\n renderInput: params => /*#__PURE__*/_jsx(TextField, _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 variant: \"standard\"\n }))\n }, other));\n}\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\n /* @typescript-to-proptypes-ignore */\n .oneOfType([PropTypes.func, PropTypes.object]),\n item: PropTypes.shape({\n columnField: PropTypes.string.isRequired,\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n operatorValue: PropTypes.string,\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';\n\nconst parseObjectValue = value => {\n if (value == null || typeof value !== 'object') {\n return value;\n }\n\n return value.value;\n};\n\nexport const getGridSingleSelectQuickFilterFn = (value, column, apiRef) => {\n if (!value) {\n return null;\n }\n\n const {\n valueOptions,\n valueFormatter,\n field\n } = column;\n const potentialValues = [parseObjectValue(value).toString()];\n const iterableColumnValues = typeof valueOptions === 'function' ? valueOptions({\n field\n }) : valueOptions || [];\n\n if (iterableColumnValues) {\n iterableColumnValues.forEach(option => {\n // for each valueOption, check if the formatted value\n let optionValue;\n let optionLabel;\n\n if (typeof option === 'object') {\n optionValue = option.value;\n optionLabel = option.label;\n } else {\n optionValue = option;\n\n if (valueFormatter) {\n optionLabel = valueFormatter({\n value: option,\n field,\n api: apiRef.current\n });\n } else {\n optionLabel = option;\n }\n }\n\n if (optionLabel.slice(0, value.length).toLowerCase() === value.toLowerCase()) {\n if (!potentialValues.includes(optionValue)) {\n potentialValues.push(optionValue.toString());\n }\n }\n });\n }\n\n return ({\n value: columnValue\n }) => {\n return columnValue != null ? potentialValues.includes(parseObjectValue(columnValue).toString()) : false;\n };\n};\nexport const getGridSingleSelectOperators = () => [{\n value: 'is',\n getApplyFilterFn: filterItem => {\n if (filterItem.value == null || filterItem.value === '') {\n return null;\n }\n\n return ({\n value\n }) => parseObjectValue(value) === parseObjectValue(filterItem.value);\n },\n InputComponent: GridFilterInputSingleSelect\n}, {\n value: 'not',\n getApplyFilterFn: filterItem => {\n if (filterItem.value == null || filterItem.value === '') {\n return null;\n }\n\n return ({\n value\n }) => parseObjectValue(value) !== parseObjectValue(filterItem.value);\n },\n InputComponent: GridFilterInputSingleSelect\n}, {\n value: 'isAnyOf',\n getApplyFilterFn: filterItem => {\n if (!Array.isArray(filterItem.value) || filterItem.value.length === 0) {\n return null;\n }\n\n const filterItemValues = filterItem.value.map(parseObjectValue);\n return ({\n value\n }) => filterItemValues.includes(parseObjectValue(value));\n },\n InputComponent: GridFilterInputMultipleSingleSelect\n}];","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { GRID_STRING_COL_DEF } from './gridStringColDef';\nimport { renderEditSingleSelectCell } from '../components/cell/GridEditSingleSelectCell';\nimport { getGridSingleSelectOperators, getGridSingleSelectQuickFilterFn } from './gridSingleSelectOperators';\nexport const GRID_SINGLE_SELECT_COL_DEF = _extends({}, GRID_STRING_COL_DEF, {\n type: 'singleSelect',\n renderEditCell: renderEditSingleSelectCell,\n filterOperators: getGridSingleSelectOperators(),\n getApplyQuickFilterFn: getGridSingleSelectQuickFilterFn\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"open\", \"target\", \"onClickAway\", \"children\", \"position\", \"className\", \"onExited\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport ClickAwayListener from '@mui/material/ClickAwayListener';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport Grow from '@mui/material/Grow';\nimport Paper from '@mui/material/Paper';\nimport Popper from '@mui/material/Popper';\nimport { styled } from '@mui/material/styles';\nimport { HTMLElementType } from '@mui/utils';\nimport { getDataGridUtilityClass, gridClasses } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['menu']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst GridMenuRoot = styled(Popper, {\n name: 'MuiDataGrid',\n slot: 'Menu',\n overridesResolver: (props, styles) => styles.menu\n})(({\n theme\n}) => ({\n zIndex: theme.zIndex.modal,\n [`& .${gridClasses.menuList}`]: {\n outline: 0\n }\n}));\nconst transformOrigin = {\n 'bottom-start': 'top left',\n 'bottom-end': 'top right'\n};\n\nconst GridMenu = props => {\n var _rootProps$components;\n\n const {\n open,\n target,\n onClickAway,\n children,\n position,\n className,\n onExited\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const apiRef = useGridApiContext();\n const prevTarget = React.useRef(target);\n const prevOpen = React.useRef(open);\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n React.useEffect(() => {\n if (prevOpen.current && prevTarget.current) {\n prevTarget.current.focus();\n } // Emit menuOpen or menuClose events\n\n\n const eventName = open ? 'menuOpen' : 'menuClose';\n apiRef.current.publishEvent(eventName, {\n target\n });\n prevOpen.current = open;\n prevTarget.current = target;\n }, [apiRef, open, target]);\n\n const handleExited = popperOnExited => node => {\n if (popperOnExited) {\n popperOnExited();\n }\n\n if (onExited) {\n onExited(node);\n }\n };\n\n return /*#__PURE__*/_jsx(GridMenuRoot, _extends({\n as: rootProps.components.BasePopper,\n className: clsx(className, classes.root),\n open: open,\n anchorEl: target,\n transition: true,\n placement: position\n }, other, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.basePopper, {\n children: ({\n TransitionProps,\n placement\n }) => /*#__PURE__*/_jsx(ClickAwayListener, {\n onClickAway: onClickAway,\n mouseEvent: \"onMouseDown\",\n children: /*#__PURE__*/_jsx(Grow, _extends({}, TransitionProps, {\n style: {\n transformOrigin: transformOrigin[placement]\n },\n onExited: handleExited(TransitionProps == null ? void 0 : TransitionProps.onExited),\n children: /*#__PURE__*/_jsx(Paper, {\n children: children\n })\n }))\n })\n }));\n};\n\nprocess.env.NODE_ENV !== \"production\" ? GridMenu.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 onClickAway: PropTypes.func.isRequired,\n onExited: PropTypes.func,\n\n /**\n * If `true`, the component is shown.\n */\n open: PropTypes.bool.isRequired,\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 target: HTMLElementType\n} : void 0;\nexport { GridMenu };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"colDef\", \"id\", \"api\", \"hasFocus\", \"isEditable\", \"field\", \"value\", \"formattedValue\", \"row\", \"rowNode\", \"cellMode\", \"getValue\", \"tabIndex\", \"position\", \"focusElementRef\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport IconButton from '@mui/material/IconButton';\nimport MenuList from '@mui/material/MenuList';\nimport { unstable_useId as useId } from '@mui/material/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\";\n\nconst hasActions = colDef => typeof colDef.getActions === 'function';\n\nconst GridActionsCell = props => {\n const {\n colDef,\n id,\n hasFocus,\n tabIndex,\n position = 'bottom-end',\n focusElementRef\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\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 menuId = useId();\n const buttonId = useId();\n const rootProps = useGridRootProps();\n React.useLayoutEffect(() => {\n if (!hasFocus) {\n Object.entries(touchRippleRefs.current).forEach(([index, ref]) => {\n ref == null ? void 0 : 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\n if (focusedButtonIndex >= rootRef.current.children.length) {\n return;\n }\n\n const child = rootRef.current.children[focusedButtonIndex];\n child.focus();\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 setFocusedButtonIndex(0);\n }\n }\n\n }), []);\n\n if (!hasActions(colDef)) {\n throw new Error('MUI: Missing the `getActions` property in the `GridColDef`.');\n }\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.useEffect(() => {\n if (focusedButtonIndex >= numberOfButtons) {\n setFocusedButtonIndex(numberOfButtons - 1);\n }\n }, [focusedButtonIndex, numberOfButtons]);\n\n const showMenu = () => {\n setOpen(true);\n setFocusedButtonIndex(numberOfButtons - 1);\n ignoreCallToFocus.current = true;\n };\n\n const hideMenu = () => {\n setOpen(false);\n };\n\n const handleTouchRippleRef = index => instance => {\n touchRippleRefs.current[index] = instance;\n };\n\n const handleButtonClick = (index, onClick) => event => {\n setFocusedButtonIndex(index);\n ignoreCallToFocus.current = true;\n\n if (onClick) {\n onClick(event);\n }\n };\n\n const handleRootKeyDown = event => {\n if (numberOfButtons <= 1) {\n return;\n }\n\n let newIndex = focusedButtonIndex;\n\n if (event.key === 'ArrowRight') {\n newIndex += 1;\n } else if (event.key === 'ArrowLeft') {\n newIndex -= 1;\n }\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\n event.stopPropagation(); // Don't stop propagation for other keys, e.g. ArrowUp\n\n setFocusedButtonIndex(newIndex);\n }\n };\n\n const handleListKeyDown = event => {\n if (event.key === 'Tab') {\n event.preventDefault();\n }\n\n if (['Tab', 'Enter', 'Escape'].includes(event.key)) {\n hideMenu();\n }\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(IconButton, {\n ref: buttonRef,\n id: buttonId,\n \"aria-label\": apiRef.current.getLocaleText('actionsCellMore'),\n \"aria-controls\": menuId,\n \"aria-expanded\": open ? 'true' : undefined,\n \"aria-haspopup\": \"true\",\n role: \"menuitem\",\n size: \"small\",\n onClick: showMenu,\n touchRippleRef: handleTouchRippleRef(buttonId),\n tabIndex: focusedButtonIndex === iconButtons.length ? tabIndex : -1,\n children: /*#__PURE__*/_jsx(rootProps.components.MoreActionsIcon, {\n fontSize: \"small\"\n })\n }), menuButtons.length > 0 && /*#__PURE__*/_jsx(GridMenu, {\n onClickAway: hideMenu,\n onClick: hideMenu,\n open: open,\n target: buttonRef.current,\n position: position,\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};\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\n /**\n * GridApi that let you manipulate the grid.\n * @deprecated Use the `apiRef` returned by `useGridApiContext` or `useGridApiRef` (only available in `@mui/x-data-grid-pro`)\n */\n api: PropTypes.any.isRequired,\n\n /**\n * The mode of the cell.\n */\n cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,\n\n /**\n * The column of the row that the current cell belongs to.\n */\n colDef: PropTypes.object.isRequired,\n\n /**\n * The column field of the cell that triggered the event.\n */\n field: PropTypes.string.isRequired,\n\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 formattedValue: PropTypes.any,\n\n /**\n * Get the cell value of a row and field.\n * @param {GridRowId} id The row id.\n * @param {string} field The field.\n * @returns {any} The cell value.\n * @deprecated Use `params.row` to directly access the fields you want instead.\n */\n getValue: PropTypes.func.isRequired,\n\n /**\n * If true, the cell is the active element.\n */\n hasFocus: PropTypes.bool.isRequired,\n\n /**\n * The grid row id.\n */\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n\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 /**\n * The row model of the row that the current cell belongs to.\n */\n row: PropTypes.object.isRequired,\n\n /**\n * The node of the row that the current cell belongs to.\n */\n rowNode: PropTypes.object.isRequired,\n\n /**\n * the tabIndex value.\n */\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\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 width: 100,\n align: 'center',\n headerAlign: 'center',\n headerName: '',\n disableColumnMenu: true,\n disableExport: true,\n renderCell: renderActionsCell,\n getApplyQuickFilterFn: undefined\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 _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { DEFAULT_GRID_COL_TYPE_KEY, getGridDefaultColumnTypes } from '../../../colDef';\nimport { gridColumnsSelector, gridColumnVisibilityModelSelector } from './gridColumnsSelector';\nimport { clamp } from '../../../utils/utils';\nexport const COLUMNS_DIMENSION_PROPERTIES = ['maxWidth', 'minWidth', 'width', 'flex'];\nexport const computeColumnTypes = (customColumnTypes = {}) => {\n const mergedColumnTypes = _extends({}, getGridDefaultColumnTypes());\n\n Object.entries(customColumnTypes).forEach(([colType, colTypeDef]) => {\n if (mergedColumnTypes[colType]) {\n mergedColumnTypes[colType] = _extends({}, mergedColumnTypes[colType], colTypeDef);\n } else {\n mergedColumnTypes[colType] = _extends({}, mergedColumnTypes[colTypeDef.extendType || DEFAULT_GRID_COL_TYPE_KEY], colTypeDef);\n }\n });\n return mergedColumnTypes;\n};\n/**\n * Computes width for flex columns.\n * Based on CSS Flexbox specification:\n * https://drafts.csswg.org/css-flexbox-1/#resolve-flexible-lengths\n */\n\nexport function computeFlexColumnsWidth({\n initialFreeSpace,\n totalFlexUnits,\n flexColumns\n}) {\n const flexColumnsLookup = {\n all: {},\n frozenFields: [],\n freeze: field => {\n const value = flexColumnsLookup.all[field];\n\n if (value && value.frozen !== true) {\n flexColumnsLookup.all[field].frozen = true;\n flexColumnsLookup.frozenFields.push(field);\n }\n }\n }; // Step 5 of https://drafts.csswg.org/css-flexbox-1/#resolve-flexible-lengths\n\n function loopOverFlexItems() {\n // 5a: If all the flex items on the line are frozen, free space has been distributed.\n if (flexColumnsLookup.frozenFields.length === flexColumns.length) {\n return;\n }\n\n const violationsLookup = {\n min: {},\n max: {}\n };\n let remainingFreeSpace = initialFreeSpace;\n let flexUnits = totalFlexUnits;\n let totalViolation = 0; // 5b: Calculate the remaining free space\n\n flexColumnsLookup.frozenFields.forEach(field => {\n remainingFreeSpace -= flexColumnsLookup.all[field].computedWidth;\n flexUnits -= flexColumnsLookup.all[field].flex;\n });\n\n for (let i = 0; i < flexColumns.length; i += 1) {\n const column = flexColumns[i];\n\n if (flexColumnsLookup.all[column.field] && flexColumnsLookup.all[column.field].frozen === true) {\n // eslint-disable-next-line no-continue\n continue;\n } // 5c: Distribute remaining free space proportional to the flex factors\n\n\n const widthPerFlexUnit = remainingFreeSpace / flexUnits;\n let computedWidth = widthPerFlexUnit * column.flex; // 5d: Fix min/max violations\n\n if (computedWidth < column.minWidth) {\n totalViolation += column.minWidth - computedWidth;\n computedWidth = column.minWidth;\n violationsLookup.min[column.field] = true;\n } else if (computedWidth > column.maxWidth) {\n totalViolation += column.maxWidth - computedWidth;\n computedWidth = column.maxWidth;\n violationsLookup.max[column.field] = true;\n }\n\n flexColumnsLookup.all[column.field] = {\n frozen: false,\n computedWidth,\n flex: column.flex\n };\n } // 5e: Freeze over-flexed items\n\n\n if (totalViolation < 0) {\n // Freeze all the items with max violations\n Object.keys(violationsLookup.max).forEach(field => {\n flexColumnsLookup.freeze(field);\n });\n } else if (totalViolation > 0) {\n // Freeze all the items with min violations\n Object.keys(violationsLookup.min).forEach(field => {\n flexColumnsLookup.freeze(field);\n });\n } else {\n // Freeze all items\n flexColumns.forEach(({\n field\n }) => {\n flexColumnsLookup.freeze(field);\n });\n } // 5f: Return to the start of this loop\n\n\n loopOverFlexItems();\n }\n\n loopOverFlexItems();\n return flexColumnsLookup.all;\n}\n/**\n * Compute the `computedWidth` (ie: the width the column should have during rendering) based on the `width` / `flex` / `minWidth` / `maxWidth` properties of `GridColDef`.\n * The columns already have been merged with there `type` default values for `minWidth`, `maxWidth` and `width`, thus the `!` for those properties below.\n * TODO: Unit test this function in depth and only keep basic cases for the whole grid testing.\n * TODO: Improve the `GridColDef` typing to reflect the fact that `minWidth` / `maxWidth` and `width` can't be null after the merge with the `type` default values.\n */\n\nexport const hydrateColumnsWidth = (rawState, viewportInnerWidth) => {\n const columnsLookup = {};\n let totalFlexUnits = 0;\n let widthAllocatedBeforeFlex = 0;\n const flexColumns = []; // For the non-flex columns, compute their width\n // For the flex columns, compute there minimum width and how much width must be allocated during the flex allocation\n\n rawState.all.forEach(columnField => {\n const newColumn = _extends({}, rawState.lookup[columnField]);\n\n if (rawState.columnVisibilityModel[columnField] === false) {\n newColumn.computedWidth = 0;\n } else {\n let computedWidth;\n\n if (newColumn.flex && newColumn.flex > 0) {\n totalFlexUnits += newColumn.flex;\n computedWidth = 0;\n flexColumns.push(newColumn);\n } else {\n computedWidth = clamp(newColumn.width, newColumn.minWidth, newColumn.maxWidth);\n }\n\n widthAllocatedBeforeFlex += computedWidth;\n newColumn.computedWidth = computedWidth;\n }\n\n columnsLookup[columnField] = newColumn;\n });\n const initialFreeSpace = Math.max(viewportInnerWidth - widthAllocatedBeforeFlex, 0); // Allocate the remaining space to the flex columns\n\n if (totalFlexUnits > 0 && viewportInnerWidth > 0) {\n const computedColumnWidths = computeFlexColumnsWidth({\n initialFreeSpace,\n totalFlexUnits,\n flexColumns\n });\n Object.keys(computedColumnWidths).forEach(field => {\n columnsLookup[field].computedWidth = computedColumnWidths[field].computedWidth;\n });\n }\n\n return _extends({}, rawState, {\n lookup: columnsLookup\n });\n};\nlet columnTypeWarnedOnce = false;\n/**\n * Apply the order and the dimensions of the initial state.\n * The columns not registered in `orderedFields` will be placed after the imported columns.\n */\n\nexport const applyInitialState = (columnsState, initialState) => {\n if (!initialState) {\n return columnsState;\n }\n\n const {\n orderedFields = [],\n dimensions = {}\n } = initialState;\n const columnsWithUpdatedDimensions = Object.keys(dimensions);\n\n if (columnsWithUpdatedDimensions.length === 0 && orderedFields.length === 0) {\n return columnsState;\n }\n\n const orderedFieldsLookup = {};\n const cleanOrderedFields = [];\n\n for (let i = 0; i < orderedFields.length; i += 1) {\n const field = orderedFields[i]; // Ignores the fields in the initialState that matches no field on the current column state\n\n if (columnsState.lookup[field]) {\n orderedFieldsLookup[field] = true;\n cleanOrderedFields.push(field);\n }\n }\n\n const newOrderedFields = cleanOrderedFields.length === 0 ? columnsState.all : [...cleanOrderedFields, ...columnsState.all.filter(field => !orderedFieldsLookup[field])];\n\n const newColumnLookup = _extends({}, columnsState.lookup);\n\n for (let i = 0; i < columnsWithUpdatedDimensions.length; i += 1) {\n const field = columnsWithUpdatedDimensions[i];\n\n const newColDef = _extends({}, newColumnLookup[field], {\n hasBeenResized: true\n });\n\n Object.entries(dimensions[field]).forEach(([key, value]) => {\n newColDef[key] = value === -1 ? Infinity : value;\n });\n newColumnLookup[field] = newColDef;\n }\n\n const newColumnsState = {\n all: newOrderedFields,\n lookup: newColumnLookup\n };\n return newColumnsState;\n};\n/**\n * @deprecated Should have been internal only, you can inline the logic.\n */\n\nexport const getGridColDef = (columnTypes, type) => {\n if (!type) {\n return columnTypes[DEFAULT_GRID_COL_TYPE_KEY];\n }\n\n if (process.env.NODE_ENV !== 'production') {\n if (!columnTypeWarnedOnce && !columnTypes[type]) {\n console.warn([`MUI: The column type \"${type}\" you are using is not supported.`, `Column type \"string\" is being used instead.`].join('\\n'));\n columnTypeWarnedOnce = true;\n }\n }\n\n if (!columnTypes[type]) {\n return columnTypes[DEFAULT_GRID_COL_TYPE_KEY];\n }\n\n return columnTypes[type];\n};\nexport const createColumnsState = ({\n apiRef,\n columnsToUpsert,\n initialState,\n columnTypes,\n currentColumnVisibilityModel = gridColumnVisibilityModelSelector(apiRef),\n shouldRegenColumnVisibilityModelFromColumns,\n keepOnlyColumnsToUpsert = false\n}) => {\n var _apiRef$current$getRo, _apiRef$current$getRo2, _apiRef$current, _apiRef$current$getRo3;\n\n const isInsideStateInitializer = !apiRef.current.state.columns;\n let columnsStateWithoutColumnVisibilityModel;\n\n if (isInsideStateInitializer) {\n columnsStateWithoutColumnVisibilityModel = {\n all: [],\n lookup: {}\n };\n } else {\n const currentState = gridColumnsSelector(apiRef.current.state);\n columnsStateWithoutColumnVisibilityModel = {\n all: keepOnlyColumnsToUpsert ? [] : [...currentState.all],\n lookup: _extends({}, currentState.lookup) // Will be cleaned later if keepOnlyColumnsToUpsert=true\n\n };\n }\n\n let columnsToKeep = {};\n\n if (keepOnlyColumnsToUpsert && !isInsideStateInitializer) {\n columnsToKeep = Object.keys(columnsStateWithoutColumnVisibilityModel.lookup).reduce((acc, key) => _extends({}, acc, {\n [key]: false\n }), {});\n }\n\n const columnsToUpsertLookup = {};\n columnsToUpsert.forEach(newColumn => {\n const {\n field\n } = newColumn;\n columnsToUpsertLookup[field] = true;\n columnsToKeep[field] = true;\n let existingState = columnsStateWithoutColumnVisibilityModel.lookup[field];\n\n if (existingState == null) {\n // New Column\n existingState = _extends({}, getGridColDef(columnTypes, newColumn.type), {\n // TODO v6: Inline `getGridColDef`\n field,\n hasBeenResized: false\n });\n columnsStateWithoutColumnVisibilityModel.all.push(field);\n } else if (keepOnlyColumnsToUpsert) {\n columnsStateWithoutColumnVisibilityModel.all.push(field);\n }\n\n let hasBeenResized = existingState.hasBeenResized;\n COLUMNS_DIMENSION_PROPERTIES.forEach(key => {\n if (newColumn[key] !== undefined) {\n hasBeenResized = true;\n\n if (newColumn[key] === -1) {\n newColumn[key] = Infinity;\n }\n }\n });\n columnsStateWithoutColumnVisibilityModel.lookup[field] = _extends({}, existingState, {\n hide: newColumn.hide == null ? false : newColumn.hide\n }, newColumn, {\n hasBeenResized\n });\n });\n\n if (keepOnlyColumnsToUpsert && !isInsideStateInitializer) {\n Object.keys(columnsStateWithoutColumnVisibilityModel.lookup).forEach(field => {\n if (!columnsToKeep[field]) {\n delete columnsStateWithoutColumnVisibilityModel.lookup[field];\n }\n });\n }\n\n const columnsLookupBeforePreProcessing = _extends({}, columnsStateWithoutColumnVisibilityModel.lookup);\n\n const columnsStateWithPreProcessing = apiRef.current.unstable_applyPipeProcessors('hydrateColumns', columnsStateWithoutColumnVisibilityModel); // TODO v6: remove the sync between the columns `hide` option and the model.\n\n let columnVisibilityModel = {};\n\n if (shouldRegenColumnVisibilityModelFromColumns) {\n let hasModelChanged = false;\n\n const newColumnVisibilityModel = _extends({}, currentColumnVisibilityModel);\n\n if (isInsideStateInitializer) {\n columnsStateWithPreProcessing.all.forEach(field => {\n newColumnVisibilityModel[field] = !columnsStateWithoutColumnVisibilityModel.lookup[field].hide;\n });\n } else if (keepOnlyColumnsToUpsert) {\n // At this point, `keepOnlyColumnsToUpsert` has a new meaning: keep the columns\n // passed via `columnToUpsert` + columns added by the pre-processors. We do the following\n // cleanup because a given column may have been removed from the `columns` prop but it still\n // exists in the state.\n Object.keys(newColumnVisibilityModel).forEach(field => {\n if (!columnsStateWithPreProcessing.lookup[field]) {\n delete newColumnVisibilityModel[field];\n hasModelChanged = true;\n }\n });\n }\n\n columnsStateWithPreProcessing.all.forEach(field => {\n // If neither the `columnsToUpsert` nor the pre-processors updated the column,\n // Then we don't want to update the visibility status of the column in the model.\n if (!columnsToUpsertLookup[field] && columnsLookupBeforePreProcessing[field] === columnsStateWithPreProcessing.lookup[field]) {\n return;\n } // We always assume that a column not in the model is visible by default. However, there's an\n // edge case where the column is not in the model but it also doesn't exist in the `columns`\n // prop, meaning that the column is being added. In that case, we assume that the column was\n // not visible before for it be added to the model.\n\n\n let isVisibleBefore = currentColumnVisibilityModel[field];\n\n if (isVisibleBefore === undefined) {\n if (isInsideStateInitializer) {\n isVisibleBefore = true;\n } else {\n const currentState = gridColumnsSelector(apiRef.current.state);\n isVisibleBefore = !!currentState.lookup[field];\n }\n }\n\n const isVisibleAfter = !columnsStateWithPreProcessing.lookup[field].hide;\n\n if (isVisibleAfter !== isVisibleBefore) {\n hasModelChanged = true;\n newColumnVisibilityModel[field] = isVisibleAfter;\n }\n });\n\n if (hasModelChanged || isInsideStateInitializer) {\n columnVisibilityModel = newColumnVisibilityModel;\n } else {\n columnVisibilityModel = currentColumnVisibilityModel;\n }\n } else {\n columnVisibilityModel = currentColumnVisibilityModel;\n }\n\n const columnsStateWithPortableColumns = applyInitialState(columnsStateWithPreProcessing, initialState);\n\n const columnsState = _extends({}, columnsStateWithPortableColumns, {\n columnVisibilityModel\n });\n\n return hydrateColumnsWidth(columnsState, (_apiRef$current$getRo = (_apiRef$current$getRo2 = (_apiRef$current = apiRef.current).getRootDimensions) == null ? void 0 : (_apiRef$current$getRo3 = _apiRef$current$getRo2.call(_apiRef$current)) == null ? void 0 : _apiRef$current$getRo3.viewportInnerSize.width) != null ? _apiRef$current$getRo : 0);\n};\nexport const mergeColumnsState = columnsState => state => _extends({}, state, {\n columns: columnsState\n});\nexport function getFirstNonSpannedColumnToRender({\n firstColumnToRender,\n apiRef,\n firstRowToRender,\n lastRowToRender,\n visibleRows\n}) {\n let firstNonSpannedColumnToRender = firstColumnToRender;\n\n for (let i = firstRowToRender; i < lastRowToRender; i += 1) {\n const row = visibleRows[i];\n\n if (row) {\n const rowId = visibleRows[i].id;\n const cellColSpanInfo = apiRef.current.unstable_getCellColSpanInfo(rowId, firstColumnToRender);\n\n if (cellColSpanInfo && cellColSpanInfo.spannedByColSpan) {\n firstNonSpannedColumnToRender = cellColSpanInfo.leftVisibleCellIndex;\n }\n }\n }\n\n return firstNonSpannedColumnToRender;\n}\nexport function getFirstColumnIndexToRender({\n firstColumnIndex,\n minColumnIndex,\n columnBuffer,\n firstRowToRender,\n lastRowToRender,\n apiRef,\n visibleRows\n}) {\n const initialFirstColumnToRender = Math.max(firstColumnIndex - columnBuffer, minColumnIndex);\n const firstColumnToRender = getFirstNonSpannedColumnToRender({\n firstColumnToRender: initialFirstColumnToRender,\n apiRef,\n firstRowToRender,\n lastRowToRender,\n visibleRows\n });\n return firstColumnToRender;\n}","var GridPreferencePanelsValue;\n\n(function (GridPreferencePanelsValue) {\n GridPreferencePanelsValue[\"filters\"] = \"filters\";\n GridPreferencePanelsValue[\"columns\"] = \"columns\";\n})(GridPreferencePanelsValue || (GridPreferencePanelsValue = {}));\n\nexport { GridPreferencePanelsValue };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { useGridLogger } from '../../utils/useGridLogger';\nimport { gridColumnFieldsSelector, gridColumnDefinitionsSelector, gridColumnLookupSelector, gridColumnsMetaSelector, gridColumnsSelector, gridColumnVisibilityModelSelector, gridVisibleColumnDefinitionsSelector, gridColumnPositionsSelector } from './gridColumnsSelector';\nimport { useGridApiEventHandler, useGridApiOptionHandler } from '../../utils/useGridApiEventHandler';\nimport { useGridRegisterPipeProcessor, useGridRegisterPipeApplier } from '../../core/pipeProcessing';\nimport { hydrateColumnsWidth, computeColumnTypes, createColumnsState, mergeColumnsState, COLUMNS_DIMENSION_PROPERTIES } from './gridColumnsUtils';\nimport { GridPreferencePanelsValue } from '../preferencesPanel';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const columnsStateInitializer = (state, props, apiRef) => {\n var _props$initialState, _props$initialState$c, _props$initialState2, _ref, _props$columnVisibili, _props$initialState3, _props$initialState3$;\n\n const isUsingColumnVisibilityModel = !!props.columnVisibilityModel || !!((_props$initialState = props.initialState) != null && (_props$initialState$c = _props$initialState.columns) != null && _props$initialState$c.columnVisibilityModel);\n apiRef.current.unstable_caches.columns = {\n isUsingColumnVisibilityModel\n };\n const columnsTypes = computeColumnTypes(props.columnTypes);\n const columnsState = createColumnsState({\n apiRef,\n columnTypes: columnsTypes,\n columnsToUpsert: props.columns,\n initialState: (_props$initialState2 = props.initialState) == null ? void 0 : _props$initialState2.columns,\n shouldRegenColumnVisibilityModelFromColumns: !isUsingColumnVisibilityModel,\n currentColumnVisibilityModel: (_ref = (_props$columnVisibili = props.columnVisibilityModel) != null ? _props$columnVisibili : (_props$initialState3 = props.initialState) == null ? void 0 : (_props$initialState3$ = _props$initialState3.columns) == null ? void 0 : _props$initialState3$.columnVisibilityModel) != null ? _ref : {},\n keepOnlyColumnsToUpsert: true\n });\n return _extends({}, state, {\n columns: columnsState\n });\n};\n/**\n * @requires useGridParamsApi (method)\n * @requires useGridDimensions (method, event) - can be after\n * TODO: Impossible priority - useGridParamsApi also needs to be after useGridColumns\n */\n\nexport function useGridColumns(apiRef, props) {\n var _props$componentsProp2;\n\n const logger = useGridLogger(apiRef, 'useGridColumns');\n const columnTypes = React.useMemo(() => computeColumnTypes(props.columnTypes), [props.columnTypes]);\n const previousColumnsProp = React.useRef(props.columns);\n const previousColumnTypesProp = React.useRef(columnTypes);\n apiRef.current.unstable_registerControlState({\n stateId: 'visibleColumns',\n propModel: props.columnVisibilityModel,\n propOnChange: props.onColumnVisibilityModelChange,\n stateSelector: gridColumnVisibilityModelSelector,\n changeEvent: 'columnVisibilityModelChange'\n });\n const setGridColumnsState = React.useCallback(columnsState => {\n logger.debug('Updating columns state.');\n apiRef.current.setState(mergeColumnsState(columnsState));\n apiRef.current.forceUpdate();\n apiRef.current.publishEvent('columnsChange', columnsState.all);\n }, [logger, apiRef]);\n /**\n * API METHODS\n */\n\n const getColumn = React.useCallback(field => gridColumnLookupSelector(apiRef)[field], [apiRef]);\n const getAllColumns = React.useCallback(() => gridColumnDefinitionsSelector(apiRef), [apiRef]);\n const getVisibleColumns = React.useCallback(() => gridVisibleColumnDefinitionsSelector(apiRef), [apiRef]);\n const getColumnsMeta = React.useCallback(() => gridColumnsMetaSelector(apiRef), [apiRef]);\n const getColumnIndex = React.useCallback((field, useVisibleColumns = true) => {\n const columns = useVisibleColumns ? gridVisibleColumnDefinitionsSelector(apiRef) : gridColumnDefinitionsSelector(apiRef);\n return columns.findIndex(col => col.field === field);\n }, [apiRef]);\n const getColumnPosition = React.useCallback(field => {\n const index = getColumnIndex(field);\n return gridColumnPositionsSelector(apiRef)[index];\n }, [apiRef, getColumnIndex]);\n const setColumnVisibilityModel = React.useCallback(model => {\n const currentModel = gridColumnVisibilityModelSelector(apiRef);\n\n if (currentModel !== model) {\n apiRef.current.setState(state => _extends({}, state, {\n columns: createColumnsState({\n apiRef,\n columnTypes,\n columnsToUpsert: [],\n initialState: undefined,\n shouldRegenColumnVisibilityModelFromColumns: false,\n currentColumnVisibilityModel: model,\n keepOnlyColumnsToUpsert: false\n })\n }));\n apiRef.current.forceUpdate();\n }\n }, [apiRef, columnTypes]);\n const updateColumns = React.useCallback(columns => {\n const columnsState = createColumnsState({\n apiRef,\n columnTypes,\n columnsToUpsert: columns,\n initialState: undefined,\n shouldRegenColumnVisibilityModelFromColumns: true,\n keepOnlyColumnsToUpsert: false\n });\n setGridColumnsState(columnsState);\n }, [apiRef, setGridColumnsState, columnTypes]);\n const updateColumn = React.useCallback(column => apiRef.current.updateColumns([column]), [apiRef]);\n const setColumnVisibility = React.useCallback((field, isVisible) => {\n // We keep updating the `hide` option of `GridColDef` when not controlling the model to avoid any breaking change.\n // `updateColumns` take care of updating the model itself if needs be.\n // TODO v6: stop using the `hide` field even when the model is not defined\n if (apiRef.current.unstable_caches.columns.isUsingColumnVisibilityModel) {\n var _columnVisibilityMode;\n\n const columnVisibilityModel = gridColumnVisibilityModelSelector(apiRef);\n const isCurrentlyVisible = (_columnVisibilityMode = columnVisibilityModel[field]) != null ? _columnVisibilityMode : true;\n\n if (isVisible !== isCurrentlyVisible) {\n const newModel = _extends({}, columnVisibilityModel, {\n [field]: isVisible\n });\n\n apiRef.current.setColumnVisibilityModel(newModel);\n }\n } else {\n const column = apiRef.current.getColumn(field);\n\n const newColumn = _extends({}, column, {\n hide: !isVisible\n });\n\n apiRef.current.updateColumns([newColumn]);\n const params = {\n field,\n colDef: newColumn,\n isVisible\n };\n apiRef.current.publishEvent('columnVisibilityChange', params);\n }\n }, [apiRef]);\n const setColumnIndex = React.useCallback((field, targetIndexPosition) => {\n const allColumns = gridColumnFieldsSelector(apiRef);\n const oldIndexPosition = allColumns.findIndex(col => col === field);\n\n if (oldIndexPosition === targetIndexPosition) {\n return;\n }\n\n logger.debug(`Moving column ${field} to index ${targetIndexPosition}`);\n const updatedColumns = [...allColumns];\n const fieldRemoved = updatedColumns.splice(oldIndexPosition, 1)[0];\n updatedColumns.splice(targetIndexPosition, 0, fieldRemoved);\n setGridColumnsState(_extends({}, gridColumnsSelector(apiRef.current.state), {\n all: updatedColumns\n }));\n const params = {\n field,\n element: apiRef.current.getColumnHeaderElement(field),\n colDef: apiRef.current.getColumn(field),\n targetIndex: targetIndexPosition,\n oldIndex: oldIndexPosition\n };\n apiRef.current.publishEvent('columnOrderChange', params);\n }, [apiRef, logger, setGridColumnsState]);\n const setColumnWidth = React.useCallback((field, width) => {\n logger.debug(`Updating column ${field} width to ${width}`);\n const column = apiRef.current.getColumn(field);\n\n const newColumn = _extends({}, column, {\n width\n });\n\n apiRef.current.updateColumns([newColumn]);\n apiRef.current.publishEvent('columnWidthChange', {\n element: apiRef.current.getColumnHeaderElement(field),\n colDef: newColumn,\n width\n });\n }, [apiRef, logger]);\n const columnApi = {\n getColumn,\n getAllColumns,\n getColumnIndex,\n getColumnPosition,\n getVisibleColumns,\n getColumnsMeta,\n updateColumn,\n updateColumns,\n setColumnVisibilityModel,\n setColumnVisibility,\n setColumnIndex,\n setColumnWidth\n };\n useGridApiMethod(apiRef, columnApi, 'GridColumnApi');\n /**\n * PRE-PROCESSING\n */\n\n const stateExportPreProcessing = React.useCallback(prevState => {\n const columnsStateToExport = {};\n\n if (apiRef.current.unstable_caches.columns.isUsingColumnVisibilityModel) {\n const columnVisibilityModelToExport = gridColumnVisibilityModelSelector(apiRef);\n const hasHiddenColumns = Object.values(columnVisibilityModelToExport).some(value => value === false);\n\n if (hasHiddenColumns) {\n columnsStateToExport.columnVisibilityModel = columnVisibilityModelToExport;\n }\n }\n\n columnsStateToExport.orderedFields = gridColumnFieldsSelector(apiRef);\n const columns = gridColumnDefinitionsSelector(apiRef);\n const dimensions = {};\n columns.forEach(colDef => {\n if (colDef.hasBeenResized) {\n const colDefDimensions = {};\n COLUMNS_DIMENSION_PROPERTIES.forEach(propertyName => {\n let propertyValue = colDef[propertyName];\n\n if (propertyValue === Infinity) {\n propertyValue = -1;\n }\n\n colDefDimensions[propertyName] = propertyValue;\n });\n dimensions[colDef.field] = colDefDimensions;\n }\n });\n\n if (Object.keys(dimensions).length > 0) {\n columnsStateToExport.dimensions = dimensions;\n }\n\n return _extends({}, prevState, {\n columns: columnsStateToExport\n });\n }, [apiRef]);\n const stateRestorePreProcessing = React.useCallback((params, context) => {\n var _context$stateToResto;\n\n const columnVisibilityModelToImport = apiRef.current.unstable_caches.columns.isUsingColumnVisibilityModel ? (_context$stateToResto = context.stateToRestore.columns) == null ? void 0 : _context$stateToResto.columnVisibilityModel : undefined;\n const initialState = context.stateToRestore.columns;\n\n if (columnVisibilityModelToImport == null && initialState == null) {\n return params;\n }\n\n const columnsState = createColumnsState({\n apiRef,\n columnTypes,\n columnsToUpsert: [],\n initialState,\n shouldRegenColumnVisibilityModelFromColumns: !apiRef.current.unstable_caches.columns.isUsingColumnVisibilityModel,\n currentColumnVisibilityModel: columnVisibilityModelToImport,\n keepOnlyColumnsToUpsert: false\n });\n apiRef.current.setState(mergeColumnsState(columnsState));\n\n if (initialState != null) {\n apiRef.current.publishEvent('columnsChange', columnsState.all);\n }\n\n return params;\n }, [apiRef, columnTypes]);\n const preferencePanelPreProcessing = React.useCallback((initialValue, value) => {\n if (value === GridPreferencePanelsValue.columns) {\n var _props$componentsProp;\n\n const ColumnsPanel = props.components.ColumnsPanel;\n return /*#__PURE__*/_jsx(ColumnsPanel, _extends({}, (_props$componentsProp = props.componentsProps) == null ? void 0 : _props$componentsProp.columnsPanel));\n }\n\n return initialValue;\n }, [props.components.ColumnsPanel, (_props$componentsProp2 = props.componentsProps) == null ? void 0 : _props$componentsProp2.columnsPanel]);\n useGridRegisterPipeProcessor(apiRef, 'exportState', stateExportPreProcessing);\n useGridRegisterPipeProcessor(apiRef, 'restoreState', stateRestorePreProcessing);\n useGridRegisterPipeProcessor(apiRef, 'preferencePanel', preferencePanelPreProcessing);\n /**\n * EVENTS\n */\n\n const prevInnerWidth = React.useRef(null);\n\n const handleGridSizeChange = viewportInnerSize => {\n if (prevInnerWidth.current !== viewportInnerSize.width) {\n prevInnerWidth.current = viewportInnerSize.width;\n setGridColumnsState(hydrateColumnsWidth(gridColumnsSelector(apiRef.current.state), viewportInnerSize.width));\n }\n };\n\n useGridApiEventHandler(apiRef, 'viewportInnerSizeChange', handleGridSizeChange);\n useGridApiOptionHandler(apiRef, 'columnVisibilityChange', props.onColumnVisibilityChange);\n /**\n * APPLIERS\n */\n\n const hydrateColumns = React.useCallback(() => {\n logger.info(`Columns pipe processing have changed, regenerating the columns`);\n const columnsState = createColumnsState({\n apiRef,\n columnTypes,\n columnsToUpsert: [],\n initialState: undefined,\n shouldRegenColumnVisibilityModelFromColumns: !apiRef.current.unstable_caches.columns.isUsingColumnVisibilityModel,\n keepOnlyColumnsToUpsert: false\n });\n setGridColumnsState(columnsState);\n }, [apiRef, logger, setGridColumnsState, columnTypes]);\n useGridRegisterPipeApplier(apiRef, 'hydrateColumns', hydrateColumns);\n /**\n * EFFECTS\n */\n // The effect do not track any value defined synchronously during the 1st render by hooks called after `useGridColumns`\n // As a consequence, the state generated by the 1st run of this useEffect will always be equal to the initialization one\n\n const isFirstRender = React.useRef(true);\n React.useEffect(() => {\n if (isFirstRender.current) {\n isFirstRender.current = false;\n return;\n }\n\n logger.info(`GridColumns have changed, new length ${props.columns.length}`);\n\n if (previousColumnsProp.current === props.columns && previousColumnTypesProp.current === columnTypes) {\n return;\n }\n\n const columnsState = createColumnsState({\n apiRef,\n columnTypes,\n initialState: undefined,\n // If the user provides a model, we don't want to set it in the state here because it has it's dedicated `useEffect` which calls `setColumnVisibilityModel`\n shouldRegenColumnVisibilityModelFromColumns: !apiRef.current.unstable_caches.columns.isUsingColumnVisibilityModel,\n columnsToUpsert: props.columns,\n keepOnlyColumnsToUpsert: true\n });\n previousColumnsProp.current = props.columns;\n previousColumnTypesProp.current = columnTypes;\n setGridColumnsState(columnsState);\n }, [logger, apiRef, setGridColumnsState, props.columns, columnTypes]);\n React.useEffect(() => {\n if (props.columnVisibilityModel !== undefined) {\n apiRef.current.setColumnVisibilityModel(props.columnVisibilityModel);\n }\n }, [apiRef, logger, props.columnVisibilityModel]);\n}","/**\n * Available densities.\n */\n\n/**\n * Density enum.\n */\nvar GridDensityTypes;\n\n(function (GridDensityTypes) {\n GridDensityTypes[\"Compact\"] = \"compact\";\n GridDensityTypes[\"Standard\"] = \"standard\";\n GridDensityTypes[\"Comfortable\"] = \"comfortable\";\n})(GridDensityTypes || (GridDensityTypes = {}));\n\nexport { GridDensityTypes };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { GridDensityTypes } from '../../../models/gridDensity';\nimport { useGridLogger } from '../../utils/useGridLogger';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { gridDensitySelector } from './densitySelector';\nimport { isDeepEqual } from '../../../utils/utils';\nexport const COMPACT_DENSITY_FACTOR = 0.7;\nexport const COMFORTABLE_DENSITY_FACTOR = 1.3; // TODO v6: revise keeping headerHeight and rowHeight in state\n\nconst getUpdatedDensityState = (newDensity, newHeaderHeight, newRowHeight) => {\n switch (newDensity) {\n case GridDensityTypes.Compact:\n return {\n value: newDensity,\n headerHeight: Math.floor(newHeaderHeight * COMPACT_DENSITY_FACTOR),\n rowHeight: Math.floor(newRowHeight * COMPACT_DENSITY_FACTOR),\n factor: COMPACT_DENSITY_FACTOR\n };\n\n case GridDensityTypes.Comfortable:\n return {\n value: newDensity,\n headerHeight: Math.floor(newHeaderHeight * COMFORTABLE_DENSITY_FACTOR),\n rowHeight: Math.floor(newRowHeight * COMFORTABLE_DENSITY_FACTOR),\n factor: COMFORTABLE_DENSITY_FACTOR\n };\n\n default:\n return {\n value: newDensity,\n headerHeight: newHeaderHeight,\n rowHeight: newRowHeight,\n factor: 1\n };\n }\n};\n\nexport const densityStateInitializer = (state, props) => _extends({}, state, {\n density: getUpdatedDensityState(props.density, props.headerHeight, props.rowHeight)\n});\nexport const useGridDensity = (apiRef, props) => {\n const logger = useGridLogger(apiRef, 'useDensity');\n const setDensity = React.useCallback((newDensity, newHeaderHeight = props.headerHeight, newRowHeight = props.rowHeight) => {\n logger.debug(`Set grid density to ${newDensity}`);\n apiRef.current.setState(state => {\n const currentDensityState = gridDensitySelector(state);\n const newDensityState = getUpdatedDensityState(newDensity, newHeaderHeight, newRowHeight);\n\n if (isDeepEqual(currentDensityState, newDensityState)) {\n return state;\n }\n\n return _extends({}, state, {\n density: newDensityState\n });\n });\n apiRef.current.forceUpdate();\n }, [logger, apiRef, props.headerHeight, props.rowHeight]);\n React.useEffect(() => {\n apiRef.current.setDensity(props.density, props.headerHeight, props.rowHeight);\n }, [apiRef, props.density, props.rowHeight, props.headerHeight]);\n const densityApi = {\n setDensity\n };\n useGridApiMethod(apiRef, densityApi, 'GridDensityApi');\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\", \"getValue\", \"api\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { useForkRef } from '@mui/material/utils';\nimport { isNavigationKey, 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\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['checkboxInput']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst GridCellCheckboxForwardRef = /*#__PURE__*/React.forwardRef(function GridCellCheckboxRenderer(props, ref) {\n var _rootProps$components;\n\n const {\n field,\n id,\n value: isChecked,\n hasFocus,\n tabIndex\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\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();\n const handleRef = useForkRef(checkboxElement, ref);\n const element = apiRef.current.getCellElement(id, field);\n\n const handleChange = event => {\n const params = {\n value: event.target.checked,\n id\n };\n apiRef.current.publishEvent('rowSelectionCheckboxChange', params, event);\n };\n\n React.useLayoutEffect(() => {\n if (tabIndex === 0 && element) {\n element.tabIndex = -1;\n }\n }, [element, tabIndex]);\n React.useLayoutEffect(() => {\n if (hasFocus) {\n var _checkboxElement$curr;\n\n const input = (_checkboxElement$curr = checkboxElement.current) == null ? void 0 : _checkboxElement$curr.querySelector('input');\n input == null ? void 0 : input.focus();\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 event.stopPropagation();\n }\n\n if (isNavigationKey(event.key) && !event.shiftKey) {\n apiRef.current.publishEvent('cellNavigationKeyDown', props, event);\n }\n }, [apiRef, props]);\n const isSelectable = !rootProps.isRowSelectable || rootProps.isRowSelectable(apiRef.current.getRowParams(id));\n const label = apiRef.current.getLocaleText(isChecked ? 'checkboxSelectionUnselectRow' : 'checkboxSelectionSelectRow');\n return /*#__PURE__*/_jsx(rootProps.components.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$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.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 /**\n * GridApi that let you manipulate the grid.\n * @deprecated Use the `apiRef` returned by `useGridApiContext` or `useGridApiRef` (only available in `@mui/x-data-grid-pro`)\n */\n api: PropTypes.any.isRequired,\n\n /**\n * The mode of the cell.\n */\n cellMode: PropTypes.oneOf(['edit', 'view']).isRequired,\n\n /**\n * The column of the row that the current cell belongs to.\n */\n colDef: PropTypes.object.isRequired,\n\n /**\n * The column field of the cell that triggered the event.\n */\n field: PropTypes.string.isRequired,\n\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 /**\n * The cell value formatted with the column valueFormatter.\n */\n formattedValue: PropTypes.any,\n\n /**\n * Get the cell value of a row and field.\n * @param {GridRowId} id The row id.\n * @param {string} field The field.\n * @returns {any} The cell value.\n * @deprecated Use `params.row` to directly access the fields you want instead.\n */\n getValue: PropTypes.func.isRequired,\n\n /**\n * If true, the cell is the active element.\n */\n hasFocus: PropTypes.bool.isRequired,\n\n /**\n * The grid row id.\n */\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n\n /**\n * If true, the cell is editable.\n */\n isEditable: PropTypes.bool,\n\n /**\n * The row model of the row that the current cell belongs to.\n */\n row: PropTypes.object.isRequired,\n\n /**\n * The node of the row that the current cell belongs to.\n */\n rowNode: PropTypes.object.isRequired,\n\n /**\n * the tabIndex value.\n */\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\n\n /**\n * The cell value, but if the column has valueGetter, use getValue.\n */\n value: PropTypes.any\n} : void 0;\nexport { GridCellCheckboxForwardRef };\nexport const GridCellCheckboxRenderer = /*#__PURE__*/React.memo(GridCellCheckboxForwardRef);","import { createSelector } from '../../../utils/createSelector';\nexport const gridFocusStateSelector = state => state.focus;\nexport const gridFocusCellSelector = createSelector(gridFocusStateSelector, focusState => focusState.cell);\nexport const gridFocusColumnHeaderSelector = createSelector(gridFocusStateSelector, focusState => focusState.columnHeader);\nexport const gridTabIndexStateSelector = state => state.tabIndex;\nexport const gridTabIndexCellSelector = createSelector(gridTabIndexStateSelector, state => state.cell);\nexport const gridTabIndexColumnHeaderSelector = createSelector(gridTabIndexStateSelector, state => state.columnHeader);","import { createSelector } from '../../../utils/createSelector';\nimport { gridRowsLookupSelector } from '../rows/gridRowsSelector';\nexport const gridSelectionStateSelector = state => state.selection;\nexport const selectedGridRowsCountSelector = createSelector(gridSelectionStateSelector, selection => selection.length);\nexport const selectedGridRowsSelector = createSelector(gridSelectionStateSelector, gridRowsLookupSelector, (selectedRows, rowsLookup) => new Map(selectedRows.map(id => [id, rowsLookup[id]])));\nexport const selectedIdsLookupSelector = createSelector(gridSelectionStateSelector, selection => selection.reduce((lookup, rowId) => {\n lookup[rowId] = rowId;\n return lookup;\n}, {}));","import { createSelector } from '../../../utils/createSelector';\nimport { gridVisibleSortedRowEntriesSelector, gridVisibleSortedRowIdsSelector, gridVisibleSortedTopLevelRowEntriesSelector } from '../filter/gridFilterSelector';\nimport { gridRowTreeDepthSelector, gridRowTreeSelector } from '../rows/gridRowsSelector';\n/**\n * @category Pagination\n * @ignore - do not document.\n */\n\nexport const gridPaginationSelector = state => state.pagination;\n/**\n * Get the index of the page to render if the pagination is enabled\n * @category Pagination\n */\n\nexport const gridPageSelector = createSelector(gridPaginationSelector, pagination => pagination.page);\n/**\n * Get the maximum amount of rows to display on a single page if the pagination is enabled\n * @category Pagination\n */\n\nexport const gridPageSizeSelector = createSelector(gridPaginationSelector, pagination => pagination.pageSize);\n/**\n * Get the amount of pages needed to display all the rows if the pagination is enabled\n * @category Pagination\n */\n\nexport const gridPageCountSelector = createSelector(gridPaginationSelector, pagination => pagination.pageCount);\n/**\n * Get the index of the first and the last row to include in the current page if the pagination is enabled.\n * @category Pagination\n */\n\nexport const gridPaginationRowRangeSelector = createSelector(gridPaginationSelector, gridRowTreeSelector, gridRowTreeDepthSelector, gridVisibleSortedRowEntriesSelector, gridVisibleSortedTopLevelRowEntriesSelector, (pagination, rowTree, rowTreeDepth, visibleSortedRowEntries, visibleSortedTopLevelRowEntries) => {\n const visibleTopLevelRowCount = visibleSortedTopLevelRowEntries.length;\n const topLevelFirstRowIndex = Math.min(pagination.pageSize * pagination.page, visibleTopLevelRowCount - 1);\n const topLevelLastRowIndex = Math.min(topLevelFirstRowIndex + pagination.pageSize - 1, visibleTopLevelRowCount - 1); // The range contains no element\n\n if (topLevelFirstRowIndex === -1 || topLevelLastRowIndex === -1) {\n return null;\n } // The tree is flat, there is no need to look for children\n\n\n if (rowTreeDepth < 2) {\n return {\n firstRowIndex: topLevelFirstRowIndex,\n lastRowIndex: topLevelLastRowIndex\n };\n }\n\n const topLevelFirstRow = visibleSortedTopLevelRowEntries[topLevelFirstRowIndex];\n const topLevelRowsInCurrentPageCount = topLevelLastRowIndex - topLevelFirstRowIndex + 1;\n const firstRowIndex = visibleSortedRowEntries.findIndex(row => row.id === topLevelFirstRow.id);\n let lastRowIndex = firstRowIndex;\n let topLevelRowAdded = 0;\n\n while (lastRowIndex < visibleSortedRowEntries.length && topLevelRowAdded <= topLevelRowsInCurrentPageCount) {\n const row = visibleSortedRowEntries[lastRowIndex];\n const depth = rowTree[row.id].depth;\n\n if (topLevelRowAdded < topLevelRowsInCurrentPageCount || depth > 0) {\n lastRowIndex += 1;\n }\n\n if (depth === 0) {\n topLevelRowAdded += 1;\n }\n }\n\n return {\n firstRowIndex,\n lastRowIndex: lastRowIndex - 1\n };\n});\n/**\n * Get the id and the model of each row to include in the current page if the pagination is enabled.\n * @category Pagination\n */\n\nexport const gridPaginatedVisibleSortedGridRowEntriesSelector = createSelector(gridVisibleSortedRowEntriesSelector, gridPaginationRowRangeSelector, (visibleSortedRowEntries, paginationRange) => {\n if (!paginationRange) {\n return [];\n }\n\n return visibleSortedRowEntries.slice(paginationRange.firstRowIndex, paginationRange.lastRowIndex + 1);\n});\n/**\n * Get the id of each row to include in the current page if the pagination is enabled.\n * @category Pagination\n */\n\nexport const gridPaginatedVisibleSortedGridRowIdsSelector = createSelector(gridVisibleSortedRowIdsSelector, gridPaginationRowRangeSelector, (visibleSortedRowIds, paginationRange) => {\n if (!paginationRange) {\n return [];\n }\n\n return visibleSortedRowIds.slice(paginationRange.firstRowIndex, paginationRange.lastRowIndex + 1);\n});","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/material';\nimport { useGridSelector } from '../../hooks/utils/useGridSelector';\nimport { gridTabIndexColumnHeaderSelector } from '../../hooks/features/focus/gridFocusStateSelector';\nimport { gridSelectionStateSelector } from '../../hooks/features/selection/gridSelectionSelector';\nimport { isNavigationKey } from '../../utils/keyboardUtils';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { gridVisibleSortedRowIdsSelector } from '../../hooks/features/filter/gridFilterSelector';\nimport { gridPaginatedVisibleSortedGridRowIdsSelector } from '../../hooks/features/pagination/gridPaginationSelector';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['checkboxInput']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst GridHeaderCheckbox = /*#__PURE__*/React.forwardRef(function GridHeaderCheckbox(props, ref) {\n var _rootProps$components;\n\n const other = _objectWithoutPropertiesLoose(props, _excluded);\n\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, gridSelectionStateSelector);\n const visibleRowIds = useGridSelector(apiRef, gridVisibleSortedRowIdsSelector);\n const paginatedVisibleRowIds = useGridSelector(apiRef, gridPaginatedVisibleSortedGridRowIdsSelector);\n const filteredSelection = React.useMemo(() => {\n if (typeof rootProps.isRowSelectable !== 'function') {\n return selection;\n }\n\n return selection.filter(id => {\n // The row might have been deleted\n if (!apiRef.current.getRow(id)) {\n return false;\n }\n\n return rootProps.isRowSelectable(apiRef.current.getRowParams(id));\n });\n }, [apiRef, rootProps.isRowSelectable, selection]); // All the rows that could be selected / unselected by toggling this checkbox\n\n const selectionCandidates = React.useMemo(() => {\n const rowIds = !rootProps.pagination || !rootProps.checkboxSelectionVisibleOnly ? visibleRowIds : paginatedVisibleRowIds; // 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\n return rowIds.reduce((acc, id) => {\n acc[id] = true;\n return acc;\n }, {});\n }, [rootProps.pagination, rootProps.checkboxSelectionVisibleOnly, paginatedVisibleRowIds, visibleRowIds]); // Amount of rows selected and that are visible in the current page\n\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\n const handleChange = event => {\n const params = {\n value: event.target.checked\n };\n apiRef.current.publishEvent('headerSelectionCheckboxChange', params);\n };\n\n const tabIndex = tabIndexState !== null && tabIndexState.field === props.field ? 0 : -1;\n React.useLayoutEffect(() => {\n const element = apiRef.current.getColumnHeaderElement(props.field);\n\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 } // TODO v6 remove columnHeaderNavigationKeyDown events which are not used internally anymore\n\n\n if (isNavigationKey(event.key) && !event.shiftKey) {\n apiRef.current.publishEvent('columnHeaderNavigationKeyDown', props, event);\n }\n }, [apiRef, props, isChecked]);\n const handleSelectionChange = React.useCallback(() => {\n forceUpdate(p => !p);\n }, []);\n React.useEffect(() => {\n return apiRef.current.subscribeEvent('selectionChange', handleSelectionChange);\n }, [apiRef, handleSelectionChange]);\n const label = apiRef.current.getLocaleText(isChecked ? 'checkboxSelectionUnselectAllRows' : 'checkboxSelectionSelectAllRows');\n return /*#__PURE__*/_jsx(rootProps.components.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$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.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 /**\n * The column of the current header component.\n */\n colDef: PropTypes.object.isRequired,\n\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/selection/gridSelectionSelector';\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 disableColumnMenu: true,\n disableReorder: true,\n disableExport: true,\n getApplyQuickFilterFn: 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 { GRID_CHECKBOX_SELECTION_COL_DEF } from '../../../../colDef';\nimport { buildWarning } from '../../../../utils/warning';\n\nconst serializeCellValue = (value, delimiterCharacter) => {\n if (typeof value === 'string') {\n const formattedValue = value.replace(/\"/g, '\"\"'); // Make sure value containing delimiter or line break won't be split into multiple rows\n\n if ([delimiterCharacter, '\\n', '\\r'].some(delimiter => formattedValue.includes(delimiter))) {\n return `\"${formattedValue}\"`;\n }\n\n return formattedValue;\n }\n\n return value;\n};\n\nconst objectFormattedValueWarning = buildWarning(['MUI: When the value of a field is an object or a `renderCell` is provided, the CSV export might not display the value correctly.', 'You can provide a `valueFormatter` with a string representation to be used.']);\n\nconst serializeRow = (id, columns, getCellParams, delimiterCharacter) => columns.map(column => {\n const cellParams = getCellParams(id, column.field);\n\n if (process.env.NODE_ENV !== 'production') {\n if (String(cellParams.formattedValue) === '[object Object]') {\n objectFormattedValueWarning();\n }\n }\n\n return serializeCellValue(cellParams.formattedValue, delimiterCharacter);\n});\n\nexport function buildCSV(options) {\n const {\n columns,\n rowIds,\n getCellParams,\n delimiterCharacter,\n includeHeaders\n } = options;\n const CSVBody = rowIds.reduce((acc, id) => `${acc}${serializeRow(id, columns, getCellParams, delimiterCharacter).join(delimiterCharacter)}\\r\\n`, '').trim();\n\n if (!includeHeaders) {\n return CSVBody;\n }\n\n const CSVHead = `${columns.filter(column => column.field !== GRID_CHECKBOX_SELECTION_COL_DEF.field).map(column => serializeCellValue(column.headerName || column.field, delimiterCharacter)).join(delimiterCharacter)}\\r\\n`;\n return `${CSVHead}${CSVBody}`.trim();\n}","import { gridColumnDefinitionsSelector, gridVisibleColumnDefinitionsSelector } from '../columns';\nimport { gridFilteredSortedRowIdsSelector } from '../filter';\nexport const getColumnsToExport = ({\n apiRef,\n options\n}) => {\n const columns = gridColumnDefinitionsSelector(apiRef);\n\n if (options.fields) {\n return options.fields.map(field => columns.find(column => column.field === field)).filter(column => !!column);\n }\n\n const validColumns = options.allColumns ? columns : gridVisibleColumnDefinitionsSelector(apiRef);\n return validColumns.filter(column => !column.disableExport);\n};\nexport const defaultGetRowsToExport = ({\n apiRef\n}) => {\n const filteredSortedRowIds = gridFilteredSortedRowIdsSelector(apiRef);\n const selectedRows = apiRef.current.getSelectedRows();\n\n if (selectedRows.size > 0) {\n return filteredSortedRowIds.filter(id => selectedRows.has(id));\n }\n\n return filteredSortedRowIds;\n};","/**\n * Filter item definition interface.\n */\nvar GridLinkOperator;\n\n(function (GridLinkOperator) {\n GridLinkOperator[\"And\"] = \"and\";\n GridLinkOperator[\"Or\"] = \"or\";\n})(GridLinkOperator || (GridLinkOperator = {}));\n\nexport { GridLinkOperator };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"csvOptions\", \"printOptions\", \"excelOptions\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport MenuItem from '@mui/material/MenuItem';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { GridToolbarExportContainer } from './GridToolbarExportContainer';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const GridCsvExportMenuItem = props => {\n const apiRef = useGridApiContext();\n const {\n hideMenu,\n options\n } = props;\n return /*#__PURE__*/_jsx(MenuItem, {\n onClick: () => {\n apiRef.current.exportDataAsCsv(options);\n hideMenu == null ? void 0 : hideMenu();\n },\n children: apiRef.current.getLocaleText('toolbarExportCSV')\n });\n};\nexport const GridPrintExportMenuItem = props => {\n const apiRef = useGridApiContext();\n const {\n hideMenu,\n options\n } = props;\n return /*#__PURE__*/_jsx(MenuItem, {\n onClick: () => {\n apiRef.current.exportDataAsPrint(options);\n hideMenu == null ? void 0 : hideMenu();\n },\n children: apiRef.current.getLocaleText('toolbarExportPrint')\n });\n};\nconst GridToolbarExport = /*#__PURE__*/React.forwardRef(function GridToolbarExport(props, ref) {\n const {\n csvOptions = {},\n printOptions = {},\n excelOptions\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const apiRef = useGridApiContext();\n const preProcessedButtons = apiRef.current.unstable_applyPipeProcessors('exportMenu', [], {\n excelOptions,\n csvOptions,\n printOptions\n }).sort((a, b) => a.componentName > b.componentName ? 1 : -1);\n\n if (preProcessedButtons.length === 0) {\n return null;\n }\n\n return /*#__PURE__*/_jsx(GridToolbarExportContainer, _extends({}, other, {\n ref: ref,\n children: preProcessedButtons.map((button, index) => /*#__PURE__*/React.cloneElement(button.component, {\n key: index\n }))\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridToolbarExport.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 csvOptions: PropTypes.object,\n printOptions: PropTypes.object\n} : void 0;\nexport { GridToolbarExport };","import * as React from 'react';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { useGridLogger } from '../../utils/useGridLogger';\nimport { exportAs } from '../../../utils/exportAs';\nimport { buildCSV } from './serializers/csvSerializer';\nimport { getColumnsToExport, defaultGetRowsToExport } from './utils';\nimport { useGridRegisterPipeProcessor } from '../../core/pipeProcessing';\nimport { GridCsvExportMenuItem } from '../../../components/toolbar/GridToolbarExport';\n/**\n * @requires useGridColumns (state)\n * @requires useGridFilter (state)\n * @requires useGridSorting (state)\n * @requires useGridSelection (state)\n * @requires useGridParamsApi (method)\n */\n\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const useGridCsvExport = apiRef => {\n const logger = useGridLogger(apiRef, 'useGridCsvExport');\n const getDataAsCsv = React.useCallback((options = {}) => {\n var _options$getRowsToExp, _options$includeHeade;\n\n logger.debug(`Get data as CSV`);\n const exportedColumns = getColumnsToExport({\n apiRef,\n options\n });\n const getRowsToExport = (_options$getRowsToExp = options.getRowsToExport) != null ? _options$getRowsToExp : defaultGetRowsToExport;\n const exportedRowIds = getRowsToExport({\n apiRef\n });\n return buildCSV({\n columns: exportedColumns,\n rowIds: exportedRowIds,\n getCellParams: apiRef.current.getCellParams,\n delimiterCharacter: options.delimiter || ',',\n includeHeaders: (_options$includeHeade = options.includeHeaders) != null ? _options$includeHeade : true\n });\n }, [logger, apiRef]);\n const exportDataAsCsv = React.useCallback(options => {\n logger.debug(`Export data as CSV`);\n const csv = getDataAsCsv(options);\n const blob = new Blob([options != null && options.utf8WithBom ? new Uint8Array([0xef, 0xbb, 0xbf]) : '', csv], {\n type: 'text/csv'\n });\n exportAs(blob, 'csv', options == null ? void 0 : options.fileName);\n }, [logger, getDataAsCsv]);\n const csvExportApi = {\n getDataAsCsv,\n exportDataAsCsv\n };\n useGridApiMethod(apiRef, csvExportApi, 'GridCsvExportApi');\n /**\n * PRE-PROCESSING\n */\n\n const addExportMenuButtons = React.useCallback((initialValue, options) => {\n var _options$csvOptions;\n\n if ((_options$csvOptions = options.csvOptions) != null && _options$csvOptions.disableToolbarButton) {\n return initialValue;\n }\n\n return [...initialValue, {\n component: /*#__PURE__*/_jsx(GridCsvExportMenuItem, {\n options: options.csvOptions\n }),\n componentName: 'csvExport'\n }];\n }, []);\n useGridRegisterPipeProcessor(apiRef, 'exportMenu', addExportMenuButtons);\n};","/**\n * I have hesitated to use https://github.com/eligrey/FileSaver.js.\n * If we get bug reports that this project solves, we should consider using it.\n *\n * Related resources.\n * https://blog.logrocket.com/programmatic-file-downloads-in-the-browser-9a5186298d5c/\n * https://github.com/mbrn/filefy/blob/ec4ed0b7415d93be7158c23029f2ea1fa0b8e2d9/src/core/BaseBuilder.ts\n * https://unpkg.com/browse/@progress/kendo-file-saver@1.0.7/dist/es/save-as.js\n * https://github.com/ag-grid/ag-grid/blob/9565c219b6210aa85fa833c929d0728f9d163a91/community-modules/csv-export/src/csvExport/downloader.ts\n */\nexport function exportAs(blob, extension = 'csv', filename = document.title || 'untitled') {\n const fullName = `${filename}.${extension}`; // Test download attribute first\n // https://github.com/eligrey/FileSaver.js/issues/193\n\n if ('download' in HTMLAnchorElement.prototype) {\n // Create an object URL for the blob object\n const url = URL.createObjectURL(blob); // Create a new anchor element\n\n const a = document.createElement('a');\n a.href = url;\n a.download = fullName; // Programmatically trigger a click on the anchor element\n // Useful if you want the download to happen automatically\n // Without attaching the anchor element to the DOM\n\n a.click(); // https://github.com/eligrey/FileSaver.js/issues/205\n\n setTimeout(() => {\n URL.revokeObjectURL(url);\n });\n return;\n }\n\n throw new Error('MUI: exportAs not supported');\n}","export const gridRowsMetaSelector = state => state.rowsMeta;","export const GridFeatureModeConstant = {\n client: 'client',\n server: 'server'\n};","import { GridLinkOperator } from '../../../models/gridFilterItem';\nexport const getDefaultGridFilterModel = () => ({\n items: [],\n linkOperator: GridLinkOperator.And,\n quickFilterValues: [],\n quickFilterLogicOperator: GridLinkOperator.And\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.unstable_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 _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { GridLinkOperator } from '../../../models';\nimport { buildWarning } from '../../../utils/warning';\nimport { gridColumnFieldsSelector, gridColumnLookupSelector } from '../columns';\n\n/**\n * Adds default values to the optional fields of a filter items.\n * @param {GridFilterItem} item The raw filter item.\n * @param {React.MutableRefObject} apiRef The API of the grid.\n * @return {GridFilterItem} The clean filter item with an uniq ID and an always-defined operatorValue.\n * TODO: Make the typing reflect the different between GridFilterInputItem and GridFilterItem.\n */\nexport const cleanFilterItem = (item, apiRef) => {\n const cleanItem = _extends({}, item);\n\n if (cleanItem.id == null) {\n cleanItem.id = Math.round(Math.random() * 1e5);\n }\n\n if (cleanItem.operatorValue == null) {\n // Selects a default operator\n // We don't use `apiRef.current.getColumn` because it is not ready during state initialization\n const column = gridColumnLookupSelector(apiRef)[cleanItem.columnField];\n cleanItem.operatorValue = column && column.filterOperators[0].value;\n }\n\n return cleanItem;\n};\nconst filterModelDisableMultiColumnsFilteringWarning = buildWarning(['MUI: The `filterModel` can only contain a single item when the `disableMultipleColumnsFiltering` prop is set to `true`.', 'If you are using the community version of the `DataGrid`, this prop is always `true`.'], 'error');\nconst filterModelMissingItemIdWarning = buildWarning(\"MUI: The 'id' field is required on `filterModel.items` when you use multiple filters.\", 'error');\nconst filterModelMissingItemOperatorWarning = buildWarning(['MUI: One of your filtering item have no `operatorValue` provided.', 'This property will become required on `@mui/x-data-grid@6.X`.']);\nexport const sanitizeFilterModel = (model, disableMultipleColumnsFiltering, apiRef) => {\n const hasSeveralItems = model.items.length > 1;\n let items;\n\n if (hasSeveralItems && disableMultipleColumnsFiltering) {\n filterModelDisableMultiColumnsFilteringWarning();\n items = [model.items[0]];\n } else {\n items = model.items;\n }\n\n const hasItemsWithoutIds = hasSeveralItems && items.some(item => item.id == null);\n const hasItemWithoutOperator = items.some(item => item.operatorValue == null);\n\n if (hasItemsWithoutIds) {\n filterModelMissingItemIdWarning();\n }\n\n if (hasItemWithoutOperator) {\n filterModelMissingItemOperatorWarning();\n }\n\n if (hasItemWithoutOperator || hasItemsWithoutIds) {\n return _extends({}, model, {\n items: items.map(item => cleanFilterItem(item, apiRef))\n });\n }\n\n if (model.items !== items) {\n return _extends({}, model, {\n items\n });\n }\n\n return model;\n};\nexport const mergeStateWithFilterModel = (filterModel, disableMultipleColumnsFiltering, apiRef) => filteringState => _extends({}, filteringState, {\n filterModel: sanitizeFilterModel(filterModel, disableMultipleColumnsFiltering, apiRef)\n});\n/**\n * Generates a method to easily check if a row is matching the current filter model.\n * @param {GridFilterModel} filterModel The model with which we want to filter the rows.\n * @param {React.MutableRefObject} apiRef The API of the grid.\n * @returns {GridAggregatedFilterItemApplier | null} A method that checks if a row is matching the current filter model. If `null`, we consider that all the rows are matching the filters.\n */\n\nexport const buildAggregatedFilterItemsApplier = (filterModel, apiRef) => {\n const {\n items,\n linkOperator = GridLinkOperator.And\n } = filterModel;\n\n const getFilterCallbackFromItem = filterItem => {\n if (!filterItem.columnField || !filterItem.operatorValue) {\n return null;\n }\n\n const column = apiRef.current.getColumn(filterItem.columnField);\n\n if (!column) {\n return null;\n }\n\n let parsedValue;\n\n if (column.valueParser) {\n var _filterItem$value;\n\n const parser = column.valueParser;\n parsedValue = Array.isArray(filterItem.value) ? (_filterItem$value = filterItem.value) == null ? void 0 : _filterItem$value.map(x => parser(x)) : parser(filterItem.value);\n } else {\n parsedValue = filterItem.value;\n }\n\n const newFilterItem = _extends({}, filterItem, {\n value: parsedValue\n });\n\n const filterOperators = column.filterOperators;\n\n if (!(filterOperators != null && filterOperators.length)) {\n throw new Error(`MUI: No filter operators found for column '${column.field}'.`);\n }\n\n const filterOperator = filterOperators.find(operator => operator.value === newFilterItem.operatorValue);\n\n if (!filterOperator) {\n throw new Error(`MUI: No filter operator found for column '${column.field}' and operator value '${newFilterItem.operatorValue}'.`);\n }\n\n const applyFilterOnRow = filterOperator.getApplyFilterFn(newFilterItem, column);\n\n if (typeof applyFilterOnRow !== 'function') {\n return null;\n }\n\n const fn = rowId => {\n const cellParams = apiRef.current.getCellParams(rowId, newFilterItem.columnField);\n return applyFilterOnRow(cellParams);\n };\n\n return {\n fn,\n item: newFilterItem\n };\n };\n\n const appliers = items.map(getFilterCallbackFromItem).filter(callback => !!callback);\n\n if (appliers.length === 0) {\n return null;\n }\n\n return (rowId, shouldApplyFilter) => {\n const filteredAppliers = shouldApplyFilter ? appliers.filter(applier => shouldApplyFilter(applier.item.columnField)) : appliers; // Return `false` as soon as we have a failing filter\n\n if (linkOperator === GridLinkOperator.And) {\n return filteredAppliers.every(applier => applier.fn(rowId));\n } // Return `true` as soon as we have a passing filter\n\n\n return filteredAppliers.some(applier => applier.fn(rowId));\n };\n};\n/**\n * Generates a method to easily check if a row is matching the current quick filter.\n * @param {any[]} values The model with which we want to filter the rows.\n * @param {React.MutableRefObject} apiRef The API of the grid.\n * @returns {GridAggregatedFilterItemApplier | null} A method that checks if a row is matching the current filter model. If `null`, we consider that all the rows are matching the filters.\n */\n\nexport const buildAggregatedQuickFilterApplier = (filterModel, apiRef) => {\n const {\n quickFilterValues = [],\n quickFilterLogicOperator = GridLinkOperator.And\n } = filterModel;\n\n if (quickFilterValues.length === 0) {\n return null;\n }\n\n const columnsFields = gridColumnFieldsSelector(apiRef);\n const appliersPerColumnField = {};\n columnsFields.forEach(field => {\n const column = apiRef.current.getColumn(field);\n const getApplyQuickFilterFn = column == null ? void 0 : column.getApplyQuickFilterFn;\n\n if (!getApplyQuickFilterFn) {\n return;\n }\n\n appliersPerColumnField[field] = quickFilterValues.map(value => getApplyQuickFilterFn(value, column, apiRef));\n }); // If some value does not have an applier we ignore them\n\n const sanitizedQuickFilterValues = quickFilterValues.filter((value, index) => Object.keys(appliersPerColumnField).some(field => appliersPerColumnField[field][index] != null));\n return (rowId, shouldApplyFilter) => {\n const usedCellParams = {};\n const columnsFieldsToFilter = [];\n Object.keys(appliersPerColumnField).forEach(columnField => {\n if (!shouldApplyFilter || shouldApplyFilter(columnField)) {\n usedCellParams[columnField] = apiRef.current.getCellParams(rowId, columnField);\n columnsFieldsToFilter.push(columnField);\n }\n }); // Return `false` as soon as we have a quick filter value that does not match any column\n\n if (quickFilterLogicOperator === GridLinkOperator.And) {\n return sanitizedQuickFilterValues.every((value, index) => columnsFieldsToFilter.some(field => {\n var _appliersPerColumnFie, _appliersPerColumnFie2;\n\n if (appliersPerColumnField[field][index] == null) {\n return false;\n }\n\n return (_appliersPerColumnFie = (_appliersPerColumnFie2 = appliersPerColumnField[field])[index]) == null ? void 0 : _appliersPerColumnFie.call(_appliersPerColumnFie2, usedCellParams[field]);\n }));\n } // Return `true` as soon as we have have a quick filter value that match any column\n\n\n return sanitizedQuickFilterValues.some((value, index) => columnsFieldsToFilter.some(field => {\n var _appliersPerColumnFie3, _appliersPerColumnFie4;\n\n if (appliersPerColumnField[field][index] == null) {\n return false;\n }\n\n return (_appliersPerColumnFie3 = (_appliersPerColumnFie4 = appliersPerColumnField[field])[index]) == null ? void 0 : _appliersPerColumnFie3.call(_appliersPerColumnFie4, usedCellParams[field]);\n }));\n };\n};\nexport const buildAggregatedFilterApplier = (filterModel, apiRef) => {\n const isRowMatchingFilterItems = buildAggregatedFilterItemsApplier(filterModel, apiRef);\n const isRowMatchingQuickFilter = buildAggregatedQuickFilterApplier(filterModel, apiRef);\n\n if (isRowMatchingFilterItems == null && isRowMatchingQuickFilter == null) {\n return null;\n }\n\n if (isRowMatchingFilterItems == null) {\n return isRowMatchingQuickFilter;\n }\n\n if (isRowMatchingQuickFilter == null) {\n return isRowMatchingFilterItems;\n }\n\n return (rowId, shouldApplyFilter) => isRowMatchingFilterItems(rowId, shouldApplyFilter) && isRowMatchingQuickFilter(rowId, shouldApplyFilter);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { GridFeatureModeConstant } from '../../../models/gridFeatureMode';\nimport { useGridApiEventHandler } from '../../utils/useGridApiEventHandler';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { useGridLogger } from '../../utils/useGridLogger';\nimport { gridFilterableColumnLookupSelector } from '../columns/gridColumnsSelector';\nimport { GridPreferencePanelsValue } from '../preferencesPanel/gridPreferencePanelsValue';\nimport { getDefaultGridFilterModel } from './gridFilterState';\nimport { gridFilterModelSelector, gridVisibleSortedRowEntriesSelector } from './gridFilterSelector';\nimport { useFirstRender } from '../../utils/useFirstRender';\nimport { gridRowIdsSelector } from '../rows';\nimport { useGridRegisterPipeProcessor } from '../../core/pipeProcessing';\nimport { GRID_DEFAULT_STRATEGY, useGridRegisterStrategyProcessor } from '../../core/strategyProcessing';\nimport { buildAggregatedFilterApplier, sanitizeFilterModel, mergeStateWithFilterModel, cleanFilterItem } from './gridFilterUtils';\nimport { isDeepEqual } from '../../../utils/utils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const filterStateInitializer = (state, props, apiRef) => {\n var _ref, _props$filterModel, _props$initialState, _props$initialState$f;\n\n const filterModel = (_ref = (_props$filterModel = props.filterModel) != null ? _props$filterModel : (_props$initialState = props.initialState) == null ? void 0 : (_props$initialState$f = _props$initialState.filter) == null ? void 0 : _props$initialState$f.filterModel) != null ? _ref : getDefaultGridFilterModel();\n return _extends({}, state, {\n filter: {\n filterModel: sanitizeFilterModel(filterModel, props.disableMultipleColumnsFiltering, apiRef),\n visibleRowsLookup: {},\n filteredDescendantCountLookup: {}\n }\n });\n};\n/**\n * @requires useGridColumns (method, event)\n * @requires useGridParamsApi (method)\n * @requires useGridRows (event)\n */\n\nexport const useGridFilter = (apiRef, props) => {\n var _props$componentsProp2;\n\n const logger = useGridLogger(apiRef, 'useGridFilter');\n apiRef.current.unstable_registerControlState({\n stateId: 'filter',\n propModel: props.filterModel,\n propOnChange: props.onFilterModelChange,\n stateSelector: gridFilterModelSelector,\n changeEvent: 'filterModelChange'\n });\n const updateFilteredRows = React.useCallback(() => {\n apiRef.current.setState(state => {\n const filterModel = gridFilterModelSelector(state, apiRef.current.instanceId);\n const isRowMatchingFilters = props.filterMode === GridFeatureModeConstant.client ? buildAggregatedFilterApplier(filterModel, apiRef) : null;\n const filteringResult = apiRef.current.unstable_applyStrategyProcessor('filtering', {\n isRowMatchingFilters\n });\n return _extends({}, state, {\n filter: _extends({}, state.filter, filteringResult)\n });\n });\n apiRef.current.publishEvent('filteredRowsSet');\n }, [props.filterMode, apiRef]);\n /**\n * API METHODS\n */\n\n const applyFilters = React.useCallback(() => {\n updateFilteredRows();\n apiRef.current.forceUpdate();\n }, [apiRef, updateFilteredRows]);\n const upsertFilterItem = React.useCallback(item => {\n const filterModel = gridFilterModelSelector(apiRef);\n const items = [...filterModel.items];\n const itemIndex = items.findIndex(filterItem => filterItem.id === item.id);\n\n if (itemIndex === -1) {\n items.push(item);\n } else {\n items[itemIndex] = item;\n }\n\n apiRef.current.setFilterModel(_extends({}, filterModel, {\n items\n }), 'upsertFilterItem');\n }, [apiRef]);\n const upsertFilterItems = React.useCallback(items => {\n const filterModel = gridFilterModelSelector(apiRef);\n const existingItems = [...filterModel.items];\n items.forEach(item => {\n const itemIndex = items.findIndex(filterItem => filterItem.id === item.id);\n\n if (itemIndex === -1) {\n existingItems.push(item);\n } else {\n existingItems[itemIndex] = item;\n }\n });\n apiRef.current.setFilterModel(_extends({}, filterModel, {\n items\n }), 'upsertFilterItems');\n }, [apiRef]);\n const deleteFilterItem = React.useCallback(itemToDelete => {\n const filterModel = gridFilterModelSelector(apiRef);\n const items = filterModel.items.filter(item => item.id !== itemToDelete.id);\n\n if (items.length === filterModel.items.length) {\n return;\n }\n\n apiRef.current.setFilterModel(_extends({}, filterModel, {\n items\n }), 'deleteFilterItem');\n }, [apiRef]);\n const showFilterPanel = React.useCallback(targetColumnField => {\n logger.debug('Displaying filter panel');\n\n if (targetColumnField) {\n const filterModel = gridFilterModelSelector(apiRef);\n const filterItemsWithValue = filterModel.items.filter(item => item.value !== undefined);\n let newFilterItems;\n const filterItemOnTarget = filterItemsWithValue.find(item => item.columnField === targetColumnField);\n\n if (filterItemOnTarget) {\n newFilterItems = filterItemsWithValue;\n } else if (props.disableMultipleColumnsFiltering) {\n newFilterItems = [cleanFilterItem({\n columnField: targetColumnField\n }, apiRef)];\n } else {\n newFilterItems = [...filterItemsWithValue, cleanFilterItem({\n columnField: targetColumnField\n }, apiRef)];\n }\n\n apiRef.current.setFilterModel(_extends({}, filterModel, {\n items: newFilterItems\n }));\n }\n\n apiRef.current.showPreferences(GridPreferencePanelsValue.filters);\n }, [apiRef, logger, props.disableMultipleColumnsFiltering]);\n const hideFilterPanel = React.useCallback(() => {\n logger.debug('Hiding filter panel');\n apiRef.current.hidePreferences();\n }, [apiRef, logger]);\n const setFilterLinkOperator = React.useCallback(linkOperator => {\n const filterModel = gridFilterModelSelector(apiRef);\n\n if (filterModel.linkOperator === linkOperator) {\n return;\n }\n\n apiRef.current.setFilterModel(_extends({}, filterModel, {\n linkOperator\n }), 'changeLogicOperator');\n }, [apiRef]);\n const setQuickFilterValues = React.useCallback(values => {\n const filterModel = gridFilterModelSelector(apiRef);\n\n if (isDeepEqual(filterModel.quickFilterValues, values)) {\n return;\n }\n\n apiRef.current.setFilterModel(_extends({}, filterModel, {\n quickFilterValues: [...values]\n }));\n }, [apiRef]);\n const setFilterModel = React.useCallback((model, reason) => {\n const currentModel = gridFilterModelSelector(apiRef);\n\n if (currentModel !== model) {\n logger.debug('Setting filter model');\n apiRef.current.unstable_updateControlState('filter', mergeStateWithFilterModel(model, props.disableMultipleColumnsFiltering, apiRef), reason);\n apiRef.current.unstable_applyFilters();\n }\n }, [apiRef, logger, props.disableMultipleColumnsFiltering]);\n const getVisibleRowModels = React.useCallback(() => {\n const visibleSortedRows = gridVisibleSortedRowEntriesSelector(apiRef);\n return new Map(visibleSortedRows.map(row => [row.id, row.model]));\n }, [apiRef]);\n const filterApi = {\n setFilterLinkOperator,\n unstable_applyFilters: applyFilters,\n deleteFilterItem,\n upsertFilterItem,\n upsertFilterItems,\n setFilterModel,\n showFilterPanel,\n hideFilterPanel,\n getVisibleRowModels,\n setQuickFilterValues\n };\n useGridApiMethod(apiRef, filterApi, 'GridFilterApi');\n /**\n * PRE-PROCESSING\n */\n\n const stateExportPreProcessing = React.useCallback(prevState => {\n const filterModelToExport = gridFilterModelSelector(apiRef);\n\n if (filterModelToExport.items.length === 0 && filterModelToExport.linkOperator === getDefaultGridFilterModel().linkOperator) {\n return prevState;\n }\n\n return _extends({}, prevState, {\n filter: {\n filterModel: filterModelToExport\n }\n });\n }, [apiRef]);\n const stateRestorePreProcessing = React.useCallback((params, context) => {\n var _context$stateToResto;\n\n const filterModel = (_context$stateToResto = context.stateToRestore.filter) == null ? void 0 : _context$stateToResto.filterModel;\n\n if (filterModel == null) {\n return params;\n }\n\n apiRef.current.unstable_updateControlState('filter', mergeStateWithFilterModel(filterModel, props.disableMultipleColumnsFiltering, apiRef), 'restoreState');\n return _extends({}, params, {\n callbacks: [...params.callbacks, apiRef.current.unstable_applyFilters]\n });\n }, [apiRef, props.disableMultipleColumnsFiltering]);\n const preferencePanelPreProcessing = React.useCallback((initialValue, value) => {\n if (value === GridPreferencePanelsValue.filters) {\n var _props$componentsProp;\n\n const FilterPanel = props.components.FilterPanel;\n return /*#__PURE__*/_jsx(FilterPanel, _extends({}, (_props$componentsProp = props.componentsProps) == null ? void 0 : _props$componentsProp.filterPanel));\n }\n\n return initialValue;\n }, [props.components.FilterPanel, (_props$componentsProp2 = props.componentsProps) == null ? void 0 : _props$componentsProp2.filterPanel]);\n const flatFilteringMethod = React.useCallback(params => {\n if (props.filterMode === GridFeatureModeConstant.client && params.isRowMatchingFilters) {\n const rowIds = gridRowIdsSelector(apiRef);\n const filteredRowsLookup = {};\n\n for (let i = 0; i < rowIds.length; i += 1) {\n const rowId = rowIds[i];\n filteredRowsLookup[rowId] = params.isRowMatchingFilters(rowId);\n }\n\n return {\n filteredRowsLookup,\n // For flat tree, the `visibleRowsLookup` and the `filteredRowsLookup` since no row is collapsed.\n visibleRowsLookup: filteredRowsLookup,\n filteredDescendantCountLookup: {}\n };\n }\n\n return {\n visibleRowsLookup: {},\n filteredRowsLookup: {},\n filteredDescendantCountLookup: {}\n };\n }, [apiRef, props.filterMode]);\n useGridRegisterPipeProcessor(apiRef, 'exportState', stateExportPreProcessing);\n useGridRegisterPipeProcessor(apiRef, 'restoreState', stateRestorePreProcessing);\n useGridRegisterPipeProcessor(apiRef, 'preferencePanel', preferencePanelPreProcessing);\n useGridRegisterStrategyProcessor(apiRef, GRID_DEFAULT_STRATEGY, 'filtering', flatFilteringMethod);\n /**\n * EVENTS\n */\n\n const handleColumnsChange = React.useCallback(() => {\n logger.debug('onColUpdated - GridColumns changed, applying filters');\n const filterModel = gridFilterModelSelector(apiRef);\n const filterableColumnsLookup = gridFilterableColumnLookupSelector(apiRef);\n const newFilterItems = filterModel.items.filter(item => item.columnField && filterableColumnsLookup[item.columnField]);\n\n if (newFilterItems.length < filterModel.items.length) {\n apiRef.current.setFilterModel(_extends({}, filterModel, {\n items: newFilterItems\n }));\n }\n }, [apiRef, logger]);\n const handleStrategyProcessorChange = React.useCallback(methodName => {\n if (methodName === 'filtering') {\n apiRef.current.unstable_applyFilters();\n }\n }, [apiRef]); // Do not call `apiRef.current.forceUpdate` to avoid re-render before updating the sorted rows.\n // Otherwise, the state is not consistent during the render\n\n useGridApiEventHandler(apiRef, 'rowsSet', updateFilteredRows);\n useGridApiEventHandler(apiRef, 'rowExpansionChange', apiRef.current.unstable_applyFilters);\n useGridApiEventHandler(apiRef, 'columnsChange', handleColumnsChange);\n useGridApiEventHandler(apiRef, 'activeStrategyProcessorChange', handleStrategyProcessorChange);\n /**\n * 1ST RENDER\n */\n\n useFirstRender(() => {\n apiRef.current.unstable_applyFilters();\n });\n /**\n * EFFECTS\n */\n\n React.useEffect(() => {\n if (props.filterModel !== undefined) {\n apiRef.current.setFilterModel(props.filterModel);\n }\n }, [apiRef, logger, props.filterModel]);\n};","import * as React from 'react';\nimport { gridPaginationRowRangeSelector, gridPaginatedVisibleSortedGridRowEntriesSelector } from '../features/pagination/gridPaginationSelector';\nimport { gridVisibleSortedRowEntriesSelector } from '../features/filter/gridFilterSelector';\nexport const getVisibleRows = (apiRef, props) => {\n let rows;\n let range;\n\n if (props.pagination && props.paginationMode === 'client') {\n range = gridPaginationRowRangeSelector(apiRef);\n rows = gridPaginatedVisibleSortedGridRowEntriesSelector(apiRef);\n } else {\n rows = gridVisibleSortedRowEntriesSelector(apiRef);\n\n if (rows.length === 0) {\n range = null;\n } else {\n range = {\n firstRowIndex: 0,\n lastRowIndex: rows.length - 1\n };\n }\n }\n\n return {\n rows,\n range\n };\n};\n/**\n * Computes the list of rows that are reachable by scroll.\n * Depending on whether pagination is enabled, it will return the rows in the current page.\n * - If the pagination is disabled or in server mode, it equals all the visible rows.\n * - If the row tree has several layers, it contains up to `state.pageSize` top level rows and all their descendants.\n * - If the row tree is flat, it only contains up to `state.pageSize` rows.\n */\n\nexport const useGridVisibleRows = (apiRef, props) => {\n const response = getVisibleRows(apiRef, props);\n return React.useMemo(() => ({\n rows: response.rows,\n range: response.range\n }), [response.rows, response.range]);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { ownerDocument } from '@mui/material/utils';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { useGridLogger } from '../../utils/useGridLogger';\nimport { useGridApiEventHandler } from '../../utils/useGridApiEventHandler';\nimport { isNavigationKey } from '../../../utils/keyboardUtils';\nimport { gridFocusCellSelector } from './gridFocusStateSelector';\nimport { gridVisibleColumnDefinitionsSelector } from '../columns/gridColumnsSelector';\nimport { getVisibleRows } from '../../utils/useGridVisibleRows';\nimport { clamp } from '../../../utils/utils';\nexport const focusStateInitializer = state => _extends({}, state, {\n focus: {\n cell: null,\n columnHeader: null\n },\n tabIndex: {\n cell: null,\n columnHeader: null\n }\n});\n/**\n * @requires useGridParamsApi (method)\n * @requires useGridRows (method)\n * @requires useGridEditing (event)\n */\n\nexport const useGridFocus = (apiRef, props) => {\n const logger = useGridLogger(apiRef, 'useGridFocus');\n const lastClickedCell = React.useRef(null);\n const setCellFocus = React.useCallback((id, field) => {\n const focusedCell = gridFocusCellSelector(apiRef);\n\n if ((focusedCell == null ? void 0 : focusedCell.id) === id && (focusedCell == null ? void 0 : focusedCell.field) === field) {\n return;\n }\n\n apiRef.current.setState(state => {\n logger.debug(`Focusing on cell with id=${id} and field=${field}`);\n return _extends({}, state, {\n tabIndex: {\n cell: {\n id,\n field\n },\n columnHeader: null\n },\n focus: {\n cell: {\n id,\n field\n },\n columnHeader: null\n }\n });\n });\n apiRef.current.forceUpdate(); // The row might have been deleted\n\n if (!apiRef.current.getRow(id)) {\n return;\n }\n\n apiRef.current.publishEvent('cellFocusIn', apiRef.current.getCellParams(id, field));\n }, [apiRef, logger]);\n const setColumnHeaderFocus = React.useCallback((field, event = {}) => {\n const cell = gridFocusCellSelector(apiRef);\n\n if (cell) {\n apiRef.current.publishEvent('cellFocusOut', apiRef.current.getCellParams(cell.id, cell.field), event);\n }\n\n apiRef.current.setState(state => {\n logger.debug(`Focusing on column header with colIndex=${field}`);\n return _extends({}, state, {\n tabIndex: {\n columnHeader: {\n field\n },\n cell: null\n },\n focus: {\n columnHeader: {\n field\n },\n cell: null\n }\n });\n });\n apiRef.current.forceUpdate();\n }, [apiRef, logger]);\n const moveFocusToRelativeCell = React.useCallback((id, field, direction) => {\n let columnIndexToFocus = apiRef.current.getColumnIndex(field);\n let rowIndexToFocus = apiRef.current.getRowIndexRelativeToVisibleRows(id);\n const visibleColumns = gridVisibleColumnDefinitionsSelector(apiRef);\n\n if (direction === 'right') {\n columnIndexToFocus += 1;\n } else if (direction === 'left') {\n columnIndexToFocus -= 1;\n } else {\n rowIndexToFocus += 1;\n }\n\n const currentPage = getVisibleRows(apiRef, {\n pagination: props.pagination,\n paginationMode: props.paginationMode\n });\n\n if (columnIndexToFocus >= visibleColumns.length) {\n // Go to next row if we are after the last column\n rowIndexToFocus += 1;\n\n if (rowIndexToFocus < currentPage.rows.length) {\n // Go to first column of the next row if there's one more row\n columnIndexToFocus = 0;\n }\n } else if (columnIndexToFocus < 0) {\n // Go to previous row if we are before the first column\n rowIndexToFocus -= 1;\n\n if (rowIndexToFocus >= 0) {\n // Go to last column of the previous if there's one more row\n columnIndexToFocus = visibleColumns.length - 1;\n }\n }\n\n rowIndexToFocus = clamp(rowIndexToFocus, 0, currentPage.rows.length - 1);\n columnIndexToFocus = clamp(columnIndexToFocus, 0, visibleColumns.length - 1);\n const rowToFocus = currentPage.rows[rowIndexToFocus];\n const columnToFocus = visibleColumns[columnIndexToFocus];\n apiRef.current.setCellFocus(rowToFocus.id, columnToFocus.field);\n }, [apiRef, props.pagination, props.paginationMode]);\n const handleCellDoubleClick = React.useCallback(({\n id,\n field\n }) => {\n apiRef.current.setCellFocus(id, field);\n }, [apiRef]);\n const handleCellKeyDown = React.useCallback((params, event) => {\n // GRID_CELL_NAVIGATION_KEY_DOWN handles the focus on Enter, Tab and navigation keys\n if (event.key === 'Enter' || event.key === 'Tab' || isNavigationKey(event.key)) {\n return;\n }\n\n apiRef.current.setCellFocus(params.id, params.field);\n }, [apiRef]);\n const handleColumnHeaderFocus = React.useCallback(({\n field\n }, event) => {\n if (event.target !== event.currentTarget) {\n return;\n }\n\n apiRef.current.setColumnHeaderFocus(field, event);\n }, [apiRef]);\n const handleBlur = React.useCallback(() => {\n logger.debug(`Clearing focus`);\n apiRef.current.setState(state => _extends({}, state, {\n focus: {\n cell: null,\n columnHeader: null\n }\n }));\n }, [logger, apiRef]);\n const handleCellMouseUp = React.useCallback(params => {\n lastClickedCell.current = params;\n }, []);\n const handleDocumentClick = React.useCallback(event => {\n const cellParams = lastClickedCell.current;\n lastClickedCell.current = null;\n const focusedCell = gridFocusCellSelector(apiRef);\n\n if (!focusedCell) {\n if (cellParams) {\n apiRef.current.setCellFocus(cellParams.id, cellParams.field);\n }\n\n return;\n }\n\n if ((cellParams == null ? void 0 : cellParams.id) === focusedCell.id && (cellParams == null ? void 0 : cellParams.field) === focusedCell.field) {\n return;\n }\n\n const cellElement = apiRef.current.getCellElement(focusedCell.id, focusedCell.field);\n\n if (cellElement != null && cellElement.contains(event.target)) {\n return;\n } // The row might have been deleted during the click\n\n\n if (!apiRef.current.getRow(focusedCell.id)) {\n return;\n } // There's a focused cell but another cell was clicked\n // Publishes an event to notify that the focus was lost\n\n\n apiRef.current.publishEvent('cellFocusOut', apiRef.current.getCellParams(focusedCell.id, focusedCell.field), event);\n\n if (cellParams) {\n apiRef.current.setCellFocus(cellParams.id, cellParams.field);\n } else {\n apiRef.current.setState(state => _extends({}, state, {\n focus: {\n cell: null,\n columnHeader: null\n }\n }));\n apiRef.current.forceUpdate();\n }\n }, [apiRef]);\n const handleCellModeChange = React.useCallback(params => {\n if (params.cellMode === 'view') {\n return;\n }\n\n const cell = gridFocusCellSelector(apiRef);\n\n if ((cell == null ? void 0 : cell.id) !== params.id || (cell == null ? void 0 : cell.field) !== params.field) {\n apiRef.current.setCellFocus(params.id, params.field);\n }\n }, [apiRef]);\n const handleRowSet = React.useCallback(() => {\n const cell = gridFocusCellSelector(apiRef); // If the focused cell is in a row which does not exist anymore, then remove the focus\n\n if (cell && !apiRef.current.getRow(cell.id)) {\n apiRef.current.setState(state => _extends({}, state, {\n focus: {\n cell: null,\n columnHeader: null\n }\n }));\n }\n }, [apiRef]);\n useGridApiMethod(apiRef, {\n setCellFocus,\n setColumnHeaderFocus,\n unstable_moveFocusToRelativeCell: moveFocusToRelativeCell\n }, 'GridFocusApi');\n React.useEffect(() => {\n const doc = ownerDocument(apiRef.current.rootElementRef.current);\n doc.addEventListener('click', handleDocumentClick);\n return () => {\n doc.removeEventListener('click', handleDocumentClick);\n };\n }, [apiRef, handleDocumentClick]);\n useGridApiEventHandler(apiRef, 'columnHeaderBlur', handleBlur);\n useGridApiEventHandler(apiRef, 'cellDoubleClick', handleCellDoubleClick);\n useGridApiEventHandler(apiRef, 'cellMouseUp', handleCellMouseUp);\n useGridApiEventHandler(apiRef, 'cellKeyDown', handleCellKeyDown);\n useGridApiEventHandler(apiRef, 'cellModeChange', handleCellModeChange);\n useGridApiEventHandler(apiRef, 'columnHeaderFocus', handleColumnHeaderFocus);\n useGridApiEventHandler(apiRef, 'rowsSet', handleRowSet);\n};","// Can't import from pro package - hence duplication\nexport const GRID_DETAIL_PANEL_TOGGLE_FIELD = '__detail_panel_toggle__';","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridLogger, useGridApiMethod, useGridApiEventHandler, useGridSelector } from '../../utils';\nimport { gridPageSizeSelector } from './gridPaginationSelector';\nimport { gridDensityRowHeightSelector } from '../density';\nimport { useGridRegisterPipeProcessor } from '../../core/pipeProcessing';\nexport const defaultPageSize = autoPageSize => autoPageSize ? 0 : 100;\n\nconst mergeStateWithPageSize = pageSize => state => _extends({}, state, {\n pagination: _extends({}, state.pagination, {\n pageSize\n })\n});\n/**\n * @requires useGridDimensions (event) - can be after\n */\n\n\nexport const useGridPageSize = (apiRef, props) => {\n var _props$initialState2, _props$initialState2$;\n\n const logger = useGridLogger(apiRef, 'useGridPageSize');\n const rowHeight = useGridSelector(apiRef, gridDensityRowHeightSelector);\n apiRef.current.unstable_registerControlState({\n stateId: 'pageSize',\n propModel: props.pageSize,\n propOnChange: props.onPageSizeChange,\n stateSelector: gridPageSizeSelector,\n changeEvent: 'pageSizeChange'\n });\n /**\n * API METHODS\n */\n\n const setPageSize = React.useCallback(pageSize => {\n if (pageSize === gridPageSizeSelector(apiRef)) {\n return;\n }\n\n logger.debug(`Setting page size to ${pageSize}`);\n apiRef.current.setState(mergeStateWithPageSize(pageSize));\n apiRef.current.forceUpdate();\n }, [apiRef, logger]);\n const pageSizeApi = {\n setPageSize\n };\n useGridApiMethod(apiRef, pageSizeApi, 'GridPageSizeApi');\n /**\n * PRE-PROCESSING\n */\n\n const stateExportPreProcessing = React.useCallback(prevState => {\n var _props$initialState, _props$initialState$p;\n\n const pageSizeToExport = gridPageSizeSelector(apiRef);\n const shouldExportPageSize = // Always export if the page size is controlled\n props.pageSize != null || // Always export if the page size has been initialized\n ((_props$initialState = props.initialState) == null ? void 0 : (_props$initialState$p = _props$initialState.pagination) == null ? void 0 : _props$initialState$p.pageSize) != null || // Export if the page size value is not equal to the default value\n pageSizeToExport !== defaultPageSize(props.autoPageSize);\n\n if (!shouldExportPageSize) {\n return prevState;\n }\n\n return _extends({}, prevState, {\n pagination: _extends({}, prevState.pagination, {\n pageSize: pageSizeToExport\n })\n });\n }, [apiRef, props.pageSize, (_props$initialState2 = props.initialState) == null ? void 0 : (_props$initialState2$ = _props$initialState2.pagination) == null ? void 0 : _props$initialState2$.pageSize, props.autoPageSize]);\n /**\n * TODO: Add error if `prop.autoHeight = true`\n */\n\n const stateRestorePreProcessing = React.useCallback((params, context) => {\n var _context$stateToResto;\n\n const pageSize = (_context$stateToResto = context.stateToRestore.pagination) == null ? void 0 : _context$stateToResto.pageSize;\n\n if (pageSize != null) {\n apiRef.current.setState(mergeStateWithPageSize(pageSize));\n }\n\n return params;\n }, [apiRef]);\n useGridRegisterPipeProcessor(apiRef, 'exportState', stateExportPreProcessing);\n useGridRegisterPipeProcessor(apiRef, 'restoreState', stateRestorePreProcessing);\n /**\n * EVENTS\n */\n\n const handleUpdateAutoPageSize = React.useCallback(() => {\n const dimensions = apiRef.current.getRootDimensions();\n\n if (!props.autoPageSize || !dimensions) {\n return;\n }\n\n const maximumPageSizeWithoutScrollBar = Math.floor(dimensions.viewportInnerSize.height / rowHeight);\n apiRef.current.setPageSize(maximumPageSizeWithoutScrollBar);\n }, [apiRef, props.autoPageSize, rowHeight]);\n useGridApiEventHandler(apiRef, 'viewportInnerSizeChange', handleUpdateAutoPageSize);\n /**\n * EFFECTS\n */\n\n React.useEffect(() => {\n if (props.pageSize != null && !props.autoPageSize) {\n apiRef.current.setPageSize(props.pageSize);\n }\n }, [apiRef, props.autoPageSize, props.pageSize]);\n React.useEffect(() => {\n handleUpdateAutoPageSize();\n }, [handleUpdateAutoPageSize]);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridLogger, useGridSelector, useGridApiMethod, useGridApiEventHandler } from '../../utils';\nimport { gridVisibleTopLevelRowCountSelector } from '../filter';\nimport { gridPageSelector, gridPageSizeSelector } from './gridPaginationSelector';\nimport { useGridRegisterPipeProcessor } from '../../core/pipeProcessing';\nimport { buildWarning } from '../../../utils/warning';\nexport const getPageCount = (rowCount, pageSize) => {\n if (pageSize > 0 && rowCount > 0) {\n return Math.ceil(rowCount / pageSize);\n }\n\n return 0;\n};\n\nconst applyValidPage = paginationState => {\n if (!paginationState.pageCount) {\n return paginationState;\n }\n\n return _extends({}, paginationState, {\n page: Math.max(Math.min(paginationState.page, paginationState.pageCount - 1), 0)\n });\n};\n\nconst mergeStateWithPage = page => state => _extends({}, state, {\n pagination: applyValidPage(_extends({}, state.pagination, {\n page\n }))\n});\n\nconst noRowCountInServerMode = buildWarning([\"MUI: the 'rowCount' prop is undefined while using paginationMode='server'\", 'For more detail, see http://mui.com/components/data-grid/pagination/#basic-implementation'], 'error');\n/**\n * @requires useGridPageSize (event)\n */\n\nexport const useGridPage = (apiRef, props) => {\n var _props$initialState2, _props$initialState2$;\n\n const logger = useGridLogger(apiRef, 'useGridPage');\n const visibleTopLevelRowCount = useGridSelector(apiRef, gridVisibleTopLevelRowCountSelector);\n apiRef.current.unstable_registerControlState({\n stateId: 'page',\n propModel: props.page,\n propOnChange: props.onPageChange,\n stateSelector: gridPageSelector,\n changeEvent: 'pageChange'\n });\n /**\n * API METHODS\n */\n\n const setPage = React.useCallback(page => {\n logger.debug(`Setting page to ${page}`);\n apiRef.current.setState(mergeStateWithPage(page));\n apiRef.current.forceUpdate();\n }, [apiRef, logger]);\n const pageApi = {\n setPage\n };\n useGridApiMethod(apiRef, pageApi, 'GridPageApi');\n /**\n * PRE-PROCESSING\n */\n\n const stateExportPreProcessing = React.useCallback(prevState => {\n var _props$initialState, _props$initialState$p;\n\n const pageToExport = gridPageSelector(apiRef);\n const shouldExportPage = // Always export if the page is controlled\n props.page != null || // Always export if the page has been initialized\n ((_props$initialState = props.initialState) == null ? void 0 : (_props$initialState$p = _props$initialState.pagination) == null ? void 0 : _props$initialState$p.page) != null || // Export if the page value is not equal to the default value\n pageToExport !== 0;\n\n if (!shouldExportPage) {\n return prevState;\n }\n\n return _extends({}, prevState, {\n pagination: _extends({}, prevState.pagination, {\n page: pageToExport\n })\n });\n }, [apiRef, props.page, (_props$initialState2 = props.initialState) == null ? void 0 : (_props$initialState2$ = _props$initialState2.pagination) == null ? void 0 : _props$initialState2$.page]);\n const stateRestorePreProcessing = React.useCallback((params, context) => {\n var _context$stateToResto, _context$stateToResto2;\n\n // We apply the constraint even if the page did not change in case the pageSize changed.\n const page = (_context$stateToResto = (_context$stateToResto2 = context.stateToRestore.pagination) == null ? void 0 : _context$stateToResto2.page) != null ? _context$stateToResto : gridPageSelector(apiRef);\n apiRef.current.setState(mergeStateWithPage(page));\n return params;\n }, [apiRef]);\n useGridRegisterPipeProcessor(apiRef, 'exportState', stateExportPreProcessing);\n useGridRegisterPipeProcessor(apiRef, 'restoreState', stateRestorePreProcessing);\n /**\n * EVENTS\n */\n\n const handlePageSizeChange = pageSize => {\n apiRef.current.setState(state => {\n const pageCount = getPageCount(state.pagination.rowCount, pageSize);\n return _extends({}, state, {\n pagination: applyValidPage(_extends({}, state.pagination, {\n pageCount,\n page: state.pagination.page\n }))\n });\n });\n apiRef.current.forceUpdate();\n };\n\n const handlePageChange = () => apiRef.current.scrollToIndexes({\n rowIndex: gridPageSelector(apiRef) * gridPageSizeSelector(apiRef)\n });\n\n useGridApiEventHandler(apiRef, 'pageSizeChange', handlePageSizeChange);\n useGridApiEventHandler(apiRef, 'pageChange', handlePageChange);\n /**\n * EFFECTS\n */\n\n React.useEffect(() => {\n if (process.env.NODE_ENV !== 'production') {\n if (props.paginationMode === 'server' && props.rowCount == null) {\n noRowCountInServerMode();\n }\n }\n }, [props.rowCount, props.paginationMode]);\n React.useEffect(() => {\n apiRef.current.setState(state => {\n const rowCount = props.rowCount !== undefined ? props.rowCount : visibleTopLevelRowCount;\n const pageCount = getPageCount(rowCount, state.pagination.pageSize);\n const page = props.page == null ? state.pagination.page : props.page;\n return _extends({}, state, {\n pagination: applyValidPage(_extends({}, state.pagination, {\n page,\n rowCount,\n pageCount\n }))\n });\n });\n apiRef.current.forceUpdate();\n }, [visibleTopLevelRowCount, props.rowCount, props.page, props.paginationMode, apiRef]);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport { useGridPageSize, defaultPageSize } from './useGridPageSize';\nimport { useGridPage, getPageCount } from './useGridPage';\nexport const paginationStateInitializer = (state, props) => {\n var _props$initialState, _props$initialState$p, _ref, _props$page, _props$initialState2, _props$initialState2$, _props$rowCount, _props$rowCount2;\n\n let pageSize;\n\n if (props.pageSize != null) {\n pageSize = props.pageSize;\n } else if (((_props$initialState = props.initialState) == null ? void 0 : (_props$initialState$p = _props$initialState.pagination) == null ? void 0 : _props$initialState$p.pageSize) != null) {\n pageSize = props.initialState.pagination.pageSize;\n } else {\n pageSize = defaultPageSize(props.autoPageSize);\n }\n\n return _extends({}, state, {\n pagination: {\n pageSize,\n page: (_ref = (_props$page = props.page) != null ? _props$page : (_props$initialState2 = props.initialState) == null ? void 0 : (_props$initialState2$ = _props$initialState2.pagination) == null ? void 0 : _props$initialState2$.page) != null ? _ref : 0,\n pageCount: getPageCount((_props$rowCount = props.rowCount) != null ? _props$rowCount : 0, pageSize),\n rowCount: (_props$rowCount2 = props.rowCount) != null ? _props$rowCount2 : 0\n }\n });\n};\n/**\n * @requires useGridFilter (state)\n * @requires useGridDimensions (event) - can be after\n */\n\nexport const useGridPagination = (apiRef, props) => {\n useGridPageSize(apiRef, props);\n useGridPage(apiRef, props);\n};","export const gridPreferencePanelStateSelector = state => state.preferencePanel;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { useGridLogger } from '../../utils/useGridLogger';\nimport { useGridRegisterPipeProcessor } from '../../core/pipeProcessing';\nimport { gridPreferencePanelStateSelector } from './gridPreferencePanelSelector';\nexport const preferencePanelStateInitializer = (state, props) => {\n var _props$initialState$p, _props$initialState;\n\n return _extends({}, state, {\n preferencePanel: (_props$initialState$p = (_props$initialState = props.initialState) == null ? void 0 : _props$initialState.preferencePanel) != null ? _props$initialState$p : {\n open: false\n }\n });\n};\n/**\n * TODO: Add a single `setPreferencePanel` method to avoid multiple `setState`\n */\n\nexport const useGridPreferencesPanel = apiRef => {\n const logger = useGridLogger(apiRef, 'useGridPreferencesPanel');\n const hideTimeout = React.useRef();\n const immediateTimeout = React.useRef();\n /**\n * API METHODS\n */\n\n const hidePreferences = React.useCallback(() => {\n logger.debug('Hiding Preferences Panel');\n const preferencePanelState = gridPreferencePanelStateSelector(apiRef.current.state);\n\n if (preferencePanelState.openedPanelValue) {\n apiRef.current.publishEvent('preferencePanelClose', {\n openedPanelValue: preferencePanelState.openedPanelValue\n });\n }\n\n apiRef.current.setState(state => _extends({}, state, {\n preferencePanel: {\n open: false\n }\n }));\n apiRef.current.forceUpdate();\n }, [apiRef, logger]); // This is to prevent the preferences from closing when you open a select box or another panel,\n // The issue is in MUI core V4 => Fixed in V5\n\n const doNotHidePanel = React.useCallback(() => {\n immediateTimeout.current = setTimeout(() => clearTimeout(hideTimeout.current), 0);\n }, []); // This is a hack for the issue with Core V4, by delaying hiding the panel on the clickAwayListener,\n // we can cancel the action if the trigger element still need the panel...\n\n const hidePreferencesDelayed = React.useCallback(() => {\n hideTimeout.current = setTimeout(hidePreferences, 100);\n }, [hidePreferences]);\n const showPreferences = React.useCallback(newValue => {\n logger.debug('Opening Preferences Panel');\n doNotHidePanel();\n apiRef.current.setState(state => _extends({}, state, {\n preferencePanel: _extends({}, state.preferencePanel, {\n open: true,\n openedPanelValue: newValue\n })\n }));\n apiRef.current.publishEvent('preferencePanelOpen', {\n openedPanelValue: newValue\n });\n apiRef.current.forceUpdate();\n }, [logger, doNotHidePanel, apiRef]);\n useGridApiMethod(apiRef, {\n showPreferences,\n hidePreferences: hidePreferencesDelayed\n }, 'ColumnMenuApi');\n /**\n * PRE-PROCESSING\n */\n\n const stateExportPreProcessing = React.useCallback(prevState => {\n const preferencePanelToExport = gridPreferencePanelStateSelector(apiRef.current.state);\n\n if (!preferencePanelToExport.open && !preferencePanelToExport.openedPanelValue) {\n return prevState;\n }\n\n return _extends({}, prevState, {\n preferencePanel: preferencePanelToExport\n });\n }, [apiRef]);\n const stateRestorePreProcessing = React.useCallback((params, context) => {\n const preferencePanel = context.stateToRestore.preferencePanel;\n\n if (preferencePanel != null) {\n apiRef.current.setState(state => _extends({}, state, {\n preferencePanel\n }));\n }\n\n return params;\n }, [apiRef]);\n useGridRegisterPipeProcessor(apiRef, 'exportState', stateExportPreProcessing);\n useGridRegisterPipeProcessor(apiRef, 'restoreState', stateRestorePreProcessing);\n /**\n * EFFECTS\n */\n\n React.useEffect(() => {\n return () => {\n clearTimeout(hideTimeout.current);\n clearTimeout(immediateTimeout.current);\n };\n }, []);\n};","// TODO v6: rename to gridEditingStateSelector\nexport const gridEditRowsStateSelector = state => state.editRows;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useEventCallback } from '@mui/material/utils';\nimport { useGridApiOptionHandler, useGridApiEventHandler } from '../../utils/useGridApiEventHandler';\nimport { GridCellModes, GridEditModes } from '../../../models/gridEditRowModel';\nimport { isKeyboardEvent, isPrintableKey, isCellEnterEditModeKeys, isCellExitEditModeKeys, isCellEditCommitKeys, isDeleteKeys } from '../../../utils/keyboardUtils';\nimport { useGridLogger } from '../../utils/useGridLogger';\nimport { gridFocusCellSelector } from '../focus/gridFocusStateSelector';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { gridEditRowsStateSelector } from './gridEditRowsSelector';\n\nfunction isPromise(promise) {\n return typeof promise.then === 'function';\n}\n\nexport const useCellEditing = (apiRef, props) => {\n var _props$experimentalFe2;\n\n const logger = useGridLogger(apiRef, 'useGridEditRows');\n\n const buildCallback = callback => (...args) => {\n if (props.editMode === GridEditModes.Cell) {\n callback(...args);\n }\n };\n\n const setCellMode = React.useCallback((id, field, mode) => {\n if (apiRef.current.getCellMode(id, field) === mode) {\n return;\n }\n\n logger.debug(`Switching cell id: ${id} field: ${field} to mode: ${mode}`);\n apiRef.current.setState(state => {\n const newEditRowsState = _extends({}, state.editRows);\n\n newEditRowsState[id] = _extends({}, newEditRowsState[id]);\n\n if (mode === GridCellModes.Edit) {\n newEditRowsState[id][field] = {\n value: apiRef.current.getCellValue(id, field)\n };\n } else {\n delete newEditRowsState[id][field];\n\n if (!Object.keys(newEditRowsState[id]).length) {\n delete newEditRowsState[id];\n }\n }\n\n return _extends({}, state, {\n editRows: newEditRowsState\n });\n });\n apiRef.current.forceUpdate();\n apiRef.current.publishEvent('cellModeChange', apiRef.current.getCellParams(id, field));\n }, [apiRef, logger]);\n const getCellMode = React.useCallback((id, field) => {\n const editRowsState = gridEditRowsStateSelector(apiRef.current.state);\n const isEditing = editRowsState[id] && editRowsState[id][field];\n return isEditing ? GridCellModes.Edit : GridCellModes.View;\n }, [apiRef]); // TODO v6: it should always return a promise\n\n const commitCellChange = React.useCallback((params, event = {}) => {\n var _props$experimentalFe;\n\n const {\n id,\n field\n } = params;\n apiRef.current.unstable_runPendingEditCellValueMutation(id, field);\n const model = apiRef.current.getEditRowsModel();\n\n if (!model[id] || !model[id][field]) {\n throw new Error(`MUI: Cell at id: ${id} and field: ${field} is not in edit mode.`);\n }\n\n const editCellProps = model[id][field];\n const column = apiRef.current.getColumn(field);\n const row = apiRef.current.getRow(id);\n\n if ((_props$experimentalFe = props.experimentalFeatures) != null && _props$experimentalFe.preventCommitWhileValidating) {\n const cellProps = model[id][field];\n\n if (cellProps.isValidating || cellProps.error) {\n return false;\n }\n }\n\n const commitParams = _extends({}, params, {\n value: editCellProps.value\n });\n\n let hasError = !!editCellProps.error;\n\n if (!hasError && typeof column.preProcessEditCellProps === 'function') {\n const result = column.preProcessEditCellProps({\n id,\n row,\n props: editCellProps\n });\n\n if (isPromise(result)) {\n return result.then(newEditCellProps => {\n apiRef.current.unstable_setEditCellProps({\n id,\n field,\n props: newEditCellProps\n });\n\n if (newEditCellProps.error) {\n return false;\n }\n\n apiRef.current.publishEvent('cellEditCommit', commitParams, event);\n return true;\n });\n }\n\n apiRef.current.unstable_setEditCellProps({\n id,\n field,\n props: result\n });\n hasError = !!result.error;\n }\n\n if (!hasError) {\n apiRef.current.publishEvent('cellEditCommit', commitParams, event);\n return true;\n }\n\n return false;\n }, [apiRef, (_props$experimentalFe2 = props.experimentalFeatures) == null ? void 0 : _props$experimentalFe2.preventCommitWhileValidating]);\n const setCellEditingEditCellValue = React.useCallback(params => {\n const column = apiRef.current.getColumn(params.field);\n const row = apiRef.current.getRow(params.id);\n return new Promise(resolve => {\n let newEditCellProps = {\n value: params.value\n };\n const model = apiRef.current.getEditRowsModel();\n const editCellProps = model[params.id][params.field];\n\n if (typeof column.preProcessEditCellProps !== 'function') {\n apiRef.current.unstable_setEditCellProps(_extends({}, params, {\n props: newEditCellProps\n }));\n resolve(true);\n return;\n } // setEditCellProps runs the value parser and returns the updated props\n\n\n newEditCellProps = apiRef.current.unstable_setEditCellProps(_extends({}, params, {\n props: _extends({}, editCellProps, {\n isValidating: true\n })\n }));\n Promise.resolve(column.preProcessEditCellProps({\n id: params.id,\n row,\n props: _extends({}, newEditCellProps, {\n value: apiRef.current.unstable_parseValue(params.id, params.field, params.value)\n })\n })).then(newEditCellPropsProcessed => {\n apiRef.current.unstable_setEditCellProps(_extends({}, params, {\n props: _extends({}, newEditCellPropsProcessed, {\n isValidating: false\n })\n }));\n resolve(!newEditCellPropsProcessed.error);\n });\n });\n }, [apiRef]);\n const cellEditingApi = {\n setCellMode,\n getCellMode,\n commitCellChange,\n unstable_setCellEditingEditCellValue: setCellEditingEditCellValue\n };\n useGridApiMethod(apiRef, cellEditingApi, 'EditRowApi');\n const handleCellKeyDown = React.useCallback(async (params, event) => {\n const {\n id,\n field,\n cellMode,\n isEditable\n } = params;\n\n if (!isEditable) {\n return;\n }\n\n const isEditMode = cellMode === GridCellModes.Edit;\n const isModifierKeyPressed = event.ctrlKey || event.metaKey || event.altKey;\n\n if (!isEditMode && isCellEnterEditModeKeys(event.key) && !isModifierKeyPressed && !(event.key === ' ' && event.shiftKey)) {\n apiRef.current.publishEvent('cellEditStart', params, event);\n }\n\n if (!isEditMode && isDeleteKeys(event.key)) {\n apiRef.current.setEditCellValue({\n id,\n field,\n value: ''\n });\n apiRef.current.commitCellChange({\n id,\n field\n }, event);\n apiRef.current.publishEvent('cellEditStop', params, event);\n }\n\n if (isEditMode && isCellEditCommitKeys(event.key)) {\n const commitParams = {\n id,\n field\n };\n const isValid = await apiRef.current.commitCellChange(commitParams, event);\n\n if (!isValid) {\n return;\n }\n }\n\n if (isEditMode && isCellExitEditModeKeys(event.key)) {\n apiRef.current.publishEvent('cellEditStop', params, event);\n }\n }, [apiRef]);\n const handleCellDoubleClick = React.useCallback((params, event) => {\n if (!params.isEditable) {\n return;\n }\n\n apiRef.current.publishEvent('cellEditStart', params, event);\n }, [apiRef]);\n\n const commitPropsAndExit = async (params, event) => {\n if (params.cellMode === GridCellModes.View) {\n return;\n }\n\n await apiRef.current.commitCellChange(params, event);\n apiRef.current.publishEvent('cellEditStop', params, event);\n };\n\n const handleCellFocusOut = useEventCallback((params, event) => {\n commitPropsAndExit(params, event);\n });\n const handleColumnHeaderDragStart = useEventCallback(() => {\n const cell = gridFocusCellSelector(apiRef);\n\n if (!cell) {\n return;\n }\n\n const params = apiRef.current.getCellParams(cell.id, cell.field);\n commitPropsAndExit(params, {});\n });\n const handleCellEditStart = React.useCallback((params, event) => {\n if (!params.isEditable) {\n return;\n }\n\n apiRef.current.setCellMode(params.id, params.field, GridCellModes.Edit);\n\n if (isKeyboardEvent(event) && isPrintableKey(event.key)) {\n apiRef.current.unstable_setEditCellProps({\n id: params.id,\n field: params.field,\n props: {\n value: ''\n }\n });\n }\n }, [apiRef]);\n const handleCellEditStop = React.useCallback((params, event) => {\n apiRef.current.setCellMode(params.id, params.field, GridCellModes.View);\n\n if (!isKeyboardEvent(event)) {\n return;\n }\n\n if (isCellEditCommitKeys(event.key)) {\n apiRef.current.publishEvent('cellNavigationKeyDown', params, event);\n return;\n }\n\n if (event.key === 'Escape' || isDeleteKeys(event.key)) {\n apiRef.current.setCellFocus(params.id, params.field);\n }\n }, [apiRef]);\n const handleCellEditCommit = React.useCallback(params => {\n const {\n id,\n field\n } = params;\n const model = apiRef.current.getEditRowsModel();\n const {\n value\n } = model[id][field];\n logger.debug(`Setting cell id: ${id} field: ${field} to value: ${value == null ? void 0 : value.toString()}`);\n const row = apiRef.current.getRow(id);\n\n if (row) {\n const column = apiRef.current.getColumn(params.field);\n\n let rowUpdate = _extends({}, row, {\n [field]: value\n });\n\n if (column.valueSetter) {\n rowUpdate = column.valueSetter({\n row,\n value\n });\n }\n\n apiRef.current.updateRows([rowUpdate]);\n }\n }, [apiRef, logger]);\n const handleEditCellPropsChange = React.useCallback(params => {\n const row = apiRef.current.getRow(params.id);\n const column = apiRef.current.getColumn(params.field);\n const editCellProps = column.preProcessEditCellProps ? column.preProcessEditCellProps({\n id: params.id,\n row,\n props: params.props\n }) : params.props;\n\n if (isPromise(editCellProps)) {\n editCellProps.then(newEditCellProps => {\n apiRef.current.unstable_setEditCellProps(_extends({}, params, {\n props: newEditCellProps\n }));\n });\n } else {\n apiRef.current.unstable_setEditCellProps(_extends({}, params, {\n props: editCellProps\n }));\n }\n }, [apiRef]);\n useGridApiEventHandler(apiRef, 'cellKeyDown', buildCallback(handleCellKeyDown));\n useGridApiEventHandler(apiRef, 'cellDoubleClick', buildCallback(handleCellDoubleClick));\n useGridApiEventHandler(apiRef, 'cellFocusOut', buildCallback(handleCellFocusOut));\n useGridApiEventHandler(apiRef, 'columnHeaderDragStart', buildCallback(handleColumnHeaderDragStart));\n useGridApiEventHandler(apiRef, 'cellEditStart', buildCallback(handleCellEditStart));\n useGridApiEventHandler(apiRef, 'cellEditStop', buildCallback(handleCellEditStop));\n useGridApiEventHandler(apiRef, 'cellEditCommit', buildCallback(handleCellEditCommit));\n useGridApiEventHandler(apiRef, 'editCellPropsChange', buildCallback(handleEditCellPropsChange));\n useGridApiOptionHandler(apiRef, 'cellEditCommit', props.onCellEditCommit);\n useGridApiOptionHandler(apiRef, 'cellEditStart', props.onCellEditStart);\n useGridApiOptionHandler(apiRef, 'cellEditStop', props.onCellEditStop);\n};","// TODO v6 - remove\n\n/**\n * Params passed to `apiRef.current.setEditCellValue`.\n */\n// TODO v6 - remove\n// TODO v6 - remove\nvar GridCellEditStartReasons;\n/**\n * Params passed to the `cellEditStart` event.\n */\n\n(function (GridCellEditStartReasons) {\n GridCellEditStartReasons[\"enterKeyDown\"] = \"enterKeyDown\";\n GridCellEditStartReasons[\"cellDoubleClick\"] = \"cellDoubleClick\";\n GridCellEditStartReasons[\"printableKeyDown\"] = \"printableKeyDown\";\n GridCellEditStartReasons[\"deleteKeyDown\"] = \"deleteKeyDown\";\n})(GridCellEditStartReasons || (GridCellEditStartReasons = {}));\n\nvar GridCellEditStopReasons;\n/**\n * Params passed to the `cellEditStop event.\n */\n\n(function (GridCellEditStopReasons) {\n GridCellEditStopReasons[\"cellFocusOut\"] = \"cellFocusOut\";\n GridCellEditStopReasons[\"escapeKeyDown\"] = \"escapeKeyDown\";\n GridCellEditStopReasons[\"enterKeyDown\"] = \"enterKeyDown\";\n GridCellEditStopReasons[\"tabKeyDown\"] = \"tabKeyDown\";\n GridCellEditStopReasons[\"shiftTabKeyDown\"] = \"shiftTabKeyDown\";\n})(GridCellEditStopReasons || (GridCellEditStopReasons = {}));\n\n// https://github.com/mui/mui-x/pull/3738#discussion_r798504277\nexport { GridCellEditStartReasons, GridCellEditStopReasons };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { GridCellModes } from '../../../models/gridEditRowModel';\nimport { useGridApiEventHandler, useGridApiOptionHandler } from '../../utils/useGridApiEventHandler';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { useGridLogger } from '../../utils/useGridLogger';\nimport { gridEditRowsStateSelector } from './gridEditRowsSelector';\nimport { useCellEditing } from './useGridCellEditing.old';\nimport { useGridRowEditing } from './useGridRowEditing.old';\nexport const editingStateInitializer = state => _extends({}, state, {\n editRows: {}\n});\n/**\n * @requires useGridFocus - can be after, async only\n * @requires useGridParamsApi (method)\n * @requires useGridColumns (state)\n */\n\nexport function useGridEditing(apiRef, props) {\n var _props$experimentalFe2;\n\n const logger = useGridLogger(apiRef, 'useGridEditRows');\n useCellEditing(apiRef, props);\n useGridRowEditing(apiRef, props);\n const debounceMap = React.useRef({});\n apiRef.current.unstable_registerControlState({\n stateId: 'editRows',\n propModel: props.editRowsModel,\n propOnChange: props.onEditRowsModelChange,\n stateSelector: gridEditRowsStateSelector,\n changeEvent: 'editRowsModelChange'\n });\n const isCellEditable = React.useCallback(params => !params.rowNode.isAutoGenerated && !!params.colDef.editable && !!params.colDef.renderEditCell && (!props.isCellEditable || props.isCellEditable(params)), // eslint-disable-next-line react-hooks/exhaustive-deps\n [props.isCellEditable]);\n\n const maybeDebounce = (id, field, debounceMs, callback) => {\n if (!debounceMs) {\n callback();\n return;\n }\n\n if (!debounceMap.current[id]) {\n debounceMap.current[id] = {};\n }\n\n if (debounceMap.current[id][field]) {\n const [timeout] = debounceMap.current[id][field];\n clearTimeout(timeout);\n }\n\n const callbackToRunImmediately = () => {\n callback();\n const [timeout] = debounceMap.current[id][field];\n clearTimeout(timeout);\n delete debounceMap.current[id][field];\n };\n\n const timeout = setTimeout(() => {\n callback();\n delete debounceMap.current[id][field];\n }, debounceMs);\n debounceMap.current[id][field] = [timeout, callbackToRunImmediately];\n };\n\n const runPendingEditCellValueMutation = React.useCallback((id, field) => {\n if (!debounceMap.current[id]) {\n return;\n }\n\n if (!field) {\n Object.keys(debounceMap.current[id]).forEach(debouncedField => {\n const [, callback] = debounceMap.current[id][debouncedField];\n callback();\n });\n } else if (debounceMap.current[id][field]) {\n const [, callback] = debounceMap.current[id][field];\n callback();\n }\n }, []);\n const setEditCellValue = React.useCallback((params, event = {}) => {\n maybeDebounce(params.id, params.field, params.debounceMs, () => {\n var _props$experimentalFe;\n\n if ((_props$experimentalFe = props.experimentalFeatures) != null && _props$experimentalFe.preventCommitWhileValidating) {\n if (props.editMode === 'row') {\n return apiRef.current.unstable_setRowEditingEditCellValue(params);\n }\n\n return apiRef.current.unstable_setCellEditingEditCellValue(params);\n }\n\n const newParams = {\n id: params.id,\n field: params.field,\n props: {\n value: params.value\n }\n };\n return apiRef.current.publishEvent('editCellPropsChange', newParams, event);\n });\n }, [apiRef, props.editMode, (_props$experimentalFe2 = props.experimentalFeatures) == null ? void 0 : _props$experimentalFe2.preventCommitWhileValidating]);\n const parseValue = React.useCallback((id, field, value) => {\n const column = apiRef.current.getColumn(field);\n return column.valueParser ? column.valueParser(value, apiRef.current.getCellParams(id, field)) : value;\n }, [apiRef]);\n const setEditCellProps = React.useCallback(params => {\n const {\n id,\n field,\n props: editProps\n } = params;\n logger.debug(`Setting cell props on id: ${id} field: ${field}`);\n apiRef.current.setState(state => {\n const editRowsModel = _extends({}, state.editRows);\n\n editRowsModel[id] = _extends({}, state.editRows[id]);\n editRowsModel[id][field] = _extends({}, editProps, {\n value: parseValue(id, field, editProps.value)\n });\n return _extends({}, state, {\n editRows: editRowsModel\n });\n });\n apiRef.current.forceUpdate();\n const editRowsState = gridEditRowsStateSelector(apiRef.current.state);\n return editRowsState[id][field];\n }, [apiRef, logger, parseValue]);\n const setEditRowsModel = React.useCallback(model => {\n const currentModel = gridEditRowsStateSelector(apiRef.current.state);\n\n if (currentModel !== model) {\n logger.debug(`Setting editRows model`);\n apiRef.current.setState(state => _extends({}, state, {\n editRows: model\n }));\n apiRef.current.forceUpdate();\n }\n }, [apiRef, logger]);\n const getEditRowsModel = React.useCallback(() => gridEditRowsStateSelector(apiRef.current.state), [apiRef]);\n const preventTextSelection = React.useCallback((params, event) => {\n const isMoreThanOneClick = event.detail > 1;\n\n if (params.isEditable && params.cellMode === GridCellModes.View && isMoreThanOneClick) {\n // If we click more than one time, then we prevent the default behavior of selecting the text cell.\n event.preventDefault();\n }\n }, []);\n useGridApiEventHandler(apiRef, 'cellMouseDown', preventTextSelection);\n useGridApiOptionHandler(apiRef, 'editCellPropsChange', props.onEditCellPropsChange); // TODO v6: remove, use `preProcessEditCellProps` instead\n\n const editingSharedApi = {\n isCellEditable,\n setEditRowsModel,\n getEditRowsModel,\n setEditCellValue,\n unstable_setEditCellProps: setEditCellProps,\n unstable_parseValue: parseValue,\n unstable_runPendingEditCellValueMutation: runPendingEditCellValueMutation\n };\n useGridApiMethod(apiRef, editingSharedApi, 'EditRowApi');\n React.useEffect(() => {\n if (props.editRowsModel !== undefined) {\n apiRef.current.setEditRowsModel(props.editRowsModel);\n }\n }, [apiRef, props.editRowsModel]);\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useEventCallback } from '@mui/material/utils';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { GridRowModes, GridEditModes, GridCellModes } from '../../../models/gridEditRowModel';\nimport { useGridSelector } from '../../utils/useGridSelector';\nimport { gridColumnDefinitionsSelector } from '../columns/gridColumnsSelector';\nimport { gridEditRowsStateSelector } from './gridEditRowsSelector';\nimport { gridFocusCellSelector } from '../focus/gridFocusStateSelector';\nimport { useGridApiOptionHandler, useGridApiEventHandler } from '../../utils/useGridApiEventHandler';\nexport const useGridRowEditing = (apiRef, props) => {\n var _props$experimentalFe2, _props$experimentalFe4;\n\n const focusTimeout = React.useRef(null);\n const nextFocusedCell = React.useRef(null);\n const columns = useGridSelector(apiRef, gridColumnDefinitionsSelector);\n\n const buildCallback = callback => (...args) => {\n if (props.editMode === GridEditModes.Row) {\n callback(...args);\n }\n };\n\n const setRowMode = React.useCallback((id, mode) => {\n if (mode === apiRef.current.getRowMode(id)) {\n return;\n }\n\n apiRef.current.setState(state => {\n const newEditRowsState = _extends({}, state.editRows);\n\n if (mode === GridRowModes.Edit) {\n newEditRowsState[id] = {};\n columns.forEach(column => {\n const cellParams = apiRef.current.getCellParams(id, column.field);\n\n if (cellParams.isEditable) {\n newEditRowsState[id][column.field] = {\n value: cellParams.value\n };\n }\n });\n } else {\n delete newEditRowsState[id];\n }\n\n return _extends({}, state, {\n editRows: newEditRowsState\n });\n });\n apiRef.current.forceUpdate();\n }, [apiRef, columns]);\n const getRowMode = React.useCallback(id => {\n if (props.editMode === GridEditModes.Cell) {\n return GridRowModes.View;\n }\n\n const editRowsState = gridEditRowsStateSelector(apiRef.current.state);\n return editRowsState[id] ? GridRowModes.Edit : GridRowModes.View;\n }, [apiRef, props.editMode]);\n const commitRowChange = React.useCallback((id, event = {}) => {\n var _props$experimentalFe;\n\n if (props.editMode === GridEditModes.Cell) {\n throw new Error(`MUI: You can't commit changes when the edit mode is 'cell'.`);\n }\n\n apiRef.current.unstable_runPendingEditCellValueMutation(id);\n const model = apiRef.current.getEditRowsModel();\n const editRowProps = model[id];\n\n if (!editRowProps) {\n throw new Error(`MUI: Row at id: ${id} is not being edited.`);\n }\n\n if ((_props$experimentalFe = props.experimentalFeatures) != null && _props$experimentalFe.preventCommitWhileValidating) {\n const isValid = Object.keys(editRowProps).reduce((acc, field) => {\n return acc && !editRowProps[field].isValidating && !editRowProps[field].error;\n }, true);\n\n if (!isValid) {\n return false;\n }\n }\n\n const hasFieldWithError = Object.values(editRowProps).some(value => !!value.error);\n\n if (hasFieldWithError) {\n return false;\n }\n\n const fieldsWithValidator = Object.keys(editRowProps).filter(field => {\n const column = apiRef.current.getColumn(field);\n return typeof column.preProcessEditCellProps === 'function';\n });\n\n if (fieldsWithValidator.length > 0) {\n const row = apiRef.current.getRow(id);\n const validatorErrors = fieldsWithValidator.map(async field => {\n const column = apiRef.current.getColumn(field);\n const newEditCellProps = await Promise.resolve(column.preProcessEditCellProps({\n id,\n row,\n props: editRowProps[field]\n }));\n apiRef.current.unstable_setEditCellProps({\n id,\n field,\n props: newEditCellProps\n });\n return newEditCellProps.error;\n });\n return Promise.all(validatorErrors).then(errors => {\n if (errors.some(error => !!error)) {\n return false;\n }\n\n apiRef.current.publishEvent('rowEditCommit', id, event);\n return true;\n });\n }\n\n apiRef.current.publishEvent('rowEditCommit', id, event);\n return true;\n }, [apiRef, props.editMode, (_props$experimentalFe2 = props.experimentalFeatures) == null ? void 0 : _props$experimentalFe2.preventCommitWhileValidating]);\n const setRowEditingEditCellValue = React.useCallback(params => {\n const model = apiRef.current.getEditRowsModel();\n const editRow = model[params.id];\n const row = apiRef.current.getRow(params.id);\n let isValid = true;\n return new Promise(resolve => {\n Object.keys(editRow).forEach(async field => {\n const column = apiRef.current.getColumn(field);\n let editCellProps = field === params.field ? {\n value: params.value\n } : editRow[field]; // setEditCellProps runs the value parser and returns the updated props\n\n editCellProps = apiRef.current.unstable_setEditCellProps({\n id: params.id,\n field,\n props: _extends({}, editCellProps, {\n isValidating: true\n })\n });\n\n if (column.preProcessEditCellProps) {\n editCellProps = await Promise.resolve(column.preProcessEditCellProps({\n id: params.id,\n row,\n props: _extends({}, editCellProps, {\n value: field === params.field ? apiRef.current.unstable_parseValue(params.id, field, params.value) : editCellProps.value\n })\n }));\n }\n\n if (editCellProps.error) {\n isValid = false;\n }\n\n apiRef.current.unstable_setEditCellProps({\n id: params.id,\n field,\n props: _extends({}, editCellProps, {\n isValidating: false\n })\n });\n });\n resolve(isValid);\n });\n }, [apiRef]);\n const rowEditingApi = {\n setRowMode,\n getRowMode,\n commitRowChange,\n unstable_setRowEditingEditCellValue: setRowEditingEditCellValue\n };\n useGridApiMethod(apiRef, rowEditingApi, 'EditRowApi');\n const handleCellKeyDown = React.useCallback(async (params, event) => {\n const {\n cellMode,\n isEditable\n } = params;\n\n if (!isEditable) {\n return;\n }\n\n const isEditMode = cellMode === GridCellModes.Edit;\n const rowParams = apiRef.current.getRowParams(params.id);\n\n if (isEditMode) {\n if (event.key === 'Enter') {\n var _props$experimentalFe3;\n\n // TODO: check the return before firing 'rowEditStop'\n // On cell editing, it won't exits the edit mode with error\n const isValid = await apiRef.current.commitRowChange(params.id);\n\n if (!isValid && (_props$experimentalFe3 = props.experimentalFeatures) != null && _props$experimentalFe3.preventCommitWhileValidating) {\n return;\n }\n\n apiRef.current.publishEvent('rowEditStop', rowParams, event);\n } else if (event.key === 'Escape') {\n apiRef.current.publishEvent('rowEditStop', rowParams, event);\n }\n } else if (event.key === 'Enter') {\n apiRef.current.publishEvent('rowEditStart', rowParams, event);\n }\n }, [apiRef, (_props$experimentalFe4 = props.experimentalFeatures) == null ? void 0 : _props$experimentalFe4.preventCommitWhileValidating]);\n const handleCellDoubleClick = React.useCallback((params, event) => {\n if (!params.isEditable) {\n return;\n }\n\n const rowParams = apiRef.current.getRowParams(params.id);\n apiRef.current.publishEvent('rowEditStart', rowParams, event);\n }, [apiRef]);\n const handleEditCellPropsChange = React.useCallback(params => {\n const row = apiRef.current.getRow(params.id);\n const model = apiRef.current.getEditRowsModel();\n const editRow = model[params.id];\n Object.keys(editRow).forEach(async field => {\n const column = apiRef.current.getColumn(field);\n\n if (column.preProcessEditCellProps) {\n const editCellProps = field === params.field ? params.props : editRow[field];\n const newEditCellProps = await Promise.resolve(column.preProcessEditCellProps({\n id: params.id,\n row,\n props: editCellProps\n }));\n apiRef.current.unstable_setEditCellProps({\n id: params.id,\n field,\n props: newEditCellProps\n });\n } else if (field === params.field) {\n apiRef.current.unstable_setEditCellProps(params);\n }\n });\n }, [apiRef]);\n const handleRowEditStart = React.useCallback(params => {\n apiRef.current.setRowMode(params.id, GridRowModes.Edit);\n }, [apiRef]);\n const handleRowEditStop = React.useCallback((params, event) => {\n apiRef.current.setRowMode(params.id, GridRowModes.View);\n\n if (event.key === 'Enter') {\n apiRef.current.publishEvent('cellNavigationKeyDown', params, event);\n }\n }, [apiRef]);\n const handleRowEditCommit = React.useCallback(id => {\n const model = apiRef.current.getEditRowsModel();\n const editRow = model[id];\n\n if (!editRow) {\n throw new Error(`MUI: Row at id: ${id} is not being edited.`);\n }\n\n const row = apiRef.current.getRow(id);\n\n if (row) {\n let rowUpdate = _extends({}, row);\n\n Object.keys(editRow).forEach(field => {\n const column = apiRef.current.getColumn(field);\n const value = editRow[field].value;\n\n if (column.valueSetter) {\n rowUpdate = column.valueSetter({\n row: rowUpdate,\n value\n });\n } else {\n rowUpdate[field] = value;\n }\n });\n apiRef.current.updateRows([rowUpdate]);\n }\n }, [apiRef]);\n const handleCellFocusIn = React.useCallback(params => {\n nextFocusedCell.current = params;\n }, []);\n\n const commitPropsAndExit = async (params, event) => {\n if (params.cellMode === GridCellModes.View) {\n return;\n }\n\n nextFocusedCell.current = null;\n focusTimeout.current = setTimeout(async () => {\n var _nextFocusedCell$curr;\n\n if (((_nextFocusedCell$curr = nextFocusedCell.current) == null ? void 0 : _nextFocusedCell$curr.id) !== params.id) {\n await apiRef.current.commitRowChange(params.id, event);\n const rowParams = apiRef.current.getRowParams(params.id);\n apiRef.current.publishEvent('rowEditStop', rowParams, event);\n }\n });\n };\n\n const handleCellFocusOut = useEventCallback((params, event) => {\n commitPropsAndExit(params, event);\n });\n const handleColumnHeaderDragStart = useEventCallback(() => {\n const cell = gridFocusCellSelector(apiRef);\n\n if (!cell) {\n return;\n }\n\n const params = apiRef.current.getCellParams(cell.id, cell.field);\n commitPropsAndExit(params, {});\n });\n useGridApiEventHandler(apiRef, 'cellKeyDown', buildCallback(handleCellKeyDown));\n useGridApiEventHandler(apiRef, 'cellDoubleClick', buildCallback(handleCellDoubleClick));\n useGridApiEventHandler(apiRef, 'editCellPropsChange', buildCallback(handleEditCellPropsChange));\n useGridApiEventHandler(apiRef, 'rowEditStart', buildCallback(handleRowEditStart));\n useGridApiEventHandler(apiRef, 'rowEditStop', buildCallback(handleRowEditStop));\n useGridApiEventHandler(apiRef, 'rowEditCommit', buildCallback(handleRowEditCommit));\n useGridApiEventHandler(apiRef, 'cellFocusIn', buildCallback(handleCellFocusIn));\n useGridApiEventHandler(apiRef, 'cellFocusOut', buildCallback(handleCellFocusOut));\n useGridApiEventHandler(apiRef, 'columnHeaderDragStart', buildCallback(handleColumnHeaderDragStart));\n useGridApiOptionHandler(apiRef, 'rowEditCommit', props.onRowEditCommit);\n useGridApiOptionHandler(apiRef, 'rowEditStart', props.onRowEditStart);\n useGridApiOptionHandler(apiRef, 'rowEditStop', props.onRowEditStop);\n};","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _toPropertyKey from \"@babel/runtime/helpers/esm/toPropertyKey\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"id\", \"field\"],\n _excluded2 = [\"id\", \"field\"];\nimport * as React from 'react';\nimport { useGridApiEventHandler, useGridApiOptionHandler, GridSignature } from '../../utils/useGridApiEventHandler';\nimport { GridEditModes, GridCellModes } from '../../../models/gridEditRowModel';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { gridEditRowsStateSelector } from './gridEditRowsSelector';\nimport { isPrintableKey } from '../../../utils/keyboardUtils';\nimport { buildWarning } from '../../../utils/warning';\nimport { gridRowsIdToIdLookupSelector } from '../rows/gridRowsSelector';\nimport { GridCellEditStartReasons, GridCellEditStopReasons } from '../../../models/params/gridEditCellParams';\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/#persistence.'], 'error');\nexport const useGridCellEditing = (apiRef, props) => {\n const [cellModesModel, setCellModesModel] = React.useState({});\n const prevCellModesModel = React.useRef({});\n const {\n processRowUpdate,\n onProcessRowUpdateError,\n cellModesModel: cellModesModelProp,\n onCellModesModelChange,\n signature\n } = props;\n\n const runIfEditModeIsCell = callback => (...args) => {\n if (props.editMode === GridEditModes.Cell) {\n callback(...args);\n }\n };\n\n const throwIfNotEditable = React.useCallback((id, field) => {\n const params = apiRef.current.getCellParams(id, field);\n\n if (!apiRef.current.isCellEditable(params)) {\n throw new Error(`MUI: The cell with id=${id} and field=${field} is not editable.`);\n }\n }, [apiRef]);\n const throwIfNotInMode = React.useCallback((id, field, mode) => {\n if (apiRef.current.getCellMode(id, field) !== mode) {\n throw new Error(`MUI: The cell with id=${id} and field=${field} is not in ${mode} mode.`);\n }\n }, [apiRef]);\n const handleCellDoubleClick = React.useCallback((params, event) => {\n if (!params.isEditable) {\n return;\n }\n\n if (params.cellMode === GridCellModes.Edit) {\n return;\n }\n\n const newParams = _extends({}, params, {\n reason: GridCellEditStartReasons.cellDoubleClick\n });\n\n apiRef.current.publishEvent('cellEditStart', newParams, event);\n }, [apiRef]);\n const handleCellFocusOut = React.useCallback((params, event) => {\n if (params.cellMode === GridCellModes.View) {\n return;\n }\n\n const newParams = _extends({}, params, {\n reason: GridCellEditStopReasons.cellFocusOut\n });\n\n apiRef.current.publishEvent('cellEditStop', newParams, event);\n }, [apiRef]);\n const handleCellKeyDown = React.useCallback((params, event) => {\n if (params.cellMode === GridCellModes.Edit) {\n let reason;\n\n if (event.key === 'Escape') {\n reason = GridCellEditStopReasons.escapeKeyDown;\n } else if (event.key === 'Enter') {\n reason = GridCellEditStopReasons.enterKeyDown;\n } else if (event.key === 'Tab') {\n reason = event.shiftKey ? GridCellEditStopReasons.shiftTabKeyDown : GridCellEditStopReasons.tabKeyDown;\n event.preventDefault(); // Prevent going to the next element in the tab sequence\n }\n\n if (reason) {\n const newParams = _extends({}, params, {\n reason\n });\n\n apiRef.current.publishEvent('cellEditStop', newParams, event);\n }\n } else if (params.isEditable) {\n let reason;\n\n if (isPrintableKey(event.key)) {\n if (event.shiftKey || event.ctrlKey || event.metaKey || event.altKey) {\n return;\n }\n\n reason = GridCellEditStartReasons.printableKeyDown;\n } else if (event.key === 'Enter') {\n reason = GridCellEditStartReasons.enterKeyDown;\n } else if (event.key === 'Delete') {\n reason = GridCellEditStartReasons.deleteKeyDown;\n }\n\n if (reason) {\n const newParams = _extends({}, params, {\n reason\n });\n\n apiRef.current.publishEvent('cellEditStart', newParams, event);\n }\n }\n }, [apiRef]);\n const handleCellEditStart = React.useCallback(params => {\n const {\n id,\n field,\n reason\n } = params;\n const startCellEditModeParams = {\n id,\n field\n };\n\n if (reason === GridCellEditStartReasons.deleteKeyDown || reason === GridCellEditStartReasons.printableKeyDown) {\n startCellEditModeParams.deleteValue = true;\n }\n\n apiRef.current.startCellEditMode(startCellEditModeParams);\n }, [apiRef]);\n const handleCellEditStop = React.useCallback(params => {\n const {\n id,\n field,\n reason\n } = params;\n let cellToFocusAfter;\n\n if (reason === GridCellEditStopReasons.enterKeyDown) {\n cellToFocusAfter = 'below';\n } else if (reason === GridCellEditStopReasons.tabKeyDown) {\n cellToFocusAfter = 'right';\n } else if (reason === GridCellEditStopReasons.shiftTabKeyDown) {\n cellToFocusAfter = 'left';\n }\n\n let ignoreModifications = reason === 'escapeKeyDown';\n const editingState = gridEditRowsStateSelector(apiRef.current.state);\n\n if (editingState[id][field].isProcessingProps) {\n // The user wants to stop editing the cell but we can't wait for the props to be processed.\n // In this case, discard the modifications.\n ignoreModifications = true;\n }\n\n apiRef.current.stopCellEditMode({\n id,\n field,\n ignoreModifications,\n cellToFocusAfter\n });\n }, [apiRef]);\n useGridApiEventHandler(apiRef, 'cellDoubleClick', runIfEditModeIsCell(handleCellDoubleClick));\n useGridApiEventHandler(apiRef, 'cellFocusOut', runIfEditModeIsCell(handleCellFocusOut));\n useGridApiEventHandler(apiRef, 'cellKeyDown', runIfEditModeIsCell(handleCellKeyDown));\n useGridApiEventHandler(apiRef, 'cellEditStart', runIfEditModeIsCell(handleCellEditStart));\n useGridApiEventHandler(apiRef, 'cellEditStop', runIfEditModeIsCell(handleCellEditStop));\n useGridApiOptionHandler(apiRef, 'cellEditStart', props.onCellEditStart);\n useGridApiOptionHandler(apiRef, 'cellEditStop', props.onCellEditStop);\n const getCellMode = React.useCallback((id, field) => {\n const editingState = gridEditRowsStateSelector(apiRef.current.state);\n const isEditing = editingState[id] && editingState[id][field];\n return isEditing ? GridCellModes.Edit : GridCellModes.View;\n }, [apiRef]);\n const updateCellModesModel = React.useCallback(newModel => {\n const isNewModelDifferentFromProp = newModel !== props.cellModesModel;\n\n if (onCellModesModelChange && isNewModelDifferentFromProp) {\n const details = signature === GridSignature.DataGridPro ? {\n api: apiRef.current\n } : {};\n onCellModesModelChange(newModel, details);\n }\n\n if (props.cellModesModel && isNewModelDifferentFromProp) {\n return; // The prop always win\n }\n\n setCellModesModel(newModel);\n apiRef.current.publishEvent('cellModesModelChange', newModel);\n }, [apiRef, onCellModesModelChange, props.cellModesModel, signature]);\n const updateFieldInCellModesModel = React.useCallback((id, field, newProps) => {\n const newModel = _extends({}, cellModesModel);\n\n if (newProps !== null) {\n newModel[id] = _extends({}, newModel[id], {\n [field]: _extends({}, newProps)\n });\n } else {\n const _cellModesModel$id = cellModesModel[id],\n otherFields = _objectWithoutPropertiesLoose(_cellModesModel$id, [field].map(_toPropertyKey)); // Ensure that we have a new object, not a reference\n\n\n newModel[id] = otherFields;\n\n if (Object.keys(newModel[id]).length === 0) {\n delete newModel[id];\n }\n }\n\n updateCellModesModel(newModel);\n }, [cellModesModel, updateCellModesModel]);\n const updateOrDeleteFieldState = React.useCallback((id, field, newProps) => {\n apiRef.current.setState(state => {\n const newEditingState = _extends({}, state.editRows);\n\n if (newProps !== null) {\n newEditingState[id] = _extends({}, newEditingState[id], {\n [field]: _extends({}, newProps)\n });\n } else {\n delete newEditingState[id][field];\n\n if (Object.keys(newEditingState[id]).length === 0) {\n delete newEditingState[id];\n }\n }\n\n return _extends({}, state, {\n editRows: newEditingState\n });\n });\n apiRef.current.forceUpdate();\n }, [apiRef]);\n const startCellEditMode = React.useCallback(params => {\n const {\n id,\n field\n } = params,\n other = _objectWithoutPropertiesLoose(params, _excluded);\n\n throwIfNotEditable(id, field);\n throwIfNotInMode(id, field, GridCellModes.View);\n updateFieldInCellModesModel(id, field, _extends({\n mode: GridCellModes.Edit\n }, other));\n }, [throwIfNotEditable, throwIfNotInMode, updateFieldInCellModesModel]);\n const updateStateToStartCellEditMode = React.useCallback(params => {\n const {\n id,\n field,\n deleteValue\n } = params;\n const newProps = {\n value: deleteValue ? '' : apiRef.current.getCellValue(id, field),\n error: false,\n isProcessingProps: false\n };\n updateOrDeleteFieldState(id, field, newProps);\n apiRef.current.setCellFocus(id, field);\n }, [apiRef, updateOrDeleteFieldState]);\n const stopCellEditMode = React.useCallback(params => {\n const {\n id,\n field\n } = params,\n other = _objectWithoutPropertiesLoose(params, _excluded2);\n\n throwIfNotInMode(id, field, GridCellModes.Edit);\n updateFieldInCellModesModel(id, field, _extends({\n mode: GridCellModes.View\n }, other));\n }, [throwIfNotInMode, updateFieldInCellModesModel]);\n const updateStateToStopCellEditMode = React.useCallback(async params => {\n const {\n id,\n field,\n ignoreModifications,\n cellToFocusAfter = 'none'\n } = params;\n throwIfNotInMode(id, field, GridCellModes.Edit);\n apiRef.current.unstable_runPendingEditCellValueMutation(id, field);\n\n const finishCellEditMode = () => {\n if (cellToFocusAfter !== 'none') {\n apiRef.current.unstable_moveFocusToRelativeCell(id, field, cellToFocusAfter);\n }\n\n updateOrDeleteFieldState(id, field, null);\n updateFieldInCellModesModel(id, field, null);\n };\n\n if (ignoreModifications) {\n finishCellEditMode();\n return;\n }\n\n const editingState = gridEditRowsStateSelector(apiRef.current.state);\n const {\n error,\n isProcessingProps\n } = editingState[id][field];\n\n if (error || isProcessingProps) {\n // Attempt to change cell mode to \"view\" was not successful\n // Update previous mode to allow another attempt\n prevCellModesModel.current[id][field].mode = GridCellModes.Edit;\n return;\n }\n\n const rowUpdate = apiRef.current.unstable_getRowWithUpdatedValuesFromCellEditing(id, field);\n\n if (processRowUpdate) {\n const handleError = errorThrown => {\n prevCellModesModel.current[id][field].mode = GridCellModes.Edit;\n\n if (onProcessRowUpdateError) {\n onProcessRowUpdateError(errorThrown);\n } else {\n missingOnProcessRowUpdateErrorWarning();\n }\n };\n\n try {\n const row = apiRef.current.getRow(id);\n Promise.resolve(processRowUpdate(rowUpdate, row)).then(finalRowUpdate => {\n apiRef.current.updateRows([finalRowUpdate]);\n finishCellEditMode();\n }).catch(handleError);\n } catch (errorThrown) {\n handleError(errorThrown);\n }\n } else {\n apiRef.current.updateRows([rowUpdate]);\n finishCellEditMode();\n }\n }, [apiRef, onProcessRowUpdateError, processRowUpdate, throwIfNotInMode, updateFieldInCellModesModel, updateOrDeleteFieldState]);\n const setCellEditingEditCellValue = React.useCallback(async params => {\n const {\n id,\n field,\n value\n } = params;\n throwIfNotEditable(id, field);\n throwIfNotInMode(id, field, GridCellModes.Edit);\n const column = apiRef.current.getColumn(field);\n const row = apiRef.current.getRow(id);\n let parsedValue = value;\n\n if (column.valueParser) {\n parsedValue = column.valueParser(value, apiRef.current.getCellParams(id, field));\n }\n\n let editingState = gridEditRowsStateSelector(apiRef.current.state);\n\n let newProps = _extends({}, editingState[id][field], {\n value: parsedValue\n });\n\n if (column.preProcessEditCellProps) {\n const hasChanged = value !== editingState[id][field].value;\n newProps = _extends({}, newProps, {\n isProcessingProps: true\n });\n updateOrDeleteFieldState(id, field, newProps);\n newProps = await Promise.resolve(column.preProcessEditCellProps({\n id,\n row,\n props: newProps,\n hasChanged\n }));\n } // Check again if the cell is in edit mode because the user may have\n // discarded the changes while the props were being processed.\n\n\n if (apiRef.current.getCellMode(id, field) === GridCellModes.View) {\n return false;\n }\n\n editingState = gridEditRowsStateSelector(apiRef.current.state);\n newProps = _extends({}, newProps, {\n isProcessingProps: false\n }); // We don't update the value with the one coming from the props pre-processing\n // because when the promise resolves it may be already outdated. The only\n // exception to this rule is when there's no pre-processing.\n\n newProps.value = column.preProcessEditCellProps ? editingState[id][field].value : parsedValue;\n updateOrDeleteFieldState(id, field, newProps);\n editingState = gridEditRowsStateSelector(apiRef.current.state);\n return !editingState[id][field].error;\n }, [apiRef, throwIfNotEditable, throwIfNotInMode, updateOrDeleteFieldState]);\n const getRowWithUpdatedValuesFromCellEditing = React.useCallback((id, field) => {\n const column = apiRef.current.getColumn(field);\n const editingState = gridEditRowsStateSelector(apiRef.current.state);\n const {\n value\n } = editingState[id][field];\n const row = apiRef.current.getRow(id);\n return column.valueSetter ? column.valueSetter({\n value,\n row\n }) : _extends({}, row, {\n [field]: value\n });\n }, [apiRef]);\n const editingApi = {\n getCellMode,\n startCellEditMode,\n stopCellEditMode,\n unstable_setCellEditingEditCellValue: setCellEditingEditCellValue,\n unstable_getRowWithUpdatedValuesFromCellEditing: getRowWithUpdatedValuesFromCellEditing\n };\n useGridApiMethod(apiRef, editingApi, 'EditingApi');\n React.useEffect(() => {\n if (cellModesModelProp) {\n updateCellModesModel(cellModesModelProp);\n }\n }, [cellModesModelProp, updateCellModesModel]);\n React.useEffect(() => {\n const idToIdLookup = gridRowsIdToIdLookupSelector(apiRef); // Update the ref here because updateStateToStopCellEditMode may change it later\n\n const copyOfPrevCellModes = prevCellModesModel.current;\n prevCellModesModel.current = cellModesModel;\n Object.entries(cellModesModel).forEach(([id, fields]) => {\n Object.entries(fields).forEach(([field, params]) => {\n var _copyOfPrevCellModes$, _copyOfPrevCellModes$2, _idToIdLookup$id;\n\n const prevMode = ((_copyOfPrevCellModes$ = copyOfPrevCellModes[id]) == null ? void 0 : (_copyOfPrevCellModes$2 = _copyOfPrevCellModes$[field]) == null ? void 0 : _copyOfPrevCellModes$2.mode) || GridCellModes.View;\n const originalId = (_idToIdLookup$id = idToIdLookup[id]) != null ? _idToIdLookup$id : id;\n\n if (params.mode === GridCellModes.Edit && prevMode === GridCellModes.View) {\n updateStateToStartCellEditMode(_extends({\n id: originalId,\n field\n }, params));\n } else if (params.mode === GridCellModes.View && prevMode === GridCellModes.Edit) {\n updateStateToStopCellEditMode(_extends({\n id: originalId,\n field\n }, params));\n }\n });\n });\n }, [apiRef, cellModesModel, updateStateToStartCellEditMode, updateStateToStopCellEditMode]);\n};","/**\n * Object passed as parameter in the row callbacks.\n */\n\n/**\n * Object passed as parameter in the row `getRowClassName` callback prop.\n */\n\n/**\n * Object passed as parameter in the row `getRowHeight` callback prop.\n */\n\n/**\n * The getRowHeight return value.\n */\nvar GridRowEditStartReasons;\n/**\n * Params passed to the `rowEditStart` event.\n */\n\n(function (GridRowEditStartReasons) {\n GridRowEditStartReasons[\"enterKeyDown\"] = \"enterKeyDown\";\n GridRowEditStartReasons[\"cellDoubleClick\"] = \"cellDoubleClick\";\n GridRowEditStartReasons[\"printableKeyDown\"] = \"printableKeyDown\";\n GridRowEditStartReasons[\"deleteKeyDown\"] = \"deleteKeyDown\";\n})(GridRowEditStartReasons || (GridRowEditStartReasons = {}));\n\nvar GridRowEditStopReasons;\n\n(function (GridRowEditStopReasons) {\n GridRowEditStopReasons[\"rowFocusOut\"] = \"rowFocusOut\";\n GridRowEditStopReasons[\"escapeKeyDown\"] = \"escapeKeyDown\";\n GridRowEditStopReasons[\"enterKeyDown\"] = \"enterKeyDown\";\n GridRowEditStopReasons[\"tabKeyDown\"] = \"tabKeyDown\";\n GridRowEditStopReasons[\"shiftTabKeyDown\"] = \"shiftTabKeyDown\";\n})(GridRowEditStopReasons || (GridRowEditStopReasons = {}));\n\n// https://github.com/mui/mui-x/pull/3738#discussion_r798504277\nexport { GridRowEditStartReasons, GridRowEditStopReasons };","import _toPropertyKey from \"@babel/runtime/helpers/esm/toPropertyKey\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"id\"],\n _excluded2 = [\"id\"];\nimport * as React from 'react';\nimport { useGridApiEventHandler, useGridApiOptionHandler, GridSignature } from '../../utils/useGridApiEventHandler';\nimport { GridEditModes, GridRowModes } from '../../../models/gridEditRowModel';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { gridEditRowsStateSelector } from './gridEditRowsSelector';\nimport { isPrintableKey } from '../../../utils/keyboardUtils';\nimport { gridColumnFieldsSelector } from '../columns/gridColumnsSelector';\nimport { buildWarning } from '../../../utils/warning';\nimport { gridRowsIdToIdLookupSelector } from '../rows/gridRowsSelector';\nimport { GridRowEditStopReasons, GridRowEditStartReasons } from '../../../models/params/gridRowParams';\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/#persistence.'], 'error');\nexport const useGridRowEditing = (apiRef, props) => {\n const [rowModesModel, setRowModesModel] = React.useState({});\n const prevRowModesModel = React.useRef({});\n const focusTimeout = React.useRef(null);\n const nextFocusedCell = React.useRef(null);\n const {\n processRowUpdate,\n onProcessRowUpdateError,\n rowModesModel: rowModesModelProp,\n onRowModesModelChange,\n signature\n } = props;\n\n const runIfEditModeIsRow = callback => (...args) => {\n if (props.editMode === GridEditModes.Row) {\n callback(...args);\n }\n };\n\n const throwIfNotEditable = React.useCallback((id, field) => {\n const params = apiRef.current.getCellParams(id, field);\n\n if (!apiRef.current.isCellEditable(params)) {\n throw new Error(`MUI: The cell with id=${id} and field=${field} is not editable.`);\n }\n }, [apiRef]);\n const throwIfNotInMode = React.useCallback((id, mode) => {\n if (apiRef.current.getRowMode(id) !== mode) {\n throw new Error(`MUI: The row with id=${id} is not in ${mode} mode.`);\n }\n }, [apiRef]);\n const handleCellDoubleClick = React.useCallback((params, event) => {\n if (!params.isEditable) {\n return;\n }\n\n if (apiRef.current.getRowMode(params.id) === GridRowModes.Edit) {\n return;\n }\n\n const rowParams = apiRef.current.getRowParams(params.id);\n\n const newParams = _extends({}, rowParams, {\n field: params.field,\n reason: GridRowEditStartReasons.cellDoubleClick\n });\n\n apiRef.current.publishEvent('rowEditStart', newParams, event);\n }, [apiRef]);\n const handleCellFocusIn = React.useCallback(params => {\n nextFocusedCell.current = params;\n }, []);\n const handleCellFocusOut = React.useCallback((params, event) => {\n if (!params.isEditable) {\n return;\n }\n\n if (apiRef.current.getRowMode(params.id) === GridRowModes.View) {\n return;\n } // The mechanism to detect if we can stop editing a row is different from\n // the cell editing. Instead of triggering it when clicking outside a cell,\n // we must check if another cell in the same row was not clicked. To achieve\n // that, first we keep track of all cells that gained focus. When a cell loses\n // focus we check if the next cell that received focus is from a different row.\n\n\n nextFocusedCell.current = null;\n focusTimeout.current = setTimeout(() => {\n var _nextFocusedCell$curr;\n\n focusTimeout.current = null;\n\n if (((_nextFocusedCell$curr = nextFocusedCell.current) == null ? void 0 : _nextFocusedCell$curr.id) !== params.id) {\n // The row might have been deleted during the click\n if (!apiRef.current.getRow(params.id)) {\n return;\n }\n\n const rowParams = apiRef.current.getRowParams(params.id);\n\n const newParams = _extends({}, rowParams, {\n field: params.field,\n reason: GridRowEditStopReasons.rowFocusOut\n });\n\n apiRef.current.publishEvent('rowEditStop', newParams, event);\n }\n });\n }, [apiRef]);\n React.useEffect(() => {\n return () => {\n clearTimeout(focusTimeout.current);\n };\n }, []);\n const handleCellKeyDown = React.useCallback((params, event) => {\n if (params.cellMode === GridRowModes.Edit) {\n let reason;\n\n if (event.key === 'Escape') {\n reason = GridRowEditStopReasons.escapeKeyDown;\n } else if (event.key === 'Enter') {\n reason = GridRowEditStopReasons.enterKeyDown;\n } else if (event.key === 'Tab') {\n const columnFields = gridColumnFieldsSelector(apiRef).filter(field => apiRef.current.isCellEditable(apiRef.current.getCellParams(params.id, field)));\n\n if (event.shiftKey) {\n if (params.field === columnFields[0]) {\n // Exit if user pressed Shift+Tab on the first field\n reason = GridRowEditStopReasons.shiftTabKeyDown;\n }\n } else if (params.field === columnFields[columnFields.length - 1]) {\n // Exit if user pressed Tab on the last field\n reason = GridRowEditStopReasons.tabKeyDown;\n }\n\n if (reason) {\n event.preventDefault(); // Prevent going to the next element in the tab sequence\n }\n }\n\n if (reason) {\n const rowParams = apiRef.current.getRowParams(params.id);\n\n const newParams = _extends({}, rowParams, {\n reason,\n field: params.field\n });\n\n apiRef.current.publishEvent('rowEditStop', newParams, event);\n }\n } else if (params.isEditable) {\n let reason;\n\n if (isPrintableKey(event.key)) {\n if (event.shiftKey || event.ctrlKey || event.metaKey || event.altKey) {\n return;\n }\n\n reason = GridRowEditStartReasons.printableKeyDown;\n } else if (event.key === 'Enter') {\n reason = GridRowEditStartReasons.enterKeyDown;\n } else if (event.key === 'Delete') {\n reason = GridRowEditStartReasons.deleteKeyDown;\n }\n\n if (reason) {\n const rowParams = apiRef.current.getRowParams(params.id);\n\n const newParams = _extends({}, rowParams, {\n field: params.field,\n reason\n });\n\n apiRef.current.publishEvent('rowEditStart', newParams, event);\n }\n }\n }, [apiRef]);\n const handleRowEditStart = React.useCallback(params => {\n const {\n id,\n field,\n reason\n } = params;\n const startRowEditModeParams = {\n id,\n fieldToFocus: field\n };\n\n if (reason === GridRowEditStartReasons.deleteKeyDown || reason === GridRowEditStartReasons.printableKeyDown) {\n startRowEditModeParams.deleteValue = !!field;\n }\n\n apiRef.current.startRowEditMode(startRowEditModeParams);\n }, [apiRef]);\n const handleRowEditStop = React.useCallback(params => {\n const {\n id,\n reason,\n field\n } = params;\n apiRef.current.unstable_runPendingEditCellValueMutation(id);\n let cellToFocusAfter;\n\n if (reason === GridRowEditStopReasons.enterKeyDown) {\n cellToFocusAfter = 'below';\n } else if (reason === GridRowEditStopReasons.tabKeyDown) {\n cellToFocusAfter = 'right';\n } else if (reason === GridRowEditStopReasons.shiftTabKeyDown) {\n cellToFocusAfter = 'left';\n }\n\n let ignoreModifications = reason === 'escapeKeyDown';\n const editingState = gridEditRowsStateSelector(apiRef.current.state);\n\n if (!ignoreModifications) {\n // The user wants to stop editing the cell but we can't wait for the props to be processed.\n // In this case, discard the modifications if any field is processing its props.\n ignoreModifications = Object.values(editingState[id]).some(fieldProps => {\n return fieldProps.isProcessingProps;\n });\n }\n\n apiRef.current.stopRowEditMode({\n id,\n ignoreModifications,\n field,\n cellToFocusAfter\n });\n }, [apiRef]);\n useGridApiEventHandler(apiRef, 'cellDoubleClick', runIfEditModeIsRow(handleCellDoubleClick));\n useGridApiEventHandler(apiRef, 'cellFocusIn', runIfEditModeIsRow(handleCellFocusIn));\n useGridApiEventHandler(apiRef, 'cellFocusOut', runIfEditModeIsRow(handleCellFocusOut));\n useGridApiEventHandler(apiRef, 'cellKeyDown', runIfEditModeIsRow(handleCellKeyDown));\n useGridApiEventHandler(apiRef, 'rowEditStart', runIfEditModeIsRow(handleRowEditStart));\n useGridApiEventHandler(apiRef, 'rowEditStop', runIfEditModeIsRow(handleRowEditStop));\n useGridApiOptionHandler(apiRef, 'rowEditStart', props.onRowEditStart);\n useGridApiOptionHandler(apiRef, 'rowEditStop', props.onRowEditStop);\n const getRowMode = React.useCallback(id => {\n if (props.editMode === GridEditModes.Cell) {\n return GridRowModes.View;\n }\n\n const editingState = gridEditRowsStateSelector(apiRef.current.state);\n const isEditing = editingState[id] && Object.keys(editingState[id]).length > 0;\n return isEditing ? GridRowModes.Edit : GridRowModes.View;\n }, [apiRef, props.editMode]);\n const updateRowModesModel = React.useCallback(newModel => {\n const isNewModelDifferentFromProp = newModel !== props.rowModesModel;\n\n if (onRowModesModelChange && isNewModelDifferentFromProp) {\n const details = signature === GridSignature.DataGridPro ? {\n api: apiRef.current\n } : {};\n onRowModesModelChange(newModel, details);\n }\n\n if (props.rowModesModel && isNewModelDifferentFromProp) {\n return; // The prop always win\n }\n\n setRowModesModel(newModel);\n apiRef.current.publishEvent('rowModesModelChange', newModel);\n }, [apiRef, onRowModesModelChange, props.rowModesModel, signature]);\n const updateRowInRowModesModel = React.useCallback((id, newProps) => {\n const newModel = _extends({}, rowModesModel);\n\n if (newProps !== null) {\n newModel[id] = _extends({}, newProps);\n } else {\n delete newModel[id];\n }\n\n updateRowModesModel(newModel);\n }, [rowModesModel, updateRowModesModel]);\n const updateOrDeleteRowState = React.useCallback((id, newProps) => {\n apiRef.current.setState(state => {\n const newEditingState = _extends({}, state.editRows);\n\n if (newProps !== null) {\n newEditingState[id] = newProps;\n } else {\n delete newEditingState[id];\n }\n\n return _extends({}, state, {\n editRows: newEditingState\n });\n });\n apiRef.current.forceUpdate();\n }, [apiRef]);\n const updateOrDeleteFieldState = React.useCallback((id, field, newProps) => {\n apiRef.current.setState(state => {\n const newEditingState = _extends({}, state.editRows);\n\n if (newProps !== null) {\n newEditingState[id] = _extends({}, newEditingState[id], {\n [field]: _extends({}, newProps)\n });\n } else {\n delete newEditingState[id][field];\n\n if (Object.keys(newEditingState[id]).length === 0) {\n delete newEditingState[id];\n }\n }\n\n return _extends({}, state, {\n editRows: newEditingState\n });\n });\n apiRef.current.forceUpdate();\n }, [apiRef]);\n const startRowEditMode = React.useCallback(params => {\n const {\n id\n } = params,\n other = _objectWithoutPropertiesLoose(params, _excluded);\n\n throwIfNotInMode(id, GridRowModes.View);\n updateRowInRowModesModel(id, _extends({\n mode: GridRowModes.Edit\n }, other));\n }, [throwIfNotInMode, updateRowInRowModesModel]);\n const updateStateToStartRowEditMode = React.useCallback(params => {\n const {\n id,\n fieldToFocus,\n deleteValue\n } = params;\n const columnFields = gridColumnFieldsSelector(apiRef);\n const newProps = columnFields.reduce((acc, field) => {\n const cellParams = apiRef.current.getCellParams(id, field);\n\n if (!cellParams.isEditable) {\n return acc;\n }\n\n const shouldDeleteValue = deleteValue && fieldToFocus === field;\n acc[field] = {\n value: shouldDeleteValue ? '' : apiRef.current.getCellValue(id, field),\n error: false,\n isProcessingProps: false\n };\n return acc;\n }, {});\n updateOrDeleteRowState(id, newProps);\n\n if (fieldToFocus) {\n apiRef.current.setCellFocus(id, fieldToFocus);\n }\n }, [apiRef, updateOrDeleteRowState]);\n const stopRowEditMode = React.useCallback(params => {\n const {\n id\n } = params,\n other = _objectWithoutPropertiesLoose(params, _excluded2);\n\n throwIfNotInMode(id, GridRowModes.Edit);\n updateRowInRowModesModel(id, _extends({\n mode: GridRowModes.View\n }, other));\n }, [throwIfNotInMode, updateRowInRowModesModel]);\n const updateStateToStopRowEditMode = React.useCallback(params => {\n const {\n id,\n ignoreModifications,\n field: focusedField,\n cellToFocusAfter = 'none'\n } = params;\n apiRef.current.unstable_runPendingEditCellValueMutation(id);\n\n const finishRowEditMode = () => {\n if (cellToFocusAfter !== 'none' && focusedField) {\n apiRef.current.unstable_moveFocusToRelativeCell(id, focusedField, cellToFocusAfter);\n }\n\n updateOrDeleteRowState(id, null);\n updateRowInRowModesModel(id, null);\n };\n\n if (ignoreModifications) {\n finishRowEditMode();\n return;\n }\n\n const editingState = gridEditRowsStateSelector(apiRef.current.state);\n const row = apiRef.current.getRow(id);\n const isSomeFieldProcessingProps = Object.values(editingState[id]).some(fieldProps => fieldProps.isProcessingProps);\n\n if (isSomeFieldProcessingProps) {\n prevRowModesModel.current[id].mode = GridRowModes.Edit;\n return;\n }\n\n const hasSomeFieldWithError = Object.values(editingState[id]).some(fieldProps => fieldProps.error);\n\n if (hasSomeFieldWithError) {\n prevRowModesModel.current[id].mode = GridRowModes.Edit;\n return;\n }\n\n const rowUpdate = apiRef.current.unstable_getRowWithUpdatedValuesFromRowEditing(id);\n\n if (processRowUpdate) {\n const handleError = errorThrown => {\n prevRowModesModel.current[id].mode = GridRowModes.Edit;\n\n if (onProcessRowUpdateError) {\n onProcessRowUpdateError(errorThrown);\n } else {\n missingOnProcessRowUpdateErrorWarning();\n }\n };\n\n try {\n Promise.resolve(processRowUpdate(rowUpdate, row)).then(finalRowUpdate => {\n apiRef.current.updateRows([finalRowUpdate]);\n finishRowEditMode();\n }).catch(handleError);\n } catch (errorThrown) {\n handleError(errorThrown);\n }\n } else {\n apiRef.current.updateRows([rowUpdate]);\n finishRowEditMode();\n }\n }, [apiRef, onProcessRowUpdateError, processRowUpdate, updateOrDeleteRowState, updateRowInRowModesModel]);\n const setRowEditingEditCellValue = React.useCallback(params => {\n const {\n id,\n field,\n value\n } = params;\n throwIfNotEditable(id, field);\n const column = apiRef.current.getColumn(field);\n const row = apiRef.current.getRow(id);\n let parsedValue = value;\n\n if (column.valueParser) {\n parsedValue = column.valueParser(value, apiRef.current.getCellParams(id, field));\n }\n\n let editingState = gridEditRowsStateSelector(apiRef.current.state);\n\n let newProps = _extends({}, editingState[id][field], {\n value: parsedValue\n });\n\n if (!column.preProcessEditCellProps) {\n updateOrDeleteFieldState(id, field, newProps);\n }\n\n return new Promise(resolve => {\n const promises = [];\n\n if (column.preProcessEditCellProps) {\n const hasChanged = newProps.value !== editingState[id][field].value;\n newProps = _extends({}, newProps, {\n isProcessingProps: true\n });\n updateOrDeleteFieldState(id, field, newProps);\n\n const _editingState$id = editingState[id],\n otherFieldsProps = _objectWithoutPropertiesLoose(_editingState$id, [field].map(_toPropertyKey));\n\n const promise = Promise.resolve(column.preProcessEditCellProps({\n id,\n row,\n props: newProps,\n hasChanged,\n otherFieldsProps\n })).then(processedProps => {\n // Check again if the row is in edit mode because the user may have\n // discarded the changes while the props were being processed.\n if (apiRef.current.getRowMode(id) === GridRowModes.View) {\n resolve(false);\n return;\n }\n\n editingState = gridEditRowsStateSelector(apiRef.current.state);\n processedProps = _extends({}, processedProps, {\n isProcessingProps: false\n }); // We don't reuse the value from the props pre-processing because when the\n // promise resolves it may be already outdated. The only exception to this rule\n // is when there's no pre-processing.\n\n processedProps.value = column.preProcessEditCellProps ? editingState[id][field].value : parsedValue;\n updateOrDeleteFieldState(id, field, processedProps);\n });\n promises.push(promise);\n }\n\n Object.entries(editingState[id]).forEach(([thisField, fieldProps]) => {\n if (thisField === field) {\n return;\n }\n\n const fieldColumn = apiRef.current.getColumn(thisField);\n\n if (!fieldColumn.preProcessEditCellProps) {\n return;\n }\n\n fieldProps = _extends({}, fieldProps, {\n isProcessingProps: true\n });\n updateOrDeleteFieldState(id, thisField, fieldProps);\n editingState = gridEditRowsStateSelector(apiRef.current.state);\n\n const _editingState$id2 = editingState[id],\n otherFieldsProps = _objectWithoutPropertiesLoose(_editingState$id2, [thisField].map(_toPropertyKey));\n\n const promise = Promise.resolve(fieldColumn.preProcessEditCellProps({\n id,\n row,\n props: fieldProps,\n hasChanged: false,\n otherFieldsProps\n })).then(processedProps => {\n // Check again if the row is in edit mode because the user may have\n // discarded the changes while the props were being processed.\n if (apiRef.current.getRowMode(id) === GridRowModes.View) {\n resolve(false);\n return;\n }\n\n processedProps = _extends({}, processedProps, {\n isProcessingProps: false\n });\n updateOrDeleteFieldState(id, thisField, processedProps);\n });\n promises.push(promise);\n });\n Promise.all(promises).then(() => {\n if (apiRef.current.getRowMode(id) === GridRowModes.Edit) {\n editingState = gridEditRowsStateSelector(apiRef.current.state);\n resolve(!editingState[id][field].error);\n } else {\n resolve(false);\n }\n });\n });\n }, [apiRef, throwIfNotEditable, updateOrDeleteFieldState]);\n const getRowWithUpdatedValuesFromRowEditing = React.useCallback(id => {\n const editingState = gridEditRowsStateSelector(apiRef.current.state);\n const row = apiRef.current.getRow(id);\n\n let rowUpdate = _extends({}, row);\n\n Object.entries(editingState[id]).forEach(([field, fieldProps]) => {\n const column = apiRef.current.getColumn(field);\n\n if (column.valueSetter) {\n rowUpdate = column.valueSetter({\n value: fieldProps.value,\n row: rowUpdate\n });\n } else {\n rowUpdate[field] = fieldProps.value;\n }\n });\n return rowUpdate;\n }, [apiRef]);\n const editingApi = {\n getRowMode,\n startRowEditMode,\n stopRowEditMode,\n unstable_setRowEditingEditCellValue: setRowEditingEditCellValue,\n unstable_getRowWithUpdatedValuesFromRowEditing: getRowWithUpdatedValuesFromRowEditing\n };\n useGridApiMethod(apiRef, editingApi, 'EditingApi');\n React.useEffect(() => {\n if (rowModesModelProp) {\n updateRowModesModel(rowModesModelProp);\n }\n }, [rowModesModelProp, updateRowModesModel]);\n React.useEffect(() => {\n const idToIdLookup = gridRowsIdToIdLookupSelector(apiRef); // Update the ref here because updateStateToStopRowEditMode may change it later\n\n const copyOfPrevRowModesModel = prevRowModesModel.current;\n prevRowModesModel.current = rowModesModel;\n Object.entries(rowModesModel).forEach(([id, params]) => {\n var _copyOfPrevRowModesMo, _idToIdLookup$id;\n\n const prevMode = ((_copyOfPrevRowModesMo = copyOfPrevRowModesModel[id]) == null ? void 0 : _copyOfPrevRowModesMo.mode) || GridRowModes.View;\n const originalId = (_idToIdLookup$id = idToIdLookup[id]) != null ? _idToIdLookup$id : id;\n\n if (params.mode === GridRowModes.Edit && prevMode === GridRowModes.View) {\n updateStateToStartRowEditMode(_extends({\n id: originalId\n }, params));\n } else if (params.mode === GridRowModes.View && prevMode === GridRowModes.Edit) {\n updateStateToStopRowEditMode(_extends({\n id: originalId\n }, params));\n }\n });\n }, [apiRef, rowModesModel, updateStateToStartRowEditMode, updateStateToStopRowEditMode]);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { useGridCellEditing } from './useGridCellEditing.new';\nimport { GridCellModes, GridEditModes } from '../../../models/gridEditRowModel';\nimport { useGridRowEditing } from './useGridRowEditing.new';\nexport const editingStateInitializer = state => _extends({}, state, {\n editRows: {}\n});\nexport const useGridEditing = (apiRef, props) => {\n useGridCellEditing(apiRef, props);\n useGridRowEditing(apiRef, props);\n const debounceMap = React.useRef({});\n const {\n isCellEditable: isCellEditableProp\n } = props;\n const isCellEditable = React.useCallback(params => {\n if (params.rowNode.isAutoGenerated) {\n return false;\n }\n\n if (!params.colDef.editable) {\n return false;\n }\n\n if (!params.colDef.renderEditCell) {\n return false;\n }\n\n if (isCellEditableProp) {\n return isCellEditableProp(params);\n }\n\n return true;\n }, [isCellEditableProp]);\n\n const maybeDebounce = (id, field, debounceMs, callback) => {\n if (!debounceMs) {\n callback();\n return;\n }\n\n if (!debounceMap.current[id]) {\n debounceMap.current[id] = {};\n }\n\n if (debounceMap.current[id][field]) {\n const [timeout] = debounceMap.current[id][field];\n clearTimeout(timeout);\n } // To run the callback immediatelly without waiting the timeout\n\n\n const runImmediately = () => {\n const [timeout] = debounceMap.current[id][field];\n clearTimeout(timeout);\n callback();\n delete debounceMap.current[id][field];\n };\n\n const timeout = setTimeout(() => {\n callback();\n delete debounceMap.current[id][field];\n }, debounceMs);\n debounceMap.current[id][field] = [timeout, runImmediately];\n };\n\n React.useEffect(() => {\n const debounces = debounceMap.current;\n return () => {\n Object.entries(debounces).forEach(([id, fields]) => {\n Object.keys(fields).forEach(field => {\n const [timeout] = debounces[id][field];\n clearTimeout(timeout);\n delete debounces[id][field];\n });\n });\n };\n }, []);\n const runPendingEditCellValueMutation = React.useCallback((id, field) => {\n if (!debounceMap.current[id]) {\n return;\n }\n\n if (!field) {\n Object.keys(debounceMap.current[id]).forEach(debouncedField => {\n const [, runCallback] = debounceMap.current[id][debouncedField];\n runCallback();\n });\n } else if (debounceMap.current[id][field]) {\n const [, runCallback] = debounceMap.current[id][field];\n runCallback();\n }\n }, []);\n const setEditCellValue = React.useCallback(params => {\n const {\n id,\n field,\n debounceMs\n } = params;\n return new Promise(resolve => {\n maybeDebounce(id, field, debounceMs, async () => {\n const setEditCellValueToCall = props.editMode === GridEditModes.Row ? apiRef.current.unstable_setRowEditingEditCellValue : apiRef.current.unstable_setCellEditingEditCellValue; // Check if the cell is in edit mode\n // By the time this callback runs the user may have cancelled the editing\n\n if (apiRef.current.getCellMode(id, field) === GridCellModes.Edit) {\n const result = await setEditCellValueToCall(params);\n resolve(result);\n }\n });\n });\n }, [apiRef, props.editMode]);\n const getRowWithUpdatedValues = React.useCallback((id, field) => {\n return props.editMode === GridEditModes.Cell ? apiRef.current.unstable_getRowWithUpdatedValuesFromCellEditing(id, field) : apiRef.current.unstable_getRowWithUpdatedValuesFromRowEditing(id);\n }, [apiRef, props.editMode]);\n const editingSharedApi = {\n isCellEditable,\n setEditCellValue,\n unstable_runPendingEditCellValueMutation: runPendingEditCellValueMutation,\n unstable_getRowWithUpdatedValues: getRowWithUpdatedValues\n };\n useGridApiMethod(apiRef, editingSharedApi, 'EditingApi');\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"rowsBeforePartialUpdates\"];\n\n/**\n * A helper function to check if the id provided is valid.\n * @param {GridRowId} id Id as [[GridRowId]].\n * @param {GridRowModel | Partial} row Row as [[GridRowModel]].\n * @param {string} detailErrorMessage A custom error message to display for invalid IDs\n */\nexport function checkGridRowIdIsValid(id, row, detailErrorMessage = 'A row was provided without id in the rows prop:') {\n if (id == null) {\n throw new Error(['MUI: The data grid component requires all rows to have a unique `id` property.', 'Alternatively, you can use the `getRowId` prop to specify a custom id for each row.', detailErrorMessage, JSON.stringify(row)].join('\\n'));\n }\n}\nexport const getRowIdFromRowModel = (rowModel, getRowId, detailErrorMessage) => {\n const id = getRowId ? getRowId(rowModel) : rowModel.id;\n checkGridRowIdIsValid(id, rowModel, detailErrorMessage);\n return id;\n};\nexport const createRowsInternalCache = ({\n rows,\n getRowId,\n loading\n}) => {\n const cache = {\n rowsBeforePartialUpdates: rows,\n loadingPropBeforePartialUpdates: loading,\n idRowsLookup: {},\n idToIdLookup: {},\n ids: []\n };\n\n for (let i = 0; i < rows.length; i += 1) {\n const row = rows[i];\n const id = getRowIdFromRowModel(row, getRowId);\n cache.idRowsLookup[id] = row;\n cache.idToIdLookup[id] = id;\n cache.ids.push(id);\n }\n\n return cache;\n};\nexport const getRowsStateFromCache = ({\n apiRef,\n previousTree,\n rowCountProp,\n loadingProp\n}) => {\n const _apiRef$current$unsta = apiRef.current.unstable_caches.rows,\n cacheForGrouping = _objectWithoutPropertiesLoose(_apiRef$current$unsta, _excluded);\n\n const rowCount = rowCountProp != null ? rowCountProp : 0;\n const groupingResponse = apiRef.current.unstable_applyStrategyProcessor('rowTreeCreation', _extends({}, cacheForGrouping, {\n previousTree\n }));\n const processedGroupingResponse = apiRef.current.unstable_applyPipeProcessors('hydrateRows', groupingResponse);\n const dataTopLevelRowCount = processedGroupingResponse.treeDepth === 1 ? processedGroupingResponse.ids.length : Object.values(processedGroupingResponse.tree).filter(node => node.parent == null).length;\n return _extends({}, processedGroupingResponse, {\n groupingResponseBeforeRowHydration: groupingResponse,\n loading: loadingProp,\n totalRowCount: Math.max(rowCount, processedGroupingResponse.ids.length),\n totalTopLevelRowCount: Math.max(rowCount, dataTopLevelRowCount)\n });\n};\nexport const getTreeNodeDescendants = (tree, parentId, skipAutoGeneratedRows) => {\n var _tree$parentId;\n\n const children = (_tree$parentId = tree[parentId]) == null ? void 0 : _tree$parentId.children;\n\n if (children == null) {\n return [];\n }\n\n const validDescendants = [];\n\n for (let i = 0; i < children.length; i += 1) {\n const child = children[i];\n const childNode = tree[child];\n\n if (!skipAutoGeneratedRows || !childNode.isAutoGenerated) {\n validDescendants.push(child);\n }\n\n validDescendants.push(...getTreeNodeDescendants(tree, childNode.id, skipAutoGeneratedRows));\n }\n\n return validDescendants;\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { useGridLogger } from '../../utils/useGridLogger';\nimport { gridRowCountSelector, gridRowsLookupSelector, gridRowTreeSelector, gridRowIdsSelector, gridRowGroupingNameSelector } from './gridRowsSelector';\nimport { GridSignature, useGridApiEventHandler } from '../../utils/useGridApiEventHandler';\nimport { useGridVisibleRows } from '../../utils/useGridVisibleRows';\nimport { gridSortedRowIdsSelector } from '../sorting/gridSortingSelector';\nimport { gridFilteredRowsLookupSelector } from '../filter/gridFilterSelector';\nimport { getTreeNodeDescendants, createRowsInternalCache, getRowsStateFromCache, getRowIdFromRowModel } from './gridRowsUtils';\nimport { useGridRegisterPipeApplier } from '../../core/pipeProcessing';\nexport const rowsStateInitializer = (state, props, apiRef) => {\n apiRef.current.unstable_caches.rows = createRowsInternalCache({\n rows: props.rows,\n getRowId: props.getRowId,\n loading: props.loading\n });\n return _extends({}, state, {\n rows: getRowsStateFromCache({\n apiRef,\n previousTree: null,\n rowCountProp: props.rowCount,\n loadingProp: props.loading\n })\n });\n};\nexport const useGridRows = (apiRef, props) => {\n if (process.env.NODE_ENV !== 'production') {\n // Freeze rows for immutability\n Object.freeze(props.rows);\n }\n\n const logger = useGridLogger(apiRef, 'useGridRows');\n const currentPage = useGridVisibleRows(apiRef, props);\n const lastUpdateMs = React.useRef(Date.now());\n const timeout = React.useRef(null);\n const getRow = React.useCallback(id => {\n var _ref;\n\n return (_ref = gridRowsLookupSelector(apiRef)[id]) != null ? _ref : null;\n }, [apiRef]);\n const lookup = React.useMemo(() => currentPage.rows.reduce((acc, {\n id\n }, index) => {\n acc[id] = index;\n return acc;\n }, {}), [currentPage.rows]);\n const throttledRowsChange = React.useCallback((newCache, throttle) => {\n const run = () => {\n timeout.current = null;\n lastUpdateMs.current = Date.now();\n apiRef.current.setState(state => _extends({}, state, {\n rows: getRowsStateFromCache({\n apiRef,\n previousTree: gridRowTreeSelector(apiRef),\n rowCountProp: props.rowCount,\n loadingProp: props.loading\n })\n }));\n apiRef.current.publishEvent('rowsSet');\n apiRef.current.forceUpdate();\n };\n\n if (timeout.current) {\n clearTimeout(timeout.current);\n timeout.current = null;\n }\n\n apiRef.current.unstable_caches.rows = newCache;\n\n if (!throttle) {\n run();\n return;\n }\n\n const throttleRemainingTimeMs = props.throttleRowsMs - (Date.now() - lastUpdateMs.current);\n\n if (throttleRemainingTimeMs > 0) {\n timeout.current = setTimeout(run, throttleRemainingTimeMs);\n return;\n }\n\n run();\n }, [props.throttleRowsMs, props.rowCount, props.loading, apiRef]);\n /**\n * API METHODS\n */\n\n const setRows = React.useCallback(rows => {\n logger.debug(`Updating all rows, new length ${rows.length}`);\n throttledRowsChange(createRowsInternalCache({\n rows,\n getRowId: props.getRowId,\n loading: props.loading\n }), true);\n }, [logger, props.getRowId, props.loading, throttledRowsChange]);\n const updateRows = React.useCallback(updates => {\n if (props.signature === GridSignature.DataGrid && updates.length > 1) {\n // TODO: Add test with direct call to `apiRef.current.updateRows` in DataGrid after enabling the `apiRef` on the free plan.\n throw new Error([\"MUI: You can't update several rows at once in `apiRef.current.updateRows` on the DataGrid.\", 'You need to upgrade to the DataGridPro component to unlock this feature.'].join('\\n'));\n } // we remove duplicate updates. A server can batch updates, and send several updates for the same row in one fn call.\n\n\n const uniqUpdates = new Map();\n updates.forEach(update => {\n const id = getRowIdFromRowModel(update, props.getRowId, 'A row was provided without id when calling updateRows():');\n\n if (uniqUpdates.has(id)) {\n uniqUpdates.set(id, _extends({}, uniqUpdates.get(id), update));\n } else {\n uniqUpdates.set(id, update);\n }\n });\n const deletedRowIds = [];\n const prevCache = apiRef.current.unstable_caches.rows;\n const newCache = {\n rowsBeforePartialUpdates: prevCache.rowsBeforePartialUpdates,\n loadingPropBeforePartialUpdates: prevCache.loadingPropBeforePartialUpdates,\n idRowsLookup: _extends({}, prevCache.idRowsLookup),\n idToIdLookup: _extends({}, prevCache.idToIdLookup),\n ids: [...prevCache.ids]\n };\n uniqUpdates.forEach((partialRow, id) => {\n // eslint-disable-next-line no-underscore-dangle\n if (partialRow._action === 'delete') {\n delete newCache.idRowsLookup[id];\n delete newCache.idToIdLookup[id];\n deletedRowIds.push(id);\n return;\n }\n\n const oldRow = apiRef.current.getRow(id);\n\n if (!oldRow) {\n newCache.idRowsLookup[id] = partialRow;\n newCache.idToIdLookup[id] = id;\n newCache.ids.push(id);\n return;\n }\n\n newCache.idRowsLookup[id] = _extends({}, apiRef.current.getRow(id), partialRow);\n });\n\n if (deletedRowIds.length > 0) {\n newCache.ids = newCache.ids.filter(id => !deletedRowIds.includes(id));\n }\n\n throttledRowsChange(newCache, true);\n }, [props.signature, props.getRowId, throttledRowsChange, apiRef]);\n const getRowModels = React.useCallback(() => {\n const allRows = gridRowIdsSelector(apiRef);\n const idRowsLookup = gridRowsLookupSelector(apiRef);\n return new Map(allRows.map(id => [id, idRowsLookup[id]]));\n }, [apiRef]);\n const getRowsCount = React.useCallback(() => gridRowCountSelector(apiRef), [apiRef]);\n const getAllRowIds = React.useCallback(() => gridRowIdsSelector(apiRef), [apiRef]);\n const getRowIndexRelativeToVisibleRows = React.useCallback(id => lookup[id], [lookup]);\n const setRowChildrenExpansion = React.useCallback((id, isExpanded) => {\n const currentNode = apiRef.current.getRowNode(id);\n\n if (!currentNode) {\n throw new Error(`MUI: No row with id #${id} found`);\n }\n\n const newNode = _extends({}, currentNode, {\n childrenExpanded: isExpanded\n });\n\n apiRef.current.setState(state => {\n return _extends({}, state, {\n rows: _extends({}, state.rows, {\n tree: _extends({}, state.rows.tree, {\n [id]: newNode\n })\n })\n });\n });\n apiRef.current.forceUpdate();\n apiRef.current.publishEvent('rowExpansionChange', newNode);\n }, [apiRef]);\n const getRowNode = React.useCallback(id => {\n var _gridRowTreeSelector$;\n\n return (_gridRowTreeSelector$ = gridRowTreeSelector(apiRef)[id]) != null ? _gridRowTreeSelector$ : null;\n }, [apiRef]);\n const getRowGroupChildren = React.useCallback(({\n skipAutoGeneratedRows = true,\n groupId,\n applySorting,\n applyFiltering\n }) => {\n const tree = gridRowTreeSelector(apiRef);\n let children;\n\n if (applySorting) {\n const groupNode = tree[groupId];\n\n if (!groupNode) {\n return [];\n }\n\n const sortedRowIds = gridSortedRowIdsSelector(apiRef);\n children = [];\n const startIndex = sortedRowIds.findIndex(id => id === groupId) + 1;\n\n for (let index = startIndex; index < sortedRowIds.length && tree[sortedRowIds[index]].depth > groupNode.depth; index += 1) {\n const id = sortedRowIds[index];\n const node = tree[id];\n\n if (!skipAutoGeneratedRows || !node.isAutoGenerated) {\n children.push(id);\n }\n }\n } else {\n children = getTreeNodeDescendants(tree, groupId, skipAutoGeneratedRows);\n }\n\n if (applyFiltering) {\n const filteredRowsLookup = gridFilteredRowsLookupSelector(apiRef);\n children = children.filter(childId => filteredRowsLookup[childId] !== false);\n }\n\n return children;\n }, [apiRef]);\n const setRowIndex = React.useCallback((rowId, targetIndex) => {\n const allRows = gridRowIdsSelector(apiRef);\n const oldIndex = allRows.findIndex(row => row === rowId);\n\n if (oldIndex === -1 || oldIndex === targetIndex) {\n return;\n }\n\n logger.debug(`Moving row ${rowId} to index ${targetIndex}`);\n const updatedRows = [...allRows];\n updatedRows.splice(targetIndex, 0, updatedRows.splice(oldIndex, 1)[0]);\n apiRef.current.setState(state => _extends({}, state, {\n rows: _extends({}, state.rows, {\n ids: updatedRows\n })\n }));\n apiRef.current.applySorting();\n }, [apiRef, logger]);\n const rowApi = {\n getRow,\n getRowModels,\n getRowsCount,\n getAllRowIds,\n setRows,\n setRowIndex,\n updateRows,\n setRowChildrenExpansion,\n getRowNode,\n getRowIndexRelativeToVisibleRows,\n getRowGroupChildren\n };\n /**\n * EVENTS\n */\n\n const groupRows = React.useCallback(() => {\n logger.info(`Row grouping pre-processing have changed, regenerating the row tree`);\n let cache;\n\n if (apiRef.current.unstable_caches.rows.rowsBeforePartialUpdates === props.rows) {\n // The `props.rows` did not change since the last row grouping\n // We can use the current rows cache which contains the partial updates done recently.\n cache = apiRef.current.unstable_caches.rows;\n } else {\n // The `props.rows` has changed since the last row grouping\n // We must use the new `props.rows` on the new grouping\n // This occurs because this event is triggered before the `useEffect` on the rows when both the grouping pre-processing and the rows changes on the same render\n cache = createRowsInternalCache({\n rows: props.rows,\n getRowId: props.getRowId,\n loading: props.loading\n });\n }\n\n throttledRowsChange(cache, false);\n }, [logger, apiRef, props.rows, props.getRowId, props.loading, throttledRowsChange]);\n const handleStrategyProcessorChange = React.useCallback(methodName => {\n if (methodName === 'rowTreeCreation') {\n groupRows();\n }\n }, [groupRows]);\n const handleStrategyActivityChange = React.useCallback(() => {\n // `rowTreeCreation` is the only processor ran when `strategyAvailabilityChange` is fired.\n // All the other processors listen to `rowsSet` which will be published by the `groupRows` method below.\n if (apiRef.current.unstable_getActiveStrategy('rowTree') !== gridRowGroupingNameSelector(apiRef)) {\n groupRows();\n }\n }, [apiRef, groupRows]);\n useGridApiEventHandler(apiRef, 'activeStrategyProcessorChange', handleStrategyProcessorChange);\n useGridApiEventHandler(apiRef, 'strategyAvailabilityChange', handleStrategyActivityChange);\n /**\n * APPLIERS\n */\n\n const applyHydrateRowsProcessor = React.useCallback(() => {\n apiRef.current.setState(state => _extends({}, state, {\n rows: _extends({}, state.rows, apiRef.current.unstable_applyPipeProcessors('hydrateRows', state.rows.groupingResponseBeforeRowHydration))\n }));\n apiRef.current.publishEvent('rowsSet');\n apiRef.current.forceUpdate();\n }, [apiRef]);\n useGridRegisterPipeApplier(apiRef, 'hydrateRows', applyHydrateRowsProcessor);\n useGridApiMethod(apiRef, rowApi, 'GridRowApi');\n /**\n * EFFECTS\n */\n\n React.useEffect(() => {\n return () => {\n if (timeout.current !== null) {\n clearTimeout(timeout.current);\n }\n };\n }, []); // The effect do not track any value defined synchronously during the 1st render by hooks called after `useGridRows`\n // As a consequence, the state generated by the 1st run of this useEffect will always be equal to the initialization one\n\n const isFirstRender = React.useRef(true);\n React.useEffect(() => {\n if (isFirstRender.current) {\n isFirstRender.current = false;\n return;\n }\n\n const areNewRowsAlreadyInState = apiRef.current.unstable_caches.rows.rowsBeforePartialUpdates === props.rows;\n const isNewLoadingAlreadyInState = apiRef.current.unstable_caches.rows.loadingPropBeforePartialUpdates === props.loading; // The new rows have already been applied (most likely in the `'rowGroupsPreProcessingChange'` listener)\n\n if (areNewRowsAlreadyInState) {\n // If the loading prop has changed, we need to update its value in the state because it won't be done by `throttledRowsChange`\n if (!isNewLoadingAlreadyInState) {\n apiRef.current.setState(state => _extends({}, state, {\n rows: _extends({}, state.rows, {\n loading: props.loading\n })\n }));\n apiRef.current.unstable_caches.rows.loadingPropBeforePartialUpdates = props.loading;\n apiRef.current.forceUpdate();\n }\n\n return;\n }\n\n logger.debug(`Updating all rows, new length ${props.rows.length}`);\n throttledRowsChange(createRowsInternalCache({\n rows: props.rows,\n getRowId: props.getRowId,\n loading: props.loading\n }), false);\n }, [props.rows, props.rowCount, props.getRowId, props.loading, logger, throttledRowsChange, apiRef]);\n};","import { GRID_DEFAULT_STRATEGY, useGridRegisterStrategyProcessor } from '../../core/strategyProcessing';\n\nconst flatRowTreeCreationMethod = ({\n ids,\n idRowsLookup,\n idToIdLookup,\n previousTree\n}) => {\n const tree = {};\n\n for (let i = 0; i < ids.length; i += 1) {\n const rowId = ids[i];\n\n if (previousTree && previousTree[rowId]) {\n tree[rowId] = previousTree[rowId];\n } else {\n tree[rowId] = {\n id: rowId,\n depth: 0,\n parent: null,\n groupingKey: '',\n groupingField: null\n };\n }\n }\n\n return {\n groupingName: GRID_DEFAULT_STRATEGY,\n tree,\n treeDepth: 1,\n idRowsLookup,\n idToIdLookup,\n ids\n };\n};\n\nexport const useGridRowsPreProcessors = apiRef => {\n useGridRegisterStrategyProcessor(apiRef, GRID_DEFAULT_STRATEGY, 'rowTreeCreation', flatRowTreeCreationMethod);\n};","import { gridClasses } from '../constants/gridClasses';\nexport function isOverflown(element) {\n return element.scrollHeight > element.clientHeight || element.scrollWidth > element.clientWidth;\n}\nexport function findParentElementFromClassName(elem, className) {\n return elem.closest(`.${className}`);\n}\nexport function getRowEl(cell) {\n if (!cell) {\n return null;\n }\n\n return findParentElementFromClassName(cell, gridClasses.row);\n} // TODO remove\n\nexport function isGridCellRoot(elem) {\n return elem != null && elem.classList.contains(gridClasses.cell);\n}\nexport function isGridHeaderCellRoot(elem) {\n return elem != null && elem.classList.contains(gridClasses.columnHeader);\n}\n\nfunction escapeOperandAttributeSelector(operand) {\n return operand.replace(/[\"\\\\]/g, '\\\\$&');\n}\n\nexport function getGridColumnHeaderElement(root, field) {\n return root.querySelector(`[role=\"columnheader\"][data-field=\"${escapeOperandAttributeSelector(field)}\"]`);\n}\nexport function getGridRowElement(root, id) {\n return root.querySelector(`.${gridClasses.row}[data-id=\"${escapeOperandAttributeSelector(String(id))}\"]`);\n}\nexport function getGridCellElement(root, {\n id,\n field\n}) {\n const row = getGridRowElement(root, id);\n\n if (!row) {\n return null;\n }\n\n return row.querySelector(`.${gridClasses.cell}[data-field=\"${escapeOperandAttributeSelector(field)}\"]`);\n}","import * as React from 'react';\nimport { getGridCellElement, getGridColumnHeaderElement, getGridRowElement } from '../../../utils/domUtils';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { gridFocusCellSelector, gridTabIndexCellSelector } from '../focus/gridFocusStateSelector';\nimport { buildWarning } from '../../../utils/warning';\nlet warnedOnceMissingColumn = false;\n\nfunction warnMissingColumn(field) {\n console.warn([`MUI: You are calling getValue('${field}') but the column \\`${field}\\` is not defined.`, `Instead, you can access the data from \\`params.row.${field}\\`.`].join('\\n'));\n warnedOnceMissingColumn = true;\n}\n\nconst getCellValueWarning = buildWarning([`MUI: You are calling getValue. This method is deprecated and will be removed in the next major version.`, 'Instead, you can access the data from `params.row`.']);\n/**\n * @requires useGridColumns (method)\n * @requires useGridRows (method)\n * @requires useGridFocus (state)\n * @requires useGridEditing (method)\n * TODO: Impossible priority - useGridEditing also needs to be after useGridParamsApi\n * TODO: Impossible priority - useGridFocus also needs to be after useGridParamsApi\n */\n\nexport function useGridParamsApi(apiRef) {\n const getColumnHeaderParams = React.useCallback(field => ({\n field,\n colDef: apiRef.current.getColumn(field)\n }), [apiRef]);\n /**\n * We want to remove the `getValue` param from `getRowParams`, `getCellParams` and `getBaseCellParams`\n */\n\n const getCellValueWithDeprecationWarning = React.useCallback((...args) => {\n if (process.env.NODE_ENV !== 'production') {\n getCellValueWarning();\n }\n\n return apiRef.current.getCellValue(...args);\n }, [apiRef]);\n const getRowParams = React.useCallback(id => {\n const row = apiRef.current.getRow(id);\n\n if (!row) {\n throw new Error(`No row with id #${id} found`);\n }\n\n const params = {\n id,\n columns: apiRef.current.getAllColumns(),\n row,\n // TODO v6: remove\n getValue: getCellValueWithDeprecationWarning\n };\n return params;\n }, [apiRef, getCellValueWithDeprecationWarning]);\n const getBaseCellParams = React.useCallback((id, field) => {\n const row = apiRef.current.getRow(id);\n const rowNode = apiRef.current.getRowNode(id);\n\n if (!row || !rowNode) {\n throw new Error(`No row with id #${id} found`);\n }\n\n const cellFocus = gridFocusCellSelector(apiRef);\n const cellTabIndex = gridTabIndexCellSelector(apiRef);\n const params = {\n id,\n field,\n row,\n rowNode,\n value: row[field],\n colDef: apiRef.current.getColumn(field),\n cellMode: apiRef.current.getCellMode(id, field),\n // TODO v6: remove\n getValue: getCellValueWithDeprecationWarning,\n api: apiRef.current,\n hasFocus: cellFocus !== null && cellFocus.field === field && cellFocus.id === id,\n tabIndex: cellTabIndex && cellTabIndex.field === field && cellTabIndex.id === id ? 0 : -1\n };\n return params;\n }, [apiRef, getCellValueWithDeprecationWarning]);\n const getCellParams = React.useCallback((id, field) => {\n const colDef = apiRef.current.getColumn(field);\n const value = apiRef.current.getCellValue(id, field);\n const row = apiRef.current.getRow(id);\n const rowNode = apiRef.current.getRowNode(id);\n\n if (!row || !rowNode) {\n throw new Error(`No row with id #${id} found`);\n }\n\n const cellFocus = gridFocusCellSelector(apiRef);\n const cellTabIndex = gridTabIndexCellSelector(apiRef);\n const params = {\n id,\n field,\n row,\n rowNode,\n colDef,\n cellMode: apiRef.current.getCellMode(id, field),\n // TODO v6: remove\n getValue: getCellValueWithDeprecationWarning,\n hasFocus: cellFocus !== null && cellFocus.field === field && cellFocus.id === id,\n tabIndex: cellTabIndex && cellTabIndex.field === field && cellTabIndex.id === id ? 0 : -1,\n value,\n formattedValue: value\n };\n\n if (colDef.valueFormatter) {\n params.formattedValue = colDef.valueFormatter({\n id,\n field: params.field,\n value: params.value,\n api: apiRef.current\n });\n }\n\n params.isEditable = colDef && apiRef.current.isCellEditable(params);\n return params;\n }, [apiRef, getCellValueWithDeprecationWarning]);\n const getCellValue = React.useCallback((id, field) => {\n const colDef = apiRef.current.getColumn(field);\n\n if (process.env.NODE_ENV !== 'production') {\n if (!colDef && !warnedOnceMissingColumn) {\n warnMissingColumn(field);\n }\n }\n\n if (!colDef || !colDef.valueGetter) {\n const rowModel = apiRef.current.getRow(id);\n\n if (!rowModel) {\n throw new Error(`No row with id #${id} found`);\n }\n\n return rowModel[field];\n }\n\n return colDef.valueGetter(getBaseCellParams(id, field));\n }, [apiRef, getBaseCellParams]);\n const getColumnHeaderElement = React.useCallback(field => {\n if (!apiRef.current.rootElementRef.current) {\n return null;\n }\n\n return getGridColumnHeaderElement(apiRef.current.rootElementRef.current, field);\n }, [apiRef]);\n const getRowElement = React.useCallback(id => {\n if (!apiRef.current.rootElementRef.current) {\n return null;\n }\n\n return getGridRowElement(apiRef.current.rootElementRef.current, id);\n }, [apiRef]);\n const getCellElement = React.useCallback((id, field) => {\n if (!apiRef.current.rootElementRef.current) {\n return null;\n }\n\n return getGridCellElement(apiRef.current.rootElementRef.current, {\n id,\n field\n });\n }, [apiRef]);\n const paramsApi = {\n getCellValue,\n getCellParams,\n getCellElement,\n getRowParams,\n getRowElement,\n getColumnHeaderParams,\n getColumnHeaderElement\n };\n useGridApiMethod(apiRef, paramsApi, 'GridParamsApi');\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridApiEventHandler } from '../../utils/useGridApiEventHandler';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { useGridLogger } from '../../utils/useGridLogger';\nimport { gridRowsLookupSelector } from '../rows/gridRowsSelector';\nimport { gridSelectionStateSelector, selectedGridRowsSelector, selectedIdsLookupSelector } from './gridSelectionSelector';\nimport { gridPaginatedVisibleSortedGridRowIdsSelector } from '../pagination';\nimport { gridFocusCellSelector } from '../focus/gridFocusStateSelector';\nimport { gridVisibleSortedRowIdsSelector } from '../filter/gridFilterSelector';\nimport { GRID_CHECKBOX_SELECTION_COL_DEF, GRID_ACTIONS_COLUMN_TYPE } from '../../../colDef';\nimport { GridCellModes } from '../../../models/gridEditRowModel';\nimport { isKeyboardEvent, isNavigationKey } from '../../../utils/keyboardUtils';\nimport { getVisibleRows, useGridVisibleRows } from '../../utils/useGridVisibleRows';\nimport { GRID_DETAIL_PANEL_TOGGLE_FIELD } from '../../../constants/gridDetailPanelToggleField';\n\nconst getSelectionModelPropValue = (selectionModelProp, prevSelectionModel) => {\n if (selectionModelProp == null) {\n return selectionModelProp;\n }\n\n if (Array.isArray(selectionModelProp)) {\n return selectionModelProp;\n }\n\n if (prevSelectionModel && prevSelectionModel[0] === selectionModelProp) {\n return prevSelectionModel;\n }\n\n return [selectionModelProp];\n};\n\nexport const selectionStateInitializer = (state, props) => {\n var _getSelectionModelPro;\n\n return _extends({}, state, {\n selection: (_getSelectionModelPro = getSelectionModelPropValue(props.selectionModel)) != null ? _getSelectionModelPro : []\n });\n};\n/**\n * @requires useGridRows (state, method) - can be after\n * @requires useGridParamsApi (method) - can be after\n * @requires useGridFocus (state) - can be after\n * @requires useGridKeyboardNavigation (`cellKeyDown` event must first be consumed by it)\n */\n\nexport const useGridSelection = (apiRef, props) => {\n const logger = useGridLogger(apiRef, 'useGridSelection');\n const propSelectionModel = React.useMemo(() => {\n return getSelectionModelPropValue(props.selectionModel, gridSelectionStateSelector(apiRef.current.state));\n }, [apiRef, props.selectionModel]);\n const lastRowToggled = React.useRef(null);\n apiRef.current.unstable_registerControlState({\n stateId: 'selection',\n propModel: propSelectionModel,\n propOnChange: props.onSelectionModelChange,\n stateSelector: gridSelectionStateSelector,\n changeEvent: 'selectionChange'\n });\n const {\n checkboxSelection,\n disableMultipleSelection,\n disableSelectionOnClick,\n isRowSelectable,\n pagination,\n paginationMode\n } = props;\n const canHaveMultipleSelection = !disableMultipleSelection || checkboxSelection;\n const visibleRows = useGridVisibleRows(apiRef, props);\n const expandMouseRowRangeSelection = React.useCallback(id => {\n var _lastRowToggled$curre;\n\n let endId = id;\n const startId = (_lastRowToggled$curre = lastRowToggled.current) != null ? _lastRowToggled$curre : id;\n const isSelected = apiRef.current.isRowSelected(id);\n\n if (isSelected) {\n const visibleRowIds = gridVisibleSortedRowIdsSelector(apiRef);\n const startIndex = visibleRowIds.findIndex(rowId => rowId === startId);\n const endIndex = visibleRowIds.findIndex(rowId => rowId === endId);\n\n if (startIndex === endIndex) {\n return;\n }\n\n if (startIndex > endIndex) {\n endId = visibleRowIds[endIndex + 1];\n } else {\n endId = visibleRowIds[endIndex - 1];\n }\n }\n\n lastRowToggled.current = id;\n apiRef.current.selectRowRange({\n startId,\n endId\n }, !isSelected);\n }, [apiRef]);\n /**\n * API METHODS\n */\n\n const setSelectionModel = React.useCallback(model => {\n const currentModel = gridSelectionStateSelector(apiRef.current.state);\n\n if (currentModel !== model) {\n logger.debug(`Setting selection model`);\n apiRef.current.setState(state => _extends({}, state, {\n selection: model\n }));\n apiRef.current.forceUpdate();\n }\n }, [apiRef, logger]);\n const isRowSelected = React.useCallback(id => gridSelectionStateSelector(apiRef.current.state).includes(id), [apiRef]);\n const getSelectedRows = React.useCallback(() => selectedGridRowsSelector(apiRef), [apiRef]);\n const selectRow = React.useCallback((id, isSelected = true, resetSelection = false) => {\n if (isRowSelectable && !isRowSelectable(apiRef.current.getRowParams(id))) {\n return;\n }\n\n lastRowToggled.current = id;\n\n if (resetSelection) {\n logger.debug(`Setting selection for row ${id}`);\n apiRef.current.setSelectionModel(isSelected ? [id] : []);\n } else {\n logger.debug(`Toggling selection for row ${id}`);\n const selection = gridSelectionStateSelector(apiRef.current.state);\n const newSelection = selection.filter(el => el !== id);\n\n if (isSelected) {\n newSelection.push(id);\n }\n\n const isSelectionValid = newSelection.length < 2 || canHaveMultipleSelection;\n\n if (isSelectionValid) {\n apiRef.current.setSelectionModel(newSelection);\n }\n }\n }, [apiRef, isRowSelectable, logger, canHaveMultipleSelection]);\n const selectRows = React.useCallback((ids, isSelected = true, resetSelection = false) => {\n logger.debug(`Setting selection for several rows`);\n const selectableIds = isRowSelectable ? ids.filter(id => isRowSelectable(apiRef.current.getRowParams(id))) : ids;\n let newSelection;\n\n if (resetSelection) {\n newSelection = isSelected ? selectableIds : [];\n } else {\n // We clone the existing object to avoid mutating the same object returned by the selector to others part of the project\n const selectionLookup = _extends({}, selectedIdsLookupSelector(apiRef));\n\n selectableIds.forEach(id => {\n if (isSelected) {\n selectionLookup[id] = id;\n } else {\n delete selectionLookup[id];\n }\n });\n newSelection = Object.values(selectionLookup);\n }\n\n const isSelectionValid = newSelection.length < 2 || canHaveMultipleSelection;\n\n if (isSelectionValid) {\n apiRef.current.setSelectionModel(newSelection);\n }\n }, [apiRef, isRowSelectable, logger, canHaveMultipleSelection]);\n const selectRowRange = React.useCallback(({\n startId,\n endId\n }, isSelected = true, resetSelection) => {\n if (!apiRef.current.getRow(startId) || !apiRef.current.getRow(endId)) {\n return;\n }\n\n logger.debug(`Expanding selection from row ${startId} to row ${endId}`); // Using rows from all pages allow to select a range across several pages\n\n const allPagesRowIds = gridVisibleSortedRowIdsSelector(apiRef);\n const startIndex = allPagesRowIds.indexOf(startId);\n const endIndex = allPagesRowIds.indexOf(endId);\n const [start, end] = startIndex > endIndex ? [endIndex, startIndex] : [startIndex, endIndex];\n const rowsBetweenStartAndEnd = allPagesRowIds.slice(start, end + 1);\n apiRef.current.selectRows(rowsBetweenStartAndEnd, isSelected, resetSelection);\n }, [apiRef, logger]);\n const selectionApi = {\n selectRow,\n selectRows,\n selectRowRange,\n setSelectionModel,\n getSelectedRows,\n isRowSelected\n };\n useGridApiMethod(apiRef, selectionApi, 'GridSelectionApi');\n /**\n * EVENTS\n */\n\n const removeOutdatedSelection = React.useCallback(() => {\n if (props.keepNonExistentRowsSelected) {\n return;\n }\n\n const currentSelection = gridSelectionStateSelector(apiRef.current.state);\n const rowsLookup = gridRowsLookupSelector(apiRef); // We clone the existing object to avoid mutating the same object returned by the selector to others part of the project\n\n const selectionLookup = _extends({}, selectedIdsLookupSelector(apiRef));\n\n let hasChanged = false;\n currentSelection.forEach(id => {\n if (!rowsLookup[id]) {\n delete selectionLookup[id];\n hasChanged = true;\n }\n });\n\n if (hasChanged) {\n apiRef.current.setSelectionModel(Object.values(selectionLookup));\n }\n }, [apiRef, props.keepNonExistentRowsSelected]);\n const handleSingleRowSelection = React.useCallback((id, event) => {\n const hasCtrlKey = event.metaKey || event.ctrlKey; // multiple selection is only allowed if:\n // - it is a checkboxSelection\n // - it is a keyboard selection\n // - Ctrl is pressed\n\n const isMultipleSelectionDisabled = !checkboxSelection && !hasCtrlKey && !isKeyboardEvent(event);\n const resetSelection = !canHaveMultipleSelection || isMultipleSelectionDisabled;\n const isSelected = apiRef.current.isRowSelected(id);\n\n if (resetSelection) {\n apiRef.current.selectRow(id, !isMultipleSelectionDisabled ? !isSelected : true, true);\n } else {\n apiRef.current.selectRow(id, !isSelected, false);\n }\n }, [apiRef, canHaveMultipleSelection, checkboxSelection]);\n const handleCellClick = React.useCallback((params, event) => {\n if (disableSelectionOnClick) {\n return;\n }\n\n if (params.field === GRID_CHECKBOX_SELECTION_COL_DEF.field) {\n // click on checkbox should not trigger row selection\n return;\n }\n\n if (params.field === GRID_DETAIL_PANEL_TOGGLE_FIELD) {\n // click to open the detail panel should not select the row\n return;\n }\n\n if (params.field) {\n const column = apiRef.current.getColumn(params.field);\n\n if (column.type === GRID_ACTIONS_COLUMN_TYPE) {\n return;\n }\n }\n\n if (event.shiftKey && (canHaveMultipleSelection || checkboxSelection)) {\n expandMouseRowRangeSelection(params.id);\n } else {\n handleSingleRowSelection(params.id, event);\n }\n }, [disableSelectionOnClick, canHaveMultipleSelection, checkboxSelection, apiRef, expandMouseRowRangeSelection, handleSingleRowSelection]);\n const preventSelectionOnShift = React.useCallback((params, event) => {\n if (canHaveMultipleSelection && event.shiftKey) {\n var _window$getSelection;\n\n (_window$getSelection = window.getSelection()) == null ? void 0 : _window$getSelection.removeAllRanges();\n }\n }, [canHaveMultipleSelection]);\n const handleRowSelectionCheckboxChange = React.useCallback((params, event) => {\n if (event.nativeEvent.shiftKey) {\n expandMouseRowRangeSelection(params.id);\n } else {\n apiRef.current.selectRow(params.id, params.value);\n }\n }, [apiRef, expandMouseRowRangeSelection]);\n const handleHeaderSelectionCheckboxChange = React.useCallback(params => {\n const shouldLimitSelectionToCurrentPage = props.checkboxSelectionVisibleOnly && props.pagination;\n const rowsToBeSelected = shouldLimitSelectionToCurrentPage ? gridPaginatedVisibleSortedGridRowIdsSelector(apiRef) : gridVisibleSortedRowIdsSelector(apiRef);\n apiRef.current.selectRows(rowsToBeSelected, params.value);\n }, [apiRef, props.checkboxSelectionVisibleOnly, props.pagination]);\n const handleCellKeyDown = React.useCallback((params, event) => {\n // Get the most recent cell mode because it may have been changed by another listener\n if (apiRef.current.getCellMode(params.id, params.field) === GridCellModes.Edit) {\n return;\n } // Ignore portal\n // Do not apply shortcuts if the focus is not on the cell root component\n\n\n if (!event.currentTarget.contains(event.target)) {\n return;\n }\n\n if (isNavigationKey(event.key) && event.shiftKey) {\n // The cell that has focus after the keyboard navigation\n const focusCell = gridFocusCellSelector(apiRef);\n\n if (focusCell && focusCell.id !== params.id) {\n event.preventDefault();\n const isNextRowSelected = apiRef.current.isRowSelected(focusCell.id);\n\n if (!canHaveMultipleSelection) {\n apiRef.current.selectRow(focusCell.id, !isNextRowSelected, true);\n return;\n }\n\n const newRowIndex = apiRef.current.getRowIndexRelativeToVisibleRows(focusCell.id);\n const previousRowIndex = apiRef.current.getRowIndexRelativeToVisibleRows(params.id);\n let start;\n let end;\n\n if (newRowIndex > previousRowIndex) {\n if (isNextRowSelected) {\n // We are navigating to the bottom of the page and adding selected rows\n start = previousRowIndex;\n end = newRowIndex - 1;\n } else {\n // We are navigating to the bottom of the page and removing selected rows\n start = previousRowIndex;\n end = newRowIndex;\n }\n } else {\n // eslint-disable-next-line no-lonely-if\n if (isNextRowSelected) {\n // We are navigating to the top of the page and removing selected rows\n start = newRowIndex + 1;\n end = previousRowIndex;\n } else {\n // We are navigating to the top of the page and adding selected rows\n start = newRowIndex;\n end = previousRowIndex;\n }\n }\n\n const rowsBetweenStartAndEnd = visibleRows.rows.slice(start, end + 1).map(row => row.id);\n apiRef.current.selectRows(rowsBetweenStartAndEnd, !isNextRowSelected);\n return;\n }\n }\n\n if (event.key === ' ' && event.shiftKey) {\n event.preventDefault();\n handleSingleRowSelection(params.id, event);\n return;\n }\n\n if (event.key.toLowerCase() === 'a' && (event.ctrlKey || event.metaKey)) {\n event.preventDefault();\n selectRows(apiRef.current.getAllRowIds(), true);\n }\n }, [apiRef, handleSingleRowSelection, selectRows, visibleRows.rows, canHaveMultipleSelection]);\n useGridApiEventHandler(apiRef, 'sortedRowsSet', removeOutdatedSelection);\n useGridApiEventHandler(apiRef, 'cellClick', handleCellClick);\n useGridApiEventHandler(apiRef, 'rowSelectionCheckboxChange', handleRowSelectionCheckboxChange);\n useGridApiEventHandler(apiRef, 'headerSelectionCheckboxChange', handleHeaderSelectionCheckboxChange);\n useGridApiEventHandler(apiRef, 'cellMouseDown', preventSelectionOnShift);\n useGridApiEventHandler(apiRef, 'cellKeyDown', handleCellKeyDown);\n /**\n * EFFECTS\n */\n\n React.useEffect(() => {\n if (propSelectionModel !== undefined) {\n apiRef.current.setSelectionModel(propSelectionModel);\n }\n }, [apiRef, propSelectionModel]);\n const isStateControlled = propSelectionModel != null;\n React.useEffect(() => {\n if (isStateControlled) {\n return;\n } // isRowSelectable changed\n\n\n const currentSelection = gridSelectionStateSelector(apiRef.current.state);\n\n if (isRowSelectable) {\n const newSelection = currentSelection.filter(id => isRowSelectable(apiRef.current.getRowParams(id)));\n\n if (newSelection.length < currentSelection.length) {\n apiRef.current.setSelectionModel(newSelection);\n }\n }\n }, [apiRef, isRowSelectable, isStateControlled]);\n React.useEffect(() => {\n const currentSelection = gridSelectionStateSelector(apiRef.current.state);\n\n if (!canHaveMultipleSelection && currentSelection.length > 1) {\n const {\n rows: currentPageRows\n } = getVisibleRows(apiRef, {\n pagination,\n paginationMode\n });\n const currentPageRowsLookup = currentPageRows.reduce((acc, {\n id\n }) => {\n acc[id] = true;\n return acc;\n }, {});\n const firstSelectableRow = currentSelection.find(id => {\n let isSelectable = true;\n\n if (isRowSelectable) {\n isSelectable = isRowSelectable(apiRef.current.getRowParams(id));\n }\n\n return isSelectable && currentPageRowsLookup[id]; // Check if the row is in the current page\n });\n apiRef.current.setSelectionModel(firstSelectableRow !== undefined ? [firstSelectableRow] : []);\n }\n }, [apiRef, canHaveMultipleSelection, checkboxSelection, disableMultipleSelection, isRowSelectable, pagination, paginationMode]);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { useGridRegisterPipeProcessor } from '../../core/pipeProcessing';\nimport { getDataGridUtilityClass } from '../../../constants';\nimport { GRID_CHECKBOX_SELECTION_COL_DEF, GRID_CHECKBOX_SELECTION_FIELD } from '../../../colDef';\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n return React.useMemo(() => {\n const slots = {\n cellCheckbox: ['cellCheckbox'],\n columnHeaderCheckbox: ['columnHeaderCheckbox']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n }, [classes]);\n};\n\nexport const useGridSelectionPreProcessors = (apiRef, props) => {\n const ownerState = {\n classes: props.classes\n };\n const classes = useUtilityClasses(ownerState);\n const updateSelectionColumn = React.useCallback(columnsState => {\n const selectionColumn = _extends({}, GRID_CHECKBOX_SELECTION_COL_DEF, {\n cellClassName: classes.cellCheckbox,\n headerClassName: classes.columnHeaderCheckbox,\n headerName: apiRef.current.getLocaleText('checkboxSelectionHeaderName')\n });\n\n const shouldHaveSelectionColumn = props.checkboxSelection;\n const haveSelectionColumn = columnsState.lookup[GRID_CHECKBOX_SELECTION_FIELD] != null;\n\n if (shouldHaveSelectionColumn && !haveSelectionColumn) {\n columnsState.lookup[GRID_CHECKBOX_SELECTION_FIELD] = selectionColumn;\n columnsState.all = [GRID_CHECKBOX_SELECTION_FIELD, ...columnsState.all];\n } else if (!shouldHaveSelectionColumn && haveSelectionColumn) {\n delete columnsState.lookup[GRID_CHECKBOX_SELECTION_FIELD];\n columnsState.all = columnsState.all.filter(field => field !== GRID_CHECKBOX_SELECTION_FIELD);\n } else if (shouldHaveSelectionColumn && haveSelectionColumn) {\n columnsState.lookup[GRID_CHECKBOX_SELECTION_FIELD] = _extends({}, selectionColumn, columnsState.lookup[GRID_CHECKBOX_SELECTION_FIELD]);\n }\n\n return columnsState;\n }, [apiRef, classes, props.checkboxSelection]);\n useGridRegisterPipeProcessor(apiRef, 'hydrateColumns', updateSelectionColumn);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { GridFeatureModeConstant } from '../../../models/gridFeatureMode';\nimport { isEnterKey } from '../../../utils/keyboardUtils';\nimport { useGridApiEventHandler } from '../../utils/useGridApiEventHandler';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { useGridLogger } from '../../utils/useGridLogger';\nimport { gridColumnLookupSelector } from '../columns/gridColumnsSelector';\nimport { gridSortedRowEntriesSelector, gridSortedRowIdsSelector, gridSortModelSelector } from './gridSortingSelector';\nimport { gridRowIdsSelector, gridRowTreeSelector } from '../rows';\nimport { useFirstRender } from '../../utils/useFirstRender';\nimport { useGridRegisterStrategyProcessor, GRID_DEFAULT_STRATEGY } from '../../core/strategyProcessing';\nimport { buildAggregatedSortingApplier, mergeStateWithSortModel, getNextGridSortDirection, sanitizeSortModel } from './gridSortingUtils';\nimport { useGridRegisterPipeProcessor } from '../../core/pipeProcessing';\nexport const sortingStateInitializer = (state, props) => {\n var _ref, _props$sortModel, _props$initialState, _props$initialState$s;\n\n const sortModel = (_ref = (_props$sortModel = props.sortModel) != null ? _props$sortModel : (_props$initialState = props.initialState) == null ? void 0 : (_props$initialState$s = _props$initialState.sorting) == null ? void 0 : _props$initialState$s.sortModel) != null ? _ref : [];\n return _extends({}, state, {\n sorting: {\n sortModel: sanitizeSortModel(sortModel, props.disableMultipleColumnsSorting),\n sortedRows: []\n }\n });\n};\n/**\n * @requires useGridRows (event)\n * @requires useGridColumns (event)\n */\n\nexport const useGridSorting = (apiRef, props) => {\n const logger = useGridLogger(apiRef, 'useGridSorting');\n apiRef.current.unstable_registerControlState({\n stateId: 'sortModel',\n propModel: props.sortModel,\n propOnChange: props.onSortModelChange,\n stateSelector: gridSortModelSelector,\n changeEvent: 'sortModelChange'\n });\n const upsertSortModel = React.useCallback((field, sortItem) => {\n const sortModel = gridSortModelSelector(apiRef);\n const existingIdx = sortModel.findIndex(c => c.field === field);\n let newSortModel = [...sortModel];\n\n if (existingIdx > -1) {\n if (!sortItem) {\n newSortModel.splice(existingIdx, 1);\n } else {\n newSortModel.splice(existingIdx, 1, sortItem);\n }\n } else {\n newSortModel = [...sortModel, sortItem];\n }\n\n return newSortModel;\n }, [apiRef]);\n const createSortItem = React.useCallback((col, directionOverride) => {\n var _col$sortingOrder2;\n\n const sortModel = gridSortModelSelector(apiRef);\n const existing = sortModel.find(c => c.field === col.field);\n\n if (existing) {\n var _col$sortingOrder;\n\n const nextSort = directionOverride === undefined ? getNextGridSortDirection((_col$sortingOrder = col.sortingOrder) != null ? _col$sortingOrder : props.sortingOrder, existing.sort) : directionOverride;\n return nextSort == null ? undefined : _extends({}, existing, {\n sort: nextSort\n });\n }\n\n return {\n field: col.field,\n sort: directionOverride === undefined ? getNextGridSortDirection((_col$sortingOrder2 = col.sortingOrder) != null ? _col$sortingOrder2 : props.sortingOrder) : directionOverride\n };\n }, [apiRef, props.sortingOrder]);\n /**\n * API METHODS\n */\n\n const applySorting = React.useCallback(() => {\n apiRef.current.setState(state => {\n if (props.sortingMode === GridFeatureModeConstant.server) {\n logger.debug('Skipping sorting rows as sortingMode = server');\n return _extends({}, state, {\n sorting: _extends({}, state.sorting, {\n sortedRows: gridRowIdsSelector(state, apiRef.current.instanceId)\n })\n });\n }\n\n const sortModel = gridSortModelSelector(state, apiRef.current.instanceId);\n const sortRowList = buildAggregatedSortingApplier(sortModel, apiRef);\n const sortedRows = apiRef.current.unstable_applyStrategyProcessor('sorting', {\n sortRowList\n });\n return _extends({}, state, {\n sorting: _extends({}, state.sorting, {\n sortedRows\n })\n });\n });\n apiRef.current.publishEvent('sortedRowsSet');\n apiRef.current.forceUpdate();\n }, [apiRef, logger, props.sortingMode]);\n const setSortModel = React.useCallback(model => {\n const currentModel = gridSortModelSelector(apiRef);\n\n if (currentModel !== model) {\n logger.debug(`Setting sort model`);\n apiRef.current.setState(mergeStateWithSortModel(model, props.disableMultipleColumnsSorting));\n apiRef.current.forceUpdate();\n apiRef.current.applySorting();\n }\n }, [apiRef, logger, props.disableMultipleColumnsSorting]);\n const sortColumn = React.useCallback((column, direction, allowMultipleSorting) => {\n if (!column.sortable) {\n return;\n }\n\n const sortItem = createSortItem(column, direction);\n let sortModel;\n\n if (!allowMultipleSorting || props.disableMultipleColumnsSorting) {\n sortModel = !sortItem ? [] : [sortItem];\n } else {\n sortModel = upsertSortModel(column.field, sortItem);\n }\n\n apiRef.current.setSortModel(sortModel);\n }, [apiRef, upsertSortModel, createSortItem, props.disableMultipleColumnsSorting]);\n const getSortModel = React.useCallback(() => gridSortModelSelector(apiRef), [apiRef]);\n const getSortedRows = React.useCallback(() => {\n const sortedRows = gridSortedRowEntriesSelector(apiRef);\n return sortedRows.map(row => row.model);\n }, [apiRef]);\n const getSortedRowIds = React.useCallback(() => gridSortedRowIdsSelector(apiRef), [apiRef]);\n const getRowIndex = React.useCallback(id => apiRef.current.getSortedRowIds().indexOf(id), [apiRef]);\n const getRowIdFromRowIndex = React.useCallback(index => apiRef.current.getSortedRowIds()[index], [apiRef]);\n const sortApi = {\n getSortModel,\n getSortedRows,\n getSortedRowIds,\n getRowIndex,\n getRowIdFromRowIndex,\n setSortModel,\n sortColumn,\n applySorting\n };\n useGridApiMethod(apiRef, sortApi, 'GridSortApi');\n /**\n * PRE-PROCESSING\n */\n\n const stateExportPreProcessing = React.useCallback(prevState => {\n const sortModelToExport = gridSortModelSelector(apiRef);\n\n if (sortModelToExport.length === 0) {\n return prevState;\n }\n\n return _extends({}, prevState, {\n sorting: {\n sortModel: sortModelToExport\n }\n });\n }, [apiRef]);\n const stateRestorePreProcessing = React.useCallback((params, context) => {\n var _context$stateToResto;\n\n const sortModel = (_context$stateToResto = context.stateToRestore.sorting) == null ? void 0 : _context$stateToResto.sortModel;\n\n if (sortModel == null) {\n return params;\n }\n\n apiRef.current.setState(mergeStateWithSortModel(sortModel, props.disableMultipleColumnsSorting));\n return _extends({}, params, {\n callbacks: [...params.callbacks, apiRef.current.applySorting]\n });\n }, [apiRef, props.disableMultipleColumnsSorting]);\n const flatSortingMethod = React.useCallback(params => {\n if (!params.sortRowList) {\n return gridRowIdsSelector(apiRef);\n }\n\n const rowTree = gridRowTreeSelector(apiRef);\n return params.sortRowList(Object.values(rowTree));\n }, [apiRef]);\n useGridRegisterPipeProcessor(apiRef, 'exportState', stateExportPreProcessing);\n useGridRegisterPipeProcessor(apiRef, 'restoreState', stateRestorePreProcessing);\n useGridRegisterStrategyProcessor(apiRef, GRID_DEFAULT_STRATEGY, 'sorting', flatSortingMethod);\n /**\n * EVENTS\n */\n\n const handleColumnHeaderClick = React.useCallback(({\n colDef\n }, event) => {\n const allowMultipleSorting = event.shiftKey || event.metaKey || event.ctrlKey;\n sortColumn(colDef, undefined, allowMultipleSorting);\n }, [sortColumn]);\n const handleColumnHeaderKeyDown = React.useCallback(({\n colDef\n }, event) => {\n // Ctrl + Enter opens the column menu\n if (isEnterKey(event.key) && !event.ctrlKey && !event.metaKey) {\n sortColumn(colDef, undefined, event.shiftKey);\n }\n }, [sortColumn]);\n const handleColumnsChange = React.useCallback(() => {\n // When the columns change we check that the sorted columns are still part of the dataset\n const sortModel = gridSortModelSelector(apiRef);\n const latestColumns = gridColumnLookupSelector(apiRef);\n\n if (sortModel.length > 0) {\n const newModel = sortModel.filter(sortItem => latestColumns[sortItem.field]);\n\n if (newModel.length < sortModel.length) {\n apiRef.current.setSortModel(newModel);\n }\n }\n }, [apiRef]);\n const handleStrategyProcessorChange = React.useCallback(methodName => {\n if (methodName === 'sorting') {\n apiRef.current.applySorting();\n }\n }, [apiRef]);\n useGridApiEventHandler(apiRef, 'columnHeaderClick', handleColumnHeaderClick);\n useGridApiEventHandler(apiRef, 'columnHeaderKeyDown', handleColumnHeaderKeyDown);\n useGridApiEventHandler(apiRef, 'rowsSet', apiRef.current.applySorting);\n useGridApiEventHandler(apiRef, 'columnsChange', handleColumnsChange);\n useGridApiEventHandler(apiRef, 'activeStrategyProcessorChange', handleStrategyProcessorChange);\n /**\n * 1ST RENDER\n */\n\n useFirstRender(() => {\n apiRef.current.applySorting();\n });\n /**\n * EFFECTS\n */\n\n React.useEffect(() => {\n if (props.sortModel !== undefined) {\n apiRef.current.setSortModel(props.sortModel);\n }\n }, [apiRef, props.sortModel]);\n};","import * as React from 'react';\nimport { useGridLogger } from '../../utils/useGridLogger';\nimport { gridColumnPositionsSelector, gridVisibleColumnDefinitionsSelector } from '../columns/gridColumnsSelector';\nimport { useGridSelector } from '../../utils/useGridSelector';\nimport { gridPageSelector, gridPageSizeSelector } from '../pagination/gridPaginationSelector';\nimport { gridRowCountSelector } from '../rows/gridRowsSelector';\nimport { gridRowsMetaSelector } from '../rows/gridRowsMetaSelector';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { gridVisibleSortedRowEntriesSelector } from '../filter/gridFilterSelector'; // Logic copied from https://www.w3.org/TR/wai-aria-practices/examples/listbox/js/listbox.js\n// Similar to https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView\n\nfunction scrollIntoView(dimensions) {\n const {\n clientHeight,\n scrollTop,\n offsetHeight,\n offsetTop\n } = dimensions;\n const elementBottom = offsetTop + offsetHeight; // Always scroll to top when cell is higher than viewport to avoid scroll jump\n // See https://github.com/mui/mui-x/issues/4513 and https://github.com/mui/mui-x/issues/4514\n\n if (offsetHeight > clientHeight) {\n return offsetTop;\n }\n\n if (elementBottom - clientHeight > scrollTop) {\n return elementBottom - clientHeight;\n }\n\n if (offsetTop < scrollTop) {\n return offsetTop;\n }\n\n return undefined;\n}\n/**\n * @requires useGridPagination (state) - can be after, async only\n * @requires useGridColumns (state) - can be after, async only\n * @requires useGridRows (state) - can be after, async only\n * @requires useGridRowsMeta (state) - can be after, async only\n * @requires useGridFilter (state)\n * @requires useGridColumnSpanning (method)\n */\n\n\nexport const useGridScroll = (apiRef, props) => {\n const logger = useGridLogger(apiRef, 'useGridScroll');\n const colRef = apiRef.current.columnHeadersElementRef;\n const windowRef = apiRef.current.windowRef;\n const visibleSortedRows = useGridSelector(apiRef, gridVisibleSortedRowEntriesSelector);\n const scrollToIndexes = React.useCallback(params => {\n const totalRowCount = gridRowCountSelector(apiRef);\n const visibleColumns = gridVisibleColumnDefinitionsSelector(apiRef);\n const scrollToHeader = params.rowIndex == null;\n\n if (!scrollToHeader && totalRowCount === 0 || visibleColumns.length === 0) {\n return false;\n }\n\n logger.debug(`Scrolling to cell at row ${params.rowIndex}, col: ${params.colIndex} `);\n let scrollCoordinates = {};\n\n if (params.colIndex != null) {\n const columnPositions = gridColumnPositionsSelector(apiRef);\n let cellWidth;\n\n if (typeof params.rowIndex !== 'undefined') {\n var _visibleSortedRows$pa;\n\n const rowId = (_visibleSortedRows$pa = visibleSortedRows[params.rowIndex]) == null ? void 0 : _visibleSortedRows$pa.id;\n const cellColSpanInfo = apiRef.current.unstable_getCellColSpanInfo(rowId, params.colIndex);\n\n if (cellColSpanInfo && !cellColSpanInfo.spannedByColSpan) {\n cellWidth = cellColSpanInfo.cellProps.width;\n }\n }\n\n if (typeof cellWidth === 'undefined') {\n cellWidth = visibleColumns[params.colIndex].computedWidth;\n }\n\n scrollCoordinates.left = scrollIntoView({\n clientHeight: windowRef.current.clientWidth,\n scrollTop: windowRef.current.scrollLeft,\n offsetHeight: cellWidth,\n offsetTop: columnPositions[params.colIndex]\n });\n }\n\n if (params.rowIndex != null) {\n const rowsMeta = gridRowsMetaSelector(apiRef.current.state);\n const page = gridPageSelector(apiRef);\n const pageSize = gridPageSizeSelector(apiRef);\n const elementIndex = !props.pagination ? params.rowIndex : params.rowIndex - page * pageSize;\n const targetOffsetHeight = rowsMeta.positions[elementIndex + 1] ? rowsMeta.positions[elementIndex + 1] - rowsMeta.positions[elementIndex] : rowsMeta.currentPageTotalHeight - rowsMeta.positions[elementIndex];\n scrollCoordinates.top = scrollIntoView({\n clientHeight: windowRef.current.clientHeight,\n scrollTop: windowRef.current.scrollTop,\n offsetHeight: targetOffsetHeight,\n offsetTop: rowsMeta.positions[elementIndex]\n });\n }\n\n scrollCoordinates = apiRef.current.unstable_applyPipeProcessors('scrollToIndexes', scrollCoordinates, params);\n\n if (typeof scrollCoordinates.left !== undefined || typeof scrollCoordinates.top !== undefined) {\n apiRef.current.scroll(scrollCoordinates);\n return true;\n }\n\n return false;\n }, [logger, apiRef, windowRef, props.pagination, visibleSortedRows]);\n const scroll = React.useCallback(params => {\n if (windowRef.current && params.left != null && colRef.current) {\n colRef.current.scrollLeft = params.left;\n windowRef.current.scrollLeft = params.left;\n logger.debug(`Scrolling left: ${params.left}`);\n }\n\n if (windowRef.current && params.top != null) {\n windowRef.current.scrollTop = params.top;\n logger.debug(`Scrolling top: ${params.top}`);\n }\n\n logger.debug(`Scrolling, updating container, and viewport`);\n }, [windowRef, colRef, logger]);\n const getScrollPosition = React.useCallback(() => {\n if (!(windowRef != null && windowRef.current)) {\n return {\n top: 0,\n left: 0\n };\n }\n\n return {\n top: windowRef.current.scrollTop,\n left: windowRef.current.scrollLeft\n };\n }, [windowRef]);\n const scrollApi = {\n scroll,\n scrollToIndexes,\n getScrollPosition\n };\n useGridApiMethod(apiRef, scrollApi, 'GridScrollApi');\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { debounce } from '@mui/material/utils';\nimport { useGridVisibleRows } from '../../utils/useGridVisibleRows';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { useGridSelector } from '../../utils/useGridSelector';\nimport { gridDensityRowHeightSelector, gridDensityFactorSelector } from '../density/densitySelector';\nimport { gridFilterStateSelector } from '../filter/gridFilterSelector';\nimport { gridPaginationSelector } from '../pagination/gridPaginationSelector';\nimport { gridSortingStateSelector } from '../sorting/gridSortingSelector';\nimport { useGridRegisterPipeApplier } from '../../core/pipeProcessing';\nexport const rowsMetaStateInitializer = state => _extends({}, state, {\n rowsMeta: {\n currentPageTotalHeight: 0,\n positions: []\n }\n});\n/**\n * @requires useGridPageSize (method)\n * @requires useGridPage (method)\n */\n\nexport const useGridRowsMeta = (apiRef, props) => {\n const {\n getRowHeight: getRowHeightProp,\n getRowSpacing,\n getEstimatedRowHeight\n } = props;\n const rowsHeightLookup = React.useRef({}); // Inspired by https://github.com/bvaughn/react-virtualized/blob/master/source/Grid/utils/CellSizeAndPositionManager.js\n\n const lastMeasuredRowIndex = React.useRef(-1);\n const hasRowWithAutoHeight = React.useRef(false);\n const rowHeightFromDensity = useGridSelector(apiRef, gridDensityRowHeightSelector);\n const filterState = useGridSelector(apiRef, gridFilterStateSelector);\n const paginationState = useGridSelector(apiRef, gridPaginationSelector);\n const sortingState = useGridSelector(apiRef, gridSortingStateSelector);\n const currentPage = useGridVisibleRows(apiRef, props);\n const hydrateRowsMeta = React.useCallback(() => {\n hasRowWithAutoHeight.current = false;\n const densityFactor = gridDensityFactorSelector(apiRef.current.state, apiRef.current.instanceId);\n const positions = [];\n const currentPageTotalHeight = currentPage.rows.reduce((acc, row) => {\n positions.push(acc);\n\n if (!rowsHeightLookup.current[row.id]) {\n rowsHeightLookup.current[row.id] = {\n sizes: {\n base: rowHeightFromDensity\n },\n isResized: false,\n autoHeight: false,\n needsFirstMeasurement: true // Assume all rows will need to be measured by default\n\n };\n }\n\n const {\n isResized,\n needsFirstMeasurement,\n sizes\n } = rowsHeightLookup.current[row.id];\n let baseRowHeight = rowHeightFromDensity;\n const existingBaseRowHeight = sizes.base;\n\n if (isResized) {\n // Do not recalculate resized row height and use the value from the lookup\n baseRowHeight = existingBaseRowHeight;\n } else if (getRowHeightProp) {\n const rowHeightFromUser = getRowHeightProp(_extends({}, row, {\n densityFactor\n }));\n\n if (rowHeightFromUser === 'auto') {\n if (needsFirstMeasurement) {\n const estimatedRowHeight = getEstimatedRowHeight ? getEstimatedRowHeight(_extends({}, row, {\n densityFactor\n })) : rowHeightFromDensity; // If the row was not measured yet use the estimated row height\n\n baseRowHeight = estimatedRowHeight != null ? estimatedRowHeight : rowHeightFromDensity;\n } else {\n baseRowHeight = existingBaseRowHeight;\n }\n\n hasRowWithAutoHeight.current = true;\n rowsHeightLookup.current[row.id].autoHeight = true;\n } else {\n // Default back to base rowHeight if getRowHeight returns null or undefined.\n baseRowHeight = rowHeightFromUser != null ? rowHeightFromUser : rowHeightFromDensity;\n rowsHeightLookup.current[row.id].needsFirstMeasurement = false;\n rowsHeightLookup.current[row.id].autoHeight = false;\n }\n } else {\n rowsHeightLookup.current[row.id].needsFirstMeasurement = false;\n } // We use an object to make simple to check if a height is already added or not\n\n\n const initialHeights = {\n base: baseRowHeight\n };\n\n if (getRowSpacing) {\n var _spacing$top, _spacing$bottom;\n\n const indexRelativeToCurrentPage = apiRef.current.getRowIndexRelativeToVisibleRows(row.id);\n const spacing = getRowSpacing(_extends({}, row, {\n isFirstVisible: indexRelativeToCurrentPage === 0,\n isLastVisible: indexRelativeToCurrentPage === currentPage.rows.length - 1,\n indexRelativeToCurrentPage\n }));\n initialHeights.spacingTop = (_spacing$top = spacing.top) != null ? _spacing$top : 0;\n initialHeights.spacingBottom = (_spacing$bottom = spacing.bottom) != null ? _spacing$bottom : 0;\n }\n\n const processedSizes = apiRef.current.unstable_applyPipeProcessors('rowHeight', initialHeights, row);\n rowsHeightLookup.current[row.id].sizes = processedSizes;\n const finalRowHeight = Object.values(processedSizes).reduce((acc2, value) => acc2 + value, 0);\n return acc + finalRowHeight;\n }, 0);\n apiRef.current.setState(state => {\n return _extends({}, state, {\n rowsMeta: {\n currentPageTotalHeight,\n positions\n }\n });\n });\n\n if (!hasRowWithAutoHeight.current) {\n // No row has height=auto, so all rows are already measured\n lastMeasuredRowIndex.current = Infinity;\n }\n\n apiRef.current.forceUpdate();\n }, [apiRef, currentPage.rows, rowHeightFromDensity, getRowHeightProp, getRowSpacing, getEstimatedRowHeight]);\n const getRowHeight = React.useCallback(rowId => {\n const height = rowsHeightLookup.current[rowId];\n return height ? height.sizes.base : rowHeightFromDensity;\n }, [rowHeightFromDensity]);\n\n const getRowInternalSizes = rowId => {\n var _rowsHeightLookup$cur;\n\n return (_rowsHeightLookup$cur = rowsHeightLookup.current[rowId]) == null ? void 0 : _rowsHeightLookup$cur.sizes;\n };\n\n const setRowHeight = React.useCallback((id, height) => {\n rowsHeightLookup.current[id].sizes.base = height;\n rowsHeightLookup.current[id].isResized = true;\n rowsHeightLookup.current[id].needsFirstMeasurement = false;\n hydrateRowsMeta();\n }, [hydrateRowsMeta]);\n const debouncedHydrateRowsMeta = React.useMemo(() => debounce(hydrateRowsMeta), [hydrateRowsMeta]);\n const storeMeasuredRowHeight = React.useCallback((id, height) => {\n if (!rowsHeightLookup.current[id] || !rowsHeightLookup.current[id].autoHeight) {\n return;\n } // Only trigger hydration if the value is different, otherwise we trigger a loop\n\n\n const needsHydration = rowsHeightLookup.current[id].sizes.base !== height;\n rowsHeightLookup.current[id].needsFirstMeasurement = false;\n rowsHeightLookup.current[id].sizes.base = height;\n\n if (needsHydration) {\n debouncedHydrateRowsMeta();\n }\n }, [debouncedHydrateRowsMeta]);\n const rowHasAutoHeight = React.useCallback(id => {\n var _rowsHeightLookup$cur2;\n\n return ((_rowsHeightLookup$cur2 = rowsHeightLookup.current[id]) == null ? void 0 : _rowsHeightLookup$cur2.autoHeight) || false;\n }, []);\n const getLastMeasuredRowIndex = React.useCallback(() => {\n return lastMeasuredRowIndex.current;\n }, []);\n const setLastMeasuredRowIndex = React.useCallback(index => {\n if (hasRowWithAutoHeight.current && index > lastMeasuredRowIndex.current) {\n lastMeasuredRowIndex.current = index;\n }\n }, []); // The effect is used to build the rows meta data - currentPageTotalHeight and positions.\n // Because of variable row height this is needed for the virtualization\n\n React.useEffect(() => {\n hydrateRowsMeta();\n }, [rowHeightFromDensity, filterState, paginationState, sortingState, hydrateRowsMeta]);\n useGridRegisterPipeApplier(apiRef, 'rowHeight', hydrateRowsMeta);\n const rowsMetaApi = {\n unstable_getLastMeasuredRowIndex: getLastMeasuredRowIndex,\n unstable_setLastMeasuredRowIndex: setLastMeasuredRowIndex,\n unstable_rowHasAutoHeight: rowHasAutoHeight,\n unstable_getRowHeight: getRowHeight,\n unstable_getRowInternalSizes: getRowInternalSizes,\n unstable_setRowHeight: setRowHeight,\n unstable_storeRowHeightMeasurement: storeMeasuredRowHeight\n };\n useGridApiMethod(apiRef, rowsMetaApi, 'GridRowsMetaApi');\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"align\", \"children\", \"colIndex\", \"colDef\", \"cellMode\", \"field\", \"formattedValue\", \"hasFocus\", \"height\", \"isEditable\", \"rowId\", \"tabIndex\", \"value\", \"width\", \"className\", \"showRightBorder\", \"extendRowFullWidth\", \"row\", \"colSpan\", \"disableDragEvents\", \"onClick\", \"onDoubleClick\", \"onMouseDown\", \"onMouseUp\", \"onKeyDown\", \"onDragEnter\", \"onDragOver\"];\n\n/* eslint-disable jsx-a11y/no-noninteractive-element-interactions */\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { ownerDocument, capitalize } from '@mui/material/utils';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { GridCellModes } from '../../models';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { gridFocusCellSelector } from '../../hooks/features/focus/gridFocusStateSelector';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n// Based on https://stackoverflow.com/a/59518678\nlet cachedSupportsPreventScroll;\n\nfunction doesSupportPreventScroll() {\n if (cachedSupportsPreventScroll === undefined) {\n document.createElement('div').focus({\n get preventScroll() {\n cachedSupportsPreventScroll = true;\n return false;\n }\n\n });\n }\n\n return cachedSupportsPreventScroll;\n}\n\nconst useUtilityClasses = ownerState => {\n const {\n align,\n showRightBorder,\n isEditable,\n classes\n } = ownerState;\n const slots = {\n root: ['cell', `cell--text${capitalize(align)}`, isEditable && 'cell--editable', showRightBorder && 'withBorder'],\n content: ['cellContent']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nlet warnedOnce = false;\n\nfunction GridCell(props) {\n var _rootProps$experiment;\n\n const {\n align,\n children,\n colIndex,\n cellMode,\n field,\n formattedValue,\n hasFocus,\n height,\n isEditable,\n rowId,\n tabIndex,\n value,\n width,\n className,\n showRightBorder,\n colSpan,\n disableDragEvents,\n onClick,\n onDoubleClick,\n onMouseDown,\n onMouseUp,\n onKeyDown,\n onDragEnter,\n onDragOver\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const valueToRender = formattedValue == null ? value : formattedValue;\n const cellRef = React.useRef(null);\n const focusElementRef = React.useRef(null);\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const ownerState = {\n align,\n showRightBorder,\n isEditable,\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n const publishMouseUp = React.useCallback(eventName => event => {\n const params = apiRef.current.getCellParams(rowId, field || '');\n apiRef.current.publishEvent(eventName, params, event);\n\n if (onMouseUp) {\n onMouseUp(event);\n }\n }, [apiRef, field, onMouseUp, rowId]);\n const publish = React.useCallback((eventName, propHandler) => event => {\n // Ignore portal\n if (!event.currentTarget.contains(event.target)) {\n return;\n } // The row might have been deleted during the click\n\n\n if (!apiRef.current.getRow(rowId)) {\n return;\n }\n\n const params = apiRef.current.getCellParams(rowId, field || '');\n apiRef.current.publishEvent(eventName, params, event);\n\n if (propHandler) {\n propHandler(event);\n }\n }, [apiRef, field, rowId]);\n const style = {\n minWidth: width,\n maxWidth: width,\n minHeight: height,\n maxHeight: height === 'auto' ? 'none' : height // max-height doesn't support \"auto\"\n\n };\n React.useLayoutEffect(() => {\n if (!hasFocus || cellMode === GridCellModes.Edit) {\n return;\n }\n\n const doc = ownerDocument(apiRef.current.rootElementRef.current);\n\n if (cellRef.current && !cellRef.current.contains(doc.activeElement)) {\n const focusableElement = cellRef.current.querySelector('[tabindex=\"0\"]');\n const elementToFocus = focusElementRef.current || focusableElement || cellRef.current;\n\n if (doesSupportPreventScroll()) {\n elementToFocus.focus({\n preventScroll: true\n });\n } else {\n const scrollPosition = apiRef.current.getScrollPosition();\n elementToFocus.focus();\n apiRef.current.scroll(scrollPosition);\n }\n }\n }, [hasFocus, cellMode, apiRef]);\n let handleFocus = other.onFocus;\n\n if (process.env.NODE_ENV === 'test' && (_rootProps$experiment = rootProps.experimentalFeatures) != null && _rootProps$experiment.warnIfFocusStateIsNotSynced) {\n handleFocus = event => {\n const focusedCell = gridFocusCellSelector(apiRef);\n\n if ((focusedCell == null ? void 0 : focusedCell.id) === rowId && focusedCell.field === field) {\n if (typeof other.onFocus === 'function') {\n other.onFocus(event);\n }\n\n return;\n }\n\n if (!warnedOnce) {\n console.warn([`MUI: The cell with id=${rowId} and field=${field} received focus.`, `According to the state, the focus should be at id=${focusedCell == null ? void 0 : focusedCell.id}, field=${focusedCell == null ? void 0 : focusedCell.field}.`, \"Not syncing the state may cause unwanted behaviors since the `cellFocusIn` event won't be fired.\", 'Call `fireEvent.mouseUp` before the `fireEvent.click` to sync the focus with the state.'].join('\\n'));\n warnedOnce = true;\n }\n };\n }\n\n const column = apiRef.current.getColumn(field);\n const managesOwnFocus = column.type === 'actions';\n\n const renderChildren = () => {\n if (children == null) {\n return /*#__PURE__*/_jsx(\"div\", {\n className: classes.content,\n children: valueToRender == null ? void 0 : valueToRender.toString()\n });\n }\n\n if ( /*#__PURE__*/React.isValidElement(children) && managesOwnFocus) {\n return /*#__PURE__*/React.cloneElement(children, {\n focusElementRef\n });\n }\n\n return children;\n };\n\n const draggableEventHandlers = disableDragEvents ? null : {\n onDragEnter: publish('cellDragEnter', onDragEnter),\n onDragOver: publish('cellDragOver', onDragOver)\n };\n return /*#__PURE__*/_jsx(\"div\", _extends({\n ref: cellRef,\n className: clsx(className, classes.root),\n role: \"cell\",\n \"data-field\": field,\n \"data-colindex\": colIndex,\n \"aria-colindex\": colIndex + 1,\n \"aria-colspan\": colSpan,\n style: style,\n tabIndex: (cellMode === 'view' || !isEditable) && !managesOwnFocus ? tabIndex : -1,\n onClick: publish('cellClick', onClick),\n onDoubleClick: publish('cellDoubleClick', onDoubleClick),\n onMouseDown: publish('cellMouseDown', onMouseDown),\n onMouseUp: publishMouseUp('cellMouseUp'),\n onKeyDown: publish('cellKeyDown', onKeyDown)\n }, draggableEventHandlers, other, {\n onFocus: handleFocus,\n children: renderChildren()\n }));\n}\n\nprocess.env.NODE_ENV !== \"production\" ? GridCell.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 align: PropTypes.oneOf(['center', 'left', 'right']).isRequired,\n cellMode: PropTypes.oneOf(['edit', 'view']),\n children: PropTypes.node,\n className: PropTypes.string,\n colIndex: PropTypes.number.isRequired,\n colSpan: PropTypes.number,\n disableDragEvents: PropTypes.bool,\n field: PropTypes.string.isRequired,\n formattedValue: PropTypes.any,\n hasFocus: PropTypes.bool,\n height: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]).isRequired,\n isEditable: PropTypes.bool,\n onClick: PropTypes.func,\n onDoubleClick: PropTypes.func,\n onDragEnter: PropTypes.func,\n onDragOver: PropTypes.func,\n onKeyDown: PropTypes.func,\n onMouseDown: PropTypes.func,\n onMouseUp: PropTypes.func,\n rowId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n showRightBorder: PropTypes.bool,\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired,\n value: PropTypes.any,\n width: PropTypes.number.isRequired\n} : void 0;\nexport { GridCell };","import { useGridInitialization } from '../hooks/core/useGridInitialization';\nimport { useGridInitializeState } from '../hooks/utils/useGridInitializeState';\nimport { useGridClipboard } from '../hooks/features/clipboard/useGridClipboard';\nimport { columnMenuStateInitializer, useGridColumnMenu } from '../hooks/features/columnMenu/useGridColumnMenu';\nimport { useGridColumns, columnsStateInitializer } from '../hooks/features/columns/useGridColumns';\nimport { densityStateInitializer, useGridDensity } from '../hooks/features/density/useGridDensity';\nimport { useGridCsvExport } from '../hooks/features/export/useGridCsvExport';\nimport { useGridPrintExport } from '../hooks/features/export/useGridPrintExport';\nimport { useGridFilter, filterStateInitializer } from '../hooks/features/filter/useGridFilter';\nimport { focusStateInitializer, useGridFocus } from '../hooks/features/focus/useGridFocus';\nimport { useGridKeyboardNavigation } from '../hooks/features/keyboardNavigation/useGridKeyboardNavigation';\nimport { useGridPagination, paginationStateInitializer } from '../hooks/features/pagination/useGridPagination';\nimport { useGridPreferencesPanel, preferencePanelStateInitializer } from '../hooks/features/preferencesPanel/useGridPreferencesPanel';\nimport { useGridEditing as useGridEditing_old, editingStateInitializer as editingStateInitializer_old } from '../hooks/features/editRows/useGridEditing.old';\nimport { useGridEditing as useGridEditing_new, editingStateInitializer as editingStateInitializer_new } from '../hooks/features/editRows/useGridEditing.new';\nimport { useGridRows, rowsStateInitializer } from '../hooks/features/rows/useGridRows';\nimport { useGridRowsPreProcessors } from '../hooks/features/rows/useGridRowsPreProcessors';\nimport { useGridParamsApi } from '../hooks/features/rows/useGridParamsApi';\nimport { selectionStateInitializer, useGridSelection } from '../hooks/features/selection/useGridSelection';\nimport { useGridSelectionPreProcessors } from '../hooks/features/selection/useGridSelectionPreProcessors';\nimport { useGridSorting, sortingStateInitializer } from '../hooks/features/sorting/useGridSorting';\nimport { useGridScroll } from '../hooks/features/scroll/useGridScroll';\nimport { useGridEvents } from '../hooks/features/events/useGridEvents';\nimport { useGridDimensions } from '../hooks/features/dimensions/useGridDimensions';\nimport { rowsMetaStateInitializer, useGridRowsMeta } from '../hooks/features/rows/useGridRowsMeta';\nimport { useGridStatePersistence } from '../hooks/features/statePersistence/useGridStatePersistence';\nimport { useGridColumnSpanning } from '../hooks/features/columns/useGridColumnSpanning';\nexport const useDataGridComponent = props => {\n var _props$experimentalFe, _props$experimentalFe2;\n\n const apiRef = useGridInitialization(undefined, props);\n /**\n * Register all pre-processors called during state initialization here.\n */\n\n useGridSelectionPreProcessors(apiRef, props);\n useGridRowsPreProcessors(apiRef);\n /**\n * Register all state initializers here.\n */\n\n useGridInitializeState(selectionStateInitializer, apiRef, props);\n useGridInitializeState(columnsStateInitializer, apiRef, props);\n useGridInitializeState(rowsStateInitializer, apiRef, props);\n useGridInitializeState((_props$experimentalFe = props.experimentalFeatures) != null && _props$experimentalFe.newEditingApi ? editingStateInitializer_new : editingStateInitializer_old, 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(paginationStateInitializer, apiRef, props);\n useGridInitializeState(rowsMetaStateInitializer, apiRef, props);\n useGridInitializeState(columnMenuStateInitializer, apiRef, props);\n useGridKeyboardNavigation(apiRef, props);\n useGridSelection(apiRef, props);\n useGridColumns(apiRef, props);\n useGridRows(apiRef, props);\n useGridParamsApi(apiRef);\n useGridColumnSpanning(apiRef);\n const useGridEditing = (_props$experimentalFe2 = props.experimentalFeatures) != null && _props$experimentalFe2.newEditingApi ? useGridEditing_new : useGridEditing_old;\n useGridEditing(apiRef, props);\n useGridFocus(apiRef, props);\n useGridPreferencesPanel(apiRef);\n useGridFilter(apiRef, props);\n useGridSorting(apiRef, props);\n useGridDensity(apiRef, props);\n useGridPagination(apiRef, props);\n useGridRowsMeta(apiRef, props);\n useGridScroll(apiRef, props);\n useGridColumnMenu(apiRef);\n useGridCsvExport(apiRef);\n useGridPrintExport(apiRef, props);\n useGridClipboard(apiRef);\n useGridDimensions(apiRef, props);\n useGridEvents(apiRef, props);\n useGridStatePersistence(apiRef);\n return apiRef;\n};","import * as React from 'react';\nimport { gridVisibleColumnDefinitionsSelector } from '../columns/gridColumnsSelector';\nimport { useGridLogger } from '../../utils/useGridLogger';\nimport { useGridApiEventHandler } from '../../utils/useGridApiEventHandler';\nimport { gridVisibleSortedRowEntriesSelector } from '../filter/gridFilterSelector';\nimport { useGridVisibleRows } from '../../utils/useGridVisibleRows';\nimport { GRID_CHECKBOX_SELECTION_COL_DEF } from '../../../colDef/gridCheckboxSelectionColDef';\nimport { gridClasses } from '../../../constants/gridClasses';\nimport { GridCellModes } from '../../../models/gridEditRowModel';\nimport { isNavigationKey } from '../../../utils/keyboardUtils';\nimport { GRID_DETAIL_PANEL_TOGGLE_FIELD } from '../../../constants/gridDetailPanelToggleField';\n/**\n * @requires useGridSorting (method) - can be after\n * @requires useGridFilter (state) - can be after\n * @requires useGridColumns (state, method) - can be after\n * @requires useGridDimensions (method) - can be after\n * @requires useGridFocus (method) - can be after\n * @requires useGridScroll (method) - can be after\n * @requires useGridColumnSpanning (method) - can be after\n */\n\nexport const useGridKeyboardNavigation = (apiRef, props) => {\n const logger = useGridLogger(apiRef, 'useGridKeyboardNavigation');\n const currentPage = useGridVisibleRows(apiRef, props);\n /**\n * @param {number} colIndex Index of the column to focus\n * @param {number} rowIndex index of the row to focus\n * @param {string} closestColumnToUse Which closest column cell to use when the cell is spanned by `colSpan`.\n */\n\n const goToCell = React.useCallback((colIndex, rowIndex, closestColumnToUse = 'left') => {\n var _visibleSortedRows$ro;\n\n const visibleSortedRows = gridVisibleSortedRowEntriesSelector(apiRef);\n const rowId = (_visibleSortedRows$ro = visibleSortedRows[rowIndex]) == null ? void 0 : _visibleSortedRows$ro.id;\n const nextCellColSpanInfo = apiRef.current.unstable_getCellColSpanInfo(rowId, colIndex);\n\n if (nextCellColSpanInfo && nextCellColSpanInfo.spannedByColSpan) {\n if (closestColumnToUse === 'left') {\n colIndex = nextCellColSpanInfo.leftVisibleCellIndex;\n } else if (closestColumnToUse === 'right') {\n colIndex = nextCellColSpanInfo.rightVisibleCellIndex;\n }\n }\n\n logger.debug(`Navigating to cell row ${rowIndex}, col ${colIndex}`);\n apiRef.current.scrollToIndexes({\n colIndex,\n rowIndex\n });\n const field = apiRef.current.getVisibleColumns()[colIndex].field;\n apiRef.current.setCellFocus(rowId, field);\n }, [apiRef, logger]);\n const goToHeader = React.useCallback((colIndex, event) => {\n logger.debug(`Navigating to header col ${colIndex}`);\n apiRef.current.scrollToIndexes({\n colIndex\n });\n const field = apiRef.current.getVisibleColumns()[colIndex].field;\n apiRef.current.setColumnHeaderFocus(field, event);\n }, [apiRef, logger]);\n const handleCellNavigationKeyDown = React.useCallback((params, event) => {\n const dimensions = apiRef.current.getRootDimensions();\n\n if (!currentPage.range || !dimensions) {\n return;\n }\n\n const viewportPageSize = apiRef.current.unstable_getViewportPageSize();\n const visibleSortedRows = gridVisibleSortedRowEntriesSelector(apiRef);\n const colIndexBefore = params.field ? apiRef.current.getColumnIndex(params.field) : 0;\n const rowIndexBefore = visibleSortedRows.findIndex(row => row.id === params.id);\n const firstRowIndexInPage = currentPage.range.firstRowIndex;\n const lastRowIndexInPage = currentPage.range.lastRowIndex;\n const firstColIndex = 0;\n const lastColIndex = gridVisibleColumnDefinitionsSelector(apiRef).length - 1;\n let shouldPreventDefault = true;\n\n switch (event.key) {\n case 'ArrowDown':\n case 'Enter':\n {\n // \"Enter\" is only triggered by the row / cell editing feature\n if (rowIndexBefore < lastRowIndexInPage) {\n goToCell(colIndexBefore, rowIndexBefore + 1);\n }\n\n break;\n }\n\n case 'ArrowUp':\n {\n if (rowIndexBefore > firstRowIndexInPage) {\n goToCell(colIndexBefore, rowIndexBefore - 1);\n } else {\n goToHeader(colIndexBefore, event);\n }\n\n break;\n }\n\n case 'ArrowRight':\n {\n if (colIndexBefore < lastColIndex) {\n goToCell(colIndexBefore + 1, rowIndexBefore, 'right');\n }\n\n break;\n }\n\n case 'ArrowLeft':\n {\n if (colIndexBefore > firstColIndex) {\n goToCell(colIndexBefore - 1, rowIndexBefore);\n }\n\n break;\n }\n\n case 'Tab':\n {\n // \"Tab\" is only triggered by the row / cell editing feature\n if (event.shiftKey && colIndexBefore > firstColIndex) {\n goToCell(colIndexBefore - 1, rowIndexBefore, 'left');\n } else if (!event.shiftKey && colIndexBefore < lastColIndex) {\n goToCell(colIndexBefore + 1, rowIndexBefore, 'right');\n }\n\n break;\n }\n\n case ' ':\n {\n const field = params.field;\n\n if (field === GRID_DETAIL_PANEL_TOGGLE_FIELD) {\n break;\n }\n\n const colDef = params.colDef;\n\n if (colDef && colDef.type === 'treeDataGroup') {\n break;\n }\n\n if (!event.shiftKey && rowIndexBefore < lastRowIndexInPage) {\n goToCell(colIndexBefore, Math.min(rowIndexBefore + viewportPageSize, lastRowIndexInPage));\n }\n\n break;\n }\n\n case 'PageDown':\n {\n if (rowIndexBefore < lastRowIndexInPage) {\n goToCell(colIndexBefore, Math.min(rowIndexBefore + viewportPageSize, lastRowIndexInPage));\n }\n\n break;\n }\n\n case 'PageUp':\n {\n // Go to the first row before going to header\n const nextRowIndex = Math.max(rowIndexBefore - viewportPageSize, firstRowIndexInPage);\n\n if (nextRowIndex !== rowIndexBefore && nextRowIndex >= firstRowIndexInPage) {\n goToCell(colIndexBefore, nextRowIndex);\n } else {\n goToHeader(colIndexBefore, event);\n }\n\n break;\n }\n\n case 'Home':\n {\n if (event.ctrlKey || event.metaKey || event.shiftKey) {\n goToCell(firstColIndex, firstRowIndexInPage);\n } else {\n goToCell(firstColIndex, rowIndexBefore);\n }\n\n break;\n }\n\n case 'End':\n {\n if (event.ctrlKey || event.metaKey || event.shiftKey) {\n goToCell(lastColIndex, lastRowIndexInPage);\n } else {\n goToCell(lastColIndex, rowIndexBefore);\n }\n\n break;\n }\n\n default:\n {\n shouldPreventDefault = false;\n }\n }\n\n if (shouldPreventDefault) {\n event.preventDefault();\n }\n }, [apiRef, currentPage, goToCell, goToHeader]);\n const handleColumnHeaderKeyDown = React.useCallback((params, event) => {\n var _currentPage$range$fi, _currentPage$range, _currentPage$range$la, _currentPage$range2;\n\n const headerTitleNode = event.currentTarget.querySelector(`.${gridClasses.columnHeaderTitleContainerContent}`);\n const isFromInsideContent = !!headerTitleNode && headerTitleNode.contains(event.target);\n\n if (isFromInsideContent && params.field !== GRID_CHECKBOX_SELECTION_COL_DEF.field) {\n // When focus is on a nested input, keyboard events have no effect to avoid conflicts with native events.\n // There is one exception for the checkBoxHeader\n return;\n }\n\n const dimensions = apiRef.current.getRootDimensions();\n\n if (!dimensions) {\n return;\n }\n\n const viewportPageSize = apiRef.current.unstable_getViewportPageSize();\n const colIndexBefore = params.field ? apiRef.current.getColumnIndex(params.field) : 0;\n const firstRowIndexInPage = (_currentPage$range$fi = (_currentPage$range = currentPage.range) == null ? void 0 : _currentPage$range.firstRowIndex) != null ? _currentPage$range$fi : null;\n const lastRowIndexInPage = (_currentPage$range$la = (_currentPage$range2 = currentPage.range) == null ? void 0 : _currentPage$range2.lastRowIndex) != null ? _currentPage$range$la : null;\n const firstColIndex = 0;\n const lastColIndex = gridVisibleColumnDefinitionsSelector(apiRef).length - 1;\n let shouldPreventDefault = true;\n\n switch (event.key) {\n case 'ArrowDown':\n {\n if (firstRowIndexInPage !== null) {\n goToCell(colIndexBefore, firstRowIndexInPage);\n }\n\n break;\n }\n\n case 'ArrowRight':\n {\n if (colIndexBefore < lastColIndex) {\n goToHeader(colIndexBefore + 1, event);\n }\n\n break;\n }\n\n case 'ArrowLeft':\n {\n if (colIndexBefore > firstColIndex) {\n goToHeader(colIndexBefore - 1, event);\n }\n\n break;\n }\n\n case 'PageDown':\n {\n if (firstRowIndexInPage !== null && lastRowIndexInPage !== null) {\n goToCell(colIndexBefore, Math.min(firstRowIndexInPage + viewportPageSize, lastRowIndexInPage));\n }\n\n break;\n }\n\n case 'Home':\n {\n goToHeader(firstColIndex, event);\n break;\n }\n\n case 'End':\n {\n goToHeader(lastColIndex, event);\n break;\n }\n\n case 'Enter':\n {\n if (event.ctrlKey || event.metaKey) {\n apiRef.current.toggleColumnMenu(params.field);\n }\n\n break;\n }\n\n case ' ':\n {\n // prevent Space event from scrolling\n break;\n }\n\n default:\n {\n shouldPreventDefault = false;\n }\n }\n\n if (shouldPreventDefault) {\n event.preventDefault();\n }\n }, [apiRef, currentPage, goToCell, goToHeader]);\n const handleCellKeyDown = React.useCallback((params, event) => {\n // Ignore portal\n if (!event.currentTarget.contains(event.target)) {\n return;\n } // Get the most recent params because the cell mode may have changed by another listener\n\n\n const cellParams = apiRef.current.getCellParams(params.id, params.field);\n\n if (cellParams.cellMode !== GridCellModes.Edit && isNavigationKey(event.key)) {\n apiRef.current.publishEvent('cellNavigationKeyDown', cellParams, event);\n }\n }, [apiRef]);\n useGridApiEventHandler(apiRef, 'cellNavigationKeyDown', handleCellNavigationKeyDown);\n useGridApiEventHandler(apiRef, 'columnHeaderKeyDown', handleColumnHeaderKeyDown);\n useGridApiEventHandler(apiRef, 'cellKeyDown', handleCellKeyDown);\n};","import * as React from 'react';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { useGridApiEventHandler } from '../../utils/useGridApiEventHandler';\n\n/**\n * @requires useGridColumns (method, event)\n * @requires useGridParamsApi (method)\n */\nexport const useGridColumnSpanning = apiRef => {\n const lookup = React.useRef({});\n const setCellColSpanInfo = React.useCallback((rowId, columnIndex, cellColSpanInfo) => {\n const sizes = lookup.current;\n\n if (!sizes[rowId]) {\n sizes[rowId] = {};\n }\n\n sizes[rowId][columnIndex] = cellColSpanInfo;\n }, []);\n const getCellColSpanInfo = React.useCallback((rowId, columnIndex) => {\n var _lookup$current$rowId;\n\n return (_lookup$current$rowId = lookup.current[rowId]) == null ? void 0 : _lookup$current$rowId[columnIndex];\n }, []); // Calculate `colSpan` for the cell.\n\n const calculateCellColSpan = React.useCallback(params => {\n const {\n columnIndex,\n rowId,\n minFirstColumnIndex,\n maxLastColumnIndex\n } = params;\n const visibleColumns = apiRef.current.getVisibleColumns();\n const columnsLength = visibleColumns.length;\n const column = visibleColumns[columnIndex];\n const colSpan = typeof column.colSpan === 'function' ? column.colSpan(apiRef.current.getCellParams(rowId, column.field)) : column.colSpan;\n\n if (!colSpan || colSpan === 1) {\n setCellColSpanInfo(rowId, columnIndex, {\n spannedByColSpan: false,\n cellProps: {\n colSpan: 1,\n width: column.computedWidth\n }\n });\n return {\n colSpan: 1\n };\n }\n\n let width = column.computedWidth;\n\n for (let j = 1; j < colSpan; j += 1) {\n const nextColumnIndex = columnIndex + j; // Cells should be spanned only within their column section (left-pinned, right-pinned and unpinned).\n\n if (nextColumnIndex >= minFirstColumnIndex && nextColumnIndex < maxLastColumnIndex) {\n const nextColumn = visibleColumns[nextColumnIndex];\n width += nextColumn.computedWidth;\n setCellColSpanInfo(rowId, columnIndex + j, {\n spannedByColSpan: true,\n rightVisibleCellIndex: Math.min(columnIndex + colSpan, columnsLength - 1),\n leftVisibleCellIndex: columnIndex\n });\n }\n\n setCellColSpanInfo(rowId, columnIndex, {\n spannedByColSpan: false,\n cellProps: {\n colSpan,\n width\n }\n });\n }\n\n return {\n colSpan\n };\n }, [apiRef, setCellColSpanInfo]); // Calculate `colSpan` for each cell in the row\n\n const calculateColSpan = React.useCallback(({\n rowId,\n minFirstColumn,\n maxLastColumn\n }) => {\n for (let i = minFirstColumn; i < maxLastColumn; i += 1) {\n const cellProps = calculateCellColSpan({\n columnIndex: i,\n rowId,\n minFirstColumnIndex: minFirstColumn,\n maxLastColumnIndex: maxLastColumn\n });\n\n if (cellProps.colSpan > 1) {\n i += cellProps.colSpan - 1;\n }\n }\n }, [calculateCellColSpan]);\n const columnSpanningApi = {\n unstable_getCellColSpanInfo: getCellColSpanInfo,\n unstable_calculateColSpan: calculateColSpan\n };\n useGridApiMethod(apiRef, columnSpanningApi, 'GridColumnSpanningAPI');\n const handleColumnReorderChange = React.useCallback(() => {\n // `colSpan` needs to be recalculated after column reordering\n lookup.current = {};\n }, []);\n useGridApiEventHandler(apiRef, 'columnOrderChange', handleColumnReorderChange);\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { ownerDocument } from '@mui/material/utils';\nimport { useGridLogger } from '../../utils/useGridLogger';\nimport { gridVisibleRowCountSelector } from '../filter/gridFilterSelector';\nimport { gridColumnDefinitionsSelector, gridColumnVisibilityModelSelector } from '../columns/gridColumnsSelector';\nimport { gridDensityHeaderHeightSelector } from '../density/densitySelector';\nimport { gridClasses } from '../../../constants/gridClasses';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { gridRowsMetaSelector } from '../rows/gridRowsMetaSelector';\nimport { getColumnsToExport } from './utils';\nimport { useGridRegisterPipeProcessor } from '../../core/pipeProcessing';\nimport { GridPrintExportMenuItem } from '../../../components/toolbar/GridToolbarExport';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\n/**\n * @requires useGridColumns (state)\n * @requires useGridFilter (state)\n * @requires useGridSorting (state)\n * @requires useGridParamsApi (method)\n */\nexport const useGridPrintExport = (apiRef, props) => {\n const logger = useGridLogger(apiRef, 'useGridPrintExport');\n const doc = React.useRef(null);\n const previousGridState = React.useRef(null);\n const previousColumnVisibility = React.useRef({});\n React.useEffect(() => {\n doc.current = ownerDocument(apiRef.current.rootElementRef.current);\n }, [apiRef]); // Returns a promise because updateColumns triggers state update and\n // the new state needs to be in place before the grid can be sized correctly\n\n const updateGridColumnsForPrint = React.useCallback((fields, allColumns) => new Promise(resolve => {\n if (!fields && !allColumns) {\n resolve();\n return;\n }\n\n const exportedColumnFields = getColumnsToExport({\n apiRef,\n options: {\n fields,\n allColumns\n }\n }).map(column => column.field);\n const columns = gridColumnDefinitionsSelector(apiRef);\n const newColumnVisibilityModel = {};\n columns.forEach(column => {\n newColumnVisibilityModel[column.field] = exportedColumnFields.includes(column.field);\n });\n apiRef.current.setColumnVisibilityModel(newColumnVisibilityModel);\n resolve();\n }), [apiRef]);\n const buildPrintWindow = React.useCallback(title => {\n const iframeEl = document.createElement('iframe');\n iframeEl.id = 'grid-print-window'; // Without this 'onload' event won't fire in some browsers\n\n iframeEl.src = window.location.href;\n iframeEl.style.position = 'absolute';\n iframeEl.style.width = '0px';\n iframeEl.style.height = '0px';\n iframeEl.title = title || document.title;\n return iframeEl;\n }, []);\n const handlePrintWindowLoad = React.useCallback((printWindow, options) => {\n var _printWindow$contentW, _querySelector, _querySelector2;\n\n const normalizeOptions = _extends({\n copyStyles: true,\n hideToolbar: false,\n hideFooter: false\n }, options); // Some agents, such as IE11 and Enzyme (as of 2 Jun 2020) continuously call the\n // `onload` callback. This ensures that it is only called once.\n\n\n printWindow.onload = null;\n const printDoc = printWindow.contentDocument || ((_printWindow$contentW = printWindow.contentWindow) == null ? void 0 : _printWindow$contentW.document);\n\n if (!printDoc) {\n return;\n }\n\n const headerHeight = gridDensityHeaderHeightSelector(apiRef);\n const rowsMeta = gridRowsMetaSelector(apiRef.current.state);\n const gridRootElement = apiRef.current.rootElementRef.current;\n const gridClone = gridRootElement.cloneNode(true);\n const gridCloneViewport = gridClone.querySelector(`.${gridClasses.virtualScroller}`); // Expand the viewport window to prevent clipping\n\n gridCloneViewport.style.height = 'auto';\n gridCloneViewport.style.width = 'auto';\n gridCloneViewport.parentElement.style.width = 'auto';\n gridCloneViewport.parentElement.style.height = 'auto'; // Allow to overflow to not hide the border of the last row\n\n const gridMain = gridClone.querySelector(`.${gridClasses.main}`);\n gridMain.style.overflow = 'visible';\n const columnHeaders = gridClone.querySelector(`.${gridClasses.columnHeaders}`);\n const columnHeadersInner = columnHeaders.querySelector(`.${gridClasses.columnHeadersInner}`);\n columnHeadersInner.style.width = '100%';\n let gridToolbarElementHeight = ((_querySelector = gridRootElement.querySelector(`.${gridClasses.toolbarContainer}`)) == null ? void 0 : _querySelector.clientHeight) || 0;\n let gridFooterElementHeight = ((_querySelector2 = gridRootElement.querySelector(`.${gridClasses.footerContainer}`)) == null ? void 0 : _querySelector2.clientHeight) || 0;\n\n if (normalizeOptions.hideToolbar) {\n var _gridClone$querySelec;\n\n (_gridClone$querySelec = gridClone.querySelector(`.${gridClasses.toolbarContainer}`)) == null ? void 0 : _gridClone$querySelec.remove();\n gridToolbarElementHeight = 0;\n }\n\n if (normalizeOptions.hideFooter) {\n var _gridClone$querySelec2;\n\n (_gridClone$querySelec2 = gridClone.querySelector(`.${gridClasses.footerContainer}`)) == null ? void 0 : _gridClone$querySelec2.remove();\n gridFooterElementHeight = 0;\n } // Expand container height to accommodate all rows\n\n\n gridClone.style.height = `${rowsMeta.currentPageTotalHeight + headerHeight + gridToolbarElementHeight + gridFooterElementHeight}px`; // Remove all loaded elements from the current host\n\n printDoc.body.innerHTML = '';\n printDoc.body.appendChild(gridClone);\n const defaultPageStyle = typeof normalizeOptions.pageStyle === 'function' ? normalizeOptions.pageStyle() : normalizeOptions.pageStyle;\n\n if (typeof defaultPageStyle === 'string') {\n // TODO custom styles should always win\n const styleElement = printDoc.createElement('style');\n styleElement.appendChild(printDoc.createTextNode(defaultPageStyle));\n printDoc.head.appendChild(styleElement);\n }\n\n if (normalizeOptions.bodyClassName) {\n printDoc.body.classList.add(...normalizeOptions.bodyClassName.split(' '));\n }\n\n if (normalizeOptions.copyStyles) {\n const headStyleElements = doc.current.querySelectorAll(\"style, link[rel='stylesheet']\");\n\n for (let i = 0; i < headStyleElements.length; i += 1) {\n const node = headStyleElements[i];\n\n if (node.tagName === 'STYLE') {\n const newHeadStyleElements = printDoc.createElement(node.tagName);\n const sheet = node.sheet;\n\n if (sheet) {\n let styleCSS = ''; // NOTE: for-of is not supported by IE\n\n for (let j = 0; j < sheet.cssRules.length; j += 1) {\n if (typeof sheet.cssRules[j].cssText === 'string') {\n styleCSS += `${sheet.cssRules[j].cssText}\\r\\n`;\n }\n }\n\n newHeadStyleElements.appendChild(printDoc.createTextNode(styleCSS));\n printDoc.head.appendChild(newHeadStyleElements);\n }\n } else if (node.getAttribute('href')) {\n // If `href` tag is empty, avoid loading these links\n const newHeadStyleElements = printDoc.createElement(node.tagName);\n\n for (let j = 0; j < node.attributes.length; j += 1) {\n const attr = node.attributes[j];\n\n if (attr) {\n newHeadStyleElements.setAttribute(attr.nodeName, attr.nodeValue || '');\n }\n }\n\n printDoc.head.appendChild(newHeadStyleElements);\n }\n }\n } // Trigger print\n\n\n if (process.env.NODE_ENV !== 'test') {\n printWindow.contentWindow.print();\n }\n }, [apiRef, doc]);\n const handlePrintWindowAfterPrint = React.useCallback(printWindow => {\n var _previousGridState$cu, _previousGridState$cu2;\n\n // Remove the print iframe\n doc.current.body.removeChild(printWindow); // Revert grid to previous state\n\n apiRef.current.restoreState(previousGridState.current || {});\n\n if (!((_previousGridState$cu = previousGridState.current) != null && (_previousGridState$cu2 = _previousGridState$cu.columns) != null && _previousGridState$cu2.columnVisibilityModel)) {\n // if the apiRef.current.exportState(); did not exported the column visibility, we update it\n apiRef.current.setColumnVisibilityModel(previousColumnVisibility.current);\n }\n\n apiRef.current.unstable_enableVirtualization(); // Clear local state\n\n previousGridState.current = null;\n previousColumnVisibility.current = {};\n }, [apiRef]);\n const exportDataAsPrint = React.useCallback(async options => {\n logger.debug(`Export data as Print`);\n\n if (!apiRef.current.rootElementRef.current) {\n throw new Error('MUI: No grid root element available.');\n }\n\n previousGridState.current = apiRef.current.exportState(); // It appends that the visibility model is not exported, especially if columnVisibility is not controlled\n\n previousColumnVisibility.current = gridColumnVisibilityModelSelector(apiRef);\n\n if (props.pagination) {\n const visibleRowCount = gridVisibleRowCountSelector(apiRef);\n apiRef.current.setPageSize(visibleRowCount);\n }\n\n await updateGridColumnsForPrint(options == null ? void 0 : options.fields, options == null ? void 0 : options.allColumns);\n apiRef.current.unstable_disableVirtualization();\n const printWindow = buildPrintWindow(options == null ? void 0 : options.fileName);\n doc.current.body.appendChild(printWindow);\n\n if (process.env.NODE_ENV === 'test') {\n // In test env, run the all pipeline without waiting for loading\n handlePrintWindowLoad(printWindow, options);\n handlePrintWindowAfterPrint(printWindow);\n } else {\n printWindow.onload = () => handlePrintWindowLoad(printWindow, options);\n\n printWindow.contentWindow.onafterprint = () => handlePrintWindowAfterPrint(printWindow);\n }\n }, [props, logger, apiRef, buildPrintWindow, handlePrintWindowLoad, handlePrintWindowAfterPrint, updateGridColumnsForPrint]);\n const printExportApi = {\n exportDataAsPrint\n };\n useGridApiMethod(apiRef, printExportApi, 'GridPrintExportApi');\n /**\n * PRE-PROCESSING\n */\n\n const addExportMenuButtons = React.useCallback((initialValue, options) => {\n var _options$printOptions;\n\n if ((_options$printOptions = options.printOptions) != null && _options$printOptions.disableToolbarButton) {\n return initialValue;\n }\n\n return [...initialValue, {\n component: /*#__PURE__*/_jsx(GridPrintExportMenuItem, {\n options: options.printOptions\n }),\n componentName: 'printExport'\n }];\n }, []);\n useGridRegisterPipeProcessor(apiRef, 'exportMenu', addExportMenuButtons);\n};","import * as React from 'react';\nimport { debounce, ownerDocument, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/material/utils';\nimport { useGridApiEventHandler, useGridApiOptionHandler } from '../../utils/useGridApiEventHandler';\nimport { useGridApiMethod } from '../../utils/useGridApiMethod';\nimport { useGridLogger } from '../../utils/useGridLogger';\nimport { gridColumnsTotalWidthSelector } from '../columns';\nimport { gridDensityHeaderHeightSelector, gridDensityRowHeightSelector } from '../density';\nimport { useGridSelector } from '../../utils';\nimport { getVisibleRows } from '../../utils/useGridVisibleRows';\nimport { gridRowsMetaSelector } from '../rows/gridRowsMetaSelector';\nconst isTestEnvironment = process.env.NODE_ENV === 'test';\n\nconst hasScroll = ({\n content,\n container,\n scrollBarSize\n}) => {\n const hasScrollXIfNoYScrollBar = content.width > container.width;\n const hasScrollYIfNoXScrollBar = content.height > container.height;\n let hasScrollX = false;\n let hasScrollY = false;\n\n if (hasScrollXIfNoYScrollBar || hasScrollYIfNoXScrollBar) {\n hasScrollX = hasScrollXIfNoYScrollBar;\n hasScrollY = content.height + (hasScrollX ? scrollBarSize : 0) > container.height; // We recalculate the scroll x to consider the size of the y scrollbar.\n\n if (hasScrollY) {\n hasScrollX = content.width + scrollBarSize > container.width;\n }\n }\n\n return {\n hasScrollX,\n hasScrollY\n };\n};\n\nexport function useGridDimensions(apiRef, props) {\n const logger = useGridLogger(apiRef, 'useResizeContainer');\n const errorShown = React.useRef(false);\n const rootDimensionsRef = React.useRef(null);\n const fullDimensionsRef = React.useRef(null);\n const rowsMeta = useGridSelector(apiRef, gridRowsMetaSelector);\n const headerHeight = useGridSelector(apiRef, gridDensityHeaderHeightSelector);\n const updateGridDimensionsRef = React.useCallback(() => {\n var _apiRef$current$rootE;\n\n const rootElement = (_apiRef$current$rootE = apiRef.current.rootElementRef) == null ? void 0 : _apiRef$current$rootE.current;\n const columnsTotalWidth = gridColumnsTotalWidthSelector(apiRef);\n\n if (!rootDimensionsRef.current) {\n return;\n }\n\n let scrollBarSize;\n\n if (props.scrollbarSize != null) {\n scrollBarSize = props.scrollbarSize;\n } else if (!columnsTotalWidth || !rootElement) {\n scrollBarSize = 0;\n } else {\n const doc = ownerDocument(rootElement);\n const scrollDiv = doc.createElement('div');\n scrollDiv.style.width = '99px';\n scrollDiv.style.height = '99px';\n scrollDiv.style.position = 'absolute';\n scrollDiv.style.overflow = 'scroll';\n scrollDiv.className = 'scrollDiv';\n rootElement.appendChild(scrollDiv);\n scrollBarSize = scrollDiv.offsetWidth - scrollDiv.clientWidth;\n rootElement.removeChild(scrollDiv);\n }\n\n const viewportOuterSize = {\n width: rootDimensionsRef.current.width,\n height: props.autoHeight ? rowsMeta.currentPageTotalHeight : rootDimensionsRef.current.height - headerHeight\n };\n const {\n hasScrollX,\n hasScrollY\n } = hasScroll({\n content: {\n width: Math.round(columnsTotalWidth),\n height: rowsMeta.currentPageTotalHeight\n },\n container: viewportOuterSize,\n scrollBarSize\n });\n const viewportInnerSize = {\n width: viewportOuterSize.width - (hasScrollY ? scrollBarSize : 0),\n height: viewportOuterSize.height - (hasScrollX ? scrollBarSize : 0)\n };\n const newFullDimensions = {\n viewportOuterSize,\n viewportInnerSize,\n hasScrollX,\n hasScrollY,\n scrollBarSize\n };\n const prevDimensions = fullDimensionsRef.current;\n fullDimensionsRef.current = newFullDimensions;\n\n if (newFullDimensions.viewportInnerSize.width !== (prevDimensions == null ? void 0 : prevDimensions.viewportInnerSize.width) || newFullDimensions.viewportInnerSize.height !== (prevDimensions == null ? void 0 : prevDimensions.viewportInnerSize.height)) {\n apiRef.current.publishEvent('viewportInnerSizeChange', newFullDimensions.viewportInnerSize);\n }\n }, [apiRef, props.scrollbarSize, props.autoHeight, headerHeight, rowsMeta.currentPageTotalHeight]);\n const resize = React.useCallback(() => {\n updateGridDimensionsRef();\n apiRef.current.publishEvent('debouncedResize', rootDimensionsRef.current);\n }, [apiRef, updateGridDimensionsRef]);\n const getRootDimensions = React.useCallback(() => fullDimensionsRef.current, []);\n const getViewportPageSize = React.useCallback(() => {\n const dimensions = apiRef.current.getRootDimensions();\n\n if (!dimensions) {\n return 0;\n }\n\n const currentPage = getVisibleRows(apiRef, {\n pagination: props.pagination,\n paginationMode: props.paginationMode\n }); // TODO: Use a combination of scrollTop, dimensions.viewportInnerSize.height and rowsMeta.possitions\n // to find out the maximum number of rows that can fit in the visible part of the grid\n\n if (props.getRowHeight) {\n const renderContext = apiRef.current.unstable_getRenderContext();\n const viewportPageSize = renderContext.lastRowIndex - renderContext.firstRowIndex;\n return Math.min(viewportPageSize - 1, currentPage.rows.length);\n }\n\n const maximumPageSizeWithoutScrollBar = Math.floor(dimensions.viewportInnerSize.height / gridDensityRowHeightSelector(apiRef));\n return Math.min(maximumPageSizeWithoutScrollBar, currentPage.rows.length);\n }, [apiRef, props.pagination, props.paginationMode, props.getRowHeight]);\n const dimensionsApi = {\n resize,\n getRootDimensions,\n unstable_getViewportPageSize: getViewportPageSize,\n unstable_updateGridDimensionsRef: updateGridDimensionsRef\n };\n useGridApiMethod(apiRef, dimensionsApi, 'GridDimensionsApi');\n const debounceResize = React.useMemo(() => debounce(resize, 60), [resize]);\n const isFirstSizing = React.useRef(true);\n const handleResize = React.useCallback(size => {\n rootDimensionsRef.current = size; // jsdom has no layout capabilities\n\n const isJSDOM = /jsdom/.test(window.navigator.userAgent);\n\n if (size.height === 0 && !errorShown.current && !props.autoHeight && !isJSDOM) {\n logger.error(['The parent DOM element of the data grid has an empty height.', 'Please make sure that this element has an intrinsic height.', 'The grid displays with a height of 0px.', '', 'More details: https://mui.com/r/x-data-grid-no-dimensions.'].join('\\n'));\n errorShown.current = true;\n }\n\n if (size.width === 0 && !errorShown.current && !isJSDOM) {\n logger.error(['The parent DOM element of the data grid has an empty width.', 'Please make sure that this element has an intrinsic width.', 'The grid displays with a width of 0px.', '', 'More details: https://mui.com/r/x-data-grid-no-dimensions.'].join('\\n'));\n errorShown.current = true;\n }\n\n if (isTestEnvironment) {\n // We don't need to debounce the resize for tests.\n resize();\n isFirstSizing.current = false;\n return;\n }\n\n if (isFirstSizing.current) {\n // We want to initialize the grid dimensions as soon as possible to avoid flickering\n resize();\n isFirstSizing.current = false;\n return;\n }\n\n debounceResize();\n }, [props.autoHeight, debounceResize, logger, resize]);\n useEnhancedEffect(() => updateGridDimensionsRef(), [updateGridDimensionsRef]);\n useGridApiOptionHandler(apiRef, 'sortedRowsSet', updateGridDimensionsRef);\n useGridApiOptionHandler(apiRef, 'pageChange', updateGridDimensionsRef);\n useGridApiOptionHandler(apiRef, 'pageSizeChange', updateGridDimensionsRef);\n useGridApiOptionHandler(apiRef, 'columnsChange', updateGridDimensionsRef);\n useGridApiEventHandler(apiRef, 'resize', handleResize);\n useGridApiOptionHandler(apiRef, 'debouncedResize', props.onResize);\n}","import { useGridApiOptionHandler } from '../../utils/useGridApiEventHandler';\n\n/**\n * @requires useGridFocus (event) - can be after, async only\n * @requires useGridColumns (event) - can be after, async only\n */\nexport function useGridEvents(apiRef, props) {\n useGridApiOptionHandler(apiRef, 'columnHeaderClick', props.onColumnHeaderClick);\n useGridApiOptionHandler(apiRef, 'columnHeaderDoubleClick', props.onColumnHeaderDoubleClick);\n useGridApiOptionHandler(apiRef, 'columnHeaderOver', props.onColumnHeaderOver);\n useGridApiOptionHandler(apiRef, 'columnHeaderOut', props.onColumnHeaderOut);\n useGridApiOptionHandler(apiRef, 'columnHeaderEnter', props.onColumnHeaderEnter);\n useGridApiOptionHandler(apiRef, 'columnHeaderLeave', props.onColumnHeaderLeave);\n useGridApiOptionHandler(apiRef, 'columnOrderChange', props.onColumnOrderChange);\n useGridApiOptionHandler(apiRef, 'cellClick', props.onCellClick);\n useGridApiOptionHandler(apiRef, 'cellDoubleClick', props.onCellDoubleClick);\n useGridApiOptionHandler(apiRef, 'cellKeyDown', props.onCellKeyDown);\n useGridApiOptionHandler(apiRef, 'cellFocusOut', props.onCellFocusOut);\n useGridApiOptionHandler(apiRef, 'preferencePanelClose', props.onPreferencePanelClose);\n useGridApiOptionHandler(apiRef, 'preferencePanelOpen', props.onPreferencePanelOpen);\n useGridApiOptionHandler(apiRef, 'menuOpen', props.onMenuOpen);\n useGridApiOptionHandler(apiRef, 'menuClose', props.onMenuClose);\n useGridApiOptionHandler(apiRef, 'rowDoubleClick', props.onRowDoubleClick);\n useGridApiOptionHandler(apiRef, 'rowClick', props.onRowClick);\n useGridApiOptionHandler(apiRef, 'componentError', props.onError);\n useGridApiOptionHandler(apiRef, 'stateChange', props.onStateChange);\n}","import * as React from 'react';\nimport { useGridApiMethod } from '../../utils';\nexport const useGridStatePersistence = apiRef => {\n const exportState = React.useCallback(() => {\n const stateToExport = apiRef.current.unstable_applyPipeProcessors('exportState', {});\n return stateToExport;\n }, [apiRef]);\n const restoreState = React.useCallback(stateToRestore => {\n const response = apiRef.current.unstable_applyPipeProcessors('restoreState', {\n callbacks: []\n }, {\n stateToRestore\n });\n response.callbacks.forEach(callback => {\n callback();\n });\n apiRef.current.forceUpdate();\n }, [apiRef]);\n const statePersistenceApi = {\n exportState,\n restoreState\n };\n useGridApiMethod(apiRef, statePersistenceApi, 'GridStatePersistenceApi');\n};","export const GRID_DEFAULT_LOCALE_TEXT = {\n // Root\n noRowsLabel: 'No rows',\n noResultsOverlayLabel: 'No results found.',\n errorOverlayDefaultLabel: 'An error occurred.',\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 filterPanelDeleteIconLabel: 'Delete',\n filterPanelLinkOperator: 'Logic operator',\n filterPanelOperators: 'Operator',\n // TODO v6: rename to filterPanelOperator\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 // Filter values text\n filterValueAny: 'any',\n filterValueTrue: 'true',\n filterValueFalse: 'false',\n // Column menu text\n columnMenuLabel: 'Menu',\n columnMenuShowColumns: 'Show columns',\n columnMenuFilter: 'Filter',\n columnMenuHideColumn: 'Hide',\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};","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/material';\nimport { styled } from '@mui/material/styles';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['iconButtonContainer']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\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\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(GridIconButtonContainerRoot, _extends({\n ref: ref,\n className: clsx(classes.root, className)\n }, other));\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"hideMenu\", \"currentColumn\", \"open\", \"id\", \"labelledby\", \"className\", \"children\"];\nimport clsx from 'clsx';\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport MenuList from '@mui/material/MenuList';\nimport { isHideMenuKey, isTabKey } from '../../../utils/keyboardUtils';\nimport { gridClasses } from '../../../constants/gridClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst GridColumnMenuContainer = /*#__PURE__*/React.forwardRef(function GridColumnMenuContainer(props, ref) {\n const {\n hideMenu,\n open,\n id,\n labelledby,\n className,\n children\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const handleListKeyDown = React.useCallback(event => {\n if (isTabKey(event.key)) {\n event.preventDefault();\n }\n\n if (isHideMenuKey(event.key)) {\n hideMenu(event);\n }\n }, [hideMenu]);\n return /*#__PURE__*/_jsx(MenuList, _extends({\n id: id,\n ref: ref,\n className: clsx(gridClasses.menuList, className),\n \"aria-labelledby\": labelledby,\n onKeyDown: handleListKeyDown,\n autoFocus: open\n }, other, {\n children: children\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridColumnMenuContainer.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 currentColumn: PropTypes.object.isRequired,\n hideMenu: PropTypes.func.isRequired,\n id: PropTypes.string,\n labelledby: PropTypes.string,\n open: PropTypes.bool.isRequired\n} : void 0;\nexport { GridColumnMenuContainer };","import * as React from 'react';\nimport PropTypes from 'prop-types';\nimport MenuItem from '@mui/material/MenuItem';\nimport { GridPreferencePanelsValue } from '../../../hooks/features/preferencesPanel/gridPreferencePanelsValue';\nimport { useGridApiContext } from '../../../hooks/utils/useGridApiContext';\nimport { useGridRootProps } from '../../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst GridColumnsMenuItem = props => {\n const {\n onClick\n } = props;\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const showColumns = React.useCallback(event => {\n onClick(event);\n apiRef.current.showPreferences(GridPreferencePanelsValue.columns);\n }, [apiRef, onClick]);\n\n if (rootProps.disableColumnSelector) {\n return null;\n }\n\n return /*#__PURE__*/_jsx(MenuItem, {\n onClick: showColumns,\n children: apiRef.current.getLocaleText('columnMenuShowColumns')\n });\n};\n\nprocess.env.NODE_ENV !== \"production\" ? GridColumnsMenuItem.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 column: PropTypes.object.isRequired,\n onClick: PropTypes.func.isRequired\n} : void 0;\nexport { GridColumnsMenuItem };","import * as React from 'react';\nimport PropTypes from 'prop-types';\nimport MenuItem from '@mui/material/MenuItem';\nimport { useGridApiContext } from '../../../hooks/utils/useGridApiContext';\nimport { useGridRootProps } from '../../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst GridFilterMenuItem = props => {\n const {\n column,\n onClick\n } = props;\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const showFilter = React.useCallback(event => {\n onClick(event);\n apiRef.current.showFilterPanel(column == null ? void 0 : column.field);\n }, [apiRef, column == null ? void 0 : column.field, onClick]);\n\n if (rootProps.disableColumnFilter || !(column != null && column.filterable)) {\n return null;\n }\n\n return /*#__PURE__*/_jsx(MenuItem, {\n onClick: showFilter,\n children: apiRef.current.getLocaleText('columnMenuFilter')\n });\n};\n\nprocess.env.NODE_ENV !== \"production\" ? GridFilterMenuItem.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 column: PropTypes.object.isRequired,\n onClick: PropTypes.func.isRequired\n} : void 0;\nexport { GridFilterMenuItem };","import * as React from 'react';\nimport PropTypes from 'prop-types';\nimport MenuItem from '@mui/material/MenuItem';\nimport { useGridApiContext } from '../../../hooks/utils/useGridApiContext';\nimport { useGridRootProps } from '../../../hooks/utils/useGridRootProps';\nimport { gridVisibleColumnDefinitionsSelector } from '../../../hooks/features/columns';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst HideGridColMenuItem = props => {\n const {\n column,\n onClick\n } = props;\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const timeoutRef = React.useRef();\n const visibleColumns = gridVisibleColumnDefinitionsSelector(apiRef);\n const columnsWithMenu = visibleColumns.filter(col => col.disableColumnMenu !== true); // do not allow to hide the last column with menu\n\n const disabled = columnsWithMenu.length === 1;\n const toggleColumn = React.useCallback(event => {\n /**\n * Disabled `MenuItem` would trigger `click` event\n * after imperative `.click()` call on HTML element.\n * Also, click is triggered in testing environment as well.\n */\n if (disabled) {\n return;\n }\n\n onClick(event); // time for the transition\n\n timeoutRef.current = setTimeout(() => {\n apiRef.current.setColumnVisibility(column == null ? void 0 : column.field, false);\n }, 100);\n }, [apiRef, column == null ? void 0 : column.field, onClick, disabled]);\n React.useEffect(() => {\n return () => clearTimeout(timeoutRef.current);\n }, []);\n\n if (rootProps.disableColumnSelector) {\n return null;\n }\n\n if (column.hideable === false) {\n return null;\n }\n\n return /*#__PURE__*/_jsx(MenuItem, {\n onClick: toggleColumn,\n disabled: disabled,\n children: apiRef.current.getLocaleText('columnMenuHideColumn')\n });\n};\n\nprocess.env.NODE_ENV !== \"production\" ? HideGridColMenuItem.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 column: PropTypes.object.isRequired,\n onClick: PropTypes.func.isRequired\n} : void 0;\nexport { HideGridColMenuItem };","import * as React from 'react';\nimport PropTypes from 'prop-types';\nimport MenuItem from '@mui/material/MenuItem';\nimport { useGridSelector } from '../../../hooks/utils/useGridSelector';\nimport { gridSortModelSelector } from '../../../hooks/features/sorting/gridSortingSelector';\nimport { useGridApiContext } from '../../../hooks/utils/useGridApiContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\n\nconst SortGridMenuItems = props => {\n const {\n column,\n onClick\n } = props;\n const apiRef = useGridApiContext();\n const sortModel = useGridSelector(apiRef, gridSortModelSelector);\n const sortDirection = React.useMemo(() => {\n if (!column) {\n return null;\n }\n\n const sortItem = sortModel.find(item => item.field === column.field);\n return sortItem == null ? void 0 : sortItem.sort;\n }, [column, sortModel]);\n const onSortMenuItemClick = React.useCallback(event => {\n onClick(event);\n const direction = event.currentTarget.getAttribute('data-value') || null;\n apiRef.current.sortColumn(column, direction);\n }, [apiRef, column, onClick]);\n\n if (!column || !column.sortable) {\n return null;\n }\n\n return /*#__PURE__*/_jsxs(React.Fragment, {\n children: [/*#__PURE__*/_jsx(MenuItem, {\n onClick: onSortMenuItemClick,\n disabled: sortDirection == null,\n children: apiRef.current.getLocaleText('columnMenuUnsort')\n }), /*#__PURE__*/_jsx(MenuItem, {\n onClick: onSortMenuItemClick,\n \"data-value\": \"asc\",\n disabled: sortDirection === 'asc',\n children: apiRef.current.getLocaleText('columnMenuSortAsc')\n }), /*#__PURE__*/_jsx(MenuItem, {\n onClick: onSortMenuItemClick,\n \"data-value\": \"desc\",\n disabled: sortDirection === 'desc',\n children: apiRef.current.getLocaleText('columnMenuSortDesc')\n })]\n });\n};\n\nprocess.env.NODE_ENV !== \"production\" ? SortGridMenuItems.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 column: PropTypes.object.isRequired,\n onClick: PropTypes.func.isRequired\n} : void 0;\nexport { SortGridMenuItems };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { GridColumnMenuContainer } from './GridColumnMenuContainer';\nimport { GridColumnsMenuItem } from './GridColumnsMenuItem';\nimport { GridFilterMenuItem } from './GridFilterMenuItem';\nimport { HideGridColMenuItem } from './HideGridColMenuItem';\nimport { SortGridMenuItems } from './SortGridMenuItems';\nimport { useGridApiContext } from '../../../hooks/utils/useGridApiContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst GridColumnMenu = /*#__PURE__*/React.forwardRef(function GridColumnMenu(props, ref) {\n const {\n hideMenu,\n currentColumn\n } = props;\n const apiRef = useGridApiContext();\n const defaultButtons = [/*#__PURE__*/_jsx(SortGridMenuItems, {\n onClick: hideMenu,\n column: currentColumn\n }),\n /*#__PURE__*/\n // TODO update types to allow `onClick` and `column` to be optional\n _jsx(GridFilterMenuItem, {\n onClick: hideMenu,\n column: currentColumn\n }), /*#__PURE__*/_jsx(HideGridColMenuItem, {\n onClick: hideMenu,\n column: currentColumn\n }), /*#__PURE__*/_jsx(GridColumnsMenuItem, {\n onClick: hideMenu,\n column: currentColumn\n })];\n const preProcessedButtons = apiRef.current.unstable_applyPipeProcessors('columnMenu', defaultButtons, currentColumn);\n return /*#__PURE__*/_jsx(GridColumnMenuContainer, _extends({\n ref: ref\n }, props, {\n children: preProcessedButtons.map((button, index) => /*#__PURE__*/React.cloneElement(button, {\n key: index,\n onClick: hideMenu,\n column: currentColumn\n }))\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridColumnMenu.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 currentColumn: PropTypes.object.isRequired,\n hideMenu: PropTypes.func.isRequired,\n id: PropTypes.string,\n labelledby: PropTypes.string,\n open: PropTypes.bool.isRequired\n} : void 0;\nexport { GridColumnMenu };","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/material';\nimport { styled } from '@mui/material/styles';\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\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['rowCount']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\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\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n\n if (rowCount === 0) {\n return null;\n }\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 }, 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/material';\nimport { styled } from '@mui/material/styles';\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\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['selectedRowCount']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\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\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\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 }, 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 _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/material';\nimport { styled, alpha, lighten, darken } from '@mui/material/styles';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['footerContainer']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst GridFooterContainerRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'FooterContainer',\n overridesResolver: (props, styles) => styles.footerContainer\n})(({\n theme\n}) => {\n const borderColor = theme.palette.mode === 'light' ? lighten(alpha(theme.palette.divider, 1), 0.88) : darken(alpha(theme.palette.divider, 1), 0.68);\n return {\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n minHeight: 52,\n // Match TablePagination min height\n borderTop: `1px solid ${borderColor}`\n };\n});\nconst GridFooterContainer = /*#__PURE__*/React.forwardRef(function GridFooterContainer(props, ref) {\n const {\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(GridFooterContainerRoot, _extends({\n ref: ref,\n className: clsx(classes.root, className)\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 * 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/selection/gridSelectionSelector';\nimport { gridVisibleTopLevelRowCountSelector } from '../hooks/features/filter/gridFilterSelector';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { GridRowCount } from './GridRowCount';\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$components;\n\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, gridVisibleTopLevelRowCountSelector);\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(GridRowCount, {\n rowCount: totalTopLevelRowCount,\n visibleRowCount: visibleTopLevelRowCount\n }) : null;\n\n const paginationElement = rootProps.pagination && !rootProps.hideFooterPagination && rootProps.components.Pagination && /*#__PURE__*/_jsx(rootProps.components.Pagination, _extends({}, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.pagination));\n\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 const GridHeader = /*#__PURE__*/React.forwardRef(function GridHeader(props, ref) {\n var _rootProps$components, _rootProps$components2;\n\n const rootProps = useGridRootProps();\n return /*#__PURE__*/_jsxs(\"div\", _extends({\n ref: ref\n }, props, {\n children: [/*#__PURE__*/_jsx(rootProps.components.PreferencesPanel, _extends({}, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.preferencesPanel)), rootProps.components.Toolbar && /*#__PURE__*/_jsx(rootProps.components.Toolbar, _extends({}, (_rootProps$components2 = rootProps.componentsProps) == null ? void 0 : _rootProps$components2.toolbar))]\n }));\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { gridColumnDefinitionsSelector } from '../../hooks/features/columns/gridColumnsSelector';\nimport { useGridSelector } from '../../hooks/utils/useGridSelector';\nimport { gridPreferencePanelStateSelector } from '../../hooks/features/preferencesPanel/gridPreferencePanelSelector';\nimport { GridPreferencePanelsValue } from '../../hooks/features/preferencesPanel/gridPreferencePanelsValue';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const GridPreferencesPanel = /*#__PURE__*/React.forwardRef(function GridPreferencesPanel(props, ref) {\n var _preferencePanelState, _rootProps$components, _rootProps$components2;\n\n const apiRef = useGridApiContext();\n const columns = useGridSelector(apiRef, gridColumnDefinitionsSelector);\n const rootProps = useGridRootProps();\n const preferencePanelState = useGridSelector(apiRef, gridPreferencePanelStateSelector);\n const panelContent = apiRef.current.unstable_applyPipeProcessors('preferencePanel', null, (_preferencePanelState = preferencePanelState.openedPanelValue) != null ? _preferencePanelState : GridPreferencePanelsValue.filters);\n return /*#__PURE__*/_jsx(rootProps.components.Panel, _extends({\n ref: ref,\n as: rootProps.components.BasePopper,\n open: columns.length > 0 && preferencePanelState.open\n }, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.panel, props, (_rootProps$components2 = rootProps.componentsProps) == null ? void 0 : _rootProps$components2.basePopper, {\n children: panelContent\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 PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { alpha, styled } from '@mui/material/styles';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['overlay']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst GridOverlayRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'Overlay',\n overridesResolver: (props, styles) => styles.overlay\n})(({\n theme\n}) => ({\n display: 'flex',\n height: '100%',\n alignSelf: 'center',\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: alpha(theme.palette.background.default, theme.palette.action.disabledOpacity)\n}));\nconst GridOverlay = /*#__PURE__*/React.forwardRef(function GridOverlay(props, ref) {\n const {\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(GridOverlayRoot, _extends({\n ref: ref,\n className: clsx(classes.root, className)\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridOverlay.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 { GridOverlay };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport CircularProgress from '@mui/material/CircularProgress';\nimport { GridOverlay } from './containers/GridOverlay';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst GridLoadingOverlay = /*#__PURE__*/React.forwardRef(function GridLoadingOverlay(props, ref) {\n return /*#__PURE__*/_jsx(GridOverlay, _extends({\n ref: ref\n }, props, {\n children: /*#__PURE__*/_jsx(CircularProgress, {})\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridLoadingOverlay.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 { GridLoadingOverlay };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { GridOverlay } from './containers/GridOverlay';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst GridNoRowsOverlay = /*#__PURE__*/React.forwardRef(function GridNoRowsOverlay(props, ref) {\n const apiRef = useGridApiContext();\n const noRowsLabel = apiRef.current.getLocaleText('noRowsLabel');\n return /*#__PURE__*/_jsx(GridOverlay, _extends({\n ref: ref\n }, props, {\n children: noRowsLabel\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridNoRowsOverlay.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 { GridNoRowsOverlay };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport TablePagination, { tablePaginationClasses } from '@mui/material/TablePagination';\nimport { styled } from '@mui/material/styles';\nimport { useGridSelector } from '../hooks/utils/useGridSelector';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { gridPaginationSelector } from '../hooks/features/pagination/gridPaginationSelector';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst GridPaginationRoot = styled(TablePagination)(({\n theme\n}) => ({\n [`& .${tablePaginationClasses.selectLabel}`]: {\n display: 'none',\n [theme.breakpoints.up('sm')]: {\n display: 'block'\n }\n },\n [`& .${tablePaginationClasses.input}`]: {\n display: 'none',\n [theme.breakpoints.up('sm')]: {\n display: 'inline-flex'\n }\n }\n}));\nexport const GridPagination = /*#__PURE__*/React.forwardRef(function GridPagination(props, ref) {\n var _rootProps$rowsPerPag;\n\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const paginationState = useGridSelector(apiRef, gridPaginationSelector);\n const lastPage = React.useMemo(() => Math.floor(paginationState.rowCount / (paginationState.pageSize || 1)), [paginationState.rowCount, paginationState.pageSize]);\n const handlePageSizeChange = React.useCallback(event => {\n const newPageSize = Number(event.target.value);\n apiRef.current.setPageSize(newPageSize);\n }, [apiRef]);\n const handlePageChange = React.useCallback((event, page) => {\n apiRef.current.setPage(page);\n }, [apiRef]);\n\n if (process.env.NODE_ENV !== 'production') {\n var _rootProps$pageSize;\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const warnedOnceMissingPageSizeInRowsPerPageOptions = React.useRef(false);\n\n if (!warnedOnceMissingPageSizeInRowsPerPageOptions.current && !rootProps.autoPageSize && !rootProps.rowsPerPageOptions.includes((_rootProps$pageSize = rootProps.pageSize) != null ? _rootProps$pageSize : paginationState.pageSize)) {\n var _rootProps$pageSize2;\n\n console.warn([`MUI: The page size \\`${(_rootProps$pageSize2 = rootProps.pageSize) != null ? _rootProps$pageSize2 : paginationState.pageSize}\\` is not preset in the \\`rowsPerPageOptions\\``, `Add it to show the pagination select.`].join('\\n'));\n warnedOnceMissingPageSizeInRowsPerPageOptions.current = true;\n }\n }\n\n return /*#__PURE__*/_jsx(GridPaginationRoot, _extends({\n ref: ref // @ts-ignore\n ,\n component: \"div\",\n count: paginationState.rowCount,\n page: paginationState.page <= lastPage ? paginationState.page : lastPage,\n rowsPerPageOptions: (_rootProps$rowsPerPag = rootProps.rowsPerPageOptions) != null && _rootProps$rowsPerPag.includes(paginationState.pageSize) ? rootProps.rowsPerPageOptions : [],\n rowsPerPage: paginationState.pageSize,\n onPageChange: handlePageChange,\n onRowsPerPageChange: handlePageSizeChange\n }, apiRef.current.getLocaleText('MuiTablePagination'), props));\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 { styled } from '@mui/material/styles';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['panelContent']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst GridPanelContentRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'PanelContent',\n overridesResolver: (props, styles) => styles.panelContent\n})({\n display: 'flex',\n flexDirection: 'column',\n overflow: 'auto',\n flex: '1 1',\n maxHeight: 400\n});\n\nfunction GridPanelContent(props) {\n const {\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(GridPanelContentRoot, _extends({\n className: clsx(className, classes.root)\n }, other));\n}\n\nprocess.env.NODE_ENV !== \"production\" ? GridPanelContent.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 { GridPanelContent };","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 { styled } from '@mui/material/styles';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['panelFooter']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst GridPanelFooterRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'PanelFooter',\n overridesResolver: (props, styles) => styles.panelFooter\n})(({\n theme\n}) => ({\n padding: theme.spacing(0.5),\n display: 'flex',\n justifyContent: 'space-between'\n}));\n\nfunction GridPanelFooter(props) {\n const {\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(GridPanelFooterRoot, _extends({\n className: clsx(className, classes.root)\n }, other));\n}\n\nprocess.env.NODE_ENV !== \"production\" ? GridPanelFooter.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 { GridPanelFooter };","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 TrapFocus from '@mui/material/Unstable_TrapFocus';\nimport { styled } from '@mui/material/styles';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['panelWrapper']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst GridPanelWrapperRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'PanelWrapper',\n overridesResolver: (props, styles) => styles.panelWrapper\n})({\n display: 'flex',\n flexDirection: 'column',\n flex: 1,\n '&:focus': {\n outline: 0\n }\n});\n\nconst isEnabled = () => true;\n\nconst GridPanelWrapper = /*#__PURE__*/React.forwardRef(function GridPanelWrapper(props, ref) {\n const {\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(TrapFocus, {\n open: true,\n disableEnforceFocus: true,\n isEnabled: isEnabled,\n children: /*#__PURE__*/_jsx(GridPanelWrapperRoot, _extends({\n ref: ref,\n tabIndex: -1,\n className: clsx(className, classes.root)\n }, other))\n });\n});\nexport { GridPanelWrapper };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"item\", \"hasMultipleFilters\", \"deleteFilter\", \"applyFilterChanges\", \"multiFilterOperator\", \"showMultiFilterOperators\", \"disableMultiFilterOperator\", \"applyMultiFilterOperatorChanges\", \"focusElementRef\", \"linkOperators\", \"columnsSort\", \"deleteIconProps\", \"linkOperatorInputProps\", \"operatorInputProps\", \"columnInputProps\", \"valueInputProps\", \"children\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport IconButton from '@mui/material/IconButton';\nimport MenuItem from '@mui/material/MenuItem';\nimport InputLabel from '@mui/material/InputLabel';\nimport FormControl from '@mui/material/FormControl';\nimport { capitalize, unstable_useId as useId } from '@mui/material/utils';\nimport { styled } from '@mui/material/styles';\nimport clsx from 'clsx';\nimport { gridFilterableColumnDefinitionsSelector } from '../../../hooks/features/columns/gridColumnsSelector';\nimport { useGridSelector } from '../../../hooks/utils/useGridSelector';\nimport { GridLinkOperator } from '../../../models/gridFilterItem';\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\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['filterForm'],\n deleteIcon: ['filterFormDeleteIcon'],\n linkOperatorInput: ['filterFormLinkOperatorInput'],\n columnInput: ['filterFormColumnInput'],\n operatorInput: ['filterFormOperatorInput'],\n valueInput: ['filterFormValueInput']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst GridFilterFormRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'FilterForm',\n overridesResolver: (props, styles) => styles.filterForm\n})(({\n theme\n}) => ({\n display: 'flex',\n padding: theme.spacing(1)\n}));\nconst FilterFormDeleteIcon = styled(FormControl, {\n name: 'MuiDataGrid',\n slot: 'FilterFormDeleteIcon',\n overridesResolver: (_, styles) => styles.filterFormDeleteIcon\n})(({\n theme\n}) => ({\n flexShrink: 0,\n justifyContent: 'flex-end',\n marginRight: theme.spacing(0.5),\n marginBottom: theme.spacing(0.2)\n}));\nconst FilterFormLinkOperatorInput = styled(FormControl, {\n name: 'MuiDataGrid',\n slot: 'FilterFormLinkOperatorInput',\n overridesResolver: (_, styles) => styles.filterFormLinkOperatorInput\n})({\n minWidth: 55,\n marginRight: 5,\n justifyContent: 'end'\n});\nconst FilterFormColumnInput = styled(FormControl, {\n name: 'MuiDataGrid',\n slot: 'FilterFormColumnInput',\n overridesResolver: (_, styles) => styles.filterFormColumnInput\n})({\n width: 150\n});\nconst FilterFormOperatorInput = styled(FormControl, {\n name: 'MuiDataGrid',\n slot: 'FilterFormOperatorInput',\n overridesResolver: (_, styles) => styles.filterFormOperatorInput\n})({\n width: 120\n});\nconst FilterFormValueInput = styled(FormControl, {\n name: 'MuiDataGrid',\n slot: 'FilterFormValueInput',\n overridesResolver: (_, styles) => styles.filterFormValueInput\n})({\n width: 190\n});\n\nconst getLinkOperatorLocaleKey = linkOperator => {\n switch (linkOperator) {\n case GridLinkOperator.And:\n return 'filterPanelOperatorAnd';\n\n case GridLinkOperator.Or:\n return 'filterPanelOperatorOr';\n\n default:\n throw new Error('MUI: Invalid `linkOperator` property in the `GridFilterPanel`.');\n }\n};\n\nconst getColumnLabel = col => col.headerName || col.field;\n\nconst collator = new Intl.Collator();\nconst GridFilterForm = /*#__PURE__*/React.forwardRef(function GridFilterForm(props, ref) {\n var _rootProps$components, _rootProps$components2, _baseSelectProps$nati, _rootProps$components3, _rootProps$components4, _rootProps$components5, _currentColumn$filter2;\n\n const {\n item,\n hasMultipleFilters,\n deleteFilter,\n applyFilterChanges,\n multiFilterOperator,\n showMultiFilterOperators,\n disableMultiFilterOperator,\n applyMultiFilterOperatorChanges,\n focusElementRef,\n linkOperators = [GridLinkOperator.And, GridLinkOperator.Or],\n columnsSort,\n deleteIconProps = {},\n linkOperatorInputProps = {},\n operatorInputProps = {},\n columnInputProps = {},\n valueInputProps = {}\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const apiRef = useGridApiContext();\n const filterableColumns = useGridSelector(apiRef, gridFilterableColumnDefinitionsSelector);\n const columnSelectId = useId();\n const columnSelectLabelId = useId();\n const operatorSelectId = useId();\n const operatorSelectLabelId = useId();\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n const valueRef = React.useRef(null);\n const filterSelectorRef = React.useRef(null);\n const hasLinkOperatorColumn = hasMultipleFilters && linkOperators.length > 0;\n const baseFormControlProps = ((_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.baseFormControl) || {};\n const baseSelectProps = ((_rootProps$components2 = rootProps.componentsProps) == null ? void 0 : _rootProps$components2.baseSelect) || {};\n const isBaseSelectNative = (_baseSelectProps$nati = baseSelectProps.native) != null ? _baseSelectProps$nati : true;\n const OptionComponent = isBaseSelectNative ? 'option' : MenuItem;\n const sortedFilterableColumns = React.useMemo(() => {\n switch (columnsSort) {\n case 'asc':\n return filterableColumns.sort((a, b) => collator.compare(getColumnLabel(a), getColumnLabel(b)));\n\n case 'desc':\n return filterableColumns.sort((a, b) => -collator.compare(getColumnLabel(a), getColumnLabel(b)));\n\n default:\n return filterableColumns;\n }\n }, [filterableColumns, columnsSort]);\n const currentColumn = item.columnField ? apiRef.current.getColumn(item.columnField) : null;\n const currentOperator = React.useMemo(() => {\n var _currentColumn$filter;\n\n if (!item.operatorValue || !currentColumn) {\n return null;\n }\n\n return (_currentColumn$filter = currentColumn.filterOperators) == null ? void 0 : _currentColumn$filter.find(operator => operator.value === item.operatorValue);\n }, [item, currentColumn]);\n const changeColumn = React.useCallback(event => {\n const columnField = event.target.value;\n const column = apiRef.current.getColumn(columnField);\n\n if (column.field === currentColumn.field) {\n // column did not change\n return;\n } // try to keep the same operator when column change\n\n\n const newOperator = column.filterOperators.find(operator => operator.value === item.operatorValue) || column.filterOperators[0]; // Erase filter value if the input component is modified\n\n const eraseItemValue = !newOperator.InputComponent || newOperator.InputComponent !== (currentOperator == null ? void 0 : currentOperator.InputComponent);\n applyFilterChanges(_extends({}, item, {\n columnField,\n operatorValue: newOperator.value,\n value: eraseItemValue ? undefined : item.value\n }));\n }, [apiRef, applyFilterChanges, item, currentColumn, currentOperator]);\n const changeOperator = React.useCallback(event => {\n const operatorValue = event.target.value;\n const newOperator = currentColumn == null ? void 0 : currentColumn.filterOperators.find(operator => operator.value === operatorValue);\n const eraseItemValue = !(newOperator != null && newOperator.InputComponent) || (newOperator == null ? void 0 : newOperator.InputComponent) !== (currentOperator == null ? void 0 : currentOperator.InputComponent);\n applyFilterChanges(_extends({}, item, {\n operatorValue,\n value: eraseItemValue ? undefined : item.value\n }));\n }, [applyFilterChanges, item, currentColumn, currentOperator]);\n const changeLinkOperator = React.useCallback(event => {\n const linkOperator = event.target.value === GridLinkOperator.And.toString() ? GridLinkOperator.And : GridLinkOperator.Or;\n applyMultiFilterOperatorChanges(linkOperator);\n }, [applyMultiFilterOperatorChanges]);\n\n const handleDeleteFilter = () => {\n if (rootProps.disableMultipleColumnsFiltering) {\n if (item.value === undefined) {\n deleteFilter(item);\n } else {\n // TODO v6: simplify the behavior by always remove the filter form\n applyFilterChanges(_extends({}, item, {\n value: undefined\n }));\n }\n } else {\n deleteFilter(item);\n }\n };\n\n React.useImperativeHandle(focusElementRef, () => ({\n focus: () => {\n if (currentOperator != null && currentOperator.InputComponent) {\n var _valueRef$current;\n\n valueRef == null ? void 0 : (_valueRef$current = valueRef.current) == null ? void 0 : _valueRef$current.focus();\n } else {\n filterSelectorRef.current.focus();\n }\n }\n }), [currentOperator]);\n return /*#__PURE__*/_jsxs(GridFilterFormRoot, _extends({\n ref: ref,\n className: classes.root\n }, other, {\n children: [/*#__PURE__*/_jsx(FilterFormDeleteIcon, _extends({\n variant: \"standard\",\n as: rootProps.components.BaseFormControl\n }, baseFormControlProps, deleteIconProps, {\n className: clsx(classes.deleteIcon, baseFormControlProps.className, deleteIconProps.className),\n children: /*#__PURE__*/_jsx(IconButton, {\n \"aria-label\": apiRef.current.getLocaleText('filterPanelDeleteIconLabel'),\n title: apiRef.current.getLocaleText('filterPanelDeleteIconLabel'),\n onClick: handleDeleteFilter,\n size: \"small\",\n children: /*#__PURE__*/_jsx(rootProps.components.FilterPanelDeleteIcon, {\n fontSize: \"small\"\n })\n })\n })), /*#__PURE__*/_jsx(FilterFormLinkOperatorInput, _extends({\n variant: \"standard\",\n as: rootProps.components.BaseFormControl\n }, baseFormControlProps, linkOperatorInputProps, {\n sx: _extends({\n display: hasLinkOperatorColumn ? 'flex' : 'none',\n visibility: showMultiFilterOperators ? 'visible' : 'hidden'\n }, baseFormControlProps.sx || {}, linkOperatorInputProps.sx || {}),\n className: clsx(classes.linkOperatorInput, baseFormControlProps.className, linkOperatorInputProps.className),\n children: /*#__PURE__*/_jsx(rootProps.components.BaseSelect, _extends({\n inputProps: {\n 'aria-label': apiRef.current.getLocaleText('filterPanelLinkOperator')\n },\n value: multiFilterOperator,\n onChange: changeLinkOperator,\n disabled: !!disableMultiFilterOperator || linkOperators.length === 1,\n native: isBaseSelectNative\n }, (_rootProps$components3 = rootProps.componentsProps) == null ? void 0 : _rootProps$components3.baseSelect, {\n children: linkOperators.map(linkOperator => /*#__PURE__*/_jsx(OptionComponent, {\n value: linkOperator.toString(),\n children: apiRef.current.getLocaleText(getLinkOperatorLocaleKey(linkOperator))\n }, linkOperator.toString()))\n }))\n })), /*#__PURE__*/_jsxs(FilterFormColumnInput, _extends({\n variant: \"standard\",\n as: rootProps.components.BaseFormControl\n }, baseFormControlProps, columnInputProps, {\n className: clsx(classes.columnInput, baseFormControlProps.className, columnInputProps.className),\n children: [/*#__PURE__*/_jsx(InputLabel, {\n htmlFor: columnSelectId,\n id: columnSelectLabelId,\n children: apiRef.current.getLocaleText('filterPanelColumns')\n }), /*#__PURE__*/_jsx(rootProps.components.BaseSelect, _extends({\n labelId: columnSelectLabelId,\n id: columnSelectId,\n label: apiRef.current.getLocaleText('filterPanelColumns'),\n value: item.columnField || '',\n onChange: changeColumn,\n native: isBaseSelectNative\n }, (_rootProps$components4 = rootProps.componentsProps) == null ? void 0 : _rootProps$components4.baseSelect, {\n children: sortedFilterableColumns.map(col => /*#__PURE__*/_jsx(OptionComponent, {\n value: col.field,\n children: getColumnLabel(col)\n }, col.field))\n }))]\n })), /*#__PURE__*/_jsxs(FilterFormOperatorInput, _extends({\n variant: \"standard\",\n as: rootProps.components.BaseFormControl\n }, baseFormControlProps, operatorInputProps, {\n className: clsx(classes.operatorInput, baseFormControlProps.className, operatorInputProps.className),\n children: [/*#__PURE__*/_jsx(InputLabel, {\n htmlFor: operatorSelectId,\n id: operatorSelectLabelId,\n children: apiRef.current.getLocaleText('filterPanelOperators')\n }), /*#__PURE__*/_jsx(rootProps.components.BaseSelect, _extends({\n labelId: operatorSelectLabelId,\n label: apiRef.current.getLocaleText('filterPanelOperators'),\n id: operatorSelectId,\n value: item.operatorValue,\n onChange: changeOperator,\n native: isBaseSelectNative,\n inputRef: filterSelectorRef\n }, (_rootProps$components5 = rootProps.componentsProps) == null ? void 0 : _rootProps$components5.baseSelect, {\n children: currentColumn == null ? void 0 : (_currentColumn$filter2 = currentColumn.filterOperators) == null ? void 0 : _currentColumn$filter2.map(operator => /*#__PURE__*/_jsx(OptionComponent, {\n value: operator.value,\n children: operator.label || apiRef.current.getLocaleText(`filterOperator${capitalize(operator.value)}`)\n }, operator.value))\n }))]\n })), /*#__PURE__*/_jsx(FilterFormValueInput, _extends({\n variant: \"standard\",\n as: rootProps.components.BaseFormControl\n }, baseFormControlProps, valueInputProps, {\n className: clsx(classes.valueInput, baseFormControlProps.className, valueInputProps.className),\n children: currentOperator != null && currentOperator.InputComponent ? /*#__PURE__*/_jsx(currentOperator.InputComponent, _extends({\n apiRef: apiRef,\n item: item,\n applyValue: applyFilterChanges,\n focusElementRef: valueRef\n }, currentOperator.InputComponentProps)) : null\n }))]\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridFilterForm.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 /**\n * Callback called when the operator, column field or value is changed.\n * @param {GridFilterItem} item The updated [[GridFilterItem]].\n */\n applyFilterChanges: PropTypes.func.isRequired,\n\n /**\n * Callback called when the logic operator is changed.\n * @param {GridLinkOperator} operator The new logic operator.\n */\n applyMultiFilterOperatorChanges: PropTypes.func.isRequired,\n\n /**\n * Props passed to the column input component.\n * @default {}\n */\n columnInputProps: PropTypes.any,\n\n /**\n * Changes how the options in the columns selector should be ordered.\n * If not specified, the order is derived from the `columns` prop.\n */\n columnsSort: PropTypes.oneOf(['asc', 'desc']),\n\n /**\n * Callback called when the delete button is clicked.\n * @param {GridFilterItem} item The deleted [[GridFilterItem]].\n */\n deleteFilter: PropTypes.func.isRequired,\n\n /**\n * Props passed to the delete icon.\n * @default {}\n */\n deleteIconProps: PropTypes.any,\n\n /**\n * If `true`, disables the logic operator field but still renders it.\n */\n disableMultiFilterOperator: PropTypes.bool,\n\n /**\n * A ref allowing to set imperative focus.\n * It can be passed to the el\n */\n focusElementRef: PropTypes\n /* @typescript-to-proptypes-ignore */\n .oneOfType([PropTypes.func, PropTypes.object]),\n\n /**\n * If `true`, the logic operator field is rendered.\n * The field will be invisible if `showMultiFilterOperators` is also `true`.\n */\n hasMultipleFilters: PropTypes.bool.isRequired,\n\n /**\n * The [[GridFilterItem]] representing this form.\n */\n item: PropTypes.shape({\n columnField: PropTypes.string.isRequired,\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n operatorValue: PropTypes.string,\n value: PropTypes.any\n }).isRequired,\n\n /**\n * Props passed to the logic operator input component.\n * @default {}\n */\n linkOperatorInputProps: PropTypes.any,\n\n /**\n * Sets the available logic operators.\n * @default [GridLinkOperator.And, GridLinkOperator.Or]\n */\n linkOperators: PropTypes.arrayOf(PropTypes.oneOf(['and', 'or']).isRequired),\n\n /**\n * The current logic operator applied.\n */\n multiFilterOperator: PropTypes.oneOf(['and', 'or']),\n\n /**\n * Props passed to the operator input component.\n * @default {}\n */\n operatorInputProps: PropTypes.any,\n\n /**\n * If `true`, the logic operator field is visible.\n */\n showMultiFilterOperators: PropTypes.bool,\n\n /**\n * Props passed to the value input component.\n * @default {}\n */\n valueInputProps: PropTypes.any\n} : void 0;\nexport { GridFilterForm };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"linkOperators\", \"columnsSort\", \"filterFormProps\", \"children\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { GridLinkOperator } from '../../../models/gridFilterItem';\nimport { useGridApiContext } from '../../../hooks/utils/useGridApiContext';\nimport { GridAddIcon } from '../../icons';\nimport { GridPanelContent } from '../GridPanelContent';\nimport { GridPanelFooter } from '../GridPanelFooter';\nimport { GridPanelWrapper } from '../GridPanelWrapper';\nimport { GridFilterForm } from './GridFilterForm';\nimport { useGridRootProps } from '../../../hooks/utils/useGridRootProps';\nimport { useGridSelector } from '../../../hooks/utils/useGridSelector';\nimport { gridFilterModelSelector } from '../../../hooks/features/filter/gridFilterSelector';\nimport { gridFilterableColumnDefinitionsSelector } from '../../../hooks/features/columns/gridColumnsSelector';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst GridFilterPanel = /*#__PURE__*/React.forwardRef(function GridFilterPanel(props, ref) {\n var _rootProps$components;\n\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const filterModel = useGridSelector(apiRef, gridFilterModelSelector);\n const filterableColumns = useGridSelector(apiRef, gridFilterableColumnDefinitionsSelector);\n const lastFilterRef = React.useRef(null);\n\n const {\n linkOperators = [GridLinkOperator.And, GridLinkOperator.Or],\n columnsSort,\n filterFormProps\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const applyFilter = React.useCallback(item => {\n apiRef.current.upsertFilterItem(item);\n }, [apiRef]);\n const applyFilterLinkOperator = React.useCallback(operator => {\n apiRef.current.setFilterLinkOperator(operator);\n }, [apiRef]);\n const getDefaultItem = React.useCallback(() => {\n const firstColumnWithOperator = filterableColumns.find(colDef => {\n var _colDef$filterOperato;\n\n return (_colDef$filterOperato = colDef.filterOperators) == null ? void 0 : _colDef$filterOperato.length;\n });\n\n if (!firstColumnWithOperator) {\n return null;\n }\n\n return {\n columnField: firstColumnWithOperator.field,\n operatorValue: firstColumnWithOperator.filterOperators[0].value,\n id: Math.round(Math.random() * 1e5)\n };\n }, [filterableColumns]);\n const items = React.useMemo(() => {\n if (filterModel.items.length) {\n return filterModel.items;\n }\n\n const defaultItem = getDefaultItem();\n return defaultItem ? [defaultItem] : [];\n }, [filterModel.items, getDefaultItem]);\n const hasMultipleFilters = items.length > 1;\n\n const addNewFilter = () => {\n const defaultItem = getDefaultItem();\n\n if (!defaultItem) {\n return;\n }\n\n apiRef.current.upsertFilterItems([...items, defaultItem]);\n };\n\n const deleteFilter = React.useCallback(item => {\n const shouldCloseFilterPanel = items.length === 1;\n apiRef.current.deleteFilterItem(item);\n\n if (shouldCloseFilterPanel) {\n apiRef.current.hideFilterPanel();\n }\n }, [apiRef, items.length]);\n React.useEffect(() => {\n if (linkOperators.length > 0 && filterModel.linkOperator && !linkOperators.includes(filterModel.linkOperator)) {\n applyFilterLinkOperator(linkOperators[0]);\n }\n }, [linkOperators, applyFilterLinkOperator, filterModel.linkOperator]);\n React.useEffect(() => {\n if (items.length > 0) {\n lastFilterRef.current.focus();\n }\n }, [items.length]);\n return /*#__PURE__*/_jsxs(GridPanelWrapper, _extends({\n ref: ref\n }, other, {\n children: [/*#__PURE__*/_jsx(GridPanelContent, {\n children: items.map((item, index) => /*#__PURE__*/_jsx(GridFilterForm, _extends({\n item: item,\n applyFilterChanges: applyFilter,\n deleteFilter: deleteFilter,\n hasMultipleFilters: hasMultipleFilters,\n showMultiFilterOperators: index > 0,\n multiFilterOperator: filterModel.linkOperator,\n disableMultiFilterOperator: index !== 1,\n applyMultiFilterOperatorChanges: applyFilterLinkOperator,\n focusElementRef: index === items.length - 1 ? lastFilterRef : null,\n linkOperators: linkOperators,\n columnsSort: columnsSort\n }, filterFormProps), item.id == null ? index : item.id))\n }), !rootProps.disableMultipleColumnsFiltering && /*#__PURE__*/_jsx(GridPanelFooter, {\n children: /*#__PURE__*/_jsx(rootProps.components.BaseButton, _extends({\n onClick: addNewFilter,\n startIcon: /*#__PURE__*/_jsx(GridAddIcon, {})\n }, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.baseButton, {\n children: apiRef.current.getLocaleText('filterPanelAddFilter')\n }))\n })]\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridFilterPanel.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 /**\n * Changes how the options in the columns selector should be ordered.\n * If not specified, the order is derived from the `columns` prop.\n */\n columnsSort: PropTypes.oneOf(['asc', 'desc']),\n\n /**\n * Props passed to each filter form.\n */\n filterFormProps: PropTypes.shape({\n columnInputProps: PropTypes.any,\n columnsSort: PropTypes.oneOf(['asc', 'desc']),\n deleteIconProps: PropTypes.any,\n linkOperatorInputProps: PropTypes.any,\n operatorInputProps: PropTypes.any,\n valueInputProps: PropTypes.any\n }),\n\n /**\n * Sets the available logic operators.\n * @default [GridLinkOperator.And, GridLinkOperator.Or]\n */\n linkOperators: PropTypes.arrayOf(PropTypes.oneOf(['and', 'or']).isRequired),\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 { GridFilterPanel };","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 { styled } from '@mui/material/styles';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['panelHeader']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst GridPanelHeaderRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'PanelHeader',\n overridesResolver: (props, styles) => styles.panelHeader\n})(({\n theme\n}) => ({\n padding: theme.spacing(1)\n}));\n\nfunction GridPanelHeader(props) {\n const {\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(GridPanelHeaderRoot, _extends({\n className: clsx(className, classes.root)\n }, other));\n}\n\nprocess.env.NODE_ENV !== \"production\" ? GridPanelHeader.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 { GridPanelHeader };","import { localStorageAvailable } from '../utils/utils'; // A guide to feature toggling.\n//\n// The feature toggle is:\n// - independent from the NODE_ENV\n// - isn't pruning code in production, as the objective is to eventually ship the code.\n// - doesn't allow to cherry-pick which feature to enable\n//\n// By default, the experimental features are only enabled in:\n// - the local environment\n// - the pull request previews\n//\n// Reviewers can force the value with the local storage and the GRID_EXPERIMENTAL_ENABLED key:\n// - 'true' => force it to be enabled\n// - 'false' => force it to be disabled\n//\n// Developers (users) are discouraged to enable the experimental feature by setting the GRID_EXPERIMENTAL_ENABLED env.\n// Instead, prefer exposing experimental APIs, for instance, a prop or a new `unstable_` module.\n\nlet experimentalEnabled = false;\n\nif (typeof process !== 'undefined' && process.env.GRID_EXPERIMENTAL_ENABLED !== undefined && localStorageAvailable() && window.localStorage.getItem('GRID_EXPERIMENTAL_ENABLED')) {\n experimentalEnabled = window.localStorage.getItem('GRID_EXPERIMENTAL_ENABLED') === 'true';\n} else if (typeof process !== 'undefined') {\n experimentalEnabled = process.env.GRID_EXPERIMENTAL_ENABLED === 'true';\n}\n\nexport const GRID_EXPERIMENTAL_ENABLED = experimentalEnabled;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport IconButton from '@mui/material/IconButton';\nimport { switchClasses } from '@mui/material/Switch';\nimport FormControlLabel from '@mui/material/FormControlLabel';\nimport { styled } from '@mui/material/styles';\nimport { gridColumnDefinitionsSelector, gridColumnVisibilityModelSelector } from '../../hooks/features/columns/gridColumnsSelector';\nimport { useGridSelector } from '../../hooks/utils/useGridSelector';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { GridDragIcon } from '../icons';\nimport { GridPanelContent } from './GridPanelContent';\nimport { GridPanelFooter } from './GridPanelFooter';\nimport { GridPanelHeader } from './GridPanelHeader';\nimport { GridPanelWrapper } from './GridPanelWrapper';\nimport { GRID_EXPERIMENTAL_ENABLED } from '../../constants/envConstants';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['columnsPanel'],\n columnsPanelRow: ['columnsPanelRow']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst GridColumnsPanelRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'ColumnsPanel',\n overridesResolver: (props, styles) => styles.columnsPanel\n})(() => ({\n padding: '8px 0px 8px 8px'\n}));\nconst GridColumnsPanelRowRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'ColumnsPanelRow',\n overridesResolver: (props, styles) => styles.columnsPanelRow\n})(({\n theme\n}) => ({\n display: 'flex',\n justifyContent: 'space-between',\n padding: '1px 8px 1px 7px',\n [`& .${switchClasses.root}`]: {\n marginRight: theme.spacing(0.5)\n }\n}));\nconst GridIconButtonRoot = styled(IconButton)({\n justifyContent: 'flex-end'\n});\nexport function GridColumnsPanel(props) {\n var _rootProps$components, _rootProps$components3, _rootProps$components4;\n\n const apiRef = useGridApiContext();\n const searchInputRef = React.useRef(null);\n const columns = useGridSelector(apiRef, gridColumnDefinitionsSelector);\n const columnVisibilityModel = useGridSelector(apiRef, gridColumnVisibilityModelSelector);\n const rootProps = useGridRootProps();\n const [searchValue, setSearchValue] = React.useState('');\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n\n const toggleColumn = event => {\n const {\n name: field\n } = event.target;\n apiRef.current.setColumnVisibility(field, columnVisibilityModel[field] === false);\n };\n\n const toggleAllColumns = React.useCallback(isVisible => {\n if (apiRef.current.unstable_caches.columns.isUsingColumnVisibilityModel) {\n if (isVisible) {\n return apiRef.current.setColumnVisibilityModel({});\n }\n\n return apiRef.current.setColumnVisibilityModel(Object.fromEntries(columns.filter(col => col.hideable !== false).map(col => [col.field, false])));\n } // TODO v6: Remove\n\n\n return apiRef.current.updateColumns(columns.map(col => {\n if (col.hideable !== false) {\n return {\n field: col.field,\n hide: !isVisible\n };\n }\n\n return col;\n }));\n }, [apiRef, columns]);\n const handleSearchValueChange = React.useCallback(event => {\n setSearchValue(event.target.value);\n }, []);\n const currentColumns = React.useMemo(() => {\n if (!searchValue) {\n return columns;\n }\n\n const searchValueToCheck = searchValue.toLowerCase();\n return columns.filter(column => (column.headerName || column.field).toLowerCase().indexOf(searchValueToCheck) > -1);\n }, [columns, searchValue]);\n React.useEffect(() => {\n searchInputRef.current.focus();\n }, []);\n return /*#__PURE__*/_jsxs(GridPanelWrapper, _extends({}, props, {\n children: [/*#__PURE__*/_jsx(GridPanelHeader, {\n children: /*#__PURE__*/_jsx(rootProps.components.BaseTextField, _extends({\n label: apiRef.current.getLocaleText('columnsPanelTextFieldLabel'),\n placeholder: apiRef.current.getLocaleText('columnsPanelTextFieldPlaceholder'),\n inputRef: searchInputRef,\n value: searchValue,\n onChange: handleSearchValueChange,\n variant: \"standard\",\n fullWidth: true\n }, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.baseTextField))\n }), /*#__PURE__*/_jsx(GridPanelContent, {\n children: /*#__PURE__*/_jsx(GridColumnsPanelRoot, {\n className: classes.root,\n children: currentColumns.map(column => {\n var _rootProps$components2;\n\n return /*#__PURE__*/_jsxs(GridColumnsPanelRowRoot, {\n className: classes.columnsPanelRow,\n children: [/*#__PURE__*/_jsx(FormControlLabel, {\n control: /*#__PURE__*/_jsx(rootProps.components.BaseSwitch, _extends({\n disabled: column.hideable === false,\n checked: columnVisibilityModel[column.field] !== false,\n onClick: toggleColumn,\n name: column.field,\n size: \"small\"\n }, (_rootProps$components2 = rootProps.componentsProps) == null ? void 0 : _rootProps$components2.baseSwitch)),\n label: column.headerName || column.field\n }), !rootProps.disableColumnReorder && GRID_EXPERIMENTAL_ENABLED && /*#__PURE__*/_jsx(GridIconButtonRoot, {\n draggable: true,\n \"aria-label\": apiRef.current.getLocaleText('columnsPanelDragIconLabel'),\n title: apiRef.current.getLocaleText('columnsPanelDragIconLabel'),\n size: \"small\",\n disabled: true,\n children: /*#__PURE__*/_jsx(GridDragIcon, {})\n })]\n }, column.field);\n })\n })\n }), /*#__PURE__*/_jsxs(GridPanelFooter, {\n children: [/*#__PURE__*/_jsx(rootProps.components.BaseButton, _extends({\n onClick: () => toggleAllColumns(false)\n }, (_rootProps$components3 = rootProps.componentsProps) == null ? void 0 : _rootProps$components3.baseButton, {\n children: apiRef.current.getLocaleText('columnsPanelHideAllButton')\n })), /*#__PURE__*/_jsx(rootProps.components.BaseButton, _extends({\n onClick: () => toggleAllColumns(true)\n }, (_rootProps$components4 = rootProps.componentsProps) == null ? void 0 : _rootProps$components4.baseButton, {\n children: apiRef.current.getLocaleText('columnsPanelShowAllButton')\n }))]\n })]\n }));\n}","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"children\", \"className\", \"classes\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { styled } from '@mui/material/styles';\nimport { generateUtilityClasses } from '@mui/material';\nimport ClickAwayListener from '@mui/material/ClickAwayListener';\nimport Paper from '@mui/material/Paper';\nimport Popper from '@mui/material/Popper';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { isEscapeKey } from '../../utils/keyboardUtils';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const gridPanelClasses = generateUtilityClasses('MuiDataGrid', ['panel', 'paper']);\nconst GridPanelRoot = styled(Popper, {\n name: 'MuiDataGrid',\n slot: 'Panel',\n overridesResolver: (props, styles) => styles.panel\n})(({\n theme\n}) => ({\n zIndex: theme.zIndex.modal\n}));\nconst GridPaperRoot = styled(Paper, {\n name: 'MuiDataGrid',\n slot: 'Paper',\n overridesResolver: (props, styles) => styles.paper\n})(({\n theme\n}) => ({\n backgroundColor: theme.palette.background.paper,\n minWidth: 300,\n maxHeight: 450,\n display: 'flex'\n}));\nconst GridPanel = /*#__PURE__*/React.forwardRef((props, ref) => {\n var _apiRef$current$colum;\n\n const {\n children,\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const apiRef = useGridApiContext();\n const classes = gridPanelClasses;\n const [isPlaced, setIsPlaced] = React.useState(false);\n const handleClickAway = React.useCallback(() => {\n apiRef.current.hidePreferences();\n }, [apiRef]);\n const handleKeyDown = React.useCallback(event => {\n if (isEscapeKey(event.key)) {\n apiRef.current.hidePreferences();\n }\n }, [apiRef]);\n const modifiers = React.useMemo(() => [{\n name: 'flip',\n enabled: false\n }, {\n name: 'isPlaced',\n enabled: true,\n phase: 'main',\n fn: () => {\n setIsPlaced(true);\n },\n effect: () => () => {\n setIsPlaced(false);\n }\n }], []);\n const anchorEl = (_apiRef$current$colum = apiRef.current.columnHeadersContainerElementRef) == null ? void 0 : _apiRef$current$colum.current;\n\n if (!anchorEl) {\n return null;\n }\n\n return /*#__PURE__*/_jsx(GridPanelRoot, _extends({\n ref: ref,\n placement: \"bottom-start\",\n className: clsx(className, classes.panel),\n anchorEl: anchorEl,\n modifiers: modifiers\n }, other, {\n children: /*#__PURE__*/_jsx(ClickAwayListener, {\n mouseEvent: \"onMouseUp\",\n onClickAway: handleClickAway,\n children: /*#__PURE__*/_jsx(GridPaperRoot, {\n className: classes.paper,\n elevation: 8,\n onKeyDown: handleKeyDown,\n children: isPlaced && children\n })\n })\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? GridPanel.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 /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n\n /**\n * If `true`, the component is shown.\n */\n open: PropTypes.bool.isRequired\n} : void 0;\nexport { GridPanel };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"selected\", \"rowId\", \"row\", \"index\", \"style\", \"rowHeight\", \"className\", \"visibleColumns\", \"renderedColumns\", \"containerWidth\", \"firstColumnToRender\", \"lastColumnToRender\", \"cellFocus\", \"cellTabIndex\", \"editRowsState\", \"isLastVisible\", \"onClick\", \"onDoubleClick\", \"onMouseEnter\", \"onMouseLeave\"];\n\n/* eslint-disable jsx-a11y/click-events-have-key-events */\n\n/* eslint-disable jsx-a11y/interactive-supports-focus */\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { GridEditModes, GridRowModes, GridCellModes } from '../models/gridEditRowModel';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { getDataGridUtilityClass, gridClasses } from '../constants/gridClasses';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { gridColumnsTotalWidthSelector } from '../hooks/features/columns/gridColumnsSelector';\nimport { useGridSelector } from '../hooks/utils/useGridSelector';\nimport { useGridVisibleRows } from '../hooks/utils/useGridVisibleRows';\nimport { findParentElementFromClassName } from '../utils/domUtils';\nimport { GRID_CHECKBOX_SELECTION_COL_DEF } from '../colDef/gridCheckboxSelectionColDef';\nimport { GRID_ACTIONS_COLUMN_TYPE } from '../colDef/gridActionsColDef';\nimport { GRID_DETAIL_PANEL_TOGGLE_FIELD } from '../constants/gridDetailPanelToggleField';\nimport { gridSortModelSelector } from '../hooks/features/sorting/gridSortingSelector';\nimport { gridRowTreeDepthSelector } from '../hooks/features/rows/gridRowsSelector';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n editable,\n editing,\n selected,\n isLastVisible,\n rowHeight,\n classes\n } = ownerState;\n const slots = {\n root: ['row', selected && 'selected', editable && 'row--editable', editing && 'row--editing', isLastVisible && 'row--lastVisible', rowHeight === 'auto' && 'row--dynamicHeight']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst EmptyCell = ({\n width\n}) => {\n if (!width) {\n return null;\n }\n\n const style = {\n width\n };\n return /*#__PURE__*/_jsx(\"div\", {\n className: \"MuiDataGrid-cell\",\n style: style\n }); // TODO change to .MuiDataGrid-emptyCell or .MuiDataGrid-rowFiller\n};\n\nfunction GridRow(props) {\n var _apiRef$current$getRo;\n\n const {\n selected,\n rowId,\n row,\n index,\n style: styleProp,\n rowHeight,\n className,\n visibleColumns,\n renderedColumns,\n containerWidth,\n firstColumnToRender,\n cellFocus,\n cellTabIndex,\n editRowsState,\n isLastVisible = false,\n onClick,\n onDoubleClick,\n onMouseEnter,\n onMouseLeave\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const ariaRowIndex = index + 2; // 1 for the header row and 1 as it's 1-based\n\n const apiRef = useGridApiContext();\n const ref = React.useRef(null);\n const rootProps = useGridRootProps();\n const currentPage = useGridVisibleRows(apiRef, rootProps);\n const columnsTotalWidth = useGridSelector(apiRef, gridColumnsTotalWidthSelector);\n const sortModel = useGridSelector(apiRef, gridSortModelSelector);\n const treeDepth = useGridSelector(apiRef, gridRowTreeDepthSelector);\n const {\n hasScrollX,\n hasScrollY\n } = (_apiRef$current$getRo = apiRef.current.getRootDimensions()) != null ? _apiRef$current$getRo : {\n hasScrollX: false,\n hasScrollY: false\n };\n const ownerState = {\n selected,\n isLastVisible,\n classes: rootProps.classes,\n editing: apiRef.current.getRowMode(rowId) === GridRowModes.Edit,\n editable: rootProps.editMode === GridEditModes.Row,\n rowHeight\n };\n const classes = useUtilityClasses(ownerState);\n React.useLayoutEffect(() => {\n if (rowHeight === 'auto' && ref.current && typeof ResizeObserver === 'undefined') {\n // Fallback for IE\n apiRef.current.unstable_storeRowHeightMeasurement(rowId, ref.current.clientHeight);\n }\n });\n React.useLayoutEffect(() => {\n if (currentPage.range) {\n // The index prop is relative to the rows from all pages. As example, the index prop of the\n // first row is 5 if pageSize=5 and page=1. However, the index used by the virtualization\n // doesn't care about pagination and considers the rows from the current page only, so the\n // first row always has index=0. We need to subtract the index of the first row to make it\n // compatible with the index used by the virtualization.\n apiRef.current.unstable_setLastMeasuredRowIndex(index - currentPage.range.firstRowIndex);\n }\n\n const rootElement = ref.current;\n const hasFixedHeight = rowHeight !== 'auto';\n\n if (!rootElement || hasFixedHeight || typeof ResizeObserver === 'undefined') {\n return undefined;\n }\n\n const resizeObserver = new ResizeObserver(entries => {\n const [entry] = entries;\n const height = entry.borderBoxSize && entry.borderBoxSize.length > 0 ? entry.borderBoxSize[0].blockSize : entry.contentRect.height;\n apiRef.current.unstable_storeRowHeightMeasurement(rowId, height);\n });\n resizeObserver.observe(rootElement);\n return () => resizeObserver.disconnect();\n }, [apiRef, currentPage.range, index, rowHeight, rowId]);\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 } // The row might have been deleted\n\n\n if (!apiRef.current.getRow(rowId)) {\n return;\n }\n\n apiRef.current.publishEvent(eventName, apiRef.current.getRowParams(rowId), event);\n\n if (propHandler) {\n propHandler(event);\n }\n }, [apiRef, rowId]);\n const publishClick = React.useCallback(event => {\n const cell = findParentElementFromClassName(event.target, gridClasses.cell);\n const field = cell == null ? void 0 : cell.getAttribute('data-field'); // Check if the field is available because the cell that fills the empty\n // space of the row has no field.\n\n if (field) {\n // User clicked in the checkbox added by checkboxSelection\n if (field === GRID_CHECKBOX_SELECTION_COL_DEF.field) {\n return;\n } // User opened a detail panel\n\n\n if (field === GRID_DETAIL_PANEL_TOGGLE_FIELD) {\n return;\n } // User reorders a row\n\n\n if (field === '__reorder__') {\n return;\n } // User is editing a cell\n\n\n if (apiRef.current.getCellMode(rowId, field) === GridCellModes.Edit) {\n return;\n } // User clicked a button from the \"actions\" column type\n\n\n const column = apiRef.current.getColumn(field);\n\n if (column.type === GRID_ACTIONS_COLUMN_TYPE) {\n return;\n }\n }\n\n publish('rowClick', onClick)(event);\n }, [apiRef, onClick, publish, rowId]);\n\n const style = _extends({}, styleProp, {\n maxHeight: rowHeight === 'auto' ? 'none' : rowHeight,\n // max-height doesn't support \"auto\"\n minHeight: rowHeight\n });\n\n const sizes = apiRef.current.unstable_getRowInternalSizes(rowId);\n\n if (sizes != null && sizes.spacingTop) {\n const property = rootProps.rowSpacingType === 'border' ? 'borderTopWidth' : 'marginTop';\n style[property] = sizes.spacingTop;\n }\n\n if (sizes != null && sizes.spacingBottom) {\n const property = rootProps.rowSpacingType === 'border' ? 'borderBottomWidth' : 'marginBottom';\n style[property] = sizes.spacingBottom;\n }\n\n let rowClassName = null;\n\n if (typeof rootProps.getRowClassName === 'function') {\n const indexRelativeToCurrentPage = index - currentPage.range.firstRowIndex;\n\n const rowParams = _extends({}, apiRef.current.getRowParams(rowId), {\n isFirstVisible: indexRelativeToCurrentPage === 0,\n isLastVisible: indexRelativeToCurrentPage === currentPage.rows.length - 1,\n indexRelativeToCurrentPage\n });\n\n rowClassName = rootProps.getRowClassName(rowParams);\n }\n\n const cells = [];\n\n for (let i = 0; i < renderedColumns.length; i += 1) {\n const column = renderedColumns[i];\n const indexRelativeToAllColumns = firstColumnToRender + i;\n const isLastColumn = indexRelativeToAllColumns === visibleColumns.length - 1;\n const removeLastBorderRight = isLastColumn && hasScrollX && !hasScrollY;\n const showRightBorder = !isLastColumn ? rootProps.showCellRightBorder : !removeLastBorderRight && rootProps.disableExtendRowFullWidth;\n const cellParams = apiRef.current.getCellParams(rowId, column.field);\n const classNames = [];\n const disableDragEvents = rootProps.disableColumnReorder && column.disableReorder || !rootProps.rowReordering && !!sortModel.length && treeDepth > 1 && Object.keys(editRowsState).length > 0;\n\n if (column.cellClassName) {\n classNames.push(clsx(typeof column.cellClassName === 'function' ? column.cellClassName(cellParams) : column.cellClassName));\n }\n\n const editCellState = editRowsState[rowId] ? editRowsState[rowId][column.field] : null;\n let content = null;\n\n if (editCellState == null && column.renderCell) {\n var _rootProps$classes;\n\n content = column.renderCell(_extends({}, cellParams, {\n api: apiRef.current\n })); // TODO move to GridCell\n\n classNames.push(clsx(gridClasses['cell--withRenderer'], (_rootProps$classes = rootProps.classes) == null ? void 0 : _rootProps$classes['cell--withRenderer']));\n }\n\n if (editCellState != null && column.renderEditCell) {\n var _rootProps$classes2;\n\n let updatedRow = row;\n\n if (apiRef.current.unstable_getRowWithUpdatedValues) {\n // Only the new editing API has this method\n updatedRow = apiRef.current.unstable_getRowWithUpdatedValues(rowId, column.field);\n }\n\n const params = _extends({}, cellParams, {\n row: updatedRow\n }, editCellState, {\n api: apiRef.current\n });\n\n content = column.renderEditCell(params); // TODO move to GridCell\n\n classNames.push(clsx(gridClasses['cell--editing'], (_rootProps$classes2 = rootProps.classes) == null ? void 0 : _rootProps$classes2['cell--editing']));\n }\n\n if (rootProps.getCellClassName) {\n // TODO move to GridCell\n classNames.push(rootProps.getCellClassName(cellParams));\n }\n\n const hasFocus = cellFocus !== null && cellFocus.id === rowId && cellFocus.field === column.field;\n const tabIndex = cellTabIndex !== null && cellTabIndex.id === rowId && cellTabIndex.field === column.field && cellParams.cellMode === 'view' ? 0 : -1;\n const cellColSpanInfo = apiRef.current.unstable_getCellColSpanInfo(rowId, indexRelativeToAllColumns);\n\n if (cellColSpanInfo && !cellColSpanInfo.spannedByColSpan) {\n var _rootProps$components;\n\n const {\n colSpan,\n width\n } = cellColSpanInfo.cellProps;\n cells.push( /*#__PURE__*/_jsx(rootProps.components.Cell, _extends({\n value: cellParams.value,\n field: column.field,\n width: width,\n rowId: rowId,\n height: rowHeight,\n showRightBorder: showRightBorder,\n formattedValue: cellParams.formattedValue,\n align: column.align || 'left',\n cellMode: cellParams.cellMode,\n colIndex: indexRelativeToAllColumns,\n isEditable: cellParams.isEditable,\n hasFocus: hasFocus,\n tabIndex: tabIndex,\n className: clsx(classNames),\n colSpan: colSpan,\n disableDragEvents: disableDragEvents\n }, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.cell, {\n children: content\n }), column.field));\n }\n }\n\n const emptyCellWidth = containerWidth - columnsTotalWidth;\n return /*#__PURE__*/_jsxs(\"div\", _extends({\n ref: ref,\n \"data-id\": rowId,\n \"data-rowindex\": index,\n role: \"row\",\n className: clsx(rowClassName, classes.root, className),\n \"aria-rowindex\": ariaRowIndex,\n \"aria-selected\": selected,\n style: style,\n onClick: publishClick,\n onDoubleClick: publish('rowDoubleClick', onDoubleClick),\n onMouseEnter: publish('rowMouseEnter', onMouseEnter),\n onMouseLeave: publish('rowMouseLeave', onMouseLeave)\n }, other, {\n children: [cells, emptyCellWidth > 0 && /*#__PURE__*/_jsx(EmptyCell, {\n width: emptyCellWidth\n })]\n }));\n}\n\nprocess.env.NODE_ENV !== \"production\" ? GridRow.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 cellFocus: PropTypes.object,\n cellTabIndex: PropTypes.object,\n containerWidth: PropTypes.number.isRequired,\n editRowsState: PropTypes.object.isRequired,\n firstColumnToRender: PropTypes.number.isRequired,\n\n /**\n * Index of the row in the whole sorted and filtered dataset.\n * If some rows above have expanded children, this index also take those children into account.\n */\n index: PropTypes.number.isRequired,\n isLastVisible: PropTypes.bool,\n lastColumnToRender: PropTypes.number.isRequired,\n renderedColumns: PropTypes.arrayOf(PropTypes.object).isRequired,\n row: PropTypes.any.isRequired,\n rowHeight: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number]).isRequired,\n rowId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,\n selected: PropTypes.bool.isRequired,\n visibleColumns: PropTypes.arrayOf(PropTypes.object).isRequired\n} : void 0;\nexport { GridRow };","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\n const rootProps = useGridRootProps();\n const [nextSortDirection] = sortingOrder;\n const Icon = nextSortDirection === 'asc' ? rootProps.components.ColumnSortedAscendingIcon : rootProps.components.ColumnSortedDescendingIcon;\n return Icon ? /*#__PURE__*/_jsx(Icon, _extends({}, other)) : null;\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"message\", \"hasError\", \"errorInfo\"];\nimport * as React from 'react';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { GridOverlay } from './containers/GridOverlay';\nimport { useGridSelector } from '../hooks/utils/useGridSelector';\nimport { gridDensityRowHeightSelector } from '../hooks/features/density/densitySelector';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n// TODO v6: rename to GridErrorOverlay\nexport const ErrorOverlay = /*#__PURE__*/React.forwardRef(function ErrorOverlay(props, ref) {\n const {\n message\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const apiRef = useGridApiContext();\n const defaultLabel = apiRef.current.getLocaleText('errorOverlayDefaultLabel');\n const rowHeight = useGridSelector(apiRef, gridDensityRowHeightSelector);\n return /*#__PURE__*/_jsx(GridOverlay, _extends({\n ref: ref,\n sx: {\n width: '100%',\n minHeight: 2 * rowHeight\n }\n }, other, {\n children: message || defaultLabel\n }));\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { GridOverlay } from './containers/GridOverlay';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const GridNoResultsOverlay = /*#__PURE__*/React.forwardRef(function GridNoResultsOverlay(props, ref) {\n const apiRef = useGridApiContext();\n const noResultsOverlayLabel = apiRef.current.getLocaleText('noResultsOverlayLabel');\n return /*#__PURE__*/_jsx(GridOverlay, _extends({\n ref: ref\n }, props, {\n children: noResultsOverlayLabel\n }));\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 MUITooltip from '@mui/material/Tooltip';\nimport MUIPopper from '@mui/material/Popper';\nimport { GridArrowDownwardIcon, GridArrowUpwardIcon, GridCell, GridCheckIcon, GridCloseIcon, GridColumnIcon, GridColumnMenu, GridColumnsPanel, GridFilterAltIcon, GridFilterListIcon, GridFilterPanel, GridFooter, GridHeader, GridLoadingOverlay, GridNoRowsOverlay, GridPagination, GridPanel, GridPreferencesPanel, GridRow, GridSaveAltIcon, GridSeparatorIcon, GridTableRowsIcon, GridTripleDotsVerticalIcon, GridViewHeadlineIcon, GridViewStreamIcon, GridMoreVertIcon, GridExpandMoreIcon, GridKeyboardArrowRight, GridAddIcon, GridRemoveIcon, GridDragIcon, GridColumnHeaderFilterIconButton, GridSearchIcon } from '../components';\nimport { GridColumnUnsortedIcon } from '../components/columnHeaders/GridColumnUnsortedIcon';\nimport { ErrorOverlay } from '../components/ErrorOverlay';\nimport { GridNoResultsOverlay } from '../components/GridNoResultsOverlay';\nconst DEFAULT_GRID_ICON_SLOTS_COMPONENTS = {\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};\n/**\n * TODO: Differentiate community and pro value and interface\n */\n\nexport const DATA_GRID_DEFAULT_SLOTS_COMPONENTS = _extends({}, DEFAULT_GRID_ICON_SLOTS_COMPONENTS, {\n BaseCheckbox: MUICheckbox,\n BaseTextField: MUITextField,\n BaseFormControl: MUIFormControl,\n BaseSelect: MUISelect,\n BaseSwitch: MUISwitch,\n BaseButton: MUIButton,\n BaseTooltip: MUITooltip,\n BasePopper: MUIPopper,\n Cell: GridCell,\n ColumnHeaderFilterIconButton: GridColumnHeaderFilterIconButton,\n ColumnMenu: GridColumnMenu,\n ErrorOverlay,\n Footer: GridFooter,\n Header: GridHeader,\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 } from '@mui/material';\nimport IconButton from '@mui/material/IconButton';\nimport Badge from '@mui/material/Badge';\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\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n icon: ['filterIcon']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nfunction GridColumnHeaderFilterIconButton(props) {\n var _rootProps$components;\n\n const {\n counter,\n field,\n onClick\n } = props;\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n\n const ownerState = _extends({}, props, {\n classes: rootProps.classes\n });\n\n const classes = useUtilityClasses(ownerState);\n const toggleFilter = React.useCallback(event => {\n event.preventDefault();\n event.stopPropagation();\n const {\n open,\n openedPanelValue\n } = gridPreferencePanelStateSelector(apiRef.current.state);\n\n if (open && openedPanelValue === GridPreferencePanelsValue.filters) {\n apiRef.current.hideFilterPanel();\n } else {\n apiRef.current.showFilterPanel();\n }\n\n if (onClick) {\n onClick(apiRef.current.getColumnHeaderParams(field), event);\n }\n }, [apiRef, field, onClick]);\n\n if (!counter) {\n return null;\n }\n\n const iconButton = /*#__PURE__*/_jsx(IconButton, {\n onClick: toggleFilter,\n color: \"default\",\n \"aria-label\": apiRef.current.getLocaleText('columnHeaderFiltersLabel'),\n size: \"small\",\n tabIndex: -1,\n children: /*#__PURE__*/_jsx(rootProps.components.ColumnFilteredIcon, {\n className: classes.icon,\n fontSize: \"small\"\n })\n });\n\n return /*#__PURE__*/_jsx(rootProps.components.BaseTooltip, _extends({\n title: apiRef.current.getLocaleText('columnHeaderFiltersTooltipActive')(counter),\n enterDelay: 1000\n }, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.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}\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 _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport { useThemeProps } from '@mui/material/styles';\nimport { DATA_GRID_DEFAULT_SLOTS_COMPONENTS, GRID_DEFAULT_LOCALE_TEXT } from '../constants';\nimport { GridDensityTypes, GridEditModes, GridFeatureModeConstant } from '../models';\nconst DATA_GRID_FORCED_PROPS = {\n apiRef: undefined,\n disableMultipleColumnsFiltering: true,\n disableMultipleColumnsSorting: true,\n disableMultipleSelection: true,\n throttleRowsMs: undefined,\n hideFooterRowCount: false,\n pagination: true,\n checkboxSelectionVisibleOnly: false,\n disableColumnReorder: true,\n disableColumnResize: true,\n signature: 'DataGrid'\n};\nexport const MAX_PAGE_SIZE = 100;\n/**\n * The default values of `DataGridPropsWithDefaultValues` to inject in the props of DataGrid.\n */\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 density: GridDensityTypes.Standard,\n disableExtendRowFullWidth: false,\n disableColumnFilter: false,\n disableColumnMenu: false,\n disableColumnSelector: false,\n disableDensitySelector: false,\n disableMultipleColumnsFiltering: false,\n disableMultipleSelection: false,\n disableMultipleColumnsSorting: false,\n disableSelectionOnClick: false,\n disableVirtualization: false,\n editMode: GridEditModes.Cell,\n filterMode: GridFeatureModeConstant.client,\n headerHeight: 56,\n hideFooter: false,\n hideFooterPagination: false,\n hideFooterRowCount: false,\n hideFooterSelectedRowCount: false,\n logger: console,\n logLevel: process.env.NODE_ENV === 'production' ? 'error' : 'warn',\n pagination: false,\n paginationMode: GridFeatureModeConstant.client,\n rowHeight: 52,\n rowsPerPageOptions: [25, 50, 100],\n rowSpacingType: 'margin',\n showCellRightBorder: false,\n showColumnRightBorder: false,\n sortingOrder: ['asc', 'desc', null],\n sortingMode: GridFeatureModeConstant.client,\n throttleRowsMs: 0,\n disableColumnReorder: false,\n disableColumnResize: false,\n keepNonExistentRowsSelected: false\n};\nexport const useDataGridProps = inProps => {\n if (inProps.pageSize > MAX_PAGE_SIZE) {\n throw new Error(`'props.pageSize' cannot exceed 100 in DataGrid.`);\n }\n\n const themedProps = useThemeProps({\n props: inProps,\n name: 'MuiDataGrid'\n });\n const localeText = React.useMemo(() => _extends({}, GRID_DEFAULT_LOCALE_TEXT, themedProps.localeText), [themedProps.localeText]);\n const components = React.useMemo(() => {\n const overrides = themedProps.components;\n\n if (!overrides) {\n return _extends({}, DATA_GRID_DEFAULT_SLOTS_COMPONENTS);\n }\n\n const mergedComponents = {};\n Object.entries(DATA_GRID_DEFAULT_SLOTS_COMPONENTS).forEach(([key, defaultComponent]) => {\n mergedComponents[key] = overrides[key] === undefined ? defaultComponent : overrides[key];\n });\n return mergedComponents;\n }, [themedProps.components]);\n return React.useMemo(() => _extends({}, DATA_GRID_PROPS_DEFAULT_VALUES, themedProps, {\n localeText,\n components\n }, DATA_GRID_FORCED_PROPS), [themedProps, localeText, components]);\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 { styled } from '@mui/material/styles';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['virtualScroller']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst VirtualScrollerRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'VirtualScroller',\n overridesResolver: (props, styles) => styles.virtualScroller\n})({\n overflow: 'auto',\n // See https://github.com/mui/mui-x/issues/4360\n position: 'relative',\n '@media print': {\n overflow: 'hidden'\n }\n});\nconst GridVirtualScroller = /*#__PURE__*/React.forwardRef(function GridVirtualScroller(props, ref) {\n const {\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(VirtualScrollerRoot, _extends({\n ref: ref,\n className: clsx(classes.root, className)\n }, other));\n});\nexport { GridVirtualScroller };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"className\", \"style\"];\nimport * as React from 'react';\nimport clsx from 'clsx';\nimport { styled } from '@mui/material/styles';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n overflowedContent\n } = ownerState;\n const slots = {\n root: ['virtualScrollerContent', overflowedContent && 'virtualScrollerContent--overflowed']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst VirtualScrollerContentRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'VirtualScrollerContent',\n overridesResolver: (props, styles) => styles.virtualScrollerContent\n})({});\nconst GridVirtualScrollerContent = /*#__PURE__*/React.forwardRef(function GridVirtualScrollerContent(props, ref) {\n const {\n className,\n style\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes,\n overflowedContent: !rootProps.autoHeight && (style == null ? void 0 : style.minHeight) === 'auto'\n };\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(VirtualScrollerContentRoot, _extends({\n ref: ref,\n className: clsx(classes.root, className),\n style: style\n }, other));\n});\nexport { GridVirtualScrollerContent };","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 { styled } from '@mui/material/styles';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['virtualScrollerRenderZone']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst VirtualScrollerRenderZoneRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'VirtualScrollerRenderZone',\n overridesResolver: (props, styles) => styles.virtualScrollerRenderZone\n})({\n position: 'absolute',\n display: 'flex',\n // Prevents margin collapsing when using `getRowSpacing`\n flexDirection: 'column'\n});\nconst GridVirtualScrollerRenderZone = /*#__PURE__*/React.forwardRef(function GridVirtualScrollerRenderZone(props, ref) {\n const {\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(VirtualScrollerRenderZoneRoot, _extends({\n ref: ref,\n className: clsx(classes.root, className)\n }, other));\n});\nexport { GridVirtualScrollerRenderZone };","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"style\"];\nimport * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { useForkRef } from '@mui/material/utils';\nimport { useGridApiContext } from '../../utils/useGridApiContext';\nimport { useGridRootProps } from '../../utils/useGridRootProps';\nimport { useGridSelector } from '../../utils/useGridSelector';\nimport { gridVisibleColumnDefinitionsSelector, gridColumnsTotalWidthSelector, gridColumnPositionsSelector } from '../columns/gridColumnsSelector';\nimport { gridDensityRowHeightSelector } from '../density/densitySelector';\nimport { gridFocusCellSelector, gridTabIndexCellSelector } from '../focus/gridFocusStateSelector';\nimport { gridEditRowsStateSelector } from '../editRows/gridEditRowsSelector';\nimport { useGridVisibleRows } from '../../utils/useGridVisibleRows';\nimport { useGridApiEventHandler } from '../../utils/useGridApiEventHandler';\nimport { clamp } from '../../../utils/utils';\nimport { selectedIdsLookupSelector } from '../selection/gridSelectionSelector';\nimport { gridRowsMetaSelector } from '../rows/gridRowsMetaSelector';\nimport { getFirstNonSpannedColumnToRender } from '../columns/gridColumnsUtils'; // Uses binary search to avoid looping through all possible positions\n\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport function binarySearch(offset, positions, sliceStart = 0, sliceEnd = positions.length) {\n if (positions.length <= 0) {\n return -1;\n }\n\n if (sliceStart >= sliceEnd) {\n return sliceStart;\n }\n\n const pivot = sliceStart + Math.floor((sliceEnd - sliceStart) / 2);\n const itemOffset = positions[pivot];\n return offset <= itemOffset ? binarySearch(offset, positions, sliceStart, pivot) : binarySearch(offset, positions, pivot + 1, sliceEnd);\n}\n\nfunction exponentialSearch(offset, positions, index) {\n let interval = 1;\n\n while (index < positions.length && positions[index] < offset) {\n index += interval;\n interval *= 2;\n }\n\n return binarySearch(offset, positions, Math.floor(index / 2), Math.min(index, positions.length));\n}\n\nexport const getRenderableIndexes = ({\n firstIndex,\n lastIndex,\n buffer,\n minFirstIndex,\n maxLastIndex\n}) => {\n return [clamp(firstIndex - buffer, minFirstIndex, maxLastIndex), clamp(lastIndex + buffer, minFirstIndex, maxLastIndex)];\n};\nexport const useGridVirtualScroller = props => {\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const visibleColumns = useGridSelector(apiRef, gridVisibleColumnDefinitionsSelector);\n const {\n ref,\n disableVirtualization,\n onRenderZonePositioning,\n renderZoneMinColumnIndex = 0,\n renderZoneMaxColumnIndex = visibleColumns.length,\n getRowProps\n } = props;\n const columnPositions = useGridSelector(apiRef, gridColumnPositionsSelector);\n const columnsTotalWidth = useGridSelector(apiRef, gridColumnsTotalWidthSelector);\n const rowHeight = useGridSelector(apiRef, gridDensityRowHeightSelector);\n const cellFocus = useGridSelector(apiRef, gridFocusCellSelector);\n const cellTabIndex = useGridSelector(apiRef, gridTabIndexCellSelector);\n const rowsMeta = useGridSelector(apiRef, gridRowsMetaSelector);\n const editRowsState = useGridSelector(apiRef, gridEditRowsStateSelector);\n const selectedRowsLookup = useGridSelector(apiRef, selectedIdsLookupSelector);\n const currentPage = useGridVisibleRows(apiRef, rootProps);\n const renderZoneRef = React.useRef(null);\n const rootRef = React.useRef(null);\n const handleRef = useForkRef(ref, rootRef);\n const [renderContext, setRenderContext] = React.useState(null);\n const prevRenderContext = React.useRef(renderContext);\n const scrollPosition = React.useRef({\n top: 0,\n left: 0\n });\n const [containerWidth, setContainerWidth] = React.useState(null);\n const prevTotalWidth = React.useRef(columnsTotalWidth);\n const getNearestIndexToRender = React.useCallback(offset => {\n const lastMeasuredIndex = Math.max(0, apiRef.current.unstable_getLastMeasuredRowIndex());\n const allRowsMeasured = lastMeasuredIndex === Infinity;\n\n if (allRowsMeasured || rowsMeta.positions[lastMeasuredIndex] >= offset) {\n // If all rows were measured (when no row has \"auto\" as height) or all rows before the offset\n // were measured, then use a binary search because it's faster.\n return binarySearch(offset, rowsMeta.positions);\n } // Otherwise, use an exponential search.\n // If rows have \"auto\" as height, their positions will be based on estimated heights.\n // In this case, we can skip several steps until we find a position higher than the offset.\n // Inspired by https://github.com/bvaughn/react-virtualized/blob/master/source/Grid/utils/CellSizeAndPositionManager.js\n\n\n return exponentialSearch(offset, rowsMeta.positions, lastMeasuredIndex);\n }, [apiRef, rowsMeta.positions]);\n const computeRenderContext = React.useCallback(() => {\n if (disableVirtualization) {\n return {\n firstRowIndex: 0,\n lastRowIndex: currentPage.rows.length,\n firstColumnIndex: 0,\n lastColumnIndex: visibleColumns.length\n };\n }\n\n const {\n top,\n left\n } = scrollPosition.current; // Clamp the value because the search may return an index out of bounds.\n // In the last index, this is not needed because Array.slice doesn't include it.\n\n const firstRowIndex = Math.min(getNearestIndexToRender(top), rowsMeta.positions.length - 1);\n const lastRowIndex = rootProps.autoHeight ? firstRowIndex + currentPage.rows.length : getNearestIndexToRender(top + rootRef.current.clientHeight);\n let hasRowWithAutoHeight = false;\n let firstColumnIndex = 0;\n let lastColumnIndex = columnPositions.length;\n const [firstRowToRender, lastRowToRender] = getRenderableIndexes({\n firstIndex: firstRowIndex,\n lastIndex: lastRowIndex,\n minFirstIndex: 0,\n maxLastIndex: currentPage.rows.length,\n buffer: rootProps.rowBuffer\n });\n\n for (let i = firstRowToRender; i < lastRowToRender && !hasRowWithAutoHeight; i += 1) {\n const row = currentPage.rows[i];\n hasRowWithAutoHeight = apiRef.current.unstable_rowHasAutoHeight(row.id);\n }\n\n if (!hasRowWithAutoHeight) {\n firstColumnIndex = binarySearch(left, columnPositions);\n lastColumnIndex = binarySearch(left + containerWidth, columnPositions);\n }\n\n return {\n firstRowIndex,\n lastRowIndex,\n firstColumnIndex,\n lastColumnIndex\n };\n }, [disableVirtualization, getNearestIndexToRender, rowsMeta.positions.length, rootProps.autoHeight, rootProps.rowBuffer, currentPage.rows, columnPositions, visibleColumns.length, apiRef, containerWidth]);\n React.useEffect(() => {\n if (disableVirtualization) {\n renderZoneRef.current.style.transform = `translate3d(0px, 0px, 0px)`;\n } else {\n // TODO a scroll reset should not be necessary\n rootRef.current.scrollLeft = 0;\n rootRef.current.scrollTop = 0;\n }\n }, [disableVirtualization]);\n React.useEffect(() => {\n setContainerWidth(rootRef.current.clientWidth);\n }, [rowsMeta.currentPageTotalHeight]);\n const handleResize = React.useCallback(() => {\n if (rootRef.current) {\n setContainerWidth(rootRef.current.clientWidth);\n }\n }, []);\n useGridApiEventHandler(apiRef, 'resize', handleResize);\n const updateRenderZonePosition = React.useCallback(nextRenderContext => {\n const [firstRowToRender, lastRowToRender] = getRenderableIndexes({\n firstIndex: nextRenderContext.firstRowIndex,\n lastIndex: nextRenderContext.lastRowIndex,\n minFirstIndex: 0,\n maxLastIndex: currentPage.rows.length,\n buffer: rootProps.rowBuffer\n });\n const [initialFirstColumnToRender] = getRenderableIndexes({\n firstIndex: nextRenderContext.firstColumnIndex,\n lastIndex: nextRenderContext.lastColumnIndex,\n minFirstIndex: renderZoneMinColumnIndex,\n maxLastIndex: renderZoneMaxColumnIndex,\n buffer: rootProps.columnBuffer\n });\n const firstColumnToRender = getFirstNonSpannedColumnToRender({\n firstColumnToRender: initialFirstColumnToRender,\n apiRef,\n firstRowToRender,\n lastRowToRender,\n visibleRows: currentPage.rows\n });\n const top = gridRowsMetaSelector(apiRef.current.state).positions[firstRowToRender];\n const left = gridColumnPositionsSelector(apiRef)[firstColumnToRender]; // Call directly the selector because it might be outdated when this method is called\n\n renderZoneRef.current.style.transform = `translate3d(${left}px, ${top}px, 0px)`;\n\n if (typeof onRenderZonePositioning === 'function') {\n onRenderZonePositioning({\n top,\n left\n });\n }\n }, [apiRef, currentPage.rows, onRenderZonePositioning, renderZoneMinColumnIndex, renderZoneMaxColumnIndex, rootProps.columnBuffer, rootProps.rowBuffer]);\n React.useLayoutEffect(() => {\n if (renderContext) {\n updateRenderZonePosition(renderContext);\n }\n }, [renderContext, updateRenderZonePosition]);\n const updateRenderContext = React.useCallback(nextRenderContext => {\n setRenderContext(nextRenderContext);\n prevRenderContext.current = nextRenderContext;\n }, [setRenderContext, prevRenderContext]);\n React.useEffect(() => {\n if (containerWidth == null) {\n return;\n }\n\n const initialRenderContext = computeRenderContext();\n updateRenderContext(initialRenderContext);\n const {\n top,\n left\n } = scrollPosition.current;\n const params = {\n top,\n left,\n renderContext: initialRenderContext\n };\n apiRef.current.publishEvent('rowsScroll', params);\n }, [apiRef, computeRenderContext, containerWidth, updateRenderContext]);\n\n const handleScroll = event => {\n const {\n scrollTop,\n scrollLeft\n } = event.currentTarget;\n scrollPosition.current.top = scrollTop;\n scrollPosition.current.left = scrollLeft; // On iOS and macOS, negative offsets are possible when swiping past the start\n\n if (scrollLeft < 0 || scrollTop < 0 || !prevRenderContext.current) {\n return;\n } // When virtualization is disabled, the context never changes during scroll\n\n\n const nextRenderContext = disableVirtualization ? prevRenderContext.current : computeRenderContext();\n const topRowsScrolledSincePreviousRender = Math.abs(nextRenderContext.firstRowIndex - prevRenderContext.current.firstRowIndex);\n const bottomRowsScrolledSincePreviousRender = Math.abs(nextRenderContext.lastRowIndex - prevRenderContext.current.lastRowIndex);\n const topColumnsScrolledSincePreviousRender = Math.abs(nextRenderContext.firstColumnIndex - prevRenderContext.current.firstColumnIndex);\n const bottomColumnsScrolledSincePreviousRender = Math.abs(nextRenderContext.lastColumnIndex - prevRenderContext.current.lastColumnIndex);\n const shouldSetState = topRowsScrolledSincePreviousRender >= rootProps.rowThreshold || bottomRowsScrolledSincePreviousRender >= rootProps.rowThreshold || topColumnsScrolledSincePreviousRender >= rootProps.columnThreshold || bottomColumnsScrolledSincePreviousRender >= rootProps.columnThreshold || prevTotalWidth.current !== columnsTotalWidth; // TODO v6: rename event to a wider name, it's not only fired for row scrolling\n\n apiRef.current.publishEvent('rowsScroll', {\n top: scrollTop,\n left: scrollLeft,\n renderContext: shouldSetState ? nextRenderContext : prevRenderContext.current\n }, event);\n\n if (shouldSetState) {\n // Prevents batching render context changes\n ReactDOM.flushSync(() => {\n updateRenderContext(nextRenderContext);\n });\n prevTotalWidth.current = columnsTotalWidth;\n }\n };\n\n const handleWheel = event => {\n apiRef.current.publishEvent('virtualScrollerWheel', {}, event);\n };\n\n const handleTouchMove = event => {\n apiRef.current.publishEvent('virtualScrollerTouchMove', {}, event);\n };\n\n const getRows = (params = {\n renderContext\n }) => {\n const {\n renderContext: nextRenderContext,\n minFirstColumn = renderZoneMinColumnIndex,\n maxLastColumn = renderZoneMaxColumnIndex,\n availableSpace = containerWidth,\n ignoreAutoHeight\n } = params;\n\n if (!currentPage.range || !nextRenderContext || availableSpace == null) {\n return null;\n }\n\n const rowBuffer = !disableVirtualization ? rootProps.rowBuffer : 0;\n const columnBuffer = !disableVirtualization ? rootProps.columnBuffer : 0;\n const [firstRowToRender, lastRowToRender] = getRenderableIndexes({\n firstIndex: nextRenderContext.firstRowIndex,\n lastIndex: nextRenderContext.lastRowIndex,\n minFirstIndex: 0,\n maxLastIndex: currentPage.rows.length,\n buffer: rowBuffer\n });\n const renderedRows = [];\n\n for (let i = firstRowToRender; i < lastRowToRender; i += 1) {\n const row = currentPage.rows[i];\n renderedRows.push(row);\n apiRef.current.unstable_calculateColSpan({\n rowId: row.id,\n minFirstColumn,\n maxLastColumn\n });\n }\n\n const [initialFirstColumnToRender, lastColumnToRender] = getRenderableIndexes({\n firstIndex: nextRenderContext.firstColumnIndex,\n lastIndex: nextRenderContext.lastColumnIndex,\n minFirstIndex: minFirstColumn,\n maxLastIndex: maxLastColumn,\n buffer: columnBuffer\n });\n const firstColumnToRender = getFirstNonSpannedColumnToRender({\n firstColumnToRender: initialFirstColumnToRender,\n apiRef,\n firstRowToRender,\n lastRowToRender,\n visibleRows: currentPage.rows\n });\n const renderedColumns = visibleColumns.slice(firstColumnToRender, lastColumnToRender);\n const rows = [];\n\n for (let i = 0; i < renderedRows.length; i += 1) {\n var _rootProps$components;\n\n const {\n id,\n model\n } = renderedRows[i];\n const lastVisibleRowIndex = firstRowToRender + i === currentPage.rows.length - 1;\n const baseRowHeight = !apiRef.current.unstable_rowHasAutoHeight(id) || ignoreAutoHeight ? apiRef.current.unstable_getRowHeight(id) : 'auto';\n let isSelected;\n\n if (selectedRowsLookup[id] == null) {\n isSelected = false;\n } else if (typeof rootProps.isRowSelectable === 'function') {\n isSelected = rootProps.isRowSelectable(apiRef.current.getRowParams(id));\n } else {\n isSelected = true;\n }\n\n rows.push( /*#__PURE__*/_jsx(rootProps.components.Row, _extends({\n row: model,\n rowId: id,\n rowHeight: baseRowHeight,\n cellFocus: cellFocus // TODO move to inside the row\n ,\n cellTabIndex: cellTabIndex // TODO move to inside the row\n ,\n editRowsState: editRowsState // TODO move to inside the row\n ,\n renderedColumns: renderedColumns,\n visibleColumns: visibleColumns,\n firstColumnToRender: firstColumnToRender,\n lastColumnToRender: lastColumnToRender,\n selected: isSelected,\n index: currentPage.range.firstRowIndex + firstRowToRender + i,\n containerWidth: availableSpace,\n isLastVisible: lastVisibleRowIndex\n }, typeof getRowProps === 'function' ? getRowProps(id, model) : {}, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.row), id));\n }\n\n return rows;\n };\n\n const needsHorizontalScrollbar = containerWidth && columnsTotalWidth > containerWidth;\n const contentSize = React.useMemo(() => {\n // In cases where the columns exceed the available width,\n // the horizontal scrollbar should be shown even when there're no rows.\n // Keeping 1px as minimum height ensures that the scrollbar will visible if necessary.\n const height = Math.max(rowsMeta.currentPageTotalHeight, 1);\n let shouldExtendContent = false;\n\n if (rootRef != null && rootRef.current && height <= (rootRef == null ? void 0 : rootRef.current.clientHeight)) {\n shouldExtendContent = true;\n }\n\n const size = {\n width: needsHorizontalScrollbar ? columnsTotalWidth : 'auto',\n height,\n minHeight: shouldExtendContent ? '100%' : 'auto'\n };\n\n if (rootProps.autoHeight && currentPage.rows.length === 0) {\n size.height = 2 * rowHeight; // Give room to show the overlay when there's no row.\n }\n\n return size;\n }, [rootRef, columnsTotalWidth, rowsMeta.currentPageTotalHeight, currentPage.rows.length, needsHorizontalScrollbar, rootProps.autoHeight, rowHeight]);\n React.useEffect(() => {\n apiRef.current.publishEvent('virtualScrollerContentSizeChange');\n }, [apiRef, contentSize]);\n\n if (rootProps.autoHeight && currentPage.rows.length === 0) {\n contentSize.height = 2 * rowHeight; // Give room to show the overlay when there no rows.\n }\n\n const rootStyle = {};\n\n if (!needsHorizontalScrollbar) {\n rootStyle.overflowX = 'hidden';\n }\n\n if (rootProps.autoHeight) {\n rootStyle.overflowY = 'hidden';\n }\n\n const getRenderContext = React.useCallback(() => {\n return prevRenderContext.current;\n }, []);\n apiRef.current.unstable_getRenderContext = getRenderContext;\n return {\n renderContext,\n updateRenderZonePosition,\n getRows,\n getRootProps: (_ref = {}) => {\n let {\n style = {}\n } = _ref,\n other = _objectWithoutPropertiesLoose(_ref, _excluded);\n\n return _extends({\n ref: handleRef,\n onScroll: handleScroll,\n onWheel: handleWheel,\n onTouchMove: handleTouchMove,\n style: _extends({}, style, rootStyle)\n }, other);\n },\n getContentProps: ({\n style = {}\n } = {}) => ({\n style: _extends({}, style, contentSize)\n }),\n getRenderZoneProps: () => ({\n ref: renderZoneRef\n })\n };\n};","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"className\", \"disableVirtualization\"];\nimport * as React from 'react';\nimport { GridVirtualScroller } from './virtualization/GridVirtualScroller';\nimport { GridVirtualScrollerContent } from './virtualization/GridVirtualScrollerContent';\nimport { GridVirtualScrollerRenderZone } from './virtualization/GridVirtualScrollerRenderZone';\nimport { useGridVirtualScroller } from '../hooks/features/virtualization/useGridVirtualScroller';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst DataGridVirtualScroller = /*#__PURE__*/React.forwardRef(function DataGridVirtualScroller(props, ref) {\n const {\n className,\n disableVirtualization\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const {\n getRootProps,\n getContentProps,\n getRenderZoneProps,\n getRows\n } = useGridVirtualScroller({\n ref,\n disableVirtualization\n });\n return /*#__PURE__*/_jsx(GridVirtualScroller, _extends({\n className: className\n }, getRootProps(other), {\n children: /*#__PURE__*/_jsx(GridVirtualScrollerContent, _extends({}, getContentProps(), {\n children: /*#__PURE__*/_jsx(GridVirtualScrollerRenderZone, _extends({}, getRenderZoneProps(), {\n children: getRows()\n }))\n }))\n }));\n});\nexport { DataGridVirtualScroller };","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/material';\nimport Badge from '@mui/material/Badge';\nimport IconButton from '@mui/material/IconButton';\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\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n icon: ['sortIcon']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nfunction getIcon(icons, direction, className, sortingOrder) {\n let Icon;\n const iconProps = {};\n\n if (direction === 'asc') {\n Icon = icons.ColumnSortedAscendingIcon;\n } else if (direction === 'desc') {\n Icon = icons.ColumnSortedDescendingIcon;\n } else {\n Icon = icons.ColumnUnsortedIcon;\n iconProps.sortingOrder = sortingOrder;\n }\n\n return Icon ? /*#__PURE__*/_jsx(Icon, _extends({\n fontSize: \"small\",\n className: className\n }, iconProps)) : null;\n}\n\nfunction GridColumnHeaderSortIconRaw(props) {\n const {\n direction,\n index,\n sortingOrder\n } = props;\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n\n const ownerState = _extends({}, props, {\n classes: rootProps.classes\n });\n\n const classes = useUtilityClasses(ownerState);\n const iconElement = getIcon(rootProps.components, direction, classes.icon, sortingOrder);\n\n if (!iconElement) {\n return null;\n }\n\n const iconButton = /*#__PURE__*/_jsx(IconButton, {\n tabIndex: -1,\n \"aria-label\": apiRef.current.getLocaleText('columnHeaderSortIconLabel'),\n title: apiRef.current.getLocaleText('columnHeaderSortIconLabel'),\n size: \"small\",\n children: iconElement\n });\n\n return /*#__PURE__*/_jsxs(GridIconButtonContainer, {\n children: [index != null && /*#__PURE__*/_jsx(Badge, {\n badgeContent: index,\n color: \"default\",\n children: iconButton\n }), index == null && iconButton]\n });\n}\n\nconst GridColumnHeaderSortIcon = /*#__PURE__*/React.memo(GridColumnHeaderSortIconRaw);\nprocess.env.NODE_ENV !== \"production\" ? GridColumnHeaderSortIconRaw.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 direction: PropTypes.oneOf(['asc', 'desc']),\n index: PropTypes.number,\n sortingOrder: PropTypes.arrayOf(PropTypes.oneOf(['asc', 'desc'])).isRequired\n} : void 0;\nexport { GridColumnHeaderSortIcon };","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/material';\nimport { styled } from '@mui/material/styles';\nimport { isOverflown } from '../../utils/domUtils';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['columnHeaderTitle']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst GridColumnHeaderTitleRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'ColumnHeaderTitle',\n overridesResolver: (props, styles) => styles.columnHeaderTitle\n})(({\n theme\n}) => ({\n textOverflow: 'ellipsis',\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n fontWeight: theme.typography.fontWeightMedium\n}));\nconst ColumnHeaderInnerTitle = /*#__PURE__*/React.forwardRef(function ColumnHeaderInnerTitle(props, ref) {\n const {\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(GridColumnHeaderTitleRoot, _extends({\n ref: ref,\n className: clsx(classes.root, className)\n }, other));\n});\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$components;\n\n const {\n label,\n description,\n columnWidth\n } = props;\n const rootProps = useGridRootProps();\n const titleRef = React.useRef(null);\n const [tooltip, setTooltip] = React.useState('');\n React.useEffect(() => {\n if (!description && titleRef && titleRef.current) {\n const isOver = isOverflown(titleRef.current);\n\n if (isOver) {\n setTooltip(label);\n } else {\n setTooltip('');\n }\n }\n }, [titleRef, columnWidth, description, label]);\n return /*#__PURE__*/_jsx(rootProps.components.BaseTooltip, _extends({\n title: description || tooltip\n }, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.baseTooltip, {\n children: /*#__PURE__*/_jsx(ColumnHeaderInnerTitle, {\n ref: titleRef,\n children: label\n })\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 = [\"resizable\", \"resizing\", \"height\", \"side\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport { capitalize } from '@mui/material/utils';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nvar GridColumnHeaderSeparatorSides;\n\n(function (GridColumnHeaderSeparatorSides) {\n GridColumnHeaderSeparatorSides[\"Left\"] = \"left\";\n GridColumnHeaderSeparatorSides[\"Right\"] = \"right\";\n})(GridColumnHeaderSeparatorSides || (GridColumnHeaderSeparatorSides = {}));\n\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};\n\nfunction GridColumnHeaderSeparatorRaw(props) {\n const {\n height,\n side = GridColumnHeaderSeparatorSides.Right\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const rootProps = useGridRootProps();\n\n const ownerState = _extends({}, props, {\n side,\n classes: rootProps.classes\n });\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.showColumnRightBorder ? 0 : 1\n }\n }, other, {\n onClick: stopClick,\n children: /*#__PURE__*/_jsx(rootProps.components.ColumnResizeIcon, {\n className: classes.icon\n })\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 * as React from 'react';\nimport { unstable_composeClasses as composeClasses } from '@mui/material';\nimport IconButton from '@mui/material/IconButton';\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\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n open\n } = ownerState;\n const slots = {\n root: ['menuIcon', open && 'menuOpen'],\n button: ['menuIconButton']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nexport const ColumnHeaderMenuIcon = /*#__PURE__*/React.memo(props => {\n const {\n column,\n open,\n columnMenuId,\n columnMenuButtonId,\n iconButtonRef\n } = props;\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n\n const ownerState = _extends({}, props, {\n classes: rootProps.classes\n });\n\n const classes = useUtilityClasses(ownerState);\n const handleMenuIconClick = React.useCallback(event => {\n event.preventDefault();\n event.stopPropagation();\n apiRef.current.toggleColumnMenu(column.field);\n }, [apiRef, column.field]);\n return /*#__PURE__*/_jsx(\"div\", {\n className: classes.root,\n children: /*#__PURE__*/_jsx(IconButton, {\n ref: iconButtonRef,\n tabIndex: -1,\n className: classes.button,\n \"aria-label\": apiRef.current.getLocaleText('columnMenuLabel'),\n title: apiRef.current.getLocaleText('columnMenuLabel'),\n size: \"small\",\n onClick: handleMenuIconClick,\n \"aria-expanded\": open ? 'true' : undefined,\n \"aria-haspopup\": \"true\",\n \"aria-controls\": columnMenuId,\n id: columnMenuButtonId,\n children: /*#__PURE__*/_jsx(rootProps.components.ColumnMenuIcon, {\n fontSize: \"small\"\n })\n })\n });\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { HTMLElementType } from '@mui/utils';\nimport { useGridApiContext } from '../../../hooks/utils/useGridApiContext';\nimport { GridMenu } from '../GridMenu';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nfunction GridColumnHeaderMenu({\n columnMenuId,\n columnMenuButtonId,\n ContentComponent,\n contentComponentProps,\n field,\n open,\n target,\n onExited\n}) {\n const apiRef = useGridApiContext();\n const currentColumn = apiRef.current.getColumn(field);\n const hideMenu = React.useCallback(event => {\n // Prevent triggering the sorting\n event.stopPropagation();\n apiRef.current.hideColumnMenu();\n }, [apiRef]);\n\n if (!target) {\n return null;\n }\n\n return /*#__PURE__*/_jsx(GridMenu, {\n placement: `bottom-${currentColumn.align === 'right' ? 'start' : 'end'}`,\n open: open,\n target: target,\n onClickAway: hideMenu,\n onExited: onExited,\n children: /*#__PURE__*/_jsx(ContentComponent, _extends({\n currentColumn: currentColumn,\n hideMenu: hideMenu,\n open: open,\n id: columnMenuId,\n labelledby: columnMenuButtonId\n }, contentComponentProps))\n });\n}\n\nprocess.env.NODE_ENV !== \"production\" ? GridColumnHeaderMenu.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 columnMenuButtonId: PropTypes.string,\n columnMenuId: PropTypes.string,\n ContentComponent: PropTypes.elementType.isRequired,\n contentComponentProps: PropTypes.any,\n field: PropTypes.string.isRequired,\n onExited: PropTypes.func,\n open: PropTypes.bool.isRequired,\n target: HTMLElementType\n} : void 0;\nexport { GridColumnHeaderMenu };","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 } from '@mui/material';\nimport { unstable_useId as useId } from '@mui/material/utils';\nimport { useGridApiContext } from '../../hooks/utils/useGridApiContext';\nimport { GridColumnHeaderSortIcon } from './GridColumnHeaderSortIcon';\nimport { GridColumnHeaderTitle } from './GridColumnHeaderTitle';\nimport { GridColumnHeaderSeparator } from './GridColumnHeaderSeparator';\nimport { ColumnHeaderMenuIcon } from './ColumnHeaderMenuIcon';\nimport { GridColumnHeaderMenu } from '../menu/columnMenu/GridColumnHeaderMenu';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n column,\n classes,\n isDragging,\n sortDirection,\n showRightBorder,\n filterItemsCounter\n } = ownerState;\n const isColumnSorted = sortDirection != null;\n const isColumnFiltered = filterItemsCounter != null && filterItemsCounter > 0; // todo refactor to a prop on col isNumeric or ?? ie: coltype===price wont work\n\n const isColumnNumeric = column.type === 'number';\n const slots = {\n root: ['columnHeader', column.headerAlign === 'left' && 'columnHeader--alignLeft', column.headerAlign === 'center' && 'columnHeader--alignCenter', column.headerAlign === 'right' && 'columnHeader--alignRight', column.sortable && 'columnHeader--sortable', isDragging && 'columnHeader--moving', isColumnSorted && 'columnHeader--sorted', isColumnFiltered && 'columnHeader--filtered', isColumnNumeric && 'columnHeader--numeric', showRightBorder && 'withBorder'],\n draggableContainer: ['columnHeaderDraggableContainer'],\n titleContainer: ['columnHeaderTitleContainer'],\n titleContainerContent: ['columnHeaderTitleContainerContent']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nfunction GridColumnHeaderItem(props) {\n var _apiRef$current$getRo, _column$sortingOrder, _rootProps$components, _column$headerName, _rootProps$components2;\n\n const {\n column,\n columnMenuOpen,\n colIndex,\n headerHeight,\n isResizing,\n isLastColumn,\n sortDirection,\n sortIndex,\n filterItemsCounter,\n hasFocus,\n tabIndex,\n extendRowFullWidth,\n disableReorder,\n separatorSide\n } = props;\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const headerCellRef = React.useRef(null);\n const columnMenuId = useId();\n const columnMenuButtonId = useId();\n const iconButtonRef = React.useRef(null);\n const [showColumnMenuIcon, setShowColumnMenuIcon] = React.useState(columnMenuOpen);\n const {\n hasScrollX,\n hasScrollY\n } = (_apiRef$current$getRo = apiRef.current.getRootDimensions()) != null ? _apiRef$current$getRo : {\n hasScrollX: false,\n hasScrollY: false\n };\n const isDraggable = React.useMemo(() => !rootProps.disableColumnReorder && !disableReorder && !column.disableReorder, [rootProps.disableColumnReorder, disableReorder, column.disableReorder]);\n let headerComponent = null;\n\n if (column.renderHeader) {\n headerComponent = column.renderHeader(apiRef.current.getColumnHeaderParams(column.field));\n }\n\n const publish = React.useCallback(eventName => event => {\n // Ignore portal\n // See https://github.com/mui/mui-x/issues/1721\n if (!event.currentTarget.contains(event.target)) {\n return;\n }\n\n apiRef.current.publishEvent(eventName, apiRef.current.getColumnHeaderParams(column.field), event);\n }, [apiRef, column.field]);\n const mouseEventsHandlers = {\n onClick: publish('columnHeaderClick'),\n onDoubleClick: publish('columnHeaderDoubleClick'),\n onMouseOver: publish('columnHeaderOver'),\n // TODO remove as it's not used\n onMouseOut: publish('columnHeaderOut'),\n // TODO remove as it's not used\n onMouseEnter: publish('columnHeaderEnter'),\n // TODO remove as it's not used\n onMouseLeave: publish('columnHeaderLeave'),\n // TODO remove as it's not used\n onKeyDown: publish('columnHeaderKeyDown'),\n onFocus: publish('columnHeaderFocus'),\n onBlur: publish('columnHeaderBlur')\n };\n const draggableEventHandlers = isDraggable ? {\n onDragStart: publish('columnHeaderDragStart'),\n onDragEnter: publish('columnHeaderDragEnter'),\n onDragOver: publish('columnHeaderDragOver'),\n onDragEnd: publish('columnHeaderDragEnd')\n } : null;\n const removeLastBorderRight = isLastColumn && hasScrollX && !hasScrollY;\n const showRightBorder = !isLastColumn ? rootProps.showColumnRightBorder : !removeLastBorderRight && !extendRowFullWidth;\n\n const ownerState = _extends({}, props, {\n classes: rootProps.classes,\n showRightBorder\n });\n\n const classes = useUtilityClasses(ownerState);\n const width = column.computedWidth;\n let ariaSort = 'none';\n\n if (sortDirection != null) {\n ariaSort = sortDirection === 'asc' ? 'ascending' : 'descending';\n }\n\n React.useEffect(() => {\n if (!showColumnMenuIcon) {\n setShowColumnMenuIcon(columnMenuOpen);\n }\n }, [showColumnMenuIcon, columnMenuOpen]);\n const handleExited = React.useCallback(() => {\n setShowColumnMenuIcon(false);\n }, []);\n\n const columnMenuIconButton = !rootProps.disableColumnMenu && !column.disableColumnMenu && /*#__PURE__*/_jsx(ColumnHeaderMenuIcon, {\n column: column,\n columnMenuId: columnMenuId,\n columnMenuButtonId: columnMenuButtonId,\n open: showColumnMenuIcon,\n iconButtonRef: iconButtonRef\n });\n\n const sortingOrder = (_column$sortingOrder = column.sortingOrder) != null ? _column$sortingOrder : rootProps.sortingOrder;\n\n const columnTitleIconButtons = /*#__PURE__*/_jsxs(React.Fragment, {\n children: [!rootProps.disableColumnFilter && /*#__PURE__*/_jsx(rootProps.components.ColumnHeaderFilterIconButton, _extends({\n field: column.field,\n counter: filterItemsCounter\n }, (_rootProps$components = rootProps.componentsProps) == null ? void 0 : _rootProps$components.columnHeaderFilterIconButton)), column.sortable && !column.hideSortIcons && /*#__PURE__*/_jsx(GridColumnHeaderSortIcon, {\n direction: sortDirection,\n index: sortIndex,\n sortingOrder: sortingOrder\n })]\n });\n\n React.useLayoutEffect(() => {\n const columnMenuState = apiRef.current.state.columnMenu;\n\n if (hasFocus && !columnMenuState.open) {\n const focusableElement = headerCellRef.current.querySelector('[tabindex=\"0\"]');\n const elementToFocus = focusableElement || headerCellRef.current;\n elementToFocus == null ? void 0 : elementToFocus.focus();\n apiRef.current.columnHeadersContainerElementRef.current.scrollLeft = 0;\n }\n }, [apiRef, hasFocus]);\n const headerClassName = typeof column.headerClassName === 'function' ? column.headerClassName({\n field: column.field,\n colDef: column\n }) : column.headerClassName;\n const label = (_column$headerName = column.headerName) != null ? _column$headerName : column.field;\n return /*#__PURE__*/_jsxs(\"div\", _extends({\n ref: headerCellRef,\n className: clsx(classes.root, headerClassName),\n \"data-field\": column.field,\n style: {\n width,\n minWidth: width,\n maxWidth: width\n },\n role: \"columnheader\",\n tabIndex: tabIndex,\n \"aria-colindex\": colIndex + 1,\n \"aria-sort\": ariaSort,\n \"aria-label\": column.renderHeader && headerComponent == null ? label : undefined\n }, mouseEventsHandlers, {\n children: [/*#__PURE__*/_jsxs(\"div\", _extends({\n className: classes.draggableContainer,\n draggable: isDraggable\n }, draggableEventHandlers, {\n children: [/*#__PURE__*/_jsxs(\"div\", {\n className: classes.titleContainer,\n children: [/*#__PURE__*/_jsx(\"div\", {\n className: classes.titleContainerContent,\n children: column.renderHeader ? headerComponent : /*#__PURE__*/_jsx(GridColumnHeaderTitle, {\n label: label,\n description: column.description,\n columnWidth: width\n })\n }), columnTitleIconButtons]\n }), columnMenuIconButton]\n })), /*#__PURE__*/_jsx(GridColumnHeaderSeparator, {\n resizable: !rootProps.disableColumnResize && !!column.resizable,\n resizing: isResizing,\n height: headerHeight,\n onMouseDown: publish('columnSeparatorMouseDown'),\n side: separatorSide\n }), /*#__PURE__*/_jsx(GridColumnHeaderMenu, {\n columnMenuId: columnMenuId,\n columnMenuButtonId: columnMenuButtonId,\n field: column.field,\n open: columnMenuOpen,\n target: iconButtonRef.current,\n ContentComponent: rootProps.components.ColumnMenu,\n contentComponentProps: (_rootProps$components2 = rootProps.componentsProps) == null ? void 0 : _rootProps$components2.columnMenu,\n onExited: handleExited\n })]\n }));\n}\n\nprocess.env.NODE_ENV !== \"production\" ? GridColumnHeaderItem.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 colIndex: PropTypes.number.isRequired,\n column: PropTypes.object.isRequired,\n columnMenuOpen: PropTypes.bool.isRequired,\n disableReorder: PropTypes.bool,\n extendRowFullWidth: PropTypes.bool.isRequired,\n filterItemsCounter: PropTypes.number,\n hasFocus: PropTypes.bool,\n headerHeight: PropTypes.number.isRequired,\n isDragging: PropTypes.bool.isRequired,\n isLastColumn: PropTypes.bool.isRequired,\n isResizing: PropTypes.bool.isRequired,\n separatorSide: PropTypes.oneOf(['left', 'right']),\n sortDirection: PropTypes.oneOf(['asc', 'desc']),\n sortIndex: PropTypes.number,\n tabIndex: PropTypes.oneOf([-1, 0]).isRequired\n} : void 0;\nexport { GridColumnHeaderItem };","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { useForkRef } from '@mui/material/utils';\nimport { defaultMemoize } from 'reselect';\nimport { useGridApiContext } from '../../utils/useGridApiContext';\nimport { useGridSelector } from '../../utils/useGridSelector';\nimport { gridVisibleColumnDefinitionsSelector, gridColumnPositionsSelector } from '../columns/gridColumnsSelector';\nimport { gridTabIndexColumnHeaderSelector, gridTabIndexCellSelector, gridFocusColumnHeaderSelector } from '../focus/gridFocusStateSelector';\nimport { gridDensityHeaderHeightSelector } from '../density/densitySelector';\nimport { gridFilterActiveItemsLookupSelector } from '../filter/gridFilterSelector';\nimport { gridSortColumnLookupSelector } from '../sorting/gridSortingSelector';\nimport { gridColumnMenuSelector } from '../columnMenu/columnMenuSelector';\nimport { useGridRootProps } from '../../utils/useGridRootProps';\nimport { useGridApiEventHandler } from '../../utils/useGridApiEventHandler';\nimport { GridColumnHeaderItem } from '../../../components/columnHeaders/GridColumnHeaderItem';\nimport { getFirstColumnIndexToRender } from '../columns/gridColumnsUtils';\nimport { useGridVisibleRows } from '../../utils/useGridVisibleRows';\nimport { getRenderableIndexes } from '../virtualization/useGridVirtualScroller';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nfunction isUIEvent(event) {\n return !!event.target;\n}\n\nexport const useGridColumnHeaders = props => {\n const {\n innerRef: innerRefProp,\n minColumnIndex = 0\n } = props;\n const [dragCol, setDragCol] = React.useState('');\n const [resizeCol, setResizeCol] = React.useState('');\n const apiRef = useGridApiContext();\n const visibleColumns = useGridSelector(apiRef, gridVisibleColumnDefinitionsSelector);\n const columnPositions = useGridSelector(apiRef, gridColumnPositionsSelector);\n const tabIndexState = useGridSelector(apiRef, gridTabIndexColumnHeaderSelector);\n const cellTabIndexState = useGridSelector(apiRef, gridTabIndexCellSelector);\n const columnHeaderFocus = useGridSelector(apiRef, gridFocusColumnHeaderSelector);\n const headerHeight = useGridSelector(apiRef, gridDensityHeaderHeightSelector);\n const filterColumnLookup = useGridSelector(apiRef, gridFilterActiveItemsLookupSelector);\n const sortColumnLookup = useGridSelector(apiRef, gridSortColumnLookupSelector);\n const columnMenuState = useGridSelector(apiRef, gridColumnMenuSelector);\n const rootProps = useGridRootProps();\n const innerRef = React.useRef(null);\n const handleInnerRef = useForkRef(innerRefProp, innerRef);\n const [renderContext, setRenderContext] = React.useState(null);\n const prevRenderContext = React.useRef(renderContext);\n const prevScrollLeft = React.useRef(0);\n const currentPage = useGridVisibleRows(apiRef, rootProps);\n React.useEffect(() => {\n apiRef.current.columnHeadersContainerElementRef.current.scrollLeft = 0;\n }, [apiRef]); // memoize `getFirstColumnIndexToRender`, since it's called on scroll\n\n const getFirstColumnIndexToRenderRef = React.useRef(defaultMemoize(getFirstColumnIndexToRender, {\n equalityCheck: (a, b) => ['firstColumnIndex', 'minColumnIndex', 'columnBuffer'].every(key => a[key] === b[key])\n }));\n const updateInnerPosition = React.useCallback(nextRenderContext => {\n const [firstRowToRender, lastRowToRender] = getRenderableIndexes({\n firstIndex: nextRenderContext.firstRowIndex,\n lastIndex: nextRenderContext.lastRowIndex,\n minFirstIndex: 0,\n maxLastIndex: currentPage.rows.length,\n buffer: rootProps.rowBuffer\n });\n const firstColumnToRender = getFirstColumnIndexToRenderRef.current({\n firstColumnIndex: nextRenderContext.firstColumnIndex,\n minColumnIndex,\n columnBuffer: rootProps.columnBuffer,\n firstRowToRender,\n lastRowToRender,\n apiRef,\n visibleRows: currentPage.rows\n });\n const offset = firstColumnToRender > 0 ? prevScrollLeft.current - columnPositions[firstColumnToRender] : prevScrollLeft.current;\n innerRef.current.style.transform = `translate3d(${-offset}px, 0px, 0px)`;\n }, [columnPositions, minColumnIndex, rootProps.columnBuffer, apiRef, currentPage.rows, rootProps.rowBuffer]);\n React.useLayoutEffect(() => {\n if (renderContext) {\n updateInnerPosition(renderContext);\n }\n }, [renderContext, updateInnerPosition]);\n const handleScroll = React.useCallback(({\n left,\n renderContext: nextRenderContext = null\n }, event) => {\n var _prevRenderContext$cu, _prevRenderContext$cu2;\n\n if (!innerRef.current) {\n return;\n } // Ignore vertical scroll.\n // Excepts the first event which sets the previous render context.\n\n\n if (prevScrollLeft.current === left && ((_prevRenderContext$cu = prevRenderContext.current) == null ? void 0 : _prevRenderContext$cu.firstColumnIndex) === (nextRenderContext == null ? void 0 : nextRenderContext.firstColumnIndex) && ((_prevRenderContext$cu2 = prevRenderContext.current) == null ? void 0 : _prevRenderContext$cu2.lastColumnIndex) === (nextRenderContext == null ? void 0 : nextRenderContext.lastColumnIndex)) {\n return;\n }\n\n prevScrollLeft.current = left; // We can only update the position when we guarantee that the render context has been\n // rendered. This is achieved using ReactDOM.flushSync or when the context doesn't change.\n\n let canUpdateInnerPosition = false;\n\n if (nextRenderContext !== prevRenderContext.current || !prevRenderContext.current) {\n // ReactDOM.flushSync cannot be called on `scroll` events fired inside effects\n if (isUIEvent(event)) {\n // To prevent flickering, the inner position can only be updated after the new context has\n // been rendered. ReactDOM.flushSync ensures that the state changes will happen before\n // updating the position.\n ReactDOM.flushSync(() => {\n setRenderContext(nextRenderContext);\n });\n canUpdateInnerPosition = true;\n } else {\n setRenderContext(nextRenderContext);\n }\n\n prevRenderContext.current = nextRenderContext;\n } else {\n canUpdateInnerPosition = true;\n } // Pass directly the render context to avoid waiting for the next render\n\n\n if (nextRenderContext && canUpdateInnerPosition) {\n updateInnerPosition(nextRenderContext);\n }\n }, [updateInnerPosition]);\n const handleColumnResizeStart = React.useCallback(params => setResizeCol(params.field), []);\n const handleColumnResizeStop = React.useCallback(() => setResizeCol(''), []);\n const handleColumnReorderStart = React.useCallback(params => setDragCol(params.field), []);\n const handleColumnReorderStop = React.useCallback(() => setDragCol(''), []);\n useGridApiEventHandler(apiRef, 'columnResizeStart', handleColumnResizeStart);\n useGridApiEventHandler(apiRef, 'columnResizeStop', handleColumnResizeStop);\n useGridApiEventHandler(apiRef, 'columnHeaderDragStart', handleColumnReorderStart);\n useGridApiEventHandler(apiRef, 'columnHeaderDragEnd', handleColumnReorderStop);\n useGridApiEventHandler(apiRef, 'rowsScroll', handleScroll);\n\n const getColumns = (params, other = {}) => {\n const {\n renderContext: nextRenderContext = renderContext,\n minFirstColumn = minColumnIndex,\n maxLastColumn = visibleColumns.length\n } = params || {};\n\n if (!nextRenderContext) {\n return null;\n }\n\n const columns = [];\n const [firstRowToRender, lastRowToRender] = getRenderableIndexes({\n firstIndex: nextRenderContext.firstRowIndex,\n lastIndex: nextRenderContext.lastRowIndex,\n minFirstIndex: 0,\n maxLastIndex: currentPage.rows.length,\n buffer: rootProps.rowBuffer\n });\n const firstColumnToRender = getFirstColumnIndexToRenderRef.current({\n firstColumnIndex: nextRenderContext.firstColumnIndex,\n minColumnIndex: minFirstColumn,\n columnBuffer: rootProps.columnBuffer,\n apiRef,\n firstRowToRender,\n lastRowToRender,\n visibleRows: currentPage.rows\n });\n const lastColumnToRender = Math.min(nextRenderContext.lastColumnIndex + rootProps.columnBuffer, maxLastColumn);\n const renderedColumns = visibleColumns.slice(firstColumnToRender, lastColumnToRender);\n\n for (let i = 0; i < renderedColumns.length; i += 1) {\n const column = renderedColumns[i];\n const columnIndex = firstColumnToRender + i;\n const isFirstColumn = columnIndex === 0;\n const hasTabbableElement = !(tabIndexState === null && cellTabIndexState === null);\n const tabIndex = tabIndexState !== null && tabIndexState.field === column.field || isFirstColumn && !hasTabbableElement ? 0 : -1;\n const hasFocus = columnHeaderFocus !== null && columnHeaderFocus.field === column.field;\n const open = columnMenuState.open && columnMenuState.field === column.field;\n columns.push( /*#__PURE__*/_jsx(GridColumnHeaderItem, _extends({}, sortColumnLookup[column.field], {\n columnMenuOpen: open,\n filterItemsCounter: filterColumnLookup[column.field] && filterColumnLookup[column.field].length,\n headerHeight: headerHeight,\n isDragging: column.field === dragCol,\n column: column,\n colIndex: columnIndex,\n isResizing: resizeCol === column.field,\n isLastColumn: columnIndex === visibleColumns.length - 1,\n extendRowFullWidth: !rootProps.disableExtendRowFullWidth,\n hasFocus: hasFocus,\n tabIndex: tabIndex\n }, other), column.field));\n }\n\n return columns;\n };\n\n const rootStyle = {\n minHeight: headerHeight,\n maxHeight: headerHeight,\n lineHeight: `${headerHeight}px`\n };\n return {\n renderContext,\n getColumns,\n isDragging: !!dragCol,\n getRootProps: (other = {}) => _extends({\n style: rootStyle\n }, other),\n getInnerProps: () => ({\n ref: handleInnerRef,\n 'aria-rowindex': 1,\n role: 'row'\n })\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 } from '@mui/material';\nimport { styled } from '@mui/material/styles';\nimport { useGridApiEventHandler } from '../hooks/utils/useGridApiEventHandler';\nimport { useGridApiContext } from '../hooks/utils/useGridApiContext';\nimport { getDataGridUtilityClass, gridClasses } from '../constants/gridClasses';\nimport { useGridRootProps } from '../hooks/utils/useGridRootProps';\nimport { gridDensityHeaderHeightSelector } from '../hooks/features/density/densitySelector';\nimport { useGridSelector } from '../hooks/utils/useGridSelector';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst CLIFF = 1;\nconst SLOP = 1.5;\n\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};\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}));\n\nfunction GridScrollAreaRaw(props) {\n const {\n scrollDirection\n } = props;\n const rootRef = React.useRef(null);\n const apiRef = useGridApiContext();\n const timeout = React.useRef();\n const [dragging, setDragging] = React.useState(false);\n const height = useGridSelector(apiRef, gridDensityHeaderHeightSelector);\n const scrollPosition = React.useRef({\n left: 0,\n top: 0\n });\n const rootProps = useGridRootProps();\n\n const ownerState = _extends({}, props, {\n classes: rootProps.classes\n });\n\n const classes = useUtilityClasses(ownerState);\n const handleScrolling = React.useCallback(newScrollPosition => {\n scrollPosition.current = newScrollPosition;\n }, []);\n const handleDragOver = React.useCallback(event => {\n let offset;\n\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\n offset = (offset - CLIFF) * SLOP + CLIFF;\n clearTimeout(timeout.current); // Avoid freeze and inertia.\n\n timeout.current = setTimeout(() => {\n apiRef.current.scroll({\n left: scrollPosition.current.left + offset,\n top: scrollPosition.current.top\n });\n });\n }, [scrollDirection, apiRef]);\n React.useEffect(() => {\n return () => {\n clearTimeout(timeout.current);\n };\n }, []);\n const toggleDragging = React.useCallback(() => {\n setDragging(prevDragging => !prevDragging);\n }, []);\n useGridApiEventHandler(apiRef, 'rowsScroll', handleScrolling);\n useGridApiEventHandler(apiRef, 'columnHeaderDragStart', toggleDragging);\n useGridApiEventHandler(apiRef, 'columnHeaderDragEnd', toggleDragging);\n return dragging ? /*#__PURE__*/_jsx(GridScrollAreaRawRoot, {\n ref: rootRef,\n className: clsx(classes.root),\n onDragOver: handleDragOver,\n style: {\n height\n }\n }) : null;\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 _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/material';\nimport { styled, alpha, lighten, darken } from '@mui/material/styles';\nimport { getDataGridUtilityClass } from '../../constants/gridClasses';\nimport { useGridRootProps } from '../../hooks/utils/useGridRootProps';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\n\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['columnHeaders']\n };\n return composeClasses(slots, getDataGridUtilityClass, classes);\n};\n\nconst GridColumnHeadersRoot = styled('div', {\n name: 'MuiDataGrid',\n slot: 'ColumnHeaders',\n overridesResolver: (props, styles) => styles.columnHeaders\n})(({\n theme\n}) => {\n const borderColor = theme.palette.mode === 'light' ? lighten(alpha(theme.palette.divider, 1), 0.88) : darken(alpha(theme.palette.divider, 1), 0.68);\n return {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n overflow: 'hidden',\n display: 'flex',\n alignItems: 'center',\n borderBottom: `1px solid ${borderColor}`,\n borderTopLeftRadius: theme.shape.borderRadius,\n borderTopRightRadius: theme.shape.borderRadius\n };\n});\nexport const GridColumnHeaders = /*#__PURE__*/React.forwardRef(function GridColumnHeaders(props, ref) {\n const {\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const rootProps = useGridRootProps();\n const ownerState = {\n classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(GridColumnHeadersRoot, _extends({\n ref: ref,\n className: clsx(className, classes.root)\n }, other));\n});","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/material';\nimport { styled } from '@mui/material/styles';\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\";\n\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};\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: 'center',\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\n const {\n isDragging,\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const apiRef = useGridApiContext();\n const rootProps = useGridRootProps();\n const ownerState = {\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 classes: rootProps.classes\n };\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(GridColumnHeadersInnerRoot, _extends({\n ref: ref,\n className: clsx(className, classes.root)\n }, other));\n});","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"innerRef\", \"className\"];\nimport * as React from 'react';\nimport { useGridColumnHeaders } from '../hooks/features/columnHeaders/useGridColumnHeaders';\nimport { GridScrollArea } from './GridScrollArea';\nimport { GridColumnHeaders } from './columnHeaders/GridColumnHeaders';\nimport { GridColumnHeadersInner } from './columnHeaders/GridColumnHeadersInner';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nexport const DataGridColumnHeaders = /*#__PURE__*/React.forwardRef(function GridColumnsHeader(props, ref) {\n const {\n innerRef\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n const {\n isDragging,\n getRootProps,\n getInnerProps,\n getColumns\n } = useGridColumnHeaders({\n innerRef\n });\n return /*#__PURE__*/_jsxs(GridColumnHeaders, _extends({\n ref: ref\n }, getRootProps(other), {\n children: [/*#__PURE__*/_jsx(GridScrollArea, {\n scrollDirection: \"left\"\n }), /*#__PURE__*/_jsx(GridColumnHeadersInner, _extends({\n isDragging: isDragging\n }, getInnerProps(), {\n children: getColumns()\n })), /*#__PURE__*/_jsx(GridScrollArea, {\n scrollDirection: \"right\"\n })]\n }));\n});","import * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { chainPropTypes } from '@mui/utils';\nimport { GridBody, GridErrorHandler, GridFooterPlaceholder, GridHeaderPlaceholder, GridRoot } from '../components';\nimport { GridContextProvider } from '../context/GridContextProvider';\nimport { useDataGridComponent } from './useDataGridComponent';\nimport { useDataGridProps, MAX_PAGE_SIZE } from './useDataGridProps';\nimport { DataGridVirtualScroller } from '../components/DataGridVirtualScroller';\nimport { DataGridColumnHeaders } from '../components/DataGridColumnHeaders';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst DataGridRaw = /*#__PURE__*/React.forwardRef(function DataGrid(inProps, ref) {\n const props = useDataGridProps(inProps);\n const apiRef = useDataGridComponent(props);\n return /*#__PURE__*/_jsx(GridContextProvider, {\n apiRef: apiRef,\n props: props,\n children: /*#__PURE__*/_jsx(GridRoot, {\n className: props.className,\n style: props.style,\n sx: props.sx,\n ref: ref,\n children: /*#__PURE__*/_jsxs(GridErrorHandler, {\n children: [/*#__PURE__*/_jsx(GridHeaderPlaceholder, {}), /*#__PURE__*/_jsx(GridBody, {\n ColumnHeadersComponent: DataGridColumnHeaders,\n VirtualScrollerComponent: DataGridVirtualScroller\n }), /*#__PURE__*/_jsx(GridFooterPlaceholder, {})]\n })\n })\n });\n});\nexport const DataGrid = /*#__PURE__*/React.memo(DataGridRaw);\nDataGridRaw.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 /**\n * The label of the grid.\n */\n 'aria-label': PropTypes.string,\n\n /**\n * The id of the element containing a label for the grid.\n */\n 'aria-labelledby': PropTypes.string,\n\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 /**\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 /**\n * Controls the modes of the cells.\n */\n cellModesModel: PropTypes.object,\n\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 /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n\n /**\n * Number of extra columns to be rendered before/after the visible slice.\n * @default 3\n */\n columnBuffer: PropTypes.number,\n\n /**\n * Set of columns of type [[GridColumns]].\n */\n columns: chainPropTypes(PropTypes.array.isRequired, props => {\n // @ts-ignore because otherwise `build:api` doesn't work\n if (props.columns && props.columns.some(column => column.resizable)) {\n return new Error([`MUI: \\`column.resizable = true\\` is not a valid prop.`, 'Column resizing is not available in the MIT version.', '', 'You need to upgrade to the DataGridPro component to unlock this feature.'].join('\\n'));\n }\n\n return null;\n }),\n\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 /**\n * Extend native column types with your new column types.\n */\n columnTypes: PropTypes.object,\n\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 /**\n * Overrideable components.\n */\n components: PropTypes.object,\n\n /**\n * Overrideable components props dynamically passed to the component at rendering.\n */\n componentsProps: PropTypes.object,\n\n /**\n * Set the density of the grid.\n * @default \"standard\"\n */\n density: PropTypes.oneOf(['comfortable', 'compact', 'standard']),\n\n /**\n * If `true`, column filters are disabled.\n * @default false\n */\n disableColumnFilter: PropTypes.bool,\n\n /**\n * If `true`, the column menu is disabled.\n * @default false\n */\n disableColumnMenu: PropTypes.bool,\n\n /**\n * If `true`, hiding/showing columns is disabled.\n * @default false\n */\n disableColumnSelector: PropTypes.bool,\n\n /**\n * If `true`, the density selector is disabled.\n * @default false\n */\n disableDensitySelector: PropTypes.bool,\n\n /**\n * If `true`, rows will not be extended to fill the full width of the grid container.\n * @default false\n */\n disableExtendRowFullWidth: PropTypes.bool,\n\n /**\n * If `true`, the selection on click on a row or cell is disabled.\n * @default false\n */\n disableSelectionOnClick: PropTypes.bool,\n\n /**\n * If `true`, the virtualization is disabled.\n * @default false\n */\n disableVirtualization: PropTypes.bool,\n\n /**\n * Controls whether to use the cell or row editing.\n * @default \"cell\"\n */\n editMode: PropTypes.oneOf(['cell', 'row']),\n\n /**\n * Set the edit rows model of the grid.\n */\n editRowsModel: PropTypes.object,\n\n /**\n * An error that will turn the grid into its error state and display the error component.\n */\n error: PropTypes.any,\n\n /**\n * Features under development.\n * For each feature, if the flag is not explicitly set to `true`, the feature will be fully disabled and any property / method call will not have any effect.\n */\n experimentalFeatures: PropTypes.shape({\n newEditingApi: PropTypes.bool,\n preventCommitWhileValidating: PropTypes.bool,\n warnIfFocusStateIsNotSynced: PropTypes.bool\n }),\n\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: PropTypes.oneOf(['client', 'server']),\n\n /**\n * Set the filter model of the grid.\n */\n filterModel: PropTypes.shape({\n items: PropTypes.arrayOf(PropTypes.shape({\n columnField: PropTypes.string.isRequired,\n id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),\n operatorValue: PropTypes.string,\n value: PropTypes.any\n })).isRequired,\n linkOperator: PropTypes.oneOf(['and', 'or']),\n quickFilterLogicOperator: PropTypes.oneOf(['and', 'or']),\n quickFilterValues: PropTypes.array\n }),\n\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 /**\n * Function that returns the element to render in row detail.\n * @param {GridRowParams} params With all properties from [[GridRowParams]].\n * @returns {JSX.Element} The row detail element.\n */\n getDetailPanelContent: PropTypes.func,\n\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 /**\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 /**\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 /**\n * Return the id of a given [[GridRowModel]].\n */\n getRowId: PropTypes.func,\n\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 /**\n * Set the height in pixel of the column headers in the grid.\n * @default 56\n */\n headerHeight: PropTypes.number,\n\n /**\n * If `true`, the footer component is hidden.\n * @default false\n */\n hideFooter: PropTypes.bool,\n\n /**\n * If `true`, the pagination component in the footer is hidden.\n * @default false\n */\n hideFooterPagination: PropTypes.bool,\n\n /**\n * If `true`, the selected row count in the footer is hidden.\n * @default false\n */\n hideFooterSelectedRowCount: PropTypes.bool,\n\n /**\n * The initial state of the DataGrid.\n * The data in it will be set in the state on initialization but will not be 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 /**\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 /**\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 /**\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 /**\n * If `true`, a loading overlay is displayed.\n */\n loading: PropTypes.bool,\n\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 /**\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 /**\n * Allows to pass the logging level or false to turn off logging.\n * @default \"debug\"\n */\n logLevel: PropTypes.oneOf(['debug', 'error', 'info', 'warn', false]),\n\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 /**\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 /**\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 /**\n * Callback fired when the cell changes are committed.\n * @param {GridCellEditCommitParams} params With all properties from [[GridCellEditCommitParams]].\n * @param {MuiEvent} event The event that caused this prop to be called.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onCellEditCommit: PropTypes.func,\n\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 /**\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 /**\n * Callback fired when a cell loses focus.\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 onCellFocusOut: PropTypes.func,\n\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 /**\n * Callback fired when the `cellModesModel` prop changes.\n * @param {GridCellModesModel} cellModesModel Object containig which cells are in \"edit\" mode.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onCellModesModelChange: PropTypes.func,\n\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 /**\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 /**\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 /**\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 /**\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 /**\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 /**\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 /**\n * Callback fired when a column visibility changes.\n * Only works when no `columnVisibilityModel` is provided and if we change the visibility of a single column at a time.\n * @param {GridColumnVisibilityChangeParams} params With all properties from [[GridColumnVisibilityChangeParams]].\n * @param {MuiEvent<{}>} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n * @deprecated Use `onColumnVisibilityModelChange` instead.\n */\n onColumnVisibilityChange: PropTypes.func,\n\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 /**\n * Callback fired when the edit cell value changes.\n * @param {GridEditCellPropsParams} params With all properties from [[GridEditCellPropsParams]].\n * @param {MuiEvent} event The event that caused this prop to be called.\n * @param {GridCallbackDetails} details Additional details for this callback.\n * @deprecated use `preProcessEditCellProps` from the [`GridColDef`](/x/api/data-grid/grid-col-def/)\n */\n onEditCellPropsChange: PropTypes.func,\n\n /**\n * Callback fired when the `editRowsModel` changes.\n * @param {GridEditRowsModel} editRowsModel With all properties from [[GridEditRowsModel]].\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onEditRowsModelChange: PropTypes.func,\n\n /**\n * Callback fired when an exception is thrown in the grid.\n * @param {any} args The arguments passed to the `showError` call.\n * @param {MuiEvent<{}>} event The event object.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onError: PropTypes.func,\n\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 /**\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 /**\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 /**\n * Callback fired when the current page has changed.\n * @param {number} page Index of the page displayed on the Grid.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onPageChange: PropTypes.func,\n\n /**\n * Callback fired when the page size has changed.\n * @param {number} pageSize Size of the page displayed on the Grid.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onPageSizeChange: PropTypes.func,\n\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 /**\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 /**\n * Callback called when `processRowUpdate` throws an error or rejects.\n * @param {any} error The error thrown.\n */\n onProcessRowUpdateError: PropTypes.func,\n\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 /**\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 /**\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 /**\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 /**\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 /**\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 /**\n * Callback fired when the `rowModesModel` prop changes.\n * @param {GridRowModesModel} rowModesModel Object containig which rows are in \"edit\" mode.\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onRowModesModelChange: PropTypes.func,\n\n /**\n * Callback fired when the selection state of one or multiple rows changes.\n * @param {GridSelectionModel} selectionModel With all the row ids [[GridSelectionModel]].\n * @param {GridCallbackDetails} details Additional details for this callback.\n */\n onSelectionModelChange: PropTypes.func,\n\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 /**\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 * @internal\n */\n onStateChange: PropTypes.func,\n\n /**\n * The zero-based index of the current page.\n * @default 0\n */\n page: PropTypes.number,\n\n /**\n * Set the number of rows in one page.\n * If some of the rows have children (for instance in the tree data), this number represents the amount of top level rows wanted on each page.\n * @default 100\n */\n pageSize: chainPropTypes(PropTypes.number, props => {\n if (props.pageSize && props.pageSize > MAX_PAGE_SIZE) {\n return new Error([`MUI: \\`\\` is not a valid prop.`, `Only page size below ${MAX_PAGE_SIZE} is available in the MIT version.`, '', 'You need to upgrade to the DataGridPro component to unlock this feature.'].join('\\n'));\n }\n\n return null;\n }),\n pagination: props => {\n if (props.pagination === false) {\n return new Error(['MUI: `` is not a valid prop.', 'Infinite scrolling is not available in the MIT version.', '', 'You need to upgrade to the DataGridPro component to disable the pagination.'].join('\\n'));\n }\n\n return null;\n },\n\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 /**\n * Callback called before updating a row with new values in the row and cell editing.\n * Only applied if `props.experimentalFeatures.newEditingApi: true`.\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 /**\n * Number of extra rows to be rendered before/after the visible slice.\n * @default 3\n */\n rowBuffer: PropTypes.number,\n\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 /**\n * Set the height in pixel of a row in the grid.\n * @default 52\n */\n rowHeight: PropTypes.number,\n\n /**\n * Controls the modes of the rows.\n */\n rowModesModel: PropTypes.object,\n\n /**\n * Set of rows of type [[GridRowsProp]].\n */\n rows: PropTypes.array.isRequired,\n\n /**\n * Sets the type of space between rows added by `getRowSpacing`.\n * @default \"margin\"\n */\n rowSpacingType: PropTypes.oneOf(['border', 'margin']),\n\n /**\n * Select the pageSize dynamically using the component UI.\n * @default [25, 50, 100]\n */\n rowsPerPageOptions: PropTypes.arrayOf(PropTypes.number),\n\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 /**\n * Override the height/width of the grid inner scrollbar.\n */\n scrollbarSize: PropTypes.number,\n\n /**\n * Set the selection model of the grid.\n */\n selectionModel: chainPropTypes(PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.array]), props => {\n if (!props.checkboxSelection && Array.isArray(props.selectionModel) && props.selectionModel.length > 1) {\n return new Error([`MUI: \\`\\` is not a valid prop.`, 'selectionModel can only be of 1 item in DataGrid.', '', 'You need to upgrade to the DataGridPro component to unlock multiple selection.'].join('\\n'));\n }\n\n return null;\n }),\n\n /**\n * If `true`, the right border of the cells are displayed.\n * @default false\n */\n showCellRightBorder: PropTypes.bool,\n\n /**\n * If `true`, the right border of the column headers are displayed.\n * @default false\n */\n showColumnRightBorder: PropTypes.bool,\n\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 /**\n * The order of the sorting sequence.\n * @default ['asc', 'desc', null]\n */\n sortingOrder: PropTypes.arrayOf(PropTypes.oneOf(['asc', 'desc'])),\n\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 /**\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};","export default function chainPropTypes(propType1, propType2) {\n if (process.env.NODE_ENV === 'production') {\n return () => null;\n }\n return function validate(...args) {\n return propType1(...args) || propType2(...args);\n };\n}","import styled from \"@emotion/styled\";\nimport {Box} from \"@mui/material\";\n\nexport const IGTableWrapper = styled(Box)`\n display: flex;\n height: 100%;\n flex-grow: 1;\n \n .ig-table--header {\n background: #e7e6e9;\n }\n`;","import React, {FC} from \"react\";\nimport {\n gridPageCountSelector,\n gridPageSelector,\n gridPageSizeSelector,\n useGridApiContext,\n useGridSelector,\n} from \"@mui/x-data-grid\";\nimport {Box, FormControl, InputLabel, MenuItem, Pagination, PaginationItem, Select} from \"@mui/material\";\n\nexport interface IGTablePaginationProps {\n disabledNext?: boolean\n disabledPrev?: boolean\n paginationType?: \"single\" | \"multiple\"\n pageSizes?: number[]\n}\n\nconst IGTablePagination: FC = ({\n disabledNext,\n disabledPrev,\n paginationType,\n pageSizes,\n}) => {\n const apiRef = useGridApiContext();\n const page = useGridSelector(apiRef, gridPageSelector);\n const pageCount = useGridSelector(apiRef, gridPageCountSelector);\n const pageSize = useGridSelector(apiRef, gridPageSizeSelector);\n\n const defaultPageSizes = [10, 25, 50];\n\n return (\n \n \n \n Rows Per Page\n {\n if (apiRef && apiRef.current) {\n apiRef.current.setPageSize(Number(event.target.value));\n }\n }}\n >\n {(pageSizes || defaultPageSizes).map((pageSize) => (\n \n ))}\n \n \n \n \n {paginationType === \"single\" && (\n <>\n {\n if (apiRef && apiRef.current) apiRef.current.setPage(page - 1);\n }}\n />\n \n {\n if (apiRef && apiRef.current) apiRef.current.setPage(page + 1);\n }}\n />\n \n )}\n {paginationType === \"multiple\" && (\n \n apiRef && apiRef.current?.setPage(value - 1)\n }\n />\n )}\n \n \n );\n};\n\nexport default IGTablePagination;","import React, {useMemo} from \"react\";\nimport {Box, capitalize, LinearProgress} from \"@mui/material\";\nimport {\n DataGrid,\n DataGridProps,\n GridColumns,\n GridRowsProp,\n GridValidRowModel,\n useGridApiContext,\n} from \"@mui/x-data-grid\";\nimport {IGTableWrapper} from \"./style\";\nimport IGTablePagination, {IGTablePaginationProps} from \"./IGTablePagination\";\n\nexport interface IGTableColsInterface\n extends GridColumns {}\n\nexport interface IGTableRowsInterface extends GridRowsProp {}\n\ninterface IGTableProps\n extends Partial, \"onRowClick\">>,\n IGTablePaginationProps {\n tableCols: IGTableColsInterface;\n tableData: IGTableRowsInterface;\n selectedRowId?: number;\n pagination?: true | undefined;\n page?: number;\n pageSizes?: number[];\n onPageChange?: (newPage: number) => void;\n totalRows?: number;\n pageSize?: number;\n loading?: boolean;\n onRowClick?: (row: T) => void;\n onPageSizeChange?: (pageSize: number) => void;\n}\n\n/**\n * General Table component which uses mui 5 data grid as Base.\n * @param tableCols\n * @param tableData\n * @param selectedRowId\n * @param loading\n * @param pagination\n * @param page\n * @param totalRows\n * @param pageSize\n * @param pageSizes\n * @param onPageSizeChange\n * @param onRowClick\n * @param onPageChange\n * @param disabledNext\n * @param disabledPrev\n * @param components\n * @param paginationType\n * @param props\n * @constructor\n */\nfunction IGTable({\n tableCols = [],\n tableData = [],\n selectedRowId = 0,\n loading = false,\n pagination = undefined,\n page = 0,\n totalRows = tableData.length,\n pageSize = 10,\n pageSizes = [10, 25, 50],\n onPageSizeChange,\n onRowClick,\n onPageChange,\n disabledNext,\n disabledPrev,\n components,\n paginationType = \"multiple\",\n ...props\n}: IGTableProps) {\n const [isPageSizeChanged, setIsPageSizeChanged] = React.useState(false);\n const tableColumns: IGTableColsInterface = useMemo(() => {\n return tableCols.map((col) => {\n const updatedCol = {\n flex: 1,\n disableColumnMenu: true,\n headerClassName: \"ig-table--header\",\n ...col,\n };\n // Render \"-\" if value not found\n if (!(\"renderCell\" in col)) {\n updatedCol.renderCell = ({value}) => (\n <>{value ? capitalize(String(value).toLowerCase()) : \"-\"}\n );\n }\n return updatedCol;\n });\n }, [tableCols]);\n\n // calculate totalRowCount based on paginationType as this is required for pagination to work\n const rowCount = useMemo(() => {\n if (tableData.length === 0) return 0;\n if (paginationType === \"single\") {\n return tableData.length === pageSize\n ? pageSize * page + 1\n : pageSize * (page - 1) + tableData.length;\n }\n return totalRows;\n }, [page, pageSize, totalRows, tableData, paginationType]);\n\n return (\n \n \n \n autoHeight\n loading={loading}\n columns={tableColumns}\n rows={tableData}\n paginationMode=\"server\"\n page={page - 1}\n pageSize={pageSize}\n onPageSizeChange={(newPageSize) => {\n setIsPageSizeChanged(true);\n onPageSizeChange && onPageSizeChange(newPageSize);\n }}\n rowCount={rowCount}\n onPageChange={(newPage) => {\n // Refer: https://github.com/mui/mui-x/issues/3516\n // onPageChange is called when page size is changed\n // This is a workaround to avoid calling onPageChange twice\n // because we are using server side pagination\n if (isPageSizeChanged) {\n setIsPageSizeChanged(false);\n return;\n }\n onPageChange && onPageChange(newPage + 1);\n }}\n selectionModel={[selectedRowId]}\n onRowClick={({row}) => onRowClick && onRowClick(row)}\n hideFooterSelectedRowCount={true}\n headerHeight={32}\n components={{\n LoadingOverlay: LinearProgress,\n Pagination: (params) => {\n const apiRef = useGridApiContext();\n\n if (!(apiRef && apiRef.current && apiRef.current.windowRef)) return <>;\n return (\n \n );\n },\n ...components,\n }}\n {...props}\n />\n \n \n );\n}\n\nexport default IGTable;\n","import React, {FC} from \"react\";\nimport {IconButton, TextField, TextFieldProps} from \"@mui/material\";\nimport {CloseRounded} from \"@mui/icons-material\";\n\ntype IGTextFieldProps = {\n name: string\n value: unknown\n touched?: boolean\n clearable?: boolean\n onClear?: () => void\n} & TextFieldProps;\n\nconst IGTextField: FC = ({\n name,\n value,\n onChange,\n onBlur,\n id,\n label,\n InputProps,\n onClear,\n variant = \"outlined\",\n type = \"text\",\n size = \"small\",\n fullWidth = true,\n error = false,\n helperText = \"\",\n touched = false,\n clearable = false,\n sx={},\n ...rest\n}) => {\n\n const onCloseButtonClick = (e: any) => {\n e.preventDefault();\n e.stopPropagation();\n if (onClear) {\n onClear();\n return;\n }\n if (onChange && e.target) {\n onChange(\n {\n target: {\n ...e.target,\n value: \"\",\n name: name,\n },\n } as React.ChangeEvent,\n );\n }\n };\n\n return (\n e.target instanceof HTMLElement && e.target.blur()}\n helperText={error ? (touched && helperText) : helperText}\n InputProps={{\n ...InputProps,\n endAdornment: InputProps?.endAdornment\n ? InputProps.endAdornment\n : (clearable && value) ? (\n \n \n \n ) : <>,\n }}\n sx={{\n ...sx,\n \"& legend\": {display: label ? \"block\" : \"none\"},\n \"& fieldset\": {top: label ? -5 : 0},\n }}\n {...rest}\n />\n );\n};\n\nexport default IGTextField;\n","import styled from \"@emotion/styled\";\nimport {Box} from \"@mui/material\";\n\ninterface DocViewContainerProps {\n customzIndex?: number;\n}\n\nconst DocViewContainer = styled(Box)`\n display: flex;\n flex-direction: column;\n position: relative;\n z-index: ${({customzIndex}) => customzIndex};\n`;\n\nconst DocViewHeader = styled(Box)`\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 0.5rem;\n font-size: 1rem;\n font-weight: bold;\n cursor: move;\n`;\n\nconst ImageWrapper = styled.img`\n // max-height: 50vh;\n // max-width: 50vh;\n overflow: visible;\n`;\n\nconst ImageContainer = styled.div`\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n\nexport {DocViewContainer, DocViewHeader, ImageContainer, ImageWrapper};\n","// eslint-disable-next-line @typescript-eslint/no-use-before-define\nimport React, {CSSProperties, useRef, useState} from \"react\";\nimport LeftIcon from \"@mui/icons-material/RotateLeftOutlined\";\nimport RightIcon from \"@mui/icons-material/RotateRightOutlined\";\nimport {IconButton} from \"@mui/material\";\nimport {ImageWrapper, ImageContainer, DocViewContainer, DocViewHeader} from \"./styles\";\nimport {Box} from \"@mui/material\";\nimport {Typography} from \"@mui/material\";\n\n//hieght and width are recommended to be equal if rotate\n//hieght and width are supposed to be numeric if zoom\n// src is compulsory\n\ninterface Props {\n zoom: boolean;\n rotate: boolean;\n height: string | number;\n width: string | number;\n src: string;\n imageTitle?: string;\n style?: CSSProperties;\n}\n\nconst ImageComponent = ({\n zoom,\n rotate,\n height,\n width,\n src,\n style,\n imageTitle,\n ...restProps\n}: Props) => {\n const [rotation, setRotation] = useState(0);\n const [isZoom, setZoom] = useState(false);\n const [XY, setXY] = useState({mouseX: 0, mouseY: 0});\n const [customzIndex, setCustomzIndex] = useState(1300);\n\n const rotateRight = () => setRotation(rotation >= 270 ? 0 : rotation + 90);\n\n const rotateLeft = () =>\n setRotation(rotation <= 0 ? rotation + 270 : rotation - 90);\n\n const imageRef = useRef() as React.MutableRefObject<\n HTMLInputElement\n >;\n\n const handleMouseMovement = (e: React.MouseEvent) => {\n if (imageRef.current !== null) {\n const {\n left: offsetLeft,\n top: offsetTop,\n width: actualWidth,\n height: actualHeight,\n } = imageRef.current.getBoundingClientRect();\n let x = ((e.clientX - offsetLeft) / actualWidth) * 100;\n let y = ((e.clientY - offsetTop) / actualHeight) * 100;\n if ((rotation / 90) % 2 === 1) {\n [x, y] = [y, x];\n }\n setXY({\n mouseX: x,\n mouseY: y,\n });\n }\n };\n const {mouseX, mouseY} = XY;\n\n return (\n \n \n {imageTitle}\n {rotate ? (\n \n \n \n \n \n \n \n \n ) : (\n <>\n )}\n \n\n \n setZoom(!!zoom)}\n onMouseOver={() => {setZoom(!!zoom); setCustomzIndex(1310);}}\n onMouseOut={() => {setZoom(false); setCustomzIndex(1300); } }\n onMouseMove={handleMouseMovement}\n\n >\n \n \n
\n \n );\n};\n\nexport default ImageComponent;\n","import styled from \"@emotion/styled\";\n\ninterface Props {\n height?: React.CSSProperties[\"height\"]\n}\n\nconst Container = styled.div`\n min-height: ${({height}) =>\n height === undefined ? \"100%\" : height};\n height: ${({height}) => height};\n\n width: 100%;\n\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n`;\n\nexport default Container;\n","import React, {FC} from \"react\";\nimport {Typography, CircularProgress} from \"@mui/material\";\nimport Container from \"./styles/Container\";\n\ninterface LoadingProps {\n height?: React.CSSProperties[\"height\"]\n loadingMessage?: string\n}\n\nconst IGLoading: FC = ({\n height,\n loadingMessage,\n}: LoadingProps): JSX.Element => (\n \n {loadingMessage && (\n {loadingMessage}\n )}\n \n \n);\n\nIGLoading.defaultProps = {\n height: \"100vh\",\n};\n\nexport default IGLoading;\n","import React, {useMemo} from \"react\";\nimport {Button, ButtonProps, Menu, MenuItem} from \"@mui/material\";\nimport {ArrowDropDown} from \"@mui/icons-material\";\n\nexport interface IGMenuProps {\n open?: boolean\n onClose?: ()=>void\n actionButtonProps: {\n id: string;\n label?: string;\n icon?: JSX.Element;\n variant?: \"text\" | \"outlined\" | \"contained\";\n elem?: (props: any) => JSX.Element;\n onClick?: (event: React.MouseEvent) => any;\n actionBtnIdProp?: string\n anchorElProp?: null | HTMLElement\n } & ButtonProps;\n actionMenuProps: {\n id: string;\n items: {\n id: string;\n label: string;\n renderCondition?: boolean;\n onClick: Function;\n renderElem?: () => JSX.Element;\n menuItemProps?: any;\n }[];\n menuProps?: any;\n };\n}\n\nconst IGMenu: React.FC = ({\n actionMenuProps,\n actionButtonProps,\n open = false,\n onClose,\n}) => {\n const {\n id: buttonId,\n label: buttonLabel,\n icon: buttonIcon,\n elem: buttonElem,\n variant: buttonVariant,\n onClick: onButtonClick,\n actionBtnIdProp,\n anchorElProp,\n } = actionButtonProps;\n const {id: menuId, items: menuItems, menuProps} = actionMenuProps;\n const [anchorEl, setAnchorEl] = React.useState(null);\n const [actionButtonId, setActionButtonId] = React.useState(\n null,\n );\n const isMenuOpen = Boolean(anchorEl) || open;\n const handleActionsClick = (event: React.MouseEvent) => {\n event.preventDefault();\n event.stopPropagation();\n if (onButtonClick) onButtonClick(event);\n setAnchorEl(event.currentTarget);\n setActionButtonId(event.currentTarget.id);\n };\n const handleActionMenuClose = () => {\n setAnchorEl(null);\n if(onClose) {\n onClose();\n }\n };\n\n const filteredMenuItems = useMemo(() => {\n const menuItemsList: JSX.Element[] = [];\n\n menuItems.forEach((menuItem) => {\n const {\n id,\n label,\n renderCondition,\n onClick,\n renderElem,\n menuItemProps,\n } = menuItem;\n\n renderCondition &&\n menuItemsList.push(\n {\n if (onClick) {\n onClick(event);\n handleActionMenuClose();\n }\n }}\n {...menuItemProps}\n >\n {renderElem ? renderElem() : label}\n ,\n );\n });\n\n return menuItemsList;\n }, [menuItems]);\n\n return (\n <>\n {buttonElem ? (\n <>\n {buttonElem({\n id: buttonId,\n \"aria-controls\": isMenuOpen ? menuId : undefined,\n \"aria-haspopup\": \"true\",\n \"aria-expanded\": isMenuOpen ? \"true\" : undefined,\n onClick: handleActionsClick,\n })}\n \n ) : (\n }\n >\n {buttonLabel}\n \n )}\n