@ng-web-apis/canvas/fesm2022/ng-web-apis-canvas.mjs

A library for declarative use of Canvas API with Angular

import { isPlatformServer, isPlatformBrowser } from '@angular/common';
import * as i0 from '@angular/core';
import { InjectionToken, inject, NgZone, Injectable, PLATFORM_ID, ElementRef, Directive, contentChildren, ChangeDetectionStrategy, Component, Pipe } from '@angular/core';
import { WA_ANIMATION_FRAME } from '@ng-web-apis/common';

const WA_CANVAS_2D_CONTEXT = new InjectionToken(ngDevMode ? '[WA_CANVAS_2D_CONTEXT]' : '');

const WA_CANVAS_PROPERTIES = new InjectionToken(ngDevMode ? '[WA_CANVAS_PROPERTIES]' : '', { factory: () => [] });
function asCanvasProperty(useExisting) {
    return { provide: WA_CANVAS_PROPERTIES, multi: true, useExisting };
}

class WaDrawService {
    subscription;
    constructor() {
        const parent = inject(WA_CANVAS_PROPERTIES, { skipSelf: true });
        const properties = inject(WA_CANVAS_PROPERTIES);
        const context = inject(WA_CANVAS_2D_CONTEXT);
        const animationFrame$ = inject(WA_ANIMATION_FRAME);
        const ngZone = inject(NgZone);
        this.subscription = ngZone.runOutsideAngular(() => animationFrame$.subscribe(() => {
            context.save();
            parent.forEach((property) => property.call(context));
            properties.forEach((property) => property.call(context));
            this.call(context);
            context.restore();
        }));
    }
    call = () => { };
    ngOnDestroy() {
        this.subscription.unsubscribe();
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaDrawService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaDrawService });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaDrawService, decorators: [{
            type: Injectable
        }], ctorParameters: () => [] });

class WaCanvas2d {
    context = inject(WA_CANVAS_2D_CONTEXT);
    method = inject(WaDrawService);
    waOpaque = '';
    waDesynchronized = '';
    constructor() {
        this.context.strokeStyle = 'transparent';
        this.method.call = (context) => {
            context.clearRect(0, 0, context.canvas.width, context.canvas.height);
        };
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvas2d, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvas2d, isStandalone: true, selector: "canvas[waCanvas2d]", inputs: { waOpaque: "waOpaque", waDesynchronized: "waDesynchronized" }, providers: [
            {
                provide: WA_CANVAS_2D_CONTEXT,
                useFactory: () => {
                    if (isPlatformServer(inject(PLATFORM_ID))) {
                        return {};
                    }
                    const { nativeElement } = inject(ElementRef);
                    const opaque = nativeElement.getAttribute('waOpaque');
                    const desynchronized = nativeElement.getAttribute('waDesynchronized');
                    const context = nativeElement.getContext('2d', {
                        alpha: opaque === null,
                        desynchronized: desynchronized !== null,
                    });
                    if (!context) {
                        throw new Error('Context of different type was already requested');
                    }
                    return context;
                },
            },
            WaDrawService,
        ], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvas2d, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas[waCanvas2d]',
                    inputs: ['waOpaque', 'waDesynchronized'],
                    providers: [
                        {
                            provide: WA_CANVAS_2D_CONTEXT,
                            useFactory: () => {
                                if (isPlatformServer(inject(PLATFORM_ID))) {
                                    return {};
                                }
                                const { nativeElement } = inject(ElementRef);
                                const opaque = nativeElement.getAttribute('waOpaque');
                                const desynchronized = nativeElement.getAttribute('waDesynchronized');
                                const context = nativeElement.getContext('2d', {
                                    alpha: opaque === null,
                                    desynchronized: desynchronized !== null,
                                });
                                if (!context) {
                                    throw new Error('Context of different type was already requested');
                                }
                                return context;
                            },
                        },
                        WaDrawService,
                    ],
                }]
        }], ctorParameters: () => [] });

const WA_CANVAS_METHOD = new InjectionToken(ngDevMode ? '[WA_CANVAS_METHOD]' : '');
function asCanvasMethod(useExisting) {
    return { provide: WA_CANVAS_METHOD, useExisting };
}

