mui-extended
Version:
Extended UI Components built on Material UI
43 lines (42 loc) • 1.78 kB
JavaScript
import { __assign } from "tslib";
import { jsx as _jsx } from "react/jsx-runtime";
import { Box } from "@mui/material";
export var Resizer = function (_a) {
var size = _a.size, split = _a.split, sx = _a.sx, onClick = _a.onClick, onDoubleClick = _a.onDoubleClick, onMouseDown = _a.onMouseDown, onTouchStart = _a.onTouchStart, onTouchEnd = _a.onTouchEnd;
var styles = split == "vertical"
? {
cursor: "col-resize",
borderLeft: "3px solid rgba(255, 255, 255, 0)",
borderRight: "3px solid rgba(255, 255, 255, 0)",
marginLeft: "-3px",
marginRight: "-3px",
width: size
}
: {
cursor: "row-resize",
borderTop: "3px solid rgba(255, 255, 255, 0)",
borderBottom: "3px solid rgba(255, 255, 255, 0)",
marginTop: "-3px",
marginBottom: "-3px",
height: size
};
return (_jsx(Box, { role: "presentation", sx: __assign(__assign({ backgroundColor: "divider", backgroundClip: "padding-box", zIndex: 1000, "&:hover": {
backgroundColor: "primary.light"
} }, styles), sx), onMouseDown: function (event) { return onMouseDown(event); }, onTouchStart: function (event) {
event.preventDefault();
onTouchStart(event);
}, onTouchEnd: function (event) {
event.preventDefault();
onTouchEnd(event);
}, onClick: function (event) {
if (onClick) {
event.preventDefault();
onClick(event);
}
}, onDoubleClick: function (event) {
if (onDoubleClick) {
event.preventDefault();
onDoubleClick(event);
}
} }));
};