@node-projects/web-component-designer-zpl 0.1.0

package/dist/widgets/zpl-barcode.js

@@ -0,0 +1,92 @@
+import { BaseCustomWebComponentConstructorAppend, LazyLoader, css, html } from "@node-projects/base-custom-webcomponent";
+import { BarcodeFormat } from "../jsBarcodeOptions.js";
+import { getZplCoordinates } from "../zplHelper.js";
+import QRCode from "../qr.js";
+export class ZplBarcode extends BaseCustomWebComponentConstructorAppend {
+    static style = css ` *{
+        box-sizing: border-box;
+    }
+    `;
+    static template = html `
+    <div id="barcode-div" style="width: 100%; height: 100%;">
+    </div>
+    `;
+    static is = 'zpl-barcode';
+    content;
+    type;
+    width;
+    ratio;
+    height;
+    _barcode;
+    _barcodeOptions;
+    static properties = {
+        content: String,
+        type: BarcodeFormat,
+        width: Number,
+        ratio: Number,
+        height: Number,
+    };
+    constructor() {
+        super();
+        this._restoreCachedInititalValues();
+        this._barcode = this._getDomElement("barcode-div");
+    }
+    async ready() {
+        this._parseAttributesToProperties();
+        if (this.width > 10)
+            this.width = 10;
+        if (this.width < 1)
+            this.width = 1;
+        if (this.ratio > 3.0)
+            this.ratio = 3.0;
+        if (this.ratio < 2.0)
+            this.ratio = 2.0;
+        if (this.type == BarcodeFormat.QR) {
+            const svg = QRCode.generateSVG(this.content, {
+                modulesize: this.height,
+                margin: 0,
+                background: 'transparent'
+            });
+            this._barcode.appendChild(svg);
+            this._barcode.style.marginTop = "10px";
+        }
+        else {
+            await LazyLoader.LoadJavascript("/node_modules/jsbarcode/dist/JsBarcode.all.js");
+            let svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+            this._barcode.appendChild(svg);
+            this._barcode.style.marginTop = "";
+            this._createOptions();
+            //@ts-ignore
+            JsBarcode(svg, this.content, this._barcodeOptions);
+        }
+    }
+    _createOptions() {
+        this._barcodeOptions = {};
+        this._barcodeOptions.format = this.type;
+        this._barcodeOptions.width = this.width;
+        this._barcodeOptions.height = this.height;
+        this._barcodeOptions.margin = 0;
+        this._barcodeOptions.background = 'transparent';
+    }
+    createZpl() {
+        let zpl = "";
+        zpl += getZplCoordinates(this, 0);
+        if (this.type != BarcodeFormat.QR)
+            zpl += "^BY" + this.width + "," + this.ratio;
+        switch (this.type) {
+            case BarcodeFormat.CODE128:
+                zpl += "^BCN," + this.height + ",Y,N,Y,N";
+                break;
+            case BarcodeFormat.EAN13:
+                zpl += "^BCN," + this.height + ",Y,N";
+                break;
+            case BarcodeFormat.QR:
+                zpl += "^BQN,2," + this.height + "";
+                break;
+        }
+        zpl += "^FD" + this.content;
+        zpl += "^FS";
+        return zpl;
+    }
+}
+customElements.define(ZplBarcode.is, ZplBarcode);

package/dist/widgets/zpl-graphic-box.d.ts

@@ -0,0 +1,25 @@
+import { BaseCustomWebComponentConstructorAppend } from "@node-projects/base-custom-webcomponent";
+declare enum StrokeColor {
+    black = "black",
+    white = "white"
+}
+export declare class ZplGraphicBox extends BaseCustomWebComponentConstructorAppend {
+    static readonly style: CSSStyleSheet;
+    static readonly template: HTMLTemplateElement;
+    static readonly is = "zpl-graphic-box";
+    strokeWidth: number;
+    strokeColor: string;
+    cornerRounding: number;
+    private _box;
+    private _observer;
+    static readonly properties: {
+        strokeWidth: NumberConstructor;
+        strokeColor: typeof StrokeColor;
+        cornerRounding: NumberConstructor;
+    };
+    constructor();
+    ready(): Promise<void>;
+    private _drawSvg;
+    createZpl(): string;
+}
+export {};

package/dist/widgets/zpl-graphic-box.js

