@mui/x-data-grid-generator 5.17.3 → 6.0.0-alpha.0

package/CHANGELOG.md

@@ -3,6 +3,215 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 6.0.0-alpha.0
+
+_Sep 22, 2022_
+
+We'd like to offer a big thanks to the 12 contributors who made this release possible. Here are some highlights ✨:
+
+- 🌍 Add a `localeText` prop to all pickers to customize the translations (#6212) @flaviendelangle
+- 🌍 Add Finnish (fi-FI) locale to the pickers (#6219) @PetroSilenius
+- 🌍 Add Persian (fa-IR) locale to the pickers (#6181) @fakhamatia
+- 📚 Documentation improvements
+- 🐞 Bugfixes
+
+### `@mui/x-data-grid@v6.0.0-alpha.0` / `@mui/x-data-grid-pro@v6.0.0-alpha.0` / `@mui/x-data-grid-premium@v6.0.0-alpha.0`
+
+#### Breaking changes
+
+- The deprecated `hide` column property has been removed in favor of the `columnVisibilityModel` prop and initial state.
+
+  ```diff
+  <DataGrid
+    columns={[
+      field: 'id,
+  -   hide: true,
+    ]}
+  +  initialState={{
+  +    columns: {
+  +      columnVisibilityModel: { id: false },
+  +    }
+  +  }}
+  />
+  ```
+
+  You can find more information about this new API on our [documentation](https://next.mui.com/x/react-data-grid/column-visibility/).
+
+- The `GridEvents` enum is now a TypeScript type.
+
+  ```diff
+  - apiRef.current.subscribeEvent(GridEvents.rowClick', handleRowClick)
+  + apiRef.current.subscribeEvent('rowClick', handleRowClick)
+  ```
+
+#### Changes
+
+- [DataGrid] Do not publish `cellFocusOut` event if the row was removed (#6251) @cherniavskii
+- [DataGrid] Fix scroll anchoring with master details (#6054) @oliviertassinari
+- [DataGrid] Improve Polish (pl-PL) locale on the data grid (#6245) @grzegorz-bach
+- [DataGrid] Remove the `GridEvents` enum (#6003) @flaviendelangle
+- [DataGrid] Remove the deprecated `hide` column property (#5999) @flaviendelangle
+
+### `@mui/x-date-pickers@v6.0.0-alpha.0` / `@mui/x-date-pickers-pro@v6.0.0-alpha.0`
+
+#### Breaking changes
+
+- All the deprecated props that allowed you to set the text displayed in the pickers have been removed.
+
+  You can now use the `localText` prop available on all picker components:
+
+  | Removed prop                 | Property in the new `localText` prop                                              |
+  |------------------------------|-----------------------------------------------------------------------------------|
+  | `endText`                    | `end`                                                                             |
+  | `getClockLabelText`          | `clockLabelText`                                                                  |
+  | `getHoursClockNumberText`    | `hoursClockNumberText`                                                            |
+  | `getMinutesClockNumberText`  | `minutesClockNumberText`                                                          |
+  | `getSecondsClockNumberText`  | `secondsClockNumberText`                                                          |
+  | `getViewSwitchingButtonText` | `calendarViewSwitchingButtonAriaLabel`                                            |
+  | `leftArrowButtonText`        | `openPreviousView` (or `previousMonth` when the button changes the visible month) |
+  | `rightArrowButtonText`       | `openNextView` (or `nextMonth` when the button changes the visible month)         |
+  | `startText`                  | `start`                                                                           |
+
+  For instance if you want to replace the `startText` / `endText`
+
+  ```diff
+  <DateRangePicker
+  -  startText="From"
+  -  endText="To"
+  +  localeText={{
+  +    start: 'From',
+  +    end: 'To',
+  +  }}
+  />
+  ```
+
+You can find more information about the new api, including how to set those translations on all your components at once in the [documentation](https://next.mui.com/x/react-date-pickers/localization/)
+
+- The component slots `LeftArrowButton` and `RightArrowButton` have been renamed `PreviousIconButton` and `NextIconButton` to better describe there usage:
+
+  ```diff
+  <DatePicker 
+    components={{
+  -   LeftArrowButton: CustomButton,  
+  +   PreviousIconButton: CustomButton,
+
+  -   RightArrowButton: CustomButton,
+  +   NextIconButton: CustomButton,
+    }}
+
+    componentsProps={{
+  -   leftArrowButton: {},  
+  +   previousIconButton: {},
+
+  -   rightArrowButton: {},
+  +   nextIconButton: {},
+    }}
+  />
+  ```
+
+- The `date` prop has been renamed `value` on  `MonthPicker` / `YearPicker`, `ClockPicker` and `CalendarPicker`.
+
+  ```diff
+  - <MonthPicker date={dayjs()} onChange={handleMonthChange} />
+  + <MonthPicker value={dayjs()} onChange={handleMonthChange} />
+
+  - <YearPicker date={dayjs()} onChange={handleYearChange} />
+  + <YearPicker value={dayjs()} onChange={handleYearChange} />
+
+  - <ClockPicker date={dayjs()} onChange={handleTimeChange} />
+  + <ClockPicker value={dayjs()} onChange={handleTimeChange} />
+
+  - <CalendarPicker date={dayjs()} onChange={handleDateChange} />
+  + <CalendarPicker value={dayjs()} onChange={handleDateChange} />
+  ```
+
+#### Changes
+
+- [CalendarPicker] Don't move to closest enabled date when `props.date` contains a disabled date (#6146) @flaviendelangle
+- [DateRangePicker] Switch to new month when changing the value from the outside (#6166) @flaviendelangle
+- [pickers] Add a `localeText` prop to all pickers to customize the translations (#6212) @flaviendelangle
+- [pickers] Add Finnish (fi-FI) locale to the pickers (#6219) (#6230) @PetroSilenius
+- [pickers] Add Persian (fa-IR) locale to the pickers (#6181) @fakhamatia
+- [pickers] Allow nested `LocalizationProvider` (#6011) @flaviendelangle
+- [pickers] Clean slots on `PickersArrowSwitcher` component (#5890) @flaviendelangle
+- [pickers] Fix invalid date error when decreasing `DateField` day (#6071) @alexfauquette
+- [pickers] Fix mobile section selection (#6207) @oliviertassinari
+- [pickers] Fix usage with Typescript 4.8 (#6229) @flaviendelangle
+- [pickers] Improve error message when no adapter context is found (#6211) @flaviendelangle
+- [pickers] Remove `valueStr` from the field state (#6142) @flaviendelangle
+- [pickers] Remove remaining deprecated locale props (#6233) @flaviendelangle
+- [pickers] Rename the `date` prop `value` on `MonthPicker` / `YearPicker`, `ClockPicker` and `CalendarPicker` (#6128) @flaviendelangle
+- [pickers] Rename the `onClose` prop of  `PickersPopper` `onDismiss` to simplify typing (#6155) @flaviendelangle
+- [pickers] Support the `sx` prop on all public component with a root HTML elements (#5944) @flaviendelangle
+- [pickers] Unify `PickersMonth` and `PickersYear` behaviors (#6034) @flaviendelangle
+- [pickers] Use `shouldDisableMonth` and `shouldDisableYear` for date validation (#6066) @flaviendelangle
+- [YearPicker] Scroll to the current year even with `autoFocus=false` (#6224) @alexfauquette
+
+### Docs
+
+- [docs] Add automatic vale check (#5429) @alexfauquette
+- [docs] Add Pro logo in "column ordering" link (#6127) @alexfauquette
+- [docs] Fix 301 link (#6239) @oliviertassinari
+- [docs] Fix broken link (#6163) @alexfauquette
+- [docs] Fix broken links (#6101) @alexfauquette
+- [docs] Fix demonstration date to avoid hydration errors (#6032) @alexfauquette
+- [docs] Fix hidden popper in restore state example (#6191) @heyfirst
+- [docs] Fix invalid links causing 404 & 301 errors (#6105) @oliviertassinari
+- [docs] Fix npm repository url in the pickers `package.json` (#6172) @oliviertassinari
+- [docs] Fix typo in linked issue (#6162) @flaviendelangle
+- [docs] Import `generateUtilityClass` from `@mui/utils` (#6216) @michaldudak
+- [docs] Improve Upgrade plan docs (#6018) @oliviertassinari
+- [docs] Link the OpenSSF Best Practices card (#6171) @oliviertassinari
+
+### Core
+
+- [core] Add `v5.17.3` changelog to next branch (#6250) @flaviendelangle
+- [core] Add link to the security page on the `README` (#6073) @oliviertassinari
+- [core] Fix scroll restoration in the docs (#5938) @oliviertassinari
+- [core] Remove the Storybook (#6099) @flaviendelangle
+- [core] Tag release as `next` in NPM (#6256) @m4theushw
+- [core] Update monorepo (#6180) @flaviendelangle
+- [core] Use the `next` branch for Prettier (#6097) @flaviendelangle
+- [core] Use the official repository for `@mui/monorepo` instead of a fork (#6189) @oliviertassinari
+- [test] Fix logic to skip column pinning tests (#6133) @m4theushw
+- [test] Hide the date on the print regression test (#6120) @flaviendelangle
+- [test] Skip tests for column pinning and dynamic row height (#5997) @m4theushw
+- [website] Improve security header @oliviertassinari
+
+## v5.17.4
+
+_Sep 22, 2022_
+
+We'd like to offer a big thanks to the 5 contributors who made this release possible. Here are some highlights ✨:
+
+- 🌍 Add Finnish (fi-FI) locale to the pickers (#6230) @PetroSilenius
+- 🌍 Add Persian (fa-IR) locale to the pickers (#6181) @fakhamatia
+- 🐞 Bugfixes
+
+### `@mui/x-data-grid@v5.17.4` / `@mui/x-data-grid-pro@v5.17.4` / `@mui/x-data-grid-premium@v5.17.4`
+
+#### Changes
+
+- [DataGrid] Do not publish `cellFocusOut` event if the row was removed (#6251) @cherniavskii
+- [DataGrid] Improve Polish (pl-PL) locale on the data grid (#6245) @grzegorz-bach
+
+### `@mui/x-date-pickers@v5.0.3` / `@mui/x-date-pickers-pro@v5.0.3`
+
+#### Changes
+
+- [pickers] Add Finnish (fi-FI) locale to pickers (#6219) (#6230) @PetroSilenius
+- [pickers] Add Persian (fa-IR) locale to the pickers (#6181) @fakhamatia
+- [pickers] Fix usage with Typescript 4.8 (#6229) @flaviendelangle
+- [YearPicker] Scroll to the current year even with `autoFocus=false` (#6224) @alexfauquette
+
+### Docs
+
+- [docs] Fix 301 link (#6239) @oliviertassinari
+
+### Core
+
+- [core] Use the official repository for `@mui/monorepo` instead of a fork (#6189) @oliviertassinari
+
 ## 5.17.3
 
 _Sep 16, 2022_
@@ -1406,7 +1615,7 @@ We'd like to offer a big thanks to the 15 contributors who made this release pos
 - [DataGrid] Stop checkbox ripple on blur (#3835) @m4theushw
 - [DataGrid] Stop calling `onRowClick` when clicking in cells with interactive elements (#3929) @m4theushw
 - [DataGrid] Use only `headerName` when available to search column (#3959) @pkratz
-- [DataGrid] Use the bundling scripts as the packages published by the [https://github.com/mui/material-ui](material-ui) repository (#3965) @flaviendelangle
+- [DataGrid] Use the bundling scripts as the packages published by the [material-ui](https://github.com/mui/material-ui) repository (#3965) @flaviendelangle
 - [DataGridPro] Add `unstable_setRowHeight` method to `apiRef` (#3751) @cherniavskii
 - [DataGridPro] Always export the `pageSize` and `page` when it has been initialized or is being controlled (#3908) @flaviendelangle
 - [DataGridPro] Disable export for detail panel column (#4057) @gustavhagland
@@ -4051,7 +4260,7 @@ Big thanks to the 7 contributors who made this release possible. Here are some h
 
 - 💄 Release the cell editing feature (#1287) @dtassone
 
-  This is the first release of the Cell editing feature. You can find the documentation [following this link](https://mui.com/x/react-data-grid/editing/#cell-editing). We have spent the last three months working on it.
+  This is the first release of the Cell editing feature. You can find the documentation [following this link](https://mui.com/x/react-data-grid/editing/). We have spent the last three months working on it.
 
   ![cell edit](https://user-images.githubusercontent.com/3165635/115632215-87994700-a307-11eb-91d9-9f5537df0911.gif)
 
@@ -4661,7 +4870,7 @@ _Dec 9, 2020_
 
 Big thanks to the 6 contributors who made this release possible. Here are some highlights ✨:
 
-- 🔍 Add a new data grid [density selector](https://mui.com/x/react-data-grid/rendering/#density) feature (#606) @DanailH.
+- 🔍 Add a new data grid [density selector](https://mui.com/x/react-data-grid/accessibility/#density) feature (#606) @DanailH.
 - 💄 A first iteration on the data grid's toolbar.
 - 🧪 Continue the iteration on the data grid filtering feature, soon to be released @dtassone.
 

package/hooks/index.d.ts

@@ -1,3 +1,4 @@
 export * from './useDemoData';
+export * from './useBasicDemoData';
 export * from './useMovieData';
 export * from './useQuery';

package/hooks/index.js

@@ -1,3 +1,4 @@
 export * from './useDemoData';
+export * from './useBasicDemoData';
 export * from './useMovieData';
 export * from './useQuery';

package/hooks/useBasicDemoData.d.ts

@@ -0,0 +1,2 @@
+import { GridBasicData } from '../services';
+export declare const useBasicDemoData: (nbRows: number, nbCols: number) => GridBasicData;

package/hooks/useBasicDemoData.js

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { getBasicGridData } from '../services';
+export const useBasicDemoData = (nbRows, nbCols) => {
+  const [data, setData] = React.useState({
+    rows: [],
+    columns: []
+  });
+  React.useEffect(() => {
+    const newData = getBasicGridData(nbRows, nbCols);
+    setData(newData);
+  }, [nbRows, nbCols]);
+  return data;
+};

package/hooks/useDemoData.js

@@ -88,7 +88,6 @@ export const getColumnsFromOptions = options => {
 export const getInitialState = (options, columns) => {
   var _options$treeData;
 
-  // TODO v6: Stop using `GridColDef.hide`
   const columnVisibilityModel = {};
   columns.forEach(col => {
     if (col.hide) {

package/hooks/useQuery.d.ts

@@ -35,6 +35,7 @@ export declare const createFakeServer: (dataSetOptions?: Partial<UseDemoDataOpti
     columnsWithDefaultColDef: {
         generateData?: ((row: any, context: import("..").GridDataGeneratorContext) => any) | undefined;
         dataGeneratorUniquenessEnabled?: boolean | undefined;
+        hide?: boolean | undefined;
         field: string;
         headerName?: string | undefined;
         description?: string | undefined;
@@ -42,7 +43,6 @@ export declare const createFakeServer: (dataSetOptions?: Partial<UseDemoDataOpti
         flex?: number | undefined;
         minWidth?: number | undefined;
         maxWidth?: number | undefined;
-        hide?: boolean | undefined;
         hideable?: boolean | undefined;
         sortable?: boolean | undefined;
         sortingOrder?: import("@mui/x-data-grid-pro").GridSortDirection[] | undefined;
@@ -85,7 +85,7 @@ export declare const createFakeServer: (dataSetOptions?: Partial<UseDemoDataOpti
     };
     useQuery: (queryOptions: QueryOptions) => {
         pageInfo: PageInfo;
-        data: GridRowModel[];
+        rows: GridRowModel[];
         isLoading: boolean;
     };
 };

package/hooks/useQuery.js

@@ -192,7 +192,7 @@ export const createFakeServer = (dataSetOptions, serverOptions) => {
     const queryOptionsRef = React.useRef(queryOptions);
     const [response, setResponse] = React.useState({
       pageInfo: {},
-      data: []
+      rows: []
     });
     const [isLoading, setIsLoading] = React.useState(dataGenerationIsLoading);
     React.useEffect(() => {
@@ -220,7 +220,7 @@ export const createFakeServer = (dataSetOptions, serverOptions) => {
         }
 
         const newRep = {
-          data: returnedRows,
+          rows: returnedRows,
           pageInfo: {
             totalRowCount,
             nextCursor,

package/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.17.3
+/** @license MUI v6.0.0-alpha.0
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/legacy/hooks/index.js

@@ -1,3 +1,4 @@
 export * from './useDemoData';
+export * from './useBasicDemoData';
 export * from './useMovieData';
 export * from './useQuery';

package/legacy/hooks/useBasicDemoData.js

@@ -0,0 +1,18 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+import { getBasicGridData } from '../services';
+export var useBasicDemoData = function useBasicDemoData(nbRows, nbCols) {
+  var _React$useState = React.useState({
+    rows: [],
+    columns: []
+  }),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      data = _React$useState2[0],
+      setData = _React$useState2[1];
+
+  React.useEffect(function () {
+    var newData = getBasicGridData(nbRows, nbCols);
+    setData(newData);
+  }, [nbRows, nbCols]);
+  return data;
+};

package/legacy/hooks/useDemoData.js

@@ -129,7 +129,6 @@ export var getColumnsFromOptions = function getColumnsFromOptions(options) {
 export var getInitialState = function getInitialState(options, columns) {
   var _options$treeData;
 
-  // TODO v6: Stop using `GridColDef.hide`
   var columnVisibilityModel = {};
   columns.forEach(function (col) {
     if (col.hide) {

package/legacy/hooks/useQuery.js

@@ -212,7 +212,7 @@ export var createFakeServer = function createFakeServer(dataSetOptions, serverOp
 
     var _React$useState = React.useState({
       pageInfo: {},
-      data: []
+      rows: []
     }),
         _React$useState2 = _slicedToArray(_React$useState, 2),
         response = _React$useState2[0],
@@ -263,7 +263,7 @@ export var createFakeServer = function createFakeServer(dataSetOptions, serverOp
 
                 case 8:
                   newRep = {
-                    data: returnedRows,
+                    rows: returnedRows,
                     pageInfo: {
                       totalRowCount: totalRowCount,
                       nextCursor: nextCursor,

package/legacy/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.17.3
+/** @license MUI v6.0.0-alpha.0
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

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

@@ -0,0 +1,44 @@
+export var currencyPairs = ['USDGBP', 'USDEUR', 'GBPEUR', 'JPYUSD', 'MXNUSD', 'BTCUSD', 'USDCAD', 'EURJPY', 'EURUSD', 'EURCHF', 'USDCHF', 'EURGBP', 'GBPUSD', 'AUDCAD', 'NZDUSD', 'GBPCHF', 'AUDUSD', 'GBPJPY', 'USDJPY', 'CHFJPY', 'EURCAD', 'AUDJPY', 'EURAUD', 'AUDNZD', 'CADEUR', 'CHFMXN', 'ETHUSD', 'BCHUSD', 'ETHBTC', 'XRPUSD', 'XRPBTC', 'USDLTC', 'USDXRP', 'USDDSH', 'USDBCH', 'JPYEUR', 'JPYUSD', 'JPYGBP', 'JPYCAD', 'JPYCHF', 'JPYAUD', 'JPYNZD', 'JPYSGD', 'JPYNOK', 'JPYRUB', 'JPYSEK', 'JPYTRY', 'JPYZAR', 'JPYHKD', 'JPYCNH', 'JPYDKK', 'JPYMXN', 'JPYPLN', 'JPYXAG', 'JPYXAU', 'JPYBTC', 'JPYETH', 'JPYLTC', 'JPYXRP', 'JPYDSH', 'JPYBCH', 'GBPEUR', 'GBPRUB', 'GBPTRY'];
+export var getBasicGridData = function getBasicGridData(rowLength, colLength) {
+  var data = [];
+  var pricesColLength = colLength - 2;
+
+  for (var i = 0; i < rowLength; i += 1) {
+    var idx = i >= currencyPairs.length ? i % currencyPairs.length : i;
+    var model = {
+      id: i,
+      currencyPair: currencyPairs[idx]
+    };
+
+    for (var j = 1; j <= pricesColLength; j += 1) {
+      model["price".concat(j, "M")] = Number("".concat(i.toString()).concat(j)); // randomPrice(0.7, 2);
+    }
+
+    data.push(model);
+  }
+
+  var columns = [{
+    field: 'id',
+    headerName: 'id',
+    type: 'number'
+  }, {
+    field: 'currencyPair',
+    headerName: 'Currency Pair'
+  }];
+
+  for (var _j = 1; _j <= pricesColLength; _j += 1) {
+    // const y = Math.floor(j / 12);
+    columns.push({
+      field: "price".concat(_j, "M"),
+      headerName: "".concat(_j, "M"),
+      type: 'number'
+    }); // (y > 0 ? `${y}Y` : '') + `${j - y * 12}M`
+  }
+
+  columns.length = colLength; // we cut the array in case < 2;
+
+  return {
+    columns: columns,
+    rows: data
+  };
+};

package/legacy/services/index.js

@@ -1,3 +1,4 @@
 export * from './gridColDefGenerator';
 export * from './random-generator';
-export * from './real-data-service';
+export * from './real-data-service';
+export * from './basic-data-service';

package/modern/hooks/index.js

@@ -1,3 +1,4 @@
 export * from './useDemoData';
+export * from './useBasicDemoData';
 export * from './useMovieData';
 export * from './useQuery';

package/modern/hooks/useBasicDemoData.js

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { getBasicGridData } from '../services';
+export const useBasicDemoData = (nbRows, nbCols) => {
+  const [data, setData] = React.useState({
+    rows: [],
+    columns: []
+  });
+  React.useEffect(() => {
+    const newData = getBasicGridData(nbRows, nbCols);
+    setData(newData);
+  }, [nbRows, nbCols]);
+  return data;
+};

package/modern/hooks/useDemoData.js

@@ -82,7 +82,6 @@ export const getColumnsFromOptions = options => {
   return columns;
 };
 export const getInitialState = (options, columns) => {
-  // TODO v6: Stop using `GridColDef.hide`
   const columnVisibilityModel = {};
   columns.forEach(col => {
     if (col.hide) {

package/modern/hooks/useQuery.js

@@ -188,7 +188,7 @@ export const createFakeServer = (dataSetOptions, serverOptions) => {
     const queryOptionsRef = React.useRef(queryOptions);
     const [response, setResponse] = React.useState({
       pageInfo: {},
-      data: []
+      rows: []
     });
     const [isLoading, setIsLoading] = React.useState(dataGenerationIsLoading);
     React.useEffect(() => {
@@ -216,7 +216,7 @@ export const createFakeServer = (dataSetOptions, serverOptions) => {
         }
 
         const newRep = {
-          data: returnedRows,
+          rows: returnedRows,
           pageInfo: {
             totalRowCount,
             nextCursor,

package/modern/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.17.3
+/** @license MUI v6.0.0-alpha.0
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

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

@@ -0,0 +1,44 @@
+export const currencyPairs = ['USDGBP', 'USDEUR', 'GBPEUR', 'JPYUSD', 'MXNUSD', 'BTCUSD', 'USDCAD', 'EURJPY', 'EURUSD', 'EURCHF', 'USDCHF', 'EURGBP', 'GBPUSD', 'AUDCAD', 'NZDUSD', 'GBPCHF', 'AUDUSD', 'GBPJPY', 'USDJPY', 'CHFJPY', 'EURCAD', 'AUDJPY', 'EURAUD', 'AUDNZD', 'CADEUR', 'CHFMXN', 'ETHUSD', 'BCHUSD', 'ETHBTC', 'XRPUSD', 'XRPBTC', 'USDLTC', 'USDXRP', 'USDDSH', 'USDBCH', 'JPYEUR', 'JPYUSD', 'JPYGBP', 'JPYCAD', 'JPYCHF', 'JPYAUD', 'JPYNZD', 'JPYSGD', 'JPYNOK', 'JPYRUB', 'JPYSEK', 'JPYTRY', 'JPYZAR', 'JPYHKD', 'JPYCNH', 'JPYDKK', 'JPYMXN', 'JPYPLN', 'JPYXAG', 'JPYXAU', 'JPYBTC', 'JPYETH', 'JPYLTC', 'JPYXRP', 'JPYDSH', 'JPYBCH', 'GBPEUR', 'GBPRUB', 'GBPTRY'];
+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',
+    type: 'number'
+  }, {
+    field: 'currencyPair',
+    headerName: 'Currency Pair'
+  }];
+
+  for (let j = 1; j <= pricesColLength; j += 1) {
+    // const y = Math.floor(j / 12);
+    columns.push({
+      field: `price${j}M`,
+      headerName: `${j}M`,
+      type: 'number'
+    }); // (y > 0 ? `${y}Y` : '') + `${j - y * 12}M`
+  }
+
+  columns.length = colLength; // we cut the array in case < 2;
+
+  return {
+    columns,
+    rows: data
+  };
+};

package/modern/services/index.js

@@ -1,3 +1,4 @@
 export * from './gridColDefGenerator';
 export * from './random-generator';
-export * from './real-data-service';
+export * from './real-data-service';
+export * from './basic-data-service';

package/node/hooks/index.js

@@ -17,6 +17,19 @@ 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;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _useBasicDemoData[key];
+    }
+  });
+});
+
 var _useMovieData = require("./useMovieData");
 
 Object.keys(_useMovieData).forEach(function (key) {

package/node/hooks/useBasicDemoData.js

@@ -0,0 +1,28 @@
+"use strict";
+
+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: [],
+    columns: []
+  });
+  React.useEffect(() => {
+    const newData = (0, _services.getBasicGridData)(nbRows, nbCols);
+    setData(newData);
+  }, [nbRows, nbCols]);
+  return data;
+};
+
+exports.useBasicDemoData = useBasicDemoData;

package/node/hooks/useDemoData.js

@@ -112,7 +112,6 @@ exports.getColumnsFromOptions = getColumnsFromOptions;
 const getInitialState = (options, columns) => {
   var _options$treeData;
 
-  // TODO v6: Stop using `GridColDef.hide`
   const columnVisibilityModel = {};
   columns.forEach(col => {
     if (col.hide) {

package/node/hooks/useQuery.js

@@ -210,7 +210,7 @@ const createFakeServer = (dataSetOptions, serverOptions) => {
     const queryOptionsRef = React.useRef(queryOptions);
     const [response, setResponse] = React.useState({
       pageInfo: {},
-      data: []
+      rows: []
     });
     const [isLoading, setIsLoading] = React.useState(dataGenerationIsLoading);
     React.useEffect(() => {
@@ -238,7 +238,7 @@ const createFakeServer = (dataSetOptions, serverOptions) => {
         }
 
         const newRep = {
-          data: returnedRows,
+          rows: returnedRows,
           pageInfo: {
             totalRowCount,
             nextCursor,

package/node/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.17.3
+/** @license MUI v6.0.0-alpha.0
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

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

@@ -0,0 +1,54 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getBasicGridData = exports.currencyPairs = void 0;
+const currencyPairs = ['USDGBP', 'USDEUR', 'GBPEUR', 'JPYUSD', 'MXNUSD', 'BTCUSD', 'USDCAD', 'EURJPY', 'EURUSD', 'EURCHF', 'USDCHF', 'EURGBP', 'GBPUSD', 'AUDCAD', 'NZDUSD', 'GBPCHF', 'AUDUSD', 'GBPJPY', 'USDJPY', 'CHFJPY', 'EURCAD', 'AUDJPY', 'EURAUD', 'AUDNZD', 'CADEUR', 'CHFMXN', 'ETHUSD', 'BCHUSD', 'ETHBTC', 'XRPUSD', 'XRPBTC', 'USDLTC', 'USDXRP', 'USDDSH', 'USDBCH', 'JPYEUR', 'JPYUSD', 'JPYGBP', 'JPYCAD', 'JPYCHF', 'JPYAUD', 'JPYNZD', 'JPYSGD', 'JPYNOK', 'JPYRUB', 'JPYSEK', 'JPYTRY', 'JPYZAR', 'JPYHKD', 'JPYCNH', 'JPYDKK', 'JPYMXN', 'JPYPLN', 'JPYXAG', 'JPYXAU', 'JPYBTC', 'JPYETH', 'JPYLTC', 'JPYXRP', 'JPYDSH', 'JPYBCH', 'GBPEUR', 'GBPRUB', 'GBPTRY'];
+exports.currencyPairs = currencyPairs;
+
+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',
+    type: 'number'
+  }, {
+    field: 'currencyPair',
+    headerName: 'Currency Pair'
+  }];
+
+  for (let j = 1; j <= pricesColLength; j += 1) {
+    // const y = Math.floor(j / 12);
+    columns.push({
+      field: `price${j}M`,
+      headerName: `${j}M`,
+      type: 'number'
+    }); // (y > 0 ? `${y}Y` : '') + `${j - y * 12}M`
+  }
+
+  columns.length = colLength; // we cut the array in case < 2;
+
+  return {
+    columns,
+    rows: data
+  };
+};
+
+exports.getBasicGridData = getBasicGridData;

package/node/services/index.js

@@ -41,4 +41,17 @@ Object.keys(_realDataService).forEach(function (key) {
       return _realDataService[key];
     }
   });
+});
+
+var _basicDataService = require("./basic-data-service");
+
+Object.keys(_basicDataService).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _basicDataService[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _basicDataService[key];
+    }
+  });
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid-generator",
-  "version": "5.17.3",
+  "version": "6.0.0-alpha.0",
   "description": "Generate fake data for demo purposes only.",
   "author": "MUI Team",
   "main": "./node/index.js",
@@ -19,9 +19,9 @@
     "directory": "packages/grid/x-data-grid-generator"
   },
   "dependencies": {
-    "@babel/runtime": "^7.18.9",
-    "@mui/base": "^5.0.0-alpha.97",
-    "@mui/x-data-grid-premium": "5.17.3",
+    "@babel/runtime": "^7.19.0",
+    "@mui/base": "^5.0.0-alpha.98",
+    "@mui/x-data-grid-premium": "6.0.0-alpha.0",
     "chance": "^1.1.8",
     "clsx": "^1.2.1",
     "lru-cache": "^7.14.0"

package/services/basic-data-service.d.ts

@@ -0,0 +1,13 @@
+import { GridColDef, GridRowId } from '@mui/x-data-grid';
+export declare const currencyPairs: string[];
+interface GridBasicRowModel {
+    id: GridRowId;
+    currencyPair: string;
+    [price: string]: number | string;
+}
+export interface GridBasicData {
+    columns: GridColDef[];
+    rows: GridBasicRowModel[];
+}
+export declare const getBasicGridData: (rowLength: number, colLength: number) => GridBasicData;
+export {};

package/services/basic-data-service.js

@@ -0,0 +1,44 @@
+export const currencyPairs = ['USDGBP', 'USDEUR', 'GBPEUR', 'JPYUSD', 'MXNUSD', 'BTCUSD', 'USDCAD', 'EURJPY', 'EURUSD', 'EURCHF', 'USDCHF', 'EURGBP', 'GBPUSD', 'AUDCAD', 'NZDUSD', 'GBPCHF', 'AUDUSD', 'GBPJPY', 'USDJPY', 'CHFJPY', 'EURCAD', 'AUDJPY', 'EURAUD', 'AUDNZD', 'CADEUR', 'CHFMXN', 'ETHUSD', 'BCHUSD', 'ETHBTC', 'XRPUSD', 'XRPBTC', 'USDLTC', 'USDXRP', 'USDDSH', 'USDBCH', 'JPYEUR', 'JPYUSD', 'JPYGBP', 'JPYCAD', 'JPYCHF', 'JPYAUD', 'JPYNZD', 'JPYSGD', 'JPYNOK', 'JPYRUB', 'JPYSEK', 'JPYTRY', 'JPYZAR', 'JPYHKD', 'JPYCNH', 'JPYDKK', 'JPYMXN', 'JPYPLN', 'JPYXAG', 'JPYXAU', 'JPYBTC', 'JPYETH', 'JPYLTC', 'JPYXRP', 'JPYDSH', 'JPYBCH', 'GBPEUR', 'GBPRUB', 'GBPTRY'];
+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',
+    type: 'number'
+  }, {
+    field: 'currencyPair',
+    headerName: 'Currency Pair'
+  }];
+
+  for (let j = 1; j <= pricesColLength; j += 1) {
+    // const y = Math.floor(j / 12);
+    columns.push({
+      field: `price${j}M`,
+      headerName: `${j}M`,
+      type: 'number'
+    }); // (y > 0 ? `${y}Y` : '') + `${j - y * 12}M`
+  }
+
+  columns.length = colLength; // we cut the array in case < 2;
+
+  return {
+    columns,
+    rows: data
+  };
+};

package/services/gridColDefGenerator.d.ts

@@ -16,4 +16,8 @@ export interface GridColDefGenerator extends GridColDef {
      * @default false
      */
     dataGeneratorUniquenessEnabled?: boolean;
+    /**
+     * If `true`, the column will be marked as hidden in the `columnVisibilityModel`.
+     */
+    hide?: boolean;
 }

package/services/index.d.ts

@@ -1,3 +1,4 @@
 export * from './gridColDefGenerator';
 export * from './random-generator';
 export * from './real-data-service';
+export * from './basic-data-service';

package/services/index.js

@@ -1,3 +1,4 @@
 export * from './gridColDefGenerator';
 export * from './random-generator';
-export * from './real-data-service';
+export * from './real-data-service';
+export * from './basic-data-service';