@mui/x-data-grid-generator 8.0.0-alpha.10 → 8.0.0-alpha.12

package/esm/renderer/renderEditCountry.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import { GridRenderEditCellParams } from '@mui/x-data-grid-premium';
+import { CountryIsoOption } from "../services/static-data.js";
+export declare function renderEditCountry(params: GridRenderEditCellParams<CountryIsoOption>): React.JSX.Element;

package/esm/renderer/renderEditCountry.js

@@ -0,0 +1,80 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { useGridApiContext } from '@mui/x-data-grid-premium';
+import Autocomplete, { autocompleteClasses } from '@mui/material/Autocomplete';
+import InputBase from '@mui/material/InputBase';
+import Box from '@mui/material/Box';
+import { styled } from '@mui/material/styles';
+import { COUNTRY_ISO_OPTIONS } from "../services/static-data.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createElement as _createElement } from "react";
+const StyledAutocomplete = styled(Autocomplete)(({
+  theme
+}) => ({
+  height: '100%',
+  [`& .${autocompleteClasses.inputRoot}`]: _extends({}, theme.typography.body2, {
+    padding: '1px 0',
+    height: '100%',
+    '& input': {
+      padding: '0 16px',
+      height: '100%'
+    }
+  })
+}));
+function EditCountry(props) {
+  const {
+    id,
+    value,
+    field
+  } = props;
+  const apiRef = useGridApiContext();
+  const handleChange = React.useCallback(async (event, newValue) => {
+    await apiRef.current.setEditCellValue({
+      id,
+      field,
+      value: newValue
+    }, event);
+    apiRef.current.stopCellEditMode({
+      id,
+      field
+    });
+  }, [apiRef, field, id]);
+  return /*#__PURE__*/_jsx(StyledAutocomplete, {
+    value: value,
+    onChange: handleChange,
+    options: COUNTRY_ISO_OPTIONS,
+    getOptionLabel: option => option.label,
+    autoHighlight: true,
+    fullWidth: true,
+    open: true,
+    disableClearable: true,
+    renderOption: (optionProps, option) => /*#__PURE__*/_createElement(Box, _extends({
+      component: "li",
+      sx: {
+        '& > img': {
+          mr: 1.5,
+          flexShrink: 0
+        }
+      }
+    }, optionProps, {
+      key: option.code
+    }), /*#__PURE__*/_jsx("img", {
+      loading: "lazy",
+      width: "20",
+      src: `https://flagcdn.com/w20/${option.code.toLowerCase()}.png`,
+      srcSet: `https://flagcdn.com/w40/${option.code.toLowerCase()}.png 2x`,
+      alt: ""
+    }), option.label),
+    renderInput: params => /*#__PURE__*/_jsx(InputBase, _extends({
+      autoFocus: true,
+      fullWidth: true,
+      id: params.id,
+      inputProps: _extends({}, params.inputProps, {
+        autoComplete: 'new-password' // disable autocomplete and autofill
+      })
+    }, params.InputProps))
+  });
+}
+export function renderEditCountry(params) {
+  return /*#__PURE__*/_jsx(EditCountry, _extends({}, params));
+}

package/esm/renderer/renderEditCurrency.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { GridRenderEditCellParams } from '@mui/x-data-grid-premium';
+export declare function renderEditCurrency(params: GridRenderEditCellParams<any, string>): React.JSX.Element;

package/esm/renderer/renderEditCurrency.js

