dynamsoft-barcode-reader-bundle 11.4.2000-beta-202604152312 → 11.4.2000-beta-202604191847

package/README.html

@@ -296,7 +296,7 @@
     cvRouter.setInput(cameraEnhancer);
 
     <span class="hljs-keyword">const</span> resultsContainer = <span class="hljs-built_in">document</span>.querySelector(<span class="hljs-string">&quot;#results&quot;</span>);
-    cvRouter.addResultReceiver({ <span class="hljs-attr">onDecodedBarcodesReceived</span>: <span class="hljs-function">(<span class="hljs-params">result</span>) =&gt;</span> {
+    <span class="hljs-keyword">await</span> cvRouter.addResultReceiver({ <span class="hljs-attr">onDecodedBarcodesReceived</span>: <span class="hljs-function">(<span class="hljs-params">result</span>) =&gt;</span> {
       <span class="hljs-keyword">if</span> (result.barcodeResultItems?.length) {
         resultsContainer.textContent = <span class="hljs-string">&#x27;&#x27;</span>;
         <span class="hljs-keyword">for</span> (<span class="hljs-keyword">let</span> item <span class="hljs-keyword">of</span> result.barcodeResultItems) {
@@ -471,7 +471,7 @@ Dynamsoft.Core.CoreModule.engineResourcePaths.rootDirectory = <span class="hljs-
 <h3 id="step-1-preload-the-module">Step 1: Preload the module</h3>
 <p>The image processing logic is encapsulated within .wasm library files, and these files may require some time for downloading. To enhance the speed, we advise utilizing the following method to preload the libraries.</p>
 <pre><code class="hljs js language-js"><span class="hljs-comment">// Preload the .wasm files</span>
-<span class="hljs-keyword">await</span> Dynamsoft.Core.CoreModule.loadWasm();
+Dynamsoft.Core.CoreModule.loadWasm();
 </code></pre>
 <h3 id="step-2-create-a-capturevisionrouter-object">Step 2: Create a CaptureVisionRouter object</h3>
 <p>To use the SDK, we first create a <code>CaptureVisionRouter</code> object.</p>
@@ -523,11 +523,11 @@ resultReceiver.onDecodedBarcodesReceived  = <span class="hljs-function">(<span c
     }
   }
 };
-cvRouter.addResultReceiver(resultReceiver);
+<span class="hljs-keyword">await</span> cvRouter.addResultReceiver(resultReceiver);
 </code></pre>
 <p>You can also write code like this. It is the same.</p>
 <pre><code class="hljs javascript language-javascript"><span class="hljs-keyword">const</span> resultsContainer = <span class="hljs-built_in">document</span>.querySelector(<span class="hljs-string">&quot;#results&quot;</span>);
-cvRouter.addResultReceiver({ <span class="hljs-attr">onDecodedBarcodesReceived</span>: <span class="hljs-function">(<span class="hljs-params">result</span>) =&gt;</span> {
+<span class="hljs-keyword">await</span> cvRouter.addResultReceiver({ <span class="hljs-attr">onDecodedBarcodesReceived</span>: <span class="hljs-function">(<span class="hljs-params">result</span>) =&gt;</span> {
   <span class="hljs-keyword">if</span> (result.barcodeResultItems?.length) {
     resultsContainer.textContent = <span class="hljs-string">&#x27;&#x27;</span>;
     <span class="hljs-keyword">for</span> (<span class="hljs-keyword">let</span> item <span class="hljs-keyword">of</span> result.barcodeResultItems) {
@@ -619,7 +619,7 @@ settings.barcodeSettings.barcodeFormatIds = Dynamsoft.DBR.EnumBarcodeFormat.BF_Q
 <p>Please be aware that it is necessary to update the <code>CapturedResultReceiver</code> object to obtain the original image. For instance:</p>
 <pre><code class="hljs javascript language-javascript"><span class="hljs-keyword">const</span> EnumCRIT = Dynamsoft.Core.EnumCapturedResultItemType; <span class="hljs-comment">// Enum for captured result item types.</span>
 <span class="hljs-comment">// Create a result receiver to handle the results.</span>
-cvRouter.addResultReceiver({
+<span class="hljs-keyword">await</span> cvRouter.addResultReceiver({
   <span class="hljs-comment">// This function is called when any capture result is received.</span>
   <span class="hljs-attr">onCapturedResultReceived</span>: <span class="hljs-function">(<span class="hljs-params">result</span>) =&gt;</span> {
     <span class="hljs-comment">//Check for barcode results</span>
@@ -745,24 +745,24 @@ resultReceiver.onDecodedBarcodesReceived = <span class="hljs-function">(<span cl
     Dynamsoft.DCE.Feedback.beep();
   }
 };
-cvRouter.addResultReceiver(resultReceiver);
+<span class="hljs-keyword">await</span> cvRouter.addResultReceiver(resultReceiver);
 </code></pre>
 <h2 id="customizing-the-ui">Customizing the UI</h2>
 <pre><code class="hljs javascript language-javascript"><span class="hljs-comment">// Create a CameraView instance with default settings</span>
 <span class="hljs-keyword">let</span> cameraView = <span class="hljs-keyword">await</span> Dynamsoft.DCE.CameraView.createInstance();
-<span class="hljs-comment">// Create a CameraView instance with a specified HTML file path, typically a local or remote URL</span>
-<span class="hljs-keyword">let</span> cameraView1 = <span class="hljs-keyword">await</span> Dynamsoft.DCE.CameraView.createInstance(<span class="hljs-string">&#x27;@engineResourcePath/dce.mobile-native.ui.html&#x27;</span>);
+<span class="hljs-comment">// Create a CameraView instance with a specified XML file path, typically a local or remote URL</span>
+<span class="hljs-keyword">let</span> cameraView1 = <span class="hljs-keyword">await</span> Dynamsoft.DCE.CameraView.createInstance(<span class="hljs-string">&#x27;@engineResourcePath/dce.ui.v5.xml&#x27;</span>);
 <span class="hljs-comment">// Create a CameraView instance within a specified DOM element</span>
 <span class="hljs-keyword">let</span> cameraView2 = <span class="hljs-keyword">await</span> Dynamsoft.DCE.CameraView.createInstance(<span class="hljs-built_in">document</span>.getElementById(<span class="hljs-string">&#x27;my-ui&#x27;</span>));
 <span class="hljs-comment">// Create a CameraView instance using a custom UI file path</span>
-<span class="hljs-keyword">let</span> cameraView3 = <span class="hljs-keyword">await</span> Dynamsoft.DCE.CameraView.createInstance(<span class="hljs-string">&#x27;url/to/my/ui.html&#x27;</span>);
+<span class="hljs-keyword">let</span> cameraView3 = <span class="hljs-keyword">await</span> Dynamsoft.DCE.CameraView.createInstance(<span class="hljs-string">&#x27;url/to/my/ui.xml&#x27;</span>);
 
 <span class="hljs-comment">// Get the UI element associated with the cameraView instance</span>
 <span class="hljs-keyword">let</span> uiElement = cameraView.getUIElement();
 <span class="hljs-comment">// Remove the camera selection dropdown from the CameraView&#x27;s UI element</span>
-uiElement.shadowRoot.querySelector(<span class="hljs-string">&#x27;.dce-sel-camera&#x27;</span>).remove();
+uiElement.querySelector(<span class="hljs-string">&#x27;.dce-sel-camera&#x27;</span>).remove();
 <span class="hljs-comment">// Remove the resolution selection dropdown from the CameraView&#x27;s UI element</span>
-uiElement.shadowRoot.querySelector(<span class="hljs-string">&#x27;.dce-sel-resolution&#x27;</span>).remove();
+uiElement.querySelector(<span class="hljs-string">&#x27;.dce-sel-resolution&#x27;</span>).remove();
 </code></pre>
 <p>The UI is part of the auxiliary SDK "Dynamsoft Camera Enhancer", read more on how to <a href="https://www.dynamsoft.com/barcode-reader/docs/core/programming/features/ui-customization-js.html?lang=js">customize the UI</a>.</p>
 <h2 id="documentation">Documentation</h2>
@@ -800,7 +800,7 @@ The following table is a list of supported browsers based on the above requireme
 
   | Browser Name |     Version      |
   | :----------: | :--------------: |
-  |    Chrome    | v78+<sup>1</sup> |
+  |    Chrome    | v88+<sup>1</sup> |
   |   Firefox    | v68+<sup>1</sup> |
   |     Edge     |       v79+       |
   |    Safari    |       v14+       |

package/README.md

@@ -83,7 +83,7 @@ The complete code of the "Hello World" example is shown below
     cvRouter.setInput(cameraEnhancer);
 
     const resultsContainer = document.querySelector("#results");
-    cvRouter.addResultReceiver({ onDecodedBarcodesReceived: (result) => {
+    await cvRouter.addResultReceiver({ onDecodedBarcodesReceived: (result) => {
       if (result.barcodeResultItems?.length) {
         resultsContainer.textContent = '';
         for (let item of result.barcodeResultItems) {
@@ -304,7 +304,7 @@ The image processing logic is encapsulated within .wasm library files, and these
 
 ```js
 // Preload the .wasm files
-await Dynamsoft.Core.CoreModule.loadWasm();
+Dynamsoft.Core.CoreModule.loadWasm();
 ```
 
 ### Step 2: Create a CaptureVisionRouter object
@@ -375,14 +375,14 @@ resultReceiver.onDecodedBarcodesReceived  = (result) => {
     }
   }
 };
-cvRouter.addResultReceiver(resultReceiver);
+await cvRouter.addResultReceiver(resultReceiver);
 ```
 
 You can also write code like this. It is the same.
 
 ```javascript
 const resultsContainer = document.querySelector("#results");
-cvRouter.addResultReceiver({ onDecodedBarcodesReceived: (result) => {
+await cvRouter.addResultReceiver({ onDecodedBarcodesReceived: (result) => {
   if (result.barcodeResultItems?.length) {
     resultsContainer.textContent = '';
     for (let item of result.barcodeResultItems) {
@@ -469,7 +469,7 @@ Please be aware that it is necessary to update the `CapturedResultReceiver` obje
 ```javascript
 const EnumCRIT = Dynamsoft.Core.EnumCapturedResultItemType; // Enum for captured result item types.
 // Create a result receiver to handle the results.
-cvRouter.addResultReceiver({
+await cvRouter.addResultReceiver({
   // This function is called when any capture result is received.
   onCapturedResultReceived: (result) => {
     //Check for barcode results
@@ -634,7 +634,7 @@ resultReceiver.onDecodedBarcodesReceived = (result) => {
     Dynamsoft.DCE.Feedback.beep();
   }
 };
-cvRouter.addResultReceiver(resultReceiver);
+await cvRouter.addResultReceiver(resultReceiver);
 ```
 
 ## Customizing the UI
@@ -642,19 +642,19 @@ cvRouter.addResultReceiver(resultReceiver);
 ```javascript
 // Create a CameraView instance with default settings
 let cameraView = await Dynamsoft.DCE.CameraView.createInstance();
-// Create a CameraView instance with a specified HTML file path, typically a local or remote URL
-let cameraView1 = await Dynamsoft.DCE.CameraView.createInstance('@engineResourcePath/dce.mobile-native.ui.html');
+// Create a CameraView instance with a specified XML file path, typically a local or remote URL
+let cameraView1 = await Dynamsoft.DCE.CameraView.createInstance('@engineResourcePath/dce.ui.v5.xml');
 // Create a CameraView instance within a specified DOM element
 let cameraView2 = await Dynamsoft.DCE.CameraView.createInstance(document.getElementById('my-ui'));
 // Create a CameraView instance using a custom UI file path
-let cameraView3 = await Dynamsoft.DCE.CameraView.createInstance('url/to/my/ui.html');
+let cameraView3 = await Dynamsoft.DCE.CameraView.createInstance('url/to/my/ui.xml');
 
 // Get the UI element associated with the cameraView instance
 let uiElement = cameraView.getUIElement();
 // Remove the camera selection dropdown from the CameraView's UI element
-uiElement.shadowRoot.querySelector('.dce-sel-camera').remove();
+uiElement.querySelector('.dce-sel-camera').remove();
 // Remove the resolution selection dropdown from the CameraView's UI element
-uiElement.shadowRoot.querySelector('.dce-sel-resolution').remove();
+uiElement.querySelector('.dce-sel-resolution').remove();
 ```
 
 The UI is part of the auxiliary SDK "Dynamsoft Camera Enhancer", read more on how to [customize the UI](https://www.dynamsoft.com/barcode-reader/docs/core/programming/features/ui-customization-js.html?lang=js).
@@ -697,7 +697,7 @@ The following table is a list of supported browsers based on the above requireme
 
   | Browser Name |     Version      |
   | :----------: | :--------------: |
-  |    Chrome    | v78+<sup>1</sup> |
+  |    Chrome    | v88+<sup>1</sup> |
   |   Firefox    | v68+<sup>1</sup> |
   |     Edge     |       v79+       |
   |    Safari    |       v14+       |

package/dist/dbr.bundle.d.ts

@@ -3318,7 +3318,7 @@ declare class Camera {
         resolve: () => void;
         reject: () => void;
     };
-    _openTimeout: number;
+    _getUserMediaTimeout: number;
     _paused: boolean;
     _shouldClose: boolean;
     _cameraChangedWhenPaused: boolean;
@@ -3343,6 +3343,8 @@ declare class Camera {
     static _delayBeforeGetUserMedia: number;
     static _delayBeforeApplyConstraints: number;
     static _countEnsureResolution: number;
+    static _videoPlayTimeout: number;
+    static _bReopenWhenChangeResolution: boolean;
     static _arrConstructors: CameraZsFunc[];
     static _arrOnOpen: CameraZsFunc[];
     static _arrBeforeClose: CameraZsFunc[];
@@ -3435,6 +3437,15 @@ declare class Camera {
     }): Promise<void>;
     requestResolution(notRequired: null): Promise<void>;
     requestResolution(resetToDefault: undefined): Promise<void>;
+    /**
+     * Similar to `camera.track.applyConstraints`,
+     * but auto add constraints of original camera and original resolution.
+     * Primarily used for advanced camera settings like focusDistance, zoom, colorTemperature.
+     * Don't directly change camera or resolution by this API,
+     * use `requestCamera` and `requestResolution` instead.
+     * Set camera or resolution using `applyConstraints` will result in undefined behavior.
+    */
+    applyConstraints(constraints?: MediaTrackConstraints): Promise<void>;
     /**
      * @param config
      * `x`/`y`/`width`/`height` is normally `0 ~ video.videoWidth` or `0 ~ video.videoHeight`,
@@ -3781,6 +3792,7 @@ declare namespace Camera {
         _dceLastResolution: any;
         cameraOpenTimeout: any;
         _bTryAnotherCameraWhenFailToOpen: boolean;
+        _bAutoSingleFrameModeWhenIosPwaFail: boolean;
         _oriOpen(): Promise<void>;
         open(): Promise<void | {
             deviceId: string;
@@ -4101,17 +4113,17 @@ declare class Feedback {
     static vibrateDuration: number;
 }
 declare const DrawingStyleManager: {
-    STYLE_GREEN_STROKE: any;
-    STYLE_GREEN_STROKE_FILL: any;
-    STYLE_GREEN_STROKE_TRANSPARENT: any;
     STYLE_BLUE_STROKE: any;
-    STYLE_BLUE_STROKE_FILL: any;
-    STYLE_BLUE_STROKE_TRANSPARENT: any;
+    STYLE_GREEN_STROKE: any;
     STYLE_ORANGE_STROKE: any;
-    STYLE_ORANGE_STROKE_FILL: any;
-    STYLE_ORANGE_STROKE_TRANSPARENT: any;
     STYLE_YELLOW_STROKE: any;
+    STYLE_BLUE_STROKE_FILL: any;
+    STYLE_GREEN_STROKE_FILL: any;
+    STYLE_ORANGE_STROKE_FILL: any;
     STYLE_YELLOW_STROKE_FILL: any;
+    STYLE_BLUE_STROKE_TRANSPARENT: any;
+    STYLE_GREEN_STROKE_TRANSPARENT: any;
+    STYLE_ORANGE_STROKE_TRANSPARENT: any;
     STYLE_YELLOW_STROKE_TRANSPARENT: any;
     createDrawingStyle(style: any): any;
     getDrawingStyle(id: any): any;
@@ -4226,7 +4238,16 @@ declare class LineDrawingItem extends DrawingItem {
             y: number;
         };
     };
-    setLine(value: any): void;
+    setLine(value: {
+        startPoint: {
+            x: number;
+            y: number;
+        };
+        endPoint: {
+            x: number;
+            y: number;
+        };
+    }): void;
 }
 declare class QuadDrawingItem extends DrawingItem {
     quad: {
@@ -4251,7 +4272,12 @@ declare class QuadDrawingItem extends DrawingItem {
             y: number;
         }[];
     };
-    setQuad(value: any): void;
+    setQuad(value: {
+        points: {
+            x: number;
+            y: number;
+        }[];
+    }): void;
 }
 declare class RectDrawingItem extends DrawingItem {
     rect: {
@@ -4276,7 +4302,12 @@ declare class RectDrawingItem extends DrawingItem {
         width: number;
         height: number;
     };
-    setRect(value: any): void;
+    setRect(value: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    }): void;
 }
 declare class TextDrawingItem extends DrawingItem {
     text: string;
@@ -4297,14 +4328,19 @@ declare class TextDrawingItem extends DrawingItem {
         height: number;
     }, drawingStyleId?: any);
     getText(): string;
-    setText(value: any): void;
-    getRect(): {
+    setText(value: string): void;
+    getTextRect(): {
         x: number;
         y: number;
         width: number;
         height: number;
     };
-    setRect(value: any): void;
+    setTextRect(value: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    }): void;
 }
 declare class ImageDrawingItem extends DrawingItem {
     image: HTMLImageElement | HTMLCanvasElement | HTMLVideoElement;
@@ -4332,14 +4368,25 @@ declare class ImageDrawingItem extends DrawingItem {
         height: number;
     }, maintainAspectRatio: boolean, drawingStyleId?: any);
     getImage(): HTMLVideoElement | HTMLCanvasElement | HTMLImageElement;
-    setImage(value: any): void;
-    getRect(): {
+    setImage(image: {
+        bytes: Uint8Array;
+        width: number;
+        height: number;
+        stride: number;
+        format: any;
+    } | HTMLImageElement | HTMLCanvasElement | HTMLVideoElement): void;
+    getImageRect(): {
         x: number;
         y: number;
         width: number;
         height: number;
     };
-    setRect(value: any): void;
+    setImageRect(value: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    }): void;
 }
 
 declare enum EnumDrawingItemMediaType {
@@ -4355,26 +4402,14 @@ declare enum EnumDrawingItemMediaType {
      * Represents a text element. This allows for the inclusion of textual content as a distinct drawing item within the graphic representation.
      */
     DIMT_TEXT = 4,
-    /**
-     * Represents an arc, which is a portion of the circumference of a circle or an ellipse. Arcs are used to create curved shapes and segments.
-     */
-    DIMT_ARC = 8,
     /**
      * Represents an image. This enables embedding bitmap images within the drawing context.
      */
     DIMT_IMAGE = 16,
-    /**
-     * Represents a polygon, which is a plane figure that is described by a finite number of straight line segments connected to form a closed polygonal chain or circuit.
-     */
-    DIMT_POLYGON = 32,
     /**
      * Represents a line segment. This is the simplest form of a drawing item, defined by two endpoints and the straight path connecting them.
      */
-    DIMT_LINE = 64,
-    /**
-     * Represents a group of drawing items. This allows for the logical grouping of multiple items, treating them as a single entity for manipulation or transformation purposes.
-     */
-    DIMT_GROUP = 128
+    DIMT_LINE = 64
 }
 declare enum EnumDrawingItemState {
     /**