@lglab/react-qr-code 1.1.0 → 1.2.0

package/dist/index.d.ts

@@ -1,5 +1,9 @@
 import { JSX } from 'react/jsx-runtime';
-import { Ref } from 'react';
+
+/**
+ * ReactQRCode props.
+ */
+export declare type BackgroundSettings = string | GradientSettings;
 
 export declare type CrossOrigin = 'anonymous' | 'use-credentials' | '' | undefined;
 
@@ -9,9 +13,6 @@ export declare interface DataModulesSettings {
     randomSize?: boolean;
 }
 
-/**
- * ReactQRCode props.
- */
 export declare type DataModulesStyle = 'square' | 'square-sm' | 'rounded' | 'leaf' | 'vertical-line' | 'horizontal-line' | 'circle' | 'diamond' | 'star' | 'heart';
 
 export declare type DownloadFileFormat = 'svg' | 'png' | 'jpeg';
@@ -49,6 +50,19 @@ export declare interface FinderPatternOuterSettings {
 
 export declare type FinderPatternOuterStyle = 'square' | 'rounded-sm' | 'rounded' | 'rounded-lg' | 'circle' | 'inpoint-sm' | 'inpoint' | 'inpoint-lg' | 'outpoint-sm' | 'outpoint' | 'outpoint-lg' | 'leaf-sm' | 'leaf' | 'leaf-lg';
 
+export declare interface GradientSettings {
+    type: GradientSettingsType;
+    stops: GradientSettingsStop[];
+    rotation?: number;
+}
+
+export declare interface GradientSettingsStop {
+    offset: string;
+    color: string;
+}
+
+export declare type GradientSettingsType = 'linear' | 'radial';
+
 /**
  * Image settings for the QR Code.
  */
@@ -210,7 +224,7 @@ export declare const ReactQRCode: {
 };
 
 export declare interface ReactQRCodeProps {
-    ref?: Ref<ReactQRCodeRef>;
+    ref?: React.Ref<ReactQRCodeRef>;
     /**
      * The value to encode into the QR Code. An array of strings can be passed in
      * to represent multiple segments to further optimize the QR Code.
@@ -250,11 +264,14 @@ export declare interface ReactQRCodeProps {
      */
     boostLevel?: boolean;
     /**
-     * The background color used to render the QR Code.
-     * @see https://developer.mozilla.org/en-US/docs/Web/CSS/color_value
+     * The QR code background either a hex color or GradientSettings.
      * @defaultValue #FFFFFF
      */
-    bgColor?: string;
+    background?: BackgroundSettings;
+    /**
+     * The gradient settings applied to the qr code data modules and finder patterns.
+     */
+    gradient?: GradientSettings;
     /**
      * The settings for the data modules.
      */