js-draw 0.4.0 → 0.5.0

package/dist/src/Editor.d.ts

@@ -193,7 +193,7 @@ export declare class Editor {
         remove: () => void;
     };
     addStyleSheet(content: string): HTMLStyleElement;
-    sendKeyboardEvent(eventType: InputEvtType.KeyPressEvent | InputEvtType.KeyUpEvent, key: string, ctrlKey?: boolean): void;
+    sendKeyboardEvent(eventType: InputEvtType.KeyPressEvent | InputEvtType.KeyUpEvent, key: string, ctrlKey?: boolean, altKey?: boolean): void;
     sendPenEvent(eventType: InputEvtType.PointerDownEvt | InputEvtType.PointerMoveEvt | InputEvtType.PointerUpEvt, point: Point2, allPointers?: Pointer[]): void;
     toSVG(): SVGElement;
     loadFrom(loader: ImageLoader): Promise<void>;

package/dist/src/Editor.js

@@ -441,6 +441,7 @@ export class Editor {
                 kind: InputEvtType.KeyPressEvent,
                 key: evt.key,
                 ctrlKey: evt.ctrlKey,
+                altKey: evt.altKey,
             })) {
                 evt.preventDefault();
             }
@@ -453,6 +454,7 @@ export class Editor {
                 kind: InputEvtType.KeyUpEvent,
                 key: evt.key,
                 ctrlKey: evt.ctrlKey,
+                altKey: evt.altKey,
             })) {
                 evt.preventDefault();
             }
@@ -598,16 +600,19 @@ export class Editor {
     }
     // Dispatch a keyboard event to the currently selected tool.
     // Intended for unit testing
