@rowsncolumns/grid 9.0.3 → 13.2.32

package/dist/utils.js

@@ -1,153 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.createHTMLBox = exports.createCanvasBox = void 0;
-const react_1 = __importDefault(require("react"));
-const react_konva_1 = require("react-konva");
-/**
- * Create a box with custom top/right/bottom/left colors and widths
- * @param param0
- */
-const createCanvasBox = ({ 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, dash, dashEnabled, lineCap = "square", key, }) => {
-    const commonProps = {
-        perfectDrawEnabled: false,
-        shadowForStrokeEnabled: false,
-        hitStrokeWidth: 0,
-        listening: false,
-    };
-    const composite = undefined;
-    const lines = [
-        react_1.default.createElement(react_konva_1.Line, { points: [x, y, x + width, y], stroke: strokeTopColor, strokeWidth: strokeTopWidth, dash: dash, dashEnabled: dashEnabled, lineCap: lineCap, key: "top", globalCompositeOperation: composite, ...commonProps }),
-        react_1.default.createElement(react_konva_1.Line, { points: [x + width, y, x + width, y + height], stroke: strokeRightColor, strokeWidth: strokeRightWidth, dash: dash, dashEnabled: dashEnabled, lineCap: lineCap, key: "right", globalCompositeOperation: composite, ...commonProps }),
-        react_1.default.createElement(react_konva_1.Line, { points: [x + width, y + height, x, y + height], stroke: strokeBottomColor, strokeWidth: strokeBottomWidth, dash: dash, dashEnabled: dashEnabled, lineCap: lineCap, key: "bottom", globalCompositeOperation: composite, ...commonProps }),
-        react_1.default.createElement(react_konva_1.Line, { points: [x, y + height, x, y], stroke: strokeLeftColor, strokeWidth: strokeLeftWidth, dash: dash, dashEnabled: dashEnabled, lineCap: lineCap, key: "left", globalCompositeOperation: composite, ...commonProps }),
-    ];
-    return (react_1.default.createElement(react_1.default.Fragment, { key: key },
-        fill && (react_1.default.createElement(react_konva_1.Rect, { globalCompositeOperation: composite, fill: fill, x: x, y: y, width: width, height: height, ...commonProps })),
-        lines));
-};
-exports.createCanvasBox = createCanvasBox;
-const 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", fillOpacity = 1, draggable, isDragging, borderCoverWidth = 5, type, bounds, activeCell, ...props }) => {
-    const lineStyles = {
-        borderWidth: 0,
-        position: "absolute",
-        pointerEvents: "none",
-    };
-    /**
-     * Border cover is so that there is enough
-     * draggable handle area for the user.
-     * Default is 5px
-     */
-    const showBorderCover = draggable;
-    const borderCoverStyle = {
-        position: "absolute",
-        pointerEvents: draggable ? "auto" : "none",
-        cursor: draggable ? (isDragging ? "grabbing" : "grab") : "initial",
-    };
-    width = width - Math.floor(strokeWidth / 2);
-    height = height - Math.floor(strokeWidth / 2);
-    // y = y - Math.ceil(strokeWidth / 2);
-    const lines = [
-        react_1.default.createElement("div", { style: {
-                ...lineStyles,
-                left: x,
-                top: y,
-                width: width,
-                height: strokeTopWidth,
-                borderColor: strokeTopColor,
-                borderTopWidth: strokeTopWidth,
-                borderStyle: strokeStyle,
-            }, key: "top", ...props }),
-        react_1.default.createElement("div", { style: {
-                ...lineStyles,
-                left: x + width,
-                top: y,
-                width: strokeRightWidth,
-                height: height,
-                borderColor: strokeRightColor,
-                borderRightWidth: strokeRightWidth,
-                borderStyle: strokeStyle,
-            }, key: "right", ...props }),
-        react_1.default.createElement("div", { style: {
-                ...lineStyles,
-                left: x,
-                top: y + height,
-                width: width + strokeTopWidth,
-                height: strokeBottomWidth,
-                borderColor: strokeBottomColor,
-                borderBottomWidth: strokeBottomWidth,
-                borderStyle: strokeStyle,
-            }, key: "bottom", ...props }),
-        react_1.default.createElement("div", { style: {
-                ...lineStyles,
-                left: x,
-                top: y,
-                width: strokeLeftWidth,
-                height: height,
-                borderColor: strokeLeftColor,
-                borderLeftWidth: strokeLeftWidth,
-                borderStyle: strokeStyle,
-            }, key: "left", ...props }),
-    ];
-    const borderCovers = [
-        react_1.default.createElement("div", { style: {
-                ...borderCoverStyle,
-                left: x,
-                top: y,
-                width: width,
-                height: 5,
-            }, key: "top", ...props }),
-        react_1.default.createElement("div", { style: {
-                ...borderCoverStyle,
-                left: x + width - borderCoverWidth + strokeRightWidth,
-                top: y,
-                width: borderCoverWidth,
-                height: height,
-            }, key: "right", ...props }),
-        react_1.default.createElement("div", { style: {
-                ...borderCoverStyle,
-                left: x,
-                top: y + height - borderCoverWidth + strokeBottomWidth,
-                width: width + strokeTopWidth,
-                height: borderCoverWidth,
-            }, key: "bottom", ...props }),
-        react_1.default.createElement("div", { style: {
-                ...borderCoverStyle,
-                left: x,
-                top: y,
-                width: borderCoverWidth,
-                height: height,
-            }, key: "left", ...props }),
-    ];
-    /**
-     * Display title component
-     * Only if title is not null
-     */
-    const titleProps = {
-        isDragging,
-        x,
-        y,
-        stroke: strokeTopColor,
-        width,
-        bounds,
-        strokeWidth,
-    };
-    return (react_1.default.createElement(react_1.default.Fragment, { key: key },
-        fill && (react_1.default.createElement("div", { style: {
-                position: "absolute",
-                top: y,
-                left: x,
-                height,
-                width,
-                backgroundColor: fill,
-                opacity: fillOpacity,
-                userSelect: "none",
-                pointerEvents: "none",
-            } })),
-        lines,
-        showBorderCover && borderCovers));
-};
-exports.createHTMLBox = createHTMLBox;
-//# sourceMappingURL=utils.js.map

