nzk-react-components 0.4.5 → 0.4.6

package/dist/components/DrawingTool/components/OpacityToggle/OpacityToggle.js

@@ -1,31 +0,0 @@
-'use strict';
-
-var React = require('react');
-var ReactTooltip = require('react-tooltip');
-var Icon = require('../../../Icon/Icon.js');
-var OpacityToggle_styles = require('./OpacityToggle.styles.js');
-var DrawingToolProvider = require('../../DrawingToolProvider.js');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var ReactTooltip__default = /*#__PURE__*/_interopDefaultLegacy(ReactTooltip);
-
-var OpacityToggle = (function (props) {
-    var _a = DrawingToolProvider.useDrawingTool(), brushOpacity = _a.brushOpacity, setBruchOpacity = _a.setBruchOpacity, currentColour = _a.currentColour;
-    var toggleOpacity = function () {
-        setBruchOpacity(brushOpacity === 1 ? 0.5 : 1);
-    };
-    return React__default['default'].createElement("div", null,
-        React__default['default'].createElement(ReactTooltip__default['default'], { effect: "solid", delayShow: 750, multiline: true }),
-        React__default['default'].createElement(OpacityToggle_styles.Container, { "data-tip": brushOpacity === 0.5
-                ? 'Switch OFF color mixer'
-                : 'Switch ON color mixer', orientation: props.orientation, buttonSize: Math.floor(props.buttonSize * .8), onClick: toggleOpacity },
-            React__default['default'].createElement(OpacityToggle_styles.OpacityButton, { orientation: props.orientation, buttonSize: Math.floor(props.buttonSize * .9) },
-                React__default['default'].createElement(Icon, { fill: brushOpacity === 1 ? '#7A7A79' : currentColour.hex, name: 'drawing-tool-opacity-half' })),
-            React__default['default'].createElement(OpacityToggle_styles.OpacityButton, { orientation: props.orientation, buttonSize: Math.floor(props.buttonSize * .9) },
-                React__default['default'].createElement(Icon, { fill: brushOpacity < 1 ? '#7A7A79' : currentColour.hex, name: 'drawing-tool-opacity-full' }))));
-});
-
-module.exports = OpacityToggle;
-//# sourceMappingURL=OpacityToggle.js.map

package/dist/components/DrawingTool/components/OpacityToggle/OpacityToggle.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"OpacityToggle.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/DrawingTool/components/OpacityToggle/OpacityToggle.styles.d.ts

@@ -1,9 +0,0 @@
-import { Orientation } from '../../DrawingTool';
-export declare const Container: import("styled-components").StyledComponent<"div", any, {
-    orientation: Orientation;
-    buttonSize: number;
-}, never>;
-export declare const OpacityButton: import("styled-components").StyledComponent<"div", any, {
-    orientation: Orientation;
-    buttonSize: number;
-}, never>;

package/dist/components/DrawingTool/components/OpacityToggle/OpacityToggle.styles.js