class WaCanvasClipPath {
    pathSteps = contentChildren(WA_CANVAS_METHOD, ...(ngDevMode ? [{ debugName: "pathSteps" }] : []));
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasClipPath, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.3.19", type: WaCanvasClipPath, isStandalone: true, selector: "canvas-clip-path", queries: [{ propertyName: "pathSteps", predicate: WA_CANVAS_METHOD, isSignal: true }], ngImport: i0, template: '<ng-content />', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasClipPath, decorators: [{
            type: Component,
            args: [{
                    selector: 'canvas-clip-path',
                    template: '<ng-content />',
                    changeDetection: ChangeDetectionStrategy.OnPush,
                }]
        }], propDecorators: { pathSteps: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => WA_CANVAS_METHOD), { isSignal: true }] }] } });

class WaCanvasDrawImage {
    method = inject(WaDrawService);
    image;
    dX = 0;
    dY = 0;
    dWidth;
    dHeight;
    sX;
    sY;
    sWidth;
    sHeight;
    constructor() {
        this.method.call = (context) => {
            if (!this.image) {
                return;
            }
            if (this.sWidth !== undefined &&
                this.sHeight !== undefined &&
                this.sX !== undefined &&
                this.sY !== undefined &&
                this.dWidth !== undefined &&
                this.dHeight !== undefined) {
                context.drawImage(this.image, this.sX, this.sY, this.sWidth, this.sHeight, this.dX, this.dY, this.dWidth, this.dHeight);
            }
            else if (this.dWidth !== undefined && this.dHeight !== undefined) {
                context.drawImage(this.image, this.dX, this.dY, this.dWidth, this.dHeight);
            }
            else {
                context.drawImage(this.image, this.dX, this.dY);
            }
        };
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasDrawImage, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasDrawImage, isStandalone: true, selector: "canvas-draw-image", inputs: { image: "image", dX: "dX", dY: "dY", dWidth: "dWidth", dHeight: "dHeight", sX: "sX", sY: "sY", sWidth: "sWidth", sHeight: "sHeight" }, providers: [WaDrawService], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasDrawImage, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-draw-image',
                    inputs: ['image', 'dX', 'dY', 'dWidth', 'dHeight', 'sX', 'sY', 'sWidth', 'sHeight'],
                    providers: [WaDrawService],
                }]
        }], ctorParameters: () => [] });

class WaCanvasPath {
    pathSteps = contentChildren(WA_CANVAS_METHOD, ...(ngDevMode ? [{ debugName: "pathSteps" }] : []));
    method = inject(WaDrawService);
    closed = false;
    fillRule;
    constructor() {
        this.method.call = (context) => {
            context.beginPath();
            this.pathSteps().forEach((step) => {
                step.call(context);
            });
            if (this.closed) {
                context.closePath();
            }
            context.stroke();
            context.fill(this.fillRule);
        };
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasPath, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "20.3.19", type: WaCanvasPath, isStandalone: true, selector: "canvas-path:not([path])", inputs: { closed: "closed", fillRule: "fillRule" }, providers: [WaDrawService], queries: [{ propertyName: "pathSteps", predicate: WA_CANVAS_METHOD, isSignal: true }], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasPath, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-path:not([path])',
                    inputs: ['closed', 'fillRule'],
                    providers: [WaDrawService],
                }]
        }], ctorParameters: () => [], propDecorators: { pathSteps: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => WA_CANVAS_METHOD), { isSignal: true }] }] } });

class WaCanvasPath2d {
    method = inject(WaDrawService);
    path = new Path2D();
    fillRule;
    constructor() {
        this.method.call = (context) => {
            context.fill(this.path, this.fillRule);
            context.stroke(this.path);
        };
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasPath2d, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasPath2d, isStandalone: true, selector: "canvas-path[path]", inputs: { path: "path", fillRule: "fillRule" }, providers: [WaDrawService], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasPath2d, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-path[path]',
                    inputs: ['path', 'fillRule'],
                    providers: [WaDrawService],
                }]
        }], ctorParameters: () => [] });

class WaCanvasText {
    method = inject(WaDrawService);
    text = '';
    x = 0;
    y = 0;
    maxWidth;
    constructor() {
        this.method.call = (context) => {
            context.fillText(this.text, this.x, this.y, this.maxWidth);
            context.strokeText(this.text, this.x, this.y, this.maxWidth);
        };
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasText, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasText, isStandalone: true, selector: "canvas-text", inputs: { text: "text", x: "x", y: "y", maxWidth: "maxWidth" }, providers: [WaDrawService], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasText, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-text',
                    inputs: ['text', 'x', 'y', 'maxWidth'],
                    providers: [WaDrawService],
                }]
        }], ctorParameters: () => [] });

