@leapfrog/interactive-canvas 0.1.0

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

@@ -0,0 +1,96 @@
+import { Observable } from "rxjs";
+import { IMargin, IObjectDimensions, ObjectType } from "..";
+import { CanvasObjectData } from "./canvas-object-data";
+/**
+ * An object rendered on the {@link IInteractiveCanvas Interactive Canvas}.
+ */
+export interface ICanvasObject {
+    /**
+     * Get the field id.
+     */
+    getId(): string;
+    /**
+     * Get the field type.
+     */
+    getType(): ObjectType;
+    /**
+     * Get the field description, a user-friendly version of Type.
+     */
+    getDescription(): string;
+    /**
+     * Set whether this field is to be used for the sort caption.
+     */
+    setSortCaption(value: boolean): void;
+    /**
+     * True if this field is a sort caption.
+     */
+    isSortCaption(): boolean;
+    /**
+     * Get object dimensions.
+     * @see IObjectDimensions.
+     */
+    getDimensions(): IObjectDimensions;
+    /**
+     * Get an observable for the field dimensions.
+     */
+    getDimensions$(): Observable<IObjectDimensions>;
+    /**
+     * Get the component margin.
+     */
+    getMargin(): IMargin;
+    /**
+     * Set component margin.
+     * @param margin New margin.
+     */
+    setMargin(margin: IMargin): void;
+    /**
+     * Get the column width percentage.
+     */
+    getColumnWidthPercent(): number;
+    /**
+     * Set column width percentage.
+     * @param percent New value.
+     */
+    setColumnWidthPercent(percent: number): void;
+    /**
+     * Bring object to front.
+     */
+    bringToFront(): void;
+    /**
+     * Bring object forward one place.
+     */
+    bringForward(): void;
+    /**
+     * Send object backward one place.
+     */
+    sendBackward(): void;
+    /**
+     * Send object to the back.
+     */
+    sendToBack(): void;
+    /**
+     * Move the object up in the object list.
+     */
+    moveUp(): void;
+    /**
+     * Move the object down in the object list.
+     */
+    moveDown(): void;
+    /**
+     * Delete this object, removing it from the canvas.
+     */
+    delete(): void;
+    /**
+     * Persist this object, returning a copy of the data block.
+     */
+    persist(): CanvasObjectData;
+    /**
+     * Get whether the object is pinned to the bottom of the canvas.
+     */
+    isPinToBottom(): boolean;
+    /**
+     * Set whether the object is pinned to the bottom of the canvas.
+     * @param value New value.
+     */
+    setPinToBottom(value?: boolean): void;
+}

package/dist/object/impl/border.d.ts