@@ -1,18 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var tslib = require('tslib');
-var styled = require('styled-components');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-var Container = styled__default['default'].div(templateObject_1 || (templateObject_1 = tslib.__makeTemplateObject(["\n  custor: pointer;\n  background-color: #ebebeb;\n  border: 6px solid #d9d9d9;\n  box-shadow: 0px 4px 0px rgba(0,0,0, .5);\n  border-radius: ", "px;\n  width: ", ";\n  padding-bottom: ", ";\n  padding-right: ", ";\n  display: flex;\n  flex-shrink: none;\n  flex-wrap: ", ";\n  justify-content: center;\n  align-items: center;\n  position: relative;\n  > div {\n    transform: scale(1.2);\n    &:first-child {\n      position: relative;\n      top: ", ";\n      left: ", ";\n    }\n  }\n"], ["\n  custor: pointer;\n  background-color: #ebebeb;\n  border: 6px solid #d9d9d9;\n  box-shadow: 0px 4px 0px rgba(0,0,0, .5);\n  border-radius: ", "px;\n  width: ", ";\n  padding-bottom: ", ";\n  padding-right: ", ";\n  display: flex;\n  flex-shrink: none;\n  flex-wrap: ", ";\n  justify-content: center;\n  align-items: center;\n  position: relative;\n  > div {\n    transform: scale(1.2);\n    &:first-child {\n      position: relative;\n      top: ", ";\n      left: ", ";\n    }\n  }\n"])), function (props) { return props.buttonSize; }, function (props) { return props.orientation === 'LANDSCAPE' ? props.buttonSize + props.buttonSize * 0.2 + "px" : 'auto'; }, function (props) { return props.orientation === 'LANDSCAPE' ? '4px' : '0px'; }, function (props) { return props.orientation === 'LANDSCAPE' ? '0px' : '4px'; }, function (props) { return props.orientation === 'LANDSCAPE' ? 'wrap' : 'no-wrap'; }, function (props) { return props.orientation === 'LANDSCAPE' ? '4px' : '0px'; }, function (props) { return props.orientation === 'PORTRAIT' ? '4px' : '0px'; });
-var OpacityButton = styled__default['default'].div(templateObject_2 || (templateObject_2 = tslib.__makeTemplateObject(["\n  width: ", "px;\n  height: ", "px;\n  cursor: pointer;\n"], ["\n  width: ", "px;\n  height: ", "px;\n  cursor: pointer;\n"])), function (props) { return props.buttonSize; }, function (props) { return props.buttonSize; });
-var templateObject_1, templateObject_2;
-
-exports.Container = Container;
-exports.OpacityButton = OpacityButton;
-//# sourceMappingURL=OpacityToggle.styles.js.map

package/dist/components/DrawingTool/components/OpacityToggle/OpacityToggle.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"OpacityToggle.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;"}

package/dist/components/DrawingTool/components/OpacityToggle/index.d.ts

@@ -1,2 +0,0 @@
-import OpacityToggle from "./OpacityToggle";
-export default OpacityToggle;

package/dist/components/DrawingTool/components/OpacityToggle/index.js

@@ -1,8 +0,0 @@
-'use strict';
-
-var OpacityToggle = require('./OpacityToggle.js');
-
-
-
-module.exports = OpacityToggle;
-//# sourceMappingURL=index.js.map

package/dist/components/DrawingTool/components/OpacityToggle/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist/components/DrawingTool/components/Placeable/index.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-import { MoveableManagerInterface, Renderer } from "react-moveable";
-declare const _default: {
-    readonly name: "placeable";
-    readonly props: {};
-    readonly events: {};
-    readonly render: (moveable: MoveableManagerInterface<any, any>, React: Renderer) => JSX.Element;
-};
-export default _default;

package/dist/components/DrawingTool/components/Placeable/index.js

@@ -1,22 +0,0 @@
-'use strict';
-
-var Icon = require('../../../Icon/Icon.js');
-
-var Placeable = {
-    name: "placeable",
-    props: {},
-    events: {},
-    render: function (moveable, React) {
-        var rect = moveable.getRect();
-        var _a = moveable.state, pos1 = _a.pos1, pos2 = _a.pos2;
-        var Placeable = moveable.useCSS("div", "\n        {\n            position: absolute;\n            left: 0px;\n            top: 0px;\n            will-change: transform;\n            transform-origin: 0px 0px;\n            pointer-events: none;\n        }\n        .placeable-icon {\n            width: 24px;\n            height: 24px;\n            background: #4af;\n            border-radius: 100%;\n        }\n        ");
-        return React.createElement(Placeable, { key: "placeable", className: "moveable-placeable", style: {
-                transform: "translate(" + (pos2[0] - (pos2[0] - pos1[0]) / 2) + "px, " + (pos2[1] - (pos2[1] - pos1[1]) / 2) + "px) rotate(" + rect.rotation + "deg) translateY(-54px) translateX(-12px)",
-            } },
-            React.createElement("div", { className: 'placeable-icon' },
-                React.createElement(Icon, { name: 'refresh' })));
-    }
-};
-
-module.exports = Placeable;
-//# sourceMappingURL=index.js.map

