@liquid-js/qr-code-styling/lib/utils/options.d.ts

Generate styled QR codes on web or in Node

import { ErrorCorrectionLevel, Mode, TypeNumber } from '@liquid-js/qrcode-generator/lib/qrcode/QRCodeMinimal.js';
import { browserImageTools } from '../tools/browser-image-tools.js';
import { DrawArgs } from '../types/helper.js';
import { Gradient } from './gradient.js';
export declare enum DotType {
    dot = "dot",
    randomDot = "random-dot",
    rounded = "rounded",
    extraRounded = "extra-rounded",
    verticalLine = "vertical-line",
    horizontalLine = "horizontal-line",
    classy = "classy",
    classyRounded = "classy-rounded",
    square = "square",
    smallSquare = "small-square",
    tinySquare = "tiny-square",
    diamond = "diamond",
    wave = "wave",
    heart = "heart",
    star = "star",
    weave = "weave",
    pentagon = "pentagon",
    hexagon = "hexagon",
    zebraHorizontal = "zebra-horizontal",
    zebraVertical = "zebra-vertical",
    blocksHorizontal = "blocks-horizontal",
    blocksVertical = "blocks-vertical"
}
export declare enum CornerDotType {
    dot = "dot",
    square = "square",
    heart = "heart",
    extraRounded = "extra-rounded",
    classy = "classy",
    inpoint = "inpoint",
    outpoint = "outpoint",
    star = "star",
    pentagon = "pentagon",
    hexagon = "hexagon",
    diamond = "diamond"
}
export declare enum CornerSquareType {
    dot = "dot",
    square = "square",
    extraRounded = "extra-rounded",
    classy = "classy",
    inpoint = "inpoint",
    outpoint = "outpoint",
    centerCircle = "center-circle"
}
export declare enum ShapeType {
    square = "square",
    circle = "circle"
}
export declare enum ImageMode {
    /**
     * Place image in the center of the code
     */
    center = "center",
    /**
     * Place image over the center of the code
     */
    overlay = "overlay",
    /**
     * Use image as background, draw dots over it
     */
    background = "background"
}
export interface Plugin {
    /**
     * Draw a single dot
     *
     * @returns Dot element; if undefined, try to use the next plugin or the default function
     */
    drawDot?: (args: DrawArgs) => SVGElement | undefined;
    /**
     * Draw corner dot
     *
     * @returns Corner dot element; if undefined, try to use the next plugin or the default function
     */
    drawCornerDot?: (args: DrawArgs) => SVGElement | undefined;
    /**
     * Draw corner square
     *
     * @returns Corner square element and corner mask (used with ImageMode.background); if undefined, try to use the next plugin or the default function
     */
    drawCornerSquare?: (args: DrawArgs) => readonly [SVGElement, SVGElement] | undefined;
    /**
     * Alter the generated SVG, e.g. add borders
     */
    postProcess?: (svg: SVGSVGElement, options: Options) => void;
}
export interface Options {
    /** Use a custom DOM domplementation */
    document: Document;
    /** Use a custom image fetching & serializaton implementation */
    imageTools?: typeof browserImageTools;
    /** @ignore */
    width: number;
    /** @ignore */
    height: number;
    /** The data will be encoded in the QR code */
    data: string;
    /** The image will be copied to the center of the QR code */
    image?: string | Buffer | Blob;
    /**
     * QR code shape
     *
     * @default ShapeType.square
     */
    shape: `${ShapeType}`;
    /** Options will be passed to `@liquid-js/qrcode-generator` lib */
    qrOptions: {
        typeNumber: TypeNumber;
        mode?: `${Mode}`;
        /** @default ErrorCorrectionLevel.Q */
        errorCorrectionLevel: `${ErrorCorrectionLevel}`;
    };
    imageOptions: {
        /**
         * Image mode
         *
         * @default ImageMode.center
         */
        mode: `${ImageMode}`;
        /**
         * Fill blank areas of the code with selected color
         */
        fill: {
            /**
             * Color of QR dots
             *
             * @default "rgba(255,255,255,0.75)"
             */
            color: string;
            /** Gradient of Corners Dot */
            gradient?: Gradient;
        };
        /**
         * Coefficient of the image size
         *
         * @default 0.4
         */
        imageSize: number;
        /**
         * Margin of the image (in blocks)
         *
         * @default 0
         */
        margin: number;
        /**
         * [MDN Reference](https://developer.mozilla.org/docs/Web/API/HTMLImageElement/crossOrigin)
         */
        crossOrigin?: string;
    };
    dotsOptions: {
        /**
         * QR dot size (in pixels)
         *
         * @default 10
         */
        size: number;
        /**
         * Color of QR dots
         *
         * @default "#000"
         */
        color: string;
        /** Gradient of QR dots */
        gradient?: Gradient;
        /**
         * Style of QR dots
         *
         * @default DotType.square
         */
        type: `${DotType}`;
    };
    /** Corners Square options, omitted values match dots */
    cornersSquareOptions?: {
        /** Color of Corners Square */
        color?: string;
        /** Gradient of Corners Square */
        gradient?: Gradient;
        /** Style of Corners Square */
        type?: `${CornerSquareType | DotType}`;
    };
    /** Corners Dot options, omitted values match squares */
    cornersDotOptions?: {
        /** Color of Corners Dot */
        color?: string;
        /** Gradient of Corners Dot */
        gradient?: Gradient;
        /** Style of Corners Dot */
        type?: `${CornerDotType | DotType}`;
    };
    /** QR background styling options, false to disable background */
    backgroundOptions?: {
        /** Background roundnes, from 0 (square) to 1 (circle) */
        round?: number;
        /** Background color */
        color?: string;
        /** Background Gradient */
        gradient?: Gradient;
        /**
         * Margin (in blocks) between background and the QR code
         *
         * @default 0
         */
        margin?: number;
    } | false;
    /** `import { stringToBytesFuncs } from "@liquid-js/qr-code-styling/kanji";` to add Kanji support */
    stringToBytesFuncs?: {
        [encoding: string]: (s: string) => number[];
    };
    plugins?: Plugin[];
}
export declare const defaultOptions: Options;
export declare function sanitizeOptions(options: Options): Options;