kritzel-stencil 0.0.138 → 0.0.139
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/dist/cjs/{index-CYkadfjX.js → index-DgZMn9B_.js} +41 -21
- package/dist/cjs/index-DgZMn9B_.js.map +1 -0
- package/dist/cjs/index.cjs.js +1 -1
- package/dist/cjs/kritzel-color_22.cjs.entry.js +9 -18
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/stencil.cjs.js +1 -1
- package/dist/collection/classes/handlers/move.handler.js +2 -0
- package/dist/collection/classes/handlers/move.handler.js.map +1 -1
- package/dist/collection/classes/handlers/resize.handler.js +2 -0
- package/dist/collection/classes/handlers/resize.handler.js.map +1 -1
- package/dist/collection/classes/handlers/rotation.handler.js +2 -0
- package/dist/collection/classes/handlers/rotation.handler.js.map +1 -1
- package/dist/collection/classes/handlers/selection.handler.js +23 -11
- package/dist/collection/classes/handlers/selection.handler.js.map +1 -1
- package/dist/collection/classes/objects/text.class.js +4 -3
- package/dist/collection/classes/objects/text.class.js.map +1 -1
- package/dist/collection/classes/tools/selection-tool.class.js +1 -1
- package/dist/collection/classes/tools/selection-tool.class.js.map +1 -1
- package/dist/collection/classes/tools/text-tool.class.js +6 -4
- package/dist/collection/classes/tools/text-tool.class.js.map +1 -1
- package/dist/collection/components/core/kritzel-editor/kritzel-editor.js +2 -15
- package/dist/collection/components/core/kritzel-editor/kritzel-editor.js.map +1 -1
- package/dist/collection/components/core/kritzel-engine/kritzel-engine.js +12 -3
- package/dist/collection/components/core/kritzel-engine/kritzel-engine.js.map +1 -1
- package/dist/collection/configs/default-engine-state.js +1 -0
- package/dist/collection/configs/default-engine-state.js.map +1 -1
- package/dist/collection/interfaces/engine-state.interface.js.map +1 -1
- package/dist/components/index.js +2 -2
- package/dist/components/kritzel-controls.js +1 -1
- package/dist/components/kritzel-editor.js +4 -17
- package/dist/components/kritzel-editor.js.map +1 -1
- package/dist/components/kritzel-engine.js +1 -1
- package/dist/components/{p-Di5CEwzQ.js → p-BbGgijCS.js} +11 -9
- package/dist/components/p-BbGgijCS.js.map +1 -0
- package/dist/components/{p-PvCKCYuw.js → p-CHdJi6b4.js} +3 -3
- package/dist/components/{p-PvCKCYuw.js.map → p-CHdJi6b4.js.map} +1 -1
- package/dist/components/{p-D554MPA9.js → p-KudVTtHk.js} +41 -19
- package/dist/components/p-KudVTtHk.js.map +1 -0
- package/dist/esm/{index-IhpPa9g4.js → index-CxieEK_G.js} +41 -21
- package/dist/esm/index-CxieEK_G.js.map +1 -0
- package/dist/esm/index.js +1 -1
- package/dist/esm/kritzel-color_22.entry.js +9 -18
- package/dist/esm/loader.js +1 -1
- package/dist/esm/stencil.js +1 -1
- package/dist/stencil/index.esm.js +1 -1
- package/dist/stencil/p-CxieEK_G.js +2 -0
- package/dist/stencil/p-CxieEK_G.js.map +1 -0
- package/dist/stencil/{p-32ac435d.entry.js → p-ab074e87.entry.js} +2 -2
- package/dist/stencil/p-ab074e87.entry.js.map +1 -0
- package/dist/stencil/stencil.esm.js +1 -1
- package/dist/types/components/core/kritzel-engine/kritzel-engine.d.ts +1 -0
- package/dist/types/components.d.ts +2 -2
- package/dist/types/interfaces/engine-state.interface.d.ts +1 -0
- package/package.json +1 -1
- package/dist/cjs/index-CYkadfjX.js.map +0 -1
- package/dist/components/p-D554MPA9.js.map +0 -1
- package/dist/components/p-Di5CEwzQ.js.map +0 -1
- package/dist/esm/index-IhpPa9g4.js.map +0 -1
- package/dist/stencil/p-32ac435d.entry.js.map +0 -1
- package/dist/stencil/p-IhpPa9g4.js +0 -2
- package/dist/stencil/p-IhpPa9g4.js.map +0 -1
|
@@ -262,16 +262,17 @@ class KritzelTextTool extends KritzelBaseTool {
|
|
|
262
262
|
const path = event.composedPath().slice(1);
|
|
263
263
|
const objectElement = path.find(element => element.classList && element.classList.contains('object'));
|
|
264
264
|
const object = this._core.findObjectById(objectElement?.id);
|
|
265
|
-
if (
|
|
265
|
+
if (object instanceof KritzelText) {
|
|
266
266
|
this._core.store.setState('activeText', object);
|
|
267
267
|
object.focus();
|
|
268
268
|
return;
|
|
269
269
|
}
|
|
270
270
|
if (this._core.store.state.activeText !== null && object instanceof KritzelText) {
|
|
271
|
+
this._core.store.setState('activeText', object);
|
|
271
272
|
object.focus();
|
|
272
273
|
return;
|
|
273
274
|
}
|
|
274
|
-
if (this._core.store.state.activeText !== null) {
|
|
275
|
+
if (this._core.store.state.activeText !== null && object instanceof KritzelText === false) {
|
|
275
276
|
this._core.resetActiveText();
|
|
276
277
|
this._core.store.setState('activeTool', KritzelToolRegistry.getTool('selection'));
|
|
277
278
|
return;
|
|
@@ -294,16 +295,17 @@ class KritzelTextTool extends KritzelBaseTool {
|
|
|
294
295
|
const path = event.composedPath().slice(1);
|
|
295
296
|
const objectElement = path.find(element => element.classList && element.classList.contains('object'));
|
|
296
297
|
const object = this._core.findObjectById(objectElement?.id);
|
|
297
|
-
if (
|
|
298
|
+
if (object instanceof KritzelText) {
|
|
298
299
|
this._core.store.setState('activeText', object);
|
|
299
300
|
object.focus();
|
|
300
301
|
return;
|
|
301
302
|
}
|
|
302
303
|
if (this._core.store.state.activeText !== null && object instanceof KritzelText) {
|
|
304
|
+
this._core.store.setState('activeText', object);
|
|
303
305
|
object.focus();
|
|
304
306
|
return;
|
|
305
307
|
}
|
|
306
|
-
if (this._core.store.state.activeText !== null) {
|
|
308
|
+
if (this._core.store.state.activeText !== null && object instanceof KritzelText === false) {
|
|
307
309
|
this._core.resetActiveText();
|
|
308
310
|
this._core.store.setState('activeTool', KritzelToolRegistry.getTool('selection'));
|
|
309
311
|
return;
|
|
@@ -759,12 +761,12 @@ class KritzelText extends KritzelBaseObject {
|
|
|
759
761
|
}
|
|
760
762
|
}
|
|
761
763
|
edit() {
|
|
764
|
+
KritzelKeyboardHelper.disableInteractiveWidget();
|
|
762
765
|
this._core.store.setState('activeTool', KritzelToolRegistry.getTool('text'));
|
|
763
766
|
this._core.store.setState('activeText', this);
|
|
764
767
|
this._core.clearSelection();
|
|
765
|
-
|
|
766
|
-
|
|
767
|
-
}, 300);
|
|
768
|
+
this.focus();
|
|
769
|
+
KritzelKeyboardHelper.enableInteractiveWidget();
|
|
768
770
|
}
|
|
769
771
|
}
|
|
770
772
|
|
|
@@ -1550,6 +1552,7 @@ class KritzelMoveHandler extends KritzelBaseHandler {
|
|
|
1550
1552
|
this._core.store.setState('isDragging', false);
|
|
1551
1553
|
if (this.hasMoved) {
|
|
1552
1554
|
this._core.history.executeCommand(new MoveSelectionGroupCommand(this._core, this, this.endX, this.endY, this.startX, this.startY, true));
|
|
1555
|
+
this._core.store.setState('hasObjectsChanged', true);
|
|
1553
1556
|
}
|
|
1554
1557
|
this.reset();
|
|
1555
1558
|
}
|
|
@@ -1559,6 +1562,7 @@ class KritzelMoveHandler extends KritzelBaseHandler {
|
|
|
1559
1562
|
this._core.store.setState('isDragging', false);
|
|
1560
1563
|
if (this.hasMoved) {
|
|
1561
1564
|
this._core.history.executeCommand(new MoveSelectionGroupCommand(this._core, this, this.endX, this.endY, this.startX, this.startY, true));
|
|
1565
|
+
this._core.store.setState('hasObjectsChanged', true);
|
|
1562
1566
|
}
|
|
1563
1567
|
this.reset();
|
|
1564
1568
|
}
|
|
@@ -1737,6 +1741,7 @@ class KritzelResizeHandler extends KritzelBaseHandler {
|
|
|
1737
1741
|
if (this._core.store.state.isResizing) {
|
|
1738
1742
|
this._core.history.executeCommand(new ResizeSelectionGroupCommand(this._core, this, structuredClone(this.initialSize), structuredClone(this.newSize)));
|
|
1739
1743
|
this._core.store.setState('isResizing', false);
|
|
1744
|
+
this._core.store.setState('hasObjectsChanged', true);
|
|
1740
1745
|
this.reset();
|
|
1741
1746
|
}
|
|
1742
1747
|
}
|
|
@@ -1744,6 +1749,7 @@ class KritzelResizeHandler extends KritzelBaseHandler {
|
|
|
1744
1749
|
if (this._core.store.state.isResizing) {
|
|
1745
1750
|
this._core.history.executeCommand(new ResizeSelectionGroupCommand(this._core, this, structuredClone(this.initialSize), structuredClone(this.newSize)));
|
|
1746
1751
|
this._core.store.setState('isResizing', false);
|
|
1752
|
+
this._core.store.setState('hasObjectsChanged', true);
|
|
1747
1753
|
this.reset();
|
|
1748
1754
|
clearTimeout(this._core.store.state.longTouchTimeout);
|
|
1749
1755
|
}
|
|
@@ -1871,6 +1877,7 @@ class KritzelRotationHandler extends KritzelBaseHandler {
|
|
|
1871
1877
|
if (this._core.store.state.isRotating) {
|
|
1872
1878
|
this._core.history.executeCommand(new RotateSelectionGroupCommand(this._core, this, this.rotation, this.initialSelectionGroupRotation));
|
|
1873
1879
|
this._core.store.setState('isRotating', false);
|
|
1880
|
+
this._core.store.setState('hasObjectsChanged', true);
|
|
1874
1881
|
this.reset();
|
|
1875
1882
|
}
|
|
1876
1883
|
}
|
|
@@ -1878,6 +1885,7 @@ class KritzelRotationHandler extends KritzelBaseHandler {
|
|
|
1878
1885
|
if (this._core.store.state.isRotating) {
|
|
1879
1886
|
this._core.history.executeCommand(new RotateSelectionGroupCommand(this._core, this, this.rotation, this.initialSelectionGroupRotation));
|
|
1880
1887
|
this._core.store.setState('isRotating', false);
|
|
1888
|
+
this._core.store.setState('hasObjectsChanged', true);
|
|
1881
1889
|
this.reset();
|
|
1882
1890
|
clearTimeout(this._core.store.state.longTouchTimeout);
|
|
1883
1891
|
}
|
|
@@ -1976,23 +1984,35 @@ class KritzelSelectionHandler extends KritzelBaseHandler {
|
|
|
1976
1984
|
}
|
|
1977
1985
|
handlePointerUp(event) {
|
|
1978
1986
|
if (event.pointerType === 'mouse') {
|
|
1979
|
-
if (KritzelEventHelper.isLeftClick(event)
|
|
1980
|
-
|
|
1981
|
-
|
|
1982
|
-
|
|
1983
|
-
const selectedObject = this._core.getObjectsFromPointerEvent(event, '.object').find(obj => obj.hitTest(x, y));
|
|
1984
|
-
this.addObjectToSelectionGroup(selectedObject);
|
|
1985
|
-
this.removeSelectionBox();
|
|
1987
|
+
if (KritzelEventHelper.isLeftClick(event)) {
|
|
1988
|
+
const hasObjectsMoved = this._core.store.state.hasObjectsChanged;
|
|
1989
|
+
if (this._core.store.state.selectionGroup?.objects.length === 1 && hasObjectsMoved === false) {
|
|
1990
|
+
this._core.store.state.selectionGroup.objects[0].edit();
|
|
1986
1991
|
}
|
|
1987
|
-
|
|
1988
|
-
|
|
1989
|
-
this.
|
|
1990
|
-
|
|
1992
|
+
this._core.store.setState('hasObjectsChanged', false);
|
|
1993
|
+
if (this._core.store.state.isSelecting) {
|
|
1994
|
+
if (this.isSelectionClick) {
|
|
1995
|
+
const x = this._core.store.state.pointerX;
|
|
1996
|
+
const y = this._core.store.state.pointerY;
|
|
1997
|
+
const selectedObject = this._core.getObjectsFromPointerEvent(event, '.object').find(obj => obj.hitTest(x, y));
|
|
1998
|
+
this.addObjectToSelectionGroup(selectedObject);
|
|
1999
|
+
this.removeSelectionBox();
|
|
2000
|
+
}
|
|
2001
|
+
if (this.isSelectionDrag) {
|
|
2002
|
+
this.updateMouseSelection(event);
|
|
2003
|
+
this.addSelectedObjectsToSelectionGroup();
|
|
2004
|
+
this.removeSelectionBox();
|
|
2005
|
+
}
|
|
1991
2006
|
}
|
|
1992
2007
|
}
|
|
1993
2008
|
}
|
|
1994
2009
|
if (event.pointerType === 'touch') {
|
|
1995
2010
|
clearTimeout(this.touchStartTimeout);
|
|
2011
|
+
const hasObjectsMoved = this._core.store.state.hasObjectsChanged;
|
|
2012
|
+
if (this._core.store.state.selectionGroup?.objects.length === 1 && hasObjectsMoved === false) {
|
|
2013
|
+
this._core.store.state.selectionGroup.objects[0].edit();
|
|
2014
|
+
}
|
|
2015
|
+
this._core.store.setState('hasObjectsChanged', false);
|
|
1996
2016
|
if (this._core.store.state.isSelecting) {
|
|
1997
2017
|
if (this.isSelectionClick) {
|
|
1998
2018
|
const x = this._core.store.state.pointerX;
|
|
@@ -2235,9 +2255,9 @@ class KritzelSelectionTool extends KritzelBaseTool {
|
|
|
2235
2255
|
}
|
|
2236
2256
|
if (event.pointerType === 'mouse') {
|
|
2237
2257
|
this.moveHandler.handlePointerUp(event);
|
|
2238
|
-
this.selectionHandler.handlePointerUp(event);
|
|
2239
2258
|
this.resizeHandler.handlePointerUp(event);
|
|
2240
2259
|
this.rotationHandler.handlePointerUp(event);
|
|
2260
|
+
this.selectionHandler.handlePointerUp(event);
|
|
2241
2261
|
this._core.rerender();
|
|
2242
2262
|
}
|
|
2243
2263
|
if (event.pointerType === 'touch') {
|
|
@@ -2738,6 +2758,6 @@ class KritzelImageTool extends KritzelBaseTool {
|
|
|
2738
2758
|
}
|
|
2739
2759
|
|
|
2740
2760
|
export { AddSelectionGroupCommand as A, BatchCommand as B, DEFAULT_BRUSH_CONFIG as D, KritzelBrushTool as K, ObjectHelper as O, RemoveSelectionGroupCommand as R, UpdateObjectCommand as U, KritzelTextTool as a, KritzelMouseButton as b, KritzelSelectionTool as c, KritzelEraserTool as d, DEFAULT_TEXT_CONFIG as e, KritzelImageTool as f, KritzelWorkspace as g, KritzelKeyboardHelper as h, KritzelEventHelper as i, KritzelBaseHandler as j, KritzelToolRegistry as k, KritzelSelectionGroup as l, KritzelBaseCommand as m, KrtizelSelectionBox as n, KritzelReviver as o, RemoveObjectCommand as p, AddObjectCommand as q, KritzelBaseTool as r, KritzelText as s, KritzelPath as t, KritzelImage as u };
|
|
2741
|
-
//# sourceMappingURL=index-
|
|
2761
|
+
//# sourceMappingURL=index-CxieEK_G.js.map
|
|
2742
2762
|
|
|
2743
|
-
//# sourceMappingURL=index-
|
|
2763
|
+
//# sourceMappingURL=index-CxieEK_G.js.map
|