@mui/x-data-grid-generator 6.0.0-alpha.8 → 6.0.0-alpha.9

package/modern/renderer/renderEditStatus.js

@@ -12,7 +12,6 @@ import DoneIcon from '@mui/icons-material/Done';
 import { STATUS_OPTIONS } from '../services/static-data';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-
 function EditStatus(props) {
   const {
     id,
@@ -21,14 +20,12 @@ function EditStatus(props) {
   } = 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,
@@ -37,7 +34,6 @@ function EditStatus(props) {
       });
     }
   };
-
   const handleClose = (event, reason) => {
     if (reason === 'backdropClick') {
       apiRef.current.stopCellEditMode({
@@ -47,7 +43,6 @@ function EditStatus(props) {
       });
     }
   };
-
   return /*#__PURE__*/_jsx(Select, {
     value: value,
     onChange: handleChange,
@@ -67,7 +62,6 @@ function EditStatus(props) {
     open: true,
     children: STATUS_OPTIONS.map(option => {
       let IconComponent = null;
-
       if (option === 'Rejected') {
         IconComponent = ReportProblemIcon;
       } else if (option === 'Open') {
@@ -77,13 +71,10 @@ function EditStatus(props) {
       } 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, {
@@ -103,7 +94,6 @@ function EditStatus(props) {
     })
   });
 }
-
 export function renderEditStatus(params) {
   return /*#__PURE__*/_jsx(EditStatus, _extends({}, params));
 }

package/modern/renderer/renderIncoterm.js

@@ -8,11 +8,9 @@ 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();

package/modern/renderer/renderLink.js

@@ -12,7 +12,6 @@ export const DemoLink = /*#__PURE__*/React.memo(function DemoLink(props) {
     event.preventDefault();
     event.stopPropagation();
   };
-
   return /*#__PURE__*/_jsx(Link, {
     tabIndex: props.tabIndex,
     onClick: handleClick,
@@ -24,7 +23,6 @@ export function renderLink(params) {
   if (params.value == null) {
     return '';
   }
-
   return /*#__PURE__*/_jsx(DemoLink, {
     href: params.value,
     tabIndex: params.tabIndex,

package/modern/renderer/renderPnl.js

@@ -14,11 +14,9 @@ const Value = styled('div')(({
     color: theme.palette.mode === 'light' ? theme.palette.error.dark : theme.palette.error.light
   }
 }));
-
 function pnlFormatter(value) {
   return value < 0 ? `(${Math.abs(value).toLocaleString()})` : value.toLocaleString();
 }
-
 const Pnl = /*#__PURE__*/React.memo(function Pnl(props) {
   const {
     value
@@ -32,7 +30,6 @@ export function renderPnl(params) {
   if (params.value == null) {
     return '';
   }
-
   return /*#__PURE__*/_jsx(Pnl, {
     value: params.value
   });

package/modern/renderer/renderProgress.js

@@ -6,7 +6,7 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
 const Root = styled('div')(({
   theme
 }) => ({
-  border: `1px solid ${theme.palette.divider}`,
+  border: `1px solid ${(theme.vars || theme).palette.divider}`,
   position: 'relative',
   overflow: 'hidden',
   width: '100%',
@@ -51,14 +51,13 @@ const ProgressBar = /*#__PURE__*/React.memo(function ProgressBar(props) {
 export function renderProgress(params) {
   if (params.value == null) {
     return '';
-  } // If the aggregated value does not have the same unit as the other cell
-  // Then we fall back to the default rendering based on `valueGetter` instead of rendering a progress bar.
-
+  }
 
+  // If the aggregated value does not have the same unit as the other cell
+  // Then we fall back to the default rendering based on `valueGetter` instead of rendering a progress bar.
   if (params.aggregation && !params.aggregation.hasCellUnit) {
     return null;
   }
-
   return /*#__PURE__*/_jsx(ProgressBar, {
     value: params.value
   });

package/modern/renderer/renderRating.js

@@ -26,14 +26,13 @@ const RatingValue = /*#__PURE__*/React.memo(function RatingValue(props) {
 export function renderRating(params) {
   if (params.value == null) {
     return '';
-  } // If the aggregated value does not have the same unit as the other cell
-  // Then we fall back to the default rendering based on `valueGetter` instead of rendering the total price UI.
-
+  }
 
+  // If the aggregated value does not have the same unit as the other cell
+  // Then we fall back to the default rendering based on `valueGetter` instead of rendering the total price UI.
   if (params.aggregation && !params.aggregation.hasCellUnit) {
     return null;
   }
-
   return /*#__PURE__*/_jsx(RatingValue, {
     value: params.value
   });

package/modern/renderer/renderStatus.js

@@ -14,20 +14,20 @@ const StyledChip = styled(Chip)(({
     color: 'inherit'
   },
   '&.Open': {
-    color: theme.palette.info.dark,
-    border: `1px solid ${theme.palette.info.main}`
+    color: (theme.vars || theme).palette.info.dark,
+    border: `1px solid ${(theme.vars || theme).palette.info.main}`
   },
   '&.Filled': {
-    color: theme.palette.success.dark,
-    border: `1px solid ${theme.palette.success.main}`
+    color: (theme.vars || theme).palette.success.dark,
+    border: `1px solid ${(theme.vars || theme).palette.success.main}`
   },
   '&.PartiallyFilled': {
-    color: theme.palette.warning.dark,
-    border: `1px solid ${theme.palette.warning.main}`
+    color: (theme.vars || theme).palette.warning.dark,
+    border: `1px solid ${(theme.vars || theme).palette.warning.main}`
   },
   '&.Rejected': {
-    color: theme.palette.error.dark,
-    border: `1px solid ${theme.palette.error.main}`
+    color: (theme.vars || theme).palette.error.dark,
+    border: `1px solid ${(theme.vars || theme).palette.error.main}`
   }
 }));
 const Status = /*#__PURE__*/React.memo(props => {
@@ -35,7 +35,6 @@ const Status = /*#__PURE__*/React.memo(props => {
     status
   } = props;
   let icon = null;
-
   if (status === 'Rejected') {
     icon = /*#__PURE__*/_jsx(ReportProblemIcon, {
       className: "icon"
@@ -53,13 +52,10 @@ const Status = /*#__PURE__*/React.memo(props => {
       className: "icon"
     });
   }
-
   let label = status;
-
   if (status === 'PartiallyFilled') {
     label = 'Partially Filled';
   }
-
   return /*#__PURE__*/_jsx(StyledChip, {
     className: status,
     icon: icon,
@@ -72,7 +68,6 @@ export function renderStatus(params) {
   if (params.value == null) {
     return '';
   }
-
   return /*#__PURE__*/_jsx(Status, {
     status: params.value
   });

package/modern/renderer/renderTotalPrice.js

@@ -14,10 +14,10 @@ const Value = styled('div')(({
   alignItems: 'center',
   justifyContent: 'flex-end',
   '&.good': {
-    backgroundColor: alpha(theme.palette.success.main, 0.3)
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.success.mainChannel} /  0.3)` : alpha(theme.palette.success.main, 0.3)
   },
   '&.bad': {
-    backgroundColor: alpha(theme.palette.error.main, 0.3)
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.error.mainChannel} /  0.3)` : alpha(theme.palette.error.main, 0.3)
   }
 }));
 const currencyFormatter = new Intl.NumberFormat('en-US', {
@@ -36,14 +36,13 @@ const TotalPrice = /*#__PURE__*/React.memo(function TotalPrice(props) {
 export function renderTotalPrice(params) {
   if (params.value == null) {
     return '';
-  } // If the aggregated value does not have the same unit as the other cell
-  // Then we fall back to the default rendering based on `valueGetter` instead of rendering the total price UI.
-
+  }
 
+  // If the aggregated value does not have the same unit as the other cell
+  // Then we fall back to the default rendering based on `valueGetter` instead of rendering the total price UI.
   if (params.aggregation && !params.aggregation.hasCellUnit) {
     return null;
   }
-
   return /*#__PURE__*/_jsx(TotalPrice, {
     value: params.value
   });

package/modern/services/asyncWorker.js

@@ -8,22 +8,20 @@ export default function asyncWorker({
     while ((deadline.timeRemaining() > 0 || deadline.didTimeout) && tasks.current > 0) {
       work();
     }
-
     if (tasks.current > 0) {
       requestIdleCallback(myNonEssentialWork);
     } else {
       done();
     }
-  }; // Don't use requestIdleCallback if the time is mock, better to run synchronously in such case.
-
+  };
 
+  // Don't use requestIdleCallback if the time is mock, better to run synchronously in such case.
   if (typeof requestIdleCallback === 'function' && !requestIdleCallback.clock) {
     requestIdleCallback(myNonEssentialWork);
   } else {
     while (tasks.current > 0) {
       work();
     }
-
     done();
   }
 }

package/modern/services/basic-data-service.js

@@ -2,21 +2,18 @@ export const currencyPairs = ['USDGBP', 'USDEUR', 'GBPEUR', 'JPYUSD', 'MXNUSD',
 export const getBasicGridData = (rowLength, colLength) => {
   const data = [];
   const pricesColLength = colLength - 2;
-
   for (let i = 0; i < rowLength; i += 1) {
     const idx = i >= currencyPairs.length ? i % currencyPairs.length : i;
     const model = {
       id: i,
       currencyPair: currencyPairs[idx]
     };
-
     for (let j = 1; j <= pricesColLength; j += 1) {
       model[`price${j}M`] = Number(`${i.toString()}${j}`); // randomPrice(0.7, 2);
     }
 
     data.push(model);
   }
-
   const columns = [{
     field: 'id',
     headerName: 'id',
@@ -25,7 +22,6 @@ export const getBasicGridData = (rowLength, colLength) => {
     field: 'currencyPair',
     headerName: 'Currency Pair'
   }];
-
   for (let j = 1; j <= pricesColLength; j += 1) {
     // const y = Math.floor(j / 12);
     columns.push({
@@ -36,7 +32,6 @@ export const getBasicGridData = (rowLength, colLength) => {
   }
 
   columns.length = colLength; // we cut the array in case < 2;
-
   return {
     columns,
     rows: data

package/modern/services/random-generator.js

@@ -2,84 +2,71 @@ import globalChance from 'chance';
 import { COLORS, COMMODITY_OPTIONS, CONTRACT_TYPE_OPTIONS, COUNTRY_ISO_OPTIONS, CURRENCY_OPTIONS, INCOTERM_OPTIONS, RATE_TYPE_OPTIONS, STATUS_OPTIONS, TAXCODE_OPTIONS } from './static-data';
 const chanceId = globalChance();
 let chance;
-
 if (typeof DISABLE_CHANCE_RANDOM !== 'undefined' && DISABLE_CHANCE_RANDOM) {
   chance = globalChance(() => 0.5);
 } else {
   chance = chanceId;
 }
-
 /**
  * Wrap a data generator that returns a string and add a prefix if the value generated has already been given
  */
 const uniquenessHandler = generator => (data, context) => {
   const rawValue = generator(data, context);
-
   if (!context.values) {
     return rawValue;
   }
-
   const valueCount = (context.values[rawValue] ?? 0) + 1;
   context.values[rawValue] = valueCount + 1;
-
   if (valueCount > 1) {
     return `${rawValue} ${valueCount}`;
   }
-
   return rawValue;
 };
-
 function dateFuture(years, refDate) {
   let date = new Date();
-
   if (typeof refDate !== 'undefined') {
     date = new Date(Date.parse(refDate));
   }
-
   const range = {
     min: 1000,
     max: (years || 1) * 365 * 24 * 3600 * 1000
-  }; // some time from now to N years later, in milliseconds
+  };
 
+  // some time from now to N years later, in milliseconds
   const past = date.getTime() + chance.integer(range);
   date.setTime(past);
   return date;
 }
-
 function dateRecent(days, refDate) {
   let date = new Date();
-
   if (typeof refDate !== 'undefined') {
     date = new Date(Date.parse(refDate));
   }
-
   const range = {
     min: 1000,
     max: (days || 1) * 24 * 3600 * 1000
-  }; // some time from now to N days ago, in milliseconds
+  };
 
+  // some time from now to N days ago, in milliseconds
   const past = date.getTime() - chance.integer(range);
   date.setTime(past);
   return date;
 }
-
 function datePast(years, refDate) {
   let date = new Date();
-
   if (typeof refDate !== 'undefined') {
     date = new Date(Date.parse(refDate));
   }
-
   const range = {
     min: 1000,
     max: (years || 1) * 365 * 24 * 3600 * 1000
-  }; // some time from now to N years ago, in milliseconds
+  };
 
+  // some time from now to N years ago, in milliseconds
   const past = date.getTime() - chance.integer(range);
   date.setTime(past);
   return date;
 }
-
 export const random = (min, max) => chance.floating({
   min,
   max

package/modern/services/real-data-service.js

@@ -6,35 +6,26 @@ export function getRealGridData(rowLength, columns) {
     };
     const rows = [];
     const indexedValues = {};
-
     function work() {
       const row = {};
-
       for (let j = 0; j < columns.length; j += 1) {
         const column = columns[j];
-
         if (column.generateData) {
           const context = {};
-
           if (column.dataGeneratorUniquenessEnabled) {
             let fieldValues = indexedValues[column.field];
-
             if (!fieldValues) {
               fieldValues = {};
               indexedValues[column.field] = fieldValues;
             }
-
             context.values = fieldValues;
           }
-
           row[column.field] = column.generateData(row, context);
         }
       }
-
       rows.push(row);
       tasks.current -= 1;
     }
-
     const columnVisibilityModel = {};
     columns.forEach(col => {
       if (col.hide) {

package/modern/services/tree-data-generator.js

@@ -7,44 +7,35 @@ export const addTreeDataOptionsToDemoData = (data, options = {}) => {
     groupingField
   } = options;
   const hasTreeData = maxDepth > 1 && groupingField != null;
-
   if (!hasTreeData) {
     return data;
   }
-
   if (data.rows.length > 1000) {
     throw new Error('MUI: useDemoData tree data mode only works up to 1000 rows.');
   }
-
   const rowsByTreeDepth = {};
   const rowsCount = data.rows.length;
   const groupingCol = data.columns.find(col => col.field === options.groupingField);
-
   if (!groupingCol) {
     throw new Error('MUI: The tree data grouping field does not exist');
   }
-
   data.initialState.columns.columnVisibilityModel[groupingField] = false;
-
   for (let i = 0; i < rowsCount; i += 1) {
     const row = data.rows[i];
     const currentChunk = Math.floor(i * (averageChildren ** maxDepth - 1) / rowsCount) + 1;
     const currentDepth = Math.floor(Math.log(currentChunk) / Math.log(averageChildren));
-
     if (!rowsByTreeDepth[currentDepth]) {
       rowsByTreeDepth[currentDepth] = {
         rows: {},
         rowIndexes: []
       };
     }
-
     rowsByTreeDepth[currentDepth].rows[i] = {
       value: row,
       parentIndex: null
     };
     rowsByTreeDepth[currentDepth].rowIndexes.push(i);
   }
-
   Object.entries(rowsByTreeDepth).forEach(([depthStr, {
     rows
   }]) => {
@@ -52,24 +43,19 @@ export const addTreeDataOptionsToDemoData = (data, options = {}) => {
     Object.values(rows).forEach(row => {
       const path = [];
       let previousRow = null;
-
       for (let k = depth; k >= 0; k -= 1) {
         let rowTemp;
-
         if (k === depth) {
           if (depth > 0) {
             row.parentIndex = Number(randomArrayItem(rowsByTreeDepth[depth - 1].rowIndexes));
           }
-
           rowTemp = row;
         } else {
           rowTemp = rowsByTreeDepth[k].rows[previousRow.parentIndex];
         }
-
         path.unshift(rowTemp.value[groupingField]);
         previousRow = rowTemp;
       }
-
       row.value.path = path;
     });
   });

package/node/columns/commodities.columns.js

@@ -4,15 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getCommodityColumns = void 0;
-
 var _xDataGridPremium = require("@mui/x-data-grid-premium");
-
 var _services = require("../services");
-
 var _renderer = require("../renderer");
-
 var _staticData = require("../services/static-data");
-
 const getCommodityColumns = (editable = false) => [{
   field: 'id',
   generateData: _services.randomId,
@@ -182,12 +177,11 @@ const getCommodityColumns = (editable = false) => [{
     if (typeof value === 'string') {
       return _staticData.COUNTRY_ISO_OPTIONS_SORTED.find(country => country.value === value);
     }
-
     return value;
   },
   valueFormatter: ({
     value
-  }) => value == null ? void 0 : value.label,
+  }) => value?.label,
   groupingValueGetter: params => params.value.code,
   sortComparator: (v1, v2, param1, param2) => (0, _xDataGridPremium.gridStringOrNumberComparator)(v1.label, v2.label, param1, param2),
   editable,
@@ -248,5 +242,4 @@ const getCommodityColumns = (editable = false) => [{
   width: 150,
   editable
 }];
-
 exports.getCommodityColumns = getCommodityColumns;

package/node/columns/employees.columns.js

@@ -4,15 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getEmployeeColumns = void 0;
-
 var _xDataGridPremium = require("@mui/x-data-grid-premium");
-
 var _services = require("../services");
-
 var _renderer = require("../renderer");
-
 var _staticData = require("../services/static-data");
-
 const getEmployeeColumns = () => [{
   field: 'id',
   generateData: _services.randomId,
@@ -90,7 +85,7 @@ const getEmployeeColumns = () => [{
   valueOptions: _staticData.COUNTRY_ISO_OPTIONS_SORTED,
   valueFormatter: ({
     value
-  }) => value == null ? void 0 : value.label,
+  }) => value?.label,
   generateData: _services.randomCountry,
   renderCell: _renderer.renderCountry,
   renderEditCell: _renderer.renderEditCountry,
@@ -141,9 +136,7 @@ const getEmployeeColumns = () => [{
     if (!value || typeof value !== 'number') {
       return value;
     }
-
     return `${value.toLocaleString()}$`;
   }
 }];
-
 exports.getEmployeeColumns = getEmployeeColumns;

package/node/columns/index.js

@@ -3,9 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
 var _commodities = require("./commodities.columns");
-
 Object.keys(_commodities).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _commodities[key]) return;
@@ -16,9 +14,7 @@ Object.keys(_commodities).forEach(function (key) {
     }
   });
 });
-
 var _employees = require("./employees.columns");
-
 Object.keys(_employees).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _employees[key]) return;

package/node/hooks/index.js

@@ -3,9 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
 var _useDemoData = require("./useDemoData");
-
 Object.keys(_useDemoData).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _useDemoData[key]) return;
@@ -16,9 +14,7 @@ Object.keys(_useDemoData).forEach(function (key) {
     }
   });
 });
-
 var _useBasicDemoData = require("./useBasicDemoData");
-
 Object.keys(_useBasicDemoData).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _useBasicDemoData[key]) return;
@@ -29,9 +25,7 @@ Object.keys(_useBasicDemoData).forEach(function (key) {
     }
   });
 });
-
 var _useMovieData = require("./useMovieData");
-
 Object.keys(_useMovieData).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _useMovieData[key]) return;
@@ -42,9 +36,7 @@ Object.keys(_useMovieData).forEach(function (key) {
     }
   });
 });
-
 var _useQuery = require("./useQuery");
-
 Object.keys(_useQuery).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _useQuery[key]) return;

package/node/hooks/useBasicDemoData.js

@@ -4,15 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useBasicDemoData = void 0;
-
 var React = _interopRequireWildcard(require("react"));
-
 var _services = require("../services");
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 const useBasicDemoData = (nbRows, nbCols) => {
   const [data, setData] = React.useState({
     rows: [],
@@ -24,5 +19,4 @@ const useBasicDemoData = (nbRows, nbCols) => {
   }, [nbRows, nbCols]);
   return data;
 };
-
 exports.useBasicDemoData = useBasicDemoData;