class WaCanvasArc {
    x = 0;
    y = 0;
    radius = 0;
    startAngle = 0;
    endAngle = 0;
    anticlockwise = false;
    call(context) {
        context.arc(this.x, this.y, this.radius, this.startAngle, this.endAngle, this.anticlockwise);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasArc, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasArc, isStandalone: true, selector: "canvas-arc", inputs: { x: "x", y: "y", radius: "radius", startAngle: "startAngle", endAngle: "endAngle", anticlockwise: "anticlockwise" }, providers: [asCanvasMethod(WaCanvasArc)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasArc, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-arc',
                    inputs: ['x', 'y', 'radius', 'startAngle', 'endAngle', 'anticlockwise'],
                    providers: [asCanvasMethod(WaCanvasArc)],
                }]
        }] });

class WaCanvasArcTo {
    x1 = 0;
    y1 = 0;
    x2 = 0;
    y2 = 0;
    radius = 0;
    call(context) {
        context.arcTo(this.x1, this.y1, this.x2, this.y2, this.radius);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasArcTo, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasArcTo, isStandalone: true, selector: "canvas-arc-to", inputs: { x1: "x1", y1: "y1", x2: "x2", y2: "y2", radius: "radius" }, providers: [asCanvasMethod(WaCanvasArcTo)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasArcTo, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-arc-to',
                    inputs: ['x1', 'y1', 'x2', 'y2', 'radius'],
                    providers: [asCanvasMethod(WaCanvasArcTo)],
                }]
        }] });

class WaCanvasBezierCurveTo {
    cp1x = 0;
    cp1y = 0;
    cp2x = 0;
    cp2y = 0;
    x = 0;
    y = 0;
    call(context) {
        context.bezierCurveTo(this.cp1x, this.cp1y, this.cp2x, this.cp2y, this.x, this.y);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasBezierCurveTo, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasBezierCurveTo, isStandalone: true, selector: "canvas-bezier-curve-to", inputs: { cp1x: "cp1x", cp1y: "cp1y", cp2x: "cp2x", cp2y: "cp2y", x: "x", y: "y" }, providers: [asCanvasMethod(WaCanvasBezierCurveTo)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasBezierCurveTo, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-bezier-curve-to',
                    inputs: ['cp1x', 'cp1y', 'cp2x', 'cp2y', 'x', 'y'],
                    providers: [asCanvasMethod(WaCanvasBezierCurveTo)],
                }]
        }] });

class WaCanvasEllipse {
    x = 0;
    y = 0;
    radiusX = 0;
    radiusY = 0;
    rotation = 0;
    startAngle = 0;
    endAngle = 0;
    anticlockwise = false;
    call(context) {
        context.ellipse(this.x, this.y, this.radiusX, this.radiusY, this.rotation, this.startAngle, this.endAngle, this.anticlockwise);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasEllipse, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasEllipse, isStandalone: true, selector: "canvas-ellipse", inputs: { x: "x", y: "y", radiusX: "radiusX", radiusY: "radiusY", startAngle: "startAngle", endAngle: "endAngle", anticlockwise: "anticlockwise" }, providers: [asCanvasMethod(WaCanvasEllipse)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasEllipse, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-ellipse',
                    inputs: ['x', 'y', 'radiusX', 'radiusY', 'startAngle', 'endAngle', 'anticlockwise'],
                    providers: [asCanvasMethod(WaCanvasEllipse)],
                }]
        }] });

class WaCanvasLineTo {
    x = 0;
    y = 0;
    call(context) {
        context.lineTo(this.x, this.y);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasLineTo, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasLineTo, isStandalone: true, selector: "canvas-line-to", inputs: { x: "x", y: "y" }, providers: [asCanvasMethod(WaCanvasLineTo)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasLineTo, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-line-to',
                    inputs: ['x', 'y'],
                    providers: [asCanvasMethod(WaCanvasLineTo)],
                }]
        }] });

