@mui/x-data-grid 6.0.4 → 6.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +58 -0
- package/components/GridAutoSizer.js +3 -0
- package/components/GridPagination.d.ts +6 -6
- package/components/GridRow.js +3 -1
- package/components/cell/GridActionsCellItem.d.ts +2 -2
- package/components/cell/GridEditDateCell.js +37 -16
- package/components/columnHeaders/ColumnHeaderMenuIcon.js +20 -16
- package/components/panel/GridColumnsPanel.d.ts +8 -0
- package/components/panel/GridColumnsPanel.js +18 -6
- package/components/toolbar/GridToolbarColumnsButton.d.ts +1 -1
- package/components/toolbar/GridToolbarDensitySelector.d.ts +1 -1
- package/components/toolbar/GridToolbarExportContainer.d.ts +1 -1
- package/hooks/core/useGridApiInitialization.js +3 -3
- package/hooks/features/columns/gridColumnsSelector.d.ts +3 -3
- package/hooks/features/editing/useGridCellEditing.js +5 -1
- package/hooks/features/editing/useGridEditing.js +1 -3
- package/hooks/features/editing/useGridRowEditing.js +5 -1
- package/hooks/features/filter/gridFilterState.js +6 -1
- package/hooks/features/filter/useGridFilter.js +5 -0
- package/index.js +9 -1
- package/legacy/components/GridAutoSizer.js +3 -0
- package/legacy/components/GridRow.js +4 -1
- package/legacy/components/cell/GridEditBooleanCell.js +19 -21
- package/legacy/components/cell/GridEditDateCell.js +69 -39
- package/legacy/components/cell/GridEditInputCell.js +25 -27
- package/legacy/components/cell/GridEditSingleSelectCell.js +26 -28
- package/legacy/components/columnHeaders/ColumnHeaderMenuIcon.js +20 -16
- package/legacy/components/panel/GridColumnsPanel.js +19 -6
- package/legacy/hooks/core/useGridApiInitialization.js +3 -3
- package/legacy/hooks/features/columns/gridColumnsUtils.js +2 -2
- package/legacy/hooks/features/editing/useGridCellEditing.js +120 -120
- package/legacy/hooks/features/editing/useGridEditing.js +17 -21
- package/legacy/hooks/features/editing/useGridRowEditing.js +5 -1
- package/legacy/hooks/features/export/useGridPrintExport.js +45 -47
- package/legacy/hooks/features/filter/gridFilterState.js +6 -1
- package/legacy/hooks/features/filter/useGridFilter.js +5 -0
- package/legacy/hooks/features/rows/gridRowsUtils.js +2 -2
- package/legacy/hooks/features/virtualization/useGridVirtualScroller.js +6 -6
- package/legacy/index.js +9 -1
- package/legacy/locales/coreLocales.js +0 -1
- package/legacy/locales/huHU.js +15 -20
- package/legacy/locales/jaJP.js +1 -1
- package/legacy/locales/nlNL.js +3 -3
- package/legacy/locales/ptBR.js +7 -9
- package/legacy/locales/ruRU.js +1 -1
- package/legacy/models/gridColumnGrouping.js +4 -0
- package/legacy/models/params/gridRowParams.js +8 -0
- package/legacy/utils/createSelector.js +14 -22
- package/locales/coreLocales.js +0 -1
- package/locales/huHU.js +15 -20
- package/locales/jaJP.js +1 -1
- package/locales/nlNL.js +3 -3
- package/locales/ptBR.js +7 -9
- package/locales/ruRU.js +1 -1
- package/models/api/gridCoreApi.d.ts +3 -1
- package/models/api/gridEditingApi.d.ts +4 -0
- package/models/gridColumnGrouping.js +4 -0
- package/models/params/gridRowParams.js +8 -0
- package/modern/components/GridAutoSizer.js +3 -0
- package/modern/components/GridRow.js +3 -1
- package/modern/components/cell/GridEditDateCell.js +37 -16
- package/modern/components/columnHeaders/ColumnHeaderMenuIcon.js +19 -15
- package/modern/components/panel/GridColumnsPanel.js +18 -6
- package/modern/hooks/core/useGridApiInitialization.js +3 -3
- package/modern/hooks/features/editing/useGridCellEditing.js +5 -1
- package/modern/hooks/features/editing/useGridEditing.js +1 -3
- package/modern/hooks/features/editing/useGridRowEditing.js +5 -1
- package/modern/hooks/features/filter/gridFilterState.js +6 -1
- package/modern/hooks/features/filter/useGridFilter.js +5 -0
- package/modern/index.js +9 -1
- package/modern/locales/coreLocales.js +0 -1
- package/modern/locales/huHU.js +15 -20
- package/modern/locales/jaJP.js +1 -1
- package/modern/locales/nlNL.js +3 -3
- package/modern/locales/ptBR.js +7 -9
- package/modern/locales/ruRU.js +1 -1
- package/modern/models/gridColumnGrouping.js +4 -0
- package/modern/models/params/gridRowParams.js +8 -0
- package/modern/utils/createSelector.js +12 -22
- package/node/components/GridAutoSizer.js +3 -1
- package/node/components/GridRow.js +3 -1
- package/node/components/cell/GridCell.js +1 -0
- package/node/components/cell/GridEditDateCell.js +37 -16
- package/node/components/columnHeaders/ColumnHeaderMenuIcon.js +19 -15
- package/node/components/panel/GridColumnsPanel.js +18 -6
- package/node/hooks/core/useGridApiInitialization.js +3 -3
- package/node/hooks/features/editing/useGridCellEditing.js +5 -1
- package/node/hooks/features/editing/useGridEditing.js +1 -3
- package/node/hooks/features/editing/useGridRowEditing.js +5 -1
- package/node/hooks/features/filter/gridFilterState.js +5 -0
- package/node/hooks/features/filter/useGridFilter.js +5 -0
- package/node/index.js +1 -1
- package/node/locales/huHU.js +15 -20
- package/node/locales/jaJP.js +1 -1
- package/node/locales/nlNL.js +3 -3
- package/node/locales/ptBR.js +7 -9
- package/node/locales/ruRU.js +1 -1
- package/node/models/gridColumnGrouping.js +4 -0
- package/node/models/params/gridEditCellParams.js +1 -0
- package/node/models/params/gridRowParams.js +9 -0
- package/node/utils/createSelector.js +12 -22
- package/package.json +1 -1
- package/utils/createSelector.d.ts +4 -4
- package/utils/createSelector.js +14 -22
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,64 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## 6.1.0
|
|
7
|
+
|
|
8
|
+
_Apr 7, 2023_
|
|
9
|
+
|
|
10
|
+
We'd like to offer a big thanks to the 15 contributors who made this release possible. Here are some highlights ✨:
|
|
11
|
+
|
|
12
|
+
- 🌍 Add Catalan (ca-ES), Kazakh (kz-KZ) and improve Spanish (es-ES), Dutch (nl-NL), Hebrew (he-IL), Hungarian (hu-HU), Japanese (ja-JP), Portuguese (pt-BR), and Russian (ru-RU) locales
|
|
13
|
+
- ✨ Allow to control visibility of columns shown in the columns panel (#8401) @MBilalShafi
|
|
14
|
+
- 🐞 Bugfixes
|
|
15
|
+
- 📚 Documentation improvements
|
|
16
|
+
|
|
17
|
+
### `@mui/x-data-grid@v6.1.0` / `@mui/x-data-grid-pro@v6.1.0` / `@mui/x-data-grid-premium@v6.1.0`
|
|
18
|
+
|
|
19
|
+
#### Changes
|
|
20
|
+
|
|
21
|
+
- [DataGrid] Allow to control visibility of columns shown in the `ColumnsPanel` component (#8401) @MBilalShafi
|
|
22
|
+
- [DataGrid] Fix filters with empty array value not being removed from the filter model (#8501) @cherniavskii
|
|
23
|
+
- [DataGrid] Fix memory leaks in development (#8301) @cherniavskii
|
|
24
|
+
- [DataGrid] Sync `date` column value when entering edit mode by pressing a digit (#8364) @m4theushw
|
|
25
|
+
- [DataGrid] Wrap column menu button with a tooltip (#7890) @cherniavskii
|
|
26
|
+
- [l10n] Improve Dutch (nl-NL) locale (#8491) @thedutchruben
|
|
27
|
+
- [l10n] Improve Hungarian (hu-HU) locale (#8486) @PetakCC
|
|
28
|
+
- [l10n] Improve Japanese (ja-JP) locale (#8462) @megos
|
|
29
|
+
- [l10n] Improve Portuguese (pt-BR) locale (#8480) @pwnedev
|
|
30
|
+
- [l10n] Improve Russian (ru-RU) locale (#8510) @alexrapro
|
|
31
|
+
|
|
32
|
+
### `@mui/x-date-pickers@v6.1.0` / `@mui/x-date-pickers-pro@v6.1.0`
|
|
33
|
+
|
|
34
|
+
#### Changes
|
|
35
|
+
|
|
36
|
+
- [fields] Fix RTL navigation (#8490) @alexfauquette
|
|
37
|
+
- [fields] Fix usage of `slotProps.textField.InputProps` (#8428) @flaviendelangle
|
|
38
|
+
- [pickers] Fix `componentsProps.dialog` propagation (#8509) @LukasTy
|
|
39
|
+
- [pickers] Move `hasError` from `fieldValueManager` to `valueManager` (#8453) @flaviendelangle
|
|
40
|
+
- [pickers] Move the adapters interfaces to the X repository (#8412) @flaviendelangle
|
|
41
|
+
- [pickers] Update peer dependency versions (#8531) @LukasTy
|
|
42
|
+
- [pickers] Fix `isValid` regression (#8543) @LukasTy
|
|
43
|
+
- [l10n] Add Catalan (Spain) (ca-ES) and improve Spanish (es-ES) locales (#8498) @makenshikuro
|
|
44
|
+
- [l10n] Add Kazakh (kz-KZ) locale (#8451) @zhunus
|
|
45
|
+
- [l10n] Improve Dutch (nl-NL) locale (#8491) @thedutchruben
|
|
46
|
+
- [l10n] Improve Hebrew (he-IL) locale (#8464) @soris1989
|
|
47
|
+
- [l10n] Improve Japanese (ja-JP) locale (#8462) @megos
|
|
48
|
+
- [l10n] Improve Portuguese (pt-BR) locale (#8480) @pwnedev
|
|
49
|
+
|
|
50
|
+
### Docs
|
|
51
|
+
|
|
52
|
+
- [docs] Fix 301 redirect (#8524) @alexfauquette
|
|
53
|
+
- [docs] Fix 404 links (#8454) @alexfauquette
|
|
54
|
+
- [docs] Fix broken API reference link (#8460) @oliviertassinari
|
|
55
|
+
|
|
56
|
+
### Core
|
|
57
|
+
|
|
58
|
+
- [core] Avoid 301 links (#8383) @oliviertassinari
|
|
59
|
+
- [core] Fix the l10n helper by using danger instead of actions (#8512) @alexfauquette
|
|
60
|
+
- [core] Help contributors for l10n PRs (#8503) @alexfauquette
|
|
61
|
+
- [core] Remove legacy token (#8457) @oliviertassinari
|
|
62
|
+
- [charts] Add a styling system (#8445) @alexfauquette
|
|
63
|
+
|
|
6
64
|
## 6.0.4
|
|
7
65
|
|
|
8
66
|
_Mar 30, 2023_
|
|
@@ -6,6 +6,9 @@ import PropTypes from 'prop-types';
|
|
|
6
6
|
import { unstable_useForkRef as useForkRef, unstable_ownerWindow as ownerWindow, unstable_useEventCallback as useEventCallback, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
|
|
7
7
|
import createDetectElementResize from '../lib/createDetectElementResize';
|
|
8
8
|
// TODO replace with https://caniuse.com/resizeobserver.
|
|
9
|
+
|
|
10
|
+
// Credit to https://github.com/bvaughn/react-virtualized/blob/master/source/AutoSizer/AutoSizer.js
|
|
11
|
+
// for the sources.
|
|
9
12
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
13
|
const GridAutoSizer = /*#__PURE__*/React.forwardRef(function AutoSizer(props, ref) {
|
|
11
14
|
const {
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
export declare const GridPagination: React.ForwardRefExoticComponent<(Omit<Partial<import("@mui/material/TablePagination").TablePaginationBaseProps & {
|
|
3
3
|
ActionsComponent?: React.ElementType<import("@mui/material/TablePagination/TablePaginationActions").TablePaginationActionsProps> | undefined;
|
|
4
|
-
backIconButtonProps?: Partial<import("@mui/material").IconButtonProps
|
|
4
|
+
backIconButtonProps?: Partial<import("@mui/material").IconButtonProps> | undefined;
|
|
5
5
|
classes?: Partial<import("@mui/material/TablePagination").TablePaginationClasses> | undefined;
|
|
6
6
|
count: number;
|
|
7
7
|
getItemAriaLabel?: ((type: "first" | "last" | "next" | "previous") => string) | undefined;
|
|
8
8
|
labelDisplayedRows?: ((paginationInfo: import("@mui/material/TablePagination").LabelDisplayedRowsArgs) => React.ReactNode) | undefined;
|
|
9
9
|
labelRowsPerPage?: React.ReactNode;
|
|
10
|
-
nextIconButtonProps?: Partial<import("@mui/material").IconButtonProps
|
|
10
|
+
nextIconButtonProps?: Partial<import("@mui/material").IconButtonProps> | undefined;
|
|
11
11
|
onPageChange: (event: React.MouseEvent<HTMLButtonElement, MouseEvent> | null, page: number) => void;
|
|
12
12
|
onRowsPerPageChange?: React.ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement> | undefined;
|
|
13
13
|
page: number;
|
|
@@ -20,15 +20,15 @@ export declare const GridPagination: React.ForwardRefExoticComponent<(Omit<Parti
|
|
|
20
20
|
showFirstButton?: boolean | undefined;
|
|
21
21
|
showLastButton?: boolean | undefined;
|
|
22
22
|
sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
|
|
23
|
-
} & import("@mui/material/OverridableComponent").CommonProps & Omit<import("@mui/material/TablePagination").TablePaginationBaseProps, "hidden" | "color" | "page" | "size" | "height" | "translate" | "width" | "padding" | "abbr" | "slot" | "title" | "ref" | "colSpan" | "headers" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "nonce" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "rowSpan" | "scope" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "align" | "valign" | "sx" | keyof import("@mui/material/OverridableComponent").CommonProps | "variant" | "count" | "getItemAriaLabel" | "
|
|
23
|
+
} & import("@mui/material/OverridableComponent").CommonProps & Omit<import("@mui/material/TablePagination").TablePaginationBaseProps, "hidden" | "color" | "page" | "size" | "height" | "translate" | "width" | "padding" | "abbr" | "slot" | "title" | "ref" | "colSpan" | "headers" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "nonce" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "rowSpan" | "scope" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "align" | "valign" | "sx" | keyof import("@mui/material/OverridableComponent").CommonProps | "variant" | "count" | "getItemAriaLabel" | "onPageChange" | "rowsPerPage" | "showFirstButton" | "showLastButton" | "labelDisplayedRows" | "labelRowsPerPage" | "onRowsPerPageChange" | "rowsPerPageOptions" | "backIconButtonProps" | "nextIconButtonProps" | "sortDirection" | "ActionsComponent" | "SelectProps">>, "ref"> | Omit<Partial<import("@mui/material/TablePagination").TablePaginationBaseProps & {
|
|
24
24
|
ActionsComponent?: React.ElementType<import("@mui/material/TablePagination/TablePaginationActions").TablePaginationActionsProps> | undefined;
|
|
25
|
-
backIconButtonProps?: Partial<import("@mui/material").IconButtonProps
|
|
25
|
+
backIconButtonProps?: Partial<import("@mui/material").IconButtonProps> | undefined;
|
|
26
26
|
classes?: Partial<import("@mui/material/TablePagination").TablePaginationClasses> | undefined;
|
|
27
27
|
count: number;
|
|
28
28
|
getItemAriaLabel?: ((type: "first" | "last" | "next" | "previous") => string) | undefined;
|
|
29
29
|
labelDisplayedRows?: ((paginationInfo: import("@mui/material/TablePagination").LabelDisplayedRowsArgs) => React.ReactNode) | undefined;
|
|
30
30
|
labelRowsPerPage?: React.ReactNode;
|
|
31
|
-
nextIconButtonProps?: Partial<import("@mui/material").IconButtonProps
|
|
31
|
+
nextIconButtonProps?: Partial<import("@mui/material").IconButtonProps> | undefined;
|
|
32
32
|
onPageChange: (event: React.MouseEvent<HTMLButtonElement, MouseEvent> | null, page: number) => void;
|
|
33
33
|
onRowsPerPageChange?: React.ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement> | undefined;
|
|
34
34
|
page: number;
|
|
@@ -41,4 +41,4 @@ export declare const GridPagination: React.ForwardRefExoticComponent<(Omit<Parti
|
|
|
41
41
|
showFirstButton?: boolean | undefined;
|
|
42
42
|
showLastButton?: boolean | undefined;
|
|
43
43
|
sx?: import("@mui/material/styles").SxProps<import("@mui/material/styles").Theme> | undefined;
|
|
44
|
-
} & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("@mui/material/TablePagination").TablePaginationBaseProps, "ref"> & React.RefAttributes<React.Component<any, any, any>>, "hidden" | "color" | "page" | "size" | "height" | "translate" | "width" | "padding" | "abbr" | "slot" | "title" | "ref" | "colSpan" | "headers" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "nonce" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "rowSpan" | "scope" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "align" | "valign" | "sx" | keyof import("@mui/material/OverridableComponent").CommonProps | "variant" | "count" | "getItemAriaLabel" | "
|
|
44
|
+
} & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("@mui/material/TablePagination").TablePaginationBaseProps, "ref"> & React.RefAttributes<React.Component<any, any, any>>, "hidden" | "color" | "page" | "size" | "height" | "translate" | "width" | "padding" | "abbr" | "slot" | "title" | "ref" | "colSpan" | "headers" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "nonce" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "rowSpan" | "scope" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "align" | "valign" | "sx" | keyof import("@mui/material/OverridableComponent").CommonProps | "variant" | "count" | "getItemAriaLabel" | "onPageChange" | "rowsPerPage" | "showFirstButton" | "showLastButton" | "labelDisplayedRows" | "labelRowsPerPage" | "onRowsPerPageChange" | "rowsPerPageOptions" | "backIconButtonProps" | "nextIconButtonProps" | "sortDirection" | "ActionsComponent" | "SelectProps">>, "ref">) & React.RefAttributes<HTMLDivElement>>;
|
package/components/GridRow.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
3
3
|
const _excluded = ["selected", "rowId", "row", "index", "style", "position", "rowHeight", "className", "visibleColumns", "renderedColumns", "containerWidth", "firstColumnToRender", "lastColumnToRender", "isLastVisible", "focusedCell", "tabbableCell", "onClick", "onDoubleClick", "onMouseEnter", "onMouseLeave"],
|
|
4
|
-
_excluded2 = ["changeReason"];
|
|
4
|
+
_excluded2 = ["changeReason", "unstable_updateValueOnRender"];
|
|
5
5
|
import * as React from 'react';
|
|
6
6
|
import PropTypes from 'prop-types';
|
|
7
7
|
import clsx from 'clsx';
|
|
@@ -210,6 +210,8 @@ const GridRow = /*#__PURE__*/React.forwardRef(function GridRow(props, refProp) {
|
|
|
210
210
|
}
|
|
211
211
|
if (editCellState != null && column.renderEditCell) {
|
|
212
212
|
const updatedRow = apiRef.current.getRowWithUpdatedValues(rowId, column.field);
|
|
213
|
+
|
|
214
|
+
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
213
215
|
const editCellStateRest = _objectWithoutPropertiesLoose(editCellState, _excluded2);
|
|
214
216
|
const params = _extends({}, cellParams, {
|
|
215
217
|
row: updatedRow
|
|
@@ -19,11 +19,11 @@ declare const GridActionsCellItem: React.ForwardRefExoticComponent<(Omit<{
|
|
|
19
19
|
} & {
|
|
20
20
|
children?: React.ReactNode;
|
|
21
21
|
classes?: Partial<import("@mui/material/IconButton").IconButtonClasses> | undefined;
|
|
22
|
-
color?: "inherit" | "default" | "
|
|
22
|
+
color?: import("@mui/types").OverridableStringUnion<"inherit" | "default" | "error" | "success" | "info" | "warning" | "primary" | "secondary", import("@mui/material/IconButton").IconButtonPropsColorOverrides> | undefined;
|
|
23
23
|
disabled?: boolean | undefined;
|
|
24
24
|
disableFocusRipple?: boolean | undefined;
|
|
25
25
|
edge?: false | "end" | "start" | undefined;
|
|
26
|
-
size?: "medium" | "large" | "small" | undefined;
|
|
26
|
+
size?: import("@mui/types").OverridableStringUnion<"medium" | "large" | "small", import("@mui/material/IconButton").IconButtonPropsSizeOverrides> | undefined;
|
|
27
27
|
sx?: import("@mui/system").SxProps<import("@mui/material").Theme> | undefined;
|
|
28
28
|
} & Omit<{
|
|
29
29
|
action?: React.Ref<import("@mui/material").ButtonBaseActions> | undefined;
|
|
@@ -63,22 +63,25 @@ function GridEditDateCell(props) {
|
|
|
63
63
|
classes: rootProps.classes
|
|
64
64
|
};
|
|
65
65
|
const classes = useUtilityClasses(ownerState);
|
|
66
|
+
const hasUpdatedEditValueOnMount = React.useRef(false);
|
|
67
|
+
const parseValueToDate = React.useCallback(value => {
|
|
68
|
+
if (value === '') {
|
|
69
|
+
return null;
|
|
70
|
+
}
|
|
71
|
+
const [date, time] = value.split('T');
|
|
72
|
+
const [year, month, day] = date.split('-');
|
|
73
|
+
const parsedDate = new Date();
|
|
74
|
+
parsedDate.setFullYear(Number(year), Number(month) - 1, Number(day));
|
|
75
|
+
parsedDate.setHours(0, 0, 0, 0);
|
|
76
|
+
if (time) {
|
|
77
|
+
const [hours, minutes] = time.split(':');
|
|
78
|
+
parsedDate.setHours(Number(hours), Number(minutes), 0, 0);
|
|
79
|
+
}
|
|
80
|
+
return parsedDate;
|
|
81
|
+
}, []);
|
|
66
82
|
const handleChange = React.useCallback(async event => {
|
|
67
83
|
const newFormattedDate = event.target.value;
|
|
68
|
-
|
|
69
|
-
if (newFormattedDate === '') {
|
|
70
|
-
newParsedDate = null;
|
|
71
|
-
} else {
|
|
72
|
-
const [date, time] = newFormattedDate.split('T');
|
|
73
|
-
const [year, month, day] = date.split('-');
|
|
74
|
-
newParsedDate = new Date();
|
|
75
|
-
newParsedDate.setFullYear(Number(year), Number(month) - 1, Number(day));
|
|
76
|
-
newParsedDate.setHours(0, 0, 0, 0);
|
|
77
|
-
if (time) {
|
|
78
|
-
const [hours, minutes] = time.split(':');
|
|
79
|
-
newParsedDate.setHours(Number(hours), Number(minutes), 0, 0);
|
|
80
|
-
}
|
|
81
|
-
}
|
|
84
|
+
const newParsedDate = parseValueToDate(newFormattedDate);
|
|
82
85
|
if (onValueChange) {
|
|
83
86
|
await onValueChange(event, newParsedDate);
|
|
84
87
|
}
|
|
@@ -91,7 +94,7 @@ function GridEditDateCell(props) {
|
|
|
91
94
|
field,
|
|
92
95
|
value: newParsedDate
|
|
93
96
|
}, event);
|
|
94
|
-
}, [apiRef, field, id, onValueChange]);
|
|
97
|
+
}, [apiRef, field, id, onValueChange, parseValueToDate]);
|
|
95
98
|
React.useEffect(() => {
|
|
96
99
|
setValueState(state => {
|
|
97
100
|
var _valueTransformed$par, _state$parsed;
|
|
@@ -106,8 +109,26 @@ function GridEditDateCell(props) {
|
|
|
106
109
|
inputRef.current.focus();
|
|
107
110
|
}
|
|
108
111
|
}, [hasFocus]);
|
|
112
|
+
const meta = apiRef.current.unstable_getEditCellMeta(id, field);
|
|
113
|
+
const handleInputRef = el => {
|
|
114
|
+
inputRef.current = el;
|
|
115
|
+
if (meta.unstable_updateValueOnRender && !hasUpdatedEditValueOnMount.current) {
|
|
116
|
+
const inputValue = inputRef.current.value;
|
|
117
|
+
const parsedDate = parseValueToDate(inputValue);
|
|
118
|
+
setValueState({
|
|
119
|
+
parsed: parsedDate,
|
|
120
|
+
formatted: inputValue
|
|
121
|
+
});
|
|
122
|
+
apiRef.current.setEditCellValue({
|
|
123
|
+
id,
|
|
124
|
+
field,
|
|
125
|
+
value: parsedDate
|
|
126
|
+
});
|
|
127
|
+
hasUpdatedEditValueOnMount.current = true;
|
|
128
|
+
}
|
|
129
|
+
};
|
|
109
130
|
return /*#__PURE__*/_jsx(StyledInputBase, _extends({
|
|
110
|
-
inputRef:
|
|
131
|
+
inputRef: handleInputRef,
|
|
111
132
|
fullWidth: true,
|
|
112
133
|
className: classes.root,
|
|
113
134
|
type: isDateTime ? 'datetime-local' : 'date',
|
|
@@ -17,7 +17,7 @@ const useUtilityClasses = ownerState => {
|
|
|
17
17
|
return composeClasses(slots, getDataGridUtilityClass, classes);
|
|
18
18
|
};
|
|
19
19
|
export const ColumnHeaderMenuIcon = /*#__PURE__*/React.memo(props => {
|
|
20
|
-
var _rootProps$slotProps;
|
|
20
|
+
var _rootProps$slotProps, _rootProps$slotProps2;
|
|
21
21
|
const {
|
|
22
22
|
colDef,
|
|
23
23
|
open,
|
|
@@ -38,22 +38,26 @@ export const ColumnHeaderMenuIcon = /*#__PURE__*/React.memo(props => {
|
|
|
38
38
|
}, [apiRef, colDef.field]);
|
|
39
39
|
return /*#__PURE__*/_jsx("div", {
|
|
40
40
|
className: classes.root,
|
|
41
|
-
children: /*#__PURE__*/_jsx(rootProps.slots.
|
|
42
|
-
ref: iconButtonRef,
|
|
43
|
-
tabIndex: -1,
|
|
44
|
-
className: classes.button,
|
|
45
|
-
"aria-label": apiRef.current.getLocaleText('columnMenuLabel'),
|
|
41
|
+
children: /*#__PURE__*/_jsx(rootProps.slots.baseTooltip, _extends({
|
|
46
42
|
title: apiRef.current.getLocaleText('columnMenuLabel'),
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
43
|
+
enterDelay: 1000
|
|
44
|
+
}, (_rootProps$slotProps = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps.baseTooltip, {
|
|
45
|
+
children: /*#__PURE__*/_jsx(rootProps.slots.baseIconButton, _extends({
|
|
46
|
+
ref: iconButtonRef,
|
|
47
|
+
tabIndex: -1,
|
|
48
|
+
className: classes.button,
|
|
49
|
+
"aria-label": apiRef.current.getLocaleText('columnMenuLabel'),
|
|
50
|
+
size: "small",
|
|
51
|
+
onClick: handleMenuIconClick,
|
|
52
|
+
"aria-expanded": open ? 'true' : undefined,
|
|
53
|
+
"aria-haspopup": "true",
|
|
54
|
+
"aria-controls": columnMenuId,
|
|
55
|
+
id: columnMenuButtonId
|
|
56
|
+
}, (_rootProps$slotProps2 = rootProps.slotProps) == null ? void 0 : _rootProps$slotProps2.baseIconButton, {
|
|
57
|
+
children: /*#__PURE__*/_jsx(rootProps.slots.columnMenuIcon, {
|
|
58
|
+
fontSize: "small"
|
|
59
|
+
})
|
|
60
|
+
}))
|
|
57
61
|
}))
|
|
58
62
|
});
|
|
59
63
|
});
|
|
@@ -7,6 +7,14 @@ export interface GridColumnsPanelProps extends GridPanelWrapperProps {
|
|
|
7
7
|
autoFocusSearchField?: boolean;
|
|
8
8
|
disableHideAllButton?: boolean;
|
|
9
9
|
disableShowAllButton?: boolean;
|
|
10
|
+
/**
|
|
11
|
+
* Returns the list of togglable columns.
|
|
12
|
+
* If used, only those columns will be displayed in the panel
|
|
13
|
+
* which are passed as the return value of the function.
|
|
14
|
+
* @param {GridColDef[]} columns The `ColDef` list of all columns.
|
|
15
|
+
* @returns {GridColDef['field'][]} The list of togglable columns' field names.
|
|
16
|
+
*/
|
|
17
|
+
getTogglableColumns?: (columns: GridColDef[]) => GridColDef['field'][];
|
|
10
18
|
}
|
|
11
19
|
declare function GridColumnsPanel(props: GridColumnsPanelProps): JSX.Element;
|
|
12
20
|
declare namespace GridColumnsPanel {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
3
|
-
const _excluded = ["sort", "searchPredicate", "autoFocusSearchField", "disableHideAllButton", "disableShowAllButton"];
|
|
3
|
+
const _excluded = ["sort", "searchPredicate", "autoFocusSearchField", "disableHideAllButton", "disableShowAllButton", "getTogglableColumns"];
|
|
4
4
|
import * as React from 'react';
|
|
5
5
|
import PropTypes from 'prop-types';
|
|
6
6
|
import { unstable_composeClasses as composeClasses } from '@mui/utils';
|
|
@@ -72,7 +72,8 @@ function GridColumnsPanel(props) {
|
|
|
72
72
|
searchPredicate = defaultSearchPredicate,
|
|
73
73
|
autoFocusSearchField = true,
|
|
74
74
|
disableHideAllButton = false,
|
|
75
|
-
disableShowAllButton = false
|
|
75
|
+
disableShowAllButton = false,
|
|
76
|
+
getTogglableColumns
|
|
76
77
|
} = props,
|
|
77
78
|
other = _objectWithoutPropertiesLoose(props, _excluded);
|
|
78
79
|
const sortedColumns = React.useMemo(() => {
|
|
@@ -110,12 +111,15 @@ function GridColumnsPanel(props) {
|
|
|
110
111
|
setSearchValue(event.target.value);
|
|
111
112
|
}, []);
|
|
112
113
|
const currentColumns = React.useMemo(() => {
|
|
114
|
+
const togglableColumns = getTogglableColumns ? getTogglableColumns(sortedColumns) : null;
|
|
115
|
+
const togglableSortedColumns = togglableColumns ? sortedColumns.filter(({
|
|
116
|
+
field
|
|
117
|
+
}) => togglableColumns.includes(field)) : sortedColumns;
|
|
113
118
|
if (!searchValue) {
|
|
114
|
-
return
|
|
119
|
+
return togglableSortedColumns;
|
|
115
120
|
}
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
}, [sortedColumns, searchValue, searchPredicate]);
|
|
121
|
+
return togglableSortedColumns.filter(column => searchPredicate(column, searchValue.toLowerCase()));
|
|
122
|
+
}, [sortedColumns, searchValue, searchPredicate, getTogglableColumns]);
|
|
119
123
|
const firstSwitchRef = React.useRef(null);
|
|
120
124
|
React.useEffect(() => {
|
|
121
125
|
if (autoFocusSearchField) {
|
|
@@ -196,6 +200,14 @@ process.env.NODE_ENV !== "production" ? GridColumnsPanel.propTypes = {
|
|
|
196
200
|
autoFocusSearchField: PropTypes.bool,
|
|
197
201
|
disableHideAllButton: PropTypes.bool,
|
|
198
202
|
disableShowAllButton: PropTypes.bool,
|
|
203
|
+
/**
|
|
204
|
+
* Returns the list of togglable columns.
|
|
205
|
+
* If used, only those columns will be displayed in the panel
|
|
206
|
+
* which are passed as the return value of the function.
|
|
207
|
+
* @param {GridColDef[]} columns The `ColDef` list of all columns.
|
|
208
|
+
* @returns {GridColDef['field'][]} The list of togglable columns' field names.
|
|
209
|
+
*/
|
|
210
|
+
getTogglableColumns: PropTypes.func,
|
|
199
211
|
searchPredicate: PropTypes.func,
|
|
200
212
|
slotProps: PropTypes.object,
|
|
201
213
|
sort: PropTypes.oneOf(['asc', 'desc'])
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { ButtonProps } from '@mui/material/Button';
|
|
3
|
-
export declare const GridToolbarColumnsButton: React.ForwardRefExoticComponent<Omit<ButtonProps
|
|
3
|
+
export declare const GridToolbarColumnsButton: React.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { ButtonProps } from '@mui/material/Button';
|
|
3
|
-
export declare const GridToolbarDensitySelector: React.ForwardRefExoticComponent<Omit<ButtonProps
|
|
3
|
+
export declare const GridToolbarDensitySelector: React.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { ButtonProps } from '@mui/material/Button';
|
|
3
|
-
export declare const GridToolbarExportContainer: React.ForwardRefExoticComponent<Omit<ButtonProps
|
|
3
|
+
export declare const GridToolbarExportContainer: React.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
@@ -2,7 +2,6 @@ import * as React from 'react';
|
|
|
2
2
|
import { useGridApiMethod } from '../utils/useGridApiMethod';
|
|
3
3
|
import { GridSignature } from '../utils/useGridApiEventHandler';
|
|
4
4
|
import { EventManager } from '../../utils/EventManager';
|
|
5
|
-
import { unstable_resetCreateSelectorCache } from '../../utils/createSelector';
|
|
6
5
|
const isSyntheticEvent = event => {
|
|
7
6
|
return event.isPropagationStopped !== undefined;
|
|
8
7
|
};
|
|
@@ -38,7 +37,9 @@ export function useGridApiInitialization(inputApiRef, props) {
|
|
|
38
37
|
if (!publicApiRef.current) {
|
|
39
38
|
publicApiRef.current = {
|
|
40
39
|
state: {},
|
|
41
|
-
instanceId:
|
|
40
|
+
instanceId: {
|
|
41
|
+
id: globalId
|
|
42
|
+
}
|
|
42
43
|
};
|
|
43
44
|
globalId += 1;
|
|
44
45
|
}
|
|
@@ -76,7 +77,6 @@ export function useGridApiInitialization(inputApiRef, props) {
|
|
|
76
77
|
React.useEffect(() => {
|
|
77
78
|
const api = privateApiRef.current;
|
|
78
79
|
return () => {
|
|
79
|
-
unstable_resetCreateSelectorCache(api.instanceId);
|
|
80
80
|
api.publishEvent('unmount');
|
|
81
81
|
};
|
|
82
82
|
}, [privateApiRef]);
|
|
@@ -19,7 +19,7 @@ export declare const gridColumnLookupSelector: import("../../../utils/createSele
|
|
|
19
19
|
* Get an array of column definitions in the order rendered on screen..
|
|
20
20
|
* @category Columns
|
|
21
21
|
*/
|
|
22
|
-
export declare const gridColumnDefinitionsSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef
|
|
22
|
+
export declare const gridColumnDefinitionsSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[]>;
|
|
23
23
|
/**
|
|
24
24
|
* Get the column visibility model, containing the visibility status of each column.
|
|
25
25
|
* If a column is not registered in the model, it is visible.
|
|
@@ -30,7 +30,7 @@ export declare const gridColumnVisibilityModelSelector: import("../../../utils/c
|
|
|
30
30
|
* Get the visible columns as a lookup (an object containing the field for keys and the definition for values).
|
|
31
31
|
* @category Visible Columns
|
|
32
32
|
*/
|
|
33
|
-
export declare const gridVisibleColumnDefinitionsSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef
|
|
33
|
+
export declare const gridVisibleColumnDefinitionsSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[]>;
|
|
34
34
|
/**
|
|
35
35
|
* Get the field of each visible column.
|
|
36
36
|
* @category Visible Columns
|
|
@@ -50,7 +50,7 @@ export declare const gridColumnsTotalWidthSelector: import("../../../utils/creat
|
|
|
50
50
|
* Get the filterable columns as an array.
|
|
51
51
|
* @category Columns
|
|
52
52
|
*/
|
|
53
|
-
export declare const gridFilterableColumnDefinitionsSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef
|
|
53
|
+
export declare const gridFilterableColumnDefinitionsSelector: import("../../../utils/createSelector").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[]>;
|
|
54
54
|
/**
|
|
55
55
|
* Get the filterable columns as a lookup (an object containing the field for keys and the definition for values).
|
|
56
56
|
* @category Columns
|
|
@@ -242,13 +242,17 @@ export const useGridCellEditing = (apiRef, props) => {
|
|
|
242
242
|
initialValue
|
|
243
243
|
} = params;
|
|
244
244
|
let newValue = apiRef.current.getCellValue(id, field);
|
|
245
|
+
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
246
|
+
let unstable_updateValueOnRender = false;
|
|
245
247
|
if (deleteValue || initialValue) {
|
|
246
248
|
newValue = deleteValue ? '' : initialValue;
|
|
249
|
+
unstable_updateValueOnRender = true;
|
|
247
250
|
}
|
|
248
251
|
const newProps = {
|
|
249
252
|
value: newValue,
|
|
250
253
|
error: false,
|
|
251
|
-
isProcessingProps: false
|
|
254
|
+
isProcessingProps: false,
|
|
255
|
+
unstable_updateValueOnRender
|
|
252
256
|
};
|
|
253
257
|
updateOrDeleteFieldState(id, field, newProps);
|
|
254
258
|
apiRef.current.setCellFocus(id, field);
|
|
@@ -110,9 +110,7 @@ export const useGridEditing = (apiRef, props) => {
|
|
|
110
110
|
}, [apiRef, props.editMode]);
|
|
111
111
|
const getEditCellMeta = React.useCallback((id, field) => {
|
|
112
112
|
const editingState = gridEditRowsStateSelector(apiRef.current.state);
|
|
113
|
-
return
|
|
114
|
-
changeReason: editingState[id][field].changeReason
|
|
115
|
-
};
|
|
113
|
+
return editingState[id][field];
|
|
116
114
|
}, [apiRef]);
|
|
117
115
|
const editingSharedApi = {
|
|
118
116
|
isCellEditable,
|
|
@@ -311,13 +311,17 @@ export const useGridRowEditing = (apiRef, props) => {
|
|
|
311
311
|
return acc;
|
|
312
312
|
}
|
|
313
313
|
let newValue = apiRef.current.getCellValue(id, field);
|
|
314
|
+
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
315
|
+
let unstable_updateValueOnRender = false;
|
|
314
316
|
if (fieldToFocus === field && (deleteValue || initialValue)) {
|
|
315
317
|
newValue = deleteValue ? '' : initialValue;
|
|
318
|
+
unstable_updateValueOnRender = true;
|
|
316
319
|
}
|
|
317
320
|
acc[field] = {
|
|
318
321
|
value: newValue,
|
|
319
322
|
error: false,
|
|
320
|
-
isProcessingProps: false
|
|
323
|
+
isProcessingProps: false,
|
|
324
|
+
unstable_updateValueOnRender
|
|
321
325
|
};
|
|
322
326
|
return acc;
|
|
323
327
|
}, {});
|
|
@@ -4,4 +4,9 @@ export const getDefaultGridFilterModel = () => ({
|
|
|
4
4
|
logicOperator: GridLogicOperator.And,
|
|
5
5
|
quickFilterValues: [],
|
|
6
6
|
quickFilterLogicOperator: GridLogicOperator.And
|
|
7
|
-
});
|
|
7
|
+
});
|
|
8
|
+
|
|
9
|
+
/**
|
|
10
|
+
* @param {GridRowId} rowId The id of the row we want to filter.
|
|
11
|
+
* @param {(filterItem: GridFilterItem) => boolean} shouldApplyItem An optional callback to allow the filtering engine to only apply some items.
|
|
12
|
+
*/
|
|
@@ -114,6 +114,11 @@ export const useGridFilter = (apiRef, props) => {
|
|
|
114
114
|
const filterItemsWithValue = filterModel.items.filter(item => {
|
|
115
115
|
var _column$filterOperato;
|
|
116
116
|
if (item.value !== undefined) {
|
|
117
|
+
// Some filters like `isAnyOf` support array as `item.value`.
|
|
118
|
+
// If array is empty, we want to remove it from the filter model.
|
|
119
|
+
if (Array.isArray(item.value) && item.value.length === 0) {
|
|
120
|
+
return false;
|
|
121
|
+
}
|
|
117
122
|
return true;
|
|
118
123
|
}
|
|
119
124
|
const column = apiRef.current.getColumn(item.field);
|
package/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @mui/x-data-grid v6.0
|
|
2
|
+
* @mui/x-data-grid v6.1.0
|
|
3
3
|
*
|
|
4
4
|
* @license MIT
|
|
5
5
|
* This source code is licensed under the MIT license found in the
|
|
@@ -28,4 +28,12 @@ export { GridColumnMenu, GRID_COLUMN_MENU_SLOTS, GRID_COLUMN_MENU_SLOT_PROPS } f
|
|
|
28
28
|
* The full grid API.
|
|
29
29
|
* @demos
|
|
30
30
|
* - [API object](/x/react-data-grid/api-object/)
|
|
31
|
+
*/
|
|
32
|
+
|
|
33
|
+
/**
|
|
34
|
+
* The state of `DataGrid`.
|
|
35
|
+
*/
|
|
36
|
+
|
|
37
|
+
/**
|
|
38
|
+
* The initial state of `DataGrid`.
|
|
31
39
|
*/
|
|
@@ -7,6 +7,9 @@ import PropTypes from 'prop-types';
|
|
|
7
7
|
import { unstable_useForkRef as useForkRef, unstable_ownerWindow as ownerWindow, unstable_useEventCallback as useEventCallback, unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
|
|
8
8
|
import createDetectElementResize from '../lib/createDetectElementResize';
|
|
9
9
|
// TODO replace with https://caniuse.com/resizeobserver.
|
|
10
|
+
|
|
11
|
+
// Credit to https://github.com/bvaughn/react-virtualized/blob/master/source/AutoSizer/AutoSizer.js
|
|
12
|
+
// for the sources.
|
|
10
13
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
11
14
|
var GridAutoSizer = /*#__PURE__*/React.forwardRef(function AutoSizer(props, ref) {
|
|
12
15
|
var children = props.children,
|
|
@@ -3,7 +3,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
|
|
|
3
3
|
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
4
4
|
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
5
5
|
var _excluded = ["selected", "rowId", "row", "index", "style", "position", "rowHeight", "className", "visibleColumns", "renderedColumns", "containerWidth", "firstColumnToRender", "lastColumnToRender", "isLastVisible", "focusedCell", "tabbableCell", "onClick", "onDoubleClick", "onMouseEnter", "onMouseLeave"],
|
|
6
|
-
_excluded2 = ["changeReason"];
|
|
6
|
+
_excluded2 = ["changeReason", "unstable_updateValueOnRender"];
|
|
7
7
|
import * as React from 'react';
|
|
8
8
|
import PropTypes from 'prop-types';
|
|
9
9
|
import clsx from 'clsx';
|
|
@@ -213,7 +213,10 @@ var GridRow = /*#__PURE__*/React.forwardRef(function GridRow(props, refProp) {
|
|
|
213
213
|
}
|
|
214
214
|
if (editCellState != null && column.renderEditCell) {
|
|
215
215
|
var updatedRow = apiRef.current.getRowWithUpdatedValues(rowId, column.field);
|
|
216
|
+
|
|
217
|
+
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
216
218
|
var changeReason = editCellState.changeReason,
|
|
219
|
+
unstable_updateValueOnRender = editCellState.unstable_updateValueOnRender,
|
|
217
220
|
editCellStateRest = _objectWithoutProperties(editCellState, _excluded2);
|
|
218
221
|
var params = _extends({}, cellParams, {
|
|
219
222
|
row: updatedRow
|