@@ -0,0 +1,78 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { useGridApiContext } from '@mui/x-data-grid-premium';
+import Autocomplete, { autocompleteClasses } from '@mui/material/Autocomplete';
+import InputBase from '@mui/material/InputBase';
+import Box from '@mui/material/Box';
+import { styled } from '@mui/material/styles';
+import { CURRENCY_OPTIONS } from "../services/static-data.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const StyledAutocomplete = styled(Autocomplete)(({
+  theme
+}) => ({
+  height: '100%',
+  [`& .${autocompleteClasses.inputRoot}`]: _extends({}, theme.typography.body2, {
+    padding: '1px 0',
+    height: '100%',
+    '& input': {
+      padding: '0 16px',
+      height: '100%'
+    }
+  })
+}));
+function EditCurrency(props) {
+  const {
+    id,
+    value,
+    field
+  } = props;
+  const apiRef = useGridApiContext();
+  const handleChange = React.useCallback(async (event, newValue) => {
+    await apiRef.current.setEditCellValue({
+      id,
+      field,
+      value: newValue.toUpperCase()
+    }, event);
+    apiRef.current.stopCellEditMode({
+      id,
+      field
+    });
+  }, [apiRef, field, id]);
+  return /*#__PURE__*/_jsx(StyledAutocomplete, {
+    value: value,
+    onChange: handleChange,
+    options: CURRENCY_OPTIONS,
+    autoHighlight: true,
+    fullWidth: true,
+    open: true,
+    disableClearable: true,
+    renderOption: (optionProps, option) => /*#__PURE__*/_jsxs(Box, _extends({
+      component: "li",
+      sx: {
+        '& > img': {
+          mr: 1.5,
+          flexShrink: 0
+        }
+      }
+    }, optionProps, {
+      children: [/*#__PURE__*/_jsx("img", {
+        loading: "lazy",
+        width: "20",
+        src: `https://flagcdn.com/w20/${option.slice(0, -1).toLowerCase()}.png`,
+        srcSet: `https://flagcdn.com/w40/${option.slice(0, -1).toLowerCase()}.png 2x`,
+        alt: ""
+      }), option]
+    })),
+    renderInput: params => /*#__PURE__*/_jsx(InputBase, _extends({
+      autoFocus: true,
+      fullWidth: true,
+      id: params.id,
+      inputProps: _extends({}, params.inputProps, {
+        autoComplete: 'new-password' // disable autocomplete and autofill
+      })
+    }, params.InputProps))
+  });
+}
+export function renderEditCurrency(params) {
+  return /*#__PURE__*/_jsx(EditCurrency, _extends({}, params));
+}

package/esm/renderer/renderEditIncoterm.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { GridRenderEditCellParams } from '@mui/x-data-grid-premium';
+export declare function renderEditIncoterm(params: GridRenderEditCellParams<any, string | null>): React.JSX.Element;

package/esm/renderer/renderEditIncoterm.js

@@ -0,0 +1,75 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { useGridApiContext } from '@mui/x-data-grid-premium';
+import Select from '@mui/material/Select';
+import MenuItem from '@mui/material/MenuItem';
+import ListItemIcon from '@mui/material/ListItemIcon';
+import ListItemText from '@mui/material/ListItemText';
+import { INCOTERM_OPTIONS } from "../services/static-data.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+function EditIncoterm(props) {
+  const {
+    id,
+    value,
+    field
+  } = props;
+  const apiRef = useGridApiContext();
+  const handleChange = async event => {
+    await apiRef.current.setEditCellValue({
+      id,
+      field,
+      value: event.target.value
+    }, event);
+    apiRef.current.stopCellEditMode({
+      id,
+      field
+    });
+  };
+  const handleClose = (event, reason) => {
+    if (reason === 'backdropClick') {
+      apiRef.current.stopCellEditMode({
+        id,
+        field
+      });
+    }
+  };
+  return /*#__PURE__*/_jsx(Select, {
+    value: value,
+    onChange: handleChange,
+    MenuProps: {
+      onClose: handleClose
+    },
+    sx: {
+      height: '100%',
+      '& .MuiSelect-select': {
+        display: 'flex',
+        alignItems: 'center',
+        pl: 1
+      }
+    },
+    autoFocus: true,
+    fullWidth: true,
+    open: true,
+    children: INCOTERM_OPTIONS.map(option => {
+      const tooltip = option.slice(option.indexOf('(') + 1, option.indexOf(')'));
+      const code = option.slice(0, option.indexOf('(')).trim();
+      return /*#__PURE__*/_jsxs(MenuItem, {
+        value: option,
+        children: [/*#__PURE__*/_jsx(ListItemIcon, {
+          sx: {
+            minWidth: 36
+          },
+          children: code
+        }), /*#__PURE__*/_jsx(ListItemText, {
+          primary: tooltip,
+          sx: {
+            overflow: 'hidden'
+          }
+        })]
+      }, option);
+    })
+  });
+}
+export function renderEditIncoterm(params) {
+  return /*#__PURE__*/_jsx(EditIncoterm, _extends({}, params));
+}

package/esm/renderer/renderEditProgress.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { GridRenderEditCellParams } from '@mui/x-data-grid-premium';
+export declare function renderEditProgress(params: GridRenderEditCellParams<any, number>): React.JSX.Element;

package/{node → esm}/renderer/renderEditProgress.js