package/dist/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.tsx"],"names":[],"mappings":"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"}

package/src/Cell.tsx

@@ -1,100 +0,0 @@
-import React, { memo } from "react";
-import { RendererProps } from "./Grid";
-import { Group, Rect, Text } from "react-konva";
-import { KonvaEventObject } from "konva/lib/Node";
-import { isNull } from "./helpers";
-
-export interface CellProps extends RendererProps {
-  value?: string;
-  textColor?: string;
-  padding?: number;
-  fontWeight?: string;
-  fontStyle?: string;
-  onClick?: (e: KonvaEventObject<MouseEvent>) => void;
-}
-
-/**
- * Default cell component
- * @param props
- */
-const Cell: React.FC<CellProps> = memo((props) => {
-  const {
-    x = 0,
-    y = 0,
-    width,
-    height,
-    value,
-    fill = "white",
-    strokeWidth = 1,
-    stroke = "#d9d9d9",
-    align = "left",
-    verticalAlign = "middle",
-    textColor = "#333",
-    padding = 5,
-    fontFamily = "Arial",
-    fontSize = 12,
-    children,
-    wrap = "none",
-    fontWeight = "normal",
-    fontStyle = "normal",
-    textDecoration,
-    alpha = 1,
-    strokeEnabled = true,
-    globalCompositeOperation = "multiply",
-    isOverlay,
-    ...rest
-  } = props;
-  if (isOverlay) return null;
-  const fillEnabled = !!fill;
-  const textStyle = `${fontWeight} ${fontStyle}`;
-  return (
-    <Group {...rest}>
-      <Rect
-        x={x + 0.5}
-        y={y + 0.5}
-        height={height}
-        width={width}
-        fill={fill}
-        stroke={stroke}
-        strokeWidth={strokeWidth}
-        shadowForStrokeEnabled={false}
-        strokeScaleEnabled={false}
-        hitStrokeWidth={0}
-        alpha={alpha}
-        fillEnabled={fillEnabled}
-        strokeEnabled={strokeEnabled}
-      />
-      {isNull(value) ? null : (
-        <Text
-          x={x}
-          y={y}
-          height={height}
-          width={width}
-          text={value}
-          fill={textColor}
-          verticalAlign={verticalAlign}
-          align={align}
-          fontFamily={fontFamily}
-          fontStyle={textStyle}
-          textDecoration={textDecoration}
-          padding={padding}
-          wrap={wrap}
-          fontSize={fontSize}
-          hitStrokeWidth={0}
-        />
-      )}
-      {children}
-    </Group>
-  );
-});
-
-/**
- * Default CellRenderer
- * @param props
- */
-const CellRenderer = (props: RendererProps) => {
-  return <Cell {...props} />;
-};
-
-export default CellRenderer;
-export { CellRenderer, Cell };

