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

package/esm/models/props/DataGridProps.js

@@ -0,0 +1 @@
+export {};

package/esm/package.json

@@ -0,0 +1 @@
+{"type":"module","sideEffects":false}

package/esm/themeAugmentation/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./overrides.js";
+export * from "./props.js";

package/esm/themeAugmentation/index.js

@@ -0,0 +1,4 @@
+export * from "./overrides.js";
+export * from "./props.js";
+// TODO v5
+// export * from './components';

package/esm/themeAugmentation/overrides.d.ts

@@ -0,0 +1,18 @@
+import { GridClassKey } from "../constants/gridClasses.js";
+export interface DataGridComponentNameToClassKey {
+  MuiDataGrid: GridClassKey;
+}
+declare module '@mui/material/styles' {
+  interface ComponentNameToClassKey extends DataGridComponentNameToClassKey {}
+  interface PaletteDataGrid {
+    bg?: string;
+    headerBg?: string;
+    pinnedBg?: string;
+  }
+  interface CssVarsPalette {
+    DataGrid: PaletteDataGrid;
+  }
+  interface PaletteOptions {
+    DataGrid?: Partial<PaletteDataGrid>;
+  }
+}

package/esm/themeAugmentation/overrides.js

@@ -0,0 +1 @@
+export {};

package/esm/themeAugmentation/props.d.ts

@@ -0,0 +1,15 @@
+import { ComponentsOverrides, ComponentsProps } from '@mui/material/styles';
+import { DataGridProps } from "../models/props/DataGridProps.js";
+export interface DataGridComponentsPropsList {
+  MuiDataGrid: DataGridProps;
+}
+export interface DataGridComponents<Theme = unknown> {
+  MuiDataGrid?: {
+    defaultProps?: ComponentsProps['MuiDataGrid'];
+    styleOverrides?: ComponentsOverrides<Theme>['MuiDataGrid'];
+  };
+}
+declare module '@mui/material/styles' {
+  interface ComponentsPropsList extends DataGridComponentsPropsList {}
+  interface Components<Theme = unknown> extends DataGridComponents<Theme> {}
+}

package/esm/themeAugmentation/props.js

@@ -0,0 +1 @@
+export {};

package/esm/utils/ResizeObserver.d.ts

@@ -0,0 +1,4 @@
+/**
+ * HACK: Minimal shim to get jsdom to work.
+ */
+export declare const ResizeObserver: typeof globalThis.ResizeObserver;

package/esm/utils/ResizeObserver.js

@@ -0,0 +1,10 @@
+/* eslint-disable */
+
+/**
+ * HACK: Minimal shim to get jsdom to work.
+ */
+export const ResizeObserver = typeof globalThis.ResizeObserver !== 'undefined' ? globalThis.ResizeObserver : class ResizeObserver {
+  observe() {}
+  unobserve() {}
+  disconnect() {}
+};

package/esm/utils/Store.d.ts

@@ -0,0 +1,11 @@
+type Listener<T> = (value: T) => void;
+export declare class Store<T> {
+  value: T;
+  listeners: Set<Listener<T>>;
+  static create<T>(value: T): Store<T>;
+  constructor(value: T);
+  subscribe: (fn: Listener<T>) => () => void;
+  getSnapshot: () => T;
+  update: (value: T) => void;
+}
+export {};

package/esm/utils/Store.js

@@ -0,0 +1,24 @@
+export class Store {
+  static create(value) {
+    return new Store(value);
+  }
+  constructor(_value) {
+    this.value = void 0;
+    this.listeners = void 0;
+    this.subscribe = fn => {
+      this.listeners.add(fn);
+      return () => {
+        this.listeners.delete(fn);
+      };
+    };
+    this.getSnapshot = () => {
+      return this.value;
+    };
+    this.update = value => {
+      this.value = value;
+      this.listeners.forEach(l => l(value));
+    };
+    this.value = _value;
+    this.listeners = new Set();
+  }
+}

package/esm/utils/assert.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare function NotRendered<T>(_props: T): React.ReactNode;

package/esm/utils/assert.js

@@ -0,0 +1,3 @@
+export function NotRendered(_props) {
+  throw new Error('Failed assertion: should not be rendered');
+}

package/esm/utils/cellBorderUtils.d.ts

