@mui/x-data-grid 6.0.0-alpha.2 → 6.0.0-alpha.4

package/node/hooks/features/editRows/useGridCellEditing.old.js

@@ -1,380 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useCellEditing = void 0;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var React = _interopRequireWildcard(require("react"));
-
-var _utils = require("@mui/material/utils");
-
-var _useGridApiEventHandler = require("../../utils/useGridApiEventHandler");
-
-var _gridEditRowModel = require("../../../models/gridEditRowModel");
-
-var _keyboardUtils = require("../../../utils/keyboardUtils");
-
-var _useGridLogger = require("../../utils/useGridLogger");
-
-var _gridFocusStateSelector = require("../focus/gridFocusStateSelector");
-
-var _useGridApiMethod = require("../../utils/useGridApiMethod");
-
-var _gridEditRowsSelector = require("./gridEditRowsSelector");
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function isPromise(promise) {
-  return typeof promise.then === 'function';
-}
-
-const useCellEditing = (apiRef, props) => {
-  var _props$experimentalFe2;
-
-  const logger = (0, _useGridLogger.useGridLogger)(apiRef, 'useGridEditRows');
-
-  const buildCallback = callback => (...args) => {
-    if (props.editMode === _gridEditRowModel.GridEditModes.Cell) {
-      callback(...args);
-    }
-  };
-
-  const setCellMode = React.useCallback((id, field, mode) => {
-    if (apiRef.current.getCellMode(id, field) === mode) {
-      return;
-    }
-
-    logger.debug(`Switching cell id: ${id} field: ${field} to mode: ${mode}`);
-    apiRef.current.setState(state => {
-      const newEditRowsState = (0, _extends2.default)({}, state.editRows);
-      newEditRowsState[id] = (0, _extends2.default)({}, newEditRowsState[id]);
-
-      if (mode === _gridEditRowModel.GridCellModes.Edit) {
-        newEditRowsState[id][field] = {
-          value: apiRef.current.getCellValue(id, field)
-        };
-      } else {
-        delete newEditRowsState[id][field];
-
-        if (!Object.keys(newEditRowsState[id]).length) {
-          delete newEditRowsState[id];
-        }
-      }
-
-      return (0, _extends2.default)({}, state, {
-        editRows: newEditRowsState
-      });
-    });
-    apiRef.current.forceUpdate();
-    apiRef.current.publishEvent('cellModeChange', apiRef.current.getCellParams(id, field));
-  }, [apiRef, logger]);
-  const getCellMode = React.useCallback((id, field) => {
-    const editRowsState = (0, _gridEditRowsSelector.gridEditRowsStateSelector)(apiRef.current.state);
-    const isEditing = editRowsState[id] && editRowsState[id][field];
-    return isEditing ? _gridEditRowModel.GridCellModes.Edit : _gridEditRowModel.GridCellModes.View;
-  }, [apiRef]); // TODO v6: it should always return a promise
-
-  const commitCellChange = React.useCallback((params, event = {}) => {
-    var _props$experimentalFe;
-
-    const {
-      id,
-      field
-    } = params;
-    apiRef.current.unstable_runPendingEditCellValueMutation(id, field);
-    const model = apiRef.current.getEditRowsModel();
-
-    if (!model[id] || !model[id][field]) {
-      throw new Error(`MUI: Cell at id: ${id} and field: ${field} is not in edit mode.`);
-    }
-
-    const editCellProps = model[id][field];
-    const column = apiRef.current.getColumn(field);
-    const row = apiRef.current.getRow(id);
-
-    if ((_props$experimentalFe = props.experimentalFeatures) != null && _props$experimentalFe.preventCommitWhileValidating) {
-      const cellProps = model[id][field];
-
-      if (cellProps.isValidating || cellProps.error) {
-        return false;
-      }
-    }
-
-    const commitParams = (0, _extends2.default)({}, params, {
-      value: editCellProps.value
-    });
-    let hasError = !!editCellProps.error;
-
-    if (!hasError && typeof column.preProcessEditCellProps === 'function') {
-      const result = column.preProcessEditCellProps({
-        id,
-        row,
-        props: editCellProps
-      });
-
-      if (isPromise(result)) {
-        return result.then(newEditCellProps => {
-          apiRef.current.unstable_setEditCellProps({
-            id,
-            field,
-            props: newEditCellProps
-          });
-
-          if (newEditCellProps.error) {
-            return false;
-          }
-
-          apiRef.current.publishEvent('cellEditCommit', commitParams, event);
-          return true;
-        });
-      }
-
-      apiRef.current.unstable_setEditCellProps({
-        id,
-        field,
-        props: result
-      });
-      hasError = !!result.error;
-    }
-
-    if (!hasError) {
-      apiRef.current.publishEvent('cellEditCommit', commitParams, event);
-      return true;
-    }
-
-    return false;
-  }, [apiRef, (_props$experimentalFe2 = props.experimentalFeatures) == null ? void 0 : _props$experimentalFe2.preventCommitWhileValidating]);
-  const setCellEditingEditCellValue = React.useCallback(params => {
-    const column = apiRef.current.getColumn(params.field);
-    const row = apiRef.current.getRow(params.id);
-    return new Promise(resolve => {
-      let newEditCellProps = {
-        value: params.value
-      };
-      const model = apiRef.current.getEditRowsModel();
-      const editCellProps = model[params.id][params.field];
-
-      if (typeof column.preProcessEditCellProps !== 'function') {
-        apiRef.current.unstable_setEditCellProps((0, _extends2.default)({}, params, {
-          props: newEditCellProps
-        }));
-        resolve(true);
-        return;
-      } // setEditCellProps runs the value parser and returns the updated props
-
-
-      newEditCellProps = apiRef.current.unstable_setEditCellProps((0, _extends2.default)({}, params, {
-        props: (0, _extends2.default)({}, editCellProps, {
-          isValidating: true
-        })
-      }));
-      Promise.resolve(column.preProcessEditCellProps({
-        id: params.id,
-        row,
-        props: (0, _extends2.default)({}, newEditCellProps, {
-          value: apiRef.current.unstable_parseValue(params.id, params.field, params.value)
-        })
-      })).then(newEditCellPropsProcessed => {
-        apiRef.current.unstable_setEditCellProps((0, _extends2.default)({}, params, {
-          props: (0, _extends2.default)({}, newEditCellPropsProcessed, {
-            isValidating: false
-          })
-        }));
-        resolve(!newEditCellPropsProcessed.error);
-      });
-    });
-  }, [apiRef]);
-  const cellEditingApi = {
-    setCellMode,
-    getCellMode,
-    commitCellChange,
-    unstable_setCellEditingEditCellValue: setCellEditingEditCellValue
-  };
-  (0, _useGridApiMethod.useGridApiMethod)(apiRef, cellEditingApi, 'EditRowApi');
-  const handleCellKeyDown = React.useCallback(async (params, event) => {
-    // Wait until IME is settled for Asian languages like Japanese and Chinese
-    // TODO: `event.which` is depricated but this is a temporary workaround
-    if (event.which === 229) {
-      return;
-    }
-
-    const {
-      id,
-      field,
-      cellMode,
-      isEditable
-    } = params;
-
-    if (!isEditable) {
-      return;
-    }
-
-    const isEditMode = cellMode === _gridEditRowModel.GridCellModes.Edit;
-    const isModifierKeyPressed = event.ctrlKey || event.metaKey || event.altKey;
-
-    if (!isEditMode && (0, _keyboardUtils.isCellEnterEditModeKeys)(event) && !isModifierKeyPressed && !(event.key === ' ' && event.shiftKey)) {
-      apiRef.current.publishEvent('cellEditStart', params, event);
-    }
-
-    if (!isEditMode && (0, _keyboardUtils.isDeleteKeys)(event.key)) {
-      apiRef.current.setEditCellValue({
-        id,
-        field,
-        value: ''
-      });
-      apiRef.current.commitCellChange({
-        id,
-        field
-      }, event);
-      apiRef.current.publishEvent('cellEditStop', params, event);
-    }
-
-    if (isEditMode && (0, _keyboardUtils.isCellEditCommitKeys)(event.key)) {
-      const commitParams = {
-        id,
-        field
-      };
-      const isValid = await apiRef.current.commitCellChange(commitParams, event);
-
-      if (!isValid) {
-        return;
-      }
-    }
-
-    if (isEditMode && (0, _keyboardUtils.isCellExitEditModeKeys)(event.key)) {
-      apiRef.current.publishEvent('cellEditStop', params, event);
-    }
-  }, [apiRef]);
-  const handleCellDoubleClick = React.useCallback((params, event) => {
-    if (!params.isEditable) {
-      return;
-    }
-
-    apiRef.current.publishEvent('cellEditStart', params, event);
-  }, [apiRef]);
-
-  const commitPropsAndExit = async (params, event) => {
-    if (params.cellMode === _gridEditRowModel.GridCellModes.View) {
-      return;
-    }
-
-    await apiRef.current.commitCellChange(params, event);
-    apiRef.current.publishEvent('cellEditStop', params, event);
-  };
-
-  const handleCellFocusOut = (0, _utils.useEventCallback)((params, event) => {
-    commitPropsAndExit(params, event);
-  });
-  const handleColumnHeaderDragStart = (0, _utils.useEventCallback)(() => {
-    const cell = (0, _gridFocusStateSelector.gridFocusCellSelector)(apiRef);
-
-    if (!cell) {
-      return;
-    }
-
-    const params = apiRef.current.getCellParams(cell.id, cell.field);
-    commitPropsAndExit(params, {});
-  });
-  const handleCellEditStart = React.useCallback((params, event) => {
-    if (!params.isEditable) {
-      return;
-    }
-
-    apiRef.current.setCellMode(params.id, params.field, _gridEditRowModel.GridCellModes.Edit);
-
-    if ((0, _keyboardUtils.isKeyboardEvent)(event) && (0, _keyboardUtils.isPrintableKey)(event)) {
-      apiRef.current.unstable_setEditCellProps({
-        id: params.id,
-        field: params.field,
-        props: {
-          value: ''
-        }
-      });
-    }
-  }, [apiRef]);
-  const handleCellEditStop = React.useCallback((params, event) => {
-    apiRef.current.setCellMode(params.id, params.field, _gridEditRowModel.GridCellModes.View);
-
-    if (!(0, _keyboardUtils.isKeyboardEvent)(event)) {
-      return;
-    }
-
-    if ((0, _keyboardUtils.isCellEditCommitKeys)(event.key)) {
-      apiRef.current.publishEvent('cellNavigationKeyDown', params, event);
-      return;
-    }
-
-    if (event.key === 'Escape' || (0, _keyboardUtils.isDeleteKeys)(event.key)) {
-      apiRef.current.setCellFocus(params.id, params.field);
-    }
-  }, [apiRef]);
-  const handleCellEditCommit = React.useCallback(params => {
-    const {
-      id,
-      field
-    } = params;
-    const model = apiRef.current.getEditRowsModel();
-    const {
-      value
-    } = model[id][field];
-    logger.debug(`Setting cell id: ${id} field: ${field} to value: ${value == null ? void 0 : value.toString()}`);
-    const row = apiRef.current.getRow(id);
-
-    if (row) {
-      const column = apiRef.current.getColumn(params.field);
-      let rowUpdate = (0, _extends2.default)({}, row, {
-        [field]: value
-      });
-
-      if (column.valueSetter) {
-        rowUpdate = column.valueSetter({
-          row,
-          value
-        });
-      }
-
-      apiRef.current.updateRows([rowUpdate]);
-    }
-  }, [apiRef, logger]);
-  const handleEditCellPropsChange = React.useCallback(params => {
-    const row = apiRef.current.getRow(params.id);
-    const column = apiRef.current.getColumn(params.field);
-    const editCellProps = column.preProcessEditCellProps ? column.preProcessEditCellProps({
-      id: params.id,
-      row,
-      props: params.props
-    }) : params.props;
-
-    if (isPromise(editCellProps)) {
-      editCellProps.then(newEditCellProps => {
-        apiRef.current.unstable_setEditCellProps((0, _extends2.default)({}, params, {
-          props: newEditCellProps
-        }));
-      });
-    } else {
-      apiRef.current.unstable_setEditCellProps((0, _extends2.default)({}, params, {
-        props: editCellProps
-      }));
-    }
-  }, [apiRef]);
-  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, 'cellKeyDown', buildCallback(handleCellKeyDown));
-  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, 'cellDoubleClick', buildCallback(handleCellDoubleClick));
-  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, 'cellFocusOut', buildCallback(handleCellFocusOut));
-  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, 'columnHeaderDragStart', buildCallback(handleColumnHeaderDragStart));
-  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, 'cellEditStart', buildCallback(handleCellEditStart));
-  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, 'cellEditStop', buildCallback(handleCellEditStop));
-  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, 'cellEditCommit', buildCallback(handleCellEditCommit));
-  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, 'editCellPropsChange', buildCallback(handleEditCellPropsChange));
-  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, 'cellEditCommit', props.onCellEditCommit);
-  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, 'cellEditStart', props.onCellEditStart);
-  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, 'cellEditStop', props.onCellEditStop);
-};
-
-exports.useCellEditing = useCellEditing;

