@unissey-web/web-components 5.0.0-rc.8 → 5.0.0-rc.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3,7 +3,7 @@ import { selfieCaptureStrings } from './selfie-capture.js';
3
3
  import { referenceCaptureStrings } from './reference-capture.js';
4
4
  import './button.js';
5
5
  import './en-066d960b.js';
6
- import './video-recorder-4850e581.js';
6
+ import './video-recorder-8ab27e2d.js';
7
7
  import './_commonjsHelpers-02146103.js';
8
8
  import './variables-c07a8719.js';
9
9
  import './video-record-directions.js';
package/dist/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  export { Button } from './button.js';
2
- import { R as Recorder } from './video-recorder-4850e581.js';
3
- export { A as Animation, C as CameraVideoOutlinedIcon, O as OverlayHints } from './video-recorder-4850e581.js';
2
+ import { R as Recorder } from './video-recorder-8ab27e2d.js';
3
+ export { A as Animation, C as CameraVideoOutlinedIcon, O as OverlayHints } from './video-recorder-8ab27e2d.js';
4
4
  export { VideoRecordDirections } from './video-record-directions.js';
5
5
  export { PictureRecorder } from './picture-recorder.js';
6
6
  export { PictureEditor } from './picture-editor.js';
@@ -1,5 +1,5 @@
1
1
  import { _ as _inherits, a as _createClass, x, d as _taggedTemplateLiteral, s, b as _classCallCheck, c as _callSuper, e as _objectSpread2 } from './lit-element-83035a6f.js';
2
- import { R as Recorder, b as buildPacked } from './video-recorder-4850e581.js';
2
+ import { R as Recorder, b as buildPacked } from './video-recorder-8ab27e2d.js';
3
3
  import { E as EN } from './en-066d960b.js';
4
4
  import './_commonjsHelpers-02146103.js';
5
5
  import './variables-c07a8719.js';
@@ -3,7 +3,7 @@ import './button.js';
3
3
  import './image-capture-directions.js';
4
4
  import './file-upload.js';
5
5
  import './picture-recorder.js';
6
- import { b as buildPacked } from './video-recorder-4850e581.js';
6
+ import { b as buildPacked } from './video-recorder-8ab27e2d.js';
7
7
  import { E as EN } from './en-066d960b.js';
8
8
  import { a as referenceCaptureVars } from './variables-c07a8719.js';
9
9
  import './direction-card-5904f865.js';
@@ -1,6 +1,6 @@
1
1
  import { _ as _inherits, a as _createClass, x, d as _taggedTemplateLiteral, s, b as _classCallCheck, c as _callSuper, i } from './lit-element-83035a6f.js';
2
2
  import { E as EN } from './en-066d960b.js';
3
- import { b as buildPacked } from './video-recorder-4850e581.js';
3
+ import { b as buildPacked } from './video-recorder-8ab27e2d.js';
4
4
  import './video-record-directions.js';
5
5
  import './button.js';
6
6
  import { s as selfieCaptureVars } from './variables-c07a8719.js';
@@ -5,7 +5,7 @@ import { E as EN } from './en-066d960b.js';
5
5
  import './button.js';
6
6
 
7
7
  var name = "@unissey-web/web-components";
8
- var version = "5.0.0-rc.8";
8
+ var version = "5.0.0-rc.9";
9
9
  var description = "";
10
10
  var module = "./dist/index.js";
11
11
  var typings = "./dist/index.d.ts";
@@ -71,7 +71,7 @@ var buildPacked = {exports: {}};
71
71
  }(buildPacked, buildPacked.exports));
72
72
 
73
73
  var _templateObject$f;