@@ -0,0 +1,3 @@
+import { PinnedColumnPosition } from "../internals/constants.js";
+export declare const shouldCellShowRightBorder: (pinnedPosition: PinnedColumnPosition | undefined, indexInSection: number, sectionLength: number, showCellVerticalBorderRootProp: boolean, gridHasFiller: boolean) => boolean;
+export declare const shouldCellShowLeftBorder: (pinnedPosition: PinnedColumnPosition | undefined, indexInSection: number) => boolean;

package/esm/utils/cellBorderUtils.js

@@ -0,0 +1,21 @@
+import { PinnedColumnPosition } from "../internals/constants.js";
+export const shouldCellShowRightBorder = (pinnedPosition, indexInSection, sectionLength, showCellVerticalBorderRootProp, gridHasFiller) => {
+  const isSectionLastCell = indexInSection === sectionLength - 1;
+  if (pinnedPosition === PinnedColumnPosition.LEFT && isSectionLastCell) {
+    return true;
+  }
+  if (showCellVerticalBorderRootProp) {
+    if (pinnedPosition === PinnedColumnPosition.LEFT) {
+      return true;
+    }
+    if (pinnedPosition === PinnedColumnPosition.RIGHT) {
+      return !isSectionLastCell;
+    }
+    // pinnedPosition === undefined, middle section
+    return !isSectionLastCell || gridHasFiller;
+  }
+  return false;
+};
+export const shouldCellShowLeftBorder = (pinnedPosition, indexInSection) => {
+  return pinnedPosition === PinnedColumnPosition.RIGHT && indexInSection === 0;
+};

package/esm/utils/cleanupTracking/CleanupTracking.d.ts

@@ -0,0 +1,9 @@
+export type UnregisterToken = {
+  cleanupToken: number;
+};
+export type UnsubscribeFn = () => void;
+export interface CleanupTracking {
+  register(object: any, unsubscribe: UnsubscribeFn, unregisterToken: UnregisterToken): void;
+  unregister(unregisterToken: UnregisterToken): void;
+  reset(): void;
+}

package/esm/utils/cleanupTracking/CleanupTracking.js

@@ -0,0 +1 @@
+export {};

package/esm/utils/cleanupTracking/FinalizationRegistryBasedCleanupTracking.d.ts

@@ -0,0 +1,7 @@
+import { CleanupTracking, UnsubscribeFn, UnregisterToken } from "./CleanupTracking.js";
+export declare class FinalizationRegistryBasedCleanupTracking implements CleanupTracking {
+  registry: FinalizationRegistry<UnsubscribeFn>;
+  register(object: any, unsubscribe: UnsubscribeFn, unregisterToken: UnregisterToken): void;
+  unregister(unregisterToken: UnregisterToken): void;
+  reset(): void;
+}

package/esm/utils/cleanupTracking/FinalizationRegistryBasedCleanupTracking.js

@@ -0,0 +1,18 @@
+export class FinalizationRegistryBasedCleanupTracking {
+  constructor() {
+    this.registry = new FinalizationRegistry(unsubscribe => {
+      if (typeof unsubscribe === 'function') {
+        unsubscribe();
+      }
+    });
+  }
+  register(object, unsubscribe, unregisterToken) {
+    this.registry.register(object, unsubscribe, unregisterToken);
+  }
+  unregister(unregisterToken) {
+    this.registry.unregister(unregisterToken);
+  }
+
+  // eslint-disable-next-line class-methods-use-this
+  reset() {}
+}

package/esm/utils/cleanupTracking/TimerBasedCleanupTracking.d.ts

@@ -0,0 +1,9 @@
+import { CleanupTracking, UnregisterToken, UnsubscribeFn } from "./CleanupTracking.js";
+export declare class TimerBasedCleanupTracking implements CleanupTracking {
+  timeouts?: Map<number, NodeJS.Timeout> | undefined;
+  cleanupTimeout: number;
+  constructor(timeout?: number);
+  register(object: any, unsubscribe: UnsubscribeFn, unregisterToken: UnregisterToken): void;
+  unregister(unregisterToken: UnregisterToken): void;
+  reset(): void;
+}

package/esm/utils/cleanupTracking/TimerBasedCleanupTracking.js

