js-draw 0.23.0 → 0.24.0

package/dist/cjs/src/components/builders/PressureSensitiveFreehandLineBuilder.js

@@ -1,347 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.makePressureSensitiveFreehandLineBuilder = void 0;
-const bezier_js_1 = require("bezier-js");
-const Vec2_1 = require("../../math/Vec2");
-const Rect2_1 = __importDefault(require("../../math/Rect2"));
-const Path_1 = require("../../math/Path");
-const Stroke_1 = __importDefault(require("../Stroke"));
-const Viewport_1 = __importDefault(require("../../Viewport"));
-const StrokeSmoother_1 = require("../util/StrokeSmoother");
-const makePressureSensitiveFreehandLineBuilder = (initialPoint, viewport) => {
-    // Don't smooth if input is more than ± 3 pixels from the true curve, do smooth if
-    // less than ±1 px from the curve.
-    const maxSmoothingDist = viewport.getSizeOfPixelOnCanvas() * 3;
-    const minSmoothingDist = viewport.getSizeOfPixelOnCanvas();
-    return new PressureSensitiveFreehandLineBuilder(initialPoint, minSmoothingDist, maxSmoothingDist, viewport);
-};
-exports.makePressureSensitiveFreehandLineBuilder = makePressureSensitiveFreehandLineBuilder;
-// Handles stroke smoothing and creates Strokes from user/stylus input.
-class PressureSensitiveFreehandLineBuilder {
-    constructor(startPoint, 
-    // Maximum distance from the actual curve (irrespective of stroke width)
-    // for which a point is considered 'part of the curve'.
-    // Note that the maximum will be smaller if the stroke width is less than
-    // [maxFitAllowed].
-    minFitAllowed, maxFitAllowed, viewport) {
-        this.startPoint = startPoint;
-        this.minFitAllowed = minFitAllowed;
-        this.viewport = viewport;
-        this.isFirstSegment = true;
-        this.pathStartConnector = null;
-        this.mostRecentConnector = null;
-        this.lastUpperBezier = null;
-        this.lastLowerBezier = null;
-        this.parts = [];
-        this.upperSegments = [];
-        this.lowerSegments = [];
-        this.curveFitter = new StrokeSmoother_1.StrokeSmoother(startPoint, minFitAllowed, maxFitAllowed, curve => this.addCurve(curve));
-        this.curveStartWidth = startPoint.width;
-        this.bbox = new Rect2_1.default(this.startPoint.pos.x, this.startPoint.pos.y, 0, 0);
-    }
-    getBBox() {
-        return this.bbox;
-    }
-    getRenderingStyle() {
-        var _a;
-        return {
-            fill: (_a = this.startPoint.color) !== null && _a !== void 0 ? _a : null,
-        };
-    }
-    previewCurrentPath() {
-        var _a;
-        const upperPath = this.upperSegments.slice();
-        const lowerPath = this.lowerSegments.slice();
-        let lowerToUpperCap;
-        let pathStartConnector;
-        const currentCurve = this.curveFitter.preview();
-        if (currentCurve) {
-            const { upperCurveCommand, lowerToUpperConnector, upperToLowerConnector, lowerCurveCommand } = this.segmentToPath(currentCurve);
-            upperPath.push(upperCurveCommand);
-            lowerPath.push(lowerCurveCommand);
-            lowerToUpperCap = lowerToUpperConnector;
-            pathStartConnector = (_a = this.pathStartConnector) !== null && _a !== void 0 ? _a : upperToLowerConnector;
-        }
-        else {
-            if (this.mostRecentConnector === null || this.pathStartConnector === null) {
-                return null;
-            }
-            lowerToUpperCap = this.mostRecentConnector;
-            pathStartConnector = this.pathStartConnector;
-        }
-        let startPoint;
-        const lastLowerSegment = lowerPath[lowerPath.length - 1];
-        if (lastLowerSegment.kind === Path_1.PathCommandType.LineTo || lastLowerSegment.kind === Path_1.PathCommandType.MoveTo) {
-            startPoint = lastLowerSegment.point;
-        }
-        else {
-            startPoint = lastLowerSegment.endPoint;
-        }
-        return {
-            // Start at the end of the lower curve:
-            //    Start point
-            //     ↓
-            //  __/  __/ ← Most recent points on this end
-            // /___ /
-            //  ↑
-            //  Oldest points
-            startPoint,
-            commands: [
-                // Move to the most recent point on the upperPath:
-                //     ----→•
-                //  __/  __/
-                // /___ /
-                lowerToUpperCap,
-                // Move to the beginning of the upperPath:
-                //  __/  __/
-                // /___ /
-                //     • ←-
-                ...upperPath.reverse(),
-                // Move to the beginning of the lowerPath:
-                //  __/  __/
-                // /___ /
-                // •
-                pathStartConnector,
-                // Move back to the start point:
-                //     •
-                //  __/  __/
-                // /___ /
-                ...lowerPath,
-            ],
-            style: this.getRenderingStyle(),
-        };
-    }
-    previewFullPath() {
-        const preview = this.previewCurrentPath();
-        if (preview) {
-            return [...this.parts, preview];
-        }
-        return null;
-    }
-    previewStroke() {
-        const pathPreview = this.previewFullPath();
-        if (pathPreview) {
-            return new Stroke_1.default(pathPreview);
-        }
-        return null;
-    }
-    preview(renderer) {
-        const paths = this.previewFullPath();
-        if (paths) {
-            const approxBBox = this.viewport.visibleRect;
-            renderer.startObject(approxBBox);
-            for (const path of paths) {
-                renderer.drawPath(path);
-            }
-            renderer.endObject();
-        }
-    }
-    build() {
-        this.curveFitter.finalizeCurrentCurve();
-        if (this.isFirstSegment) {
-            // Ensure we have something.
-            this.addCurve(null);
-        }
-        return this.previewStroke();
-    }
-    roundPoint(point) {
-        let minFit = Math.min(this.minFitAllowed, this.curveStartWidth / 3);
-        if (minFit < 1e-10) {
-            minFit = this.minFitAllowed;
-        }
-        return Viewport_1.default.roundPoint(point, minFit);
-    }
-    // Returns true if, due to overlap with previous segments, a new RenderablePathSpec should be created.
-    shouldStartNewSegment(lowerCurve, upperCurve) {
-        if (!this.lastLowerBezier || !this.lastUpperBezier) {
-            return false;
-        }
-        const getIntersection = (curve1, curve2) => {
-            const intersection = curve1.intersects(curve2);
-            if (!intersection || intersection.length === 0) {
-                return null;
-            }
-            // From http://pomax.github.io/bezierjs/#intersect-curve,
-            // .intersects returns an array of 't1/t2' pairs, where curve1.at(t1) gives the point.
-            const firstTPair = intersection[0];
-            const match = /^([-0-9.eE]+)\/([-0-9.eE]+)$/.exec(firstTPair);
-            if (!match) {
-                throw new Error(`Incorrect format returned by .intersects: ${intersection} should be array of "number/number"!`);
-            }
-            const t = parseFloat(match[1]);
-            return Vec2_1.Vec2.ofXY(curve1.get(t));
-        };
-        const getExitDirection = (curve) => {
-            return Vec2_1.Vec2.ofXY(curve.points[2]).minus(Vec2_1.Vec2.ofXY(curve.points[1])).normalized();
-        };
-        const getEnterDirection = (curve) => {
-            return Vec2_1.Vec2.ofXY(curve.points[1]).minus(Vec2_1.Vec2.ofXY(curve.points[0])).normalized();
-        };
-        // Prevent
-        //         /
-        //       / /
-        //      /  /  /|
-        //    /    /   |
-        //  /          |
-        // where the next stroke and the previous stroke are in different directions.
-        //
-        // Are the exit/enter directions of the previous and current curves in different enough directions?
-        if (getEnterDirection(upperCurve).dot(getExitDirection(this.lastUpperBezier)) < 0.3
-            || getEnterDirection(lowerCurve).dot(getExitDirection(this.lastLowerBezier)) < 0.3
-            // Also handle if the curves exit/enter directions differ
-            || getEnterDirection(upperCurve).dot(getExitDirection(upperCurve)) < 0
-            || getEnterDirection(lowerCurve).dot(getExitDirection(lowerCurve)) < 0) {
-            return true;
-        }
-        // Check whether the lower curve intersects the other wall:
-        //       /    / ← lower
-        //    / /   /
-        // /   / /
-        //   //
-        // / /
-        const lowerIntersection = getIntersection(lowerCurve, this.lastUpperBezier);
-        const upperIntersection = getIntersection(upperCurve, this.lastLowerBezier);
-        if (lowerIntersection || upperIntersection) {
-            return true;
-        }
-        return false;
-    }
-    addCurve(curve) {
-        // Case where no points have been added
-        if (!curve) {
-            // Don't create a circle around the initial point if the stroke has more than one point.
-            if (!this.isFirstSegment) {
-                return;
-            }
-            const width = Viewport_1.default.roundPoint(this.startPoint.width / 2.2, Math.min(this.minFitAllowed, this.startPoint.width / 4));
-            const center = this.roundPoint(this.startPoint.pos);
-            // Start on the right, cycle clockwise:
-            //    |
-            //  ----- ←
-            //    |
-            const startPoint = this.startPoint.pos.plus(Vec2_1.Vec2.of(width, 0));
-            // Draw a circle-ish shape around the start point
-            this.lowerSegments.push({
-                kind: Path_1.PathCommandType.QuadraticBezierTo,
-                controlPoint: center.plus(Vec2_1.Vec2.of(width, width)),
-                // Bottom of the circle
-                //    |
-                //  -----
-                //    |
-                //    ↑
-                endPoint: center.plus(Vec2_1.Vec2.of(0, width)),
-            }, {
-                kind: Path_1.PathCommandType.QuadraticBezierTo,
-                controlPoint: center.plus(Vec2_1.Vec2.of(-width, width)),
-                endPoint: center.plus(Vec2_1.Vec2.of(-width, 0)),
-            }, {
-                kind: Path_1.PathCommandType.QuadraticBezierTo,
-                controlPoint: center.plus(Vec2_1.Vec2.of(-width, -width)),
-                endPoint: center.plus(Vec2_1.Vec2.of(0, -width)),
-            }, {
-                kind: Path_1.PathCommandType.QuadraticBezierTo,
-                controlPoint: center.plus(Vec2_1.Vec2.of(width, -width)),
-                endPoint: center.plus(Vec2_1.Vec2.of(width, 0)),
-            });
-            this.pathStartConnector = {
-                kind: Path_1.PathCommandType.LineTo,
-                point: startPoint,
-            };
-            this.mostRecentConnector = this.pathStartConnector;
-            return;
-        }
-        const { upperCurveCommand, lowerToUpperConnector, upperToLowerConnector, lowerCurveCommand, lowerCurve, upperCurve, } = this.segmentToPath(curve);
-        const shouldStartNew = this.shouldStartNewSegment(lowerCurve, upperCurve);
-        if (shouldStartNew) {
-            const part = this.previewCurrentPath();
-            if (part) {
-                this.parts.push(part);
-                this.upperSegments = [];
-                this.lowerSegments = [];
-            }
-        }
-        if (this.isFirstSegment || shouldStartNew) {
-            // We draw the upper path (reversed), then the lower path, so we need the
-            // upperToLowerConnector to join the two paths.
-            this.pathStartConnector = upperToLowerConnector;
-            this.isFirstSegment = false;
-        }
-        // With the most recent connector, we're joining the end of the lowerPath to the most recent
-        // upperPath:
-        this.mostRecentConnector = lowerToUpperConnector;
-        this.lowerSegments.push(lowerCurveCommand);
-        this.upperSegments.push(upperCurveCommand);
-        this.lastLowerBezier = lowerCurve;
-        this.lastUpperBezier = upperCurve;
-        this.curveStartWidth = curve.startWidth;
-    }
-    // Returns [upper curve, connector, lower curve]
-    segmentToPath(curve) {
-        const bezier = new bezier_js_1.Bezier(curve.startPoint.xy, curve.controlPoint.xy, curve.endPoint.xy);
-        let startVec = Vec2_1.Vec2.ofXY(bezier.normal(0)).normalized();
-        let endVec = Vec2_1.Vec2.ofXY(bezier.normal(1)).normalized();
-        startVec = startVec.times(curve.startWidth / 2);
-        endVec = endVec.times(curve.endWidth / 2);
-        if (!isFinite(startVec.magnitude())) {
-            console.error('Warning: startVec is NaN or ∞', startVec, endVec, curve);
-            startVec = endVec;
-        }
-        const startPt = curve.startPoint;
-        const endPt = curve.endPoint;
-        const controlPoint = curve.controlPoint;
-        // Approximate the normal at the location of the control point
-        let projectionT = bezier.project(controlPoint.xy).t;
-        if (!projectionT) {
-            if (startPt.minus(controlPoint).magnitudeSquared() < endPt.minus(controlPoint).magnitudeSquared()) {
-                projectionT = 0.1;
-            }
-            else {
-                projectionT = 0.9;
-            }
-        }
-        const halfVecT = projectionT;
-        const halfVec = Vec2_1.Vec2.ofXY(bezier.normal(halfVecT))
-            .normalized().times(curve.startWidth / 2 * halfVecT
-            + curve.endWidth / 2 * (1 - halfVecT));
-        // Each starts at startPt ± startVec
-        const lowerCurveStartPoint = this.roundPoint(startPt.plus(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 upperCurveEndPoint = this.roundPoint(startPt.minus(startVec));
-        const lowerCurveCommand = {
-            kind: Path_1.PathCommandType.QuadraticBezierTo,
-            controlPoint: lowerCurveControlPoint,
-            endPoint: lowerCurveEndPoint,
-        };
-        // From the end of the upperCurve to the start of the lowerCurve:
-        const upperToLowerConnector = {
-            kind: Path_1.PathCommandType.LineTo,
-            point: lowerCurveStartPoint,
-        };
-        // From the end of lowerCurve to the start of upperCurve:
-        const lowerToUpperConnector = {
-            kind: Path_1.PathCommandType.LineTo,
-            point: upperCurveStartPoint,
-        };
-        const upperCurveCommand = {
-            kind: Path_1.PathCommandType.QuadraticBezierTo,
-            controlPoint: upperCurveControlPoint,
-            endPoint: upperCurveEndPoint,
-        };
-        const upperCurve = new bezier_js_1.Bezier(upperCurveStartPoint, upperCurveControlPoint, upperCurveEndPoint);
-        const lowerCurve = new bezier_js_1.Bezier(lowerCurveStartPoint, lowerCurveControlPoint, lowerCurveEndPoint);
-        return {
-            upperCurveCommand, upperToLowerConnector, lowerToUpperConnector, lowerCurveCommand,
-            upperCurve, lowerCurve,
-        };
-    }
-    addPoint(newPoint) {
-        this.curveFitter.addPoint(newPoint);
-    }
-}
-exports.default = PressureSensitiveFreehandLineBuilder;

package/dist/cjs/src/components/builders/RectangleBuilder.d.ts

@@ -1,20 +0,0 @@
-import Rect2 from '../../math/Rect2';
-import AbstractRenderer from '../../rendering/renderers/AbstractRenderer';
-import { StrokeDataPoint } from '../../types';
-import Viewport from '../../Viewport';
-import AbstractComponent from '../AbstractComponent';
-import { ComponentBuilder, ComponentBuilderFactory } from './types';
-export declare const makeFilledRectangleBuilder: ComponentBuilderFactory;
-export declare const makeOutlinedRectangleBuilder: ComponentBuilderFactory;
-export default class RectangleBuilder implements ComponentBuilder {
-    private readonly startPoint;
-    private filled;
-    private viewport;
-    private endPoint;
-    constructor(startPoint: StrokeDataPoint, filled: boolean, viewport: Viewport);
-    getBBox(): Rect2;
-    private buildPreview;
-    build(): AbstractComponent;
-    preview(renderer: AbstractRenderer): void;
-    addPoint(point: StrokeDataPoint): void;
-}

package/dist/cjs/src/components/builders/RectangleBuilder.js

@@ -1,59 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.makeOutlinedRectangleBuilder = exports.makeFilledRectangleBuilder = void 0;
-const Mat33_1 = __importDefault(require("../../math/Mat33"));
-const Path_1 = __importDefault(require("../../math/Path"));
-const Rect2_1 = __importDefault(require("../../math/Rect2"));
-const Stroke_1 = __importDefault(require("../Stroke"));
-const makeFilledRectangleBuilder = (initialPoint, viewport) => {
-    return new RectangleBuilder(initialPoint, true, viewport);
-};
-exports.makeFilledRectangleBuilder = makeFilledRectangleBuilder;
-const makeOutlinedRectangleBuilder = (initialPoint, viewport) => {
-    return new RectangleBuilder(initialPoint, false, viewport);
-};
-exports.makeOutlinedRectangleBuilder = makeOutlinedRectangleBuilder;
-class RectangleBuilder {
-    constructor(startPoint, filled, viewport) {
-        this.startPoint = startPoint;
-        this.filled = filled;
-        this.viewport = viewport;
-        // Initially, the start and end points are the same.
-        this.endPoint = startPoint;
-    }
-    getBBox() {
-        const preview = this.buildPreview();
-        return preview.getBBox();
-    }
-    buildPreview() {
-        const canvasAngle = this.viewport.getRotationAngle();
-        const rotationMat = Mat33_1.default.zRotation(-canvasAngle);
-        // Adjust startPoint and endPoint such that applying [rotationMat] to them
-        // brings them to this.startPoint and this.endPoint.
-        const startPoint = rotationMat.inverse().transformVec2(this.startPoint.pos);
-        const endPoint = rotationMat.inverse().transformVec2(this.endPoint.pos);
-        const rect = Rect2_1.default.fromCorners(startPoint, endPoint);
-        const path = Path_1.default.fromRect(rect, this.filled ? null : this.endPoint.width).transformedBy(
-        // Rotate the canvas rectangle so that its rotation matches the screen
-        rotationMat).mapPoints(point => this.viewport.roundPoint(point));
-        const preview = new Stroke_1.default([
-            path.toRenderable({
-                fill: this.endPoint.color
-            }),
-        ]);
-        return preview;
-    }
-    build() {
-        return this.buildPreview();
-    }
-    preview(renderer) {
-        this.buildPreview().render(renderer);
-    }
-    addPoint(point) {
-        this.endPoint = point;
-    }
-}
-exports.default = RectangleBuilder;

package/dist/cjs/src/components/builders/types.d.ts

@@ -1,12 +0,0 @@
-import Rect2 from '../../math/Rect2';
-import AbstractRenderer from '../../rendering/renderers/AbstractRenderer';
-import { StrokeDataPoint } from '../../types';
-import Viewport from '../../Viewport';
-import AbstractComponent from '../AbstractComponent';
-export interface ComponentBuilder {
-    getBBox(): Rect2;
-    build(): AbstractComponent;
-    preview(renderer: AbstractRenderer): void;
-    addPoint(point: StrokeDataPoint): void;
-}
-export type ComponentBuilderFactory = (startPoint: StrokeDataPoint, viewport: Viewport) => ComponentBuilder;

package/dist/cjs/src/components/lib.d.ts

@@ -1,13 +0,0 @@
-export * from './builders/types';
-export { makeFreehandLineBuilder } from './builders/FreehandLineBuilder';
-export { makePressureSensitiveFreehandLineBuilder } from './builders/PressureSensitiveFreehandLineBuilder';
-export { default as StrokeSmoother, Curve as StrokeSmootherCurve } from './util/StrokeSmoother';
-export * from './AbstractComponent';
-export { default as AbstractComponent } from './AbstractComponent';
-import Stroke from './Stroke';
-import TextComponent from './TextComponent';
-import ImageComponent from './ImageComponent';
-import RestyleableComponent from './RestylableComponent';
-import { createRestyleComponentCommand, isRestylableComponent, ComponentStyle as RestyleableComponentStyle } from './RestylableComponent';
-import BackgroundComponent from './BackgroundComponent';
-export { Stroke, RestyleableComponent, createRestyleComponentCommand, isRestylableComponent, RestyleableComponentStyle, TextComponent, TextComponent as Text, Stroke as StrokeComponent, BackgroundComponent, ImageComponent, };

package/dist/cjs/src/components/lib.js

@@ -1,43 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ImageComponent = exports.BackgroundComponent = exports.StrokeComponent = exports.Text = exports.TextComponent = exports.isRestylableComponent = exports.createRestyleComponentCommand = exports.Stroke = exports.AbstractComponent = exports.StrokeSmoother = exports.makePressureSensitiveFreehandLineBuilder = exports.makeFreehandLineBuilder = void 0;
-__exportStar(require("./builders/types"), exports);
-var FreehandLineBuilder_1 = require("./builders/FreehandLineBuilder");
-Object.defineProperty(exports, "makeFreehandLineBuilder", { enumerable: true, get: function () { return FreehandLineBuilder_1.makeFreehandLineBuilder; } });
-var PressureSensitiveFreehandLineBuilder_1 = require("./builders/PressureSensitiveFreehandLineBuilder");
-Object.defineProperty(exports, "makePressureSensitiveFreehandLineBuilder", { enumerable: true, get: function () { return PressureSensitiveFreehandLineBuilder_1.makePressureSensitiveFreehandLineBuilder; } });
-var StrokeSmoother_1 = require("./util/StrokeSmoother");
-Object.defineProperty(exports, "StrokeSmoother", { enumerable: true, get: function () { return __importDefault(StrokeSmoother_1).default; } });
-__exportStar(require("./AbstractComponent"), exports);
-var AbstractComponent_1 = require("./AbstractComponent");
-Object.defineProperty(exports, "AbstractComponent", { enumerable: true, get: function () { return __importDefault(AbstractComponent_1).default; } });
-const Stroke_1 = __importDefault(require("./Stroke"));
-exports.Stroke = Stroke_1.default;
-exports.StrokeComponent = Stroke_1.default;
-const TextComponent_1 = __importDefault(require("./TextComponent"));
-exports.TextComponent = TextComponent_1.default;
-exports.Text = TextComponent_1.default;
-const ImageComponent_1 = __importDefault(require("./ImageComponent"));
-exports.ImageComponent = ImageComponent_1.default;
-const RestylableComponent_1 = require("./RestylableComponent");
-Object.defineProperty(exports, "createRestyleComponentCommand", { enumerable: true, get: function () { return RestylableComponent_1.createRestyleComponentCommand; } });
-Object.defineProperty(exports, "isRestylableComponent", { enumerable: true, get: function () { return RestylableComponent_1.isRestylableComponent; } });
-const BackgroundComponent_1 = __importDefault(require("./BackgroundComponent"));
-exports.BackgroundComponent = BackgroundComponent_1.default;

package/dist/cjs/src/components/localization.js

@@ -1,14 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.defaultComponentLocalization = void 0;
-exports.defaultComponentLocalization = {
-    unlabeledImageNode: 'Unlabeled image node',
-    stroke: 'Stroke',
-    svgObject: 'SVG Object',
-    emptyBackground: 'Empty background',
-    gridBackground: 'Grid background',
-    filledBackgroundWithColor: (color) => `Filled background (${color})`,
-    text: (text) => `Text object: ${text}`,
-    imageNode: (description) => `Image: ${description}`,
-    restyledElement: (elementDescription) => `Restyled ${elementDescription}`,
-};

package/dist/cjs/src/components/util/StrokeSmoother.d.ts

@@ -1,35 +0,0 @@
-import { Vec2 } from '../../math/Vec2';
-import Rect2 from '../../math/Rect2';
-import { StrokeDataPoint } from '../../types';
-export interface Curve {
-    startPoint: Vec2;
-    startWidth: number;
-    controlPoint: Vec2;
-    endWidth: number;
-    endPoint: Vec2;
-}
-type OnCurveAddedCallback = (curve: Curve | null) => void;
-export declare class StrokeSmoother {
-    private startPoint;
-    private minFitAllowed;
-    private maxFitAllowed;
-    private onCurveAdded;
-    private isFirstSegment;
-    private buffer;
-    private lastPoint;
-    private lastExitingVec;
-    private currentCurve;
-    private curveStartWidth;
-    private curveEndWidth;
-    private momentum;
-    private bbox;
-    constructor(startPoint: StrokeDataPoint, minFitAllowed: number, maxFitAllowed: number, onCurveAdded: OnCurveAddedCallback);
-    getBBox(): Rect2;
-    preview(): Curve | null;
-    private approxCurrentCurveLength;
-    finalizeCurrentCurve(): void;
-    private currentSegmentToPath;
-    private computeExitingVec;
-    addPoint(newPoint: StrokeDataPoint): void;
-}
-export default StrokeSmoother;