js-draw 1.18.0 → 1.19.1

package/dist/cjs/tools/ToolController.js

@@ -62,6 +62,7 @@ class ToolController {
         const secondaryPenTool = new Pen_1.default(editor, localization.penTool(2), { color: math_1.Color4.clay, thickness: 4 });
         // Stabilize the secondary pen tool.
         secondaryPenTool.setInputMapper(new InputStabilizer_1.default(editor.viewport));
+        const eraser = new Eraser_1.default(editor, localization.eraserTool);
         const primaryTools = [
             // Three pens
             primaryPenTool,
@@ -72,7 +73,7 @@ class ToolController {
                 thickness: 40,
                 factory: PressureSensitiveFreehandLineBuilder_1.makePressureSensitiveFreehandLineBuilder
             }),
-            new Eraser_1.default(editor, localization.eraserTool),
+            eraser,
             new SelectionTool_1.default(editor, localization.selectionTool),
             new TextTool_1.default(editor, localization.textTool, localization),
             new PanZoom_1.default(editor, PanZoom_1.PanZoomMode.SinglePointerGestures, localization.anyDevicePanning),
@@ -90,6 +91,7 @@ class ToolController {
             new UndoRedoShortcut_1.default(editor),
             new ToolbarShortcutHandler_1.default(editor),
             new ToolSwitcherShortcut_1.default(editor),
+            eraser.makeEraserSwitcherTool(),
             new FindTool_1.default(editor),
             new PasteHandler_1.default(editor),
             new SelectAllShortcutHandler_1.default(editor),
@@ -208,6 +210,13 @@ class ToolController {
     insertToolsBefore(insertBefore, toolsToInsert) {
         this.insertTools(insertBefore, toolsToInsert, 'before');
     }
+    /** @internal */
+    changeActiveToolTo(tool) {
+        if (!tool.isEnabled()) {
+            tool.setEnabled(true);
+        }
+        this.activeTool = tool;
+    }
     // @internal use `dispatchEvent` rather than calling `onEvent` directly.
     onEventInternal(event) {
         const isEditorReadOnly = this.isEditorReadOnly.get();

package/dist/cjs/util/ReactiveValue.d.ts

@@ -33,6 +33,8 @@ export declare abstract class ReactiveValue<T> {
      * @see {@link onUpdate}.
      */
     abstract onUpdateAndNow(callback: UpdateCallback<T>): ListenerResult;
+    /** Returns a promise that resolves when this value is next changed. */
+    waitForNextUpdate(): Promise<T>;
     /** Creates a `ReactiveValue` with an initial value, `initialValue`. */
     static fromInitialValue<T>(initialValue: T): MutableReactiveValue<T>;
     /** Returns a `ReactiveValue` that is **known** will never change. */

package/dist/cjs/util/ReactiveValue.js

@@ -38,6 +38,15 @@ const noOpSetUpdateListener = () => {
  * Avoid extending this class from an external library, as that may not be stable.
  */
 class ReactiveValue {
+    /** Returns a promise that resolves when this value is next changed. */
+    waitForNextUpdate() {
+        return new Promise(resolve => {
+            const listener = this.onUpdate(value => {
+                listener.remove();
+                resolve(value);
+            });
+        });
+    }
     /** Creates a `ReactiveValue` with an initial value, `initialValue`. */
     static fromInitialValue(initialValue) {
         return new ReactiveValueImpl(initialValue);
@@ -51,6 +60,8 @@ class ReactiveValue {
                 callback(value);
                 return noOpUpdateListenerResult;
             },
+            // Never resolves -- immutable.
+            waitForNextUpdate: () => new Promise(() => { }),
         };
     }
     /**

package/dist/cjs/util/bytesToSizeString.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Returns a size in bytes, KiB, or MiB with units suffix.
+ */
+declare const bytesToSizeString: (sizeBytes: number) => {
+    size: number;
+    units: string;
+};
+export default bytesToSizeString;

package/dist/cjs/util/bytesToSizeString.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+/**
+ * Returns a size in bytes, KiB, or MiB with units suffix.
+ */
+const bytesToSizeString = (sizeBytes) => {
+    const sizeInKiB = sizeBytes / 1024;
+    const sizeInMiB = sizeInKiB / 1024;
+    const sizeInGiB = sizeInMiB / 1024;
+    let units = 'B';
+    let size = sizeBytes;
+    if (sizeInGiB >= 1) {
+        size = sizeInGiB;
+        units = 'GiB';
+    }
+    else if (sizeInMiB >= 1) {
+        size = sizeInMiB;
+        units = 'MiB';
+    }
+    else if (sizeInKiB >= 1) {
+        size = sizeInKiB;
+        units = 'KiB';
+    }
+    return { size, units };
+};
+exports.default = bytesToSizeString;

package/dist/cjs/util/bytesToSizeString.test.d.ts

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

package/dist/cjs/util/stopPropagationOfScrollingWheelEvents.js

@@ -1,15 +1,19 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const stopPropagationOfScrollingWheelEvents = (scrollingContainer) => {
+    const scrollsAxis = (delta, clientSize, scrollOffset, scrollSize) => {
+        const hasScroll = clientSize !== scrollSize && delta !== 0;
+        const eventScrollsPastStart = scrollOffset + delta <= 0;
+        const scrollEnd = scrollOffset + clientSize;
+        const eventScrollsPastEnd = scrollEnd + delta > scrollSize;
+        return hasScroll && !eventScrollsPastStart && !eventScrollsPastEnd;
+    };
     scrollingContainer.onwheel = (event) => {
-        const hasScroll = scrollingContainer.clientWidth !== scrollingContainer.scrollWidth
-            && event.deltaX !== 0;
-        const eventScrollsPastLeft = scrollingContainer.scrollLeft + event.deltaX <= 0;
-        const scrollRight = scrollingContainer.scrollLeft + scrollingContainer.clientWidth;
-        const eventScrollsPastRight = scrollRight + event.deltaX > scrollingContainer.scrollWidth;
+        const scrollsX = scrollsAxis(event.deltaX, scrollingContainer.clientWidth, scrollingContainer.scrollLeft, scrollingContainer.scrollWidth);
+        const scrollsY = scrollsAxis(event.deltaY, scrollingContainer.clientHeight, scrollingContainer.scrollTop, scrollingContainer.scrollHeight);
         // Stop the editor from receiving the event if it will scroll the pen type selector
         // instead.
-        if (hasScroll && !eventScrollsPastLeft && !eventScrollsPastRight) {
+        if (scrollsX || scrollsY) {
             event.stopPropagation();
         }
     };

package/dist/cjs/util/waitForAll.d.ts

@@ -1,6 +1,8 @@
 /**
  * Resolves when all given promises have resolved. If no promises are given,
  * does not return a Promise.
+ *
+ * If all elements of `results` are known to be `Promise`s, use `Promise.all`.
  */
 declare const waitForAll: (results: (Promise<void> | void)[]) => Promise<void> | void;
 export default waitForAll;

package/dist/cjs/util/waitForAll.js

@@ -3,6 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 /**
  * Resolves when all given promises have resolved. If no promises are given,
  * does not return a Promise.
+ *
+ * If all elements of `results` are known to be `Promise`s, use `Promise.all`.
  */
 const waitForAll = (results) => {
     // If any are Promises...

package/dist/cjs/util/waitForImageLoaded.js

@@ -4,7 +4,10 @@ const waitForImageLoad = async (image) => {
     if (!image.complete) {
         await new Promise((resolve, reject) => {
             image.onload = event => resolve(event);
+            // TODO(v2): Return a `new Error(event.message)`
+            // eslint-disable-next-line @typescript-eslint/prefer-promise-reject-errors -- Forwarding an error-like object.
             image.onerror = event => reject(event);
+            // eslint-disable-next-line @typescript-eslint/prefer-promise-reject-errors -- Forwarding an error-like object.
             image.onabort = event => reject(event);
         });
     }

package/dist/cjs/util/waitForTimeout.d.ts

@@ -1,2 +1,3 @@
+/** Returns a promise that resolves after `timeout` milliseconds. */
 declare const waitForTimeout: (timeout: number) => Promise<void>;
 export default waitForTimeout;

package/dist/cjs/util/waitForTimeout.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-// Returns a promise that resolves after `timeout` milliseconds.
+/** Returns a promise that resolves after `timeout` milliseconds. */
 const waitForTimeout = (timeout) => {
     return new Promise(resolve => {
         setTimeout(() => resolve(), timeout);

package/dist/cjs/version.js

@@ -6,5 +6,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
  * @internal
  */
 exports.default = {
-    number: '1.18.0',
+    number: '1.19.1',
 };

package/dist/mjs/Editor.d.ts

@@ -19,6 +19,7 @@ import RenderablePathSpec from './rendering/RenderablePathSpec';
 import { AboutDialogEntry } from './dialogs/makeAboutDialog';
 import ReactiveValue, { MutableReactiveValue } from './util/ReactiveValue';
 import { PenTypeRecord } from './toolbar/widgets/PenToolWidget';
+import { ShowCustomFilePickerCallback } from './toolbar/widgets/components/makeFileInput';
 /**
  * Provides settings to an instance of an editor. See the Editor {@link Editor.constructor}.
  *
@@ -76,7 +77,7 @@ export interface EditorSettings {
         version?: string;
     } | null;
     /**
-     * Configures the default pen tools.
+     * Configures the default {@link PenTool} tools.
      *
      * **Example**:
      * [[include:doc-pages/inline-examples/editor-settings-polyline-pen.md]]
@@ -102,6 +103,24 @@ export interface EditorSettings {
          */
         filterPenTypes?: (penType: PenTypeRecord) => boolean;
     } | null;
+    /** Configures the default {@link TextTool} control and text tool. */
+    text: {
+        /** Fonts to show in the text UI. */
+        fonts?: string[];
+    } | null;
+    /** Configures the default {@link InsertImageWidget} control. */
+    image: {
+        /**
+         * A custom callback to show an image picker. If given, this should return
+         * a list of `File`s representing the images selected by the picker.
+         *
+         * If not given, the default file picker shown by a [file input](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file)
+         * is shown.
+         *
+         * @beta -- API may change between minor releases.
+         */
+        showImagePicker?: ShowCustomFilePickerCallback;
+    } | null;
 }
 /**
  * The main entrypoint for the full editor.

package/dist/mjs/Editor.mjs

@@ -113,6 +113,12 @@ export class Editor {
                 additionalPenTypes: settings.pens?.additionalPenTypes ?? [],
                 filterPenTypes: settings.pens?.filterPenTypes ?? (() => true)
             },
+            text: {
+                fonts: settings.text?.fonts ?? ['sans-serif', 'serif', 'monospace'],
+            },
+            image: {
+                showImagePicker: settings.image?.showImagePicker ?? undefined,
+            },
         };
         // Validate settings
         if (this.settings.minZoom > this.settings.maxZoom) {

package/dist/mjs/{SVGLoader.d.ts → SVGLoader/index.d.ts}

@@ -1,5 +1,5 @@
 import { Rect2 } from '@js-draw/math';
-import { ComponentAddedListener, ImageLoader, OnDetermineExportRectListener, OnProgressListener } from './types';
+import { ComponentAddedListener, ImageLoader, OnDetermineExportRectListener, OnProgressListener } from '../types';
 export declare const defaultSVGViewRect: Rect2;
 export declare const svgAttributesDataKey = "svgAttrs";
 export declare const svgStyleAttributesDataKey = "svgStyleAttrs";

package/dist/mjs/{SVGLoader.mjs → SVGLoader/index.mjs}

@@ -1,12 +1,13 @@
 import { Color4, Mat33, Path, Rect2, Vec2 } from '@js-draw/math';
-import  BackgroundComponent, { BackgroundType, backgroundTypeToClassNameMap, imageBackgroundCSSClassName, imageBackgroundGridSizeCSSPrefix, imageBackgroundNonAutomaticSecondaryColorCSSClassName }  from './components/BackgroundComponent.mjs';
-import  ImageComponent  from './components/ImageComponent.mjs';
-import  Stroke  from './components/Stroke.mjs';
-import  SVGGlobalAttributesObject  from './components/SVGGlobalAttributesObject.mjs';
-import  TextComponent, { TextTransformMode }  from './components/TextComponent.mjs';
-import  UnknownSVGObject  from './components/UnknownSVGObject.mjs';
-import  { pathToRenderable }  from './rendering/RenderablePathSpec.mjs';
-import  { renderedStylesheetId }  from './rendering/renderers/SVGRenderer.mjs';
+import  BackgroundComponent, { BackgroundType, backgroundTypeToClassNameMap, imageBackgroundCSSClassName, imageBackgroundGridSizeCSSPrefix, imageBackgroundNonAutomaticSecondaryColorCSSClassName }  from '../components/BackgroundComponent.mjs';
+import  ImageComponent  from '../components/ImageComponent.mjs';
+import  Stroke  from '../components/Stroke.mjs';
+import  SVGGlobalAttributesObject  from '../components/SVGGlobalAttributesObject.mjs';
+import  TextComponent, { TextTransformMode }  from '../components/TextComponent.mjs';
+import  UnknownSVGObject  from '../components/UnknownSVGObject.mjs';
+import  { pathToRenderable }  from '../rendering/RenderablePathSpec.mjs';
+import  { renderedStylesheetId }  from '../rendering/renderers/SVGRenderer.mjs';
+import  determineFontSize  from './utils/determineFontSize.mjs';
 // Size of a loaded image if no size is specified.
 export const defaultSVGViewRect = new Rect2(0, 0, 500, 500);
 // Key to retrieve unrecognised attributes from an AbstractComponent
@@ -296,31 +297,13 @@ export default class SVGLoader {
         }
         // Compute styles.
         const computedStyles = this.getComputedStyle(elem);
-        const fontSizeExp = /^([-0-9.e]+)px/i;
-        // In some environments, computedStyles.fontSize can be increased by the system.
-        // Thus, to prevent text from growing on load/save, prefer .style.fontSize.
-        let fontSizeMatch = fontSizeExp.exec(elem.style?.fontSize ?? '');
-        if (!fontSizeMatch && elem.tagName.toLowerCase() === 'tspan' && elem.parentElement) {
-            // Try to inherit the font size of the parent text element.
-            fontSizeMatch = fontSizeExp.exec(elem.parentElement.style?.fontSize ?? '');
-        }
-        // If we still couldn't find a font size, try to use computedStyles (which can be
-        // wrong).
-        if (!fontSizeMatch && computedStyles) {
-            fontSizeMatch = fontSizeExp.exec(computedStyles.fontSize);
-        }
-        const supportedStyleAttrs = [
+        const supportedStyleAttrs = new Set([
             'fontFamily',
             'transform',
             ...supportedStrokeFillStyleAttrs,
-        ];
-        let fontSize = 12;
-        if (fontSizeMatch) {
-            supportedStyleAttrs.push('fontSize');
-            fontSize = parseFloat(fontSizeMatch[1]);
-        }
+        ]);
         const style = {
-            size: fontSize,
+            size: determineFontSize(elem, computedStyles, supportedStyleAttrs),
             fontFamily: computedStyles?.fontFamily || elem.style?.fontFamily || 'sans-serif',
             fontWeight: computedStyles?.fontWeight || elem.style?.fontWeight || undefined,
             fontStyle: computedStyles?.fontStyle || elem.style?.fontStyle || undefined,

package/dist/mjs/SVGLoader/index.test.d.ts

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

package/dist/mjs/SVGLoader/utils/determineFontSize.d.ts

@@ -0,0 +1,3 @@
+/** Computes the font size of a text element, based on style information. */
+declare const determineFontSize: (elem: SVGTextElement | SVGTSpanElement, computedStyles: CSSStyleDeclaration | undefined, supportedStyleAttrs: Set<string>) => number;
+export default determineFontSize;

package/dist/mjs/SVGLoader/utils/determineFontSize.mjs

@@ -0,0 +1,25 @@
+/** Computes the font size of a text element, based on style information. */
+const determineFontSize = (elem, computedStyles, 
+// output: Written to to update supported style attributes
+supportedStyleAttrs) => {
+    const fontSizeExp = /^([-0-9.e]+)px/i;
+    // In some environments, computedStyles.fontSize can be increased by the system.
+    // Thus, to prevent text from growing on load/save, prefer .style.fontSize.
+    let fontSizeMatch = fontSizeExp.exec(elem.style?.fontSize ?? '');
+    if (!fontSizeMatch && elem.tagName.toLowerCase() === 'tspan' && elem.parentElement) {
+        // Try to inherit the font size of the parent text element.
+        fontSizeMatch = fontSizeExp.exec(elem.parentElement.style?.fontSize ?? '');
+    }
+    // If we still couldn't find a font size, try to use computedStyles (which can be
+    // wrong).
+    if (!fontSizeMatch && computedStyles) {
+        fontSizeMatch = fontSizeExp.exec(computedStyles.fontSize);
+    }
+    let fontSize = 12;
+    if (fontSizeMatch) {
+        supportedStyleAttrs.add('fontSize');
+        fontSize = parseFloat(fontSizeMatch[1]);
+    }
+    return fontSize;
+};
+export default determineFontSize;

package/dist/mjs/Viewport.d.ts

@@ -55,7 +55,39 @@ export declare class Viewport {
      *
      * @see {@link getGridSize} and {@link getScaleFactorToNearestPowerOf}.
      */
-    snapToGrid(canvasPos: Point2): Vec3;
+    snapToGrid(canvasPos: Point2): {
+        readonly x: number;
+        readonly y: number;
+        readonly z: number;
+        readonly xy: {
+            x: number;
+            y: number;
+        };
+        at(idx: number): number;
+        length(): number;
+        magnitude(): number;
+        magnitudeSquared(): number;
+        squareDistanceTo(p: Vec3): number;
+        distanceTo(p: Vec3): number;
+        maximumEntryMagnitude(): number;
+        angle(): number;
+        normalized(): Vec3;
+        normalizedOrZero(): Vec3;
+        times(c: number): Vec3;
+        plus(v: Vec3): Vec3;
+        minus(v: Vec3): Vec3;
+        dot(other: Vec3): number;
+        cross(other: Vec3): Vec3;
+        scale(other: number | Vec3): Vec3;
+        orthog(): Vec3;
+        extend(distance: number, direction: Vec3): Vec3;
+        lerp(target: Vec3, fractionTo: number): Vec3;
+        zip(other: Vec3, zip: (componentInThis: number, componentInOther: number) => number): Vec3;
+        map(fn: (component: number, index: number) => number): Vec3;
+        asArray(): [number, number, number];
+        eq(other: Vec3, fuzz?: number | undefined): boolean;
+        toString(): string;
+    };
     /** Returns the size of one screen pixel in canvas units. */
     getSizeOfPixelOnCanvas(): number;
     /**

package/dist/mjs/components/TextComponent.mjs

@@ -83,7 +83,9 @@ class TextComponent extends AbstractComponent {
     }
     static applyTextStyles(ctx, style) {
         // Quote the font family if necessary.
-        const fontFamily = style.fontFamily.match(/\s/) ? style.fontFamily.replace(/["]/g, '\\"') : style.fontFamily;
+        const hasSpaces = style.fontFamily.match(/\s/);
+        const isQuoted = style.fontFamily.match(/^".*"$/);
+        const fontFamily = hasSpaces && !isQuoted ? `"${style.fontFamily.replace(/["]/g, '\\"')}"` : style.fontFamily;
         ctx.font = [
             style.fontStyle ?? '',
             style.fontWeight ?? '',

package/dist/mjs/rendering/caching/RenderingCacheNode.mjs

@@ -139,24 +139,29 @@ export default class RenderingCacheNode {
             || items.length === 0) {
             return;
         }
-        const newItems = [];
-        // Divide [items] until nodes are leaves or smaller than this
-        for (const item of items) {
-            const bbox = item.getBBox();
-            if (!bbox.intersects(this.region)) {
-                continue;
-            }
-            if (bbox.maxDimension >= this.region.maxDimension) {
-                newItems.push(...item.getChildrenOrSelfIntersectingRegion(this.region));
-            }
-            else {
-                newItems.push(item);
+        // Divide [items] until nodes are smaller than this, or are leaves.
+        const divideUntilSmallerThanThis = (itemsToDivide) => {
+            const newItems = [];
+            for (const item of itemsToDivide) {
+                const bbox = item.getBBox();
+                if (!bbox.intersects(this.region)) {
+                    continue;
+                }
+                if (bbox.maxDimension >= this.region.maxDimension) {
+                    newItems.push(...item.getChildrenOrSelfIntersectingRegion(this.region));
+                }
+                else {
+                    newItems.push(item);
+                }
             }
-        }
-        items = newItems;
+            return newItems;
+        };
+        items = divideUntilSmallerThanThis(items);
         // Can we cache at all?
         if (!this.cacheState.props.isOfCorrectType(screenRenderer)) {
-            items.forEach(item => item.render(screenRenderer, viewport.visibleRect));
+            for (const item of items) {
+                item.render(screenRenderer, viewport.visibleRect);
+            }
             return;
         }
         if (this.cacheState.debugMode) {

package/dist/mjs/testing/findNodeWithText.d.ts

@@ -0,0 +1,3 @@
+/** Returns the first node or element with `textContent` matching `expectedText`. */
+declare const findNodeWithText: (expectedText: string, parent: Node) => Node | null;
+export default findNodeWithText;

package/dist/mjs/testing/findNodeWithText.mjs

@@ -0,0 +1,14 @@
+/** Returns the first node or element with `textContent` matching `expectedText`. */
+const findNodeWithText = (expectedText, parent) => {
+    if (parent.textContent === expectedText) {
+        return parent;
+    }
+    for (const child of parent.childNodes) {
+        const results = findNodeWithText(expectedText, child);
+        if (results) {
+            return results;
+        }
+    }
+    return null;
+};
+export default findNodeWithText;

package/dist/mjs/testing/firstElementAncestorOfNode.d.ts

@@ -0,0 +1,3 @@
+/** Returns the first ancestor of the given node that is an HTMLElement */
+declare const firstElementAncestorOfNode: (node: Node | null) => HTMLElement | null;
+export default firstElementAncestorOfNode;

package/dist/mjs/testing/firstElementAncestorOfNode.mjs

@@ -0,0 +1,11 @@
+/** Returns the first ancestor of the given node that is an HTMLElement */
+const firstElementAncestorOfNode = (node) => {
+    if (node instanceof HTMLElement) {
+        return node;
+    }
+    else if (node?.parentNode) {
+        return firstElementAncestorOfNode(node.parentNode);
+    }
+    return null;
+};
+export default firstElementAncestorOfNode;

package/dist/mjs/testing/sendKeyPressRelease.d.ts

@@ -0,0 +1,3 @@
+import type Editor from '../Editor';
+declare const sendKeyPressRelease: (editor: Editor, key: string) => void;
+export default sendKeyPressRelease;

package/dist/mjs/testing/sendKeyPressRelease.mjs

@@ -0,0 +1,6 @@
+import  { InputEvtType }  from '../inputEvents.mjs';
+const sendKeyPressRelease = (editor, key) => {
+    editor.sendKeyboardEvent(InputEvtType.KeyPressEvent, key);
+    editor.sendKeyboardEvent(InputEvtType.KeyUpEvent, key);
+};
+export default sendKeyPressRelease;

package/dist/mjs/testing/sendPenEvent.d.ts

@@ -1,6 +1,6 @@
 import Editor from '../Editor';
 import { Point2 } from '@js-draw/math';
-import Pointer from '../Pointer';
+import Pointer, { PointerDevice } from '../Pointer';
 import { InputEvtType } from '../inputEvents';
 /**
  * Dispatch a pen event to the currently selected tool.
@@ -8,5 +8,5 @@ import { InputEvtType } from '../inputEvents';
  *
  * @see {@link sendTouchEvent}
  */
-declare const sendPenEvent: (editor: Editor, eventType: InputEvtType.PointerDownEvt | InputEvtType.PointerMoveEvt | InputEvtType.PointerUpEvt, point: Point2, allPointers?: Pointer[]) => Pointer;
+declare const sendPenEvent: (editor: Editor, eventType: InputEvtType.PointerDownEvt | InputEvtType.PointerMoveEvt | InputEvtType.PointerUpEvt, point: Point2, allPointers?: Pointer[], deviceType?: PointerDevice) => Pointer;
 export default sendPenEvent;

package/dist/mjs/testing/sendPenEvent.mjs

@@ -1,4 +1,4 @@
-import  Pointer  from '../Pointer.mjs';
+import  Pointer, { PointerDevice }  from '../Pointer.mjs';
 import  { InputEvtType }  from '../inputEvents.mjs';
 import  getUniquePointerId  from './getUniquePointerId.mjs';
 /**
@@ -7,9 +7,9 @@ import  getUniquePointerId  from './getUniquePointerId.mjs';
  *
  * @see {@link sendTouchEvent}
  */
-const sendPenEvent = (editor, eventType, point, allPointers) => {
+const sendPenEvent = (editor, eventType, point, allPointers, deviceType = PointerDevice.Pen) => {
     const id = getUniquePointerId(allPointers ?? []);
-    const mainPointer = Pointer.ofCanvasPoint(point, eventType !== InputEvtType.PointerUpEvt, editor.viewport, id);
+    const mainPointer = Pointer.ofCanvasPoint(point, eventType !== InputEvtType.PointerUpEvt, editor.viewport, id, deviceType);
     editor.toolController.dispatchInputEvent({
         kind: eventType,
         allPointers: allPointers ?? [

package/dist/mjs/toolbar/localization.d.ts

@@ -17,6 +17,7 @@ export interface ToolbarLocalization extends ToolbarUtilsLocalization {
     dragAndDropHereOrBrowse: string;
     cancel: string;
     submit: string;
+    addAll: string;
     roundedTipPen: string;
     roundedTipPen2: string;
     flatTipPen: string;
@@ -56,6 +57,7 @@ export interface ToolbarLocalization extends ToolbarUtilsLocalization {
     strokeAutocorrect: string;
     errorImageHasZeroSize: string;
     describeTheImage: string;
+    fileInput__loading: string;
     penDropdown__baseHelpText: string;
     penDropdown__colorHelpText: string;
     penDropdown__thicknessHelpText: string;

package/dist/mjs/toolbar/localization.mjs

@@ -14,6 +14,7 @@ export const defaultToolbarLocalization = {
     chooseFile: 'Choose file',
     dragAndDropHereOrBrowse: 'Drag and drop here\nor\n{{browse}}',
     submit: 'Submit',
+    addAll: 'Add all',
     cancel: 'Cancel',
     resetView: 'Reset view',
     thicknessLabel: 'Thickness',
@@ -57,6 +58,7 @@ export const defaultToolbarLocalization = {
     paste: 'Paste',
     errorImageHasZeroSize: 'Error: Image has zero size',
     describeTheImage: 'Image description',
+    fileInput__loading: 'Loading...',
     // Help text
     penDropdown__baseHelpText: 'This tool draws shapes or freehand lines.',
     penDropdown__colorHelpText: 'Changes the pen\'s color',

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

@@ -126,6 +126,7 @@ export default abstract class BaseWidget {
     setHidden(hidden: boolean): void;
     /** Set whether the widget is contained within another. @internal */
     setIsToplevel(toplevel: boolean): void;
+    /** Returns true if the menu for this widget is open. */
     protected isDropdownVisible(): boolean;
     protected isSelected(): boolean;
     private createDropdownIcon;

package/dist/mjs/toolbar/widgets/BaseWidget.mjs

@@ -399,6 +399,7 @@ class BaseWidget {
     setIsToplevel(toplevel) {
         this.toplevel = toplevel;
     }
+    /** Returns true if the menu for this widget is open. */
     isDropdownVisible() {
         return this.dropdown?.visible?.get() ?? false;
     }

package/dist/mjs/toolbar/widgets/InsertImageWidget/ImageWrapper.d.ts

@@ -0,0 +1,22 @@
+import { RenderableImage } from 'js-draw/src/rendering/renderers/AbstractRenderer';
+/** Handles filtering and other operations on an image. */
+export declare class ImageWrapper {
+    private imageBase64Url;
+    private preview;
+    private onUrlUpdate;
+    private readonly originalSrc;
+    private altText;
+    private constructor();
+    private updateImageData;
+    decreaseSize(resizeFactor?: number): void;
+    reset(): void;
+    isChanged(): boolean;
+    getBase64Url(): string;
+    getAltText(): string;
+    setAltText(text: string): void;
+    static fromSrcAndPreview(initialBase64Src: string, preview: HTMLImageElement, onUrlUpdate: () => void): ImageWrapper;
+    static fromRenderable(renderable: RenderableImage, onUrlUpdate: () => void): {
+        wrapper: ImageWrapper;
+        preview: HTMLImageElement;
+    };
+}