@@ -0,0 +1,89 @@
+import { BaseCustomWebComponentConstructorAppend, css, html } from "@node-projects/base-custom-webcomponent";
+import { getZplCoordinates } from "../zplHelper.js";
+var StrokeColor;
+(function (StrokeColor) {
+    StrokeColor["black"] = "black";
+    StrokeColor["white"] = "white";
+})(StrokeColor || (StrokeColor = {}));
+export class ZplGraphicBox extends BaseCustomWebComponentConstructorAppend {
+    static style = css ` *{
+        box-sizing: border-box;
+    }
+    `;
+    static template = html `
+    <div id="box-div" style="width: 100%; height: 100%; overflow: hidden">
+    </div>
+    `;
+    static is = 'zpl-graphic-box';
+    strokeWidth = 1;
+    strokeColor = 'black';
+    cornerRounding;
+    _box;
+    _observer;
+    static properties = {
+        strokeWidth: Number,
+        strokeColor: StrokeColor,
+        cornerRounding: Number,
+    };
+    constructor() {
+        super();
+        this._restoreCachedInititalValues();
+        this._box = this._getDomElement("box-div");
+        this._observer = new ResizeObserver(() => this._drawSvg());
+        this._observer.observe(this);
+    }
+    async ready() {
+        this._parseAttributesToProperties();
+        if (this.cornerRounding > 8)
+            this.cornerRounding = 8;
+        if (this.cornerRounding < 0)
+            this.cornerRounding = 0;
+        this._drawSvg();
+    }
+    _drawSvg() {
+        let x = this.strokeWidth / 2;
+        let width = parseInt(this.style.width.replace("px", "")) - this.strokeWidth;
+        if (width < this.strokeWidth)
+            width = this.strokeWidth;
+        let height = parseInt(this.style.height.replace("px", "")) - this.strokeWidth;
+        if (height < this.strokeWidth)
+            height = this.strokeWidth;
+        let smallerLength = width;
+        if (smallerLength > height)
+            smallerLength = height;
+        let radius = (1 / 8) * this.cornerRounding * smallerLength / 2;
+        let svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+        let rect = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
+        if (this.strokeColor == StrokeColor.black)
+            rect.setAttribute("stroke", "black");
+        else
+            rect.setAttribute("stroke", "white");
+        rect.setAttribute("fill", "white");
+        rect.setAttribute("fill-opacity", "0.0");
+        rect.setAttribute("stroke-width", this.strokeWidth.toString());
+        rect.setAttribute("x", x.toString());
+        rect.setAttribute("y", x.toString());
+        rect.setAttribute("rx", radius.toString());
+        rect.setAttribute("ry", radius.toString());
+        rect.setAttribute("width", width.toString());
+        rect.setAttribute("height", height.toString());
+        svg.style.overflow = "visible";
+        if (this._box.childElementCount > 0)
+            this._box.removeChild(this._box.children[0]);
+        svg.appendChild(rect);
+        this._box.appendChild(svg);
+    }
+    createZpl() {
+        let zpl = "";
+        zpl += getZplCoordinates(this, 0);
+        zpl += "^GB"
+            + this.style.width.replace("px", "") + ","
+            + this.style.height.replace("px", "") + ","
+            + this.strokeWidth + ","
+            + (this.strokeColor == StrokeColor.black ? "B" : "W") + ","
+            + this.cornerRounding;
+        zpl += "^FS";
+        return zpl;
+    }
+}
+customElements.define(ZplGraphicBox.is, ZplGraphicBox);

package/dist/widgets/zpl-graphic-circle.d.ts

@@ -0,0 +1,23 @@
+import { BaseCustomWebComponentConstructorAppend } from "@node-projects/base-custom-webcomponent";
+declare enum StrokeColor {
+    black = "black",
+    white = "white"
+}
+export declare class ZplGraphicCircle extends BaseCustomWebComponentConstructorAppend {
+    static readonly style: CSSStyleSheet;
+    static readonly template: HTMLTemplateElement;
+    static readonly is = "zpl-graphic-circle";
+    strokeWidth: number;
+    strokeColor: string;
+    private _circle;
+    private _observer;
+    static readonly properties: {
+        strokeWidth: NumberConstructor;
+        strokeColor: typeof StrokeColor;
+    };
+    constructor();
+    ready(): Promise<void>;
+    private _drawSvg;
+    createZpl(): string;
+}
+export {};