@@ -0,0 +1,60 @@
+import { Observable } from "rxjs";
+import { ICanvasObject } from "../canvas-object.interface";
+import { IMutableColor } from "../..";
+import { AbstractCanvasObject } from "../abstract-canvas-object";
+import { InteractiveCanvas } from "../../interactive-canvas.impl";
+import { CanvasObjectData } from "../canvas-object-data";
+import { fabric } from "fabric";
+/**
+ * Border field. A rectangle with a stroke width that automatically follows the canvas border.
+ */
+export interface IBorder extends ICanvasObject, IMutableColor {
+    /**
+     * Get the width of the border stroke.
+     */
+    getStrokeWidth(): number;
+    /**
+     * Get an observable of the width of the cutoff stroke.
+     */
+    getStrokeWidth$(): Observable<number>;
+    /**
+     * Set the border stroke width.
+     * @param width New width.
+     */
+    setStrokeWidth(width: number): void;
+}
+export declare class Border extends AbstractCanvasObject<fabric.Rect> implements IBorder {
+    private readonly strokeWidth$;
+    constructor(canvas: InteractiveCanvas, fabricObject: fabric.Rect, persistedField?: CanvasObjectData);
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getColor(): string;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setColor(color: string): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getStrokeWidth(): number;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getStrokeWidth$(): Observable<number>;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setStrokeWidth(width: number): void;
+    updatePosition(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    protected updateFabricObjectBehavior(): void;
+}

package/dist/object/impl/cutoff.d.ts

@@ -0,0 +1,60 @@
+import { Observable } from "rxjs";
+import { ICanvasObject } from "../canvas-object.interface";
+import { IMutableColor } from "../..";
+import { AbstractCanvasObject } from "../abstract-canvas-object";
+import { InteractiveCanvas } from "../../interactive-canvas.impl";
+import { CanvasObjectData } from "../canvas-object-data";
+import { fabric } from "fabric";
+/**
+ * Cutoff field. A cutoff rule that sits on the bottom of the canvas.
+ */
+export interface ICutoff extends ICanvasObject, IMutableColor {
+    /**
+     * Get the width of the cutoff stroke.
+     */
+    getStrokeWidth(): number;
+    /**
+     * Get an observable of the width of the cutoff stroke.
+     */
+    getStrokeWidth$(): Observable<number>;
+    /**
+     * Set the cutoff stroke width.
+     * @param width New width.
+     */
+    setStrokeWidth(width: number): void;
+}
+export declare class Cutoff extends AbstractCanvasObject<fabric.Rect> implements ICutoff {
+    private readonly strokeWidth$;
+    constructor(canvas: InteractiveCanvas, fabricObject: fabric.Rect, persistedField?: CanvasObjectData);
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getColor(): string;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setColor(color: string): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getStrokeWidth(): number;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getStrokeWidth$(): Observable<number>;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setStrokeWidth(width: number): void;
+    updatePosition(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    protected updateFabricObjectBehavior(): void;
+}

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

@@ -0,0 +1,89 @@
+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";
+/**
+ * Horizontal rule. A basic block of color in a thin line across the canvas.
+ */
+export interface IHorizontalRule 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 HorizontalRule extends AbstractCanvasObject<fabric.Rect> implements IHorizontalRule {
+    private readonly strokeWidth$;
+    constructor(canvas: InteractiveCanvas, fabricObject: fabric.Rect, persistedField?: CanvasObjectData);
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getStrokeWidth(): number;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getStrokeWidth$(): Observable<number>;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setStrokeWidth(value: 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/object/impl/image.d.ts

@@ -0,0 +1,82 @@
+import { IDimensionRestrictions, IMutableImage, IMutablePosition, IPosition } from "../..";
+import { ICanvasObject } from "../canvas-object.interface";
+import { AbstractCanvasObject } from "../abstract-canvas-object";
+import { InteractiveCanvas } from "../../interactive-canvas.impl";
+import { Observable } from "rxjs";
+import { CanvasObjectData } from "../canvas-object-data";
+import { fabric } from "fabric";
+/**
+ * Image field. Displays a custom image on the canvas.
+ */
+export interface IImage extends ICanvasObject, IMutableImage, IMutablePosition {
+}
+export declare class Image extends AbstractCanvasObject<fabric.Image> implements IImage {
+    private readonly DEFAULT_RESTRICTIONS;
+    private layoutWidth;
+    private readonly imageUrl$;
+    constructor(canvas: InteractiveCanvas, fabricObject: fabric.Image, persistedField?: CanvasObjectData);
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getImageUrl(): string;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getImageUrl$(): Observable<string>;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setImageUrl(url: string): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setImageWidth(px: number, sizeRestrictions?: IDimensionRestrictions): number;
+    /**
+     * @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;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setPosition(position: IPosition): void;
+    private centerHorizontallyInLayoutWidth;
+    private setCanvasImage;
+    private getMinWidthBasedOnMinHeight;
+    private getMaxWidthBasedOnMaxHeight;
+}

package/dist/object/impl/rectangle.d.ts

@@ -0,0 +1,59 @@
+import { ICanvasObject } from "../canvas-object.interface";
+import { IMutableColor, IMutablePosition } from "../..";
+import { AbstractCanvasObject } from "../abstract-canvas-object";
+import { InteractiveCanvas } from "../../interactive-canvas.impl";
+import { CanvasObjectData } from "../canvas-object-data";
+import { fabric } from "fabric";
+/**
+ * Rectangle field. A basic block of color that can be moved and scaled.
+ */
+export interface IRectangle extends ICanvasObject, IMutableColor, IMutablePosition {
+}
+export declare class Rectangle extends AbstractCanvasObject<fabric.Rect> implements IRectangle {
+    constructor(canvas: InteractiveCanvas, fabricObject: fabric.Rect, persistedField?: CanvasObjectData);
+    /**
+     * @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/object/impl/text.d.ts

@@ -0,0 +1,255 @@
+import { Observable } from "rxjs";
+import { IFont, IMutableBackgroundColor, IMutableColor, IMutablePosition, IMutableText, IMutableTextStyle, ITextSelection, TextAlignment } from "../..";
+import { ICanvasObject } from "../canvas-object.interface";
+import { AbstractCanvasObject } from "../abstract-canvas-object";
+import { InteractiveCanvas } from "../../interactive-canvas.impl";
+import { CanvasObjectData } from "../canvas-object-data";
+import { fabric } from "fabric";
+/**
+ * Text field. Displays customizable text.
+ */
+export interface IText extends ICanvasObject, IMutableColor, IMutableText, IMutableTextStyle, IMutablePosition, IMutableBackgroundColor {
+    /**
+     * @return Whether this text object should resize the canvas.
+     */
+    isResizeCanvas(): boolean;
+    /**
+     * Set whether this text object should resize the canvas.
+     */
+    setResizeCanvas(value: boolean): void;
+    /**
+     * Focus input on the text object.
+     */
+    focus(): void;
+    /**
+     * @return Is the text box currently being edited.
+     */
+    isEditing(): boolean;
+    /**
+     * Start editing the text.
+     */
+    enterEditing(): void;
+    /**
+     * Select all text.
+     */
+    selectAllText(): void;
+    /**
+     * Set the prefill type used for this text field.
+     */
+    setPrefillType(prefillType: string): void;
+    /**
+     * Get the prefill type used for this text field.
+     */
+    getPrefillType(): string;
+}
+export declare class Text extends AbstractCanvasObject<fabric.Textbox> implements IText {
+    private readonly fontLibrary;
+    private baseComponentHeight;
+    private readonly text$;
+    private readonly textSelection$;
+    constructor(canvas: InteractiveCanvas, fabricObject: fabric.Textbox, persistedField?: CanvasObjectData);
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getText(): string;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getText$(): Observable<string>;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setText(text: string): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    replaceText(target: string, replacement: string): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getColor(): string;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setColor(color: string): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getTextSelection(): ITextSelection;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getTextSelection$(): Observable<ITextSelection>;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setTextAlign(alignment: TextAlignment): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setCharSpacing(spacing: number): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setLineHeight(height: number): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setBold(bold?: boolean): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setItalic(italic?: boolean): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setStrikethrough(strikethrough?: boolean): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setUnderline(underline?: boolean): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setFont(font: IFont): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setFontSize(fontSize: number): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setTextBackgroundColor(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;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getBackgroundColor(): string;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setBackgroundColor(color: string): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setPrefillType(prefillType: string): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    getPrefillType(): string;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    isResizeCanvas(): boolean;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    setResizeCanvas(value: boolean): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    focus(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    isEditing(): boolean;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    enterEditing(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    selectAllText(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    isBulleted(): boolean;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    enableBullets(): void;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    disableBullets(): void;
+    getSizeIncreaseSinceCreation(): number;
+    private removeBullets;
+    private applyBulletListMonkeyPatches;
+    /**
+     * @override
+     * @inheritDoc
+     */
+    protected updateFabricObjectBehavior(): void;
+    protected onTextChange(): void;
+    protected onDelete(): void;
+    protected onSelectionChange(): void;
+    private hasTextSelection;
+    private updateTextSelection;
+    private notifyCanvasOfTextChanges;
+}