66 lines
2.0 KiB
JavaScript
66 lines
2.0 KiB
JavaScript
'use client';
|
|
|
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
import * as React from 'react';
|
|
import { styled } from '@mui/material/styles';
|
|
import { shouldForwardProp } from '@mui/system/createStyled';
|
|
import { useGridPrivateApiContext } from "../hooks/utils/useGridPrivateApiContext.mjs";
|
|
import { useGridSelector } from "../hooks/utils/useGridSelector.mjs";
|
|
import { gridRowDropPositionSelector } from "../hooks/features/rowReorder/gridRowReorderSelector.mjs";
|
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
const GridRowDragAndDropOverlayRoot = styled('div', {
|
|
name: 'MuiDataGrid',
|
|
slot: 'RowDragOverlay',
|
|
shouldForwardProp: prop => shouldForwardProp(prop) && prop !== 'action'
|
|
})(({
|
|
theme,
|
|
action
|
|
}) => _extends({
|
|
position: 'absolute',
|
|
left: 0,
|
|
right: 0,
|
|
top: 0,
|
|
bottom: 0,
|
|
pointerEvents: 'none',
|
|
zIndex: 1
|
|
}, action === 'above' && {
|
|
'&::before': {
|
|
pointerEvents: 'none',
|
|
content: '""',
|
|
position: 'absolute',
|
|
top: 0,
|
|
left: 0,
|
|
right: 0,
|
|
height: '2px',
|
|
backgroundColor: (theme.vars || theme).palette.primary.main
|
|
}
|
|
}, action === 'below' && {
|
|
'&::after': {
|
|
pointerEvents: 'none',
|
|
content: '""',
|
|
position: 'absolute',
|
|
bottom: '-2px',
|
|
left: 0,
|
|
right: 0,
|
|
height: '2px',
|
|
backgroundColor: (theme.vars || theme).palette.primary.main
|
|
}
|
|
}, action === 'inside' && {
|
|
backgroundColor: theme.alpha((theme.vars || theme).palette.primary.main, 0.1)
|
|
}));
|
|
export const GridRowDragAndDropOverlay = /*#__PURE__*/React.memo(function GridRowDragAndDropOverlay(props) {
|
|
const {
|
|
rowId,
|
|
className
|
|
} = props;
|
|
const apiRef = useGridPrivateApiContext();
|
|
const dropPosition = useGridSelector(apiRef, gridRowDropPositionSelector, rowId);
|
|
if (!dropPosition) {
|
|
return null;
|
|
}
|
|
return /*#__PURE__*/_jsx(GridRowDragAndDropOverlayRoot, {
|
|
action: dropPosition,
|
|
className: className
|
|
});
|
|
});
|
|
if (process.env.NODE_ENV !== "production") GridRowDragAndDropOverlay.displayName = "GridRowDragAndDropOverlay"; |