@progress/kendo-angular-barcodes/chart-types/qrcode-types.d.ts

Kendo UI Angular Barcodes

/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { Border, Padding, RenderMode } from './field-types';
/**
 * The QR Code encoding modes.
 */
export type QRCodeEncoding = 'ISO_8859_1' | 'UTF_8';
/**
 * The QR Code error correction levels.
 *
 * * `"L"`—Approximately 7% of the codewords can be restored.
 * * `"M"`—Approximately 15% of the codewords can be restored.
 * * `"Q"`—Approximately 25% of the codewords can be restored.
 * * `"H"`—Approximately 30% of the codewords can be restored.
 */
export type QRCodeErrorCorrection = 'L' | 'M' | 'Q' | 'H';
/**
 * The image overlay configuration of the QR Code.
 */
export interface QRCodeOverlay {
    /**
     * The overlay height in pixels.
     */
    height?: number;
    /**
     * The source image for the overlay.
     *
     * Required only when `type` is set to `'image'`.
     */
    imageUrl?: string;
    /**
     * The overlay type.
     *
     * @default 'image'
     */
    type?: 'image' | 'swiss';
    /**
     * The overlay width in pixels.
     */
    width?: number;
}
/**
 * The QR Code configuration options.
 */
export interface QRCodeOptions {
    /**
     * The background color of the QR Code. Accepts a valid CSS color string, including hex and rgb.
     *
     * @default "white"
     */
    background?: string;
    /**
     * The border of the QR Code.
     */
    border?: Border;
    /**
     * The color of the QR Code. Accepts a valid CSS color string, including hex and rgb.
     *
     * @default "black"
     */
    color?: string;
    /**
     * The encoding mode used to encode the value.
     *
     * > **Important** The UTF-8 encoding is not included in the specifications and is not supported by all readers.
     *
     * The possible values are:
     * * `"ISO_8859_1"`—Supports all characters from the [ISO/IEC 8859-1](https://en.wikipedia.org/wiki/ISO/IEC_8859-1) character set.
     * * `"UTF_8"`—Supports all [Unicode](https://en.wikipedia.org/wiki/List_of_Unicode_characters) characters.
     *
     * @default "ISO_8859_1"
     */
    encoding?: QRCodeEncoding;
    /**
     * The error correction level to use.
     *
     * The possible values are:
     * * `"L"`—Approximately 7% of the codewords can be restored.
     * * `"M"`—Approximately 15% of the codewords can be restored.
     * * `"Q"`—Approximately 25% of the codewords can be restored.
     * * `"H"`—Approximately 30% of the codewords can be restored.
     *
     * @default "L"
     */
    errorCorrection?: QRCodeErrorCorrection;
    /**
     * An optional image overlay that will placed over the QR Code.
     *
     * > **Note** Always test if the code reads correctly with the applied overlay.
     * > Depending on the length of the value and the size of the overlay, you might need to raise the `errorCorrection` level to `"M"` or `"H"`.
     */
    overlay?: QRCodeOverlay;
    /**
     * The padding of the QR Code. A numeric value sets all paddings.
     *
     * @default 0
     */
    padding?: Padding | number;
    /**
     * Sets the preferred rendering mode of the QR Code.
     *
     * The supported values are:
     * * `"canvas"`—Renders the component as a Canvas element.
     * * `"svg"`—Renders the component as an inline SVG document.
     *
     * @default "svg"
     */
    renderAs?: RenderMode;
    /**
     * Specifies the size of a QR Code. Numeric values are treated as pixels.
     *
     * If no size is specified, the size will be determined from the element width and height.
     * If the element has width or height of zero, a default value of 200 pixels will be used.
     *
     * @default "200px"
     */
    size?: number | string;
    /**
     * The value of the QR Code.
     */
    value: number | string;
}