react-konva-grid
Version:
Declarative React Canvas Grid primitive for Data table, Pivot table, Excel Worksheets
72 lines • 3.13 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.createHTMLBox = void 0;
const react_1 = __importDefault(require("react"));
exports.createHTMLBox = ({ x = 0, y = 0, width = 0, height = 0, fill, stroke, strokeLeftColor = stroke, strokeTopColor = stroke, strokeRightColor = stroke, strokeBottomColor = stroke, strokeWidth = 0, strokeTopWidth = strokeWidth, strokeRightWidth = strokeWidth, strokeBottomWidth = strokeWidth, strokeLeftWidth = strokeWidth, key, strokeStyle = "solid", }) => {
const commonProps = {};
width = width - Math.floor(strokeWidth);
y = y - Math.ceil(strokeWidth / 2);
const lines = [
react_1.default.createElement("div", Object.assign({ style: {
position: "absolute",
left: x,
top: y,
width: width,
height: strokeTopWidth,
borderWidth: 0,
borderColor: strokeTopColor,
borderTopWidth: strokeTopWidth,
borderStyle: strokeStyle,
}, key: "top" }, commonProps)),
react_1.default.createElement("div", Object.assign({ style: {
position: "absolute",
left: x + width,
top: y,
width: strokeRightWidth,
height: height,
borderWidth: 0,
borderColor: strokeRightColor,
borderRightWidth: strokeRightWidth,
borderStyle: strokeStyle,
}, key: "right" }, commonProps)),
,
react_1.default.createElement("div", Object.assign({ style: {
position: "absolute",
left: x,
top: y + height,
width: width + strokeTopWidth,
height: strokeBottomWidth,
borderWidth: 0,
borderColor: strokeBottomColor,
borderBottomWidth: strokeBottomWidth,
borderStyle: strokeStyle,
}, key: "bottom" }, commonProps)),
react_1.default.createElement("div", Object.assign({ style: {
position: "absolute",
left: x,
top: y,
width: strokeLeftWidth,
height: height,
borderWidth: 0,
borderColor: strokeLeftColor,
borderLeftWidth: strokeLeftWidth,
borderStyle: strokeStyle,
}, key: "left" }, commonProps)),
];
return (react_1.default.createElement(react_1.default.Fragment, { key: key },
lines,
fill && (react_1.default.createElement("div", Object.assign({ style: {
position: "absolute",
top: y,
left: x,
height,
width,
backgroundColor: fill,
userSelect: "none",
pointerEvents: "none",
} }, commonProps)))));
};
//# sourceMappingURL=utils.js.map