@mui/x-data-grid 8.0.0-alpha.1 → 8.0.0-alpha.11

package/utils/createSelector.d.ts

@@ -1,20 +1,12 @@
-import * as React from 'react';
+import { RefObject } from '@mui/x-internals/types';
 import { Selector, SelectorResultArray } from 'reselect';
 import type { GridCoreApi } from '../models/api/gridCoreApi';
-export interface OutputSelector<State, Result> {
-    (apiRef: React.MutableRefObject<{
+export interface OutputSelector<State, Args, Result> {
+    (apiRef: RefObject<{
         state: State;
         instanceId: GridCoreApi['instanceId'];
-    }>): Result;
-    (state: State, instanceId: GridCoreApi['instanceId']): Result;
-    acceptsApiRef: boolean;
-}
-export interface OutputSelectorV8<State, Args, Result> {
-    (apiRef: React.MutableRefObject<{
-        state: State;
-        instanceId: GridCoreApi['instanceId'];
-    }>, args?: Args): Result;
-    (state: State, instanceId: GridCoreApi['instanceId']): Result;
+    } | null>, args?: Args): Result;
+    (state: State, args?: Args, instanceId?: GridCoreApi['instanceId']): Result;
     acceptsApiRef: boolean;
 }
 type StateFromSelector<T> = T extends (first: infer F, ...args: any[]) => any ? F extends {
@@ -24,19 +16,15 @@ type StateFromSelectorList<Selectors extends readonly any[]> = Selectors extends
     f: infer F,
     ...other: infer R
 ] ? StateFromSelector<F> extends StateFromSelectorList<R> ? StateFromSelector<F> : StateFromSelectorList<R> : {};
-type SelectorArgs<Selectors extends ReadonlyArray<Selector<any>>, Result> = [selectors: [...Selectors], combiner: (...args: SelectorResultArray<Selectors>) => Result] | [...Selectors, (...args: SelectorResultArray<Selectors>) => Result];
 type SelectorResultArrayWithArgs<Selectors extends ReadonlyArray<Selector<any>>, Args> = [
     ...SelectorResultArray<Selectors>,
     Args
 ];
-type SelectorArgsV8<Selectors extends ReadonlyArray<Selector<any>>, Args, Result> = [
+type SelectorArgs<Selectors extends ReadonlyArray<Selector<any>>, Args, Result> = [
     selectors: [...Selectors],
     combiner: (...args: SelectorResultArrayWithArgs<Selectors, Args>) => Result
 ] | [...Selectors, (...args: SelectorResultArrayWithArgs<Selectors, Args>) => Result];
-type CreateSelectorFunction = <Selectors extends ReadonlyArray<Selector<any>>, Result>(...items: SelectorArgs<Selectors, Result>) => OutputSelector<StateFromSelectorList<Selectors>, Result>;
-type CreateSelectorFunctionV8 = <Selectors extends ReadonlyArray<Selector<any>>, Args, Result>(...items: SelectorArgsV8<Selectors, Args, Result>) => OutputSelectorV8<StateFromSelectorList<Selectors>, Args, Result>;
+type CreateSelectorFunction = <Selectors extends ReadonlyArray<Selector<any>>, Args, Result>(...items: SelectorArgs<Selectors, Args, Result>) => OutputSelector<StateFromSelectorList<Selectors>, Args, Result>;
 export declare const createSelector: CreateSelectorFunction;
-export declare const createSelectorV8: CreateSelectorFunctionV8;
 export declare const createSelectorMemoized: CreateSelectorFunction;
-export declare const createSelectorMemoizedV8: CreateSelectorFunctionV8;
 export {};

package/utils/createSelector.js

@@ -8,19 +8,6 @@ const reselectCreateSelector = createSelectorCreator({
     equalityCheck: Object.is
   }
 });
-
-// TODO v8: Remove this type
-
-// TODO v8: Rename this type to `OutputSelector`
-
-// TODO v8: Remove this type
-
-// TODO v8: Rename this type to `SelectorArgs`
-
-// TODO v8: Remove this type
-
-// TODO v8: Rename this type to `CreateSelectorFunction`
-
 const cache = new WeakMap();
 function checkIsAPIRef(value) {
   return 'current' in value && 'instanceId' in value.current;
@@ -28,83 +15,12 @@ function checkIsAPIRef(value) {
 const DEFAULT_INSTANCE_ID = {
   id: 'default'
 };
-
-// TODO v8: Remove this function
 export const createSelector = (a, b, c, d, e, f, ...other) => {
   if (other.length > 0) {
     throw new Error('Unsupported number of selectors');
   }
   let selector;
 
-  // eslint-disable-next-line id-denylist
-  if (a && b && c && d && e && f) {
-    selector = (stateOrApiRef, instanceIdParam) => {
-      const isAPIRef = checkIsAPIRef(stateOrApiRef);
-      const instanceId = instanceIdParam ?? (isAPIRef ? stateOrApiRef.current.instanceId : DEFAULT_INSTANCE_ID);
-      const state = isAPIRef ? stateOrApiRef.current.state : stateOrApiRef;
-      const va = a(state, instanceId);
-      const vb = b(state, instanceId);
-      const vc = c(state, instanceId);
-      const vd = d(state, instanceId);
-      const ve = e(state, instanceId);
-      return f(va, vb, vc, vd, ve);
-    };
-    // eslint-disable-next-line id-denylist
-  } else if (a && b && c && d && e) {
-    selector = (stateOrApiRef, instanceIdParam) => {
-      const isAPIRef = checkIsAPIRef(stateOrApiRef);
-      const instanceId = instanceIdParam ?? (isAPIRef ? stateOrApiRef.current.instanceId : DEFAULT_INSTANCE_ID);
-      const state = isAPIRef ? stateOrApiRef.current.state : stateOrApiRef;
-      const va = a(state, instanceId);
-      const vb = b(state, instanceId);
-      const vc = c(state, instanceId);
-      const vd = d(state, instanceId);
-      return e(va, vb, vc, vd);
-    };
-  } else if (a && b && c && d) {
-    selector = (stateOrApiRef, instanceIdParam) => {
-      const isAPIRef = checkIsAPIRef(stateOrApiRef);
-      const instanceId = instanceIdParam ?? (isAPIRef ? stateOrApiRef.current.instanceId : DEFAULT_INSTANCE_ID);
-      const state = isAPIRef ? stateOrApiRef.current.state : stateOrApiRef;
-      const va = a(state, instanceId);
-      const vb = b(state, instanceId);
-      const vc = c(state, instanceId);
-      return d(va, vb, vc);
-    };
-  } else if (a && b && c) {
-    selector = (stateOrApiRef, instanceIdParam) => {
-      const isAPIRef = checkIsAPIRef(stateOrApiRef);
-      const instanceId = instanceIdParam ?? (isAPIRef ? stateOrApiRef.current.instanceId : DEFAULT_INSTANCE_ID);
-      const state = isAPIRef ? stateOrApiRef.current.state : stateOrApiRef;
-      const va = a(state, instanceId);
-      const vb = b(state, instanceId);
-      return c(va, vb);
-    };
-  } else if (a && b) {
-    selector = (stateOrApiRef, instanceIdParam) => {
-      const isAPIRef = checkIsAPIRef(stateOrApiRef);
-      const instanceId = instanceIdParam ?? (isAPIRef ? stateOrApiRef.current.instanceId : DEFAULT_INSTANCE_ID);
-      const state = isAPIRef ? stateOrApiRef.current.state : stateOrApiRef;
-      const va = a(state, instanceId);
-      return b(va);
-    };
-  } else {
-    throw new Error('Missing arguments');
-  }
-
-  // We use this property to detect if the selector was created with createSelector
-  // or it's only a simple function the receives the state and returns part of it.
-  selector.acceptsApiRef = true;
-  return selector;
-};
-
-// TODO v8: Rename this function to `createSelector`
-export const createSelectorV8 = (a, b, c, d, e, f, ...other) => {
-  if (other.length > 0) {
-    throw new Error('Unsupported number of selectors');
-  }
-  let selector;
-
   // eslint-disable-next-line id-denylist
   if (a && b && c && d && e && f) {
     selector = (stateOrApiRef, args, instanceIdParam) => {
@@ -166,49 +82,14 @@ export const createSelectorV8 = (a, b, c, d, e, f, ...other) => {
   selector.acceptsApiRef = true;
   return selector;
 };
-
-// TODO v8: Remove this function
 export const createSelectorMemoized = (...args) => {
-  const selector = (stateOrApiRef, instanceId) => {
-    const isAPIRef = checkIsAPIRef(stateOrApiRef);
-    const cacheKey = isAPIRef ? stateOrApiRef.current.instanceId : instanceId ?? DEFAULT_INSTANCE_ID;
-    const state = isAPIRef ? stateOrApiRef.current.state : stateOrApiRef;
-    if (process.env.NODE_ENV !== 'production') {
-      if (cacheKey.id === 'default') {
-        warnOnce(['MUI X: A selector was called without passing the instance ID, which may impact the performance of the grid.', 'To fix, call it with `apiRef`, for example `mySelector(apiRef)`, or pass the instance ID explicitly, for example `mySelector(state, apiRef.current.instanceId)`.']);
-      }
-    }
-    const cacheArgsInit = cache.get(cacheKey);
-    const cacheArgs = cacheArgsInit ?? new Map();
-    const cacheFn = cacheArgs?.get(args);
-    if (cacheArgs && cacheFn) {
-      // We pass the cache key because the called selector might have as
-      // dependency another selector created with this `createSelector`.
-      return cacheFn(state, cacheKey);
-    }
-    const fn = reselectCreateSelector(...args);
-    if (!cacheArgsInit) {
-      cache.set(cacheKey, cacheArgs);
-    }
-    cacheArgs.set(args, fn);
-    return fn(state, cacheKey);
-  };
-
-  // We use this property to detect if the selector was created with createSelector
-  // or it's only a simple function the receives the state and returns part of it.
-  selector.acceptsApiRef = true;
-  return selector;
-};
-
-// TODO v8: Rename this function to `createSelectorMemoized`
-export const createSelectorMemoizedV8 = (...args) => {
   const selector = (stateOrApiRef, selectorArgs, instanceId) => {
     const isAPIRef = checkIsAPIRef(stateOrApiRef);
     const cacheKey = isAPIRef ? stateOrApiRef.current.instanceId : instanceId ?? DEFAULT_INSTANCE_ID;
     const state = isAPIRef ? stateOrApiRef.current.state : stateOrApiRef;
     if (process.env.NODE_ENV !== 'production') {
       if (cacheKey.id === 'default') {
-        warnOnce(['MUI X: A selector was called without passing the instance ID, which may impact the performance of the grid.', 'To fix, call it with `apiRef`, for example `mySelector(apiRef)`, or pass the instance ID explicitly, for example `mySelector(state, apiRef.current.instanceId)`.']);
+        warnOnce(['MUI X: A selector was called without passing the instance ID, which may impact the performance of the grid.', 'To fix, call it with `apiRef`, for example `mySelector(apiRef)`, or pass the instance ID explicitly, for example `mySelector(state, args, apiRef.current.instanceId)`.']);
       }
     }
     const cacheArgsInit = cache.get(cacheKey);

package/utils/domUtils.js

@@ -153,7 +153,7 @@ const findPinnedHeaders = ({
   const elements = [];
   api.columnHeadersContainerRef.current.querySelectorAll(`.${gridClasses[position === 'left' ? 'columnHeader--pinnedLeft' : 'columnHeader--pinnedRight']}`).forEach(element => {
     const currentColIndex = parseCellColIndex(element);
-    if (currentColIndex !== null && filterFn(currentColIndex)) {
+    if (currentColIndex !== null && filterFn(currentColIndex, element)) {
       elements.push(element);
     }
   });
@@ -174,7 +174,12 @@ export function findRightPinnedHeadersBeforeCol(api, col, isRtl) {
     api,
     position: isRtl ? 'left' : 'right',
     colIndex,
-    filterFn: index => isRtl ? index > colIndex : index < colIndex
+    filterFn: (index, element) => {
+      if (element.classList.contains(gridClasses['columnHeader--last'])) {
+        return false;
+      }
+      return isRtl ? index > colIndex : index < colIndex;
+    }
   });
 }
 export function findGridHeader(api, field) {

package/utils/getPublicApiRef.d.ts

@@ -1,2 +1,3 @@
+import { RefObject } from '@mui/x-internals/types';
 import type { GridPrivateApiCommunity } from '../models/api/gridApiCommunity';
-export declare function getPublicApiRef<PrivateApi extends GridPrivateApiCommunity>(apiRef: React.MutableRefObject<PrivateApi>): React.MutableRefObject<ReturnType<PrivateApi["getPublicApi"]>>;
+export declare function getPublicApiRef<PrivateApi extends GridPrivateApiCommunity>(apiRef: RefObject<PrivateApi>): RefObject<ReturnType<PrivateApi["getPublicApi"]>>;

package/utils/isJSDOM.d.ts

@@ -0,0 +1 @@
+export declare const isJSDOM: boolean;

package/utils/isJSDOM.js

@@ -0,0 +1 @@
+export const isJSDOM = typeof window !== 'undefined' && /jsdom|HappyDOM/.test(window.navigator.userAgent);

package/utils/keyboardUtils.d.ts

@@ -9,6 +9,6 @@ export declare const isCellExitEditModeKeys: (key: string) => boolean;
 export declare const isCellEditCommitKeys: (key: string) => boolean;
 export declare const isNavigationKey: (key: string) => boolean;
 export declare const isKeyboardEvent: (event: any) => event is React.KeyboardEvent<HTMLElement>;
-export declare const isHideMenuKey: (key: React.KeyboardEvent["key"]) => key is "Tab" | "Escape";
+export declare const isHideMenuKey: (key: React.KeyboardEvent["key"]) => key is "Escape" | "Tab";
 export declare function isPasteShortcut(event: React.KeyboardEvent): boolean;
 export declare function isCopyShortcut(event: KeyboardEvent): boolean;

package/utils/roundToDecimalPlaces.d.ts

@@ -0,0 +1 @@
+export declare function roundToDecimalPlaces(value: number, decimals: number): number;

package/utils/roundToDecimalPlaces.js

@@ -0,0 +1,3 @@
+export function roundToDecimalPlaces(value, decimals) {
+  return Math.round(value * 10 ** decimals) / 10 ** decimals;
+}

package/utils/rtlFlipSide.d.ts

@@ -0,0 +1,2 @@
+import { PinnedColumnPosition } from '../internals/constants';
+export declare const rtlFlipSide: (position: PinnedColumnPosition | undefined, isRtl: boolean) => "left" | "right" | undefined;

package/utils/rtlFlipSide.js

@@ -0,0 +1,22 @@
+import { PinnedColumnPosition } from "../internals/constants.js";
+export const rtlFlipSide = (position, isRtl) => {
+  if (!position) {
+    return undefined;
+  }
+  if (!isRtl) {
+    if (position === PinnedColumnPosition.LEFT) {
+      return 'left';
+    }
+    if (position === PinnedColumnPosition.RIGHT) {
+      return 'right';
+    }
+  } else {
+    if (position === PinnedColumnPosition.LEFT) {
+      return 'right';
+    }
+    if (position === PinnedColumnPosition.RIGHT) {
+      return 'left';
+    }
+  }
+  return undefined;
+};

package/utils/utils.d.ts

@@ -54,3 +54,4 @@ export declare function deepClone(obj: Record<string, any>): any;
  * that hint disables checks on all values instead of just one.
  */
 export declare function eslintUseValue(_: any): void;
+export declare const runIf: (condition: boolean, fn: Function) => (params: unknown) => void;

package/utils/utils.js

@@ -196,4 +196,9 @@ export function deepClone(obj) {
  * of a `eslint-disable-next-line react-hooks/exhaustive-deps` because
  * that hint disables checks on all values instead of just one.
  */
-export function eslintUseValue(_) {}
+export function eslintUseValue(_) {}
+export const runIf = (condition, fn) => params => {
+  if (condition) {
+    fn(params);
+  }
+};

package/components/panel/filterPanel/GridFilterInputValueProps.d.ts

@@ -1,11 +0,0 @@
-import * as React from 'react';
-import { TextFieldProps } from '@mui/material/TextField';
-import { GridFilterItem } from '../../../models/gridFilterItem';
-import type { GridApiCommon } from '../../../models/api/gridApiCommon';
-import type { GridApiCommunity } from '../../../models/api/gridApiCommunity';
-export type GridFilterInputValueProps<Api extends GridApiCommon = GridApiCommunity> = {
-    item: GridFilterItem;
-    applyValue: (value: GridFilterItem) => void;
-    apiRef: React.MutableRefObject<Api>;
-    focusElementRef?: React.Ref<any>;
-} & Pick<TextFieldProps, 'color' | 'error' | 'helperText' | 'size' | 'variant'>;

package/internals/utils/useProps.d.ts

@@ -1 +0,0 @@
-export declare function useProps<T extends Record<string, any>>(allProps: T): T;

package/internals/utils/useProps.js

@@ -1,24 +0,0 @@
-import * as React from 'react';
-
-/** Gathers props for the root element into a single `.forwardedProps` field */
-function groupForwardedProps(props) {
-  const keys = Object.keys(props);
-  if (!keys.some(key => key.startsWith('aria-') || key.startsWith('data-'))) {
-    return props;
-  }
-  const newProps = {};
-  const forwardedProps = props.forwardedProps ?? {};
-  for (let i = 0; i < keys.length; i += 1) {
-    const key = keys[i];
-    if (key.startsWith('aria-') || key.startsWith('data-')) {
-      forwardedProps[key] = props[key];
-    } else {
-      newProps[key] = props[key];
-    }
-  }
-  newProps.forwardedProps = forwardedProps;
-  return newProps;
-}
-export function useProps(allProps) {
-  return React.useMemo(() => groupForwardedProps(allProps), [allProps]);
-}

package/joy/icons.d.ts

@@ -1,32 +0,0 @@
-import { GridIconSlotsComponent } from '../models/gridIconSlotsComponent';
-export declare const GridArrowUpwardIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridArrowDownwardIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridKeyboardArrowLeft: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridKeyboardArrowRight: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridExpandMoreIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridFilterListIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridFilterAltIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridSearchIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridMenuIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridCheckCircleIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridColumnIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridSeparatorIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridViewHeadlineIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridTableRowsIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridViewStreamIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridTripleDotsVerticalIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridCloseIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridAddIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridRemoveIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridLoadIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridDragIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridSaveAltIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridCheckIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridMoreVertIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridVisibilityOffIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridViewColumnIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridClearIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridDeleteIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-export declare const GridDeleteForeverIcon: import("@mui/types").OverridableComponent<import("@mui/joy/SvgIcon").SvgIconTypeMap<{}, "svg">>;
-declare const joyIconSlots: GridIconSlotsComponent;
-export default joyIconSlots;