class WaCanvasMoveTo {
    x = 0;
    y = 0;
    call(context) {
        context.moveTo(this.x, this.y);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasMoveTo, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasMoveTo, isStandalone: true, selector: "canvas-move-to", inputs: { x: "x", y: "y" }, providers: [asCanvasMethod(WaCanvasMoveTo)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasMoveTo, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-move-to',
                    inputs: ['x', 'y'],
                    providers: [asCanvasMethod(WaCanvasMoveTo)],
                }]
        }] });

class WaCanvasQuadraticCurveTo {
    cpx = 0;
    cpy = 0;
    x = 0;
    y = 0;
    call(context) {
        context.quadraticCurveTo(this.cpx, this.cpy, this.x, this.y);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasQuadraticCurveTo, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasQuadraticCurveTo, isStandalone: true, selector: "canvas-quadratic-curve-to", inputs: { x: "x", y: "y", cpx: "cpx", cpy: "cpy" }, providers: [asCanvasMethod(WaCanvasQuadraticCurveTo)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasQuadraticCurveTo, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-quadratic-curve-to',
                    inputs: ['x', 'y', 'cpx', 'cpy'],
                    providers: [asCanvasMethod(WaCanvasQuadraticCurveTo)],
                }]
        }] });

class WaCanvasRect {
    x = 0;
    y = 0;
    width = 0;
    height = 0;
    call(context) {
        context.rect(this.x, this.y, this.width, this.height);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasRect, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasRect, isStandalone: true, selector: "canvas-rect", inputs: { x: "x", y: "y", width: "width", height: "height" }, providers: [asCanvasMethod(WaCanvasRect)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasRect, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-rect',
                    inputs: ['x', 'y', 'width', 'height'],
                    providers: [asCanvasMethod(WaCanvasRect)],
                }]
        }] });

class WaCanvasGradientPipe {
    context = inject(WA_CANVAS_2D_CONTEXT);
    // eslint-disable-next-line max-params,@typescript-eslint/max-params
    transform(stops, a1, a2, a3, a4, a5, a6) {
        const gradient = a5 !== undefined && a6 !== undefined
            ? this.context.createRadialGradient(a1, a2, a3, a4, a5, a6)
            : this.context.createLinearGradient(a1, a2, a3, a4);
        Array.from(stops.keys()).forEach((stop) => gradient.addColorStop(stop, stops.get(stop) ?? ''));
        return gradient;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasGradientPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasGradientPipe, isStandalone: true, name: "gradient" });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasGradientPipe, decorators: [{
            type: Pipe,
            args: [{ name: 'gradient' }]
        }] });

class WaCanvasPathPipe {
    transform(path) {
        return new Path2D(path);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasPathPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasPathPipe, isStandalone: true, name: "path" });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasPathPipe, decorators: [{
            type: Pipe,
            args: [{ name: 'path' }]
        }] });

class WaCanvasPatternPipe {
    context = inject(WA_CANVAS_2D_CONTEXT);
    transform(image, repetition = 'repeat') {
        return this.context.createPattern(image, repetition);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasPatternPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasPatternPipe, isStandalone: true, name: "pattern" });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasPatternPipe, decorators: [{
            type: Pipe,
            args: [{ name: 'pattern' }]
        }] });

class WaCanvasRadPipe {
    transform(input) {
        return (input * Math.PI) / 180;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasRadPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasRadPipe, isStandalone: true, name: "rad" });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasRadPipe, decorators: [{
            type: Pipe,
            args: [{ name: 'rad' }]
        }] });

class WaCanvasTransformPipe {
    isBrowser = isPlatformBrowser(inject(PLATFORM_ID));
    transform(value) {
        return this.isBrowser ? new DOMMatrix(value) : null;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasTransformPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasTransformPipe, isStandalone: true, name: "transform" });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasTransformPipe, decorators: [{
            type: Pipe,
            args: [{ name: 'transform' }]
        }] });