@@ -0,0 +1,38 @@
+// If no effect ran after this amount of time, we assume that the render was not committed by React
+const CLEANUP_TIMER_LOOP_MILLIS = 1000;
+export class TimerBasedCleanupTracking {
+  constructor(timeout = CLEANUP_TIMER_LOOP_MILLIS) {
+    this.timeouts = new Map();
+    this.cleanupTimeout = CLEANUP_TIMER_LOOP_MILLIS;
+    this.cleanupTimeout = timeout;
+  }
+  register(object, unsubscribe, unregisterToken) {
+    if (!this.timeouts) {
+      this.timeouts = new Map();
+    }
+    const timeout = setTimeout(() => {
+      if (typeof unsubscribe === 'function') {
+        unsubscribe();
+      }
+      this.timeouts.delete(unregisterToken.cleanupToken);
+    }, this.cleanupTimeout);
+    this.timeouts.set(unregisterToken.cleanupToken, timeout);
+  }
+  unregister(unregisterToken) {
+    const timeout = this.timeouts.get(unregisterToken.cleanupToken);
+    if (timeout) {
+      this.timeouts.delete(unregisterToken.cleanupToken);
+      clearTimeout(timeout);
+    }
+  }
+  reset() {
+    if (this.timeouts) {
+      this.timeouts.forEach((value, key) => {
+        this.unregister({
+          cleanupToken: key
+        });
+      });
+      this.timeouts = undefined;
+    }
+  }
+}

package/esm/utils/composeGridClasses.d.ts

@@ -0,0 +1,3 @@
+import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import type { DataGridProcessedProps } from '../models/props/DataGridProps';
+export declare function composeGridClasses(classes: DataGridProcessedProps['classes'], slots: Parameters<typeof composeClasses>[0]): Record<string, string>;

package/esm/utils/composeGridClasses.js

@@ -0,0 +1,5 @@
+import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import { getDataGridUtilityClass } from "../constants/gridClasses.js";
+export function composeGridClasses(classes, slots) {
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+}

package/esm/utils/createControllablePromise.d.ts

@@ -0,0 +1,5 @@
+export type ControllablePromise<T = unknown> = Promise<T> & {
+  resolve: T extends unknown ? (value?: T) => void : (value: T) => void;
+  reject: (reason?: any) => void;
+};
+export declare function createControllablePromise(): ControllablePromise<unknown>;

package/esm/utils/createControllablePromise.js

@@ -0,0 +1,11 @@
+export function createControllablePromise() {
+  let resolve;
+  let reject;
+  const promise = new Promise((_resolve, _reject) => {
+    resolve = _resolve;
+    reject = _reject;
+  });
+  promise.resolve = resolve;
+  promise.reject = reject;
+  return promise;
+}

package/esm/utils/createSelector.d.ts

@@ -0,0 +1,23 @@
+import { RefObject } from '@mui/x-internals/types';
+import { Selector, SelectorResultArray } from 'reselect';
+export interface OutputSelector<State, Args, Result> {
+  (apiRef: RefObject<{
+    state: State;
+  } | null>, args?: Args): Result;
+}
+type StateFromSelector<T> = T extends ((first: infer F, ...args: any[]) => any) ? F extends RefObject<{
+  state: infer F2;
+} | null> ? F2 : F : never;
+type StateFromSelectorList<Selectors extends readonly any[]> = Selectors extends [f: infer F, ...other: infer R] ? StateFromSelector<F> extends StateFromSelectorList<R> ? StateFromSelector<F> : StateFromSelectorList<R> : {};
+type SelectorResultArrayWithArgs<Selectors extends ReadonlyArray<Selector<any>>, Args> = [...SelectorResultArray<Selectors>, Args];
+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>>, Args, Result>(...items: SelectorArgs<Selectors, Args, Result>) => OutputSelector<StateFromSelectorList<Selectors>, Args, Result>;
+export declare const createSelector: CreateSelectorFunction;
+/**
+ * Used to create the root selector for a feature. It assumes that the state is already initialized
+ * and strips from the types the possibility of `apiRef` being `null`.
+ * Users are warned about this in our documentation https://mui.com/x/react-data-grid/state/#direct-selector-access
+ */
+export declare const createRootSelector: <State, Args, Result>(fn: (state: State, args: Args) => Result) => OutputSelector<State, Args, Result>;
+export declare const createSelectorMemoized: CreateSelectorFunction;
+export {};

package/esm/utils/createSelector.js