@@ -1,22 +1,15 @@
-"use strict";
 'use client';
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.renderEditProgress = renderEditProgress;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var React = _interopRequireWildcard(require("react"));
-var _clsx = _interopRequireDefault(require("clsx"));
-var _xDataGridPremium = require("@mui/x-data-grid-premium");
-var _Slider = _interopRequireWildcard(require("@mui/material/Slider"));
-var _Tooltip = _interopRequireDefault(require("@mui/material/Tooltip"));
-var _utils = require("@mui/utils");
-var _styles = require("@mui/material/styles");
-var _jsxRuntime = require("react/jsx-runtime");
-const StyledSlider = (0, _styles.styled)(_Slider.default)(({
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import clsx from 'clsx';
+import { useGridApiContext } from '@mui/x-data-grid-premium';
+import Slider, { sliderClasses } from '@mui/material/Slider';
+import Tooltip from '@mui/material/Tooltip';
+import { unstable_debounce as debounce } from '@mui/utils';
+import { alpha, styled } from '@mui/material/styles';
+import { jsx as _jsx } from "react/jsx-runtime";
+const StyledSlider = styled(Slider)(({
   theme
 }) => ({
   display: 'flex',
@@ -26,11 +19,11 @@ const StyledSlider = (0, _styles.styled)(_Slider.default)(({
   justifyContent: 'center',
   padding: 0,
   borderRadius: 0,
-  [`& .${_Slider.sliderClasses.rail}`]: {
+  [`& .${sliderClasses.rail}`]: {
     height: '100%',
     backgroundColor: 'transparent'
   },
-  [`& .${_Slider.sliderClasses.track}`]: {
+  [`& .${sliderClasses.track}`]: {
     height: '100%',
     transition: theme.transitions.create('background-color', {
       duration: theme.transitions.duration.shorter
@@ -45,12 +38,12 @@ const StyledSlider = (0, _styles.styled)(_Slider.default)(({
       backgroundColor: '#088208a3'
     }
   },
-  [`& .${_Slider.sliderClasses.thumb}`]: {
+  [`& .${sliderClasses.thumb}`]: {
     height: '100%',
     width: 5,
     borderRadius: 0,
     marginTop: 0,
-    backgroundColor: (0, _styles.alpha)('#000000', 0.2)
+    backgroundColor: alpha('#000000', 0.2)
   }
 }));
 function ValueLabelComponent(props) {
@@ -59,7 +52,7 @@ function ValueLabelComponent(props) {
     open,
     value
   } = props;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
+  return /*#__PURE__*/_jsx(Tooltip, {
     open: open,
     enterTouchDelay: 0,
     placement: "top",
@@ -74,7 +67,7 @@ function EditProgress(props) {
     field
   } = props;
   const [valueState, setValueState] = React.useState(Number(value));
-  const apiRef = (0, _xDataGridPremium.useGridApiContext)();
+  const apiRef = useGridApiContext();
   const updateCellEditProps = React.useCallback(newValue => {
     apiRef.current.setEditCellValue({
       id,
@@ -82,7 +75,7 @@ function EditProgress(props) {
       value: newValue
     });
   }, [apiRef, field, id]);
-  const debouncedUpdateCellEditProps = React.useMemo(() => (0, _utils.unstable_debounce)(updateCellEditProps, 60), [updateCellEditProps]);
+  const debouncedUpdateCellEditProps = React.useMemo(() => debounce(updateCellEditProps, 60), [updateCellEditProps]);
   const handleChange = (event, newValue) => {
     setValueState(newValue);
     debouncedUpdateCellEditProps(newValue);
@@ -95,10 +88,10 @@ function EditProgress(props) {
       element.querySelector('[type="range"]').focus();
     }
   };
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledSlider, {
+  return /*#__PURE__*/_jsx(StyledSlider, {
     ref: handleRef,
     classes: {
-      track: (0, _clsx.default)(valueState < 0.3 && "low", valueState >= 0.3 && valueState <= 0.7 && "medium", valueState > 0.7 && "high")
+      track: clsx(valueState < 0.3 && "low", valueState >= 0.3 && valueState <= 0.7 && "medium", valueState > 0.7 && "high")
     },
     value: valueState,
     max: 1,
@@ -111,6 +104,6 @@ function EditProgress(props) {
     valueLabelFormat: newValue => `${(newValue * 100).toLocaleString()} %`
   });
 }
-function renderEditProgress(params) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(EditProgress, (0, _extends2.default)({}, params));
+export function renderEditProgress(params) {
+  return /*#__PURE__*/_jsx(EditProgress, _extends({}, params));
 }

package/esm/renderer/renderEditRating.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { GridRenderEditCellParams } from '@mui/x-data-grid-premium';
+export declare function renderEditRating(params: GridRenderEditCellParams<any, number>): React.JSX.Element;

package/{node → esm}/renderer/renderEditRating.js

@@ -1,24 +1,16 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.renderEditRating = renderEditRating;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var React = _interopRequireWildcard(require("react"));
-var _Box = _interopRequireDefault(require("@mui/material/Box"));
-var _Rating = _interopRequireDefault(require("@mui/material/Rating"));
-var _xDataGridPremium = require("@mui/x-data-grid-premium");
-var _jsxRuntime = require("react/jsx-runtime");
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import Box from '@mui/material/Box';
+import Rating from '@mui/material/Rating';
+import { useGridApiContext } from '@mui/x-data-grid-premium';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function EditRating(props) {
   const {
     id,
     value,
     field
   } = props;
-  const apiRef = (0, _xDataGridPremium.useGridApiContext)();
+  const apiRef = useGridApiContext();
   const changedThroughKeyboard = React.useRef(false);
   const handleChange = async event => {
     await apiRef.current.setEditCellValue({
@@ -50,7 +42,7 @@ function EditRating(props) {
       changedThroughKeyboard.current = false;
     }
   };
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+  return /*#__PURE__*/_jsxs(Box, {
     sx: {
       display: 'flex',
       alignItems: 'center',
@@ -58,7 +50,7 @@ function EditRating(props) {
       color: 'text.secondary',
       mr: 1
     },
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Rating.default, {
+    children: [/*#__PURE__*/_jsx(Rating, {
       ref: handleRef,
       name: "rating",
       value: Number(value),
@@ -71,6 +63,6 @@ function EditRating(props) {
     }), Number(value)]
   });
 }
-function renderEditRating(params) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(EditRating, (0, _extends2.default)({}, params));
+export function renderEditRating(params) {
+  return /*#__PURE__*/_jsx(EditRating, _extends({}, params));
 }

package/esm/renderer/renderEditStatus.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { GridRenderEditCellParams } from '@mui/x-data-grid-premium';
+export declare function renderEditStatus(params: GridRenderEditCellParams<any, string>): React.JSX.Element;

package/esm/renderer/renderEditStatus.js

@@ -0,0 +1,98 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { useGridApiContext, useGridRootProps, GridEditModes } from '@mui/x-data-grid-premium';
+import Select from '@mui/material/Select';
+import MenuItem from '@mui/material/MenuItem';
+import ListItemIcon from '@mui/material/ListItemIcon';
+import ListItemText from '@mui/material/ListItemText';
+import ReportProblemIcon from '@mui/icons-material/ReportProblem';
+import InfoIcon from '@mui/icons-material/Info';
+import AutorenewIcon from '@mui/icons-material/Autorenew';
+import DoneIcon from '@mui/icons-material/Done';
+import { STATUS_OPTIONS } from "../services/static-data.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+function EditStatus(props) {
+  const {
+    id,
+    value,
+    field
+  } = props;
+  const rootProps = useGridRootProps();
+  const apiRef = useGridApiContext();
+  const handleChange = async event => {
+    const isValid = await apiRef.current.setEditCellValue({
+      id,
+      field,
+      value: event.target.value
+    });
+    if (isValid && rootProps.editMode === GridEditModes.Cell) {
+      apiRef.current.stopCellEditMode({
+        id,
+        field,
+        cellToFocusAfter: 'below'
+      });
+    }
+  };
+  const handleClose = (event, reason) => {
+    if (reason === 'backdropClick') {
+      apiRef.current.stopCellEditMode({
+        id,
+        field,
+        ignoreModifications: true
+      });
+    }
+  };
+  return /*#__PURE__*/_jsx(Select, {
+    value: value,
+    onChange: handleChange,
+    MenuProps: {
+      onClose: handleClose
+    },
+    sx: {
+      height: '100%',
+      '& .MuiSelect-select': {
+        display: 'flex',
+        alignItems: 'center',
+        pl: 1
+      }
+    },
+    autoFocus: true,
+    fullWidth: true,
+    open: true,
+    children: STATUS_OPTIONS.map(option => {
+      let IconComponent = null;
+      if (option === 'Rejected') {
+        IconComponent = ReportProblemIcon;
+      } else if (option === 'Open') {
+        IconComponent = InfoIcon;
+      } else if (option === 'PartiallyFilled') {
+        IconComponent = AutorenewIcon;
+      } else if (option === 'Filled') {
+        IconComponent = DoneIcon;
+      }
+      let label = option;
+      if (option === 'PartiallyFilled') {
+        label = 'Partially Filled';
+      }
+      return /*#__PURE__*/_jsxs(MenuItem, {
+        value: option,
+        children: [/*#__PURE__*/_jsx(ListItemIcon, {
+          sx: {
+            minWidth: 36
+          },
+          children: /*#__PURE__*/_jsx(IconComponent, {
+            fontSize: "small"
+          })
+        }), /*#__PURE__*/_jsx(ListItemText, {
+          primary: label,
+          sx: {
+            overflow: 'hidden'
+          }
+        })]
+      }, option);
+    })
+  });
+}
+export function renderEditStatus(params) {
+  return /*#__PURE__*/_jsx(EditStatus, _extends({}, params));
+}

package/esm/renderer/renderEmail.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { GridRenderCellParams } from '@mui/x-data-grid-premium';
+export declare function renderEmail(params: GridRenderCellParams<any, string, any>): React.JSX.Element;

package/esm/renderer/renderEmail.js

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { DemoLink } from "./renderLink.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+export function renderEmail(params) {
+  const email = params.value ?? '';
+  return /*#__PURE__*/_jsx(DemoLink, {
+    href: `mailto:${email}`,
+    tabIndex: params.tabIndex,
+    children: email
+  });
+}

package/esm/renderer/renderIncoterm.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { GridRenderCellParams } from '@mui/x-data-grid-premium';
+export declare function renderIncoterm(params: GridRenderCellParams<any, string | null, any>): React.JSX.Element;

package/esm/renderer/renderIncoterm.js

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import Tooltip from '@mui/material/Tooltip';
+import Box from '@mui/material/Box';
+import InfoIcon from '@mui/icons-material/Info';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const Incoterm = /*#__PURE__*/React.memo(function Incoterm(props) {
+  const {
+    value
+  } = props;
+  if (!value) {
+    return null;
+  }
+  const valueStr = value.toString();
+  const tooltip = valueStr.slice(valueStr.indexOf('(') + 1, valueStr.indexOf(')'));
+  const code = valueStr.slice(0, valueStr.indexOf('(')).trim();
+  return /*#__PURE__*/_jsxs(Box, {
+    sx: {
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'space-between'
+    },
+    children: [/*#__PURE__*/_jsx("span", {
+      children: code
+    }), /*#__PURE__*/_jsx(Tooltip, {
+      title: tooltip,
+      children: /*#__PURE__*/_jsx(InfoIcon, {
+        sx: {
+          color: '#2196f3',
+          alignSelf: 'center',
+          ml: '8px'
+        }
+      })
+    })]
+  });
+});
+export function renderIncoterm(params) {
+  return /*#__PURE__*/_jsx(Incoterm, {
+    value: params.value
+  });
+}

package/esm/renderer/renderLink.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import { GridRenderCellParams } from '@mui/x-data-grid-premium';
+interface DemoLinkProps {
+  href: string;
+  children: string;
+  tabIndex: number;
+}
+export declare const DemoLink: React.NamedExoticComponent<DemoLinkProps>;
+export declare function renderLink(params: GridRenderCellParams<any, string, any>): "" | React.JSX.Element;
+export {};

package/esm/renderer/renderLink.js

@@ -0,0 +1,31 @@
+import * as React from 'react';
+import { styled } from '@mui/material/styles';
+import { jsx as _jsx } from "react/jsx-runtime";
+const Link = styled('a')({
+  textOverflow: 'ellipsis',
+  whiteSpace: 'nowrap',
+  overflow: 'hidden',
+  color: 'inherit'
+});
+export const DemoLink = /*#__PURE__*/React.memo(function DemoLink(props) {
+  const handleClick = event => {
+    event.preventDefault();
+    event.stopPropagation();
+  };
+  return /*#__PURE__*/_jsx(Link, {
+    tabIndex: props.tabIndex,
+    onClick: handleClick,
+    href: props.href,
+    children: props.children
+  });
+});
+export function renderLink(params) {
+  if (params.value == null) {
+    return '';
+  }
+  return /*#__PURE__*/_jsx(DemoLink, {
+    href: params.value,
+    tabIndex: params.tabIndex,
+    children: params.value
+  });
+}

package/esm/renderer/renderPnl.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { GridRenderCellParams } from '@mui/x-data-grid-premium';
+export declare function renderPnl(params: GridRenderCellParams<any, number, any>): "" | React.JSX.Element;