-    sendKeyboardEvent(eventType, key, ctrlKey = false) {
+    sendKeyboardEvent(eventType, key, ctrlKey = false, altKey = false) {
         this.toolController.dispatchInputEvent({
             kind: eventType,
             key,
-            ctrlKey
+            ctrlKey,
+            altKey,
         });
     }
     // Dispatch a pen event to the currently selected tool.
     // Intended primarially for unit tests.
-    sendPenEvent(eventType, point, allPointers) {
+    sendPenEvent(eventType, point, 
+    // @deprecated
+    allPointers) {
         const mainPointer = Pointer.ofCanvasPoint(point, eventType !== InputEvtType.PointerUpEvt, this.viewport);
         this.toolController.dispatchInputEvent({
             kind: eventType,

package/dist/src/components/AbstractComponent.js

@@ -48,6 +48,7 @@ export default class AbstractComponent {
     transformBy(affineTransfm) {
         return new AbstractComponent.TransformElementCommand(affineTransfm, this);
     }
+    // Returns a copy of this component.
     clone() {
         const clone = this.createClone();
         for (const attachmentKey in this.loadSaveData) {

package/dist/src/components/Stroke.js

@@ -6,7 +6,8 @@ export default class Stroke extends AbstractComponent {
     constructor(parts) {
         var _a;
         super('stroke');
-        this.parts = parts.map((section) => {
+        this.parts = [];
+        for (const section of parts) {
             const path = Path.fromRenderable(section);
             const pathBBox = this.bboxForPart(path.bbox, section.style);
             if (!this.contentBBox) {
@@ -15,14 +16,14 @@ export default class Stroke extends AbstractComponent {
             else {
                 this.contentBBox = this.contentBBox.union(pathBBox);
             }
-            return {
+            this.parts.push({
                 path,
                 // To implement RenderablePathSpec
                 startPoint: path.startPoint,
                 style: section.style,
                 commands: path.parts,
-            };
-        });
+            });
+        }
         (_a = this.contentBBox) !== null && _a !== void 0 ? _a : (this.contentBBox = Rect2.empty);
     }
     intersects(line) {
@@ -80,11 +81,16 @@ export default class Stroke extends AbstractComponent {
         });
     }
     getPath() {
-        var _a;
-        return (_a = this.parts.reduce((accumulator, current) => {
-            var _a;
-            return (_a = accumulator === null || accumulator === void 0 ? void 0 : accumulator.union(current.path)) !== null && _a !== void 0 ? _a : current.path;
-        }, null)) !== null && _a !== void 0 ? _a : Path.empty;
+        let result = null;
+        for (const part of this.parts) {
+            if (result) {
+                result = result.union(part.path);
+            }
+            else {
+                result !== null && result !== void 0 ? result : (result = part.path);
+            }
+        }
+        return result !== null && result !== void 0 ? result : Path.empty;
     }
     description(localization) {
         return localization.stroke;

package/dist/src/components/Text.d.ts

@@ -29,7 +29,7 @@ export default class Text extends AbstractComponent {
     intersects(lineSegment: LineSegment2): boolean;
     protected applyTransformation(affineTransfm: Mat33): void;
     protected createClone(): AbstractComponent;
-    private getText;
+    getText(): string;
     description(localizationTable: ImageComponentLocalization): string;
     protected serializeToJSON(): Record<string, any>;
     static deserializeFromString(json: any, getTextDimens?: GetTextDimensCallback): Text;

package/dist/src/components/Text.js

@@ -113,7 +113,7 @@ export default class Text extends AbstractComponent {
                 result.push(textObject.getText());
             }
         }
-        return result.join(' ');
+        return result.join('\n');
     }
     description(localizationTable) {
         return localizationTable.text(this.getText());

package/dist/src/components/builders/FreehandLineBuilder.d.ts

@@ -29,6 +29,7 @@ export default class FreehandLineBuilder implements ComponentBuilder {
     preview(renderer: AbstractRenderer): void;
     build(): Stroke;
     private roundPoint;
+    private approxCurrentCurveLength;
     private finalizeCurrentCurve;
     private currentSegmentToPath;
     private computeExitingVec;

package/dist/src/components/builders/FreehandLineBuilder.js

@@ -117,7 +117,7 @@ export default class FreehandLineBuilder {
         }
     }
     build() {
-        if (this.lastPoint) {
+        if (this.lastPoint && (this.lowerSegments.length === 0 || this.approxCurrentCurveLength() > this.curveStartWidth * 2)) {
             this.finalizeCurrentCurve();
         }
         return this.previewStroke();
@@ -129,6 +129,18 @@ export default class FreehandLineBuilder {
         }
         return Viewport.roundPoint(point, minFit);
     }
+    // Returns the distance between the start, control, and end points of the curve.
+    approxCurrentCurveLength() {
+        if (!this.currentCurve) {
+            return 0;
+        }
+        const startPt = Vec2.ofXY(this.currentCurve.points[0]);
+        const controlPt = Vec2.ofXY(this.currentCurve.points[1]);
+        const endPt = Vec2.ofXY(this.currentCurve.points[2]);
+        const toControlDist = startPt.minus(controlPt).length();
+        const toEndDist = endPt.minus(controlPt).length();
+        return toControlDist + toEndDist;
+    }
     finalizeCurrentCurve() {
         // Case where no points have been added
         if (!this.currentCurve) {
@@ -204,10 +216,8 @@ export default class FreehandLineBuilder {
         let endVec = Vec2.ofXY(this.currentCurve.normal(1)).normalized();
         startVec = startVec.times(this.curveStartWidth / 2);
         endVec = endVec.times(this.curveEndWidth / 2);
-        if (isNaN(startVec.magnitude())) {
-            // TODO: This can happen when events are too close together. Find out why and
-            // 		 fix.
-            console.error('startVec is NaN', startVec, endVec, this.currentCurve);
+        if (!isFinite(startVec.magnitude())) {
+            console.error('Warning: startVec is NaN or ∞', startVec, endVec, this.currentCurve);
             startVec = endVec;
         }
         const startPt = Vec2.ofXY(this.currentCurve.get(0));
@@ -224,28 +234,18 @@ export default class FreehandLineBuilder {
             }
         }
         const halfVecT = projectionT;
-        let halfVec = Vec2.ofXY(this.currentCurve.normal(halfVecT))
+        const halfVec = Vec2.ofXY(this.currentCurve.normal(halfVecT))
             .normalized().times(this.curveStartWidth / 2 * halfVecT
             + this.curveEndWidth / 2 * (1 - halfVecT));
-        // Computes a boundary curve. [direction] should be either +1 or -1 (determines the side
-        // of the center curve to place the boundary).
-        const computeBoundaryCurve = (direction, halfVec) => {
-            return new Bezier(startPt.plus(startVec.times(direction)), controlPoint.plus(halfVec.times(direction)), endPt.plus(endVec.times(direction)));
-        };
-        const boundariesIntersect = () => {
-            const upperBoundary = computeBoundaryCurve(1, halfVec);
-            const lowerBoundary = computeBoundaryCurve(-1, halfVec);
-            return upperBoundary.intersects(lowerBoundary).length > 0;
-        };
-        // If the boundaries have intersections, increasing the half vector's length could fix this.
-        if (boundariesIntersect()) {
-            halfVec = halfVec.times(1.1);
-        }
         // Each starts at startPt ± startVec
+        const lowerCurveControlPoint = this.roundPoint(controlPoint.plus(halfVec));
+        const lowerCurveEndPoint = this.roundPoint(endPt.plus(endVec));
+        const upperCurveControlPoint = this.roundPoint(controlPoint.minus(halfVec));
+        const upperCurveStartPoint = this.roundPoint(endPt.minus(endVec));
         const lowerCurve = {
             kind: PathCommandType.QuadraticBezierTo,
-            controlPoint: this.roundPoint(controlPoint.plus(halfVec)),
-            endPoint: this.roundPoint(endPt.plus(endVec)),
+            controlPoint: lowerCurveControlPoint,
+            endPoint: lowerCurveEndPoint,
         };
         // From the end of the upperCurve to the start of the lowerCurve:
         const upperToLowerConnector = {
@@ -255,11 +255,11 @@ export default class FreehandLineBuilder {
         // From the end of lowerCurve to the start of upperCurve:
         const lowerToUpperConnector = {
             kind: PathCommandType.LineTo,
-            point: this.roundPoint(endPt.minus(endVec))
+            point: upperCurveStartPoint,
         };
         const upperCurve = {
             kind: PathCommandType.QuadraticBezierTo,
-            controlPoint: this.roundPoint(controlPoint.minus(halfVec)),
+            controlPoint: upperCurveControlPoint,
             endPoint: this.roundPoint(startPt.minus(startVec)),
         };
         return { upperCurve, upperToLowerConnector, lowerToUpperConnector, lowerCurve };
@@ -275,7 +275,6 @@ export default class FreehandLineBuilder {
             const fuzzEq = 1e-10;
             const deltaTime = newPoint.time - this.lastPoint.time;
             if (newPoint.pos.eq(this.lastPoint.pos, fuzzEq) || deltaTime === 0) {
-                console.warn('Discarding identical point');
                 return;
             }
             else if (isNaN(newPoint.pos.magnitude())) {
@@ -327,29 +326,29 @@ export default class FreehandLineBuilder {
         const startEndDist = segmentEnd.minus(segmentStart).magnitude();
         const maxControlPointDist = maxRelativeLength * startEndDist;
         // Exit in cases where we would divide by zero
-        if (maxControlPointDist === 0 || exitingVec.magnitude() === 0 || isNaN(exitingVec.magnitude())) {
+        if (maxControlPointDist === 0 || exitingVec.magnitude() === 0 || !isFinite(exitingVec.magnitude())) {
             return;
         }
-        console.assert(!isNaN(enteringVec.magnitude()));
+        console.assert(isFinite(enteringVec.magnitude()), 'Pre-normalized enteringVec has NaN or ∞ magnitude!');
         enteringVec = enteringVec.normalized();
         exitingVec = exitingVec.normalized();
-        console.assert(!isNaN(enteringVec.magnitude()));
+        console.assert(isFinite(enteringVec.magnitude()), 'Normalized enteringVec has NaN or ∞ magnitude!');
         const lineFromStart = new LineSegment2(segmentStart, segmentStart.plus(enteringVec.times(maxControlPointDist)));
         const lineFromEnd = new LineSegment2(segmentEnd.minus(exitingVec.times(maxControlPointDist)), segmentEnd);
         const intersection = lineFromEnd.intersection(lineFromStart);
         // Position the control point at this intersection
-        let controlPoint;
+        let controlPoint = null;
         if (intersection) {
             controlPoint = intersection.point;
         }
-        else {
+        // No intersection or the intersection is one of the end points?
+        if (!controlPoint || segmentStart.eq(controlPoint) || segmentEnd.eq(controlPoint)) {
             // Position the control point closer to the first -- the connecting
             // segment will be roughly a line.
             controlPoint = segmentStart.plus(enteringVec.times(startEndDist / 4));
         }
-        if (isNaN(controlPoint.magnitude()) || isNaN(segmentStart.magnitude())) {
-            console.error('controlPoint is NaN', intersection, 'Start:', segmentStart, 'End:', segmentEnd, 'in:', enteringVec, 'out:', exitingVec);
-        }
+        console.assert(!segmentStart.eq(controlPoint, 1e-11), 'Start and control points are equal!');
+        console.assert(!controlPoint.eq(segmentEnd, 1e-11), 'Control and end points are equal!');
         const prevCurve = this.currentCurve;
         this.currentCurve = new Bezier(segmentStart.xy, controlPoint.xy, segmentEnd.xy);
         if (isNaN(Vec2.ofXY(this.currentCurve.normal(0)).magnitude())) {
@@ -369,8 +368,7 @@ export default class FreehandLineBuilder {
             }
             return true;
         };
-        const approxCurveLen = controlPoint.minus(segmentStart).magnitude() + segmentEnd.minus(controlPoint).magnitude();
-        if (this.buffer.length > 3 && approxCurveLen > this.curveEndWidth / 3) {
+        if (this.buffer.length > 3 && this.approxCurrentCurveLength() > this.curveStartWidth) {
             if (!curveMatchesPoints(this.currentCurve)) {
                 // Use a curve that better fits the points
                 this.currentCurve = prevCurve;

package/dist/src/math/Vec3.d.ts

@@ -97,7 +97,7 @@ export default class Vec3 {
      * Vec3.of(1, 2, 3).eq(Vec3.of(4, 5, 6), 2.99); // → false
      * ```
      */
-    eq(other: Vec3, fuzz: number): boolean;
+    eq(other: Vec3, fuzz?: number): boolean;
     toString(): string;
     static unitX: Vec3;
     static unitY: Vec3;

package/dist/src/math/Vec3.js

@@ -156,7 +156,7 @@ export default class Vec3 {
      * Vec3.of(1, 2, 3).eq(Vec3.of(4, 5, 6), 2.99); // → false
      * ```
      */
-    eq(other, fuzz) {
+    eq(other, fuzz = 1e-10) {
         for (let i = 0; i < 3; i++) {
             if (Math.abs(other.at(i) - this.at(i)) > fuzz) {
                 return false;

package/dist/src/rendering/renderers/SVGRenderer.js

@@ -72,7 +72,7 @@ export default class SVGRenderer extends AbstractRenderer {
     drawPath(pathSpec) {
         var _a;
         const style = pathSpec.style;
-        const path = Path.fromRenderable(pathSpec);
+        const path = Path.fromRenderable(pathSpec).transformedBy(this.getCanvasToScreenTransform());
         // Try to extend the previous path, if possible
         if (!style.fill.eq((_a = this.lastPathStyle) === null || _a === void 0 ? void 0 : _a.fill) || this.lastPathString.length === 0) {
             this.addPathToSVG();

package/dist/src/testing/beforeEachFile.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/src/testing/beforeEachFile.js

@@ -0,0 +1,3 @@
+import loadExpectExtensions from './loadExpectExtensions';
+loadExpectExtensions();
+jest.useFakeTimers();

package/dist/src/testing/createEditor.d.ts

@@ -1,3 +1,4 @@
 import Editor from '../Editor';
+/** Creates an editor. Should only be used in test files. */
 declare const _default: () => Editor;
 export default _default;

package/dist/src/testing/createEditor.js

@@ -1,3 +1,9 @@
 import { RenderingMode } from '../rendering/Display';
 import Editor from '../Editor';
-export default () => new Editor(document.body, { renderingMode: RenderingMode.DummyRenderer });
+/** Creates an editor. Should only be used in test files. */
+export default () => {
+    if (jest === undefined) {
+        throw new Error('Files in the testing/ folder should only be used in tests!');
+    }
+    return new Editor(document.body, { renderingMode: RenderingMode.DummyRenderer });
+};

package/dist/src/testing/loadExpectExtensions.d.ts

@@ -1,17 +1,2 @@
 export declare const loadExpectExtensions: () => void;
-export interface CustomMatchers<R = unknown> {
-    objEq(expected: {
-        eq: (other: any, ...args: any) => boolean;
-    }, ...opts: any): R;
-}
-declare global {
-    export namespace jest {
-        interface Expect extends CustomMatchers {
-        }
-        interface Matchers<R> extends CustomMatchers<R> {
-        }
-        interface AsyncAsymmetricMatchers extends CustomMatchers {
-        }
-    }
-}
 export default loadExpectExtensions;

package/dist/src/toolbar/widgets/BaseWidget.d.ts

@@ -1,4 +1,5 @@
 import Editor from '../../Editor';
+import { KeyPressEvent } from '../../types';
 import { ToolbarLocalization } from '../localization';
 export default abstract class BaseWidget {
     #private;
@@ -18,6 +19,7 @@ export default abstract class BaseWidget {
     protected abstract createIcon(): Element;
     protected fillDropdown(dropdown: HTMLElement): boolean;
     protected setupActionBtnClickListener(button: HTMLElement): void;
+    protected onKeyPress(_event: KeyPressEvent): boolean;
     protected abstract handleClick(): void;
     protected get hasDropdown(): boolean;
     protected addSubWidget(widget: BaseWidget): void;

package/dist/src/toolbar/widgets/BaseWidget.js

@@ -10,6 +10,7 @@ var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (
     return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
 };
 var _BaseWidget_hasDropdown;
+import ToolbarShortcutHandler from '../../tools/ToolbarShortcutHandler';
 import { EditorEventType, InputEvtType } from '../../types';
 import { toolbarCSSPrefix } from '../HTMLToolbar';
 import { makeDropdownIcon } from '../icons';
@@ -33,6 +34,12 @@ export default class BaseWidget {
         this.label = document.createElement('label');
         this.button.setAttribute('role', 'button');
         this.button.tabIndex = 0;
+        const toolbarShortcutHandlers = this.editor.toolController.getMatchingTools(ToolbarShortcutHandler);
+        // If the onKeyPress function has been extended and the editor is configured to send keypress events to
+        // toolbar widgets,
+        if (toolbarShortcutHandlers.length > 0 && this.onKeyPress !== BaseWidget.prototype.onKeyPress) {
+            toolbarShortcutHandlers[0].registerListener(event => this.onKeyPress(event));
+        }
     }
     // Add content to the widget's associated dropdown menu.
     // Returns true if such a menu should be created, false otherwise.
@@ -62,6 +69,7 @@ export default class BaseWidget {
                     kind: InputEvtType.KeyPressEvent,
                     key: evt.key,
                     ctrlKey: evt.ctrlKey,
+                    altKey: evt.altKey,
                 });
             }
         };
@@ -73,6 +81,7 @@ export default class BaseWidget {
                 kind: InputEvtType.KeyUpEvent,
                 key: evt.key,
                 ctrlKey: evt.ctrlKey,
+                altKey: evt.altKey,
             });
         };
         button.onclick = () => {
@@ -81,6 +90,12 @@ export default class BaseWidget {
             }
         };
     }
+    // Add a listener that is triggered when a key is pressed.
+    // Listeners will fire regardless of whether this widget is selected and require that
+    // {@link lib!Editor.toolController} to have an enabled {@link lib!ToolbarShortcutHandler} tool.
+    onKeyPress(_event) {
+        return false;
+    }
     get hasDropdown() {
         return __classPrivateFieldGet(this, _BaseWidget_hasDropdown, "f");
     }

package/dist/src/toolbar/widgets/PenToolWidget.d.ts

@@ -1,6 +1,7 @@
 import { ComponentBuilderFactory } from '../../components/builders/types';
 import Editor from '../../Editor';
 import Pen from '../../tools/Pen';
+import { KeyPressEvent } from '../../types';
 import { ToolbarLocalization } from '../localization';
 import BaseToolWidget from './BaseToolWidget';
 export interface PenTypeRecord {
@@ -16,4 +17,5 @@ export default class PenToolWidget extends BaseToolWidget {
     protected createIcon(): Element;
     private static idCounter;
     protected fillDropdown(dropdown: HTMLElement): boolean;
+    protected onKeyPress(event: KeyPressEvent): boolean;
 }

package/dist/src/toolbar/widgets/PenToolWidget.js

@@ -127,5 +127,19 @@ export default class PenToolWidget extends BaseToolWidget {
         dropdown.replaceChildren(container);
         return true;
     }
+    onKeyPress(event) {
+        if (!this.isSelected()) {
+            return false;
+        }
+        // Map alt+0-9 to different pen types.
+        if (/^[0-9]$/.exec(event.key) && event.ctrlKey) {
+            const penTypeIdx = parseInt(event.key) - 1;
+            if (penTypeIdx >= 0 && penTypeIdx < this.penTypes.length) {
+                this.tool.setStrokeFactory(this.penTypes[penTypeIdx].factory);
+                return true;
+            }
+        }
+        return false;
+    }
 }
 PenToolWidget.idCounter = 0;

package/dist/src/tools/SelectionTool/SelectionTool.js

@@ -8,6 +8,7 @@ import Viewport from '../../Viewport';
 import BaseTool from '../BaseTool';
 import SVGRenderer from '../../rendering/renderers/SVGRenderer';
 import Selection from './Selection';
+import TextComponent from '../../components/Text';
 export const cssPrefix = 'selection-tool-';
 // {@inheritDoc SelectionTool!}
 export default class SelectionTool extends BaseTool {
@@ -215,10 +216,17 @@ export default class SelectionTool extends BaseTool {
         const exportElem = document.createElementNS(svgNameSpace, 'svg');
         const sanitize = true;
         const renderer = new SVGRenderer(exportElem, exportViewport, sanitize);
+        const text = [];
         for (const elem of selectedElems) {
             elem.render(renderer);
+            if (elem instanceof TextComponent) {
+                text.push(elem.getText());
+            }
         }
         event.setData('image/svg+xml', exportElem.outerHTML);
+        if (text.length > 0) {
+            event.setData('text/plain', text.join('\n'));
+        }
         return true;
     }
     setEnabled(enabled) {

package/dist/src/tools/ToolController.js

@@ -10,6 +10,7 @@ import TextTool from './TextTool';
 import PipetteTool from './PipetteTool';
 import ToolSwitcherShortcut from './ToolSwitcherShortcut';
 import PasteHandler from './PasteHandler';
+import ToolbarShortcutHandler from './ToolbarShortcutHandler';
 export default class ToolController {
     /** @internal */
     constructor(editor, localization) {
@@ -35,6 +36,7 @@ export default class ToolController {
             ...primaryTools,
             keyboardPanZoomTool,
             new UndoRedoShortcut(editor),
+            new ToolbarShortcutHandler(editor),
             new ToolSwitcherShortcut(editor),
             new PasteHandler(editor),
         ];

package/dist/src/tools/ToolbarShortcutHandler.d.ts

@@ -0,0 +1,12 @@
+import Editor from '../Editor';
+import { KeyPressEvent } from '../types';
+import BaseTool from './BaseTool';
+declare type KeyPressListener = (event: KeyPressEvent) => boolean;
+export default class ToolbarShortcutHandler extends BaseTool {
+    private listeners;
+    constructor(editor: Editor);
+    registerListener(listener: KeyPressListener): void;
+    removeListener(listener: KeyPressListener): void;
+    onKeyPress(event: KeyPressEvent): boolean;
+}
+export {};

package/dist/src/tools/ToolbarShortcutHandler.js

@@ -0,0 +1,23 @@
+// Allows the toolbar to register keyboard events.
+// @packageDocumentation
+import BaseTool from './BaseTool';
+export default class ToolbarShortcutHandler extends BaseTool {
+    constructor(editor) {
+        super(editor.notifier, editor.localization.changeTool);
+        this.listeners = new Set([]);
+    }
+    registerListener(listener) {
+        this.listeners.add(listener);
+    }
+    removeListener(listener) {
+        this.listeners.delete(listener);
+    }
+    onKeyPress(event) {
+        for (const listener of this.listeners) {
+            if (listener(event)) {
+                return true;
+            }
+        }
+        return false;
+    }
+}

package/dist/src/tools/lib.d.ts

@@ -12,3 +12,4 @@ export { default as TextTool } from './TextTool';
 export { default as SelectionTool } from './SelectionTool/SelectionTool';
 export { default as EraserTool } from './Eraser';
 export { default as PasteHandler } from './PasteHandler';
+export { default as ToolbarShortcutHandler } from './ToolbarShortcutHandler';

package/dist/src/tools/lib.js

@@ -12,3 +12,4 @@ export { default as TextTool } from './TextTool';
 export { default as SelectionTool } from './SelectionTool/SelectionTool';
 export { default as EraserTool } from './Eraser';
 export { default as PasteHandler } from './PasteHandler';
+export { default as ToolbarShortcutHandler } from './ToolbarShortcutHandler';

package/dist/src/types.d.ts

@@ -34,12 +34,14 @@ export interface WheelEvt {
 export interface KeyPressEvent {
     readonly kind: InputEvtType.KeyPressEvent;
     readonly key: string;
-    readonly ctrlKey: boolean;
+    readonly ctrlKey: boolean | undefined;
+    readonly altKey: boolean | undefined;
 }
 export interface KeyUpEvent {
     readonly kind: InputEvtType.KeyUpEvent;
     readonly key: string;
-    readonly ctrlKey: boolean;
+    readonly ctrlKey: boolean | undefined;
+    readonly altKey: boolean | undefined;
 }
 export interface CopyEvent {
     readonly kind: InputEvtType.CopyEvent;

package/jest.config.js

@@ -10,6 +10,10 @@ const config = {
 		'js',
 	],
 
+	testPathIgnorePatterns: [
+		'<rootDir>/dist/', '<rootDir>/node_modules/'
+	],
+
 	// Mocks.
 	// See https://jestjs.io/docs/webpack#handling-static-assets
 	moduleNameMapper: {
@@ -19,6 +23,7 @@ const config = {
 	},
 	
 	testEnvironment: 'jsdom',
+	setupFilesAfterEnv: [ '<rootDir>/src/testing/beforeEachFile.ts' ],
 };
 
 module.exports = config;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "js-draw",
-	"version": "0.4.0",
+	"version": "0.5.0",
 	"description": "Draw pictures using a pen, touchscreen, or mouse! JS-draw is a drawing library for JavaScript and TypeScript. ",
 	"main": "./dist/src/lib.d.ts",
 	"types": "./dist/src/lib.js",
@@ -71,36 +71,37 @@
 		"lint": "eslint .",
 		"linter-precommit": "eslint --fix --ext .js --ext .ts",
 		"lint-staged": "lint-staged",
+		"lint-ci": "eslint . --max-warnings=0 --ext .js --ext .ts",
 		"prepare": "husky install && yarn build",
 		"prepack": "yarn build && yarn test && pinst --disable",
 		"postpack": "pinst --enable"
 	},
 	"dependencies": {
-		"@melloware/coloris": "^0.16.0",
+		"@melloware/coloris": "^0.16.1",
 		"bezier-js": "^6.1.0"
 	},
 	"devDependencies": {
 		"@types/bezier-js": "^4.1.0",
-		"@types/jest": "^28.1.7",
+		"@types/jest": "^29.0.3",
 		"@types/jsdom": "^20.0.0",
-		"@types/node": "^18.7.15",
-		"@typescript-eslint/eslint-plugin": "^5.36.2",
-		"@typescript-eslint/parser": "^5.36.2",
+		"@types/node": "^18.7.23",
+		"@typescript-eslint/eslint-plugin": "^5.38.1",
+		"@typescript-eslint/parser": "^5.38.1",
 		"css-loader": "^6.7.1",
-		"eslint": "^8.23.0",
+		"eslint": "^8.24.0",
 		"husky": "^8.0.1",
-		"jest": "^28.1.3",
-		"jest-environment-jsdom": "^29.0.2",
+		"jest": "^29.0.3",
+		"jest-environment-jsdom": "^29.0.3",
 		"jsdom": "^20.0.0",
 		"lint-staged": "^13.0.3",
 		"pinst": "^3.0.0",
 		"style-loader": "^3.3.1",
-		"terser-webpack-plugin": "^5.3.5",
-		"ts-jest": "^28.0.8",
-		"ts-loader": "^9.3.1",
+		"terser-webpack-plugin": "^5.3.6",
+		"ts-jest": "^29.0.2",
+		"ts-loader": "^9.4.1",
 		"ts-node": "^10.9.1",
-		"typedoc": "^0.23.14",
-		"typescript": "^4.8.2",
+		"typedoc": "^0.23.15",
+		"typescript": "^4.8.3",
 		"webpack": "^5.74.0"
 	},
 	"bugs": {