@@ -0,0 +1,94 @@
+import { lruMemoize, createSelectorCreator } from 'reselect';
+import { argsEqual } from "../hooks/utils/useGridSelector.js";
+import { weakMapMemoize as customWeakMapMemoize } from "./weakMapMemoize.js";
+const reselectCreateSelector = createSelectorCreator({
+  memoize: lruMemoize,
+  memoizeOptions: {
+    maxSize: 1,
+    equalityCheck: Object.is
+  },
+  argsMemoize: customWeakMapMemoize
+});
+const cache = new WeakMap();
+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 = (apiRef, args) => {
+      const va = a(apiRef, args);
+      const vb = b(apiRef, args);
+      const vc = c(apiRef, args);
+      const vd = d(apiRef, args);
+      const ve = e(apiRef, args);
+      return f(va, vb, vc, vd, ve, args);
+    };
+    // eslint-disable-next-line id-denylist
+  } else if (a && b && c && d && e) {
+    selector = (apiRef, args) => {
+      const va = a(apiRef, args);
+      const vb = b(apiRef, args);
+      const vc = c(apiRef, args);
+      const vd = d(apiRef, args);
+      return e(va, vb, vc, vd, args);
+    };
+  } else if (a && b && c && d) {
+    selector = (apiRef, args) => {
+      const va = a(apiRef, args);
+      const vb = b(apiRef, args);
+      const vc = c(apiRef, args);
+      return d(va, vb, vc, args);
+    };
+  } else if (a && b && c) {
+    selector = (apiRef, args) => {
+      const va = a(apiRef, args);
+      const vb = b(apiRef, args);
+      return c(va, vb, args);
+    };
+  } else if (a && b) {
+    selector = (apiRef, args) => {
+      const va = a(apiRef, args);
+      return b(va, args);
+    };
+  } else {
+    throw new Error('Missing arguments');
+  }
+  return selector;
+};
+
+/**
+ * Used to create the root selector for a feature. It assumes that the state is already initialized
+ * and strips from the types the possibility of `apiRef` being `null`.
+ * Users are warned about this in our documentation https://mui.com/x/react-data-grid/state/#direct-selector-access
+ */
+export const createRootSelector = fn => (apiRef, args) => fn(apiRef.current.state, args);
+export const createSelectorMemoized = (...args) => {
+  const selector = (apiRef, selectorArgs) => {
+    const cacheKey = apiRef.current.instanceId;
+    const cacheArgsInit = cache.get(cacheKey);
+    const cacheArgs = cacheArgsInit ?? new Map();
+    const cacheFn = cacheArgs.get(args);
+    if (cacheArgs && cacheFn) {
+      if (!argsEqual(cacheFn.selectorArgs, selectorArgs)) {
+        const reselectArgs = selectorArgs !== undefined ? [...args.slice(0, args.length - 1), () => selectorArgs, args[args.length - 1]] : args;
+        const fn = reselectCreateSelector(...reselectArgs);
+        fn.selectorArgs = selectorArgs;
+        cacheArgs.set(args, fn);
+        return fn(apiRef, selectorArgs);
+      }
+      return cacheFn(apiRef, selectorArgs);
+    }
+    const reselectArgs = selectorArgs !== undefined ? [...args.slice(0, args.length - 1), () => selectorArgs, args[args.length - 1]] : args;
+    const fn = reselectCreateSelector(...reselectArgs);
+    fn.selectorArgs = selectorArgs;
+    if (!cacheArgsInit) {
+      cache.set(cacheKey, cacheArgs);
+    }
+    cacheArgs.set(args, fn);
+    return fn(apiRef, selectorArgs);
+  };
+  return selector;
+};

package/esm/utils/css/context.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+export declare function useCSSVariablesClass(): string;
+export declare function useCSSVariablesContext(): {
+  className: string;
+  tag: React.JSX.Element;
+};
+export declare function GridPortalWrapper({
+  children
+}: {
+  children: React.ReactNode;
+}): React.JSX.Element;
+export declare function GridCSSVariablesContext(props: {
+  children: any;
+}): React.JSX.Element;

package/esm/utils/css/context.js

