js-draw 0.1.9 → 0.1.12

package/src/{geometry → math}/Path.toString.test.ts

@@ -15,7 +15,7 @@ describe('Path.toString', () => {
 				point: Vec2.of(0.3, 0.4),
 			},
 		]);
-		expect(path.toString()).toBe('M0.1,0.2L0.3,0.4');
+		expect(path.toString()).toBe('M.1,.2L.3,.4');
 	});
 
 	it('should fix rounding errors', () => {
@@ -30,7 +30,8 @@ describe('Path.toString', () => {
 				point: Vec2.of(184.00482359999998, 1)
 			}
 		]);
-		expect(path.toString()).toBe('M0.1,0.2Q9999,-11 0.0003,1.4L184.0048236,1');
+
+		expect(path.toString()).toBe('M.1,.2Q9999,-11 .0003,1.4L184.0048236,1');
 	});
 
 	it('should not remove trailing zeroes before decimal points', () => {
@@ -40,6 +41,14 @@ describe('Path.toString', () => {
 				point: Vec2.of(30.0001, 40.000000001),
 			},
 		]);
+
 		expect(path.toString()).toBe('M1000,2000000L30.0001,40');
 	});
+
+	it('deserialized path should serialize to the same/similar path, but with rounded components', () => {
+		const path1 = Path.fromString('M100,100 L101,101 Q102,102 90.000000001,89.99999999 Z');
+		expect(path1.toString()).toBe([
+			'M100,100', 'L101,101', 'Q102,102 90,90', 'L100,100'
+		].join(''));
+	});
 });

package/src/{geometry → math}/Path.ts

@@ -1,6 +1,7 @@
 import { Bezier } from 'bezier-js';
 import { RenderablePathSpec } from '../rendering/renderers/AbstractRenderer';
 import RenderingStyle from '../rendering/RenderingStyle';
+import { toRoundedString, toStringOfSamePrecision } from './rounding';
 import LineSegment2 from './LineSegment2';
 import Mat33 from './Mat33';
 import Rect2 from './Rect2';
@@ -170,8 +171,8 @@ export default class Path {
 		return result;
 	}
 
