[web-components] Hide cancel button and install fix (#371)

* Hide cancel button when back to host is added * Fix default export error when only default export is available * Update changelog * hide cancel when navigation is hidden
smileidentity · Dec 13, 2024 · 056e2f8 · 056e2f8
1 parent 94b1bac
commit 056e2f8
Show file tree

Hide file tree

Showing 8 changed files with 30 additions and 7 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+- Handle errors gracefully
+- Fixed document capture not hidden when `hide_attribution` is specified
+- Cancel button on the selfie capture instructions screen will now be hidden when back button is hidden
+
 ## [1.4.4] - 2024-10-15
 
 ### Changed

diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/embed/package.json b/packages/embed/package.json
@@ -30,7 +30,7 @@
     "@sentry/browser": "^8.33.0",
     "@sentry/esbuild-plugin": "^2.22.3",
     "@smile_identity/smart-camera-web": "file:../smart-camera-web",
-    "@smileid/web-components": "^1.0.0",
+    "@smileid/web-components": "<2.0.0",
     "jszip": "^3.10.1",
     "validate.js": "^0.13.1"
   },

diff --git a/packages/web-components/components/document/src/DocumentCaptureScreens.js b/packages/web-components/components/document/src/DocumentCaptureScreens.js
@@ -5,7 +5,9 @@ import SmartCamera from '../../../domain/camera/src/SmartCamera';
 import './document-capture';
 import './document-capture-review';
 import './document-capture-instructions';
-import { version as COMPONENTS_VERSION } from '../../../package.json';
+import packageJson from '../../../package.json';
+
+const COMPONENTS_VERSION = packageJson.version;
 
 async function getPermissions(captureScreen) {
   try {

diff --git a/packages/web-components/components/selfie/src/SelfieCaptureScreens.js b/packages/web-components/components/selfie/src/SelfieCaptureScreens.js
@@ -3,7 +3,9 @@ import './selfie-capture-instructions';
 import './selfie-capture-review';
 import SmartCamera from '../../../domain/camera/src/SmartCamera';
 import styles from '../../../styles/src/styles';
-import { version as COMPONENTS_VERSION } from '../../../package.json';
+import packageJson from '../../../package.json';
+
+const COMPONENTS_VERSION = packageJson.version;
 
 async function getPermissions(captureScreen, facingMode = 'user') {
   try {

diff --git a/...components/components/selfie/src/selfie-capture-instructions/SelfieCaptureInstructions.js b/...components/components/selfie/src/selfie-capture-instructions/SelfieCaptureInstructions.js
@@ -305,7 +305,7 @@ function templateString() {
     </style>
     ${styles(this.themeColor)}
     <div id="selfie-capture-instruction-screen" class="flow center">
-    <smileid-navigation theme-color=${this.themeColor} ${this.showNavigation ? 'show-navigation' : ''} ${this.hideBack ? 'hide-back' : ''}></smileid-navigation>
+    <smileid-navigation theme-color=${this.themeColor} ${this.hideBack ? 'hide-back' : ''} ${this.showNavigation ? '' : 'hidden'}></smileid-navigation>
     <header>
       <svg xmlns="http://www.w3.org/2000/svg" width="65" height="91" viewBox="0 0 65 91" fill="none">
       <g clip-path="url(#clip0_604_692)">
@@ -543,7 +543,7 @@ function templateString() {
         <button id='allow' data-variant='solid full-width' class='button theme-background'>
             Allow
         </button>
-        <button id='cancel' data-variant='outline full-width' class="button" style='--flow-space: 1.5rem'>
+        <button id='cancel' data-variant='outline full-width' class="button" style='--flow-space: 1.5rem' ${this.hideBack || !this.showNavigation ? 'hidden' : ''}>
             Cancel
         </button>
        </section>
@@ -629,6 +629,10 @@ class SelfieCaptureInstructions extends HTMLElement {
   handleCloseEvents() {
     this.dispatchEvent(new CustomEvent('selfie-capture-instructions.close'));
   }
+
+  static get observedAttributes() {
+    return ['show-navigation'];
+  }
 }
 
 if (

diff --git a/packages/web-components/components/smart-camera-web/src/SmartCameraWeb.js b/packages/web-components/components/smart-camera-web/src/SmartCameraWeb.js
@@ -4,8 +4,9 @@ import SmartCamera from '../../../domain/camera/src/SmartCamera';
 import '../../document/src';
 import '../../selfie/src';
 import '../../camera-permission/CameraPermission';
+import packageJson from '../../../package.json';
 
-import { version as COMPONENTS_VERSION } from '../../../package.json';
+const COMPONENTS_VERSION = packageJson.version;
 
 function scwTemplateString() {
   return `

diff --git a/packages/web-components/package.json b/packages/web-components/package.json
@@ -2,6 +2,7 @@
   "name": "@smileid/web-components",
   "version": "1.4.4",
   "private": "true",
+  "main": "index.js",
   "exports": {
     ".": "./index.js",
     "./combobox": "./components/combobox/src/index.js",