@@ -0,0 +1,54 @@
+import * as React from 'react';
+import { useGridConfiguration } from "../../hooks/utils/useGridConfiguration.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const CLASSNAME_PREFIX = 'MuiDataGridVariables';
+const CSSVariablesContext = /*#__PURE__*/React.createContext({
+  className: 'unset',
+  tag: /*#__PURE__*/_jsx("style", {
+    href: "/unset"
+  })
+});
+export function useCSSVariablesClass() {
+  return React.useContext(CSSVariablesContext).className;
+}
+export function useCSSVariablesContext() {
+  return React.useContext(CSSVariablesContext);
+}
+export function GridPortalWrapper({
+  children
+}) {
+  const className = useCSSVariablesClass();
+  return /*#__PURE__*/_jsx("div", {
+    className: className,
+    children: children
+  });
+}
+export function GridCSSVariablesContext(props) {
+  const config = useGridConfiguration();
+  const description = config.hooks.useCSSVariables();
+  const context = React.useMemo(() => {
+    const className = `${CLASSNAME_PREFIX}-${description.id}`;
+    const cssString = `.${className}{${variablesToString(description.variables)}}`;
+    const tag = /*#__PURE__*/_jsx("style", {
+      href: `/${className}`,
+      children: cssString
+    });
+    return {
+      className,
+      tag
+    };
+  }, [description]);
+  return /*#__PURE__*/_jsx(CSSVariablesContext.Provider, {
+    value: context,
+    children: props.children
+  });
+}
+function variablesToString(variables) {
+  let output = '';
+  for (const key in variables) {
+    if (Object.hasOwn(variables, key)) {
+      output += `${key}:${variables[key]};`;
+    }
+  }
+  return output;
+}

package/esm/utils/doesSupportPreventScroll.d.ts

@@ -0,0 +1 @@
+export declare function doesSupportPreventScroll(): boolean;

package/esm/utils/doesSupportPreventScroll.js

@@ -0,0 +1,13 @@
+// Based on https://stackoverflow.com/a/59518678
+let cachedSupportsPreventScroll;
+export function doesSupportPreventScroll() {
+  if (cachedSupportsPreventScroll === undefined) {
+    document.createElement('div').focus({
+      get preventScroll() {
+        cachedSupportsPreventScroll = true;
+        return false;
+      }
+    });
+  }
+  return cachedSupportsPreventScroll;
+}

package/esm/utils/domUtils.d.ts

@@ -0,0 +1,29 @@
+import { gridClasses } from "../constants/gridClasses.js";
+import type { GridPrivateApiCommunity } from '../models/api/gridApiCommunity';
+import type { GridRowId } from '../models/gridRows';
+export declare function isOverflown(element: Element): boolean;
+export declare function findParentElementFromClassName(elem: Element, className: string): Element | null;
+export declare function escapeOperandAttributeSelector(operand: string): string;
+export declare function getGridColumnHeaderElement(root: Element, field: string): HTMLDivElement | null;
+export declare function getGridRowElement(root: Element, id: GridRowId): HTMLDivElement | null;
+export declare function getGridCellElement(root: Element, {
+  id,
+  field
+}: {
+  id: GridRowId;
+  field: string;
+}): HTMLDivElement | null;
+export declare const getActiveElement: (root?: Document | ShadowRoot) => Element | null;
+export declare function isEventTargetInPortal(event: React.SyntheticEvent): boolean;
+export declare function getFieldFromHeaderElem(colCellEl: Element): string;
+export declare function findHeaderElementFromField(elem: Element, field: string): HTMLDivElement;
+export declare function getFieldsFromGroupHeaderElem(colCellEl: Element): string[];
+export declare function findGroupHeaderElementsFromField(elem: Element, field: string): Element[];
+export declare function findGridCellElementsFromCol(col: HTMLElement, api: GridPrivateApiCommunity): Element[];
+export declare function findGridElement(api: GridPrivateApiCommunity, klass: keyof typeof gridClasses): HTMLElement;
+export declare function findLeftPinnedCellsAfterCol(api: GridPrivateApiCommunity, col: HTMLElement, isRtl: boolean): HTMLElement[];
+export declare function findRightPinnedCellsBeforeCol(api: GridPrivateApiCommunity, col: HTMLElement, isRtl: boolean): HTMLElement[];
+export declare function findLeftPinnedHeadersAfterCol(api: GridPrivateApiCommunity, col: HTMLElement, isRtl: boolean): HTMLElement[];
+export declare function findRightPinnedHeadersBeforeCol(api: GridPrivateApiCommunity, col: HTMLElement, isRtl: boolean): HTMLElement[];
+export declare function findGridHeader(api: GridPrivateApiCommunity, field: string): Element | null;
+export declare function findGridCells(api: GridPrivateApiCommunity, field: string): Element[];