@ionic/pwa-elements - npm Package Compare versions

Comparing version 1.5.1 to 1.5.2

dist/cjs/pwa-camera.cjs.entry.js

@@ -266,2 +266,3 @@ 'use strict';
         }
+        this.stopStream();
     }
@@ -333,2 +334,3 @@ async promptAccept(photo) {
         this.photo = null;
+        this.initCamera();
     }
@@ -361,6 +363,5 @@ handleAcceptPhoto(_e) {
         const videoStreamStyle = this.facingMode == "user" ? { transform: 'scaleX(-1)' } : {};
-        return (core.h("div", { class: "camera-wrapper" }, core.h("div", { class: "camera-header" }, core.h("section", { class: "items" }, core.h("div", { class: "item close", onClick: e => this.handleClose(e) }, core.h("img", { src: this.iconExit() })), core.h("div", { class: "item flash", onClick: e => this.handleFlashClick(e) }, this.flashModes.length > 0 && (core.h("div", null, this.flashMode == 'off' ? core.h("img", { src: this.iconFlashOff() }) : '', this.flashMode == 'auto' ? core.h("img", { src: this.iconFlashAuto() }) : '', this.flashMode == 'flash' ? core.h("img", { src: this.iconFlashOn() }) : ''))))), this.photo && (core.h("div", { class: "accept" }, core.h("div", { class: "accept-image", style: { backgroundImage: `url(${this.photoSrc})` } }))), core.h("div", { class: "camera-video", style: { display: this.photo ? 'none' : '' } }, this.showShutterOverlay && (core.h("div", { class: "shutter-overlay" })), this.hasImageCapture() ? (core.h("video", { style: videoStreamStyle, ref: (el) => this.videoElement = el, autoplay: true, playsinline: true })) : (core.h("canvas", { ref: (el) => this.canvasElement = el, width: "100%", height: "100%" })), core.h("canvas", { class: "offscreen-image-render", ref: e => this.offscreenCanvas = e, width: "100%", height: "100%" })), core.h("div", { class: "camera-footer" }, !this.photo ? ([
+        return (core.h("div", { class: "camera-wrapper" }, core.h("div", { class: "camera-header" }, core.h("section", { class: "items" }, core.h("div", { class: "item close", onClick: e => this.handleClose(e) }, core.h("img", { src: this.iconExit() })), core.h("div", { class: "item flash", onClick: e => this.handleFlashClick(e) }, this.flashModes.length > 0 && (core.h("div", null, this.flashMode == 'off' ? core.h("img", { src: this.iconFlashOff() }) : '', this.flashMode == 'auto' ? core.h("img", { src: this.iconFlashAuto() }) : '', this.flashMode == 'flash' ? core.h("img", { src: this.iconFlashOn() }) : ''))))), this.photo ? (core.h("div", { class: "accept" }, core.h("div", { class: "accept-image", style: { backgroundImage: `url(${this.photoSrc})` } }))) : (core.h("div", { class: "camera-video" }, this.showShutterOverlay && (core.h("div", { class: "shutter-overlay" })), this.hasImageCapture() ? (core.h("video", { style: videoStreamStyle, ref: (el) => this.videoElement = el, autoplay: true, playsinline: true })) : (core.h("canvas", { ref: (el) => this.canvasElement = el, width: "100%", height: "100%" })), core.h("canvas", { class: "offscreen-image-render", ref: e => this.offscreenCanvas = e, width: "100%", height: "100%" }))), core.h("div", { class: "camera-footer" }, !this.photo ? ([
             core.h("div", { class: "shutter", onClick: (e) => this.handleShutterClick(e) }, core.h("div", { class: "shutter-button" })),
             core.h("div", { class: "rotate", onClick: (e) => this.handleRotateClick(e) }, core.h("img", { src: this.iconReverseCamera() })),
-            { /*this.hasMultipleCameras && (<div class="item rotate" onClick={(e) => this.handleRotateClick(e)}></div>)*/}
         ]) : (core.h("section", { class: "items" }, core.h("div", { class: "item accept-cancel", onClick: e => this.handleCancelPhoto(e) }, core.h("img", { src: this.iconRetake() })), core.h("div", { class: "item accept-use", onClick: e => this.handleAcceptPhoto(e) }, core.h("img", { src: this.iconConfirm() })))))));
@@ -367,0 +368,0 @@ }

dist/collection/collection-manifest.json

 {
   "entries": [
+    "components/camera-modal/camera-modal-instance.js",
+    "components/camera/camera.js",
     "components/camera-modal/camera-modal.js",
-    "components/camera-modal/camera-modal-instance.js",
     "components/toast/toast.js",
-    "components/action-sheet/action-sheet.js",
-    "components/camera/camera.js"
+    "components/action-sheet/action-sheet.js"
   ],
@@ -9,0 +9,0 @@ "compiler": {

dist/collection/components/camera/camera.js

@@ -107,2 +107,3 @@ import { h } from "@stencil/core";
         }
+        this.stopStream();
     }
@@ -174,2 +175,3 @@ async promptAccept(photo) {
         this.photo = null;
+        this.initCamera();
     }
@@ -211,8 +213,7 @@ handleAcceptPhoto(_e) {
                         this.flashMode == 'flash' ? h("img", { src: this.iconFlashOn() }) : ''))))),
-            this.photo && (h("div", { class: "accept" },
-                h("div", { class: "accept-image", style: { backgroundImage: `url(${this.photoSrc})` } }))),
-            h("div", { class: "camera-video", style: { display: this.photo ? 'none' : '' } },
+            this.photo ? (h("div", { class: "accept" },
+                h("div", { class: "accept-image", style: { backgroundImage: `url(${this.photoSrc})` } }))) : (h("div", { class: "camera-video" },
                 this.showShutterOverlay && (h("div", { class: "shutter-overlay" })),
                 this.hasImageCapture() ? (h("video", { style: videoStreamStyle, ref: (el) => this.videoElement = el, autoplay: true, playsinline: true })) : (h("canvas", { ref: (el) => this.canvasElement = el, width: "100%", height: "100%" })),
-                h("canvas", { class: "offscreen-image-render", ref: e => this.offscreenCanvas = e, width: "100%", height: "100%" })),
+                h("canvas", { class: "offscreen-image-render", ref: e => this.offscreenCanvas = e, width: "100%", height: "100%" }))),
             h("div", { class: "camera-footer" }, !this.photo ? ([
@@ -223,3 +224,2 @@ h("div", { class: "shutter", onClick: (e) => this.handleShutterClick(e) },
                     h("img", { src: this.iconReverseCamera() })),
-                { /*this.hasMultipleCameras && (<div class="item rotate" onClick={(e) => this.handleRotateClick(e)}></div>)*/}
             ]) : (h("section", { class: "items" },
@@ -226,0 +226,0 @@ h("div", { class: "item accept-cancel", onClick: e => this.handleCancelPhoto(e) },

dist/esm-es5/pwa-camera.entry.js

@@ -376,3 +376,5 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
                         return [3 /*break*/, 5];
-                    case 5: return [2 /*return*/];
+                    case 5:
+                        this.stopStream();
+                        return [2 /*return*/];
                 }
@@ -457,2 +459,3 @@ });
         this.photo = null;
+        this.initCamera();
     };
@@ -486,6 +489,5 @@ class_1.prototype.handleAcceptPhoto = function (_e) {
         var videoStreamStyle = this.facingMode == "user" ? { transform: 'scaleX(-1)' } : {};
-        return (h("div", { class: "camera-wrapper" }, h("div", { class: "camera-header" }, h("section", { class: "items" }, h("div", { class: "item close", onClick: function (e) { return _this.handleClose(e); } }, h("img", { src: this.iconExit() })), h("div", { class: "item flash", onClick: function (e) { return _this.handleFlashClick(e); } }, this.flashModes.length > 0 && (h("div", null, this.flashMode == 'off' ? h("img", { src: this.iconFlashOff() }) : '', this.flashMode == 'auto' ? h("img", { src: this.iconFlashAuto() }) : '', this.flashMode == 'flash' ? h("img", { src: this.iconFlashOn() }) : ''))))), this.photo && (h("div", { class: "accept" }, h("div", { class: "accept-image", style: { backgroundImage: "url(" + this.photoSrc + ")" } }))), h("div", { class: "camera-video", style: { display: this.photo ? 'none' : '' } }, this.showShutterOverlay && (h("div", { class: "shutter-overlay" })), this.hasImageCapture() ? (h("video", { style: videoStreamStyle, ref: function (el) { return _this.videoElement = el; }, autoplay: true, playsinline: true })) : (h("canvas", { ref: function (el) { return _this.canvasElement = el; }, width: "100%", height: "100%" })), h("canvas", { class: "offscreen-image-render", ref: function (e) { return _this.offscreenCanvas = e; }, width: "100%", height: "100%" })), h("div", { class: "camera-footer" }, !this.photo ? ([
+        return (h("div", { class: "camera-wrapper" }, h("div", { class: "camera-header" }, h("section", { class: "items" }, h("div", { class: "item close", onClick: function (e) { return _this.handleClose(e); } }, h("img", { src: this.iconExit() })), h("div", { class: "item flash", onClick: function (e) { return _this.handleFlashClick(e); } }, this.flashModes.length > 0 && (h("div", null, this.flashMode == 'off' ? h("img", { src: this.iconFlashOff() }) : '', this.flashMode == 'auto' ? h("img", { src: this.iconFlashAuto() }) : '', this.flashMode == 'flash' ? h("img", { src: this.iconFlashOn() }) : ''))))), this.photo ? (h("div", { class: "accept" }, h("div", { class: "accept-image", style: { backgroundImage: "url(" + this.photoSrc + ")" } }))) : (h("div", { class: "camera-video" }, this.showShutterOverlay && (h("div", { class: "shutter-overlay" })), this.hasImageCapture() ? (h("video", { style: videoStreamStyle, ref: function (el) { return _this.videoElement = el; }, autoplay: true, playsinline: true })) : (h("canvas", { ref: function (el) { return _this.canvasElement = el; }, width: "100%", height: "100%" })), h("canvas", { class: "offscreen-image-render", ref: function (e) { return _this.offscreenCanvas = e; }, width: "100%", height: "100%" }))), h("div", { class: "camera-footer" }, !this.photo ? ([
             h("div", { class: "shutter", onClick: function (e) { return _this.handleShutterClick(e); } }, h("div", { class: "shutter-button" })),
             h("div", { class: "rotate", onClick: function (e) { return _this.handleRotateClick(e); } }, h("img", { src: this.iconReverseCamera() })),
-            { /*this.hasMultipleCameras && (<div class="item rotate" onClick={(e) => this.handleRotateClick(e)}></div>)*/}
         ]) : (h("section", { class: "items" }, h("div", { class: "item accept-cancel", onClick: function (e) { return _this.handleCancelPhoto(e); } }, h("img", { src: this.iconRetake() })), h("div", { class: "item accept-use", onClick: function (e) { return _this.handleAcceptPhoto(e); } }, h("img", { src: this.iconConfirm() })))))));
@@ -492,0 +494,0 @@ };

dist/esm/pwa-camera.entry.js

@@ -262,2 +262,3 @@ import { r as registerInstance, d as getContext, h, g as getElement } from './core-8e8be6a7.js';
         }
+        this.stopStream();
     }
@@ -329,2 +330,3 @@ async promptAccept(photo) {
         this.photo = null;
+        this.initCamera();
     }
@@ -357,6 +359,5 @@ handleAcceptPhoto(_e) {
         const videoStreamStyle = this.facingMode == "user" ? { transform: 'scaleX(-1)' } : {};
-        return (h("div", { class: "camera-wrapper" }, h("div", { class: "camera-header" }, h("section", { class: "items" }, h("div", { class: "item close", onClick: e => this.handleClose(e) }, h("img", { src: this.iconExit() })), h("div", { class: "item flash", onClick: e => this.handleFlashClick(e) }, this.flashModes.length > 0 && (h("div", null, this.flashMode == 'off' ? h("img", { src: this.iconFlashOff() }) : '', this.flashMode == 'auto' ? h("img", { src: this.iconFlashAuto() }) : '', this.flashMode == 'flash' ? h("img", { src: this.iconFlashOn() }) : ''))))), this.photo && (h("div", { class: "accept" }, h("div", { class: "accept-image", style: { backgroundImage: `url(${this.photoSrc})` } }))), h("div", { class: "camera-video", style: { display: this.photo ? 'none' : '' } }, this.showShutterOverlay && (h("div", { class: "shutter-overlay" })), this.hasImageCapture() ? (h("video", { style: videoStreamStyle, ref: (el) => this.videoElement = el, autoplay: true, playsinline: true })) : (h("canvas", { ref: (el) => this.canvasElement = el, width: "100%", height: "100%" })), h("canvas", { class: "offscreen-image-render", ref: e => this.offscreenCanvas = e, width: "100%", height: "100%" })), h("div", { class: "camera-footer" }, !this.photo ? ([
+        return (h("div", { class: "camera-wrapper" }, h("div", { class: "camera-header" }, h("section", { class: "items" }, h("div", { class: "item close", onClick: e => this.handleClose(e) }, h("img", { src: this.iconExit() })), h("div", { class: "item flash", onClick: e => this.handleFlashClick(e) }, this.flashModes.length > 0 && (h("div", null, this.flashMode == 'off' ? h("img", { src: this.iconFlashOff() }) : '', this.flashMode == 'auto' ? h("img", { src: this.iconFlashAuto() }) : '', this.flashMode == 'flash' ? h("img", { src: this.iconFlashOn() }) : ''))))), this.photo ? (h("div", { class: "accept" }, h("div", { class: "accept-image", style: { backgroundImage: `url(${this.photoSrc})` } }))) : (h("div", { class: "camera-video" }, this.showShutterOverlay && (h("div", { class: "shutter-overlay" })), this.hasImageCapture() ? (h("video", { style: videoStreamStyle, ref: (el) => this.videoElement = el, autoplay: true, playsinline: true })) : (h("canvas", { ref: (el) => this.canvasElement = el, width: "100%", height: "100%" })), h("canvas", { class: "offscreen-image-render", ref: e => this.offscreenCanvas = e, width: "100%", height: "100%" }))), h("div", { class: "camera-footer" }, !this.photo ? ([
             h("div", { class: "shutter", onClick: (e) => this.handleShutterClick(e) }, h("div", { class: "shutter-button" })),
             h("div", { class: "rotate", onClick: (e) => this.handleRotateClick(e) }, h("img", { src: this.iconReverseCamera() })),
-            { /*this.hasMultipleCameras && (<div class="item rotate" onClick={(e) => this.handleRotateClick(e)}></div>)*/}
         ]) : (h("section", { class: "items" }, h("div", { class: "item accept-cancel", onClick: e => this.handleCancelPhoto(e) }, h("img", { src: this.iconRetake() })), h("div", { class: "item accept-use", onClick: e => this.handleAcceptPhoto(e) }, h("img", { src: this.iconConfirm() })))))));
@@ -363,0 +364,0 @@ }

dist/ionicpwaelements/ionicpwaelements.esm.js

@@ -1,1 +0,1 @@
-import{p as a,b as e}from"./p-b877c280.js";a().then(a=>e([["p-e501uohe",[[1,"pwa-action-sheet",{header:[1],cancelable:[4],options:[16],open:[32]}]]],["p-7newq7qb",[[1,"pwa-camera-modal-instance",null,[[32,"keyup","handleBackdropKeyUp"]]]]],["p-gbauiyw4",[[1,"pwa-camera-modal",{present:[64],dismiss:[64]}]]],["p-cuaeu43l",[[1,"pwa-toast",{message:[1],duration:[2],closing:[32]}]]],["p-ow7sscv5",[[1,"pwa-camera",{facingMode:[1,"facing-mode"],onPhoto:[16],photo:[32],photoSrc:[32],showShutterOverlay:[32],flashIndex:[32]}]]]],a));
+import{p as a,b as e}from"./p-b877c280.js";a().then(a=>e([["p-e501uohe",[[1,"pwa-action-sheet",{header:[1],cancelable:[4],options:[16],open:[32]}]]],["p-7newq7qb",[[1,"pwa-camera-modal-instance",null,[[32,"keyup","handleBackdropKeyUp"]]]]],["p-gbauiyw4",[[1,"pwa-camera-modal",{present:[64],dismiss:[64]}]]],["p-cuaeu43l",[[1,"pwa-toast",{message:[1],duration:[2],closing:[32]}]]],["p-e1ddzrrg",[[1,"pwa-camera",{facingMode:[1,"facing-mode"],onPhoto:[16],photo:[32],photoSrc:[32],showShutterOverlay:[32],flashIndex:[32]}]]]],a));

dist/ionicpwaelements/p-2ae892e9.system.js

@@ -1,1 +0,1 @@
-System.register(["./p-aa4236a7.system.js"],(function(){"use strict";var e,a;return{setters:[function(t){e=t.p;a=t.b}],execute:function(){e().then((function(e){return a([["p-rya2viin.system",[[1,"pwa-action-sheet",{header:[1],cancelable:[4],options:[16],open:[32]}]]],["p-xingwbha.system",[[1,"pwa-camera-modal-instance",null,[[32,"keyup","handleBackdropKeyUp"]]]]],["p-gjxdiawb.system",[[1,"pwa-camera-modal",{present:[64],dismiss:[64]}]]],["p-cnejwpcx.system",[[1,"pwa-toast",{message:[1],duration:[2],closing:[32]}]]],["p-x4alx3mn.system",[[1,"pwa-camera",{facingMode:[1,"facing-mode"],onPhoto:[16],photo:[32],photoSrc:[32],showShutterOverlay:[32],flashIndex:[32]}]]]],e)}))}}}));
+System.register(["./p-aa4236a7.system.js"],(function(){"use strict";var e,a;return{setters:[function(t){e=t.p;a=t.b}],execute:function(){e().then((function(e){return a([["p-rya2viin.system",[[1,"pwa-action-sheet",{header:[1],cancelable:[4],options:[16],open:[32]}]]],["p-xingwbha.system",[[1,"pwa-camera-modal-instance",null,[[32,"keyup","handleBackdropKeyUp"]]]]],["p-gjxdiawb.system",[[1,"pwa-camera-modal",{present:[64],dismiss:[64]}]]],["p-cnejwpcx.system",[[1,"pwa-toast",{message:[1],duration:[2],closing:[32]}]]],["p-zhhij7fn.system",[[1,"pwa-camera",{facingMode:[1,"facing-mode"],onPhoto:[16],photo:[32],photoSrc:[32],showShutterOverlay:[32],flashIndex:[32]}]]]],e)}))}}}));

package.json

 {
   "name": "@ionic/pwa-elements",
-  "version": "1.5.1",
+  "version": "1.5.2",
   "description": "Stencil Component Starter",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Lines of code

15557

increased by0.03%

Number of medium supply chain risk alerts

10

decreased by-9.09%

Worsened metrics

Total package byte prevSize

986041

decreased by-0.04%

No dependency changes