@everymatrix/user-login 1.0.69

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.
Files changed (44) hide show
  1. package/dist/cjs/app-globals-3a1e7e63.js +5 -0
  2. package/dist/cjs/index-465784fc.js +1240 -0
  3. package/dist/cjs/index.cjs.js +2 -0
  4. package/dist/cjs/loader.cjs.js +15 -0
  5. package/dist/cjs/user-login.cjs.entry.js +312 -0
  6. package/dist/cjs/user-login.cjs.js +25 -0
  7. package/dist/collection/collection-manifest.json +12 -0
  8. package/dist/collection/components/user-login/index.js +1 -0
  9. package/dist/collection/components/user-login/user-login.css +166 -0
  10. package/dist/collection/components/user-login/user-login.js +407 -0
  11. package/dist/collection/index.js +1 -0
  12. package/dist/collection/utils/locale.utils.js +102 -0
  13. package/dist/collection/utils/utils.js +3 -0
  14. package/dist/esm/app-globals-0f993ce5.js +3 -0
  15. package/dist/esm/index-4e85bfaa.js +1214 -0
  16. package/dist/esm/index.js +1 -0
  17. package/dist/esm/loader.js +11 -0
  18. package/dist/esm/user-login.entry.js +308 -0
  19. package/dist/esm/user-login.js +20 -0
  20. package/dist/index.cjs.js +1 -0
  21. package/dist/index.js +1 -0
  22. package/dist/stencil.config.dev.js +17 -0
  23. package/dist/stencil.config.js +17 -0
  24. package/dist/types/Users/raul.vasile/workspace/everymatrix/widgets-monorepo/packages/stencil/user-login/.stencil/packages/stencil/user-login/stencil.config.d.ts +2 -0
  25. package/dist/types/Users/raul.vasile/workspace/everymatrix/widgets-monorepo/packages/stencil/user-login/.stencil/packages/stencil/user-login/stencil.config.dev.d.ts +2 -0
  26. package/dist/types/components/user-login/index.d.ts +1 -0
  27. package/dist/types/components/user-login/user-login.d.ts +82 -0
  28. package/dist/types/components.d.ts +117 -0
  29. package/dist/types/index.d.ts +1 -0
  30. package/dist/types/stencil-public-runtime.d.ts +1674 -0
  31. package/dist/types/utils/locale.utils.d.ts +2 -0
  32. package/dist/types/utils/utils.d.ts +1 -0
  33. package/dist/user-login/index.esm.js +0 -0
  34. package/dist/user-login/p-a86a26ad.js +2 -0
  35. package/dist/user-login/p-bbb59f0e.entry.js +1 -0
  36. package/dist/user-login/p-e1255160.js +1 -0
  37. package/dist/user-login/user-login.esm.js +1 -0
  38. package/loader/cdn.js +1 -0
  39. package/loader/index.cjs.js +1 -0
  40. package/loader/index.d.ts +24 -0
  41. package/loader/index.es2017.js +1 -0
  42. package/loader/index.js +2 -0
  43. package/loader/package.json +11 -0
  44. package/package.json +26 -0
