@lumiapassport/ui-kit 1.9.3 → 1.10.0

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 (12) hide show
  1. package/dist/iframe/_headers +4 -1
  2. package/dist/iframe/index.html +2 -2
  3. package/dist/iframe/main.js +1 -1
  4. package/dist/iframe/oauth/telegram.html +128 -0
  5. package/dist/iframe/oauth/telegram.js +112 -0
  6. package/dist/index.cjs +3851 -3542
  7. package/dist/index.cjs.map +1 -1
  8. package/dist/index.d.cts +227 -4
  9. package/dist/index.d.ts +227 -4
  10. package/dist/index.js +3799 -3454
  11. package/dist/index.js.map +1 -1
  12. package/package.json +1 -1
package/dist/iframe/_headers CHANGED
@@ -6,8 +6,11 @@
6
6
  # IMPORTANT: frame-ancestors 'https:' allows embedding on any HTTPS site
7
7
  # Domain validation is performed via projectId check in JavaScript
8
8
  # connect-src whitelist: only allowed TSS servers (where the second key share is stored) and lumiapassport.com subdomains
9
+ # script-src: Added https://telegram.org for Telegram Login Widget
10
+ # script-src: Added 'unsafe-eval' required by Telegram Widget (uses eval for callbacks)
11
+ # frame-src: Added https://oauth.telegram.org for Telegram OAuth iframe
9
12
  # NOTE: http://localhost:* in frame-ancestors is for development testing only
10
- Content-Security-Policy: default-src 'self'; script-src 'self' 'wasm-unsafe-eval'; style-src 'self' 'unsafe-inline'; img-src 'self' data: https: blob:; font-src 'self'; connect-src 'self' https://*.lumiapassport.com; frame-ancestors https: http://localhost:*; base-uri 'self'; form-action 'self';
13
+ Content-Security-Policy: default-src 'self'; script-src 'self' 'wasm-unsafe-eval' 'unsafe-eval' https://telegram.org; style-src 'self' 'unsafe-inline'; img-src 'self' data: https: blob:; font-src 'self'; connect-src 'self' https://*.lumiapassport.com; frame-src https://oauth.telegram.org; frame-ancestors https: http://localhost:*; base-uri 'self'; form-action 'self';
11
14
 
12
15
  # Allow iframe embedding from HTTPS sites (domain validation in JS)
13
16
  # X-Frame-Options is NOT set (CSP frame-ancestors takes precedence)
package/dist/iframe/index.html CHANGED
@@ -10,12 +10,12 @@
10
10
  <!-- WARNING: localhost is allowed ONLY for local development, production CSP in _headers is stricter -->
11
11
  <meta
12
12
  http-equiv="Content-Security-Policy"
13
- content="default-src 'self'; script-src 'self' 'wasm-unsafe-eval'; style-src 'self' 'unsafe-inline'; img-src 'self' data: https: blob:; font-src 'self'; connect-src 'self' http://localhost:* https://*.lumiapassport.com; base-uri 'self'; form-action 'self';"
13
+ content="default-src 'self'; script-src 'self' 'wasm-unsafe-eval' 'unsafe-eval' https://telegram.org; style-src 'self' 'unsafe-inline'; img-src 'self' data: https: blob:; font-src 'self'; connect-src 'self' http://localhost:* https://*.lumiapassport.com; frame-src https://oauth.telegram.org; base-uri 'self'; form-action 'self';"
14
14
  />
15
15
  <meta http-equiv="X-Content-Type-Options" content="nosniff" />
16
16
  <meta http-equiv="Referrer-Policy" content="strict-origin-when-cross-origin" />
17
17
 
18
- <title>Lumia Passport Secure Wallet - iframe version 1.9.3</title>
18
+ <title>Lumia Passport Secure Wallet - iframe version 1.10.0</title>
19
19
 
20
20
  <!-- Styles will be injected by build process -->
21
21
  <style>
package/dist/iframe/main.js CHANGED
@@ -3947,7 +3947,7 @@ var BackupManager = class {
3947
3947
  };
