@solostylist/image-editor 1.0.12 → 1.0.14

package/lib/components/layers/design-layer/index.js

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -15,6 +14,7 @@ import getSizeAfterRotation from "../../../utils/get-size-after-rotation";
 import getCenterRotatedPoint from "../../../utils/get-center-rotated-point";
 import AnnotationNodes from "./annotation-nodes";
 import PreviewGroup from "./preview-group";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 var CANVAS_TO_IMG_SPACING = getProperImageToCanvasSpacing();
 var MIN_SPACED_WIDTH = 10;
 var DesignLayer = function DesignLayer() {
@@ -94,16 +94,16 @@ var DesignLayer = function DesignLayer() {
     };
   }, [canvasScale, xPointToCenterImgInCanvas, yPointToCenterImgInCanvas, xPointNoResizeNoCrop, yPointNoResizeNoCrop, scaledSpacedOriginalImg]);
   var clipFunc = function clipFunc(ctx) {
-    var _designLayerRef$curre;
+    var _designLayerRef$curre, _crop$width2, _crop$height2, _crop$x, _crop$y;
     var isCroppingAndNotSaving = isCurrentlyCropping && !((_designLayerRef$curre = designLayerRef.current) !== null && _designLayerRef$curre !== void 0 && (_designLayerRef$curre = _designLayerRef$curre.attrs) !== null && _designLayerRef$curre !== void 0 && _designLayerRef$curre.isSaving);
     var clipBox = isCroppingAndNotSaving || crop.noEffect ? _objectSpread(_objectSpread({}, imageDimensions), {}, {
       x: 0,
       y: 0
     }) : {
-      width: crop.width || imageDimensions.width,
-      height: crop.height || imageDimensions.height,
-      x: crop.x || 0,
-      y: crop.y || 0
+      width: (_crop$width2 = crop.width) !== null && _crop$width2 !== void 0 ? _crop$width2 : imageDimensions.width,
+      height: (_crop$height2 = crop.height) !== null && _crop$height2 !== void 0 ? _crop$height2 : imageDimensions.height,
+      x: (_crop$x = crop.x) !== null && _crop$x !== void 0 ? _crop$x : 0,
+      y: (_crop$y = crop.y) !== null && _crop$y !== void 0 ? _crop$y : 0
     };
     cropImage(ctx, _objectSpread({
       ratio: crop.ratio
@@ -136,7 +136,7 @@ var DesignLayer = function DesignLayer() {
     };
   }, [originalImage]);
   useEffect(function () {
-    if (imageDimensions) {
+    if (imageDimensions && previewGroupRef.current) {
       dispatch({
         type: SET_SHOWN_IMAGE_DIMENSIONS,
         payload: {
@@ -146,8 +146,8 @@ var DesignLayer = function DesignLayer() {
         }
       });
     }
-  }, [imageDimensions]);
-  if (!xPointToCenterImgInCanvas || !yPointToCenterImgInCanvas || !imageDimensions) {
+  }, [imageDimensions, dispatch]);
+  if (typeof xPointToCenterImgInCanvas !== 'number' || isNaN(xPointToCenterImgInCanvas) || typeof yPointToCenterImgInCanvas !== 'number' || isNaN(yPointToCenterImgInCanvas) || !imageDimensions) {
     return null;
   }
   var cropCenterRotatedPoint = getCenterRotatedPoint(crop.x, crop.y, rotation);
@@ -157,7 +157,10 @@ var DesignLayer = function DesignLayer() {
   var yPoint = isCurrentlyCropping ? yPointNoResizeNoCrop : yPointAfterCrop;
   var finalScaleX = (isCurrentlyCropping ? 1 : resizedX) * scaleAfterRotation;
   var finalScaleY = (isCurrentlyCropping ? 1 : resizedY) * scaleAfterRotation;
-  return React.createElement(Layer, {
+  if (!originalImage || !originalImage.width || !originalImage.height) {
+    return null;
+  }
+  return _jsxs(Layer, {
     id: DESIGN_LAYER_ID,
     ref: designLayerRef,
     xPadding: xPoint,
@@ -169,34 +172,35 @@ var DesignLayer = function DesignLayer() {
     scaleX: finalScaleX,
     scaleY: finalScaleY,
     rotation: isCurrentlyCropping ? 0 : rotation,
-    clipFunc: clipFunc
-  }, !isSaving && React.createElement(Rect, {
-    x: isFlippedX ? scaledSpacedOriginalImg.width : 0,
-    y: isFlippedY ? scaledSpacedOriginalImg.height : 0,
-    fill: backgroundColor,
-    fillPatternImage: backgroundImage,
-    fillPatternRepeat: "repeat",
-    width: scaledSpacedOriginalImg.width,
-    height: scaledSpacedOriginalImg.height,
-    listening: false,
-    scaleX: isFlippedX ? -1 : 1,
-    scaleY: isFlippedY ? -1 : 1
-  }), React.createElement(Image, _extends({
-    id: IMAGE_NODE_ID,
-    image: originalImage,
-    width: scaledSpacedOriginalImg.width,
-    height: scaledSpacedOriginalImg.height,
-    offsetX: scaledSpacedOriginalImg.width / 2,
-    offsetY: scaledSpacedOriginalImg.height / 2,
-    x: scaledSpacedOriginalImg.width / 2,
-    y: scaledSpacedOriginalImg.height / 2,
-    listening: false,
-    filters: finetunesAndFilter,
-    ref: imageNodeRef,
-    scaleX: isFlippedX ? -1 : 1,
-    scaleY: isFlippedY ? -1 : 1
-  }, finetunesProps)), React.createElement(AnnotationNodes, null), React.createElement(PreviewGroup, {
-    ref: previewGroupRef
-  }));
+    clipFunc: clipFunc,
+    children: [!isSaving && _jsx(Rect, {
+      x: isFlippedX ? scaledSpacedOriginalImg.width : 0,
+      y: isFlippedY ? scaledSpacedOriginalImg.height : 0,
+      fill: backgroundColor,
+      fillPatternImage: backgroundImage,
+      fillPatternRepeat: "repeat",
+      width: scaledSpacedOriginalImg.width,
+      height: scaledSpacedOriginalImg.height,
+      listening: false,
+      scaleX: isFlippedX ? -1 : 1,
+      scaleY: isFlippedY ? -1 : 1
+    }), _jsx(Image, _objectSpread({
+      id: IMAGE_NODE_ID,
+      image: originalImage,
+      width: scaledSpacedOriginalImg.width,
+      height: scaledSpacedOriginalImg.height,
+      offsetX: scaledSpacedOriginalImg.width / 2,
+      offsetY: scaledSpacedOriginalImg.height / 2,
+      x: scaledSpacedOriginalImg.width / 2,
+      y: scaledSpacedOriginalImg.height / 2,
+      listening: false,
+      filters: finetunesAndFilter,
+      ref: imageNodeRef,
+      scaleX: isFlippedX ? -1 : 1,
+      scaleY: isFlippedY ? -1 : 1
+    }, finetunesProps)), _jsx(AnnotationNodes, {}), _jsx(PreviewGroup, {
+      ref: previewGroupRef
+    })]
+  });
 };
 export default DesignLayer;

package/lib/components/layers/design-layer/nodes-common-prop-types.d.ts

@@ -0,0 +1,45 @@
+export interface NodesCommonProps {
+    id: string;
+    name: string;
+    rotation?: number;
+    scaleX?: number;
+    scaleY?: number;
+    stroke?: string;
+    strokeWidth?: number;
+    shadowOffsetX?: number;
+    shadowOffsetY?: number;
+    shadowBlur?: number;
+    shadowColor?: string;
+    shadowOpacity?: number;
+    opacity?: number;
+}
+export declare const nodesCommonDefaults: {
+    rotation: number;
+    scaleX: number;
+    scaleY: number;
+    stroke: undefined;
+    strokeWidth: undefined;
+    shadowOffsetX: undefined;
+    shadowOffsetY: undefined;
+    shadowBlur: undefined;
+    shadowColor: undefined;
+    shadowOpacity: undefined;
+    opacity: number;
+};
+declare const _default: {
+    defaults: {
+        rotation: number;
+        scaleX: number;
+        scaleY: number;
+        stroke: undefined;
+        strokeWidth: undefined;
+        shadowOffsetX: undefined;
+        shadowOffsetY: undefined;
+        shadowBlur: undefined;
+        shadowColor: undefined;
+        shadowOpacity: undefined;
+        opacity: number;
+    };
+};
+export default _default;
+//# sourceMappingURL=nodes-common-prop-types.d.ts.map

package/lib/components/layers/design-layer/nodes-common-prop-types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"nodes-common-prop-types.d.ts","sourceRoot":"","sources":["../../../../src/components/layers/design-layer/nodes-common-prop-types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,gBAAgB;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,eAAO,MAAM,mBAAmB;;;;;;;;;;;;CAY/B,CAAC;;;;;;;;;;;;;;;;AAEF,wBAAiD"}

package/lib/components/layers/design-layer/preview-group.d.ts

@@ -0,0 +1,3 @@
+declare const _default: import("react").ForwardRefExoticComponent<Omit<import("konva/lib/Group").GroupConfig, "ref"> & import("react").RefAttributes<import("konva/lib/Group").Group>>;
+export default _default;
+//# sourceMappingURL=preview-group.d.ts.map

package/lib/components/layers/design-layer/preview-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"preview-group.d.ts","sourceRoot":"","sources":["../../../../src/components/layers/design-layer/preview-group.tsx"],"names":[],"mappings":";AAWA,wBAAwE"}

package/lib/components/layers/design-layer/preview-group.js

@@ -1,8 +1,11 @@
-import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import { forwardRef } from 'react';
 import { Group } from 'react-konva';
+import { jsx as _jsx } from "react/jsx-runtime";
 var PreviewGroup = function PreviewGroup(props, ref) {
-  return React.createElement(Group, _extends({
+  return _jsx(Group, _objectSpread({
     ref: ref
   }, props));
 };

package/lib/components/layers/index.d.ts

@@ -0,0 +1,3 @@
+export { default as DesignLayer } from './design-layer';
+export { default as TransformersLayer } from './transformers-layer';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/layers/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/layers/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAExD,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,sBAAsB,CAAC"}

package/lib/components/layers/transformers-layer/crop-transformer.d.ts

@@ -0,0 +1,3 @@
+declare const CropTransformer: () => import("react/jsx-runtime").JSX.Element | null;
+export default CropTransformer;
+//# sourceMappingURL=crop-transformer.d.ts.map

package/lib/components/layers/transformers-layer/crop-transformer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"crop-transformer.d.ts","sourceRoot":"","sources":["../../../../src/components/layers/transformers-layer/crop-transformer.tsx"],"names":[],"mappings":"AA2BA,QAAA,MAAM,eAAe,sDA2SpB,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/lib/components/layers/transformers-layer/crop-transformer.js

@@ -1,4 +1,3 @@
-import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -10,11 +9,13 @@ import { useStore } from "../../../hooks";
 import { CUSTOM_CROP, ELLIPSE_CROP, FEEDBACK_STATUSES, ORIGINAL_CROP, TOOLS_IDS } from "../../../utils/constants";
 import TextNode from "../design-layer/annotation-nodes/text-node";
 import { boundDragging, boundResizing } from "./transformers-layer.utils";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 var noEffectTextDimensions = {
   width: 200,
   height: 100
 };
 var CropTransformer = function CropTransformer() {
+  var _crop$ratio;
   var _useStore = useStore(),
     dispatch = _useStore.dispatch,
     theme = _useStore.theme,
@@ -43,7 +44,7 @@ var CropTransformer = function CropTransformer() {
     });
   }, [crop.lockCropAreaAt, cropConfig]);
   var lockCropAreaAt = cropSettings.lockCropAreaAt;
-  var cropRatio = crop.ratio || cropSettings.ratio;
+  var cropRatio = (_crop$ratio = crop.ratio) !== null && _crop$ratio !== void 0 ? _crop$ratio : cropSettings.ratio;
   var isCustom = cropRatio === CUSTOM_CROP;
   var isEllipse = cropRatio === ELLIPSE_CROP;
   var getProperCropRatio = function getProperCropRatio() {
@@ -184,65 +185,67 @@ var CropTransformer = function CropTransformer() {
     onTransformEnd: lockCropAreaAt ? undefined : saveCropFromEvent,
     draggable: !lockCropAreaAt
   };
-  return React.createElement(React.Fragment, null, React.createElement(Image, {
-    image: originalImage,
-    x: isFlippedX ? shownImageDimensions.width : 0,
-    y: isFlippedY ? shownImageDimensions.height : 0,
-    width: shownImageDimensions.width,
-    height: shownImageDimensions.height,
-    filters: [Konva.Filters.Blur, Konva.Filters.Brighten],
-    blurRadius: 10,
-    brightness: -0.3,
-    scaleX: isFlippedX ? -1 : 1,
-    scaleY: isFlippedY ? -1 : 1,
-    ref: tmpImgNodeRef
-  }), isEllipse ? React.createElement(Ellipse, _extends({}, baseCropShapeProps, {
-    ref: cropEllipseRef,
-    radiusX: (width !== null && width !== void 0 ? width : 0) / 2,
-    radiusY: (height !== null && height !== void 0 ? height : 0) / 2,
-    offset: {
-      x: -(width !== null && width !== void 0 ? width : 0) / 2,
-      y: -(height !== null && height !== void 0 ? height : 0) / 2
-    }
-  })) : React.createElement(Rect, _extends({}, baseCropShapeProps, {
-    ref: cropRectRef,
-    width: crop.noEffect ? 0 : width,
-    height: crop.noEffect ? 0 : height
-  })), crop.noEffect && React.createElement(TextNode, {
-    name: "Text",
-    id: "no-preview-text-node",
-    text: t('cropItemNoEffect'),
-    x: shownImageDimensions.width / 2 - noEffectTextDimensions.width / 2,
-    y: shownImageDimensions.height / 2 - noEffectTextDimensions.height / 2,
-    fontSize: 20,
-    fill: "#ffffff",
-    stroke: "#ff0000",
-    strokeWidth: 0.2,
-    shadowColor: "#ff0000",
-    shadowBlur: 10,
-    annotationEvents: {},
-    align: "center",
-    width: noEffectTextDimensions.width,
-    height: noEffectTextDimensions.height
-  }), React.createElement(Transformer, {
-    centeredScaling: false,
-    flipEnabled: false,
-    rotateEnabled: false,
-    anchorSize: 14,
-    anchorCornerRadius: 7,
-    enabledAnchors: enabledAnchors,
-    ignoreStroke: false,
-    anchorStroke: theme.palette.primary.main,
-    anchorFill: theme.palette.common.white,
-    anchorStrokeWidth: 2,
-    borderStroke: theme.palette.primary.main,
-    borderStrokeWidth: 2,
-    borderDash: [4],
-    keepRatio: !isCustom || !isEllipse,
-    ref: cropTransformerRef,
-    boundBoxFunc: function boundBoxFunc(absOldBox, absNewBox) {
-      return boundResizing(absOldBox, absNewBox, shownImageDimensionsRef.current, isCustom || isEllipse ? undefined : getProperCropRatio(), cropSettings);
-    }
-  }));
+  return _jsxs(_Fragment, {
+    children: [_jsx(Image, {
+      image: originalImage !== null && originalImage !== void 0 ? originalImage : undefined,
+      x: isFlippedX ? shownImageDimensions.width : 0,
+      y: isFlippedY ? shownImageDimensions.height : 0,
+      width: shownImageDimensions.width,
+      height: shownImageDimensions.height,
+      filters: [Konva.Filters.Blur, Konva.Filters.Brighten],
+      blurRadius: 10,
+      brightness: -0.3,
+      scaleX: isFlippedX ? -1 : 1,
+      scaleY: isFlippedY ? -1 : 1,
+      ref: tmpImgNodeRef
+    }), isEllipse ? _jsx(Ellipse, _objectSpread(_objectSpread({}, baseCropShapeProps), {}, {
+      ref: cropEllipseRef,
+      radiusX: (width !== null && width !== void 0 ? width : 0) / 2,
+      radiusY: (height !== null && height !== void 0 ? height : 0) / 2,
+      offset: {
+        x: -(width !== null && width !== void 0 ? width : 0) / 2,
+        y: -(height !== null && height !== void 0 ? height : 0) / 2
+      }
+    })) : _jsx(Rect, _objectSpread(_objectSpread({}, baseCropShapeProps), {}, {
+      ref: cropRectRef,
+      width: crop.noEffect ? 0 : width,
+      height: crop.noEffect ? 0 : height
+    })), crop.noEffect && _jsx(TextNode, {
+      name: "Text",
+      id: "no-preview-text-node",
+      text: t('cropItemNoEffect'),
+      x: shownImageDimensions.width / 2 - noEffectTextDimensions.width / 2,
+      y: shownImageDimensions.height / 2 - noEffectTextDimensions.height / 2,
+      fontSize: 20,
+      fill: "#ffffff",
+      stroke: "#ff0000",
+      strokeWidth: 0.2,
+      shadowColor: "#ff0000",
+      shadowBlur: 10,
+      annotationEvents: {},
+      align: "center",
+      width: noEffectTextDimensions.width,
+      height: noEffectTextDimensions.height
+    }), _jsx(Transformer, {
+      centeredScaling: false,
+      flipEnabled: false,
+      rotateEnabled: false,
+      anchorSize: 14,
+      anchorCornerRadius: 7,
+      enabledAnchors: enabledAnchors,
+      ignoreStroke: false,
+      anchorStroke: theme.palette.primary.main,
+      anchorFill: theme.palette.common.white,
+      anchorStrokeWidth: 2,
+      borderStroke: theme.palette.primary.main,
+      borderStrokeWidth: 2,
+      borderDash: [4],
+      keepRatio: !isCustom || !isEllipse,
+      ref: cropTransformerRef,
+      boundBoxFunc: function boundBoxFunc(absOldBox, absNewBox) {
+        return boundResizing(absOldBox, absNewBox, shownImageDimensionsRef.current, isCustom || isEllipse ? undefined : getProperCropRatio(), cropSettings);
+      }
+    })]
+  });
 };
 export default CropTransformer;

package/lib/components/layers/transformers-layer/index.d.ts

@@ -0,0 +1,3 @@
+declare const TransformersLayer: () => import("react/jsx-runtime").JSX.Element;
+export default TransformersLayer;
+//# sourceMappingURL=index.d.ts.map

package/lib/components/layers/transformers-layer/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/layers/transformers-layer/index.tsx"],"names":[],"mappings":"AASA,QAAA,MAAM,iBAAiB,+CAatB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/lib/components/layers/transformers-layer/index.js

@@ -3,14 +3,17 @@ import { useStore } from "../../../hooks";
 import { TOOLS_IDS, TRANSFORMERS_LAYER_ID } from "../../../utils/constants";
 import CropTransformer from "./crop-transformer";
 import NodesTransformer from "./nodes-transformer";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 var TransformersLayer = function TransformersLayer() {
+  var _shownImageDimensions, _shownImageDimensions2;
   var _useStore = useStore(),
     toolId = _useStore.toolId,
     shownImageDimensions = _useStore.shownImageDimensions;
-  return React.createElement(Layer, {
+  return _jsxs(Layer, {
     id: TRANSFORMERS_LAYER_ID,
-    x: shownImageDimensions.abstractX || 0,
-    y: shownImageDimensions.abstractY || 0
-  }, React.createElement(NodesTransformer, null), toolId === TOOLS_IDS.CROP && React.createElement(CropTransformer, null));
+    x: (_shownImageDimensions = shownImageDimensions.abstractX) !== null && _shownImageDimensions !== void 0 ? _shownImageDimensions : 0,
+    y: (_shownImageDimensions2 = shownImageDimensions.abstractY) !== null && _shownImageDimensions2 !== void 0 ? _shownImageDimensions2 : 0,
+    children: [_jsx(NodesTransformer, {}), toolId === TOOLS_IDS.CROP && _jsx(CropTransformer, {})]
+  });
 };
 export default TransformersLayer;

package/lib/components/layers/transformers-layer/nodes-transformer.d.ts

@@ -0,0 +1,3 @@
+declare const NodesTransformer: () => import("react/jsx-runtime").JSX.Element;
+export default NodesTransformer;
+//# sourceMappingURL=nodes-transformer.d.ts.map

package/lib/components/layers/transformers-layer/nodes-transformer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"nodes-transformer.d.ts","sourceRoot":"","sources":["../../../../src/components/layers/transformers-layer/nodes-transformer.tsx"],"names":[],"mappings":"AAcA,QAAA,MAAM,gBAAgB,+CAmErB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/lib/components/layers/transformers-layer/nodes-transformer.js

@@ -3,6 +3,7 @@ import { Transformer } from 'react-konva';
 import { CHANGE_POINTER_ICON, ENABLE_TEXT_CONTENT_EDIT } from "../../../actions";
 import { useStore } from "../../../hooks";
 import { NODES_TRANSFORMER_ID, POINTER_ICONS, TOOLS_IDS } from "../../../utils/constants";
+import { jsx as _jsx } from "react/jsx-runtime";
 var NodesTransformer = function NodesTransformer() {
   var _selections$0$attrs$p;
   var _useStore = useStore(),
@@ -45,7 +46,7 @@ var NodesTransformer = function NodesTransformer() {
       });
     }
   };
-  return React.createElement(Transformer, {
+  return _jsx(Transformer, {
     id: NODES_TRANSFORMER_ID,
     centeredScaling: false,
     rotationSnaps: [0, 45, 90, 135, 180, 225, 270, 315],

package/lib/components/layers/transformers-layer/transformers-layer.utils.d.ts

@@ -0,0 +1,42 @@
+import { Box } from 'konva/lib/shapes/Transformer';
+import type { Dimensions } from 'types/common';
+interface AnnotationDimensions {
+    x: number;
+    y: number;
+    width?: number;
+    height?: number;
+    radiusX?: number;
+    radiusY?: number;
+}
+interface AllowedArea {
+    width: number;
+    height: number;
+    abstractX: number;
+    abstractY: number;
+    scaledBy: number;
+}
+interface CropRestrictions {
+    noScale?: boolean;
+    minWidth?: number;
+    maxWidth?: number;
+    minHeight?: number;
+    maxHeight?: number;
+    lockCropAreaAt?: string;
+}
+export declare const boundDragging: (newDimensions: AnnotationDimensions, allowedArea: {
+    width: number;
+    height: number;
+}) => {
+    x: number;
+    y: number;
+};
+export declare const getPositionByPlaceLabel: (position: string, allowedArea: {
+    width: number;
+    height: number;
+}, currentDimensions: Dimensions) => {
+    x: number;
+    y: number;
+};
+export declare const boundResizing: (oldDimensions: Box, newDimensions: Box, allowedArea: AllowedArea, ratio: number | undefined, cropRestrictions?: CropRestrictions) => Box;
+export {};
+//# sourceMappingURL=transformers-layer.utils.d.ts.map

package/lib/components/layers/transformers-layer/transformers-layer.utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"transformers-layer.utils.d.ts","sourceRoot":"","sources":["../../../../src/components/layers/transformers-layer/transformers-layer.utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,8BAA8B,CAAC;AAInD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C,UAAU,oBAAoB;IAC5B,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,WAAW;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,gBAAgB;IACxB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,eAAO,MAAM,aAAa,GACxB,eAAe,oBAAoB,EACnC,aAAa;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,KAC7C;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CASxB,CAAC;AAEF,eAAO,MAAM,uBAAuB,GAClC,UAAU,MAAM,EAChB,aAAa;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,EAC9C,mBAAmB,UAAU,KAC5B;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAoBxB,CAAC;AAEF,eAAO,MAAM,aAAa,GACxB,eAAe,GAAG,EAClB,eAAe,GAAG,EAClB,aAAa,WAAW,EACxB,OAAO,MAAM,GAAG,SAAS,EACzB,mBAAkB,gBAAqB,KACtC,GA0GF,CAAC"}

package/lib/components/main-canvas/canvas-node.d.ts

@@ -0,0 +1,6 @@
+interface CanvasNodeProps {
+    children: React.ReactNode;
+}
+declare const _default: import("react").MemoExoticComponent<({ children }: CanvasNodeProps) => import("react/jsx-runtime").JSX.Element>;
+export default _default;
+//# sourceMappingURL=canvas-node.d.ts.map

package/lib/components/main-canvas/canvas-node.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"canvas-node.d.ts","sourceRoot":"","sources":["../../../src/components/main-canvas/canvas-node.tsx"],"names":[],"mappings":"AAuBA,UAAU,eAAe;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;2EAEiC,eAAe;AA8NjD,wBAAgC"}

package/lib/components/main-canvas/canvas-node.js

@@ -9,8 +9,10 @@ import { CHANGE_POINTER_ICON, CLEAR_ANNOTATIONS_SELECTIONS, ZOOM_CANVAS } from "
 import { useStore } from "../../hooks";
 import { DEFAULT_ZOOM_FACTOR, POINTER_ICONS, TABS_IDS, TOOLS_IDS } from "../../utils/constants";
 import { endTouchesZooming, zoomOnTouchesMove } from "./touch-zooming-events";
+import { jsx as _jsx } from "react/jsx-runtime";
 var ZOOM_DELTA_TO_SCALE_CONVERT_FACTOR = 0.006;
 var CanvasNode = function CanvasNode(_ref) {
+  var _zoom$factor2, _zoom$x, _zoom$y, _zoom$factor3;
   var children = _ref.children;
   useStrictMode(true);
   var canvasRef = useRef(null);
@@ -77,11 +79,12 @@ var CanvasNode = function CanvasNode(_ref) {
     };
   };
   var handleZoom = function handleZoom(e) {
+    var _zoom$factor;
     e.evt.preventDefault();
     var stage = e.currentTarget;
     var pointer = stage.getPointerPosition();
     if (!pointer) return;
-    var newScale = (zoom.factor || defaultZoomFactor) + e.evt.deltaY * -ZOOM_DELTA_TO_SCALE_CONVERT_FACTOR;
+    var newScale = ((_zoom$factor = zoom.factor) !== null && _zoom$factor !== void 0 ? _zoom$factor : defaultZoomFactor) + e.evt.deltaY * -ZOOM_DELTA_TO_SCALE_CONVERT_FACTOR;
     saveZoom(_objectSpread(_objectSpread({}, pointer), {}, {
       factor: newScale
     }));
@@ -146,17 +149,17 @@ var CanvasNode = function CanvasNode(_ref) {
       }
     };
   }, [tabId, zoom.factor, defaultZoomFactor]);
-  var zoomedResponsiveCanvasScale = canvasScale * (isZoomEnabled && zoom.factor || defaultZoomFactor);
-  return React.createElement(Stage, {
+  var zoomedResponsiveCanvasScale = canvasScale * (isZoomEnabled ? (_zoom$factor2 = zoom.factor) !== null && _zoom$factor2 !== void 0 ? _zoom$factor2 : defaultZoomFactor : defaultZoomFactor);
+  return _jsx(Stage, {
     tabIndex: -1,
     ref: canvasRef,
     width: canvasWidth,
     height: canvasHeight,
     scaleX: zoomedResponsiveCanvasScale,
     scaleY: zoomedResponsiveCanvasScale,
-    x: isZoomEnabled && zoom.x || null,
-    y: isZoomEnabled && zoom.y || null,
-    zoomFactor: isZoomEnabled && zoom.factor || defaultZoomFactor,
+    x: isZoomEnabled ? (_zoom$x = zoom.x) !== null && _zoom$x !== void 0 ? _zoom$x : null : null,
+    y: isZoomEnabled ? (_zoom$y = zoom.y) !== null && _zoom$y !== void 0 ? _zoom$y : null : null,
+    zoomFactor: isZoomEnabled ? (_zoom$factor3 = zoom.factor) !== null && _zoom$factor3 !== void 0 ? _zoom$factor3 : defaultZoomFactor : defaultZoomFactor,
     onWheel: isZoomEnabled ? handleZoom : undefined,
     onTap: clearSelections,
     onClick: clearSelections,
@@ -170,8 +173,9 @@ var CanvasNode = function CanvasNode(_ref) {
     onDragEnd: handleCanvasDragEnd,
     style: _objectSpread(_objectSpread({}, cursorStyle), {}, {
       outline: 'none',
-      backgroundColor: 'var(--s-palette-background-paper)'
-    })
-  }, children);
+      backgroundColor: 'transparent'
+    }),
+    children: children
+  });
 };
 export default memo(CanvasNode);

package/lib/components/main-canvas/index.d.ts

@@ -0,0 +1,3 @@
+declare const MainCanvas: () => import("react/jsx-runtime").JSX.Element;
+export default MainCanvas;
+//# sourceMappingURL=index.d.ts.map

package/lib/components/main-canvas/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/main-canvas/index.tsx"],"names":[],"mappings":"AAaA,QAAA,MAAM,UAAU,+CAqLf,CAAC;AAEF,eAAe,UAAU,CAAC"}