package/dist/components/DrawingTool/components/Placeable/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/DrawingTool/index.d.ts

@@ -1,2 +0,0 @@
-import DrawingTool from "./DrawingTool";
-export default DrawingTool;

package/dist/components/DrawingTool/lib/Sketch.d.ts

@@ -1,90 +0,0 @@
-import SketchLayer from './SketchLayer';
-import { Point } from './createInteractionSurface';
-import SketchModel, { SketchAction, SketchActionMergeData, SketchModelData } from './SketchModel';
-export interface SketchProps {
-    containerEl: HTMLDivElement;
-    template?: string;
-    onChange?: Function;
-    sketchData?: SketchModelData;
-    onReady?: Function;
-}
-interface ExportProps {
-    crop?: boolean;
-}
-export default class Sketch {
-    readonly containerEl: HTMLDivElement;
-    readonly width: number;
-    readonly height: number;
-    readonly naturalWidth: number;
-    readonly naturalHeight: number;
-    readonly pixelRatioScale: number;
-    readonly model: SketchModel;
-    readonly drawingLayer: SketchLayer;
-    readonly bufferLayer: SketchLayer;
-    readonly cacheLayer: SketchLayer;
-    readonly templateLayer?: SketchLayer;
-    template?: string;
-    interactionSurface: HTMLDivElement;
-    isDrawing: boolean;
-    onChange?: Function;
-    sketchData?: SketchModelData;
-    drawUndo?: any;
-    drawFinished?: any;
-    drawAnimation?: any;
-    reqStroke?: any;
-    constructor(props: SketchProps);
-    setBrush({ colour, size, opacity, fill, eraser }: {
-        colour: any;
-        size: any;
-        opacity: any;
-        fill: any;
-        eraser: any;
-    }): void;
-    mergeImage(data: SketchActionMergeData, saveAction?: boolean, callback?: () => void): void;
-    export(props?: ExportProps): any;
-    undo(): void;
-    redo(): void;
-    canUndo(): boolean;
-    canRedo(): boolean;
-    restart(): void;
-    serialize(): {
-        colour: number[];
-        opacity: number;
-        size: number;
-        lastActionIndex: number;
-        actions: SketchAction[];
-        currentStroke: import("./SketchStrokeModel").SketchStrokeModelData | null;
-    };
-    deserialize(serialized: any): void;
-    getNumberOfActions(): number;
-    initDrawAnimations(): void;
-    startDraw(point: Point): void;
-    continueDraw(point: Point): boolean;
-    endDraw(): void;
-    drawExistingSketch(callback?: Function): void;
-    drawAction(action: SketchAction, callback?: () => void): void;
-    strokeAnimation(): void;
-    drawAnimationStroke(stroke: any): void;
-    endStrokeAnimation(): void;
-    drawUndoStroke(stroke: any): void;
-    drawFinishedStroke(stroke: any): void;
-    drawExistingStroke(stroke: any): void;
-    drawTransparentFillFinal(stroke: any): void;
-    drawStrokeFinal(stroke: any): void;
-    drawFillFinal(stroke: any): void;
-    drawFillAndStroke(stroke: any): void;
-    drawEraserUndoingFinal(stroke: any): void;
-    drawEraserUndoingFillFinal(stroke: any): void;
-    drawEraser(stroke: any, copy?: boolean): void;
-    drawEraserFillFinal(stroke: any, copy?: boolean): void;
-    findBoundingBox(ctx: any): {
-        topLeftX: number;
-        topLeftY: number;
-        bottomRightX: number;
-        bottomRightY: number;
-        width: number;
-        height: number;
-    };
-    getLayerToExport(): SketchLayer;
-}
-export {};

package/dist/components/DrawingTool/lib/Sketch.js