package/node/hooks/features/editRows/useGridEditing.old.js

@@ -1,193 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.editingStateInitializer = void 0;
-exports.useGridEditing = useGridEditing;
-
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
-var React = _interopRequireWildcard(require("react"));
-
-var _gridEditRowModel = require("../../../models/gridEditRowModel");
-
-var _useGridApiEventHandler = require("../../utils/useGridApiEventHandler");
-
-var _useGridApiMethod = require("../../utils/useGridApiMethod");
-
-var _useGridLogger = require("../../utils/useGridLogger");
-
-var _gridEditRowsSelector = require("./gridEditRowsSelector");
-
-var _useGridCellEditing = require("./useGridCellEditing.old");
-
-var _useGridRowEditing = require("./useGridRowEditing.old");
-
-var _gridRowsUtils = require("../rows/gridRowsUtils");
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-const editingStateInitializer = state => (0, _extends2.default)({}, state, {
-  editRows: {}
-});
-/**
- * @requires useGridFocus - can be after, async only
- * @requires useGridParamsApi (method)
- * @requires useGridColumns (state)
- */
-
-
-exports.editingStateInitializer = editingStateInitializer;
-
-function useGridEditing(apiRef, props) {
-  var _props$experimentalFe2;
-
-  const logger = (0, _useGridLogger.useGridLogger)(apiRef, 'useGridEditRows');
-  (0, _useGridCellEditing.useCellEditing)(apiRef, props);
-  (0, _useGridRowEditing.useGridRowEditing)(apiRef, props);
-  const debounceMap = React.useRef({});
-  apiRef.current.unstable_registerControlState({
-    stateId: 'editRows',
-    propModel: props.editRowsModel,
-    propOnChange: props.onEditRowsModelChange,
-    stateSelector: _gridEditRowsSelector.gridEditRowsStateSelector,
-    changeEvent: 'editRowsModelChange'
-  });
-  const isCellEditable = React.useCallback(params => !(0, _gridRowsUtils.isAutoGeneratedRow)(params.rowNode) && params.rowNode.type !== 'pinnedRow' && !!params.colDef.editable && !!params.colDef.renderEditCell && (!props.isCellEditable || props.isCellEditable(params)), // eslint-disable-next-line react-hooks/exhaustive-deps
-  [props.isCellEditable]);
-
-  const maybeDebounce = (id, field, debounceMs, callback) => {
-    if (!debounceMs) {
-      callback();
-      return;
-    }
-
-    if (!debounceMap.current[id]) {
-      debounceMap.current[id] = {};
-    }
-
-    if (debounceMap.current[id][field]) {
-      const [timeout] = debounceMap.current[id][field];
-      clearTimeout(timeout);
-    }
-
-    const callbackToRunImmediately = () => {
-      callback();
-      const [timeout] = debounceMap.current[id][field];
-      clearTimeout(timeout);
-      delete debounceMap.current[id][field];
-    };
-
-    const timeout = setTimeout(() => {
-      callback();
-      delete debounceMap.current[id][field];
-    }, debounceMs);
-    debounceMap.current[id][field] = [timeout, callbackToRunImmediately];
-  };
-
-  const runPendingEditCellValueMutation = React.useCallback((id, field) => {
-    if (!debounceMap.current[id]) {
-      return;
-    }
-
-    if (!field) {
-      Object.keys(debounceMap.current[id]).forEach(debouncedField => {
-        const [, callback] = debounceMap.current[id][debouncedField];
-        callback();
-      });
-    } else if (debounceMap.current[id][field]) {
-      const [, callback] = debounceMap.current[id][field];
-      callback();
-    }
-  }, []);
-  const setEditCellValue = React.useCallback((params, event = {}) => {
-    maybeDebounce(params.id, params.field, params.debounceMs, () => {
-      var _props$experimentalFe;
-
-      if ((_props$experimentalFe = props.experimentalFeatures) != null && _props$experimentalFe.preventCommitWhileValidating) {
-        if (props.editMode === 'row') {
-          return apiRef.current.unstable_setRowEditingEditCellValue(params);
-        }
-
-        return apiRef.current.unstable_setCellEditingEditCellValue(params);
-      }
-
-      const newParams = {
-        id: params.id,
-        field: params.field,
-        props: {
-          value: params.value
-        }
-      };
-      return apiRef.current.publishEvent('editCellPropsChange', newParams, event);
-    });
-  }, [apiRef, props.editMode, (_props$experimentalFe2 = props.experimentalFeatures) == null ? void 0 : _props$experimentalFe2.preventCommitWhileValidating]);
-  const parseValue = React.useCallback((id, field, value) => {
-    const column = apiRef.current.getColumn(field);
-    return column.valueParser ? column.valueParser(value, apiRef.current.getCellParams(id, field)) : value;
-  }, [apiRef]);
-  const setEditCellProps = React.useCallback(params => {
-    const {
-      id,
-      field,
-      props: editProps
-    } = params;
-    logger.debug(`Setting cell props on id: ${id} field: ${field}`);
-    apiRef.current.setState(state => {
-      const editRowsModel = (0, _extends2.default)({}, state.editRows);
-      editRowsModel[id] = (0, _extends2.default)({}, state.editRows[id]);
-      editRowsModel[id][field] = (0, _extends2.default)({}, editProps, {
-        value: parseValue(id, field, editProps.value)
-      });
-      return (0, _extends2.default)({}, state, {
-        editRows: editRowsModel
-      });
-    });
-    apiRef.current.forceUpdate();
-    const editRowsState = (0, _gridEditRowsSelector.gridEditRowsStateSelector)(apiRef.current.state);
-    return editRowsState[id][field];
-  }, [apiRef, logger, parseValue]);
-  const setEditRowsModel = React.useCallback(model => {
-    const currentModel = (0, _gridEditRowsSelector.gridEditRowsStateSelector)(apiRef.current.state);
-
-    if (currentModel !== model) {
-      logger.debug(`Setting editRows model`);
-      apiRef.current.setState(state => (0, _extends2.default)({}, state, {
-        editRows: model
-      }));
-      apiRef.current.forceUpdate();
-    }
-  }, [apiRef, logger]);
-  const getEditRowsModel = React.useCallback(() => (0, _gridEditRowsSelector.gridEditRowsStateSelector)(apiRef.current.state), [apiRef]);
-  const preventTextSelection = React.useCallback((params, event) => {
-    const isMoreThanOneClick = event.detail > 1;
-
-    if (params.isEditable && params.cellMode === _gridEditRowModel.GridCellModes.View && isMoreThanOneClick) {
-      // If we click more than one time, then we prevent the default behavior of selecting the text cell.
-      event.preventDefault();
-    }
-  }, []);
-  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, 'cellMouseDown', preventTextSelection);
-  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, 'editCellPropsChange', props.onEditCellPropsChange); // TODO v6: remove, use `preProcessEditCellProps` instead
-
-  const editingSharedApi = {
-    isCellEditable,
-    setEditRowsModel,
-    getEditRowsModel,
-    setEditCellValue,
-    unstable_setEditCellProps: setEditCellProps,
-    unstable_parseValue: parseValue,
-    unstable_runPendingEditCellValueMutation: runPendingEditCellValueMutation
-  };
-  (0, _useGridApiMethod.useGridApiMethod)(apiRef, editingSharedApi, 'EditRowApi');
-  React.useEffect(() => {
-    if (props.editRowsModel !== undefined) {
-      apiRef.current.setEditRowsModel(props.editRowsModel);
-    }
-  }, [apiRef, props.editRowsModel]);
-}