@klauswuestefeld/jux-web 2024.10.29 → 2024.11.12

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 (6) hide show
  1. package/dist/api-client.d.ts +2 -0
  2. package/dist/jux-web.js +42 -21
  3. package/dist/login/session.d.ts +1 -0
  4. package/dist/main.esm.js +42 -21
  5. package/dist/main.js +42 -21
  6. package/package.json +1 -1
package/dist/api-client.d.ts CHANGED
@@ -8,4 +8,6 @@ export declare const requestMagicLink: (data: any, onJsonResponse: (response: an
8
8
  export declare const openMagicLink: (magicToken: string, onJsonResponse: (response: any) => any, onHelpMessage: (message: string) => any) => void;
9
9
  export declare const googleLogin: (token: string, onLogin: (response: any) => any, onLoginError: (message: string) => any) => void;
10
10
  export declare const microsoftLogin: (token: string, onLogin: (response: any) => any, onLoginError: (message: string) => any) => void;
11
+ export declare const getSSOAuthorizationEndpoint: (onSuccess: (response: any) => any, onError: (message: string) => any) => void;
12
+ export declare const validateSSOToken: (token: string, redirectUri: string, onLogin: (response: any) => any, onError: (message: string) => any) => void;
11
13
  export declare const getMXData: (domainName: string) => Promise<any>;
package/dist/jux-web.js CHANGED
@@ -61,26 +61,30 @@ var juxWeb = (function (exports) {
61
61
  applyComponentStyle(result);
62
62
  result.tabIndex = 0;
63
63
  result.setAttribute('data-cy', `${loweredCasedType}-button`);
64
- const icon = document.createElement('login-icon');
65
- icon.style.gridColumnStart = '2';
66
- icon.style.width = '28px';
67
- icon.style.height = '28px';
68
- icon.style.padding = '6px';
69
- icon.style.marginLeft = '4px';
70
- icon.style.boxSizing = 'content-box';
71
- icon.className = 'ico';
72
64
  // @ts-ignore
73
- icon.innerHTML = icons[loweredCasedType];
65
+ const iconHTML = icons[loweredCasedType];
66
+ if (iconHTML) {
67
+ const icon = document.createElement('login-icon');
68
+ icon.style.gridColumnStart = '2';
69
+ icon.style.width = '28px';
70
+ icon.style.height = '28px';
71
+ icon.style.padding = '6px';
72
+ icon.style.marginLeft = '4px';
73
+ icon.style.boxSizing = 'content-box';
74
+ icon.className = 'ico';
75
+ icon.innerHTML = iconHTML;
76
+ result.appendChild(icon);
77
+ }
74
78
  const label = document.createElement('login-label');
75
79
  label.textContent = window.innerWidth <= THRESHOLD_WIDTH ? type : getTranslation(`${loweredCasedType}-label`);
76
80
  applyLabelStyle(label);
77
- result.append(icon, label);
81
+ result.appendChild(label);
78
82
  result.addEventListener('click', fn);
79
- result.addEventListener('mouseenter', () => {
83
+ result.addEventListener('mouseenter', (_ev) => {
80
84
  result.style.cursor = 'pointer';
81
85
  result.style.boxShadow = '0 0 6px #808080';
82
86
  });
83
- result.addEventListener('mouseleave', () => {
87
+ result.addEventListener('mouseleave', (_ev) => {
84
88
  result.style.cursor = 'auto';
85
89
  result.style.boxShadow = '1px 1px 1px grey';
86
90
  });
@@ -356,6 +360,12 @@ var juxWeb = (function (exports) {
356
360
  const url = getBackendUrl() + 'auth-microsoft?access-token=' + token;
357
361
  backendRequest(url, {}, onLogin, onLoginError);
358
362
  };
363
+ const getSSOAuthorizationEndpoint = (onSuccess, onError) => {
364
+ backendGet('openid/authorization-endpoint', null, onSuccess, onError);
365
+ };
366
+ const validateSSOToken = (token, redirectUri, onLogin, onError) => {
367
+ backendGet('openid/callback', { code: token, 'redirect-uri': redirectUri }, onLogin, onError);
368
+ };
359
369
  const getMXData = (domainName) => __awaiter$2(void 0, void 0, void 0, function* () {
360
370
  try {
361
371
  const records = yield fetch(`https://dns.google.com/resolve?name=${domainName}&type=MX`, {
@@ -14330,6 +14340,10 @@ var juxWeb = (function (exports) {
14330
14340
  Array.from(clientApp.children).forEach(el => el.remove());
14331
14341
  clientApp.appendChild(page);
14332
14342
  };
14343
+ const getSSOCallbackURI = () => {
14344
+ const { protocol, host } = window.location;
14345
+ return protocol + '//' + host + '/callback';
14346
+ };
14333
14347
  const initSession = (clientApp, supportedLoginTypes, onUserLogin, backgroundImage, fetchUserBackendUrl, magicLinkRequestEndpoint, magicLinkAuthEndpoint) => {
14334
14348
  // if (startNewDemo()) {
14335
14349
  // initDemo(setBackendToken, onAuthentication);
@@ -14367,16 +14381,12 @@ var juxWeb = (function (exports) {
14367
14381
  backendGet('profile', null, (res) => onAuthentication(onUserLogin, res, 'Token Authentication'), (_err) => onAuthenticationFailure('login-failed'));
14368
14382
  return;
14369
14383
  }
14384
+ const ssoToken = extractTokenFromWindowLocation('code');
14385
+ if (ssoToken) {
14386
+ validateSSOToken(ssoToken, getSSOCallbackURI(), (res) => onAuthentication(onUserLogin, res, 'SSO Authentication'), () => onAuthenticationFailure('login-failed'));
14387
+ return;
14388
+ }
14370
14389
  displayPage(clientApp, loginPage(clientApp, backgroundImage, onUserLogin, supportedLoginTypes));
14371
- // const linkedinToken = extractTokenFromWindowLocation('code', '\&state=9893849343');
14372
- // if (linkedinToken) {
14373
- // openLinkedinSession(
14374
- // linkedinToken,
14375
- // (res) => onAuthentication(res, 'Linkedin Authentication'),
14376
- // () => onAuthenticationFailure('unable-linkedin-login')
14377
- // );
14378
- // return;
14379
- // }
14380
14390
  // validateThirdPartyCookies(initGapi, () => displayPage(Page.LOGIN));
14381
14391
  // checkMixpanel(() => mixpanel.track('View Login Page'));
14382
14392
  };
@@ -14418,6 +14428,14 @@ var juxWeb = (function (exports) {
14418
14428
  authSignIn(onUserLogin);
14419
14429
  }, onCookieError);
14420
14430
  };
14431
+ const handleSSOLogin = () => {
14432
+ const onSuccess = (authEndpoint) => {
14433
+ const authUrl = authEndpoint + `&redirect_uri=${getSSOCallbackURI()}`;
14434
+ window.location.replace(authUrl);
14435
+ };
14436
+ const onError = () => onAuthenticationFailure('login-failed');
14437
+ getSSOAuthorizationEndpoint(onSuccess, onError);
14438
+ };
14421
14439
  const handleMagicLinkRequest = (token, onReturn, backgroundImage, currentPage, clientBody, email = '') => {
14422
14440
  if (!email) {
14423
14441
  const mailMagic = document.querySelector('#mail-magic');
@@ -14611,6 +14629,9 @@ var juxWeb = (function (exports) {
14611
14629
  if (loginTypes.includes('Email')) {
14612
14630
  section.appendChild(loginButton('Email', () => onEmailLoginRequest(clientApp, loginPage, onUserLogin, backgroundImg, loginTypes)));
14613
14631
  }
14632
+ if (loginTypes.includes('SSO')) {
14633
+ section.appendChild(loginButton('SSO', () => handleSSOLogin()));
14634
+ }
14614
14635
  };
14615
14636
  const loginPage = (clientApp, backgroundImg, onUserLogin, loginTypes) => {
14616
14637
  const content = [];
package/dist/login/session.d.ts CHANGED
@@ -3,4 +3,5 @@ export declare const onTokenAcquired: (token: string, onUserLogin: any) => void;
3
3
  export declare const initSession: (clientApp: HTMLElement, supportedLoginTypes: string[], onUserLogin: any, backgroundImage: string, fetchUserBackendUrl: any, magicLinkRequestEndpoint: string | null, magicLinkAuthEndpoint: string | null) => void;
4
4
  export declare const onMicrosoftSignIn: (onUserLogin: any) => Promise<void>;
5
5
  export declare const onGoogleSignIn: (onUserLogin: any) => void;
6
+ export declare const handleSSOLogin: () => void;
6
7
  export declare const handleMagicLinkRequest: (token: string | null, onReturn: any, backgroundImage: string, currentPage: HTMLElement, clientBody: HTMLElement, email?: string) => void;
package/dist/main.esm.js CHANGED
@@ -60,26 +60,30 @@ const loginButton = (type, fn) => {
60
60
  applyComponentStyle(result);
61
61
  result.tabIndex = 0;
62
62
  result.setAttribute('data-cy', `${loweredCasedType}-button`);
63
- const icon = document.createElement('login-icon');
64
- icon.style.gridColumnStart = '2';
65
- icon.style.width = '28px';
66
- icon.style.height = '28px';
67
- icon.style.padding = '6px';
68
- icon.style.marginLeft = '4px';
69
- icon.style.boxSizing = 'content-box';
70
- icon.className = 'ico';
71
63
  // @ts-ignore
72
- icon.innerHTML = icons[loweredCasedType];
64
+ const iconHTML = icons[loweredCasedType];
65
+ if (iconHTML) {
66
+ const icon = document.createElement('login-icon');
67
+ icon.style.gridColumnStart = '2';
68
+ icon.style.width = '28px';
69
+ icon.style.height = '28px';
70
+ icon.style.padding = '6px';
71
+ icon.style.marginLeft = '4px';
72
+ icon.style.boxSizing = 'content-box';
73
+ icon.className = 'ico';
74
+ icon.innerHTML = iconHTML;
75
+ result.appendChild(icon);
76
+ }
73
77
  const label = document.createElement('login-label');
74
78
  label.textContent = window.innerWidth <= THRESHOLD_WIDTH ? type : getTranslation(`${loweredCasedType}-label`);
75
79
  applyLabelStyle(label);
76
- result.append(icon, label);
80
+ result.appendChild(label);
77
81
  result.addEventListener('click', fn);
78
- result.addEventListener('mouseenter', () => {
82
+ result.addEventListener('mouseenter', (_ev) => {
79
83
  result.style.cursor = 'pointer';
80
84
  result.style.boxShadow = '0 0 6px #808080';
81
85
  });
82
- result.addEventListener('mouseleave', () => {
86
+ result.addEventListener('mouseleave', (_ev) => {
83
87
  result.style.cursor = 'auto';
84
88
  result.style.boxShadow = '1px 1px 1px grey';
85
89
  });
@@ -355,6 +359,12 @@ const microsoftLogin = (token, onLogin, onLoginError) => {
355
359
  const url = getBackendUrl() + 'auth-microsoft?access-token=' + token;
356
360
  backendRequest(url, {}, onLogin, onLoginError);
357
361
  };
362
+ const getSSOAuthorizationEndpoint = (onSuccess, onError) => {
363
+ backendGet('openid/authorization-endpoint', null, onSuccess, onError);
364
+ };
365
+ const validateSSOToken = (token, redirectUri, onLogin, onError) => {
366
+ backendGet('openid/callback', { code: token, 'redirect-uri': redirectUri }, onLogin, onError);
367
+ };
358
368
  const getMXData = (domainName) => __awaiter(void 0, void 0, void 0, function* () {
359
369
  try {
360
370
  const records = yield fetch(`https://dns.google.com/resolve?name=${domainName}&type=MX`, {
@@ -1010,6 +1020,10 @@ const displayPage = (clientApp, page) => {
1010
1020
  Array.from(clientApp.children).forEach(el => el.remove());
1011
1021
  clientApp.appendChild(page);
1012
1022
  };
1023
+ const getSSOCallbackURI = () => {
1024
+ const { protocol, host } = window.location;
1025
+ return protocol + '//' + host + '/callback';
1026
+ };
1013
1027
  const initSession = (clientApp, supportedLoginTypes, onUserLogin, backgroundImage, fetchUserBackendUrl, magicLinkRequestEndpoint, magicLinkAuthEndpoint) => {
1014
1028
  // if (startNewDemo()) {
1015
1029
  // initDemo(setBackendToken, onAuthentication);
@@ -1047,16 +1061,12 @@ const initSession = (clientApp, supportedLoginTypes, onUserLogin, backgroundImag
1047
1061
  backendGet('profile', null, (res) => onAuthentication(onUserLogin, res, 'Token Authentication'), (_err) => onAuthenticationFailure('login-failed'));
1048
1062
  return;
1049
1063
  }
1064
+ const ssoToken = extractTokenFromWindowLocation('code');
1065
+ if (ssoToken) {
1066
+ validateSSOToken(ssoToken, getSSOCallbackURI(), (res) => onAuthentication(onUserLogin, res, 'SSO Authentication'), () => onAuthenticationFailure('login-failed'));
1067
+ return;
1068
+ }
1050
1069
  displayPage(clientApp, loginPage(clientApp, backgroundImage, onUserLogin, supportedLoginTypes));
1051
- // const linkedinToken = extractTokenFromWindowLocation('code', '\&state=9893849343');
1052
- // if (linkedinToken) {
1053
- // openLinkedinSession(
1054
- // linkedinToken,
1055
- // (res) => onAuthentication(res, 'Linkedin Authentication'),
1056
- // () => onAuthenticationFailure('unable-linkedin-login')
1057
- // );
1058
- // return;
1059
- // }
1060
1070
  // validateThirdPartyCookies(initGapi, () => displayPage(Page.LOGIN));
1061
1071
  // checkMixpanel(() => mixpanel.track('View Login Page'));
1062
1072
  };
@@ -1098,6 +1108,14 @@ const onGoogleSignIn = (onUserLogin) => {
1098
1108
  authSignIn(onUserLogin);
1099
1109
  }, onCookieError);
1100
1110
  };
1111
+ const handleSSOLogin = () => {
1112
+ const onSuccess = (authEndpoint) => {
1113
+ const authUrl = authEndpoint + `&redirect_uri=${getSSOCallbackURI()}`;
1114
+ window.location.replace(authUrl);
1115
+ };
1116
+ const onError = () => onAuthenticationFailure('login-failed');
1117
+ getSSOAuthorizationEndpoint(onSuccess, onError);
1118
+ };
1101
1119
  const handleMagicLinkRequest = (token, onReturn, backgroundImage, currentPage, clientBody, email = '') => {
1102
1120
  if (!email) {
1103
1121
  const mailMagic = document.querySelector('#mail-magic');
@@ -1291,6 +1309,9 @@ const appendLoginTypes = (loginPage, section, clientApp, onUserLogin, loginTypes
1291
1309
  if (loginTypes.includes('Email')) {
1292
1310
  section.appendChild(loginButton('Email', () => onEmailLoginRequest(clientApp, loginPage, onUserLogin, backgroundImg, loginTypes)));
1293
1311
  }
1312
+ if (loginTypes.includes('SSO')) {
1313
+ section.appendChild(loginButton('SSO', () => handleSSOLogin()));
1314
+ }
1294
1315
  };
1295
1316
  const loginPage = (clientApp, backgroundImg, onUserLogin, loginTypes) => {
1296
1317
  const content = [];
package/dist/main.js CHANGED
@@ -84,26 +84,30 @@ const loginButton = (type, fn) => {
84
84
  applyComponentStyle(result);
85
85
  result.tabIndex = 0;
86
86
  result.setAttribute('data-cy', `${loweredCasedType}-button`);
87
- const icon = document.createElement('login-icon');
88
- icon.style.gridColumnStart = '2';
89
- icon.style.width = '28px';
90
- icon.style.height = '28px';
91
- icon.style.padding = '6px';
92
- icon.style.marginLeft = '4px';
93
- icon.style.boxSizing = 'content-box';
94
- icon.className = 'ico';
95
87
  // @ts-ignore
96
- icon.innerHTML = icons[loweredCasedType];
88
+ const iconHTML = icons[loweredCasedType];
89
+ if (iconHTML) {
90
+ const icon = document.createElement('login-icon');
91
+ icon.style.gridColumnStart = '2';
92
+ icon.style.width = '28px';
93
+ icon.style.height = '28px';
94
+ icon.style.padding = '6px';
95
+ icon.style.marginLeft = '4px';
96
+ icon.style.boxSizing = 'content-box';
97
+ icon.className = 'ico';
98
+ icon.innerHTML = iconHTML;
99
+ result.appendChild(icon);
100
+ }
97
101
  const label = document.createElement('login-label');
98
102
  label.textContent = window.innerWidth <= THRESHOLD_WIDTH ? type : getTranslation(`${loweredCasedType}-label`);
99
103
  applyLabelStyle(label);
100
- result.append(icon, label);
104
+ result.appendChild(label);
101
105
  result.addEventListener('click', fn);
102
- result.addEventListener('mouseenter', () => {
106
+ result.addEventListener('mouseenter', (_ev) => {
103
107
  result.style.cursor = 'pointer';
104
108
  result.style.boxShadow = '0 0 6px #808080';
105
109
  });
106
- result.addEventListener('mouseleave', () => {
110
+ result.addEventListener('mouseleave', (_ev) => {
107
111
  result.style.cursor = 'auto';
108
112
  result.style.boxShadow = '1px 1px 1px grey';
109
113
  });
@@ -379,6 +383,12 @@ const microsoftLogin = (token, onLogin, onLoginError) => {
379
383
  const url = getBackendUrl() + 'auth-microsoft?access-token=' + token;
380
384
  backendRequest(url, {}, onLogin, onLoginError);
381
385
  };
386
+ const getSSOAuthorizationEndpoint = (onSuccess, onError) => {
387
+ backendGet('openid/authorization-endpoint', null, onSuccess, onError);
388
+ };
389
+ const validateSSOToken = (token, redirectUri, onLogin, onError) => {
390
+ backendGet('openid/callback', { code: token, 'redirect-uri': redirectUri }, onLogin, onError);
391
+ };
382
392
  const getMXData = (domainName) => __awaiter(void 0, void 0, void 0, function* () {
383
393
  try {
384
394
  const records = yield fetch(`https://dns.google.com/resolve?name=${domainName}&type=MX`, {
@@ -1034,6 +1044,10 @@ const displayPage = (clientApp, page) => {
1034
1044
  Array.from(clientApp.children).forEach(el => el.remove());
1035
1045
  clientApp.appendChild(page);
1036
1046
  };
1047
+ const getSSOCallbackURI = () => {
1048
+ const { protocol, host } = window.location;
1049
+ return protocol + '//' + host + '/callback';
1050
+ };
1037
1051
  const initSession = (clientApp, supportedLoginTypes, onUserLogin, backgroundImage, fetchUserBackendUrl, magicLinkRequestEndpoint, magicLinkAuthEndpoint) => {
1038
1052
  // if (startNewDemo()) {
1039
1053
  // initDemo(setBackendToken, onAuthentication);
@@ -1071,16 +1085,12 @@ const initSession = (clientApp, supportedLoginTypes, onUserLogin, backgroundImag
1071
1085
  backendGet('profile', null, (res) => onAuthentication(onUserLogin, res, 'Token Authentication'), (_err) => onAuthenticationFailure('login-failed'));
1072
1086
  return;
1073
1087
  }
1088
+ const ssoToken = extractTokenFromWindowLocation('code');
1089
+ if (ssoToken) {
1090
+ validateSSOToken(ssoToken, getSSOCallbackURI(), (res) => onAuthentication(onUserLogin, res, 'SSO Authentication'), () => onAuthenticationFailure('login-failed'));
1091
+ return;
1092
+ }
1074
1093
  displayPage(clientApp, loginPage(clientApp, backgroundImage, onUserLogin, supportedLoginTypes));
1075
- // const linkedinToken = extractTokenFromWindowLocation('code', '\&state=9893849343');
1076
- // if (linkedinToken) {
1077
- // openLinkedinSession(
1078
- // linkedinToken,
1079
- // (res) => onAuthentication(res, 'Linkedin Authentication'),
1080
- // () => onAuthenticationFailure('unable-linkedin-login')
1081
- // );
1082
- // return;
1083
- // }
1084
1094
  // validateThirdPartyCookies(initGapi, () => displayPage(Page.LOGIN));
1085
1095
  // checkMixpanel(() => mixpanel.track('View Login Page'));
1086
1096
  };
@@ -1122,6 +1132,14 @@ const onGoogleSignIn = (onUserLogin) => {
1122
1132
  authSignIn(onUserLogin);
1123
1133
  }, onCookieError);
1124
1134
  };
1135
+ const handleSSOLogin = () => {
1136
+ const onSuccess = (authEndpoint) => {
1137
+ const authUrl = authEndpoint + `&redirect_uri=${getSSOCallbackURI()}`;
1138
+ window.location.replace(authUrl);
1139
+ };
1140
+ const onError = () => onAuthenticationFailure('login-failed');
1141
+ getSSOAuthorizationEndpoint(onSuccess, onError);
1142
+ };
1125
1143
  const handleMagicLinkRequest = (token, onReturn, backgroundImage, currentPage, clientBody, email = '') => {
1126
1144
  if (!email) {
1127
1145
  const mailMagic = document.querySelector('#mail-magic');
@@ -1315,6 +1333,9 @@ const appendLoginTypes = (loginPage, section, clientApp, onUserLogin, loginTypes
1315
1333
  if (loginTypes.includes('Email')) {
1316
1334
  section.appendChild(loginButton('Email', () => onEmailLoginRequest(clientApp, loginPage, onUserLogin, backgroundImg, loginTypes)));
1317
1335
  }
1336
+ if (loginTypes.includes('SSO')) {
1337
+ section.appendChild(loginButton('SSO', () => handleSSOLogin()));
1338
+ }
1318
1339
  };
1319
1340
  const loginPage = (clientApp, backgroundImg, onUserLogin, loginTypes) => {
1320
1341
  const content = [];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@klauswuestefeld/jux-web",
3
- "version": "2024.10.29",
3
+ "version": "2024.11.12",
4
4
  "author": "Jux.House",
5
5
  "license": "Copyrighted",
6
6
  "description": "",