/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { ElementRef, NgZone, Renderer2 } from '@angular/core';
import { QRCode, QRCodeOptions } from '@progress/kendo-charts';
import { BaseComponent } from './base.component';
import { Border, QRCodeEncoding, QRCodeErrorCorrection, QRCodeOverlay, RenderMode } from './chart-types';
import * as i0 from "@angular/core";
/**
* Represents the Kendo UI QR Code component for Angular.
*
* @example
* ```ts
* import { Component } from '@angular/core';
*
* _@Component({
* selector: 'my-app',
* template: `
*
*
* `
* })
* export class AppComponent {
* }
* ```
*/
export declare class QRCodeComponent extends BaseComponent {
protected element: ElementRef;
protected renderer: Renderer2;
protected ngZone: NgZone;
/**
* The background color of the QR Code. Accepts a valid CSS color string, including hex and rgb.
*
* @default "white"
*
* @example
* ```ts-preview
* import { Component } from '@angular/core';
*
* _@Component({
* selector: 'my-app',
* template: `
*
*
* `
* })
* export class AppComponent {
* }
* ```
*/
background?: string;
/**
* The border of the QR Code.
*
* @example
* ```ts-preview
* import { Component } from '@angular/core';
* import { Border } from '@progress/kendo-angular-barcodes';
*
* _@Component({
* selector: 'my-app',
* template: `
*
*
* `
* })
* export class AppComponent {
* qrcodeBorder: Border = {
* color: '#fc0',
* width: 2
* };
* }
* ```
*/
border?: Border;
/**
* The color of the QR Code. Accepts a valid CSS color string, including hex and rgb.
*
* @default "black"
*
* @example
* ```ts-preview
* _@Component({
* selector: 'my-app',
* template: `
*
*
* `
* })
* export class AppComponent {
* }
* ```
*/
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"
*
* @example
* ```ts-preview
* _@Component({
* selector: 'my-app',
* template: `
*
*
* `
* })
* export class AppComponent {
* }
* ```
*/
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"
*
* @example
* ```ts-preview
* _@Component({
* selector: 'my-app',
* template: `
*
*
* `
* })
* export class AppComponent {
* }
* ```
*/
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"`.
*
* @example
* ```ts-preview
* import { QRCodeOverlay } from '@progress/kendo-angular-barcodes';
*
* _@Component({
* selector: 'my-app',
* template: `
*
*
* `
* })
* export class AppComponent {
* qrcodeOverlay: QRCodeOverlay = {
* type: 'swiss'
* };
* }
* ```
*/
overlay?: QRCodeOverlay;
/**
* The padding of the QR Code. The value sets all paddings in pixels.
*
* @default 0
*
* @example
* ```ts-preview
* import { Component } from '@angular/core';
*
* _@Component({
* selector: 'my-app',
* template: `
*
*
* `
* })
* export class AppComponent {
* }
* ```
*/
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"
*
* @example
* ```ts-preview
* _@Component({
* selector: 'my-app',
* template: `
*
*
* `
* })
* export class AppComponent {
* }
* ```
*/
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"
*
* @example
* ```ts-preview
* _@Component({
* selector: 'my-app',
* template: `
*
*
*
*
*
* `
* })
* export class AppComponent {
* }
* ```
*/
size?: number | string;
/**
* The value of the QR Code.
*
* @example
* ```ts-preview
* _@Component({
* selector: 'my-app',
* template: `
*
*
* `
* })
* export class AppComponent {
* }
* ```
*/
value: number | string;
/**
* Limits the automatic resizing of the QR Code. Sets the maximum number of times per second
* that the component redraws its content when the size of its container changes.
* Defaults to `10`. To disable the automatic resizing, set it to `0`.
*
* @example
* ```ts
* _@Component({
* selector: 'my-app',
* template: `
*
*
* `
* })
* export class AppComponent {
* }
* ```
*/
resizeRateLimit: number;
protected get options(): QRCodeOptions;
constructor(element: ElementRef, renderer: Renderer2, ngZone: NgZone);
protected createInstance(element: any, options: any): QRCode;
protected onError(error: Error): void;
static ɵfac: i0.ɵɵFactoryDeclaration;
static ɵcmp: i0.ɵɵComponentDeclaration;
}