@smileid/web-components 10.0.6 → 11.0.1

package/lib/components/document/src/document-capture/DocumentCapture.stories.js

@@ -1,78 +1,78 @@
-import SmartCamera from '../../../../domain/camera/src/SmartCamera';
-import './index';
-
-const meta = {
-  args: {
-    'theme-color': '#001096',
-  },
-  argTypes: {
-    'theme-color': { control: 'color' },
-  },
-  component: 'document-capture',
-  render: (args) => `
-    <document-capture
-        show-navigation
-        document-capture-modes="camera,upload"
-        document-name="Driver's License"
-        side-of-id="Front"
-        document-type="${args.documentType}"
-        theme-color='${args['theme-color']}'
-    >
-    </document-capture>
-`,
-};
-
-export default meta;
-
-export const DocumentCapture = {
-  loaders: [
-    async () => {
-      console.warn('attemp to get media');
-      try {
-        const result = await SmartCamera.getMedia({
-          audio: false,
-          video: SmartCamera.environmentOptions,
-        });
-        return {
-          'data-camera-ready': result,
-        };
-      } catch (error) {
-        console.error(error);
-        return {
-          'data-camera-error': SmartCamera.handleCameraError(error),
-        };
-      }
-    },
-  ],
-};
-
-export const DocumentCapturePortraitMode = {
-  args: {
-    documentType: 'GREEN_BOOK',
-  },
-  loaders: [
-    async () => {
-      try {
-        const result = await SmartCamera.getMedia({
-          audio: false,
-          video: SmartCamera.environmentOptions,
-        });
-        return {
-          'data-camera-ready': result,
-        };
-      } catch (error) {
-        return {
-          'data-camera-error': SmartCamera.handleCameraError(error),
-        };
-      }
-    },
-  ],
-};
-
-export const DocumentCapturePendingPermission = {
-  loaders: [
-    async () => ({
-      'data-camera-ready': SmartCamera.stopMedia(),
-    }),
-  ],
-};
+import SmartCamera from '../../../../domain/camera/src/SmartCamera';
+import './index';
+
+const meta = {
+  args: {
+    'theme-color': '#001096',
+  },
+  argTypes: {
+    'theme-color': { control: 'color' },
+  },
+  component: 'document-capture',
+  render: (args) => `
+    <document-capture
+        show-navigation
+        document-capture-modes="camera,upload"
+        document-name="Driver's License"
+        side-of-id="Front"
+        document-type="${args.documentType}"
+        theme-color='${args['theme-color']}'
+    >
+    </document-capture>
+`,
+};
+
+export default meta;
+
+export const DocumentCapture = {
+  loaders: [
+    async () => {
+      console.warn('attemp to get media');
+      try {
+        const result = await SmartCamera.getMedia({
+          audio: false,
+          video: SmartCamera.environmentOptions,
+        });
+        return {
+          'data-camera-ready': result,
+        };
+      } catch (error) {
+        console.error(error);
+        return {
+          'data-camera-error': SmartCamera.handleCameraError(error),
+        };
+      }
+    },
+  ],
+};
+
+export const DocumentCapturePortraitMode = {
+  args: {
+    documentType: 'GREEN_BOOK',
+  },
+  loaders: [
+    async () => {
+      try {
+        const result = await SmartCamera.getMedia({
+          audio: false,
+          video: SmartCamera.environmentOptions,
+        });
+        return {
+          'data-camera-ready': result,
+        };
+      } catch (error) {
+        return {
+          'data-camera-error': SmartCamera.handleCameraError(error),
+        };
+      }
+    },
+  ],
+};
+
+export const DocumentCapturePendingPermission = {
+  loaders: [
+    async () => ({
+      'data-camera-ready': SmartCamera.stopMedia(),
+    }),
+  ],
+};

package/lib/components/document/src/document-capture/README.md