package/dist/widgets/zpl-graphic-circle.js

@@ -0,0 +1,71 @@
+import { BaseCustomWebComponentConstructorAppend, css, html } from "@node-projects/base-custom-webcomponent";
+import { getZplCoordinates } from "../zplHelper.js";
+var StrokeColor;
+(function (StrokeColor) {
+    StrokeColor["black"] = "black";
+    StrokeColor["white"] = "white";
+})(StrokeColor || (StrokeColor = {}));
+export class ZplGraphicCircle extends BaseCustomWebComponentConstructorAppend {
+    static style = css ` *{
+        box-sizing: border-box;
+    }
+    `;
+    static template = html `
+    <div id="circle-div" style="width: 100%; height: 100%;">
+    </div>
+    `;
+    static is = 'zpl-graphic-circle';
+    strokeWidth = 1;
+    strokeColor = 'black';
+    _circle;
+    _observer;
+    static properties = {
+        strokeWidth: Number,
+        strokeColor: StrokeColor,
+    };
+    constructor() {
+        super();
+        this._restoreCachedInititalValues();
+        this._circle = this._getDomElement("circle-div");
+        this._observer = new ResizeObserver(() => this._drawSvg());
+        this._observer.observe(this);
+    }
+    async ready() {
+        this._parseAttributesToProperties();
+        this._drawSvg();
+    }
+    _drawSvg() {
+        let w = parseInt(this.style.width.replace("px", ""));
+        let h = parseInt(this.style.height.replace("px", ""));
+        let svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+        let circle = document.createElementNS('http://www.w3.org/2000/svg', 'ellipse');
+        if (this.strokeColor == StrokeColor.black)
+            circle.setAttribute("stroke", "black");
+        else
+            circle.setAttribute("stroke", "white");
+        circle.setAttribute("fill", "white");
+        circle.setAttribute("fill-opacity", "0.0");
+        circle.setAttribute("stroke-width", this.strokeWidth.toString());
+        circle.setAttribute("cx", (w / 2).toString());
+        circle.setAttribute("cy", (h / 2).toString());
+        circle.setAttribute("rx", ((w / 2) - this.strokeWidth / 2).toString());
+        circle.setAttribute("ry", ((h / 2) - this.strokeWidth / 2).toString());
+        if (this._circle.childElementCount > 0)
+            this._circle.removeChild(this._circle.children[0]);
+        svg.appendChild(circle);
+        svg.style.overflow = "visible";
+        this._circle.appendChild(svg);
+    }
+    createZpl() {
+        let zpl = "";
+        zpl += getZplCoordinates(this, 0);
+        zpl += "^GE"
+            + this.style.width.replace("px", "") + ","
+            + this.style.height.replace("px", "") + ","
+            + this.strokeWidth + ","
+            + (this.strokeColor == StrokeColor.black ? "B" : "W");
+        zpl += "^FS";
+        return zpl;
+    }
+}
+customElements.define(ZplGraphicCircle.is, ZplGraphicCircle);

package/dist/widgets/zpl-graphic-diagonal-line.d.ts

@@ -0,0 +1,29 @@
+import { BaseCustomWebComponentConstructorAppend } from "@node-projects/base-custom-webcomponent";
+declare enum StrokeColor {
+    black = "black",
+    white = "white"
+}
+declare enum Orientation {
+    L = "L",
+    R = "R"
+}
+export declare class ZplGraphicDiagonalLine extends BaseCustomWebComponentConstructorAppend {
+    static readonly style: CSSStyleSheet;
+    static readonly template: HTMLTemplateElement;
+    static readonly is = "zpl-graphic-diagonal-line";
+    strokeWidth: number;
+    strokeColor: string;
+    orientation: string;
+    private _line;
+    private _observer;
+    static readonly properties: {
+        strokeWidth: NumberConstructor;
+        strokeColor: typeof StrokeColor;
+        orientation: typeof Orientation;
+    };
+    constructor();
+    ready(): Promise<void>;
+    private _drawSvg;
+    createZpl(): string;
+}
+export {};

package/dist/widgets/zpl-graphic-diagonal-line.js