74
- var cameraStyle = i(_templateObject$f || (_templateObject$f = _taggedTemplateLiteral(["\n .container {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n align-items: center;\n width: 100%;\n }\n\n .wrapper {\n position: relative;\n top: 0;\n left: 0;\n width: ", ";\n }\n\n .hints,\n .instructions,\n .errors,\n .flip-icon-container,\n .face-hints {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n .face-hints {\n width: 100%;\n height: 100%;\n z-index: 5;\n }\n\n .top-hints {\n margin-bottom: 20px;\n }\n\n .bottom-hints {\n margin-top: 20px;\n }\n\n .spinner {\n z-index: -1;\n width: 100%;\n height: 400px;\n }\n\n .flip-icon-container {\n z-index: 4;\n }\n\n .flip-icon {\n position: absolute;\n bottom: 5%;\n left: 5d%;\n }\n\n .hints {\n z-index: 3;\n }\n\n .instructions {\n z-index: 4;\n }\n\n .errors {\n display: none;\n justify-content: center;\n align-items: center;\n z-index: 3;\n\n border-radius: 10px;\n }\n\n .errors .message {\n display: inline-block;\n width: 70%;\n background-color: ", ";\n color: var(--uni-light-color, #fff);\n padding: 7px 15px;\n border-radius: 5px;\n text-align: center;\n }\n\n .item-center {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n .buttons {\n text-align: center;\n width: 100%;\n\n margin: ", ";\n }\n\n .buttons-item {\n padding: 7px;\n }\n\n @media screen and (max-width: 576px) {\n .buttons-item {\n width: 95%;\n }\n\n .buttons {\n margin-top: 15px;\n }\n }\n"])), recorderVars.videoWidth, defaultVars.colors.error, recorderVars.buttonsMargin);
74
+ var cameraStyle = i(_templateObject$f || (_templateObject$f = _taggedTemplateLiteral(["\n .container {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n align-items: center;\n width: 100%;\n }\n\n .wrapper {\n position: relative;\n top: 0;\n left: 0;\n width: ", ";\n }\n\n .hints,\n .instructions,\n .errors,\n .flip-icon-container,\n .face-hints {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n .face-hints {\n width: 100%;\n height: 100%;\n z-index: 5;\n }\n\n .top-hints {\n margin-bottom: 20px;\n }\n\n .bottom-hints {\n margin-top: 20px;\n }\n\n .spinner {\n z-index: -1;\n width: 100%;\n height: 400px;\n }\n\n .flip-icon-container {\n z-index: 4;\n }\n\n .flip-icon {\n position: absolute;\n bottom: 5%;\n left: 5d%;\n }\n\n .hints {\n z-index: 3;\n }\n\n .instructions {\n z-index: 4;\n }\n\n .errors {\n display: none;\n justify-content: center;\n align-items: center;\n z-index: 3;\n\n border-radius: 10px;\n }\n\n .errors .message {\n display: inline-block;\n width: 70%;\n background-color: ", ";\n color: var(--uni-light-color, #fff);\n padding: 7px 15px;\n border-radius: 5px;\n text-align: center;\n }\n\n .item-center {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n .buttons {\n text-align: center;\n width: 100%;\n\n margin: ", ";\n }\n\n .buttons-item {\n display: inline-block;\n padding: 7px;\n }\n\n @media screen and (max-width: 576px) {\n .buttons-item {\n width: 95%;\n }\n\n .buttons {\n margin-top: 15px;\n }\n }\n"])), recorderVars.videoWidth, defaultVars.colors.error, recorderVars.buttonsMargin);
75
75
 
76
76
  var _templateObject$e;
77
77
  var fadeAnimation = i(_templateObject$e || (_templateObject$e = _taggedTemplateLiteral(["\n @keyframes fade {\n from {\n width: 25px;\n margin-left: 0%;\n margin-top: 0%;\n opacity: 1;\n }\n to {\n width: 30px;\n margin-left: -2%;\n margin-top: -2%;\n opacity: 0;\n }\n }\n\n .icon {\n width: 25px;\n animation-name: fade;\n animation-duration: 1s;\n animation-iteration-count: infinite;\n }\n"])));