class WaCanvasClip {
    clip = new Path2D();
    clipFillRule;
    call(context) {
        if (this.clip instanceof WaCanvasClipPath) {
            context.beginPath();
            this.clip.pathSteps().forEach((step) => {
                step.call(context);
            });
            context.clip(this.clipFillRule);
        }
        else {
            context.clip(this.clip, this.clipFillRule);
        }
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasClip, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasClip, isStandalone: true, selector: "canvas-draw-image[clip],canvas-draw-image[clipFillRule],canvas-path[clip],canvas-path[clipFillRule],canvas-text[clip],canvas-text[clipFillRule]", inputs: { clip: "clip", clipFillRule: "clipFillRule" }, providers: [asCanvasProperty(WaCanvasClip)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasClip, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-draw-image[clip],canvas-draw-image[clipFillRule],canvas-path[clip],canvas-path[clipFillRule],canvas-text[clip],canvas-text[clipFillRule]',
                    inputs: ['clip', 'clipFillRule'],
                    providers: [asCanvasProperty(WaCanvasClip)],
                }]
        }] });

class WaCanvasCompositing {
    globalAlpha = 1;
    globalCompositeOperation = 'source-over';
    call(context) {
        context.globalAlpha = this.globalAlpha;
        context.globalCompositeOperation = this.globalCompositeOperation;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasCompositing, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasCompositing, isStandalone: true, selector: "canvas-draw-image[globalAlpha],canvas-draw-image[globalCompositeOperation],canvas-path[globalAlpha],canvas-path[globalCompositeOperation],canvas-text[globalAlpha],canvas-text[globalCompositeOperation]", inputs: { globalAlpha: "globalAlpha", globalCompositeOperation: "globalCompositeOperation" }, providers: [asCanvasProperty(WaCanvasCompositing)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasCompositing, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-draw-image[globalAlpha],canvas-draw-image[globalCompositeOperation],canvas-path[globalAlpha],canvas-path[globalCompositeOperation],canvas-text[globalAlpha],canvas-text[globalCompositeOperation]',
                    inputs: ['globalAlpha', 'globalCompositeOperation'],
                    providers: [asCanvasProperty(WaCanvasCompositing)],
                }]
        }] });

class WaCanvasFillStrokeStyles {
    fillStyle = 'black';
    strokeStyle = 'transparent';
    call(context) {
        context.fillStyle = this.fillStyle;
        context.strokeStyle = this.strokeStyle;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasFillStrokeStyles, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasFillStrokeStyles, isStandalone: true, selector: "canvas-path[fillStyle],canvas-path[strokeStyle],canvas-text[fillStyle],canvas-text[strokeStyle]", inputs: { fillStyle: "fillStyle", strokeStyle: "strokeStyle" }, providers: [asCanvasProperty(WaCanvasFillStrokeStyles)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasFillStrokeStyles, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-path[fillStyle],canvas-path[strokeStyle],canvas-text[fillStyle],canvas-text[strokeStyle]',
                    inputs: ['fillStyle', 'strokeStyle'],
                    providers: [asCanvasProperty(WaCanvasFillStrokeStyles)],
                }]
        }] });

class WaCanvasFilter {
    filter = 'none';
    call(context) {
        context.filter = this.filter;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasFilter, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasFilter, isStandalone: true, selector: "canvas-draw-image[filter],canvas-path[filter],canvas-text[filter]", inputs: { filter: "filter" }, providers: [asCanvasProperty(WaCanvasFilter)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasFilter, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-draw-image[filter],canvas-path[filter],canvas-text[filter]',
                    inputs: ['filter'],
                    providers: [asCanvasProperty(WaCanvasFilter)],
                }]
        }] });

class WaCanvasImageSmoothing {
    imageSmoothingEnabled = true;
    imageSmoothingQuality = 'low';
    call(context) {
        context.imageSmoothingEnabled = this.imageSmoothingEnabled;
        context.imageSmoothingQuality = this.imageSmoothingQuality;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasImageSmoothing, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasImageSmoothing, isStandalone: true, selector: "canvas-draw-image[imageSmoothingEnabled],canvas-draw-image[imageSmoothingQuality],canvas-path[imageSmoothingEnabled],canvas-path[imageSmoothingQuality],canvas-text[imageSmoothingEnabled],canvas-text[imageSmoothingQuality]", inputs: { imageSmoothingEnabled: "imageSmoothingEnabled", imageSmoothingQuality: "imageSmoothingQuality" }, providers: [asCanvasProperty(WaCanvasImageSmoothing)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasImageSmoothing, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-draw-image[imageSmoothingEnabled],canvas-draw-image[imageSmoothingQuality],canvas-path[imageSmoothingEnabled],canvas-path[imageSmoothingQuality],canvas-text[imageSmoothingEnabled],canvas-text[imageSmoothingQuality]',
                    inputs: ['imageSmoothingEnabled', 'imageSmoothingQuality'],
                    providers: [asCanvasProperty(WaCanvasImageSmoothing)],
                }]
        }] });