@@ -0,0 +1,87 @@
+import { BaseCustomWebComponentConstructorAppend, css, html } from "@node-projects/base-custom-webcomponent";
+import { getZplCoordinates } from "../zplHelper.js";
+var StrokeColor;
+(function (StrokeColor) {
+    StrokeColor["black"] = "black";
+    StrokeColor["white"] = "white";
+})(StrokeColor || (StrokeColor = {}));
+var Orientation;
+(function (Orientation) {
+    Orientation["L"] = "L";
+    Orientation["R"] = "R";
+})(Orientation || (Orientation = {}));
+export class ZplGraphicDiagonalLine extends BaseCustomWebComponentConstructorAppend {
+    static style = css ` *{
+        box-sizing: border-box;
+    }
+    `;
+    static template = html `
+    <div id="box-div" style="width: 100%; height: 100%;">
+    </div>
+    `;
+    static is = 'zpl-graphic-diagonal-line';
+    strokeWidth = 1;
+    strokeColor = "black";
+    orientation;
+    _line;
+    _observer;
+    static properties = {
+        strokeWidth: Number,
+        strokeColor: StrokeColor,
+        orientation: Orientation,
+    };
+    constructor() {
+        super();
+        this._restoreCachedInititalValues();
+        this._line = this._getDomElement("box-div");
+        this._observer = new ResizeObserver(() => this._drawSvg());
+        this._observer.observe(this);
+    }
+    async ready() {
+        this._parseAttributesToProperties();
+        this._drawSvg();
+    }
+    _drawSvg() {
+        let w = parseInt(this.style.width.replace("px", ""));
+        let h = parseInt(this.style.height.replace("px", "")) - this.strokeWidth;
+        let svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+        let line = document.createElementNS('http://www.w3.org/2000/svg', 'line');
+        if (this.strokeColor == StrokeColor.black)
+            line.setAttribute("stroke", "black");
+        else
+            line.setAttribute("stroke", "white");
+        line.setAttribute("fill", "white");
+        line.setAttribute("fill-opacity", "0.0");
+        line.setAttribute("stroke-width", this.strokeWidth.toString());
+        if (this.orientation == Orientation.L) {
+            line.setAttribute("x1", "0");
+            line.setAttribute("y1", "0");
+            line.setAttribute("x2", w.toString());
+            line.setAttribute("y2", h.toString());
+        }
+        else {
+            line.setAttribute("x1", "0");
+            line.setAttribute("y1", h.toString());
+            line.setAttribute("x2", w.toString());
+            line.setAttribute("y2", "0");
+        }
+        svg.style.overflow = "visible";
+        if (this._line.childElementCount > 0)
+            this._line.removeChild(this._line.children[0]);
+        svg.appendChild(line);
+        this._line.appendChild(svg);
+    }
+    createZpl() {
+        let zpl = "";
+        zpl += getZplCoordinates(this, 0);
+        zpl += "^GD"
+            + this.style.width.replace("px", "") + ","
+            + this.style.height.replace("px", "") + ","
+            + this.strokeWidth + ","
+            + (this.strokeColor == StrokeColor.black ? "B" : "W") + ","
+            + this.orientation;
+        zpl += "^FS";
+        return zpl;
+    }
+}
+customElements.define(ZplGraphicDiagonalLine.is, ZplGraphicDiagonalLine);

package/dist/widgets/zpl-image.d.ts

@@ -0,0 +1,27 @@
+import { BaseCustomWebComponentConstructorAppend } from "@node-projects/base-custom-webcomponent";
+export declare class ZplImage extends BaseCustomWebComponentConstructorAppend {
+    static readonly style: CSSStyleSheet;
+    static readonly template: HTMLTemplateElement;
+    static readonly is = "zpl-image";
+    private _image;
+    private _wrapper;
+    totalBytes: number;
+    bytesPerRow: number;
+    imageName: string;
+    hexImage: string;
+    scaleX: number;
+    scaleY: number;
+    static readonly properties: {
+        totalBytes: NumberConstructor;
+        bytesPerRow: NumberConstructor;
+        imageName: StringConstructor;
+        hexImage: StringConstructor;
+        scaleX: NumberConstructor;
+        scaleY: NumberConstructor;
+    };
+    constructor();
+    ready(): Promise<void>;
+    createZplImage(): string;
+    createZpl(): string;
+    private acsToCanvas;
+}

package/dist/widgets/zpl-image.js