@@ -1,414 +0,0 @@
-'use strict';
-
-var tslib = require('tslib');
-var after = require('lodash.after');
-var SketchLayer = require('./SketchLayer.js');
-var createInteractionSurface = require('./createInteractionSurface.js');
-var SketchModel = require('./SketchModel.js');
-var trace = require('./trace.js');
-var trimCanvas = require('./trimCanvas.js');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var after__default = /*#__PURE__*/_interopDefaultLegacy(after);
-
-var setDrawingStyle = function (style, ctx) {
-    if (style) {
-        var colour = "rgba(" + style.colour[0] + ", " + style.colour[1] + ", " + style.colour[2] + ", " + style.opacity + ")";
-        ctx.strokeStyle = colour;
-        ctx.fillStyle = colour;
-        ctx.lineWidth = style.size;
-    }
-    ctx.lineJoin = "round";
-    ctx.lineCap = "round";
-};
-var Sketch = (function () {
-    function Sketch(props) {
-        this.isDrawing = false;
-        this.containerEl = props.containerEl;
-        this.naturalWidth = props.containerEl.offsetWidth;
-        this.naturalHeight = props.containerEl.offsetHeight;
-        this.pixelRatioScale = window.devicePixelRatio > 1.5 ? 2 : 1;
-        this.width = this.naturalWidth * this.pixelRatioScale;
-        this.height = this.naturalHeight * this.pixelRatioScale;
-        this.template = props.template;
-        this.model = new SketchModel({
-            pixelRatioScale: this.pixelRatioScale
-        });
-        var defaultLayerProps = {
-            pixelRatioScale: this.pixelRatioScale,
-            width: props.containerEl.offsetWidth,
-            height: props.containerEl.offsetHeight
-        };
-        if (this.template) {
-            this.templateLayer = new SketchLayer(defaultLayerProps);
-            this.templateLayer.drawImageToFill(this.template);
-            this.containerEl.appendChild(this.templateLayer.canvas);
-        }
-        this.drawingLayer = new SketchLayer(defaultLayerProps);
-        this.drawingLayer.canvas.style.zIndex = '1';
-        this.containerEl.appendChild(this.drawingLayer.canvas);
-        this.bufferLayer = new SketchLayer(defaultLayerProps);
-        this.bufferLayer.canvas.style.zIndex = '2';
-        this.containerEl.appendChild(this.bufferLayer.canvas);
-        this.cacheLayer = new SketchLayer(defaultLayerProps);
-        this.cacheLayer.hide();
-        this.containerEl.appendChild(this.cacheLayer.canvas);
-        this.interactionSurface = createInteractionSurface({
-            width: this.containerEl.offsetWidth,
-            height: this.containerEl.offsetHeight,
-            scale: this.pixelRatioScale,
-            onTouchStart: this.startDraw.bind(this),
-            onTouchMove: this.continueDraw.bind(this),
-            onTouchEnd: this.endDraw.bind(this),
-            onTouchLeave: this.endDraw.bind(this),
-            onTouchEnter: this.startDraw.bind(this)
-        });
-        this.interactionSurface.style.zIndex = '100';
-        this.containerEl.appendChild(this.interactionSurface);
-        this.initDrawAnimations();
-        if (this.bufferLayer.ctx) {
-            setDrawingStyle(this.model.getStyle(), this.bufferLayer.ctx);
-        }
-        if (props.onChange)
-            this.onChange = props.onChange;
-        if (props.sketchData) {
-            this.deserialize(props.sketchData);
-            this.drawExistingSketch(props.onReady);
-        }
-        else if (props.onReady) {
-            props.onReady();
-        }
-    }
-    Sketch.prototype.setBrush = function (_a) {
-        var colour = _a.colour, size = _a.size, opacity = _a.opacity, fill = _a.fill, eraser = _a.eraser;
-        if (colour !== undefined) {
-            this.model.colour = colour;
-        }
-        if (size !== undefined) {
-            this.model.size = size;
-        }
-        if (opacity !== undefined) {
-            this.model.opacity = opacity;
-        }
-        if (fill !== undefined) {
-            this.model.fill = fill;
-        }
-        if (eraser !== undefined) {
-            this.model.eraser = eraser;
-        }
-    };
-    Sketch.prototype.mergeImage = function (data, saveAction, callback) {
-        var _this = this;
-        if (saveAction === void 0) { saveAction = true; }
-        if (callback === void 0) { callback = function () { }; }
-        var doMerge = function (img) {
-            var scale = (data.width / img.width) * _this.pixelRatioScale;
-            _this.drawingLayer.ctx.globalCompositeOperation = "source-over";
-            _this.drawingLayer.ctx.save();
-            _this.drawingLayer.ctx.translate(data.origin[0] * _this.pixelRatioScale, data.origin[1] * _this.pixelRatioScale);
-            _this.drawingLayer.ctx.rotate(data.rotation * Math.PI / 180);
-            _this.drawingLayer.ctx.translate(-data.x - img.width * scale / 2, -data.y - img.height * scale / 2);
-            _this.drawingLayer.ctx.drawImage(img, data.x, data.y, img.width * scale, img.height * scale);
-            _this.drawingLayer.ctx.restore();
-            if (saveAction) {
-                _this.model.saveMergeImage(data);
-                if (_this.onChange) {
-                    _this.onChange();
-                }
-            }
-            callback();
-        };
-        if (data.image) {
-            doMerge(data.image);
-        }
-        else if (data.imageSrc) {
-            var img_1 = new Image;
-            img_1.onload = function () { doMerge(img_1); };
-            img_1.src = data.imageSrc;
-        }
-    };
-    Sketch.prototype.export = function (props) {
-        if (this.templateLayer) {
-            this.templateLayer.drawImageToFit(this.drawingLayer.canvas);
-        }
-        var layerToExport = this.getLayerToExport();
-        var exportCanvas = (props && props.crop) ? trimCanvas(layerToExport.canvas) : layerToExport.canvas;
-        return exportCanvas.toDataURL();
-    };
-    Sketch.prototype.undo = function () {
-        if (!this.model.canUndo())
-            return;
-        this.model.lastActionIndex -= 1;
-        this.drawingLayer.clear();
-        console.log('Last action Index before undo', this.model.lastActionIndex);
-        for (var i = 0; i <= this.model.lastActionIndex; i += 1) {
-            console.log('I=', i);
-            if (this.model.actions[i].type === 'STROKE' && this.model.actions[i].model) {
-                console.log('draw stroke');
-                this.drawUndoStroke(this.model.actions[i].model);
-            }
-            else if (this.model.actions[i].type === 'IMAGE_MERGE' && this.model.actions[i]) {
-                console.log('merge image');
-                this.mergeImage(this.model.actions[i].data, false);
-            }
-        }
-        if (this.onChange)
-            this.onChange();
-    };
-    Sketch.prototype.redo = function () {
-        if (!this.model.canRedo())
-            return;
-        this.model.lastActionIndex += 1;
-        var action = this.model.actions[this.model.lastActionIndex];
-        if (action.type === 'STROKE' && action.model) {
-            this.drawUndoStroke(action.model);
-        }
-        else if (action.type === 'IMAGE_MERGE' && action.data) {
-            this.mergeImage(action.data, false);
-        }
-        if (this.onChange)
-            this.onChange();
-    };
-    Sketch.prototype.canUndo = function () {
-        return this.model.canUndo();
-    };
-    Sketch.prototype.canRedo = function () {
-        return this.model.canRedo();
-    };
-    Sketch.prototype.restart = function () {
-        this.model.reset();
-        this.drawingLayer.clear();
-        if (this.onChange) {
-            this.onChange();
-        }
-    };
-    Sketch.prototype.serialize = function () {
-        return this.model.serialize();
-    };
-    Sketch.prototype.deserialize = function (serialized) {
-        this.model.deserialize(serialized);
-    };
-    Sketch.prototype.getNumberOfActions = function () {
-        return this.model.lastActionIndex + 1;
-    };
-    Sketch.prototype.initDrawAnimations = function () {
-        this.drawUndo = {
-            transparentEraserFill: this.drawTransparentFillFinal,
-            transparentEraserStroke: this.drawStrokeFinal,
-            transparentColourFill: this.drawTransparentFillFinal,
-            transparentColourStroke: this.drawStrokeFinal,
-            opaqueEraserFill: this.drawEraserUndoingFillFinal,
-            opaqueEraserStroke: this.drawEraserUndoingFinal,
-            opaqueColourFill: this.drawFillFinal,
-            opaqueColourStroke: this.drawStrokeFinal
-        };
-        this.drawFinished = {
-            transparentEraserFill: this.drawTransparentFillFinal,
-            transparentEraserStroke: this.drawStrokeFinal,
-            transparentColourFill: this.drawTransparentFillFinal,
-            transparentColourStroke: this.drawStrokeFinal,
-            opaqueEraserFill: this.drawEraserFillFinal,
-            opaqueEraserStroke: this.drawEraser,
-            opaqueColourFill: this.drawFillFinal,
-            opaqueColourStroke: this.drawStrokeFinal
-        };
-        this.drawAnimation = {
-            transparentEraserFill: this.drawFillAndStroke,
-            transparentEraserStroke: this.drawFillAndStroke,
-            transparentColourFill: this.drawFillAndStroke,
-            transparentColourStroke: this.drawFillAndStroke,
-            opaqueEraserFill: this.drawEraser,
-            opaqueEraserStroke: this.drawEraser,
-            opaqueColourFill: this.drawFillAndStroke,
-            opaqueColourStroke: this.drawFillAndStroke
-        };
-    };
-    Sketch.prototype.startDraw = function (point) {
-        this.isDrawing = true;
-        this.model.initStroke(point);
-        if (this.model.currentStroke && this.model.currentStroke.style && this.cacheLayer.ctx && this.drawingLayer.ctx) {
-            if (this.model.currentStroke.style.eraser && this.model.currentStroke.style.opacity === 1.0) {
-                this.cacheLayer.ctx.globalCompositeOperation = "copy";
-                this.cacheLayer.ctx.drawImage(this.drawingLayer.ctx.canvas, 0, 0, this.width, this.height);
-                setDrawingStyle(this.model.currentStroke.style, this.drawingLayer.ctx);
-            }
-        }
-        if (this.model.currentStroke && this.bufferLayer.ctx) {
-            setDrawingStyle(this.model.currentStroke.style, this.bufferLayer.ctx);
-        }
-        this.strokeAnimation();
-    };
-    Sketch.prototype.continueDraw = function (point) {
-        if (!this.isDrawing)
-            return false;
-        this.model.continueStroke(point);
-        return false;
-    };
-    Sketch.prototype.endDraw = function () {
-        if (!(this.model.currentStroke && this.model.currentStroke.style))
-            return;
-        this.isDrawing = false;
-        this.endStrokeAnimation();
-        this.bufferLayer.clear();
-        this.drawFinishedStroke(this.model.currentStroke);
-        this.model.saveStroke();
-        if (this.onChange) {
-            this.onChange();
-        }
-    };
-    Sketch.prototype.drawExistingSketch = function (callback) {
-        if (this.model.lastActionIndex === -1) {
-            if (callback)
-                callback();
-            return;
-        }
-        var done = after__default['default'](Math.min(this.model.lastActionIndex, this.model.actions.length), function () {
-            if (callback)
-                callback();
-        });
-        for (var i = 0; i <= this.model.lastActionIndex; i += 1) {
-            this.drawAction(this.model.actions[i], done);
-        }
-    };
-    Sketch.prototype.drawAction = function (action, callback) {
-        if (callback === void 0) { callback = function () { }; }
-        if (action.type === 'STROKE' && action.model) {
-            this.drawExistingStroke(action.model);
-            callback();
-        }
-        else if (action.type === 'IMAGE_MERGE') {
-            this.mergeImage(action.data, false, callback);
-        }
-    };
-    Sketch.prototype.strokeAnimation = function () {
-        var _this = this;
-        this.drawAnimationStroke(this.model.currentStroke);
-        this.reqStroke = window.requestAnimationFrame(function () { return _this.strokeAnimation.apply(_this); });
-    };
-    Sketch.prototype.drawAnimationStroke = function (stroke) {
-        this.drawAnimation[stroke.style.type].apply(this, [stroke]);
-    };
-    Sketch.prototype.endStrokeAnimation = function () {
-        window.cancelAnimationFrame(this.reqStroke);
-        this.reqStroke = 0;
-    };
-    Sketch.prototype.drawUndoStroke = function (stroke) {
-        setDrawingStyle(stroke.style, this.drawingLayer.ctx);
-        this.drawUndo[stroke.style.type].apply(this, [stroke]);
-    };
-    Sketch.prototype.drawFinishedStroke = function (stroke) {
-        setDrawingStyle(stroke.style, this.drawingLayer.ctx);
-        this.drawFinished[stroke.style.type].apply(this, [stroke]);
-    };
-    Sketch.prototype.drawExistingStroke = function (stroke) {
-        setDrawingStyle(stroke.style, this.drawingLayer.ctx);
-        this.drawFinished[stroke.style.type].apply(this, [stroke, false]);
-    };
-    Sketch.prototype.drawTransparentFillFinal = function (stroke) {
-        this.cacheLayer.clear();
-        this.cacheLayer.ctx.globalCompositeOperation = "source-over";
-        setDrawingStyle(tslib.__assign(tslib.__assign({}, stroke.style), { opacity: 1 }), this.cacheLayer.ctx);
-        trace(stroke, this.cacheLayer.ctx);
-        this.cacheLayer.ctx.closePath();
-        this.cacheLayer.ctx.stroke();
-        this.cacheLayer.ctx.fill();
-        this.drawingLayer.ctx.globalCompositeOperation = "source-over";
-        this.drawingLayer.ctx.globalAlpha = stroke.style.opacity;
-        this.drawingLayer.ctx.drawImage(this.cacheLayer.ctx.canvas, 0, 0, this.width, this.height);
-        this.drawingLayer.ctx.globalAlpha = 1.0;
-    };
-    Sketch.prototype.drawStrokeFinal = function (stroke) {
-        this.drawingLayer.ctx.globalCompositeOperation = "source-over";
-        trace(stroke, this.drawingLayer.ctx);
-        this.drawingLayer.ctx.stroke();
-    };
-    Sketch.prototype.drawFillFinal = function (stroke) {
-        this.drawingLayer.ctx.globalCompositeOperation = "source-over";
-        trace(stroke, this.drawingLayer.ctx);
-        this.drawingLayer.ctx.closePath();
-        this.drawingLayer.ctx.fill();
-        this.drawingLayer.ctx.stroke();
-    };
-    Sketch.prototype.drawFillAndStroke = function (stroke) {
-        this.bufferLayer.clear();
-        trace(stroke, this.bufferLayer.ctx);
-        setDrawingStyle(tslib.__assign(tslib.__assign({}, stroke.style), { opacity: 1 }), this.bufferLayer.ctx);
-        this.bufferLayer.ctx.globalAlpha = stroke.style.opacity;
-        if (this.model.fill) {
-            this.bufferLayer.ctx.closePath();
-            this.bufferLayer.ctx.fill();
-        }
-        this.bufferLayer.ctx.stroke();
-    };
-    Sketch.prototype.drawEraserUndoingFinal = function (stroke) {
-        this.drawingLayer.ctx.globalCompositeOperation = "destination-out";
-        trace(stroke, this.drawingLayer.ctx);
-        this.drawingLayer.ctx.stroke();
-    };
-    Sketch.prototype.drawEraserUndoingFillFinal = function (stroke) {
-        this.drawingLayer.ctx.globalCompositeOperation = "destination-out";
-        trace(stroke, this.drawingLayer.ctx);
-        this.drawingLayer.ctx.closePath();
-        this.drawingLayer.ctx.fill();
-        this.drawingLayer.ctx.stroke();
-    };
-    Sketch.prototype.drawEraser = function (stroke, copy) {
-        if (copy === void 0) { copy = true; }
-        if (copy) {
-            this.drawingLayer.ctx.globalCompositeOperation = "copy";
-            this.drawingLayer.ctx.drawImage(this.cacheLayer.ctx.canvas, 0, 0, this.width, this.height);
-        }
-        this.drawingLayer.ctx.globalCompositeOperation = "destination-out";
-        trace(stroke, this.drawingLayer.ctx);
-        this.drawingLayer.ctx.stroke();
-    };
-    Sketch.prototype.drawEraserFillFinal = function (stroke, copy) {
-        if (copy === void 0) { copy = true; }
-        if (copy) {
-            this.drawingLayer.ctx.globalCompositeOperation = "copy";
-            this.drawingLayer.ctx.drawImage(this.cacheLayer.ctx.canvas, 0, 0, this.width, this.height);
-        }
-        this.drawingLayer.ctx.globalCompositeOperation = "destination-out";
-        trace(stroke, this.drawingLayer.ctx);
-        this.drawingLayer.ctx.closePath();
-        this.drawingLayer.ctx.fill();
-        this.drawingLayer.ctx.stroke();
-    };
-    Sketch.prototype.findBoundingBox = function (ctx) {
-        var imageData = ctx.getImageData(0, 0, this.width, this.height);
-        var box = {
-            topLeftX: this.width,
-            topLeftY: this.height,
-            bottomRightX: 0,
-            bottomRightY: 0,
-            width: 0,
-            height: 0
-        };
-        for (var x = 0; x < this.width; x += 1) {
-            for (var y = 0; y < this.height; y += 1) {
-                var pixelPosition = (((y * this.width) + x) * 4) + 3;
-                if (imageData.data[pixelPosition] > 0) {
-                    if (x < box.topLeftX)
-                        box.topLeftX = x;
-                    if (y < box.topLeftY)
-                        box.topLeftY = y;
-                    if (x > box.bottomRightX)
-                        box.bottomRightX = x;
-                    if (y > box.bottomRightY)
-                        box.bottomRightY = y;
-                }
-            }
-        }
-        box.width = box.bottomRightX - box.topLeftX;
-        box.height = box.bottomRightY - box.topLeftY;
-        return box;
-    };
-    Sketch.prototype.getLayerToExport = function () {
-        return this.templateLayer || this.drawingLayer;
-    };
-    return Sketch;
-}());
-
-module.exports = Sketch;
-//# sourceMappingURL=Sketch.js.map

package/dist/components/DrawingTool/lib/Sketch.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Sketch.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/DrawingTool/lib/SketchCut.d.ts

@@ -1,22 +0,0 @@
-import Sketch, { SketchProps } from "./Sketch";
-import SketchCutModel from "./SketchCutModel";
-import SketchLayer from "./SketchLayer";
-import SketchStrokeModel from "./SketchStrokeModel";
-export interface SketchCutProps extends SketchProps {
-    imageToCut: HTMLImageElement;
-    onImageCut?: () => void;
-}
-export default class SketchCut extends Sketch {
-    readonly model: SketchCutModel;
-    readonly imageToCut: HTMLImageElement;
-    cutLayer: SketchLayer;
-    uiLayer: SketchLayer;
-    onImageCut?: () => void;
-    constructor(props: SketchCutProps);
-    initDrawAnimations(): void;
-    drawCutStroke(stroke: any): void;
-    drawCutFinal(stroke: any): void;
-    resetCut(): void;
-    drawOutline(stroke: SketchStrokeModel): void;
-    getLayerToExport(): SketchLayer;
-}