UNPKG

smart-webcomponents-angular

Version:

[![Price](https://img.shields.io/badge/price-COMMERCIAL-0098f7.svg)](https://jqwidgets.com/license/)

116 lines (115 loc) 10.1 kB
import { QRcode } from './../index'; import { QRcodeLabelPosition, QRcodeRenderAs } from './../index'; import { AfterViewInit, ElementRef, OnInit, OnChanges, OnDestroy, SimpleChanges, EventEmitter } from '@angular/core'; import { BaseElement } from './smart.element'; import * as i0 from "@angular/core"; export { QRcodeLabelPosition, QRcodeRenderAs, ElementRenderMode } from './../index'; export { Smart } from './smart.element'; export { QRcode } from './../index'; export declare class QRcodeComponent extends BaseElement implements OnInit, AfterViewInit, OnDestroy, OnChanges { constructor(ref: ElementRef<QRcode>); private eventHandlers; nativeElement: QRcode; /** @description Creates the component on demand. * @param properties An optional object of properties, which will be added to the template binded ones. */ createComponent(properties?: {}): any; /** @description Specifies the background color applied to the QR Code element, determining the area behind the QR pattern. Accepts any valid CSS color value (e.g., hexadecimal, RGB, or color names). This setting allows you to customize the appearance of the QR Code to match your application's design. */ get backgroundColor(): string; set backgroundColor(value: string); /** @description Determines whether the label associated with the QR Code is displayed to users. When enabled, the label will appear alongside the QR Code; when disabled, the label will be hidden. */ get displayLabel(): boolean; set displayLabel(value: boolean); /** @description Embeds an image directly within the file, allowing the image to be displayed without referencing an external URL. This ensures the image is self-contained and always available as part of the JSON data. */ get embedImage(): string; set embedImage(value: string); /** @description Specifies the degree of error correction to be applied, determining how much of the data can be recovered if the file or code is partially damaged or obscured. Higher error correction levels provide more robust data recovery but may increase the file size. */ get errorLevel(): string; set errorLevel(value: string); /** @description Specifies the color that will fill the transparent areas of the embedded image. If this property is set to an empty string, the transparent regions will remain fully transparent, allowing the background beneath the image to show through. */ get imageBackgroundColor(): string; set imageBackgroundColor(value: string); /** @description Specifies the vertical dimension, in pixels or percentage, to display the embedded image. This determines how tall the image will appear within its container, regardless of its original size. */ get imageHeight(): number; set imageHeight(value: number); /** @description Specifies the width, in pixels or other valid CSS units, for displaying the embedded image. This determines how wide the image will appear within its container on the webpage. */ get imageWidth(): number; set imageWidth(value: number); /** @description Specifies the color used for the text label displayed below or alongside the QR Code. Accepts color values in standard formats such as hex codes (e.g., "#000000"), RGB, or named CSS colors. */ get labelColor(): string; set labelColor(value: string); /** @description Specifies the font family to be used for displaying the QR code label text. This determines the typeface style (e.g., Arial, Verdana, 'Times New Roman') applied to the label beneath or beside the QR code. */ get labelFont(): string; set labelFont(value: string); /** @description Specifies the font size used for the text label displayed below or alongside the QR code. Adjusting this value changes how large or small the label text appears relative to the QR code. Supports standard CSS size units (e.g., px, em, rem). */ get labelFontSize(): number; set labelFontSize(value: number); /** @description Specifies the amount of space (in pixels, ems, or other CSS units) added to the bottom of the QR Code label, effectively controlling the distance between the label and the elements below it. */ get labelMarginBottom(): number; set labelMarginBottom(value: number); /** @description Specifies the amount of space (in pixels or other CSS units) added to the top of the QR Code label, effectively controlling the distance between the label and any elements positioned above it. */ get labelMarginTop(): number; set labelMarginTop(value: number); /** @description Specifies the placement of the label relative to the QR Code, such as positioning it above, below, to the left, or to the right of the QR Code. This property determines where the label will appear in relation to the generated QR Code image. */ get labelPosition(): QRcodeLabelPosition | string; set labelPosition(value: QRcodeLabelPosition | string); /** @description Specifies the color used for the QR Code’s foreground lines (modules or squares), determining how the QR Code pattern appears. Accepts color formats such as HEX, RGB, or named colors. The background color is not affected by this setting. */ get lineColor(): string; set lineColor(value: string); /** @description Specifies the width of the generated QR Code, in pixels. This value determines the size of the QR Code square displayed on the page. */ get squareWidth(): number; set squareWidth(value: number); /** @description Specifies the rendering method used to display the QR Code, such as SVG, Canvas, or Image. This determines how the QR Code is visually generated and presented in the application. */ get renderAs(): QRcodeRenderAs | string; set renderAs(value: QRcodeRenderAs | string); /** @description Gets or sets the content encoded in the QR Code, such as a URL, text, or other data. Use this property to specify or retrieve the information that will be embedded within the generated QR Code. */ get value(): string; set value(value: string); /** @description Specifies or retrieves the width of the QR Code in pixels. If set to 0, the width will be determined automatically based on the QR Code’s content and configuration, ensuring optimal sizing. Setting a specific positive value allows you to control the exact width of the generated QR Code. */ get width(): number; set width(value: number); /** @description Specifies or retrieves the height of the QR code, in pixels. When a value of 0 is assigned, the component automatically calculates and sets the optimal height based on the content and other configuration options. Otherwise, the QR code is rendered with the specified height. */ get height(): number; set height(value: number); /** @description This event is triggered when the QR Code fails validation—specifically, when its decoded value does not meet the expected format, content requirements, or integrity checks. Developers can listen for this event to handle errors, display user feedback, or prompt for a new QR Code input. * @param event. The custom event. Custom event was created with: event.detail( invalidCharacters, lengthValidity, patternValidity, value) * invalidCharacters - An array indicating the invalid characters. * lengthValidity - A boolean indicating the length validity. * patternValidity - A boolean indicating the pattern validity. * value - the invalid value of the QR Code. */ onInvalid: EventEmitter<CustomEvent>; /** @description Exports the generated QR Code image in a selected format, such as PNG or SVG, allowing users to download or save the QR Code for use in other applications. * @param {string} format. The format of the exported file - svg, png, jpg * @param {string} fileName?. The name of the exported file */ export(format: string, fileName?: string): void; /** @description Retrieves the QR Code as a base64-encoded string representation of the image, suitable for embedding directly in HTML or storing for later use. * @param {string} format. The dataURL format of the string - svg, png, jpg * @returns {string} */ getDataURL(format: any): Promise<any>; getDataURLSync(format: any): string; /** @description Retrieves the QR code as a Base64-encoded string, allowing you to easily embed or transfer the QR code image in web pages, APIs, or data storage without handling image files directly. * @param {string} format. The dataURL format of the string - svg, png, jpg * @returns {any} */ getDataURLAsync(format: any): Promise<any>; getDataURLAsyncSync(format: any): any; /** @description Retrieves and returns the current validity status of the QR Code, indicating whether the QR Code is active, expired, or invalid. * @returns {boolean} */ isValid(): Promise<any>; isValidSync(): boolean; get isRendered(): boolean; ngOnInit(): void; ngAfterViewInit(): void; ngOnDestroy(): void; ngOnChanges(changes: SimpleChanges): void; /** @description Add event listeners. */ private listen; /** @description Remove event listeners. */ private unlisten; static ɵfac: i0.ɵɵFactoryDeclaration<QRcodeComponent, never>; static ɵdir: i0.ɵɵDirectiveDeclaration<QRcodeComponent, "smart-qrcode, [smart-qrcode]", ["smart-qrcode"], { "backgroundColor": "backgroundColor"; "displayLabel": "displayLabel"; "embedImage": "embedImage"; "errorLevel": "errorLevel"; "imageBackgroundColor": "imageBackgroundColor"; "imageHeight": "imageHeight"; "imageWidth": "imageWidth"; "labelColor": "labelColor"; "labelFont": "labelFont"; "labelFontSize": "labelFontSize"; "labelMarginBottom": "labelMarginBottom"; "labelMarginTop": "labelMarginTop"; "labelPosition": "labelPosition"; "lineColor": "lineColor"; "squareWidth": "squareWidth"; "renderAs": "renderAs"; "value": "value"; "width": "width"; "height": "height"; }, { "onInvalid": "onInvalid"; }, never>; }