@@ -1,90 +1,90 @@
-# IdCapture Web Component
-
-## Overview
-
-The `IdCapture` is a custom web component designed to capture documents using a camera. It uses the `SmartCamera` module to interact with the device's camera and handle permissions.
-
-### Importing the Component
-
-To use the IdCapture component, you need to import it into your JavaScript file:
-
-```js
-import '@smileid/components/document-capture';
-```
-
-### Using the Component
-
-You can use the IdCapture component in your HTML like any other HTML element:
-
-```html
-<document-capture></document-capture>
-```
-
-### IdCapture Web Component Attributes
-
-You can use a mixture of the following attributes to configure the behavior of the component.
-
-#### hide-back-of-id
-
-This attribute, when present, hides the option to capture the back of the ID. It does not require a value.
-
-Usage:
-
-```html
-<document-capture hide-back-of-id></document-capture>
-```
-
-#### show-navigation
-
-This attribute, when present, shows the navigation controls for the document capture process. It does not require a value.
-
-Usage:
-
-```html
-<document-capture show-navigation></document-capture>
-```
-
-### Permissions
-
-The `IdCapture` component requires camera permissions to function. It will automatically request these permissions when used. If the permissions are granted, it will remove the `data-camera-error` attribute from the capture screen and set the `data-camera-ready` attribute to true. If the permissions are denied, it will remove the `data-camera-ready` attribute and set the `data-camera-error` attribute with the error message.
-
-If you handle the permissions yourself, make sure to set `data-camera-ready` and `data-camera-error` appropriately.
-
-### Error Handling
-
-If there is an error while requesting permissions or capturing the document, the `IdCapture` component will handle it and set the `data-camera-error` attribute with the error message.
-
-### Event Handlers
-
-To receive the images after they have been captured, you can listen to the custom event `document-capture.publish`. The data posted to this event has the structure:
-
-```json
-{
-  "detail": {
-    "image": "base64 image",
-    "previewImage": "base64 image"
-  }
-}
-```
-
-Usage:
-
-```js
-document
-  .querySelector('document-capture')
-  .addEventListener('document-capture.publish', function (event) {
-    console.log(event.detail);
-  });
-```
-
-### Dependencies
-
-The `DocumentCapture` component depends on the following module:
-
-- [SmartCamera](../../../../domain/camera/src/README.md)
-
-This module is imported when you use the `DocumentCapture` component in your projects.
-
-### Compatibility
-
-The IdCapture component is designed to work on all modern browsers that support custom web components. However, it includes a special case for multi-camera Samsung devices to mitigate blurry images at the edges. Please report any issues found on other devices to our support team.
+# IdCapture Web Component
+
+## Overview
+
+The `IdCapture` is a custom web component designed to capture documents using a camera. It uses the `SmartCamera` module to interact with the device's camera and handle permissions.
+
+### Importing the Component
+
+To use the IdCapture component, you need to import it into your JavaScript file:
+
+```js
+import '@smileid/components/document-capture';
+```
+
+### Using the Component
+
+You can use the IdCapture component in your HTML like any other HTML element:
+
+```html
+<document-capture></document-capture>
+```
+
+### IdCapture Web Component Attributes
+
+You can use a mixture of the following attributes to configure the behavior of the component.
+
+#### hide-back-of-id
+
+This attribute, when present, hides the option to capture the back of the ID. It does not require a value.
+
+Usage:
+
+```html
+<document-capture hide-back-of-id></document-capture>
+```
+
+#### show-navigation
+
+This attribute, when present, shows the navigation controls for the document capture process. It does not require a value.
+
+Usage:
+
+```html
+<document-capture show-navigation></document-capture>
+```
+
+### Permissions
+
+The `IdCapture` component requires camera permissions to function. It will automatically request these permissions when used. If the permissions are granted, it will remove the `data-camera-error` attribute from the capture screen and set the `data-camera-ready` attribute to true. If the permissions are denied, it will remove the `data-camera-ready` attribute and set the `data-camera-error` attribute with the error message.
+
+If you handle the permissions yourself, make sure to set `data-camera-ready` and `data-camera-error` appropriately.
+
+### Error Handling
+
+If there is an error while requesting permissions or capturing the document, the `IdCapture` component will handle it and set the `data-camera-error` attribute with the error message.
+
+### Event Handlers
+
+To receive the images after they have been captured, you can listen to the custom event `document-capture.publish`. The data posted to this event has the structure:
+
+```json
+{
+  "detail": {
+    "image": "base64 image",
+    "previewImage": "base64 image"
+  }
+}
+```
+
+Usage:
+
+```js
+document
+  .querySelector('document-capture')
+  .addEventListener('document-capture.publish', function (event) {
+    console.log(event.detail);
+  });
+```
+
+### Dependencies
+
+The `DocumentCapture` component depends on the following module:
+
+- [SmartCamera](../../../../domain/camera/src/README.md)
+
+This module is imported when you use the `DocumentCapture` component in your projects.
+
+### Compatibility
+
+The IdCapture component is designed to work on all modern browsers that support custom web components. However, it includes a special case for multi-camera Samsung devices to mitigate blurry images at the edges. Please report any issues found on other devices to our support team.

package/lib/components/document/src/document-capture/index.js

@@ -1,3 +1,3 @@
-import DocumentCapture from './DocumentCapture';
-
-export default DocumentCapture;
+import DocumentCapture from './DocumentCapture';
+
+export default DocumentCapture;