@leapfrog/interactive-canvas 0.1.0 → 1.0.0

package/dist/object/impl/vertical-rule.d.ts

@@ -1,89 +1,88 @@
-import { Observable } from "rxjs";
-import { ICanvasObject } from "../canvas-object.interface";
-import { IMutableColor, IMutablePosition } from "../..";
-import { AbstractCanvasObject } from "../abstract-canvas-object";
-import { CanvasObjectData } from "../canvas-object-data";
-import { InteractiveCanvas } from "../../interactive-canvas.impl";
-import { fabric } from "fabric";
-/**
- * Vertical rule. A basic block of color that spans the canvas/row height.
- */
-export interface IVerticalRule extends ICanvasObject, IMutableColor, IMutablePosition {
-    /**
-     * Get the width of the rule.
-     */
-    getStrokeWidth(): number;
-    /**
-     * Get an observable of the width of the rule.
-     */
-    getStrokeWidth$(): Observable<number>;
-    /**
-     * Set the rule width.
-     * @param width New width.
-     */
-    setStrokeWidth(width: number): void;
-}
-export declare class VerticalRule extends AbstractCanvasObject<fabric.Rect> implements IVerticalRule {
-    private readonly strokeWidth$;
-    constructor(canvas: InteractiveCanvas, fabricObject: fabric.Rect, persistedField?: CanvasObjectData);
-    /**
-     * @override
-     * @inheritDoc
-     */
-    getStrokeWidth(): number;
-    /**
-     * @override
-     * @inheritDoc
-     */
-    getStrokeWidth$(): Observable<number>;
-    /**
-     * @override
-     * @inheritDoc
-     */
-    setStrokeWidth(width: number): void;
-    /**
-     * @override
-     * @inheritDoc
-     */
-    getColor(): string;
-    /**
-     * @override
-     * @inheritDoc
-     */
-    setColor(color: string): void;
-    /**
-     * @override
-     * @inheritDoc
-     */
-    centerHorizontally(): void;
-    /**
-     * @override
-     * @inheritDoc
-     */
-    centerVertically(): void;
-    /**
-     * @override
-     * @inheritDoc
-     */
-    setHeight(height: number): void;
-    /**
-     * @override
-     * @inheritDoc
-     */
-    nudgeUp(): void;
-    /**
-     * @override
-     * @inheritDoc
-     */
-    nudgeDown(): void;
-    /**
-     * @override
-     * @inheritDoc
-     */
-    nudgeLeft(): void;
-    /**
-     * @override
-     * @inheritDoc
-     */
-    nudgeRight(): void;
-}
+import { Observable } from "rxjs";
+import { ICanvasObject } from "../canvas-object.interface";
+import { IInteractiveCanvas, IMutableColor, IMutablePosition } from "../..";
+import { AbstractCanvasObject } from "../abstract-canvas-object";
+import { CanvasObjectData } from "../canvas-object-data";
+import { fabric } from "fabric";
+/**
+ * Vertical rule. A basic block of color that spans the canvas/row height.
+ */
+export interface IVerticalRule extends ICanvasObject, IMutableColor, IMutablePosition {
+    /**
+     * Get the width of the rule.
+     */
+    getStrokeWidth(): number;
+    /**
+     * Get an observable of the width of the rule.
+     */
+    getStrokeWidth$(): Observable<number>;
+    /**
+     * Set the rule width.
+     * @param width New width.
+     */
+    setStrokeWidth(width: number): void;
+}
+export declare class VerticalRule extends AbstractCanvasObject<fabric.Rect> implements IVerticalRule {
+    private readonly strokeWidth$;
+    constructor(canvas: IInteractiveCanvas, fabricObject: fabric.Rect, persistedField?: CanvasObjectData);
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getStrokeWidth(): number;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getStrokeWidth$(): Observable<number>;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setStrokeWidth(width: number): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getColor(): string;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setColor(color: string): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    centerHorizontally(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    centerVertically(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setHeight(height: number): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    nudgeUp(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    nudgeDown(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    nudgeLeft(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    nudgeRight(): void;
+}

package/dist/profile/canvas-profile.interface.d.ts

@@ -1,22 +1,22 @@
-import { TextAlignment } from "..";
-/**
- * Defines the set of behaviors that can be adjusted on the interactive canvas, and provides an interface for grouping feature settings into a reusable profile.
- */
-export interface ICanvasProfile {
-    readonly allowMultiSelect: boolean;
-    readonly allowObjectsToLeaveCanvas: boolean;
-    readonly enterTextEditImmediatelyOnSelect: boolean;
-    readonly allowMove: boolean;
-    readonly allowRotate: boolean;
-    readonly allowScale: boolean;
-    readonly defaultFont?: string;
-    readonly defaultFontSize: number;
-    readonly defaultFontColor: string;
-    readonly defaultLineHeight: number;
-    readonly defaultCharacterSpacing: number;
-    readonly defaultTextAlignment: TextAlignment;
-    readonly defaultBorderColor: string;
-    readonly defaultBorderWidth: number;
-    readonly defaultCutoffColor: string;
-    readonly defaultCutoffWidth: number;
-}
+import { TextAlignment } from "..";
+/**
+ * Defines the set of behaviors that can be adjusted on the interactive canvas, and provides an interface for grouping feature settings into a reusable profile.
+ */
+export interface ICanvasProfile {
+    readonly allowMultiSelect: boolean;
+    readonly allowObjectsToLeaveCanvas: boolean;
+    readonly enterTextEditImmediatelyOnSelect: boolean;
+    readonly allowMove: boolean;
+    readonly allowRotate: boolean;
+    readonly allowScale: boolean;
+    readonly defaultFont?: string;
+    readonly defaultFontSize: number;
+    readonly defaultFontColor: string;
+    readonly defaultLineHeight: number;
+    readonly defaultCharacterSpacing: number;
+    readonly defaultTextAlignment: TextAlignment;
+    readonly defaultBorderColor: string;
+    readonly defaultBorderWidth: number;
+    readonly defaultCutoffColor: string;
+    readonly defaultCutoffWidth: number;
+}

package/dist/profile/default-canvas-profile.d.ts

@@ -1,23 +1,23 @@
-import { TextAlignment } from "..";
-import { ICanvasProfile } from "./canvas-profile.interface";
-/**
- * Profile with as many features disabled as possible.
- */
-export declare class DefaultCanvasProfile implements ICanvasProfile {
-    readonly allowMultiSelect: boolean;
-    readonly enterTextEditImmediatelyOnSelect: boolean;
-    readonly allowObjectsToLeaveCanvas: boolean;
-    readonly allowMove: boolean;
-    readonly allowRotate: boolean;
-    readonly allowScale: boolean;
-    readonly defaultFont?: string;
-    readonly defaultFontSize: number;
-    readonly defaultFontColor: string;
-    readonly defaultLineHeight: number;
-    readonly defaultCharacterSpacing: number;
-    readonly defaultTextAlignment: TextAlignment;
-    readonly defaultBorderColor: string;
-    readonly defaultBorderWidth: number;
-    readonly defaultCutoffColor: string;
-    readonly defaultCutoffWidth: number;
-}
+import { TextAlignment } from "..";
+import { ICanvasProfile } from "./canvas-profile.interface";
+/**
+ * Profile with as many features disabled as possible.
+ */
+export declare class DefaultCanvasProfile implements ICanvasProfile {
+    readonly allowMultiSelect: boolean;
+    readonly enterTextEditImmediatelyOnSelect: boolean;
+    readonly allowObjectsToLeaveCanvas: boolean;
+    readonly allowMove: boolean;
+    readonly allowRotate: boolean;
+    readonly allowScale: boolean;
+    readonly defaultFont?: string;
+    readonly defaultFontSize: number;
+    readonly defaultFontColor: string;
+    readonly defaultLineHeight: number;
+    readonly defaultCharacterSpacing: number;
+    readonly defaultTextAlignment: TextAlignment;
+    readonly defaultBorderColor: string;
+    readonly defaultBorderWidth: number;
+    readonly defaultCutoffColor: string;
+    readonly defaultCutoffWidth: number;
+}

package/dist/types/canvas-dimension-restrictions.interface.d.ts

@@ -1,14 +1,14 @@
-export interface ICanvasDimensionRestrictions {
-    readonly width?: {
-        min?: number;
-        max?: number;
-    };
-    readonly height?: {
-        min?: number;
-        max?: number;
-    };
-    readonly volume?: {
-        min?: number;
-        max?: number;
-    };
-}
+export interface ICanvasDimensionRestrictions {
+    readonly width?: {
+        min?: number;
+        max?: number;
+    };
+    readonly height?: {
+        min?: number;
+        max?: number;
+    };
+    readonly volume?: {
+        min?: number;
+        max?: number;
+    };
+}

package/dist/types/canvas-dimensions.interface.d.ts

@@ -1,21 +1,21 @@
-export interface ICanvasDimensions {
-    readonly width: number;
-    readonly widthPx: number;
-    readonly widthMm?: number;
-    readonly widthUnit: string;
-    readonly height: number;
-    readonly heightPx: number;
-    readonly heightMm?: number;
-    readonly heightUnit: string;
-    withSize(width: number, height: number): ICanvasDimensions;
-    /**
-     * Convert a number of pixels on the width to millimeters.
-     * @param px Pixel count.
-     */
-    widthPxToMm(px: number): number | undefined;
-    /**
-     * Convert a number of pixels on the height to millimeters.
-     * @param px Pixel count.
-     */
-    heightPxToMm(px: number): number | undefined;
-}
+export interface ICanvasDimensions {
+    readonly width: number;
+    readonly widthPx: number;
+    readonly widthMm?: number;
+    readonly widthUnit: string;
+    readonly height: number;
+    readonly heightPx: number;
+    readonly heightMm?: number;
+    readonly heightUnit: string;
+    withSize(width: number, height: number): ICanvasDimensions;
+    /**
+     * Convert a number of pixels on the width to millimeters.
+     * @param px Pixel count.
+     */
+    widthPxToMm(px: number): number | undefined;
+    /**
+     * Convert a number of pixels on the height to millimeters.
+     * @param px Pixel count.
+     */
+    heightPxToMm(px: number): number | undefined;
+}

package/dist/types/canvas-state.interface.d.ts

@@ -1,11 +1,11 @@
-import { ICanvasDimensions } from "./canvas-dimensions.interface";
-import { CanvasObjectData } from "..";
-/**
- * Serialized canvas state that can be used to save the canvas.
- */
-export interface ICanvasState {
-    readonly dimensions: ICanvasDimensions;
-    readonly canvasJson: string;
-    readonly objects: CanvasObjectData[];
-    readonly backgroundColor?: string;
-}
+import { ICanvasDimensions } from "./canvas-dimensions.interface";
+import { CanvasObjectData } from "..";
+/**
+ * Serialized canvas state that can be used to save the canvas.
+ */
+export interface ICanvasState {
+    readonly dimensions: ICanvasDimensions;
+    readonly canvasJson: string;
+    readonly objects: CanvasObjectData[];
+    readonly backgroundColor?: string;
+}

package/dist/types/dimension-restrictions.interface.d.ts

@@ -1,6 +1,6 @@
-export interface IDimensionRestrictions {
-    minWidth: number;
-    minHeight: number;
-    maxWidth?: number;
-    maxHeight?: number;
-}
+export interface IDimensionRestrictions {
+    minWidth: number;
+    minHeight: number;
+    maxWidth?: number;
+    maxHeight?: number;
+}

package/dist/types/image-type.enum.d.ts

@@ -1,6 +1,6 @@
-export declare enum ImageType {
-    DEFAULT = "DEFAULT",
-    BACKGROUND = "BACKGROUND",
-    LOGO = "LOGO",
-    PHOTO = "PHOTO"
-}
+export declare enum ImageType {
+    DEFAULT = "DEFAULT",
+    BACKGROUND = "BACKGROUND",
+    LOGO = "LOGO",
+    PHOTO = "PHOTO"
+}

package/dist/types/margin.interface.d.ts

@@ -1,6 +1,6 @@
-export interface IMargin {
-    top?: number | null;
-    right?: number | null;
-    bottom?: number | null;
-    left?: number | null;
-}
+export interface IMargin {
+    top?: number | null;
+    right?: number | null;
+    bottom?: number | null;
+    left?: number | null;
+}

package/dist/types/object-dimensions.interface.d.ts

@@ -1,23 +1,23 @@
-export interface IObjectDimensions {
-    readonly top: {
-        readonly px: number;
-        readonly mm: number;
-    };
-    readonly left: {
-        readonly px: number;
-        readonly mm: number;
-    };
-    readonly width: {
-        readonly px: number;
-        readonly mm: number;
-    };
-    readonly height: {
-        readonly px: number;
-        readonly mm: number;
-    };
-    readonly angle: number;
-    readonly scale: {
-        readonly x: number;
-        readonly y: number;
-    };
-}
+export interface IObjectDimensions {
+    readonly top: {
+        readonly px: number;
+        readonly mm: number;
+    };
+    readonly left: {
+        readonly px: number;
+        readonly mm: number;
+    };
+    readonly width: {
+        readonly px: number;
+        readonly mm: number;
+    };
+    readonly height: {
+        readonly px: number;
+        readonly mm: number;
+    };
+    readonly angle: number;
+    readonly scale: {
+        readonly x: number;
+        readonly y: number;
+    };
+}

package/dist/types/object-type.enum.d.ts

@@ -1,10 +1,10 @@
-export declare enum ObjectType {
-    TEXT = "TEXT",
-    BORDER = "BORDER",
-    IMAGE = "IMAGE",
-    RECTANGLE = "RECTANGLE",
-    LIBRARY_IMAGE = "LIBRARY_IMAGE",
-    CUTOFF = "CUTOFF",
-    VERTICAL_RULE = "VERTICAL_RULE",
-    HORIZONTAL_RULE = "HORIZONTAL_RULE"
-}
+export declare enum ObjectType {
+    TEXT = "TEXT",
+    BORDER = "BORDER",
+    IMAGE = "IMAGE",
+    RECTANGLE = "RECTANGLE",
+    LIBRARY_IMAGE = "LIBRARY_IMAGE",
+    CUTOFF = "CUTOFF",
+    VERTICAL_RULE = "VERTICAL_RULE",
+    HORIZONTAL_RULE = "HORIZONTAL_RULE"
+}

package/dist/types/overflow.interface.d.ts

@@ -1,4 +1,4 @@
-import { IRect } from "./rect.interface";
-export interface IOverflow extends IRect {
-    readonly hasOverflow: boolean;
-}
+import { IRect } from "./rect.interface";
+export interface IOverflow extends IRect {
+    readonly hasOverflow: boolean;
+}

package/dist/types/position.interface.d.ts

@@ -1,6 +1,6 @@
-export interface IPosition {
-    readonly top?: number;
-    readonly left?: number;
-    readonly width?: number;
-    readonly height?: number;
-}
+export interface IPosition {
+    readonly top?: number;
+    readonly left?: number;
+    readonly width?: number;
+    readonly height?: number;
+}

package/dist/types/rect.interface.d.ts

@@ -1,6 +1,6 @@
-export interface IRect {
-    readonly top: number;
-    readonly right: number;
-    readonly bottom: number;
-    readonly left: number;
-}
+export interface IRect {
+    readonly top: number;
+    readonly right: number;
+    readonly bottom: number;
+    readonly left: number;
+}

package/dist/types/selection-data.interface.d.ts

@@ -1,19 +1,19 @@
-import { ICanvasObject, ITextSelection } from "..";
-export interface ISelectionData {
-    /**
-     * The currently selected fields.
-     */
-    readonly objects: ICanvasObject[];
-    /**
-     * True if there is nothing selected.
-     */
-    readonly empty: boolean;
-    /**
-     * True if text is currently being edited.
-     */
-    readonly isText: boolean;
-    /**
-     * Text selection data.
-     */
-    readonly textSelection: ITextSelection | null;
-}
+import { ICanvasObject, ITextSelection } from "..";
+export interface ISelectionData {
+    /**
+     * The currently selected fields.
+     */
+    readonly objects: ICanvasObject[];
+    /**
+     * True if there is nothing selected.
+     */
+    readonly empty: boolean;
+    /**
+     * True if text is currently being edited.
+     */
+    readonly isText: boolean;
+    /**
+     * Text selection data.
+     */
+    readonly textSelection: ITextSelection | null;
+}

package/dist/types/text-alignment.interface.d.ts

@@ -1 +1 @@
-export declare type TextAlignment = "left" | "center" | "right" | "justify";
+export declare type TextAlignment = "left" | "center" | "right" | "justify";

package/package.json

@@ -1,29 +1,27 @@
 {
   "name": "@leapfrog/interactive-canvas",
-  "version": "0.1.0",
+  "version": "1.0.0",
   "description": "Leapfrog interactive canvas",
   "files": [
     "dist"
   ],
   "types": "dist/index.d.ts",
   "main": "dist/interactive-canvas.js",
+  "module": "dist/interactive-canvas.es.js",
   "scripts": {
-    "build": "webpack --mode=production",
-    "watch": "webpack --mode=production --watch"
+    "build": "rollup -c",
+    "watch": "rollup -cw"
   },
   "devDependencies": {
     "@types/fabric": "^3.6.5",
     "@types/lodash": "^4.14.153",
-    "clean-webpack-plugin": "^3.0.0",
-    "ts-loader": "^6.0.4",
-    "typescript": "^3.5.3",
-    "unminified-webpack-plugin": "^2.0.0",
-    "webpack": "^4.39.3",
-    "webpack-cli": "^3.3.7"
+    "typescript": "^3.5.3"
   },
   "dependencies": {
     "fabric": "^3.6.3",
     "lodash": "^4.17.15",
+    "rollup": "^2.13.0",
+    "rollup-plugin-typescript2": "^0.27.1",
     "rxjs": "^6.5.5",
     "ts-optchain": "^0.1.8"
   },

package/readme.md

@@ -2,6 +2,17 @@
 
 A set of APIs wrapping the fabric.js library, providing Leapfrog-specific behavior and interactions.
 
+### Installing
+```
+npm install --save @leapfrog/interactive-canvas
+```
+
+### Installing (Node)
+If running in node, you additionally need `jsdom`:
+```
+npm install --save jsdom
+```
+
 ### Building
     npm run build
 
@@ -21,7 +32,7 @@ Add the following lines to the `package.json` `scripts` config in the project th
 {
   "scripts": {
     "link:lic": "npm link @leapfrog/interactive-canvas",
-    "upgrade:lic": "npm install @leapfrog/interactive-canvas@latest"
+    "upgrade:lic": "npm install @leapfrog/interactive-canvas@latest --save"
   }
 }
 ```