@@ -0,0 +1,2 @@
1
+ 'use strict';
2
+
@@ -0,0 +1,15 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ const index = require('./index-465784fc.js');
6
+ const appGlobals = require('./app-globals-3a1e7e63.js');
7
+
8
+ const defineCustomElements = async (win, options) => {
9
+ if (typeof window === 'undefined') return undefined;
10
+ await appGlobals.globalScripts();
11
+ return index.bootstrapLazy([["user-login.cjs",[[1,"user-login",{"endpoint":[513],"lang":[1537],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"passwordReset":[513,"password-reset"],"userEmailRegex":[513,"user-email-regex"],"userEmailRegexOptions":[513,"user-email-regex-options"],"passwordRegex":[513,"password-regex"],"passwordRegexOptions":[513,"password-regex-options"],"userNameEmail":[32],"userPassword":[32],"isValidUserEmail":[32],"isValidPassword":[32],"isPasswordVisible":[32],"limitStylingAppends":[32],"errorMessage":[32],"hasError":[32]},null,{"translationUrl":["handleNewTranslations"]}]]]], options);
12
+ };
13
+
14
+ exports.setNonce = index.setNonce;
15
+ exports.defineCustomElements = defineCustomElements;
@@ -0,0 +1,312 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ const index = require('./index-465784fc.js');
6
+
7
+ const DEFAULT_LANGUAGE = 'en';
8
+ const SUPPORTED_LANGUAGES = ['ro', 'en', 'cz', 'de', 'hr'];
9
+ const TRANSLATIONS = {
10
+ en: {
11
+ invalidField: 'This field is invalid',
12
+ forgotPassword: 'Forgot Password',
13
+ userEmail: 'Username or Email',
14
+ password: 'Password',
15
+ login: 'Login',
16
+ genericError: 'An unexpected error has occured',
17
+ successMessage: 'Login successful'
18
+ },
19
+ ro: {
20
+ invalidField: 'This field is invalid',
21
+ forgotPassword: 'Forgot Password',
22
+ userEmail: 'Username or Email',
23
+ password: 'Password',
24
+ login: 'Login',
25
+ genericError: 'An unexpected error has occured',
26
+ successMessage: 'Login successful'
27
+ },
28
+ hr: {
29
+ invalidField: 'Ovo polje je nevažeće',
30
+ forgotPassword: 'Zaboravljena lozinka',
31
+ userEmail: 'Korisničko ime ili email',
32
+ password: 'Lozinka',
33
+ login: 'Prijava',
34
+ genericError: 'Došlo je do neočekivane pogreške',
35
+ successMessage: 'Prijava uspješna'
36
+ },
37
+ fr: {
38
+ invalidField: 'This field is invalid',
39
+ forgotPassword: 'Forgot Password',
40
+ userEmail: 'Username or Email',
41
+ password: 'Password',
42
+ login: 'Login',
43
+ genericError: 'An unexpected error has occured',
44
+ successMessage: 'Login successful'
45
+ },
46
+ cs: {
47
+ invalidField: 'Ovo polje je nevažeće.',
48
+ forgotPassword: 'Zaboravio sam lozinku ',
49
+ userEmail: 'Korisničko ime ili email',
50
+ password: 'Lozinka',
51
+ login: 'Prijava',
52
+ genericError: 'An unexpected error has occured',
53
+ successMessage: 'Login successful'
54
+ },
55
+ de: {
56
+ invalidField: 'This field is invalid',
57
+ forgotPassword: 'Forgot Password',
58
+ userEmail: 'Username or Email',
59
+ password: 'Password',
60
+ login: 'Login',
61
+ genericError: 'An unexpected error has occured',
62
+ successMessage: 'Login successful'
63
+ },
64
+ 'pt-br': {
65
+ 'invalidField': 'O campo é inválido',
66
+ 'forgotPassword': 'Esqueceu sua senha',
67
+ 'userEmail': 'Usuário ou e-mail',
68
+ 'Password': 'Senha',
69
+ 'login': 'Entrem',
70
+ 'genericError': 'Ocorreu um erro inesperado',
71
+ 'successMessage': 'Você fez login com sucesso'
72
+ },
73
+ 'es-mx': {
74
+ 'invalidField': 'El campo es inválido',
75
+ 'forgotPassword': 'Olvidó contraseña',
76
+ 'userEmail': 'Usuario o Correo Electrónico',
77
+ 'Password': 'Contraseña',
78
+ 'login': 'Entrar',
79
+ 'genericError': 'Ha ocurrido un error inesperado',
80
+ 'successMessage': 'Ha ingreasado de forma exitosa'
81
+ }
82
+ };
83
+ const getTranslations = (url) => {
84
+ // fetch url, get the data, replace the TRANSLATIONS content
85
+ return new Promise((resolve) => {
86
+ fetch(url)
87
+ .then((res) => res.json())
88
+ .then((data) => {
89
+ Object.keys(data).forEach((item) => {
90
+ for (let key in data[item]) {
91
+ TRANSLATIONS[item][key] = data[item][key];
92
+ }
93
+ });
94
+ resolve(true);
95
+ });
96
+ });
97
+ };
98
+ const translate = (key, customLang, values) => {
99
+ const lang = customLang;
100
+ let translation = TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
101
+ if (values !== undefined) {
102
+ for (const [key, value] of Object.entries(values.values)) {
103
+ const regex = new RegExp(`{${key}}`, 'g');
104
+ translation = translation.replace(regex, value);
105
+ }
106
+ }
107
+ return translation;
108
+ };
109
+
110
+ const userLoginCss = ":host{display:block;font-family:\"Roboto\", sans-serif}section{height:100%;width:100%;background-position:center;background-size:cover}.FormValue{width:100%}.FormBox{height:100%;display:flex;position:relative;background:none;border:none;backdrop-filter:blur(15px) brightness(80%);justify-content:center;align-items:center}.InputBox{position:relative;margin:30px 0;width:100%;border-bottom:2px solid #0797B9}.InputBox.InputInvalidBox::after{content:\"\";height:2px;width:100%;transition:width 0.6s linear;background:#C23135}.InputBox::after{content:\"\";display:block;width:0;height:2px;position:relative;top:2px}.InputBox .PasswordVisibilityIcon{fill:#0797B9}.InputBox .InputIcon .TogglePasswordVisibility{cursor:pointer;position:absolute;top:18px;right:0}.InputBox .InputIcon .TogglePasswordVisibility.PasswordVisible{top:19.5px}.InputBox label{position:absolute;top:50%;left:5px;transform:translateY(-50%);color:#0797B9;font-size:1em;pointer-events:none;transition:0.5s}.InputBox label.FieldInvalid{color:#C23135}.InputBox input{width:100%;height:50px;background:transparent;border:none;outline:none;font-size:1em;padding:0 35px 0 5px;color:#fff;box-sizing:border-box}input:focus~label,label.FieldFilledIn{top:-3px;font-size:0.7em}.ForgotPassword button{margin:-10px 0 17px;font-size:0.9em;color:#0797B9;display:flex;justify-content:space-between;background-color:transparent;padding:0;height:unset;border:0;cursor:pointer}.ForgotPassword button:hover{color:#fff}.SubmitCredentials{display:block;margin:0 auto;padding:10px 20px;border-radius:5px;color:var(--emfe-w-button-typography, var(--emfe-w-color-white, #FFFFFF));background:linear-gradient(to right, #EA0C66, #77318F);border:none;outline:none;cursor:pointer;font-size:1em}.SubmitCredentials:disabled{background:#707070}.Register{font-size:0.9em;color:#fff;text-align:center;margin:25px 0 10px}.Register p a{text-decoration:none;color:#fff;font-weight:600}.Register p a:hover{text-decoration:underline}.InvalidField{position:absolute;top:45px;color:#C23135;font-size:0.7em}.SubmitCredentials{margin-bottom:20px}.CredentialsError{color:#C23135;font-size:0.7em;padding:0 0 20px 0;margin:0}@media screen and (max-width: 480px){.FormBox{width:100%;border-radius:0px}}";
111
+ const UserLoginStyle0 = userLoginCss;
112
+
113
+ const UserLogin = class {
114
+ constructor(hostRef) {
115
+ index.registerInstance(this, hostRef);
116
+ this.errorCode = '';
117
+ this.setClientStyling = () => {
118
+ let sheet = document.createElement('style');
119
+ sheet.innerHTML = this.clientStyling;
120
+ this.stylingContainer.appendChild(sheet);
121
+ };
122
+ this.setClientStylingURL = () => {
123
+ let url = new URL(this.clientStylingUrl);
124
+ let cssFile = document.createElement('style');
125
+ fetch(url.href)
126
+ .then((res) => res.text())
127
+ .then((data) => {
128
+ cssFile.innerHTML = data;
129
+ setTimeout(() => { this.stylingContainer.appendChild(cssFile); }, 1);
130
+ });
131
+ };
132
+ this.autofillCredentialsHandler = (e) => {
133
+ this.userNameEmail = e.detail.userNameEmail;
134
+ this.userPassword = e.detail.userPassword;
135
+ this.handleLogin();
136
+ };
137
+ this.userLogin = async ({ username, password }) => {
138
+ let headers = {
139
+ 'Content-Type': 'application/json'
140
+ };
141
+ let bodyData = {
142
+ username,
143
+ password
144
+ };
145
+ let options = {
146
+ method: 'POST',
147
+ headers,
148
+ body: JSON.stringify(bodyData),
149
+ };
150
+ fetch(`${this.endpoint}/v1/player/legislation/login`, options)
151
+ .then((res) => {
152
+ return res.json();
153
+ }).then((data) => {
154
+ var _a, _b, _c;
155
+ if ((_a = data.sessionBlockers) === null || _a === void 0 ? void 0 : _a.includes('has-to-set-consents')) {
156
+ window.postMessage({ type: 'PlayerActions', gmversion: 'gm16' }, window.location.href);
157
+ }
158
+ if ((data === null || data === void 0 ? void 0 : data.hasToSetPass) === true) {
159
+ window.postMessage({ type: 'HasToSetPass' }, window.location.href);
160
+ }
161
+ if (data.sessionId) {
162
+ window.postMessage({ type: 'UserSessionID', session: data.sessionId, userid: data.userId }, window.location.href);
163
+ window.postMessage({ type: 'WidgetNotification', data: {
164
+ type: 'success',
165
+ message: translate('successMessage', this.lang)
166
+ } }, window.location.href);
167
+ this.hasError = false;
168
+ }
169
+ else {
170
+ // handles errors thrown by api
171
+ this.hasError = true;
172
+ this.errorCode = (_b = data === null || data === void 0 ? void 0 : data.thirdPartyResponse) === null || _b === void 0 ? void 0 : _b.errorCode;
173
+ this.errorMessage = translate(`${this.errorCode}`, this.lang) || ((_c = data === null || data === void 0 ? void 0 : data.thirdPartyResponse) === null || _c === void 0 ? void 0 : _c.message) || translate('genericError', this.lang);
174
+ if (this.errorMessage) {
175
+ console.error(this.errorMessage);
176
+ this.sendErrorNotification(this.errorMessage);
177
+ }
178
+ }
179
+ }).catch((err) => {
180
+ // handles unexpected errors
181
+ console.error(err);
182
+ this.hasError = true;
183
+ this.errorMessage = translate('genericError', this.lang);
184
+ this.sendErrorNotification(this.errorMessage);
185
+ });
186
+ };
187
+ this.debouncedUserLogin = this.debounce(this.userLogin, 850);
188
+ this.handleLogin = () => {
189
+ this.debouncedUserLogin({
190
+ username: this.userNameEmail,
191
+ password: this.userPassword
192
+ });
193
+ this.dispatchUpdateLoginCredentialsEvent();
194
+ };
195
+ this.handleInputChange = (event, location) => {
196
+ this.hasError = false;
197
+ const inputValue = event.target.value;
198
+ if (location === 'user') {
199
+ this.userNameEmail = inputValue;
200
+ this.isValidUserEmail = this.userEmailValidation(this.userNameEmail);
201
+ }
202
+ else {
203
+ this.userPassword = inputValue;
204
+ this.isValidPassword = this.passwordValidation(inputValue);
205
+ }
206
+ };
207
+ this.userEmailValidation = (input) => {
208
+ const regex = new RegExp(this.userEmailRegex, this.userEmailRegexOptions);
209
+ return regex.test(input);
210
+ };
211
+ this.passwordValidation = (input) => {
212
+ const regex = new RegExp(this.passwordRegex, this.passwordRegexOptions);
213
+ return regex.test(input);
214
+ };
215
+ this.togglePassword = () => {
216
+ this.isPasswordVisible = !this.isPasswordVisible;
217
+ };
218
+ this.resetPassword = () => {
219
+ window.postMessage({ type: "NavForgotPassword" }, window.location.href);
220
+ };
221
+ this.endpoint = '';
222
+ this.lang = 'en';
223
+ this.clientStyling = '';
224
+ this.clientStylingUrl = '';
225
+ this.translationUrl = '';
226
+ this.passwordReset = 'false';
227
+ this.userEmailRegex = undefined;
228
+ this.userEmailRegexOptions = 'i';
229
+ this.passwordRegex = undefined;
230
+ this.passwordRegexOptions = '';
231
+ this.userNameEmail = '';
232
+ this.userPassword = '';
233
+ this.isValidUserEmail = true;
234
+ this.isValidPassword = true;
235
+ this.isPasswordVisible = false;
236
+ this.limitStylingAppends = false;
237
+ this.errorMessage = '';
238
+ this.hasError = false;
239
+ }
240
+ handleNewTranslations() {
241
+ getTranslations(this.translationUrl);
242
+ }
243
+ async componentWillLoad() {
244
+ if (this.translationUrl.length > 2) {
245
+ await getTranslations(this.translationUrl);
246
+ }
247
+ }
248
+ componentDidLoad() {
249
+ window.addEventListener('LoginCredentials', this.autofillCredentialsHandler);
250
+ window.postMessage({ type: 'UserLoginDidLoad' });
251
+ }
252
+ componentDidRender() {
253
+ // start custom styling area
254
+ if (!this.limitStylingAppends && this.stylingContainer) {
255
+ if (this.clientStyling)
256
+ this.setClientStyling();
257
+ if (this.clientStylingUrl)
258
+ this.setClientStylingURL();
259
+ this.limitStylingAppends = true;
260
+ }
261
+ // end custom styling area
262
+ }
263
+ disconnectedCallback() {
264
+ window.removeEventListener('LoginCredentials', this.autofillCredentialsHandler);
265
+ }
266
+ sendErrorNotification(errorMessage) {
267
+ window.postMessage({ type: "HasError", error: errorMessage }, window.location.href);
268
+ window.postMessage({ type: 'WidgetNotification', data: {
269
+ type: 'error',
270
+ message: errorMessage
271
+ } }, window.location.href);
272
+ }
273
+ debounce(func, delay) {
274
+ let timer;
275
+ return function (...args) {
276
+ clearTimeout(timer);
277
+ timer = setTimeout(() => {
278
+ func.apply(this, args);
279
+ }, delay);
280
+ };
281
+ }
282
+ dispatchUpdateLoginCredentialsEvent() {
283
+ if (!this.hasError) {
284
+ this.updateLoginCredentialsEvent = new CustomEvent("UpdateLoginCredentials", {
285
+ bubbles: true,
286
+ detail: {
287
+ userNameEmail: this.userNameEmail,
288
+ userPassword: this.userPassword
289
+ }
290
+ });
291
+ window.dispatchEvent(this.updateLoginCredentialsEvent);
292
+ }
293
+ }
294
+ ;
295
+ render() {
296
+ let visibilityIcon = index.h("span", { key: '4ccb9d4b1c8209e22320c3667101b9e435d1b604', class: "InputIcon" }, this.isPasswordVisible &&
297
+ index.h("svg", { key: 'fd168b4ec7ed18213aef15d5c7bcb89183b5626d', onClick: () => this.togglePassword(), class: "TogglePasswordVisibility", part: "TogglePasswordVisibility", xmlns: "http://www.w3.org/2000/svg", width: "18.844", height: "12.887", viewBox: "0 0 18.844 12.887" }, index.h("g", { key: '3ab8953db8743082bb19d4f97ae6191724145a0e', transform: "translate(-110.856 -23.242)" }, index.h("circle", { key: '716eb0de02150f4d5791cb7cf1cf7e904de4e8b9', class: "PasswordVisibilityIcon", cx: "0.05", cy: "0.05", r: "0.05", transform: "translate(121.017 31.148)" }), index.h("g", { key: '4ca623e6f31b09dbf6495fe657e9f6b67bfddbd8', transform: "translate(117.499 27.37)" }, index.h("path", { key: '0377c51b5536b07d0cefb77ed82d714fc82b5d9e', class: "PasswordVisibilityIcon", d: "M147.413,43.174a2.774,2.774,0,0,0-3.229-3.943Z", transform: "translate(-142.164 -39.123)" }), index.h("path", { key: '3ee2f6849511a3ce18ccfcaea0b503f1b9e57329', class: "PasswordVisibilityIcon", d: "M137.031,43.1a2.778,2.778,0,0,0,3.447,4.209Z", transform: "translate(-136.413 -42.068)" })), index.h("g", { key: '24fab8dc6f6ef08ef1a36227156b768925a2a7ba', transform: "translate(110.856 24.899)" }, index.h("path", { key: 'b41b45065b8f55772bbdfbced34ef4d7736c133a', class: "PasswordVisibilityIcon", d: "M122.538,42.061a7.043,7.043,0,0,1-2.325.53,10.373,10.373,0,0,1-4.393-1.482,36.509,36.509,0,0,1-3.873-2.391.13.13,0,0,1,0-.208,44.141,44.141,0,0,1,3.873-2.651c.394-.233.768-.437,1.13-.622l-.686-.838c-.322.167-.651.347-.99.55a37.989,37.989,0,0,0-3.977,2.729,1.21,1.21,0,0,0-.442.962,1.1,1.1,0,0,0,.494.936,34.416,34.416,0,0,0,3.977,2.469,11.468,11.468,0,0,0,4.886,1.611,8.427,8.427,0,0,0,3.039-.725Z", transform: "translate(-110.856 -33.157)" }), index.h("path", { key: '39f77d5f4028baf654fdc07a2f03525b994d508f', class: "PasswordVisibilityIcon", d: "M149.119,34.14a45.875,45.875,0,0,0-4.055-2.729,20.541,20.541,0,0,0-2.547-1.248,5.6,5.6,0,0,0-4.79-.017l.7.856a5.254,5.254,0,0,1,1.672-.346,10.072,10.072,0,0,1,4.445,1.663,34.132,34.132,0,0,1,3.925,2.651.13.13,0,0,1,0,.208,40.2,40.2,0,0,1-3.925,2.391c-.179.092-.352.176-.525.26l.684.835c.1-.054.2-.1.309-.159a36.356,36.356,0,0,0,4.055-2.469,1.067,1.067,0,0,0,.52-.936A1.159,1.159,0,0,0,149.119,34.14Z", transform: "translate(-130.743 -29.617)" })), index.h("rect", { key: '74bdc0477190de8bd67e30e0799ed1d4c255fff0', class: "PasswordVisibilityIcon", width: "0.972", height: "15.861", rx: "0.486", transform: "translate(114.827 23.858) rotate(-39.315)" }))), !this.isPasswordVisible &&
298
+ index.h("svg", { key: '89e71e7d5fc2af237c7a0af69838a60f997dc0ee', onClick: () => this.togglePassword(), class: "TogglePasswordVisibility PasswordVisible", part: "TogglePasswordVisibility", xmlns: "http://www.w3.org/2000/svg", width: "18.843", height: "10.5", viewBox: "0 0 18.843 10.5" }, index.h("g", { key: '97447b59b0e079f3b2a154681aef2cef572e445b', transform: "translate(-14.185 -27.832)" }, index.h("path", { key: 'c35b80be71460f5fc0c469ee807e3f83f5ab1cb9', class: "PasswordVisibilityIcon", d: "M23.541,38.332a11.467,11.467,0,0,1-4.886-1.611,34.413,34.413,0,0,1-3.976-2.469,1.1,1.1,0,0,1-.494-.936,1.21,1.21,0,0,1,.442-.962A37.986,37.986,0,0,1,18.6,29.625a16.06,16.06,0,0,1,2.521-1.248,6.862,6.862,0,0,1,2.417-.546,6.862,6.862,0,0,1,2.417.546,20.541,20.541,0,0,1,2.547,1.248,45.872,45.872,0,0,1,4.054,2.729,1.159,1.159,0,0,1,.468.962,1.067,1.067,0,0,1-.52.936,36.353,36.353,0,0,1-4.054,2.469A11.2,11.2,0,0,1,23.541,38.332Zm0-9.46a9.813,9.813,0,0,0-4.392,1.663,44.138,44.138,0,0,0-3.873,2.651.13.13,0,0,0,0,.208,36.5,36.5,0,0,0,3.873,2.391,10.372,10.372,0,0,0,4.392,1.481,11.051,11.051,0,0,0,4.444-1.481,40.2,40.2,0,0,0,3.925-2.391.13.13,0,0,0,0-.208h0a34.132,34.132,0,0,0-3.925-2.651A10.072,10.072,0,0,0,23.541,28.872Z", transform: "translate(0)" }), index.h("circle", { key: '3a6bfc9d02b7c66ecd0e07481e1963a6bcab3fb0', class: "PasswordVisibilityIcon", cx: "2.779", cy: "2.779", r: "2.779", transform: "translate(20.827 30.303)" }))));
299
+ let userIdentification = index.h("div", { key: '5b43adf706d46ce330b81e0bc5e8bbd1bfc2b883', class: "FormBox" }, index.h("div", { key: '0c53a0428fbcb10876e16d0505cf895c5bffa3bd', class: "FormValue" }, index.h("div", { key: '8aeda926da67db1e58595287f15d815e7887dc45', class: (!this.isValidUserEmail || this.hasError) ? 'InputBox InputInvalidBox' : 'InputBox' }, index.h("input", { key: 'bf82f8b419fe217143d3928262b9b256e43a9f79', type: "text", placeholder: '', value: this.userNameEmail, onFocus: (event) => this.handleInputChange(event, 'user'), onInput: (event) => this.handleInputChange(event, 'user'), autocapitalize: "none", required: true }), index.h("label", { key: '7a0f71f2c013c8d00d0d7c66452e09badfd17bb3', class: (this.userNameEmail ? 'FieldFilledIn' : '') + ' ' + (!this.isValidUserEmail || this.hasError ? 'FieldInvalid' : '') }, translate('userEmail', this.lang)), !this.isValidUserEmail &&
300
+ index.h("p", { key: 'ed3453e628b9d60f8df2c3c1e04024706c532bfd', class: "InvalidField" }, translate('invalidField', this.lang))), index.h("div", { key: 'c778082662a1f29bdb6b19799c702ce3b4773a0a', class: (!this.isValidPassword || this.hasError) ? 'InputBox InputInvalidBox' : 'InputBox' }, visibilityIcon, index.h("input", { key: '7cbdd79f39f986efc4cfadf0577782c86af8eec9', type: this.isPasswordVisible ? "text" : "password", placeholder: '', value: this.userPassword, onFocus: (event) => this.handleInputChange(event, 'password'), onInput: (event) => this.handleInputChange(event, 'password'), autocapitalize: "none", required: true }), index.h("label", { key: '94d576059031cb459757f417245a241a768137fe', class: (this.userPassword ? 'FieldFilledIn' : '') + ' ' + (!this.isValidPassword || this.hasError ? 'FieldInvalid' : '') }, translate('password', this.lang)), !this.isValidPassword &&
301
+ index.h("p", { key: '9c961763ac1a5c3af53d63b4b4423f22d341f2a4', class: "InvalidField" }, translate('invalidField', this.lang))), this.passwordReset == 'true' &&
302
+ index.h("div", { key: '9f0730d9d3000def2d5b0edb2fcef7c2b77633cf', class: "ForgotPassword" }, index.h("button", { key: '3bd5379cf60cba95c1338968c451366264bec081', onClick: () => this.resetPassword() }, translate('forgotPassword', this.lang))), index.h("button", { key: '7a5ac0291a075d7c4f1a1f235dc6be2ccfa2239e', disabled: (!this.isValidUserEmail || !this.isValidPassword || !this.userNameEmail || !this.userPassword), class: "SubmitCredentials", onClick: () => this.handleLogin() }, translate('login', this.lang)), this.hasError &&
303
+ index.h("p", { key: 'f40b7b875d615bb6af19dac753910763638409a8', class: "CredentialsError" }, this.errorMessage)));
304
+ return index.h("section", { key: '6c0b3e43c5fdd9993a02f11b9bfa817b2a5069f2', ref: el => this.stylingContainer = el }, userIdentification);
305
+ }
306
+ static get watchers() { return {
307
+ "translationUrl": ["handleNewTranslations"]
308
+ }; }
309
+ };
310
+ UserLogin.style = UserLoginStyle0;
311
+
312
+ exports.user_login = UserLogin;
@@ -0,0 +1,25 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ const index = require('./index-465784fc.js');
6
+ const appGlobals = require('./app-globals-3a1e7e63.js');
7
+
8
+ /*
9
+ Stencil Client Patch Browser v4.20.0 | MIT Licensed | https://stenciljs.com
10
+ */
11
+ var patchBrowser = () => {
12
+ const importMeta = (typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('user-login.cjs.js', document.baseURI).href));
13
+ const opts = {};
14
+ if (importMeta !== "") {
15
+ opts.resourcesUrl = new URL(".", importMeta).href;
16
+ }
17
+ return index.promiseResolve(opts);
18
+ };
19
+
20
+ patchBrowser().then(async (options) => {
21
+ await appGlobals.globalScripts();
22
+ return index.bootstrapLazy([["user-login.cjs",[[1,"user-login",{"endpoint":[513],"lang":[1537],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"passwordReset":[513,"password-reset"],"userEmailRegex":[513,"user-email-regex"],"userEmailRegexOptions":[513,"user-email-regex-options"],"passwordRegex":[513,"password-regex"],"passwordRegexOptions":[513,"password-regex-options"],"userNameEmail":[32],"userPassword":[32],"isValidUserEmail":[32],"isValidPassword":[32],"isPasswordVisible":[32],"limitStylingAppends":[32],"errorMessage":[32],"hasError":[32]},null,{"translationUrl":["handleNewTranslations"]}]]]], options);
23
+ });
24
+
25
+ exports.setNonce = index.setNonce;
@@ -0,0 +1,12 @@
1
+ {
2
+ "entries": [
3
+ "components/user-login/user-login.js"
4
+ ],
5
+ "compiler": {
6
+ "name": "@stencil/core",
7
+ "version": "4.20.0",
8
+ "typescriptVersion": "5.5.3"
9
+ },
10
+ "collections": [],
11
+ "bundles": []
12
+ }
@@ -0,0 +1 @@
1
+ export { UserLogin } from './user-login';
@@ -0,0 +1,166 @@
1
+ :host {
2
+ display: block;
3
+ font-family: "Roboto", sans-serif;
4
+ }
5
+
6
+ section {
7
+ height: 100%;
8
+ width: 100%;
9
+ background-position: center;
10
+ background-size: cover;
11
+ }
12
+
13
+ .FormValue {
14
+ width: 100%;
15
+ }
16
+
17
+ .FormBox {
18
+ height: 100%;
19
+ display: flex;
20
+ position: relative;
21
+ background: none;
22
+ border: none;
23
+ backdrop-filter: blur(15px) brightness(80%);
24
+ justify-content: center;
25
+ align-items: center;
26
+ }
27
+
28
+ .InputBox {
29
+ position: relative;
30
+ margin: 30px 0;
31
+ width: 100%;
32
+ border-bottom: 2px solid #0797B9;
33
+ }
34
+ .InputBox.InputInvalidBox::after {
35
+ content: "";
36
+ height: 2px;
37
+ width: 100%;
38
+ transition: width 0.6s linear;
39
+ background: #C23135;
40
+ }
41
+ .InputBox::after {
42
+ content: "";
43
+ display: block;
44
+ width: 0;
45
+ height: 2px;
46
+ position: relative;
47
+ top: 2px;
48
+ }
49
+ .InputBox .PasswordVisibilityIcon {
50
+ fill: #0797B9;
51
+ }
52
+ .InputBox .InputIcon .TogglePasswordVisibility {
53
+ cursor: pointer;
54
+ position: absolute;
55
+ top: 18px;
56
+ right: 0;
57
+ }
58
+ .InputBox .InputIcon .TogglePasswordVisibility.PasswordVisible {
59
+ top: 19.5px;
60
+ }
61
+ .InputBox label {
62
+ position: absolute;
63
+ top: 50%;
64
+ left: 5px;
65
+ transform: translateY(-50%);
66
+ color: #0797B9;
67
+ font-size: 1em;
68
+ pointer-events: none;
69
+ transition: 0.5s;
70
+ }
71
+ .InputBox label.FieldInvalid {
72
+ color: #C23135;
73
+ }
74
+ .InputBox input {
75
+ width: 100%;
76
+ height: 50px;
77
+ background: transparent;
78
+ border: none;
79
+ outline: none;
80
+ font-size: 1em;
81
+ padding: 0 35px 0 5px;
82
+ color: #fff;
83
+ box-sizing: border-box;
84
+ }
85
+
86
+ /* animations: start */
87
+ input:focus ~ label,
88
+ label.FieldFilledIn {
89
+ top: -3px;
90
+ font-size: 0.7em;
91
+ }
92
+
93
+ /* animation:end */
94
+ .ForgotPassword button {
95
+ margin: -10px 0 17px;
96
+ font-size: 0.9em;
97
+ color: #0797B9;
98
+ display: flex;
99
+ justify-content: space-between;
100
+ background-color: transparent;
101
+ padding: 0;
102
+ height: unset;
103
+ border: 0;
104
+ cursor: pointer;
105
+ }
106
+ .ForgotPassword button:hover {
107
+ color: #fff;
108
+ }
109
+
110
+ .SubmitCredentials {
111
+ display: block;
112
+ margin: 0 auto;
113
+ padding: 10px 20px;
114
+ border-radius: 5px;
115
+ color: var(--emfe-w-button-typography, var(--emfe-w-color-white, #FFFFFF));
116
+ background: linear-gradient(to right, #EA0C66, #77318F);
117
+ border: none;
118
+ outline: none;
119
+ cursor: pointer;
120
+ font-size: 1em;
121
+ }
122
+ .SubmitCredentials:disabled {
123
+ background: #707070;
124
+ }
125
+
126
+ .Register {
127
+ font-size: 0.9em;
128
+ color: #fff;
129
+ text-align: center;
130
+ margin: 25px 0 10px;
131
+ }
132
+ .Register p a {
133
+ text-decoration: none;
134
+ color: #fff;
135
+ font-weight: 600;
136
+ }
137
+ .Register p a:hover {
138
+ text-decoration: underline;
139
+ }
140
+
141
+ .InvalidField {
142
+ position: absolute;
143
+ top: 45px;
144
+ color: #C23135;
145
+ font-size: 0.7em;
146
+ }
147
+
148
+ .SubmitCredentials {
149
+ margin-bottom: 20px;
150
+ }
151
+
152
+ .CredentialsError {
153
+ color: #C23135;
154
+ font-size: 0.7em;
155
+ padding: 0 0 20px 0;
156
+ margin: 0;
157
+ }
158
+
159
+ /* Responsiveness:Start */
160
+ @media screen and (max-width: 480px) {
161
+ .FormBox {
162
+ width: 100%;
163
+ border-radius: 0px;
164
+ }
165
+ }
166
+ /* Responsiveness:End */