@@ -0,0 +1,120 @@
+import { BaseCustomWebComponentConstructorAppend, css, html } from "@node-projects/base-custom-webcomponent";
+import { getZplCoordinates } from "../zplHelper.js";
+import { requestAnimationFramePromise } from "@node-projects/web-component-designer";
+export class ZplImage extends BaseCustomWebComponentConstructorAppend {
+    static style = css ` *{
+        box-sizing: border-box;
+    }
+    `;
+    static template = html `
+    <div id="wrapper">
+        <canvas id="image-div">
+        </canvas>
+    </div>
+    `;
+    static is = 'zpl-image';
+    _image;
+    _wrapper;
+    totalBytes;
+    bytesPerRow;
+    imageName;
+    hexImage;
+    scaleX;
+    scaleY;
+    static properties = {
+        totalBytes: Number,
+        bytesPerRow: Number,
+        imageName: String,
+        hexImage: String,
+        scaleX: Number,
+        scaleY: Number,
+    };
+    constructor() {
+        super();
+        this._restoreCachedInititalValues();
+        this._image = this._getDomElement("image-div");
+        this._wrapper = this._getDomElement("wrapper");
+    }
+    async ready() {
+        this._parseAttributesToProperties();
+        if (this.scaleX < 1)
+            this.scaleX = 1;
+        if (this.scaleY < 1)
+            this.scaleY = 1;
+        if (this.scaleX > 10)
+            this.scaleX = 10;
+        if (this.scaleX > 10)
+            this.scaleX = 10;
+        if (this.hexImage && this.bytesPerRow)
+            this.acsToCanvas(this.hexImage, this.bytesPerRow);
+        // this._image.style.width = 100 * this.scaleX + "%";
+        // this._image.style.aspectRatio = (this.scaleX / this.scaleY).toString();
+        this._image.style.transformOrigin = "0 0";
+        this._image.style.transform = "scaleX(" + this.scaleX + ") " + "scaleY(" + this.scaleY + ")";
+        await requestAnimationFramePromise();
+        let rect = this._image.getBoundingClientRect();
+        this._wrapper.style.width = rect.width + "px";
+        this._wrapper.style.height = rect.height + "px";
+    }
+    createZplImage() {
+        let zpl = "";
+        zpl += "~DG" + this.imageName + ",";
+        zpl += this.totalBytes + ",";
+        zpl += this.bytesPerRow + ",";
+        zpl += this.hexImage;
+        zpl = zpl.replaceAll("\n", "");
+        return zpl;
+    }
+    createZpl() {
+        let zpl = "";
+        zpl += getZplCoordinates(this, 0);
+        zpl += "^XG" + "R:" + this.imageName + "," + this.scaleX + "," + this.scaleY;
+        zpl += "^FS";
+        return zpl;
+    }
+    acsToCanvas(imageData, bytesPerRow) {
+        let hex = imageData.replaceAll(" ", "").replaceAll("\n", "").replaceAll("\r", "");
+        hex = hex.replace(/[g-zG-Y]+([0-9a-fA-F])/g, ($0, $1) => {
+            let rep = 0;
+            for (let i = 0, l = $0.length - 1; i < l; i++) {
+                let cd = $0.charCodeAt(i);
+                if (cd < 90) { // 'Z'
+                    rep += cd - 70;
+                }
+                else {
+                    rep += (cd - 102) * 20;
+                }
+            }
+            return $1.repeat(rep);
+        });
+        let bytes = Array(hex.length / 2);
+        for (let i = 0, l = hex.length; i < l; i += 2) {
+            bytes[i >> 1] = parseInt(hex.substr(i, 2), 16);
+        }
+        let l = bytes.length;
+        let w = bytesPerRow * 8; // rowl is in bytes
+        let h = ~~(l / bytesPerRow);
+        // Render the GRF to a canvas
+        let cvs = this._image;
+        cvs.width = w;
+        cvs.height = h;
+        let ctx = cvs.getContext('2d');
+        let bmap = ctx.getImageData(0, 0, w, h);
+        let data = bmap.data;
+        let offs = 0;
+        for (let i = 0; i < l; i++) {
+            let byte = bytes[i];
+            for (let bit = 0x80; bit; bit = bit >>> 1, offs += 4) {
+                if (bit & byte) {
+                    data[offs] = 0;
+                    data[offs + 1] = 0;
+                    data[offs + 2] = 0;
+                    data[offs + 3] = 255; // Fully opaque
+                }
+            }
+        }
+        ctx.putImageData(bmap, 0, 0);
+        return cvs;
+    }
+}
+customElements.define(ZplImage.is, ZplImage);

