@pixerate/editor-react 0.9.3 → 0.9.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +93 -0
- package/dist/{chunk-IMZDKODL.js → chunk-UYT5EQU6.js} +3 -3
- package/dist/chunk-UYT5EQU6.js.map +1 -0
- package/dist/image-editor/index.cjs +16 -16
- package/dist/image-editor/index.cjs.map +1 -1
- package/dist/image-editor/index.d.cts +1 -1
- package/dist/image-editor/index.d.ts +1 -1
- package/dist/image-editor/index.js +1 -1
- package/dist/index.cjs +22 -22
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +1 -1
- package/package.json +2 -2
- package/dist/chunk-IMZDKODL.js.map +0 -1
package/dist/index.cjs
CHANGED
|
@@ -31,16 +31,16 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
31
31
|
var src_exports = {};
|
|
32
32
|
__export(src_exports, {
|
|
33
33
|
BubbleMenu: () => BubbleMenu,
|
|
34
|
-
DirtyTracker: () =>
|
|
34
|
+
DirtyTracker: () => import_editor7.DirtyTracker,
|
|
35
35
|
EditorContent: () => EditorContent,
|
|
36
36
|
EditorSlotsProvider: () => EditorSlotsProvider,
|
|
37
|
-
HistoryManager: () =>
|
|
37
|
+
HistoryManager: () => import_editor7.HistoryManager,
|
|
38
38
|
ImageEditor: () => ImageEditor,
|
|
39
39
|
SpreadsheetEditor: () => SpreadsheetEditor,
|
|
40
40
|
TemplateRenderer: () => TemplateRenderer,
|
|
41
|
-
createDirtyTracker: () =>
|
|
42
|
-
createHistoryManager: () =>
|
|
43
|
-
defaultIsEqual: () =>
|
|
41
|
+
createDirtyTracker: () => import_editor7.createDirtyTracker,
|
|
42
|
+
createHistoryManager: () => import_editor7.createHistoryManager,
|
|
43
|
+
defaultIsEqual: () => import_editor7.defaultIsEqual,
|
|
44
44
|
useDismissGuard: () => useDismissGuard,
|
|
45
45
|
useEditor: () => useEditor2,
|
|
46
46
|
useEditorSlots: () => useEditorSlots,
|
|
@@ -622,7 +622,7 @@ var TemplateRenderer = ({
|
|
|
622
622
|
};
|
|
623
623
|
|
|
624
624
|
// src/index.ts
|
|
625
|
-
var
|
|
625
|
+
var import_editor7 = require("@pixerate/editor");
|
|
626
626
|
|
|
627
627
|
// src/spreadsheet/useSpreadsheetEditor.ts
|
|
628
628
|
var import_react11 = require("react");
|
|
@@ -1254,11 +1254,11 @@ function useEditorSlots() {
|
|
|
1254
1254
|
|
|
1255
1255
|
// src/image-editor/useImageEditor.ts
|
|
1256
1256
|
var import_react14 = require("react");
|
|
1257
|
-
var
|
|
1257
|
+
var import_image_editor = require("@pixerate/editor/image-editor");
|
|
1258
1258
|
function useImageEditor(options = {}) {
|
|
1259
1259
|
const controllerRef = (0, import_react14.useRef)(null);
|
|
1260
1260
|
if (!controllerRef.current) {
|
|
1261
|
-
controllerRef.current = new
|
|
1261
|
+
controllerRef.current = new import_image_editor.ImageEditorController(options);
|
|
1262
1262
|
}
|
|
1263
1263
|
const controller = controllerRef.current;
|
|
1264
1264
|
const [state, setState] = (0, import_react14.useState)(() => controller.getState());
|
|
@@ -1380,7 +1380,7 @@ function useImageEditor(options = {}) {
|
|
|
1380
1380
|
|
|
1381
1381
|
// src/image-editor/ImageEditor.tsx
|
|
1382
1382
|
var import_react15 = require("react");
|
|
1383
|
-
var
|
|
1383
|
+
var import_image_editor2 = require("@pixerate/editor/image-editor");
|
|
1384
1384
|
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
1385
1385
|
var ImageEditor = ({
|
|
1386
1386
|
editor: externalEditor,
|
|
@@ -1547,8 +1547,8 @@ var ImageEditor = ({
|
|
|
1547
1547
|
width: state.imageDimensions.width,
|
|
1548
1548
|
height: state.imageDimensions.height
|
|
1549
1549
|
};
|
|
1550
|
-
const handle = (0,
|
|
1551
|
-
const startImgPt = (0,
|
|
1550
|
+
const handle = (0, import_image_editor2.hitTestCrop)(canvasPt, state, canvas.width, canvas.height, 14, activeCrop);
|
|
1551
|
+
const startImgPt = (0, import_image_editor2.canvasToImagePoint)(canvasPt, state, canvas.width, canvas.height, true);
|
|
1552
1552
|
if (handle) {
|
|
1553
1553
|
cropDragInfoRef.current = {
|
|
1554
1554
|
handle,
|
|
@@ -1567,12 +1567,12 @@ var ImageEditor = ({
|
|
|
1567
1567
|
return;
|
|
1568
1568
|
}
|
|
1569
1569
|
if (activeTab === "annotate") {
|
|
1570
|
-
const imgPt = (0,
|
|
1570
|
+
const imgPt = (0, import_image_editor2.canvasToImagePoint)(canvasPt, state, canvas.width, canvas.height, false);
|
|
1571
1571
|
dragStartPointRef.current = imgPt;
|
|
1572
1572
|
if (state.activeTool === "select") {
|
|
1573
1573
|
for (let i = state.annotations.length - 1; i >= 0; i--) {
|
|
1574
1574
|
const ann = state.annotations[i];
|
|
1575
|
-
if ((0,
|
|
1575
|
+
if ((0, import_image_editor2.hitTestAnnotation)(imgPt, ann)) {
|
|
1576
1576
|
editor.selectAnnotation(ann.id);
|
|
1577
1577
|
annotationDragInfoRef.current = {
|
|
1578
1578
|
annId: ann.id,
|
|
@@ -1609,7 +1609,7 @@ var ImageEditor = ({
|
|
|
1609
1609
|
if (activeTab === "crop") {
|
|
1610
1610
|
const drag = cropDragInfoRef.current;
|
|
1611
1611
|
if (drag) {
|
|
1612
|
-
const currentImgPt = (0,
|
|
1612
|
+
const currentImgPt = (0, import_image_editor2.canvasToImagePoint)(canvasPt, state, canvas.width, canvas.height, true);
|
|
1613
1613
|
let newCrop;
|
|
1614
1614
|
if (drag.handle === "new") {
|
|
1615
1615
|
const minX = Math.max(0, Math.min(drag.startImgPt.x, currentImgPt.x));
|
|
@@ -1623,7 +1623,7 @@ var ImageEditor = ({
|
|
|
1623
1623
|
height: Math.round(Math.max(20, maxY - minY))
|
|
1624
1624
|
};
|
|
1625
1625
|
} else {
|
|
1626
|
-
newCrop = (0,
|
|
1626
|
+
newCrop = (0, import_image_editor2.calculateCropDrag)(
|
|
1627
1627
|
drag.startCrop,
|
|
1628
1628
|
drag.handle,
|
|
1629
1629
|
drag.startImgPt,
|
|
@@ -1642,15 +1642,15 @@ var ImageEditor = ({
|
|
|
1642
1642
|
width: state.imageDimensions.width,
|
|
1643
1643
|
height: state.imageDimensions.height
|
|
1644
1644
|
};
|
|
1645
|
-
const handle = (0,
|
|
1646
|
-
canvas.style.cursor = (0,
|
|
1645
|
+
const handle = (0, import_image_editor2.hitTestCrop)(canvasPt, state, canvas.width, canvas.height, 14, activeCrop);
|
|
1646
|
+
canvas.style.cursor = (0, import_image_editor2.getCropCursor)(handle);
|
|
1647
1647
|
}
|
|
1648
1648
|
return;
|
|
1649
1649
|
}
|
|
1650
1650
|
if (activeTab === "annotate") {
|
|
1651
1651
|
if (annotationDragInfoRef.current) {
|
|
1652
1652
|
const drag = annotationDragInfoRef.current;
|
|
1653
|
-
const currentImgPt2 = (0,
|
|
1653
|
+
const currentImgPt2 = (0, import_image_editor2.canvasToImagePoint)(canvasPt, state, canvas.width, canvas.height, false);
|
|
1654
1654
|
const dx = currentImgPt2.x - drag.startImgPt.x;
|
|
1655
1655
|
const dy = currentImgPt2.y - drag.startImgPt.y;
|
|
1656
1656
|
editor.updateAnnotation(drag.annId, {
|
|
@@ -1662,10 +1662,10 @@ var ImageEditor = ({
|
|
|
1662
1662
|
const startPt = dragStartPointRef.current;
|
|
1663
1663
|
if (!startPt) {
|
|
1664
1664
|
if (state.activeTool === "select") {
|
|
1665
|
-
const imgPt = (0,
|
|
1665
|
+
const imgPt = (0, import_image_editor2.canvasToImagePoint)(canvasPt, state, canvas.width, canvas.height, false);
|
|
1666
1666
|
let hovered = false;
|
|
1667
1667
|
for (let i = state.annotations.length - 1; i >= 0; i--) {
|
|
1668
|
-
if ((0,
|
|
1668
|
+
if ((0, import_image_editor2.hitTestAnnotation)(imgPt, state.annotations[i])) {
|
|
1669
1669
|
hovered = true;
|
|
1670
1670
|
break;
|
|
1671
1671
|
}
|
|
@@ -1676,7 +1676,7 @@ var ImageEditor = ({
|
|
|
1676
1676
|
}
|
|
1677
1677
|
return;
|
|
1678
1678
|
}
|
|
1679
|
-
const currentImgPt = (0,
|
|
1679
|
+
const currentImgPt = (0, import_image_editor2.canvasToImagePoint)(canvasPt, state, canvas.width, canvas.height, false);
|
|
1680
1680
|
if (state.activeTool === "pen" && isDrawingRef.current) {
|
|
1681
1681
|
currentPathRef.current.push(currentImgPt);
|
|
1682
1682
|
const draft = {
|
|
@@ -1771,7 +1771,7 @@ var ImageEditor = ({
|
|
|
1771
1771
|
}
|
|
1772
1772
|
const startPt = dragStartPointRef.current;
|
|
1773
1773
|
if (startPt) {
|
|
1774
|
-
const currentImgPt = (0,
|
|
1774
|
+
const currentImgPt = (0, import_image_editor2.canvasToImagePoint)(canvasPt, state, canvas.width, canvas.height, false);
|
|
1775
1775
|
if (state.activeTool === "pen" && isDrawingRef.current) {
|
|
1776
1776
|
if (currentPathRef.current.length > 1) {
|
|
1777
1777
|
editor.addAnnotation({
|