-	public transformedBy(affineTransfm: Mat33): Path {
-		const startPoint = affineTransfm.transformVec2(this.startPoint);
+	public mapPoints(mapping: (point: Point2)=>Point2): Path {
+		const startPoint = mapping(this.startPoint);
 		const newParts: PathCommand[] = [];
 
 		let exhaustivenessCheck: never;
@@ -181,22 +182,22 @@ export default class Path {
 			case PathCommandType.LineTo:
 				newParts.push({
 					kind: part.kind,
-					point: affineTransfm.transformVec2(part.point),
+					point: mapping(part.point),
 				});
 				break;
 			case PathCommandType.CubicBezierTo:
 				newParts.push({
 					kind: part.kind,
-					controlPoint1: affineTransfm.transformVec2(part.controlPoint1),
-					controlPoint2: affineTransfm.transformVec2(part.controlPoint2),
-					endPoint: affineTransfm.transformVec2(part.endPoint),
+					controlPoint1: mapping(part.controlPoint1),
+					controlPoint2: mapping(part.controlPoint2),
+					endPoint: mapping(part.endPoint),
 				});
 				break;
 			case PathCommandType.QuadraticBezierTo:
 				newParts.push({
 					kind: part.kind,
-					controlPoint: affineTransfm.transformVec2(part.controlPoint),
-					endPoint: affineTransfm.transformVec2(part.endPoint),
+					controlPoint: mapping(part.controlPoint),
+					endPoint: mapping(part.endPoint),
 				});
 				break;
 			default:
@@ -208,6 +209,10 @@ export default class Path {
 		return new Path(startPoint, newParts);
 	}
 
+	public transformedBy(affineTransfm: Mat33): Path {
+		return this.mapPoints(point => affineTransfm.transformVec2(point));
+	}
+
 	// Creates a new path by joining [other] to the end of this path
 	public union(other: Path|null): Path {
 		if (!other) {
@@ -280,71 +285,69 @@ export default class Path {
 	}
 
 	public toString(): string {
-		return Path.toString(this.startPoint, this.parts);
+		// Hueristic: Try to determine whether converting absolute to relative commands is worth it.
+		//            If we're near (0, 0), it probably isn't worth it and if bounding boxes are large,
+		//            it also probably isn't worth it.
+		const makeRelativeCommands =
+			Math.abs(this.bbox.topLeft.x) > 10 && Math.abs(this.bbox.size.x) < 2
+			&& Math.abs(this.bbox.topLeft.y) > 10 && Math.abs(this.bbox.size.y) < 2;
+
+		return Path.toString(this.startPoint, this.parts, !makeRelativeCommands);
 	}
 
 	public serialize(): string {
 		return this.toString();
 	}
 
-	public static toString(startPoint: Point2, parts: PathCommand[]): string {
+	// [onlyAbsCommands]: True if we should avoid converting absolute coordinates to relative offsets -- such
+	//                    conversions can lead to smaller output strings, but also take time.
+	public static toString(startPoint: Point2, parts: PathCommand[], onlyAbsCommands: boolean = true): string {
 		const result: string[] = [];
 
-		const toRoundedString = (num: number): string => {
-			// Try to remove rounding errors. If the number ends in at least three/four zeroes
-			// (or nines) just one or two digits, it's probably a rounding error.
-			const fixRoundingUpExp = /^([-]?\d*\.\d{3,})0{4,}\d$/;
-			const hasRoundingDownExp = /^([-]?)(\d*)\.(\d{3,}9{4,}\d)$/;
-
-			let text = num.toString();
-			if (text.indexOf('.') === -1) {
-				return text;
-			}
+		let prevPoint: Point2|undefined;
+		const addCommand = (command: string, ...points: Point2[]) => {
+			const absoluteCommandParts: string[] = [];
+			const relativeCommandParts: string[] = [];
+			const makeAbsCommand = !prevPoint || onlyAbsCommands;
+			const roundedPrevX = prevPoint ? toRoundedString(prevPoint.x) : '';
+			const roundedPrevY = prevPoint ? toRoundedString(prevPoint.y) : '';
 
-			const roundingDownMatch = hasRoundingDownExp.exec(text);
-			if (roundingDownMatch) {
-				const negativeSign = roundingDownMatch[1];
-				const lastDigit = parseInt(text.charAt(text.length - 1), 10);
-				const postDecimal = parseInt(roundingDownMatch[3], 10);
-				const preDecimal = parseInt(roundingDownMatch[2], 10);
-
-				const origPostDecimalString = roundingDownMatch[3];
-
-				let newPostDecimal = (postDecimal + 10 - lastDigit).toString();
-				let carry = 0;
-				if (newPostDecimal.length > postDecimal.toString().length) {
-					// Left-shift
-					newPostDecimal = newPostDecimal.substring(1);
-					carry = 1;
-				}
+			for (const point of points) {
+				// Relative commands are often shorter as strings than absolute commands.
+				if (!makeAbsCommand) {
+					const xComponentRelative = toStringOfSamePrecision(point.x - prevPoint!.x, roundedPrevX, roundedPrevY);
+					const yComponentRelative = toStringOfSamePrecision(point.y - prevPoint!.y, roundedPrevX, roundedPrevY);
+
+					// No need for an additional separator if it starts with a '-'
+					if (yComponentRelative.charAt(0) === '-') {
+						relativeCommandParts.push(`${xComponentRelative}${yComponentRelative}`);
+					} else {
+						relativeCommandParts.push(`${xComponentRelative},${yComponentRelative}`);
+					}
+				} else {
+					const xComponent = toRoundedString(point.x);
+					const yComponent = toRoundedString(point.y);
 
-				// parseInt(...).toString() removes leading zeroes. Add them back.
-				while (newPostDecimal.length < origPostDecimalString.length) {
-					newPostDecimal = carry.toString(10) + newPostDecimal;
-					carry = 0;
+					absoluteCommandParts.push(`${xComponent},${yComponent}`);
 				}
-
-				text = `${negativeSign + (preDecimal + carry).toString()}.${newPostDecimal}`;
 			}
 
-			text = text.replace(fixRoundingUpExp, '$1');
-
-			// Remove trailing zeroes
-			text = text.replace(/([.]\d*[^0]+)0+$/, '$1');
-			text = text.replace(/[.]0+$/, '.');
+			let commandString;
+			if (makeAbsCommand) {
+				commandString = `${command}${absoluteCommandParts.join(' ')}`;
+			} else {
+				commandString = `${command.toLowerCase()}${relativeCommandParts.join(' ')}`;
+			}
 
-			// Remove trailing period
-			return text.replace(/[.]$/, '');
-		};
+			// Don't add no-ops.
+			if (commandString === 'l0,0') {
+				return;
+			}
+			result.push(commandString);
 
-		const addCommand = (command: string, ...points: Point2[]) => {
-			const parts: string[] = [];
-			for (const point of points) {
-				const xComponent = toRoundedString(point.x);
-				const yComponent = toRoundedString(point.y);
-				parts.push(`${xComponent},${yComponent}`);
+			if (points.length > 0) {
+				prevPoint = points[points.length - 1];
 			}
-			result.push(`${command}${parts.join(' ')}`);
 		};
 
 		addCommand('M', startPoint);

package/src/{geometry → math}/Rect2.test.ts

@@ -147,14 +147,27 @@ describe('Rect2', () => {
 		it('division of empty square', () => {
 			expect(Rect2.empty.divideIntoGrid(1000, 10000).length).toBe(1);
 		});
+
+		it('division of rectangle', () => {
+			expect(new Rect2(0, 0, 2, 1).divideIntoGrid(2, 2)).toMatchObject(
+				[
+					new Rect2(0, 0, 1, 0.5), new Rect2(1, 0, 1, 0.5),
+					new Rect2(0, 0.5, 1, 0.5), new Rect2(1, 0.5, 1, 0.5),
+				]
+			);
+		});
 	});
 
-	it('division of rectangle', () => {
-		expect(new Rect2(0, 0, 2, 1).divideIntoGrid(2, 2)).toMatchObject(
-			[
-				new Rect2(0, 0, 1, 0.5), new Rect2(1, 0, 1, 0.5),
-				new Rect2(0, 0.5, 1, 0.5), new Rect2(1, 0.5, 1, 0.5),
-			]
-		);
+	describe('should correctly return the closest point on the edge of a rectangle', () => {
+		it('with the unit square', () => {
+			const rect = Rect2.unitSquare;
+			expect(rect.getClosestPointOnBoundaryTo(Vec2.zero)).objEq(Vec2.zero);
+			expect(rect.getClosestPointOnBoundaryTo(Vec2.of(-1, -1))).objEq(Vec2.zero);
+			expect(rect.getClosestPointOnBoundaryTo(Vec2.of(-1, 0.5))).objEq(Vec2.of(0, 0.5));
+			expect(rect.getClosestPointOnBoundaryTo(Vec2.of(1, 0.5))).objEq(Vec2.of(1, 0.5));
+			expect(rect.getClosestPointOnBoundaryTo(Vec2.of(0.6, 0.6))).objEq(Vec2.of(1, 0.6));
+			expect(rect.getClosestPointOnBoundaryTo(Vec2.of(2, 0.5))).objEq(Vec2.of(1, 0.5));
+			expect(rect.getClosestPointOnBoundaryTo(Vec2.of(0.6, 0.6))).objEq(Vec2.of(1, 0.6));
+		});
 	});
 });

package/src/{geometry → math}/Rect2.ts

@@ -51,6 +51,7 @@ export default class Rect2 {
 		return new Rect2(vec.x + this.x, vec.y + this.y, this.w, this.h);
 	}
 
+	// Returns a copy of this with the given size (but same top-left).
 	public resizedTo(size: Vec2): Rect2 {
 		return new Rect2(this.x, this.y, size.x, size.y);
 	}
@@ -163,6 +164,23 @@ export default class Rect2 {
 		);
 	}
 
+	public getClosestPointOnBoundaryTo(target: Point2) {
+		const closestEdgePoints = this.getEdges().map(edge => {
+			return edge.closestPointTo(target);
+		});
+
+		let closest: Point2|null = null;
+		let closestDist: number|null = null;
+		for (const point of closestEdgePoints) {
+			const dist = point.minus(target).length();
+			if (closestDist === null || dist < closestDist) {
+				closest = point;
+				closestDist = dist;
+			}
+		}
+		return closest!;
+	}
+
 	public get corners(): Point2[] {
 		return [
 			this.bottomRight,
@@ -172,7 +190,7 @@ export default class Rect2 {
 		];
 	}
 
-	public get maxDimension(): number {
+	public get maxDimension() {
 		return Math.max(this.w, this.h);
 	}
 

package/src/{geometry → math}/Vec3.ts

@@ -115,9 +115,9 @@ export default class Vec3 {
 	}
 
 	// Returns a vector with each component acted on by [fn]
-	public map(fn: (component: number)=> number): Vec3 {
+	public map(fn: (component: number, index: number)=> number): Vec3 {
 		return Vec3.of(
-			fn(this.x), fn(this.y), fn(this.z)
+			fn(this.x, 0), fn(this.y, 1), fn(this.z, 2)
 		);
 	}
 

package/src/math/rounding.test.ts

@@ -0,0 +1,40 @@
+import { toRoundedString, toStringOfSamePrecision } from './rounding';
+
+describe('toRoundedString', () => {
+	it('should round up numbers endings similar to .999999999999999', () => {
+		expect(toRoundedString(0.999999999)).toBe('1');
+		expect(toRoundedString(0.899999999)).toBe('.9');
+		expect(toRoundedString(9.999999999)).toBe('10');
+		expect(toRoundedString(-10.999999999)).toBe('-11');
+	});
+
+	it('should round up numbers similar to 10.999999998', () => {
+		expect(toRoundedString(10.999999998)).toBe('11');
+	});
+
+	// Handling this creates situations with potential error:
+	//it('should round strings with multiple digits after the ending decimal points', () => {
+	//	expect(toRoundedString(292.2 - 292.8)).toBe('-0.6');
+	//});
+
+	it('should round down strings ending endings similar to .00000001', () => {
+		expect(toRoundedString(10.00000001)).toBe('10');
+	});
+});
+
+it('toStringOfSamePrecision', () => {
+	expect(toStringOfSamePrecision(1.23456, '1.12')).toBe('1.23');
+	expect(toStringOfSamePrecision(1.23456, '1.1')).toBe('1.2');
+	expect(toStringOfSamePrecision(1.23456, '1.1', '5.32')).toBe('1.23');
+	expect(toStringOfSamePrecision(-1.23456, '1.1', '5.32')).toBe('-1.23');
+	expect(toStringOfSamePrecision(-1.99999, '1.1', '5.32')).toBe('-2');
+	expect(toStringOfSamePrecision(1.99999, '1.1', '5.32')).toBe('2');
+	expect(toStringOfSamePrecision(1.89999, '1.1', '5.32')).toBe('1.9');
+	expect(toStringOfSamePrecision(9.99999999, '-1.1234')).toBe('10');
+	expect(toStringOfSamePrecision(9.999999998999996, '100')).toBe('10');
+	expect(toStringOfSamePrecision(0.000012345, '0.000012')).toBe('.000012');
+	expect(toStringOfSamePrecision(0.000012645, '.000012')).toBe('.000013');
+	expect(toStringOfSamePrecision(-0.09999999999999432, '291.3')).toBe('-.1');
+	expect(toStringOfSamePrecision(-0.9999999999999432, '291.3')).toBe('-1');
+	expect(toStringOfSamePrecision(9998.9, '.1', '-11')).toBe('9998.9');
+});

package/src/math/rounding.ts

@@ -0,0 +1,145 @@
+// Clean up stringified numbers
+const cleanUpNumber = (text: string) => {
+	// Regular expression substitions can be somewhat expensive. Only do them
+	// if necessary.
+	const lastChar = text.charAt(text.length - 1);
+	if (lastChar === '0' || lastChar === '.') {
+		// Remove trailing zeroes
+		text = text.replace(/([.]\d*[^0]+)0+$/, '$1');
+		text = text.replace(/[.]0+$/, '.');
+
+		// Remove trailing period
+		text = text.replace(/[.]$/, '');
+
+		if (text === '-0') {
+			return '0';
+		}
+	}
+
+	const firstChar = text.charAt(0);
+	if (firstChar === '0' || firstChar === '-') {
+		// Remove unnecessary leading zeroes.
+		text = text.replace(/^(0+)[.]/, '.');
+		text = text.replace(/^-(0+)[.]/, '-.');
+	}
+
+	return text;
+};
+
+export const toRoundedString = (num: number): string => {
+	// Try to remove rounding errors. If the number ends in at least three/four zeroes
+	// (or nines) just one or two digits, it's probably a rounding error.
+	const fixRoundingUpExp = /^([-]?\d*\.\d{3,})0{4,}\d{1,2}$/;
+	const hasRoundingDownExp = /^([-]?)(\d*)\.(\d{3,}9{4,})\d{1,2}$/;
+
+	let text = num.toString(10);
+	if (text.indexOf('.') === -1) {
+		return text;
+	}
+
+	const roundingDownMatch = hasRoundingDownExp.exec(text);
+	if (roundingDownMatch) {
+		const negativeSign = roundingDownMatch[1];
+		const postDecimalString = roundingDownMatch[3];
+		const lastDigit = parseInt(postDecimalString.charAt(postDecimalString.length - 1), 10);
+		const postDecimal = parseInt(postDecimalString, 10);
+		const preDecimal = parseInt(roundingDownMatch[2], 10);
+
+		const origPostDecimalString = roundingDownMatch[3];
+
+		let newPostDecimal = (postDecimal + 10 - lastDigit).toString();
+		let carry = 0;
+		if (newPostDecimal.length > postDecimal.toString().length) {
+			// Left-shift
+			newPostDecimal = newPostDecimal.substring(1);
+			carry = 1;
+		}
+
+		// parseInt(...).toString() removes leading zeroes. Add them back.
+		while (newPostDecimal.length < origPostDecimalString.length) {
+			newPostDecimal = carry.toString(10) + newPostDecimal;
+			carry = 0;
+		}
+
+		text = `${negativeSign + (preDecimal + carry).toString()}.${newPostDecimal}`;
+	}
+
+	text = text.replace(fixRoundingUpExp, '$1');
+
+	return cleanUpNumber(text);
+};
+
+const numberExp = /^([-]?)(\d*)[.](\d+)$/;
+export const getLenAfterDecimal = (numberAsString: string) => {
+	const numberMatch = numberExp.exec(numberAsString);
+	if (!numberMatch) {
+		// If not a match, either the number is exponential notation (or is something
+		// like NaN or Infinity)
+		if (numberAsString.search(/[eE]/) !== -1 || /^[a-zA-Z]+$/.exec(numberAsString)) {
+			return -1;
+		// Or it has no decimal point
+		} else {
+			return 0;
+		}
+	}
+
+	const afterDecimalLen = numberMatch[3].length;
+	return afterDecimalLen;
+};
+
+// [reference] should be a string representation of a base-10 number (no exponential (e.g. 10e10))
+export const toStringOfSamePrecision = (num: number, ...references: string[]): string => {
+	const text = num.toString(10);
+	const textMatch = numberExp.exec(text);
+	if (!textMatch) {
+		return text;
+	}
+
+	let decimalPlaces = -1;
+	for (const reference of references) {
+		decimalPlaces = Math.max(getLenAfterDecimal(reference), decimalPlaces);
+	}
+
+	if (decimalPlaces === -1) {
+		return toRoundedString(num);
+	}
+
+	// Make text's after decimal length match [afterDecimalLen].
+	let postDecimal = textMatch[3].substring(0, decimalPlaces);
+	let preDecimal = textMatch[2];
+	const nextDigit = textMatch[3].charAt(decimalPlaces);
+
+	if (nextDigit !== '') {
+		const asNumber = parseInt(nextDigit, 10);
+		if (asNumber >= 5) {
+			// Don't attempt to parseInt() an empty string.
+			if (postDecimal.length > 0) {
+				const leadingZeroMatch = /^(0+)(\d*)$/.exec(postDecimal);
+
+				let leadingZeroes = '';
+				let postLeading = postDecimal;
+				if (leadingZeroMatch) {
+					leadingZeroes = leadingZeroMatch[1];
+					postLeading = leadingZeroMatch[2];
+				}
+
+				postDecimal = (parseInt(postDecimal) + 1).toString();
+
+				// If postDecimal got longer, remove leading zeroes if possible
+				if (postDecimal.length > postLeading.length && leadingZeroes.length > 0) {
+					leadingZeroes = leadingZeroes.substring(1);
+				}
+
+				postDecimal = leadingZeroes + postDecimal;
+			}
+
+			if (postDecimal.length === 0 || postDecimal.length > decimalPlaces) {
+				preDecimal = (parseInt(preDecimal) + 1).toString();
+				postDecimal = postDecimal.substring(1);
+			}
+		}
+	}
+
+	const negativeSign = textMatch[1];
+	return cleanUpNumber(`${negativeSign}${preDecimal}.${postDecimal}`);
+};

package/src/rendering/Display.ts

@@ -3,7 +3,7 @@ import CanvasRenderer from './renderers/CanvasRenderer';
 import { Editor } from '../Editor';
 import { EditorEventType } from '../types';
 import DummyRenderer from './renderers/DummyRenderer';
-import { Point2, Vec2 } from '../geometry/Vec2';
+import { Point2, Vec2 } from '../math/Vec2';
 import RenderingCache from './caching/RenderingCache';
 import TextOnlyRenderer from './renderers/TextOnlyRenderer';
 import Color4 from '../Color4';
@@ -18,6 +18,7 @@ export default class Display {
 	private dryInkRenderer: AbstractRenderer;
 	private wetInkRenderer: AbstractRenderer;
 	private textRenderer: TextOnlyRenderer;
+	private textRerenderOutput: HTMLElement|null = null;
 	private cache: RenderingCache;
 	private resizeSurfacesCallback?: ()=> void;
 	private flattenCallback?: ()=> void;
@@ -59,10 +60,10 @@ export default class Display {
 				return this.dryInkRenderer.canRenderFromWithoutDataLoss(renderer);
 			},
 			blockResolution: cacheBlockResolution,
-			cacheSize: 500 * 500 * 4 * 200,
+			cacheSize: 500 * 500 * 4 * 220,
 			maxScale: 1.5,
-			minComponentsPerCache: 50,
-			minComponentsToUseCache: 120,
+			minComponentsPerCache: 45,
+			minComponentsToUseCache: 105,
 		});
 
 		this.editor.notifier.on(EditorEventType.DisplayResized, event => {
@@ -158,19 +159,26 @@ export default class Display {
 		rerenderButton.classList.add('rerenderButton');
 		rerenderButton.innerText = this.editor.localization.rerenderAsText;
 
-		const rerenderOutput = document.createElement('div');
-		rerenderOutput.ariaLive = 'polite';
+		this.textRerenderOutput = document.createElement('div');
+		this.textRerenderOutput.setAttribute('aria-live', 'polite');
 
 		rerenderButton.onclick = () => {
-			this.textRenderer.clear();
-			this.editor.image.render(this.textRenderer, this.editor.viewport);
-			rerenderOutput.innerText = this.textRenderer.getDescription();
+			this.rerenderAsText();
 		};
 
-		textRendererOutputContainer.replaceChildren(rerenderButton, rerenderOutput);
+		textRendererOutputContainer.replaceChildren(rerenderButton, this.textRerenderOutput);
 		this.editor.createHTMLOverlay(textRendererOutputContainer);
 	}
 
+	public rerenderAsText() {
+		this.textRenderer.clear();
+		this.editor.image.render(this.textRenderer, this.editor.viewport);
+		
+		if (this.textRerenderOutput) {
+			this.textRerenderOutput.innerText = this.textRenderer.getDescription();
+		}
+	}
+
 	// Clears the drawing surfaces and otherwise prepares for a rerender.
 	public startRerender(): AbstractRenderer {
 		this.resizeSurfacesCallback?.();

package/src/rendering/caching/CacheRecord.test.ts

@@ -1,7 +1,7 @@
 /* @jest-environment jsdom */
 
-import Rect2 from '../../geometry/Rect2';
-import { Vec2 } from '../../geometry/Vec2';
+import Rect2 from '../../math/Rect2';
+import { Vec2 } from '../../math/Vec2';
 import CacheRecord from './CacheRecord';
 import { createCache } from './testUtils';
 

package/src/rendering/caching/CacheRecord.ts

@@ -1,5 +1,5 @@
-import Mat33 from '../../geometry/Mat33';
-import Rect2 from '../../geometry/Rect2';
+import Mat33 from '../../math/Mat33';
+import Rect2 from '../../math/Rect2';
 import AbstractRenderer from '../renderers/AbstractRenderer';
 import { BeforeDeallocCallback, CacheState } from './types';
 

package/src/rendering/caching/CacheRecordManager.ts

@@ -1,6 +1,6 @@
 import { BeforeDeallocCallback, PartialCacheState } from './types';
 import CacheRecord from './CacheRecord';
-import Rect2 from '../../geometry/Rect2';
+import Rect2 from '../../math/Rect2';
 
 
 export class CacheRecordManager {

package/src/rendering/caching/RenderingCache.test.ts

@@ -3,11 +3,11 @@
 import DummyRenderer from '../renderers/DummyRenderer';
 import { createCache } from './testUtils';
 import Stroke from '../../components/Stroke';
-import Path from '../../geometry/Path';
+import Path from '../../math/Path';
 import Color4 from '../../Color4';
 import EditorImage from '../../EditorImage';
 import Viewport from '../../Viewport';
-import Mat33 from '../../geometry/Mat33';
+import Mat33 from '../../math/Mat33';
 
 describe('RenderingCache', () => {
 	const testPath = Path.fromString('M0,0 l100,500 l-20,20 L-100,-100');
@@ -35,7 +35,7 @@ describe('RenderingCache', () => {
 		expect(lastRenderer).not.toBeNull();
 		expect(lastRenderer!.renderedPathCount).toBe(1);
 
-		editor.dispatch(new Viewport.ViewportTransform(Mat33.scaling2D(0.1)));
+		editor.dispatch(Viewport.transformBy(Mat33.scaling2D(0.1)));
 		editor.image.renderWithCache(screenRenderer, cache, editor.viewport);
 		expect(allocdRenderers).toBe(1);
 		expect(lastRenderer!.renderedPathCount).toBe(1);

package/src/rendering/caching/RenderingCache.ts

@@ -1,5 +1,5 @@
 import { ImageNode } from '../../EditorImage';
-import Rect2 from '../../geometry/Rect2';
+import Rect2 from '../../math/Rect2';
 import Viewport from '../../Viewport';
 import AbstractRenderer from '../renderers/AbstractRenderer';
 import RenderingCacheNode from './RenderingCacheNode';