class WaCanvasPathDrawingStyles {
    lineCap = 'butt';
    lineDashOffset = 0;
    lineJoin = 'miter';
    lineWidth = 1;
    lineDash = [];
    miterLimit = 10;
    call(context) {
        context.lineCap = this.lineCap;
        context.lineDashOffset = this.lineDashOffset;
        context.lineJoin = this.lineJoin;
        context.lineWidth = this.lineWidth;
        context.miterLimit = this.miterLimit;
        context.setLineDash(this.lineDash);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasPathDrawingStyles, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasPathDrawingStyles, isStandalone: true, selector: "canvas-path[lineCap],canvas-path[lineDashOffset],canvas-path[lineJoin],canvas-path[lineWidth],canvas-path[lineDash],canvas-path[miterLimit],canvas-text[lineCap],canvas-text[lineDashOffset],canvas-text[lineJoin],canvas-text[lineWidth],canvas-text[lineDash],canvas-text[miterLimit]", inputs: { lineCap: "lineCap", lineDashOffset: "lineDashOffset", lineJoin: "lineJoin", lineWidth: "lineWidth", lineDash: "lineDash", miterLimit: "miterLimit" }, providers: [asCanvasProperty(WaCanvasPathDrawingStyles)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasPathDrawingStyles, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-path[lineCap],canvas-path[lineDashOffset],canvas-path[lineJoin],canvas-path[lineWidth],canvas-path[lineDash],canvas-path[miterLimit],canvas-text[lineCap],canvas-text[lineDashOffset],canvas-text[lineJoin],canvas-text[lineWidth],canvas-text[lineDash],canvas-text[miterLimit]',
                    inputs: [
                        'lineCap',
                        'lineDashOffset',
                        'lineJoin',
                        'lineWidth',
                        'lineDash',
                        'miterLimit',
                    ],
                    providers: [asCanvasProperty(WaCanvasPathDrawingStyles)],
                }]
        }] });

class WaCanvasShadowStyles {
    shadowBlur = 0;
    shadowColor = 'transparent';
    shadowOffsetX = 0;
    shadowOffsetY = 0;
    call(context) {
        context.shadowBlur = this.shadowBlur;
        context.shadowColor = this.shadowColor;
        context.shadowOffsetX = this.shadowOffsetX;
        context.shadowOffsetY = this.shadowOffsetY;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasShadowStyles, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasShadowStyles, isStandalone: true, selector: "canvas-draw-image[shadowBlur],canvas-draw-image[shadowColor],canvas-draw-image[shadowOffsetX],canvas-draw-image[shadowOffsetY],canvas-path[shadowBlur],canvas-path[shadowColor],canvas-path[shadowOffsetX],canvas-path[shadowOffsetY],canvas-text[shadowBlur],canvas-text[shadowColor],canvas-text[shadowOffsetX],canvas-text[shadowOffsetY]", inputs: { shadowBlur: "shadowBlur", shadowColor: "shadowColor", shadowOffsetX: "shadowOffsetX", shadowOffsetY: "shadowOffsetY" }, providers: [asCanvasProperty(WaCanvasShadowStyles)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasShadowStyles, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-draw-image[shadowBlur],canvas-draw-image[shadowColor],canvas-draw-image[shadowOffsetX],canvas-draw-image[shadowOffsetY],canvas-path[shadowBlur],canvas-path[shadowColor],canvas-path[shadowOffsetX],canvas-path[shadowOffsetY],canvas-text[shadowBlur],canvas-text[shadowColor],canvas-text[shadowOffsetX],canvas-text[shadowOffsetY]',
                    inputs: ['shadowBlur', 'shadowColor', 'shadowOffsetX', 'shadowOffsetY'],
                    providers: [asCanvasProperty(WaCanvasShadowStyles)],
                }]
        }] });