3948
3948
 
3949
3949
  // src/iframe/main.ts
3950
- var IFRAME_VERSION = "1.9.3";
3950
+ var IFRAME_VERSION = "1.10.0";
3951
3951
  var IframeWallet = class {
3952
3952
  constructor() {
3953
3953
  console.log("=".repeat(60));
package/dist/iframe/oauth/telegram.html ADDED
@@ -0,0 +1,128 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <title>Telegram Login - Lumia Passport</title>
7
+
8
+ <style>
9
+ * {
10
+ margin: 0;
11
+ padding: 0;
12
+ box-sizing: border-box;
13
+ }
14
+
15
+ body {
16
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica', 'Arial', sans-serif;
17
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
18
+ color: #333;
19
+ min-height: 100vh;
20
+ display: flex;
21
+ align-items: center;
22
+ justify-content: center;
23
+ padding: 2rem;
24
+ }
25
+
26
+ .container {
27
+ background: white;
28
+ border-radius: 16px;
29
+ padding: 3rem 2rem;
30
+ max-width: 450px;
31
+ width: 100%;
32
+ box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
33
+ text-align: center;
34
+ }
35
+
36
+ .logo {
37
+ width: 80px;
38
+ height: 80px;
39
+ margin: 0 auto 1.5rem;
40
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
41
+ border-radius: 50%;
42
+ display: flex;
43
+ align-items: center;
44
+ justify-content: center;
45
+ font-size: 2.5rem;
46
+ color: white;
47
+ font-weight: bold;
48
+ }
49
+
50
+ h1 {
51
+ font-size: 1.75rem;
52
+ margin-bottom: 0.5rem;
53
+ color: #333;
54
+ }
55
+
56
+ p {
57
+ color: #666;
58
+ margin-bottom: 2rem;
59
+ line-height: 1.5;
60
+ }
61
+
62
+ #telegram-widget-container {
63
+ display: flex;
64
+ justify-content: center;
65
+ align-items: center;
66
+ min-height: 80px;
67
+ margin: 2rem 0;
68
+ }
69
+
70
+ .loading {
71
+ display: flex;
72
+ flex-direction: column;
73
+ align-items: center;
74
+ gap: 1rem;
75
+ }
76
+
77
+ .spinner {
78
+ width: 40px;
79
+ height: 40px;
80
+ border: 4px solid rgba(102, 126, 234, 0.3);
81
+ border-top-color: #667eea;
82
+ border-radius: 50%;
83
+ animation: spin 1s linear infinite;
84
+ }
85
+
86
+ @keyframes spin {
87
+ to { transform: rotate(360deg); }
88
+ }
89
+
90
+ .error {
91
+ background: #fee;
92
+ border: 1px solid #fcc;
93
+ border-radius: 8px;
94
+ padding: 1rem;
95
+ color: #c33;
96
+ margin-top: 1rem;
97
+ }
98
+
99
+ .footer {
100
+ margin-top: 2rem;
101
+ padding-top: 1.5rem;
102
+ border-top: 1px solid #e0e0e0;
103
+ font-size: 0.875rem;
104
+ color: #999;
105
+ }
106
+ </style>
107
+ </head>
108
+ <body>
109
+ <div class="container">
110
+ <div class="logo">L</div>
111
+ <h1>Sign in with Telegram</h1>
112
+ <p>Click the button below to authenticate with your Telegram account</p>
113
+
114
+ <div id="telegram-widget-container">
115
+ <div class="loading">
116
+ <div class="spinner"></div>
117
+ <p>Loading Telegram widget...</p>
118
+ </div>
119
+ </div>
120
+
121
+ <div class="footer">
122
+ <p>You can close this window after authentication</p>
123
+ </div>
124
+ </div>
125
+
126
+ <script src="./telegram.js"></script>
127
+ </body>
128
+ </html>
package/dist/iframe/oauth/telegram.js ADDED
@@ -0,0 +1,112 @@
1
+ /**
2
+ * Telegram OAuth Popup Script
3
+ * Handles Telegram Login Widget integration in popup window
4
+ */
5
+
6
+ // Get bot username from URL parameter
7
+ const urlParams = new URLSearchParams(window.location.search);
8
+ const BOT_USERNAME = urlParams.get('bot');
9
+
10
+ console.log('[Telegram OAuth] Initializing with bot:', BOT_USERNAME);
11
+
12
+ // Setup callback for Telegram widget
13
+ window.onTelegramAuth = function(user) {
14
+ console.log('[Telegram OAuth] Authentication successful:', user);
15
+
16
+ try {
17
+ // Send data to opener window
18
+ if (window.opener) {
19
+ window.opener.postMessage({
20
+ type: 'TELEGRAM_AUTH_SUCCESS',
21
+ provider: 'telegram',
22
+ user: user
23
+ }, '*');
24
+
25
+ // Show success message
26
+ const container = document.getElementById('telegram-widget-container');
27
+ if (container) {
28
+ container.innerHTML = `
29
+ <div style="color: #10b981; font-weight: 500;">
30
+ ✓ Authentication successful!<br>
31
+ <small style="color: #666;">Closing window...</small>
32
+ </div>
33
+ `;
34
+ }
35
+
36
+ // Close popup after short delay
37
+ setTimeout(() => {
38
+ window.close();
39
+ }, 1500);
40
+ } else {
41
+ throw new Error('No opener window found');
42
+ }
43
+ } catch (error) {
44
+ console.error('[Telegram OAuth] Error:', error);
45
+ showError('Failed to communicate with parent window');
46
+ }
47
+ };
48
+
49
+ function showError(message) {
50
+ const container = document.getElementById('telegram-widget-container');
51
+ if (container) {
52
+ container.innerHTML = `
53
+ <div class="error">
54
+ <strong>Error:</strong> ${message}
55
+ </div>
56
+ `;
57
+ }
58
+ }
59
+
60
+ // Load Telegram Login Widget
61
+ function loadTelegramWidget() {
62
+ if (!BOT_USERNAME) {
63
+ showError('Bot username not configured. Pass ?bot=username in URL parameter.');
64
+ return;
65
+ }
66
+
67
+ const container = document.getElementById('telegram-widget-container');
68
+ if (!container) {
69
+ return;
70
+ }
71
+
72
+ // Clear loading indicator
73
+ container.innerHTML = '';
74
+
75
+ // Create script element for Telegram widget
76
+ const script = document.createElement('script');
77
+ script.async = true;
78
+ script.src = 'https://telegram.org/js/telegram-widget.js?22';
79
+ script.setAttribute('data-telegram-login', BOT_USERNAME);
80
+ script.setAttribute('data-size', 'large');
81
+ script.setAttribute('data-userpic', 'true');
82
+ script.setAttribute('data-onauth', 'onTelegramAuth(user)');
83
+ script.setAttribute('data-request-access', 'write');
84
+
85
+ script.onload = () => {
86
+ console.log('[Telegram OAuth] Widget loaded successfully');
87
+ };
88
+
89
+ script.onerror = (error) => {
90
+ console.error('[Telegram OAuth] Failed to load widget:', error);
91
+ showError('Failed to load Telegram widget');
92
+ };
93
+
94
+ container.appendChild(script);
95
+ }
96
+
97
+ // Load widget when DOM is ready
98
+ if (document.readyState === 'loading') {
99
+ document.addEventListener('DOMContentLoaded', loadTelegramWidget);
100
+ } else {
101
+ loadTelegramWidget();
102
+ }
103
+
104
+ // Handle popup closing without authentication
105
+ window.addEventListener('beforeunload', () => {
106
+ if (window.opener) {
107
+ window.opener.postMessage({
108
+ type: 'TELEGRAM_AUTH_CANCELLED',
109
+ provider: 'telegram'
110
+ }, '*');
111
+ }
112
+ });