package/src/CellOverlay.tsx

@@ -1,191 +0,0 @@
-import React, { memo } from "react";
-import { CellProps } from "./Cell";
-import { Shape } from "react-konva";
-import { RendererProps } from "./Grid";
-
-/* Array placeholder */
-const EMPTY_ARRAY: number[] = [];
-
-export interface StrokeCellProps
-  extends Omit<CellProps, "key" | "rowIndex" | "columnIndex"> {}
-
-/**
- * Offset helps multiple borders to align properly
- * @param width
- */
-export const getOffsetFromWidth = (width: number) => {
-  return width / 2 - 0.5;
-};
-
-/**
- * Only used for strokes
- */
-const CellOverlay: React.FC<StrokeCellProps> = memo(props => {
-  const {
-    x,
-    y,
-    width,
-    height,
-    strokeTopColor,
-    strokeRightColor,
-    strokeBottomColor,
-    strokeLeftColor,
-    strokeTopDash = EMPTY_ARRAY,
-    strokeRightDash = EMPTY_ARRAY,
-    strokeBottomDash = EMPTY_ARRAY,
-    strokeLeftDash = EMPTY_ARRAY,
-    strokeTopWidth,
-    strokeRightWidth,
-    strokeBottomWidth,
-    strokeLeftWidth,
-    lineCap
-  } = props;
-  const userStroke =
-    strokeTopColor || strokeRightColor || strokeBottomColor || strokeLeftColor;
-  if (!userStroke) return null;
-  return (
-    <Shape
-      x={x}
-      y={y}
-      width={width}
-      height={height}
-      sceneFunc={(context, shape) => {
-        /* Top border */
-        if (strokeTopColor) {
-          context.beginPath();
-          context.moveTo(
-            strokeLeftColor ? -getOffsetFromWidth(strokeLeftWidth) : 0,
-            0.5
-          );
-          context.lineTo(
-            shape.width() +
-              (strokeRightColor ? getOffsetFromWidth(strokeRightWidth) + 1 : 1),
-            0.5
-          );
-          context.setAttr("strokeStyle", strokeTopColor);
-          context.setAttr("lineWidth", strokeTopWidth);
-          context.setAttr("lineCap", lineCap);
-          context.setLineDash(strokeTopDash);
-          context.stroke();
-        }
-        /* Bottom border */
-        if (strokeBottomColor) {
-          context.beginPath();
-          context.moveTo(
-            strokeLeftColor ? -getOffsetFromWidth(strokeLeftWidth) : 0,
-            shape.height() + 0.5
-          );
-          context.lineTo(
-            shape.width() +
-              (strokeRightColor ? getOffsetFromWidth(strokeRightWidth) + 1 : 1),
-            shape.height() + 0.5
-          );
-          context.setAttr("lineWidth", strokeBottomWidth);
-          context.setAttr("strokeStyle", strokeBottomColor);
-          context.setAttr("lineCap", lineCap);
-          context.setLineDash(strokeBottomDash);
-          context.stroke();
-        }
-        /* Left border */
-        if (strokeLeftColor) {
-          context.beginPath();
-          context.moveTo(
-            0.5,
-            strokeTopColor ? -getOffsetFromWidth(strokeTopWidth) : 0
-          );
-          context.lineTo(
-            0.5,
-            shape.height() +
-              (strokeBottomColor
-                ? getOffsetFromWidth(strokeBottomWidth) + 1
-                : 1)
-          );
-          context.setAttr("strokeStyle", strokeLeftColor);
-          context.setAttr("lineWidth", strokeLeftWidth);
-          context.setAttr("lineCap", lineCap);
-          context.setLineDash(strokeLeftDash);
-          context.stroke();
-        }
-        /* Right border */
-        if (strokeRightColor) {
-          context.beginPath();
-          context.moveTo(
-            shape.width() + 0.5,
-            strokeTopColor ? -getOffsetFromWidth(strokeTopWidth) : 0
-          );
-          context.lineTo(
-            shape.width() + 0.5,
-            shape.height() +
-              (strokeBottomColor
-                ? getOffsetFromWidth(strokeBottomWidth) + 1
-                : 1)
-          );
-          context.setAttr("strokeStyle", strokeRightColor);
-          context.setAttr("lineWidth", strokeRightWidth);
-          context.setAttr("lineCap", lineCap);
-          context.setLineDash(strokeRightDash);
-          context.stroke();
-        }
-      }}
-    />
-  );
-});
-
-/**
- * Default CellRenderer
- * @param props
- */
-const CellRenderer = (props: RendererProps) => {
-  const {
-    x,
-    y,
-    width,
-    height,
-    stroke,
-    strokeTopColor = stroke,
-    strokeRightColor = stroke,
-    strokeBottomColor = stroke,
-    strokeLeftColor = stroke,
-    strokeDash = EMPTY_ARRAY,
-    strokeTopDash = EMPTY_ARRAY,
-    strokeRightDash = EMPTY_ARRAY,
-    strokeBottomDash = EMPTY_ARRAY,
-    strokeLeftDash = EMPTY_ARRAY,
-    strokeWidth = 1,
-    strokeTopWidth = strokeWidth,
-    strokeRightWidth = strokeWidth,
-    strokeBottomWidth = strokeWidth,
-    strokeLeftWidth = strokeWidth,
-    lineCap = "butt",
-    key
-  } = props;
-  const userStroke =
-    strokeTopColor || strokeRightColor || strokeBottomColor || strokeLeftColor;
-  if (!userStroke) return null;
-  return (
-    <CellOverlay
-      key={key}
-      x={x}
-      y={y}
-      width={width}
-      height={height}
-      strokeTopColor={strokeTopColor}
-      strokeRightColor={strokeRightColor}
-      strokeBottomColor={strokeBottomColor}
-      strokeLeftColor={strokeLeftColor}
-      strokeDash={strokeDash}
-      strokeTopDash={strokeTopDash}
-      strokeRightDash={strokeRightDash}
-      strokeBottomDash={strokeBottomDash}
-      strokeLeftDash={strokeLeftDash}
-      strokeTopWidth={strokeTopWidth}
-      strokeRightWidth={strokeRightWidth}
-      strokeBottomWidth={strokeBottomWidth}
-      strokeLeftWidth={strokeLeftWidth}
-      lineCap={lineCap}
-    />
-  );
-};
-
-export default CellRenderer;
-export { CellRenderer, CellOverlay };

package/src/FillHandle.tsx

@@ -1,37 +0,0 @@
-import React from "react";
-import { ShapeConfig } from "konva/lib/Shape";
-
-/**
- * Fill handle component
- */
-const FillHandle: React.FC<ShapeConfig> = ({
-  x = 0,
-  y = 0,
-  stroke,
-  strokeWidth = 1,
-  size = 8,
-  borderColor,
-  ...props
-}) => {
-  if (x === 0 || y === 0) return null;
-  return (
-    <div
-      style={{
-        position: "absolute",
-        left: x - size / 2,
-        top: y - size / 2,
-        width: size,
-        height: size,
-        border: `${strokeWidth}px ${borderColor} solid`,
-        borderRightWidth: 0,
-        borderBottomWidth: 0,
-        background: stroke as string,
-        cursor: "crosshair",
-        pointerEvents: "all",
-      }}
-      {...props}
-    />
-  );
-};
-
-export default FillHandle;