@@ -1036,41 +1036,46 @@ var Recorder = /*#__PURE__*/function (_LitElement) {
1036
1036
  }, {
1037
1037
  key: "setVideoCustomStyle",
1038
1038
  value: function setVideoCustomStyle() {
1039
- var _this$shadowRoot7, _this$shadowRoot8;
1039
+ var _this$shadowRoot7, _this$shadowRoot8, _this$shadowRoot9;
1040
1040
  var video = (_this$shadowRoot7 = this.shadowRoot) === null || _this$shadowRoot7 === void 0 ? void 0 : _this$shadowRoot7.getElementById(buildPacked.exports.VIDEO_ELEMENT_ID);
1041
- var videoParent = (_this$shadowRoot8 = this.shadowRoot) === null || _this$shadowRoot8 === void 0 ? void 0 : _this$shadowRoot8.getElementById(buildPacked.exports.CONTAINER_ELEMENT_ID);
1041
+ var canvas = (_this$shadowRoot8 = this.shadowRoot) === null || _this$shadowRoot8 === void 0 ? void 0 : _this$shadowRoot8.getElementById(buildPacked.exports.CANVAS_ELEMENT_ID);
1042
+ var videoParent = (_this$shadowRoot9 = this.shadowRoot) === null || _this$shadowRoot9 === void 0 ? void 0 : _this$shadowRoot9.getElementById(buildPacked.exports.CONTAINER_ELEMENT_ID);
1042
1043
  if (video) video.style.filter = recorderVars.videoFilter.cssText;
1043
- if (videoParent) {
1044
+ if (videoParent && this.preset !== buildPacked.exports.AcquisitionPreset.DOC_VIDEO && this.preset !== buildPacked.exports.AcquisitionPreset.DOC_IMAGE) {
1044
1045
  videoParent.style.borderRadius = recorderVars.borderRadius.cssText;
1045
1046
  videoParent.style.boxShadow = recorderVars.boxShadow.cssText;
1047
+ } else if (this.preset === buildPacked.exports.AcquisitionPreset.DOC_VIDEO || this.preset === buildPacked.exports.AcquisitionPreset.DOC_IMAGE) {
1048
+ video.style.borderRadius = recorderVars.borderRadius.cssText;
1049
+ canvas.style.borderRadius = recorderVars.borderRadius.cssText;
1050
+ video.style.boxShadow = recorderVars.boxShadow.cssText;
1046
1051
  }
1047
1052
  }
1048
1053
  }, {
1049
1054
  key: "displaySpinner",
1050
1055
  value: function displaySpinner() {
1051
- var _this$shadowRoot9;
1052
- var spinner = (_this$shadowRoot9 = this.shadowRoot) === null || _this$shadowRoot9 === void 0 ? void 0 : _this$shadowRoot9.querySelector("#spinner");
1056
+ var _this$shadowRoot0;
1057
+ var spinner = (_this$shadowRoot0 = this.shadowRoot) === null || _this$shadowRoot0 === void 0 ? void 0 : _this$shadowRoot0.querySelector("#spinner");
1053
1058
  spinner.style.display = "flex";
1054
1059
  spinner.style.height = "100%";
1055
1060
  }
1056
1061
  }, {
1057
1062
  key: "hideSpinner",
1058
1063
  value: function hideSpinner() {
1059
- var _this$shadowRoot0;
1060
- var spinner = (_this$shadowRoot0 = this.shadowRoot) === null || _this$shadowRoot0 === void 0 ? void 0 : _this$shadowRoot0.querySelector("#spinner");
1064
+ var _this$shadowRoot1;
1065
+ var spinner = (_this$shadowRoot1 = this.shadowRoot) === null || _this$shadowRoot1 === void 0 ? void 0 : _this$shadowRoot1.querySelector("#spinner");
1061
1066
  spinner.style.display = "none";
1062
1067
  }
1063
1068
  }, {
1064
1069
  key: "displayError",
1065
1070
  value: function () {
1066
1071
  var _displayError = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee9(message) {
1067
- var _this$shadowRoot1;
1072
+ var _this$shadowRoot10;
1068
1073
  var errors;
1069
1074
  return _regenerator().w(function (_context9) {
1070
1075
  while (1) switch (_context9.n) {
1071
1076
  case 0:
1072
1077
  this.error = message !== null && message !== void 0 ? message : "Error";
1073
- errors = (_this$shadowRoot1 = this.shadowRoot) === null || _this$shadowRoot1 === void 0 ? void 0 : _this$shadowRoot1.querySelector("#errors");
1078
+ errors = (_this$shadowRoot10 = this.shadowRoot) === null || _this$shadowRoot10 === void 0 ? void 0 : _this$shadowRoot10.querySelector("#errors");
1074
1079
  errors.style.display = "flex";
1075
1080
  errors.style.height = "100%";
1076
1081
  case 1:
@@ -1086,8 +1091,8 @@ var Recorder = /*#__PURE__*/function (_LitElement) {
1086
1091
  }, {
1087
1092
  key: "hideError",
1088
1093
  value: function hideError() {
1089
- var _this$shadowRoot10;
1090
- var errors = (_this$shadowRoot10 = this.shadowRoot) === null || _this$shadowRoot10 === void 0 ? void 0 : _this$shadowRoot10.querySelector("#errors");
1094
+ var _this$shadowRoot11;
1095
+ var errors = (_this$shadowRoot11 = this.shadowRoot) === null || _this$shadowRoot11 === void 0 ? void 0 : _this$shadowRoot11.querySelector("#errors");
1091
1096
  errors.style.display = "none";
1092
1097
  this.error = "";
1093
1098
  }
@@ -1095,7 +1100,7 @@ var Recorder = /*#__PURE__*/function (_LitElement) {
1095
1100
  key: "render",
1096
1101
  value: function render() {
1097
1102
  // not necessary : this.strings = { ...this.defaultStrings, ...this.strings };
1098
- return x$2(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n <div class=\"container\" id=\"container\">\n <div id=\"top-hints\" class=\"top-hints\">\n <slot name=\"ac-top-hints\"></slot>\n </div>\n <div class=\"wrapper\" id=\"wrapper\">\n <div id=\"face-hints\" class=\"face-hints\">\n <slot name=\"ac-face-hints\"></slot>\n </div>\n\n ", "\n\n <uni-overlay-hints\n class=\"hints item-center\"\n hints=\"", "\"\n strings=\"", "\"\n ></uni-overlay-hints>\n\n <div id=\"spinner\" class=\"spinner item-center\" style=\"display: none\">\n <uni-spinner></uni-spinner>\n </div>\n <div class=\"errors\" id=\"errors\">\n <span class=\"message\">", "</span>\n </div>\n </div>\n <div id=\"bottom-hints\" class=\"bottom-hints\">\n <slot name=\"ac-bottom-hints\"></slot>\n <div class=\"ac-bottom-hints\">", "</div>\n </div>\n <div class=\"buttons\" id=\"buttons\">\n <div class=\"buttons-item\">\n <slot name=\"left\"></slot>\n </div>\n\n <div class=\"buttons-item item-center\">\n <!-- Display record/retry button -->\n ", "\n </div>\n </div>\n </div>\n "])), isMobileDevice() && (
1103
+ return x$2(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n <div class=\"container\" id=\"container\">\n <div id=\"top-hints\" class=\"top-hints\">\n <slot name=\"ac-top-hints\"></slot>\n </div>\n <div class=\"wrapper\" id=\"wrapper\">\n <div id=\"face-hints\" class=\"face-hints\">\n <slot name=\"ac-face-hints\"></slot>\n </div>\n\n ", "\n\n <uni-overlay-hints\n class=\"hints item-center\"\n hints=\"", "\"\n strings=\"", "\"\n ></uni-overlay-hints>\n\n <div id=\"spinner\" class=\"spinner item-center\" style=\"display: none\">\n <uni-spinner></uni-spinner>\n </div>\n <div class=\"errors\" id=\"errors\">\n <span class=\"message\">", "</span>\n </div>\n </div>\n <div id=\"bottom-hints\" class=\"bottom-hints\">\n <slot name=\"ac-bottom-hints\"></slot>\n <div class=\"ac-bottom-hints\">", "</div>\n </div>\n <div class=\"buttons\" id=\"buttons\">\n <div class=\"buttons-item\">\n <slot name=\"left\"></slot>\n </div>\n\n <div class=\"buttons-item\">\n <!-- Display record/retry button -->\n ", "\n </div>\n </div>\n </div>\n "])), isMobileDevice() && (
1099
1104
  // eslint-disable-next-line no-extra-boolean-cast
1100
1105
  !!this.displayFlipCameraBtn ? this.displayFlipCameraBtn : this.preset === buildPacked.exports.AcquisitionPreset.DOC_VIDEO || this.preset === buildPacked.exports.AcquisitionPreset.DOC_IMAGE) && !this.isRunning() ? x$2(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral([" <div id=\"flip-icon-container\" class=\"flip-icon-container\">\n <uni-flip-camera-icon @click=\"", "\" class=\"flip-icon\"> </uni-flip-camera-icon>\n </div>"])), this.flipCamera) : x$2(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral([""]))), this.hints, JSON.stringify(this.getString(["hints"])), this.error, this.getString(["hints", this.hints]), !this.hideCaptureBtn || this.willRetryCapture ? x$2(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["<uni-button id=\"capture\" @click=\"", "\">\n <div slot=\"icon\">", "</div>\n ", "\n </uni-button>"])), this.capture, this.captureButtonPicto, this.willRetryCapture ? this.getString(["retry"]) : this.getString(["capture"])) : x$2(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral([""]))));
1101
1106
  }
@@ -1,5 +1,5 @@
1
1
  import './lit-element-83035a6f.js';
2
- export { R as Recorder, V as VideoRecorder } from './video-recorder-4850e581.js';
2
+ export { R as Recorder, V as VideoRecorder } from './video-recorder-8ab27e2d.js';
3
3
  import './variables-c07a8719.js';
4
4
  import './button.js';
5
5
  import './en-066d960b.js';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@unissey-web/web-components",
3
- "version": "5.0.0-rc.8",
3
+ "version": "5.0.0-rc.9",
4
4
  "description": "",
5
5
  "module": "./dist/index.js",
6
6
  "typings": "./dist/index.d.ts",