package/dist/widgets/zpl-text.d.ts

@@ -0,0 +1,25 @@
+import { BaseCustomWebComponentConstructorAppend } from "@node-projects/base-custom-webcomponent";
+declare enum FontNames {
+    Font_0 = "0",
+    Font_A = "A"
+}
+export declare class ZplText extends BaseCustomWebComponentConstructorAppend {
+    static readonly style: CSSStyleSheet;
+    static readonly template: HTMLTemplateElement;
+    static readonly is = "zpl-text";
+    content: string;
+    fontName: string;
+    fontHeight: number;
+    fontWidth: number;
+    private _text;
+    static readonly properties: {
+        content: StringConstructor;
+        fontName: typeof FontNames;
+        fontHeight: NumberConstructor;
+        fontWidth: NumberConstructor;
+    };
+    constructor();
+    ready(): Promise<void>;
+    createZpl(): string;
+}
+export {};

package/dist/widgets/zpl-text.js

@@ -0,0 +1,69 @@
+import { BaseCustomWebComponentConstructorAppend, css, html } from "@node-projects/base-custom-webcomponent";
+import { getZplCoordinates } from "../zplHelper.js";
+var FontNames;
+(function (FontNames) {
+    FontNames["Font_0"] = "0";
+    FontNames["Font_A"] = "A";
+})(FontNames || (FontNames = {}));
+export class ZplText extends BaseCustomWebComponentConstructorAppend {
+    static style = css `
+    *{
+        box-sizing: border-box;
+    }
+    `;
+    static template = html `
+    <div id="text-div" style="width: 100%; height: 100%; pointer-events: none">
+    </div>
+    `;
+    static is = 'zpl-text';
+    content;
+    fontName;
+    fontHeight;
+    fontWidth;
+    _text;
+    static properties = {
+        content: String,
+        fontName: FontNames,
+        fontHeight: Number,
+        fontWidth: Number
+    };
+    constructor() {
+        super();
+        this._restoreCachedInititalValues();
+        this._text = this._getDomElement("text-div");
+    }
+    async ready() {
+        this._parseAttributesToProperties();
+        this._text.innerHTML = this.content;
+        this._text.style.transformOrigin = "0 0";
+        switch (this.fontName) {
+            case FontNames.Font_0:
+                this._text.style.fontSize = "9px";
+                this._text.style.fontFamily = "RobotoCn, Verdana";
+                this._text.style.fontKerning = "none";
+                this._text.style.transform = "scaleX(" + this.fontWidth / 9 + ") scaleY(" + this.fontHeight / 9 + ") translate(0px, -3px)";
+                break;
+            case FontNames.Font_A:
+                this._text.style.fontSize = "9px";
+                this._text.style.fontFamily = "monospace";
+                this._text.style.transform = "scaleX(" + this.fontWidth / 5 + ") scaleY(" + this.fontHeight / 8 + ") translate(0px, -3px)";
+                break;
+        }
+        this.style.width = '';
+        this.style.height = '';
+        requestAnimationFrame(() => {
+            let rect = this._text.getBoundingClientRect();
+            this.style.width = rect.width + 'px';
+            this.style.height = rect.height / 2 + 'px';
+        });
+    }
+    createZpl() {
+        let zpl = "";
+        zpl += getZplCoordinates(this, 0);
+        zpl += "^CF" + this.fontName + "," + this.fontHeight + "," + this.fontWidth;
+        zpl += "^FD" + this.content;
+        zpl += "^FS";
+        return zpl;
+    }
+}
+customElements.define(ZplText.is, ZplText);

package/dist/zplHelper.d.ts

@@ -0,0 +1 @@
+export declare function getZplCoordinates(obj: any, alignment: 0 | 1 | 2): string;

package/dist/zplHelper.js

@@ -0,0 +1,5 @@
+export function getZplCoordinates(obj, alignment) {
+    let x = obj.style.left.replace("px", "");
+    let y = obj.style.top.replace("px", "");
+    return "^FO" + x + "," + y + "," + alignment;
+}