class WaCanvasTextDrawingStyles {
    direction = 'inherit';
    font = '10px sans-serif';
    textAlign = 'start';
    fontKerning = 'auto';
    textBaseline = 'alphabetic';
    fontStretch;
    fontVariantCaps;
    letterSpacing;
    textRendering;
    wordSpacing;
    call(context) {
        context.direction = this.direction;
        context.font = this.font;
        context.textAlign = this.textAlign;
        context.textBaseline = this.textBaseline;
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasTextDrawingStyles, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasTextDrawingStyles, isStandalone: true, selector: "canvas-text[direction],canvas-text[font],canvas-text[textAlign],canvas-text[textBaseline]", inputs: { direction: "direction", font: "font", textAlign: "textAlign", fontKerning: "fontKerning", textBaseline: "textBaseline" }, providers: [asCanvasProperty(WaCanvasTextDrawingStyles)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasTextDrawingStyles, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas-text[direction],canvas-text[font],canvas-text[textAlign],canvas-text[textBaseline]',
                    inputs: ['direction', 'font', 'textAlign', 'fontKerning', 'textBaseline'],
                    providers: [asCanvasProperty(WaCanvasTextDrawingStyles)],
                }]
        }] });

class WaCanvasTransform {
    parent = inject(WaCanvasTransform, {
        skipSelf: true,
        optional: true,
    });
    transform = isPlatformBrowser(inject(PLATFORM_ID)) ? new DOMMatrix() : null;
    call(context) {
        if (this.transform) {
            context.setTransform(this.parent?.transform?.multiply(this.transform) || this.transform);
        }
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasTransform, deps: [], target: i0.ɵɵFactoryTarget.Directive });
    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.19", type: WaCanvasTransform, isStandalone: true, selector: "canvas[transform],canvas-draw-image[transform],canvas-path[transform],canvas-text[transform]", inputs: { transform: "transform" }, providers: [asCanvasProperty(WaCanvasTransform)], ngImport: i0 });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: WaCanvasTransform, decorators: [{
            type: Directive,
            args: [{
                    selector: 'canvas[transform],canvas-draw-image[transform],canvas-path[transform],canvas-text[transform]',
                    inputs: ['transform'],
                    providers: [asCanvasProperty(WaCanvasTransform)],
                }]
        }] });

const WaCanvas = [
    WaCanvas2d,
    WaCanvasClipPath,
    WaCanvasDrawImage,
    WaCanvasPath,
    WaCanvasPath2d,
    WaCanvasText,
    WaCanvasArc,
    WaCanvasArcTo,
    WaCanvasBezierCurveTo,
    WaCanvasEllipse,
    WaCanvasLineTo,
    WaCanvasMoveTo,
    WaCanvasQuadraticCurveTo,
    WaCanvasRect,
    WaCanvasClip,
    WaCanvasCompositing,
    WaCanvasFillStrokeStyles,
    WaCanvasFilter,
    WaCanvasImageSmoothing,
    WaCanvasPathDrawingStyles,
    WaCanvasShadowStyles,
    WaCanvasTextDrawingStyles,
    WaCanvasGradientPipe,
    WaCanvasPathPipe,
    WaCanvasPatternPipe,
    WaCanvasRadPipe,
    WaCanvasTransform,
    WaCanvasTransformPipe,
];

/**
 * Generated bundle index. Do not edit.
 */

export { WA_CANVAS_2D_CONTEXT, WA_CANVAS_METHOD, WA_CANVAS_PROPERTIES, WaCanvas, WaCanvas2d, WaCanvasArc, WaCanvasArcTo, WaCanvasBezierCurveTo, WaCanvasClip, WaCanvasClipPath, WaCanvasCompositing, WaCanvasDrawImage, WaCanvasEllipse, WaCanvasFillStrokeStyles, WaCanvasFilter, WaCanvasGradientPipe, WaCanvasImageSmoothing, WaCanvasLineTo, WaCanvasMoveTo, WaCanvasPath, WaCanvasPath2d, WaCanvasPathDrawingStyles, WaCanvasPathPipe, WaCanvasPatternPipe, WaCanvasQuadraticCurveTo, WaCanvasRadPipe, WaCanvasRect, WaCanvasShadowStyles, WaCanvasText, WaCanvasTextDrawingStyles, WaCanvasTransform, WaCanvasTransformPipe, WaDrawService, asCanvasMethod, asCanvasProperty };
//# sourceMappingURL=ng-web-apis-canvas.mjs.map