playkit-sdk 1.2.8-beta.5 → 1.2.10
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.
- package/dist/playkit-sdk.cjs.js +253 -158
- package/dist/playkit-sdk.cjs.js.map +1 -1
- package/dist/playkit-sdk.d.ts +76 -1
- package/dist/playkit-sdk.esm.js +253 -158
- package/dist/playkit-sdk.esm.js.map +1 -1
- package/dist/playkit-sdk.umd.js +253 -158
- package/dist/playkit-sdk.umd.js.map +1 -1
- package/package.json +1 -1
package/dist/playkit-sdk.cjs.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* playkit-sdk v1.2.
|
|
2
|
+
* playkit-sdk v1.2.10
|
|
3
3
|
* PlayKit SDK for JavaScript
|
|
4
4
|
* @license SEE LICENSE IN LICENSE
|
|
5
5
|
*/
|
|
@@ -1147,41 +1147,40 @@ class AuthFlowManager extends EventEmitter {
|
|
|
1147
1147
|
left: 0;
|
|
1148
1148
|
right: 0;
|
|
1149
1149
|
bottom: 0;
|
|
1150
|
-
background: rgba(0, 0, 0, 0.
|
|
1151
|
-
backdrop-filter: blur(8px);
|
|
1150
|
+
background: rgba(0, 0, 0, 0.8);
|
|
1152
1151
|
}
|
|
1153
1152
|
|
|
1154
1153
|
.playkit-auth-container {
|
|
1155
1154
|
position: relative;
|
|
1156
|
-
background: #
|
|
1157
|
-
border
|
|
1158
|
-
box-shadow: 0
|
|
1155
|
+
background: #fff;
|
|
1156
|
+
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
1157
|
+
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.05);
|
|
1159
1158
|
width: 90%;
|
|
1160
|
-
max-width:
|
|
1159
|
+
max-width: 320px;
|
|
1161
1160
|
overflow: hidden;
|
|
1162
1161
|
}
|
|
1163
1162
|
|
|
1164
1163
|
.playkit-auth-panel {
|
|
1165
|
-
padding:
|
|
1164
|
+
padding: 24px;
|
|
1166
1165
|
}
|
|
1167
1166
|
|
|
1168
1167
|
.playkit-auth-header {
|
|
1169
1168
|
text-align: center;
|
|
1170
|
-
margin-bottom:
|
|
1169
|
+
margin-bottom: 20px;
|
|
1171
1170
|
position: relative;
|
|
1172
1171
|
}
|
|
1173
1172
|
|
|
1174
1173
|
.playkit-auth-header h2 {
|
|
1175
1174
|
margin: 0 0 8px 0;
|
|
1176
|
-
font-size:
|
|
1175
|
+
font-size: 14px;
|
|
1177
1176
|
font-weight: 600;
|
|
1178
|
-
color: #
|
|
1177
|
+
color: #171717;
|
|
1179
1178
|
}
|
|
1180
1179
|
|
|
1181
1180
|
.playkit-auth-header p {
|
|
1182
1181
|
margin: 0;
|
|
1183
1182
|
font-size: 14px;
|
|
1184
|
-
color: #
|
|
1183
|
+
color: #666;
|
|
1185
1184
|
line-height: 1.5;
|
|
1186
1185
|
}
|
|
1187
1186
|
|
|
@@ -1193,22 +1192,20 @@ class AuthFlowManager extends EventEmitter {
|
|
|
1193
1192
|
border: none;
|
|
1194
1193
|
cursor: pointer;
|
|
1195
1194
|
padding: 4px;
|
|
1196
|
-
|
|
1197
|
-
|
|
1198
|
-
transition: background-color 0.15s ease, color 0.15s ease;
|
|
1195
|
+
color: #666;
|
|
1196
|
+
transition: background-color 0.2s ease, color 0.2s ease;
|
|
1199
1197
|
}
|
|
1200
1198
|
|
|
1201
1199
|
.playkit-back-button:hover {
|
|
1202
|
-
background: #
|
|
1203
|
-
color: #
|
|
1200
|
+
background: #f5f5f5;
|
|
1201
|
+
color: #171717;
|
|
1204
1202
|
}
|
|
1205
1203
|
|
|
1206
1204
|
.playkit-auth-toggle {
|
|
1207
1205
|
display: flex;
|
|
1208
|
-
background: #
|
|
1209
|
-
border-radius: 2px;
|
|
1206
|
+
background: #f5f5f5;
|
|
1210
1207
|
padding: 2px;
|
|
1211
|
-
margin-bottom:
|
|
1208
|
+
margin-bottom: 20px;
|
|
1212
1209
|
gap: 2px;
|
|
1213
1210
|
}
|
|
1214
1211
|
|
|
@@ -1218,9 +1215,8 @@ class AuthFlowManager extends EventEmitter {
|
|
|
1218
1215
|
justify-content: center;
|
|
1219
1216
|
align-items: center;
|
|
1220
1217
|
padding: 10px 16px;
|
|
1221
|
-
border-radius: 2px;
|
|
1222
1218
|
cursor: pointer;
|
|
1223
|
-
transition: background-color 0.
|
|
1219
|
+
transition: background-color 0.2s ease;
|
|
1224
1220
|
}
|
|
1225
1221
|
|
|
1226
1222
|
.playkit-toggle-option input {
|
|
@@ -1230,20 +1226,20 @@ class AuthFlowManager extends EventEmitter {
|
|
|
1230
1226
|
.playkit-toggle-option span {
|
|
1231
1227
|
font-size: 14px;
|
|
1232
1228
|
font-weight: 500;
|
|
1233
|
-
color: #
|
|
1234
|
-
transition: color 0.
|
|
1229
|
+
color: #666;
|
|
1230
|
+
transition: color 0.2s ease;
|
|
1235
1231
|
}
|
|
1236
1232
|
|
|
1237
1233
|
.playkit-toggle-option input:checked + span {
|
|
1238
|
-
color: #
|
|
1234
|
+
color: #fff;
|
|
1239
1235
|
}
|
|
1240
1236
|
|
|
1241
1237
|
.playkit-toggle-option:has(input:checked) {
|
|
1242
|
-
background: #
|
|
1238
|
+
background: #171717;
|
|
1243
1239
|
}
|
|
1244
1240
|
|
|
1245
1241
|
.playkit-auth-input-group {
|
|
1246
|
-
margin-bottom:
|
|
1242
|
+
margin-bottom: 20px;
|
|
1247
1243
|
}
|
|
1248
1244
|
|
|
1249
1245
|
.playkit-input-wrapper {
|
|
@@ -1255,29 +1251,27 @@ class AuthFlowManager extends EventEmitter {
|
|
|
1255
1251
|
.playkit-input-icon {
|
|
1256
1252
|
position: absolute;
|
|
1257
1253
|
left: 12px;
|
|
1258
|
-
color: #
|
|
1254
|
+
color: #999;
|
|
1259
1255
|
pointer-events: none;
|
|
1260
1256
|
}
|
|
1261
1257
|
|
|
1262
1258
|
.playkit-input-wrapper input {
|
|
1263
1259
|
width: 100%;
|
|
1264
|
-
padding:
|
|
1265
|
-
border: 1px solid #
|
|
1266
|
-
border-radius: 2px;
|
|
1260
|
+
padding: 10px 12px 10px 44px;
|
|
1261
|
+
border: 1px solid #e5e7eb;
|
|
1267
1262
|
font-size: 14px;
|
|
1268
|
-
transition: border-color 0.
|
|
1263
|
+
transition: border-color 0.2s ease;
|
|
1269
1264
|
box-sizing: border-box;
|
|
1270
|
-
background: #
|
|
1265
|
+
background: #fff;
|
|
1271
1266
|
}
|
|
1272
1267
|
|
|
1273
1268
|
.playkit-input-wrapper input:hover {
|
|
1274
|
-
border-color: #
|
|
1269
|
+
border-color: #d4d4d4;
|
|
1275
1270
|
}
|
|
1276
1271
|
|
|
1277
1272
|
.playkit-input-wrapper input:focus {
|
|
1278
1273
|
outline: none;
|
|
1279
|
-
border-color: #
|
|
1280
|
-
box-shadow: 0 0 0 3px rgba(39, 110, 241, 0.1);
|
|
1274
|
+
border-color: #171717;
|
|
1281
1275
|
}
|
|
1282
1276
|
|
|
1283
1277
|
.playkit-code-inputs {
|
|
@@ -1287,16 +1281,15 @@ class AuthFlowManager extends EventEmitter {
|
|
|
1287
1281
|
}
|
|
1288
1282
|
|
|
1289
1283
|
.playkit-code-input {
|
|
1290
|
-
width:
|
|
1291
|
-
height:
|
|
1284
|
+
width: 40px !important;
|
|
1285
|
+
height: 48px;
|
|
1292
1286
|
text-align: center;
|
|
1293
|
-
font-size:
|
|
1287
|
+
font-size: 20px;
|
|
1294
1288
|
font-weight: 600;
|
|
1295
|
-
border: 1px solid #
|
|
1296
|
-
border-radius: 2px;
|
|
1289
|
+
border: 1px solid #e5e7eb !important;
|
|
1297
1290
|
padding: 0 !important;
|
|
1298
|
-
transition: border-color 0.
|
|
1299
|
-
background: #
|
|
1291
|
+
transition: border-color 0.2s ease;
|
|
1292
|
+
background: #fff;
|
|
1300
1293
|
-moz-appearance: textfield;
|
|
1301
1294
|
}
|
|
1302
1295
|
|
|
@@ -1307,48 +1300,46 @@ class AuthFlowManager extends EventEmitter {
|
|
|
1307
1300
|
}
|
|
1308
1301
|
|
|
1309
1302
|
.playkit-code-input:hover {
|
|
1310
|
-
border-color: #
|
|
1303
|
+
border-color: #d4d4d4 !important;
|
|
1311
1304
|
}
|
|
1312
1305
|
|
|
1313
1306
|
.playkit-code-input:focus {
|
|
1314
1307
|
outline: none;
|
|
1315
|
-
border-color: #
|
|
1316
|
-
box-shadow: 0 0 0 3px rgba(39, 110, 241, 0.1);
|
|
1308
|
+
border-color: #171717 !important;
|
|
1317
1309
|
}
|
|
1318
1310
|
|
|
1319
1311
|
.playkit-auth-button {
|
|
1320
1312
|
width: 100%;
|
|
1321
|
-
padding:
|
|
1322
|
-
background: #
|
|
1323
|
-
color:
|
|
1313
|
+
padding: 10px 16px;
|
|
1314
|
+
background: #171717;
|
|
1315
|
+
color: white;
|
|
1324
1316
|
border: none;
|
|
1325
|
-
border-radius: 2px;
|
|
1326
1317
|
font-size: 14px;
|
|
1327
1318
|
font-weight: 500;
|
|
1328
1319
|
cursor: pointer;
|
|
1329
|
-
transition: background
|
|
1320
|
+
transition: background 0.2s ease;
|
|
1330
1321
|
}
|
|
1331
1322
|
|
|
1332
1323
|
.playkit-auth-button:hover:not(:disabled) {
|
|
1333
|
-
background: #
|
|
1324
|
+
background: #404040;
|
|
1334
1325
|
}
|
|
1335
1326
|
|
|
1336
1327
|
.playkit-auth-button:active:not(:disabled) {
|
|
1337
|
-
background: #
|
|
1328
|
+
background: #0a0a0a;
|
|
1338
1329
|
}
|
|
1339
1330
|
|
|
1340
1331
|
.playkit-auth-button:disabled {
|
|
1341
|
-
background: #
|
|
1332
|
+
background: #e5e7eb;
|
|
1333
|
+
color: #999;
|
|
1342
1334
|
cursor: not-allowed;
|
|
1343
1335
|
}
|
|
1344
1336
|
|
|
1345
1337
|
.playkit-auth-error {
|
|
1346
1338
|
margin-top: 16px;
|
|
1347
1339
|
padding: 12px 16px;
|
|
1348
|
-
background: #
|
|
1349
|
-
border: 1px solid #
|
|
1350
|
-
|
|
1351
|
-
color: #CC3333;
|
|
1340
|
+
background: #fef2f2;
|
|
1341
|
+
border: 1px solid #fecaca;
|
|
1342
|
+
color: #dc2626;
|
|
1352
1343
|
font-size: 13px;
|
|
1353
1344
|
text-align: left;
|
|
1354
1345
|
display: none;
|
|
@@ -1368,16 +1359,15 @@ class AuthFlowManager extends EventEmitter {
|
|
|
1368
1359
|
display: flex;
|
|
1369
1360
|
justify-content: center;
|
|
1370
1361
|
align-items: center;
|
|
1371
|
-
border-radius: 4px;
|
|
1372
1362
|
}
|
|
1373
1363
|
|
|
1374
1364
|
.playkit-spinner {
|
|
1375
|
-
width:
|
|
1376
|
-
height:
|
|
1377
|
-
border:
|
|
1378
|
-
border-top:
|
|
1365
|
+
width: 24px;
|
|
1366
|
+
height: 24px;
|
|
1367
|
+
border: 2px solid #e5e7eb;
|
|
1368
|
+
border-top: 2px solid #171717;
|
|
1379
1369
|
border-radius: 50%;
|
|
1380
|
-
animation: playkit-spin
|
|
1370
|
+
animation: playkit-spin 1s linear infinite;
|
|
1381
1371
|
}
|
|
1382
1372
|
|
|
1383
1373
|
@keyframes playkit-spin {
|
|
@@ -1389,17 +1379,16 @@ class AuthFlowManager extends EventEmitter {
|
|
|
1389
1379
|
.playkit-auth-container {
|
|
1390
1380
|
width: 95%;
|
|
1391
1381
|
max-width: none;
|
|
1392
|
-
border-radius: 2px;
|
|
1393
1382
|
}
|
|
1394
1383
|
|
|
1395
1384
|
.playkit-auth-panel {
|
|
1396
|
-
padding:
|
|
1385
|
+
padding: 20px;
|
|
1397
1386
|
}
|
|
1398
1387
|
|
|
1399
1388
|
.playkit-code-input {
|
|
1400
|
-
width:
|
|
1401
|
-
height:
|
|
1402
|
-
font-size:
|
|
1389
|
+
width: 36px !important;
|
|
1390
|
+
height: 44px;
|
|
1391
|
+
font-size: 18px;
|
|
1403
1392
|
}
|
|
1404
1393
|
|
|
1405
1394
|
.playkit-code-inputs {
|
|
@@ -2467,6 +2456,22 @@ class AuthManager extends EventEmitter {
|
|
|
2467
2456
|
await this.exchangeJWT(this.config.playerJWT);
|
|
2468
2457
|
return;
|
|
2469
2458
|
}
|
|
2459
|
+
// Check for platform-injected token (same-domain scenario)
|
|
2460
|
+
// This allows seamless auth when SDK runs in a context where the platform
|
|
2461
|
+
// (e.g., Agentland-Space) has already stored a token in localStorage
|
|
2462
|
+
if (this.config.autoDetectPlatformToken !== false && typeof window !== 'undefined') {
|
|
2463
|
+
const platformToken = this.detectPlatformToken();
|
|
2464
|
+
if (platformToken) {
|
|
2465
|
+
this.logger.info('Platform token detected, using for authentication');
|
|
2466
|
+
this.authState = {
|
|
2467
|
+
isAuthenticated: true,
|
|
2468
|
+
token: platformToken,
|
|
2469
|
+
tokenType: 'player',
|
|
2470
|
+
};
|
|
2471
|
+
this.emit('authenticated', this.authState);
|
|
2472
|
+
return;
|
|
2473
|
+
}
|
|
2474
|
+
}
|
|
2470
2475
|
// Not authenticated - trigger auto-login UI
|
|
2471
2476
|
this.emit('unauthenticated');
|
|
2472
2477
|
// In server mode, don't try to show UI - just throw error
|
|
@@ -2608,6 +2613,54 @@ class AuthManager extends EventEmitter {
|
|
|
2608
2613
|
isAuthenticated() {
|
|
2609
2614
|
return this.authState.isAuthenticated;
|
|
2610
2615
|
}
|
|
2616
|
+
/**
|
|
2617
|
+
* Check if current authentication is using developerToken
|
|
2618
|
+
*/
|
|
2619
|
+
isDeveloperTokenAuth() {
|
|
2620
|
+
return this.authState.tokenType === 'developer';
|
|
2621
|
+
}
|
|
2622
|
+
/**
|
|
2623
|
+
* Clear developerToken authentication state.
|
|
2624
|
+
* Used when falling back to player login after developerToken failure.
|
|
2625
|
+
*/
|
|
2626
|
+
clearDeveloperToken() {
|
|
2627
|
+
if (this.authState.tokenType === 'developer') {
|
|
2628
|
+
this.authState = {
|
|
2629
|
+
isAuthenticated: false,
|
|
2630
|
+
};
|
|
2631
|
+
// Also clear the developerToken from config to prevent re-use
|
|
2632
|
+
this.config.developerToken = undefined;
|
|
2633
|
+
}
|
|
2634
|
+
}
|
|
2635
|
+
/**
|
|
2636
|
+
* Detect platform-injected token (for same-domain scenarios).
|
|
2637
|
+
* Checks localStorage and window object for tokens stored by the platform.
|
|
2638
|
+
*
|
|
2639
|
+
* @returns Platform token if found, null otherwise
|
|
2640
|
+
*/
|
|
2641
|
+
detectPlatformToken() {
|
|
2642
|
+
if (typeof window === 'undefined')
|
|
2643
|
+
return null;
|
|
2644
|
+
try {
|
|
2645
|
+
// Check localStorage with configured key
|
|
2646
|
+
const key = this.config.platformTokenKey || 'shared_token';
|
|
2647
|
+
const token = localStorage.getItem(key);
|
|
2648
|
+
if (token) {
|
|
2649
|
+
this.logger.debug(`Platform token found in localStorage[${key}]`);
|
|
2650
|
+
return token;
|
|
2651
|
+
}
|
|
2652
|
+
// Also check window object for injected token
|
|
2653
|
+
const windowToken = window.__PLAYKIT_PLATFORM_TOKEN__;
|
|
2654
|
+
if (windowToken) {
|
|
2655
|
+
this.logger.debug('Platform token found in window.__PLAYKIT_PLATFORM_TOKEN__');
|
|
2656
|
+
return windowToken;
|
|
2657
|
+
}
|
|
2658
|
+
}
|
|
2659
|
+
catch (error) {
|
|
2660
|
+
this.logger.warn('Error detecting platform token:', error);
|
|
2661
|
+
}
|
|
2662
|
+
return null;
|
|
2663
|
+
}
|
|
2611
2664
|
/**
|
|
2612
2665
|
* Check if token is expired
|
|
2613
2666
|
*/
|
|
@@ -3050,13 +3103,13 @@ class RechargeManager extends EventEmitter {
|
|
|
3050
3103
|
left: 0;
|
|
3051
3104
|
right: 0;
|
|
3052
3105
|
bottom: 0;
|
|
3053
|
-
background
|
|
3054
|
-
backdrop-filter: blur(4px);
|
|
3106
|
+
background: rgba(0, 0, 0, 0.8);
|
|
3055
3107
|
display: flex;
|
|
3056
3108
|
justify-content: center;
|
|
3057
3109
|
align-items: center;
|
|
3058
3110
|
z-index: 999999;
|
|
3059
3111
|
animation: playkit-recharge-fadeIn 0.2s ease-out;
|
|
3112
|
+
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
3060
3113
|
}
|
|
3061
3114
|
|
|
3062
3115
|
@keyframes playkit-recharge-fadeIn {
|
|
@@ -3069,140 +3122,111 @@ class RechargeManager extends EventEmitter {
|
|
|
3069
3122
|
}
|
|
3070
3123
|
|
|
3071
3124
|
.playkit-recharge-modal {
|
|
3072
|
-
background:
|
|
3073
|
-
border
|
|
3074
|
-
box-shadow: 0
|
|
3075
|
-
padding:
|
|
3076
|
-
max-width:
|
|
3125
|
+
background: #fff;
|
|
3126
|
+
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
3127
|
+
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.05);
|
|
3128
|
+
padding: 24px;
|
|
3129
|
+
max-width: 320px;
|
|
3077
3130
|
width: 90%;
|
|
3078
3131
|
position: relative;
|
|
3079
|
-
|
|
3080
|
-
}
|
|
3081
|
-
|
|
3082
|
-
@keyframes playkit-recharge-slideUp {
|
|
3083
|
-
from {
|
|
3084
|
-
transform: translateY(20px);
|
|
3085
|
-
opacity: 0;
|
|
3086
|
-
}
|
|
3087
|
-
to {
|
|
3088
|
-
transform: translateY(0);
|
|
3089
|
-
opacity: 1;
|
|
3090
|
-
}
|
|
3132
|
+
text-align: center;
|
|
3091
3133
|
}
|
|
3092
3134
|
|
|
3093
3135
|
.playkit-recharge-title {
|
|
3094
|
-
font-size:
|
|
3095
|
-
font-weight:
|
|
3096
|
-
color: #
|
|
3097
|
-
margin: 0 0
|
|
3136
|
+
font-size: 14px;
|
|
3137
|
+
font-weight: 600;
|
|
3138
|
+
color: #171717;
|
|
3139
|
+
margin: 0 0 8px 0;
|
|
3098
3140
|
text-align: center;
|
|
3099
3141
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
3100
3142
|
}
|
|
3101
3143
|
|
|
3102
3144
|
.playkit-recharge-message {
|
|
3103
|
-
font-size:
|
|
3104
|
-
color:
|
|
3105
|
-
margin: 0 0
|
|
3145
|
+
font-size: 14px;
|
|
3146
|
+
color: #666;
|
|
3147
|
+
margin: 0 0 20px 0;
|
|
3106
3148
|
text-align: center;
|
|
3107
3149
|
line-height: 1.5;
|
|
3108
3150
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
3109
3151
|
}
|
|
3110
3152
|
|
|
3111
3153
|
.playkit-recharge-balance {
|
|
3112
|
-
background:
|
|
3113
|
-
border
|
|
3154
|
+
background: #f5f5f5;
|
|
3155
|
+
border: 1px solid #e5e7eb;
|
|
3114
3156
|
padding: 16px;
|
|
3115
|
-
margin: 0 0
|
|
3157
|
+
margin: 0 0 20px 0;
|
|
3116
3158
|
text-align: center;
|
|
3117
|
-
backdrop-filter: blur(10px);
|
|
3118
3159
|
}
|
|
3119
3160
|
|
|
3120
3161
|
.playkit-recharge-balance-label {
|
|
3121
|
-
font-size:
|
|
3122
|
-
color:
|
|
3162
|
+
font-size: 12px;
|
|
3163
|
+
color: #666;
|
|
3123
3164
|
margin: 0 0 8px 0;
|
|
3124
3165
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
3125
3166
|
}
|
|
3126
3167
|
|
|
3127
3168
|
.playkit-recharge-balance-value {
|
|
3128
|
-
font-size:
|
|
3169
|
+
font-size: 24px;
|
|
3129
3170
|
font-weight: bold;
|
|
3130
|
-
color: #
|
|
3171
|
+
color: #171717;
|
|
3131
3172
|
margin: 0;
|
|
3132
3173
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
3133
3174
|
}
|
|
3134
3175
|
|
|
3135
3176
|
.playkit-recharge-balance-unit {
|
|
3136
|
-
font-size:
|
|
3137
|
-
color:
|
|
3138
|
-
margin-left:
|
|
3177
|
+
font-size: 14px;
|
|
3178
|
+
color: #666;
|
|
3179
|
+
margin-left: 4px;
|
|
3139
3180
|
}
|
|
3140
3181
|
|
|
3141
3182
|
.playkit-recharge-buttons {
|
|
3142
3183
|
display: flex;
|
|
3143
|
-
|
|
3144
|
-
|
|
3184
|
+
flex-direction: column;
|
|
3185
|
+
gap: 8px;
|
|
3145
3186
|
}
|
|
3146
3187
|
|
|
3147
3188
|
.playkit-recharge-button {
|
|
3148
|
-
|
|
3149
|
-
padding:
|
|
3189
|
+
width: 100%;
|
|
3190
|
+
padding: 10px 16px;
|
|
3150
3191
|
border: none;
|
|
3151
|
-
|
|
3152
|
-
font-
|
|
3153
|
-
font-weight: 600;
|
|
3192
|
+
font-size: 14px;
|
|
3193
|
+
font-weight: 500;
|
|
3154
3194
|
cursor: pointer;
|
|
3155
3195
|
transition: all 0.2s ease;
|
|
3156
3196
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
3157
3197
|
}
|
|
3158
3198
|
|
|
3159
3199
|
.playkit-recharge-button-primary {
|
|
3160
|
-
background: #
|
|
3161
|
-
color:
|
|
3200
|
+
background: #171717;
|
|
3201
|
+
color: white;
|
|
3162
3202
|
}
|
|
3163
3203
|
|
|
3164
3204
|
.playkit-recharge-button-primary:hover {
|
|
3165
|
-
|
|
3166
|
-
box-shadow: 0 8px 16px rgba(255, 255, 255, 0.2);
|
|
3205
|
+
background: #404040;
|
|
3167
3206
|
}
|
|
3168
3207
|
|
|
3169
3208
|
.playkit-recharge-button-primary:active {
|
|
3170
|
-
|
|
3209
|
+
background: #0a0a0a;
|
|
3171
3210
|
}
|
|
3172
3211
|
|
|
3173
3212
|
.playkit-recharge-button-secondary {
|
|
3174
|
-
background:
|
|
3175
|
-
color: #
|
|
3176
|
-
border: 1px solid
|
|
3213
|
+
background: transparent;
|
|
3214
|
+
color: #666;
|
|
3215
|
+
border: 1px solid #e5e7eb;
|
|
3177
3216
|
}
|
|
3178
3217
|
|
|
3179
3218
|
.playkit-recharge-button-secondary:hover {
|
|
3180
|
-
background:
|
|
3219
|
+
background: #f5f5f5;
|
|
3220
|
+
border-color: #d4d4d4;
|
|
3181
3221
|
}
|
|
3182
3222
|
|
|
3183
3223
|
.playkit-recharge-button-secondary:active {
|
|
3184
|
-
background:
|
|
3224
|
+
background: #e5e5e5;
|
|
3185
3225
|
}
|
|
3186
3226
|
|
|
3187
3227
|
@media (max-width: 480px) {
|
|
3188
3228
|
.playkit-recharge-modal {
|
|
3189
|
-
padding:
|
|
3190
|
-
}
|
|
3191
|
-
|
|
3192
|
-
.playkit-recharge-title {
|
|
3193
|
-
font-size: 20px;
|
|
3194
|
-
}
|
|
3195
|
-
|
|
3196
|
-
.playkit-recharge-message {
|
|
3197
|
-
font-size: 14px;
|
|
3198
|
-
}
|
|
3199
|
-
|
|
3200
|
-
.playkit-recharge-balance-value {
|
|
3201
|
-
font-size: 28px;
|
|
3202
|
-
}
|
|
3203
|
-
|
|
3204
|
-
.playkit-recharge-buttons {
|
|
3205
|
-
flex-direction: column;
|
|
3229
|
+
padding: 20px;
|
|
3206
3230
|
}
|
|
3207
3231
|
}
|
|
3208
3232
|
|
|
@@ -3211,9 +3235,9 @@ class RechargeManager extends EventEmitter {
|
|
|
3211
3235
|
position: fixed;
|
|
3212
3236
|
top: 20px;
|
|
3213
3237
|
right: 20px;
|
|
3214
|
-
background:
|
|
3215
|
-
border
|
|
3216
|
-
box-shadow: 0
|
|
3238
|
+
background: #fff;
|
|
3239
|
+
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
3240
|
+
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.1);
|
|
3217
3241
|
padding: 16px 20px;
|
|
3218
3242
|
min-width: 240px;
|
|
3219
3243
|
max-width: 320px;
|
|
@@ -3222,6 +3246,7 @@ class RechargeManager extends EventEmitter {
|
|
|
3222
3246
|
display: flex;
|
|
3223
3247
|
align-items: flex-start;
|
|
3224
3248
|
gap: 12px;
|
|
3249
|
+
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
3225
3250
|
}
|
|
3226
3251
|
|
|
3227
3252
|
.playkit-daily-refresh-toast.hiding {
|
|
@@ -3253,7 +3278,7 @@ class RechargeManager extends EventEmitter {
|
|
|
3253
3278
|
.playkit-toast-icon {
|
|
3254
3279
|
width: 24px;
|
|
3255
3280
|
height: 24px;
|
|
3256
|
-
background:
|
|
3281
|
+
background: #171717;
|
|
3257
3282
|
border-radius: 50%;
|
|
3258
3283
|
display: flex;
|
|
3259
3284
|
align-items: center;
|
|
@@ -3271,7 +3296,7 @@ class RechargeManager extends EventEmitter {
|
|
|
3271
3296
|
flex: 1;
|
|
3272
3297
|
font-size: 14px;
|
|
3273
3298
|
font-weight: 500;
|
|
3274
|
-
color: #
|
|
3299
|
+
color: #171717;
|
|
3275
3300
|
line-height: 1.4;
|
|
3276
3301
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
3277
3302
|
}
|
|
@@ -6103,6 +6128,8 @@ class PlayKitSDK extends EventEmitter {
|
|
|
6103
6128
|
// Initialize logging system
|
|
6104
6129
|
this.initializeLogging(this.config);
|
|
6105
6130
|
this.logger = Logger.getLogger('PlayKitSDK');
|
|
6131
|
+
// Initialize fallback configuration with defaults
|
|
6132
|
+
this.fallbackConfig = Object.assign({ enabled: true }, config.developerTokenFallback);
|
|
6106
6133
|
// Initialize managers and providers
|
|
6107
6134
|
this.authManager = new AuthManager(this.config);
|
|
6108
6135
|
this.playerClient = new PlayerClient(this.authManager, this.config, this.config.recharge);
|
|
@@ -6160,7 +6187,8 @@ class PlayKitSDK extends EventEmitter {
|
|
|
6160
6187
|
await this.authManager.initialize();
|
|
6161
6188
|
this.initialized = true;
|
|
6162
6189
|
// Show developer token indicator if using developer token (browser mode only)
|
|
6163
|
-
|
|
6190
|
+
const isDeveloperTokenMode = this.authManager.isDeveloperTokenAuth();
|
|
6191
|
+
if (isDeveloperTokenMode && this.config.mode !== 'server' && typeof window !== 'undefined') {
|
|
6164
6192
|
this.showDeveloperTokenIndicator();
|
|
6165
6193
|
}
|
|
6166
6194
|
// Always verify token validity and fetch user info after authentication
|
|
@@ -6170,20 +6198,26 @@ class PlayKitSDK extends EventEmitter {
|
|
|
6170
6198
|
this.logger.debug('Token validated and user info fetched');
|
|
6171
6199
|
}
|
|
6172
6200
|
catch (error) {
|
|
6173
|
-
//
|
|
6174
|
-
|
|
6175
|
-
|
|
6176
|
-
// Auto-restart login flow in browser environment
|
|
6177
|
-
if (typeof window !== 'undefined') {
|
|
6178
|
-
this.logger.debug('Restarting authentication flow...');
|
|
6179
|
-
const authMethod = this.config.authMethod || 'device';
|
|
6180
|
-
await this.authManager.startAuthFlow(authMethod);
|
|
6181
|
-
// Retry getting player info after re-authentication
|
|
6182
|
-
await this.playerClient.getPlayerInfo();
|
|
6183
|
-
this.logger.debug('Re-authentication successful, token validated');
|
|
6201
|
+
// Check if this is a developerToken failure
|
|
6202
|
+
if (isDeveloperTokenMode) {
|
|
6203
|
+
await this.handleDeveloperTokenFailure(error);
|
|
6184
6204
|
}
|
|
6185
6205
|
else {
|
|
6186
|
-
|
|
6206
|
+
// If token is invalid, logout and restart auth flow
|
|
6207
|
+
this.logger.error('Token validation failed:', error);
|
|
6208
|
+
await this.authManager.logout();
|
|
6209
|
+
// Auto-restart login flow in browser environment
|
|
6210
|
+
if (typeof window !== 'undefined') {
|
|
6211
|
+
this.logger.debug('Restarting authentication flow...');
|
|
6212
|
+
const authMethod = this.config.authMethod || 'device';
|
|
6213
|
+
await this.authManager.startAuthFlow(authMethod);
|
|
6214
|
+
// Retry getting player info after re-authentication
|
|
6215
|
+
await this.playerClient.getPlayerInfo();
|
|
6216
|
+
this.logger.debug('Re-authentication successful, token validated');
|
|
6217
|
+
}
|
|
6218
|
+
else {
|
|
6219
|
+
throw new Error('Token validation failed: ' + (error instanceof Error ? error.message : String(error)));
|
|
6220
|
+
}
|
|
6187
6221
|
}
|
|
6188
6222
|
}
|
|
6189
6223
|
}
|
|
@@ -6195,6 +6229,50 @@ class PlayKitSDK extends EventEmitter {
|
|
|
6195
6229
|
throw error;
|
|
6196
6230
|
}
|
|
6197
6231
|
}
|
|
6232
|
+
/**
|
|
6233
|
+
* Handle developerToken authentication failure with optional fallback to player login.
|
|
6234
|
+
* This is called when a developerToken is provided but fails validation.
|
|
6235
|
+
*
|
|
6236
|
+
* @param error - The error that caused the developerToken failure
|
|
6237
|
+
*/
|
|
6238
|
+
async handleDeveloperTokenFailure(error) {
|
|
6239
|
+
const willFallback = this.fallbackConfig.enabled !== false &&
|
|
6240
|
+
typeof window !== 'undefined' &&
|
|
6241
|
+
this.config.mode !== 'server';
|
|
6242
|
+
// Emit developer_token_failed event
|
|
6243
|
+
this.emit('developer_token_failed', {
|
|
6244
|
+
error,
|
|
6245
|
+
willFallback,
|
|
6246
|
+
});
|
|
6247
|
+
this.logger.warn('DeveloperToken validation failed', { error, willFallback });
|
|
6248
|
+
// Clear developer token state and indicator
|
|
6249
|
+
this.authManager.clearDeveloperToken();
|
|
6250
|
+
this.hideDeveloperTokenIndicator();
|
|
6251
|
+
if (!willFallback) {
|
|
6252
|
+
// Fallback disabled or not in browser - throw the error
|
|
6253
|
+
throw new PlayKitError('DeveloperToken validation failed: ' + (error instanceof Error ? error.message : String(error)), 'DEVELOPER_TOKEN_INVALID');
|
|
6254
|
+
}
|
|
6255
|
+
// Emit fallback started event
|
|
6256
|
+
const fallbackMethod = this.config.authMethod || 'device';
|
|
6257
|
+
this.emit('developer_token_fallback_started', { fallbackMethod });
|
|
6258
|
+
this.logger.debug('Starting fallback to player login', { fallbackMethod });
|
|
6259
|
+
try {
|
|
6260
|
+
// Start player login flow
|
|
6261
|
+
await this.authManager.startAuthFlow(fallbackMethod);
|
|
6262
|
+
// Verify the new token
|
|
6263
|
+
await this.playerClient.getPlayerInfo();
|
|
6264
|
+
// Emit fallback completed event
|
|
6265
|
+
const authState = this.authManager.getAuthState();
|
|
6266
|
+
this.emit('developer_token_fallback_completed', { authState });
|
|
6267
|
+
this.logger.debug('DeveloperToken fallback completed successfully');
|
|
6268
|
+
}
|
|
6269
|
+
catch (fallbackError) {
|
|
6270
|
+
// Emit fallback failed event
|
|
6271
|
+
this.emit('developer_token_fallback_failed', { error: fallbackError });
|
|
6272
|
+
this.logger.error('DeveloperToken fallback failed', fallbackError);
|
|
6273
|
+
throw fallbackError;
|
|
6274
|
+
}
|
|
6275
|
+
}
|
|
6198
6276
|
/**
|
|
6199
6277
|
* Show developer token indicator in top-left corner
|
|
6200
6278
|
*/
|
|
@@ -6268,10 +6346,20 @@ class PlayKitSDK extends EventEmitter {
|
|
|
6268
6346
|
await this.authManager.logout();
|
|
6269
6347
|
this.hideDeveloperTokenIndicator();
|
|
6270
6348
|
}
|
|
6349
|
+
/**
|
|
6350
|
+
* Ensure SDK is initialized before making API calls
|
|
6351
|
+
* @throws PlayKitError if not initialized
|
|
6352
|
+
*/
|
|
6353
|
+
ensureInitialized() {
|
|
6354
|
+
if (!this.initialized) {
|
|
6355
|
+
throw new PlayKitError('SDK not initialized. Call await sdk.initialize() before using API methods.', 'NOT_INITIALIZED');
|
|
6356
|
+
}
|
|
6357
|
+
}
|
|
6271
6358
|
/**
|
|
6272
6359
|
* Get player information
|
|
6273
6360
|
*/
|
|
6274
6361
|
async getPlayerInfo() {
|
|
6362
|
+
this.ensureInitialized();
|
|
6275
6363
|
return await this.playerClient.getPlayerInfo();
|
|
6276
6364
|
}
|
|
6277
6365
|
/**
|
|
@@ -6279,6 +6367,7 @@ class PlayKitSDK extends EventEmitter {
|
|
|
6279
6367
|
* Automatically uses the SDK's schema library
|
|
6280
6368
|
*/
|
|
6281
6369
|
createChatClient(model) {
|
|
6370
|
+
this.ensureInitialized();
|
|
6282
6371
|
const client = new ChatClient(this.chatProvider, model || this.config.defaultChatModel);
|
|
6283
6372
|
// Automatically use the SDK's schema library
|
|
6284
6373
|
client.setSchemaLibrary(this.schemaLibrary);
|
|
@@ -6288,6 +6377,7 @@ class PlayKitSDK extends EventEmitter {
|
|
|
6288
6377
|
* Create an image client
|
|
6289
6378
|
*/
|
|
6290
6379
|
createImageClient(model) {
|
|
6380
|
+
this.ensureInitialized();
|
|
6291
6381
|
return new ImageClient(this.imageProvider, model || this.config.defaultImageModel);
|
|
6292
6382
|
}
|
|
6293
6383
|
/**
|
|
@@ -6295,6 +6385,7 @@ class PlayKitSDK extends EventEmitter {
|
|
|
6295
6385
|
* @param model - Transcription model to use (default: 'whisper-large')
|
|
6296
6386
|
*/
|
|
6297
6387
|
createTranscriptionClient(model) {
|
|
6388
|
+
this.ensureInitialized();
|
|
6298
6389
|
return new TranscriptionClient(this.transcriptionProvider, model || this.config.defaultTranscriptionModel);
|
|
6299
6390
|
}
|
|
6300
6391
|
/**
|
|
@@ -6302,6 +6393,7 @@ class PlayKitSDK extends EventEmitter {
|
|
|
6302
6393
|
* Automatically registers with AIContextManager
|
|
6303
6394
|
*/
|
|
6304
6395
|
createNPCClient(config) {
|
|
6396
|
+
this.ensureInitialized();
|
|
6305
6397
|
const chatClient = this.createChatClient(config === null || config === void 0 ? void 0 : config.model);
|
|
6306
6398
|
const npc = new NPCClient(chatClient, config);
|
|
6307
6399
|
// Register with context manager
|
|
@@ -6400,6 +6492,7 @@ class PlayKitSDK extends EventEmitter {
|
|
|
6400
6492
|
* Show insufficient balance modal
|
|
6401
6493
|
*/
|
|
6402
6494
|
async showInsufficientBalanceModal(customMessage) {
|
|
6495
|
+
this.ensureInitialized();
|
|
6403
6496
|
return await this.playerClient.showInsufficientBalanceModal(customMessage);
|
|
6404
6497
|
}
|
|
6405
6498
|
/**
|
|
@@ -6433,6 +6526,7 @@ class PlayKitSDK extends EventEmitter {
|
|
|
6433
6526
|
* Refresh and get player's current balance
|
|
6434
6527
|
*/
|
|
6435
6528
|
async refreshBalance() {
|
|
6529
|
+
this.ensureInitialized();
|
|
6436
6530
|
const playerInfo = await this.playerClient.refreshPlayerInfo();
|
|
6437
6531
|
return playerInfo.balance;
|
|
6438
6532
|
}
|
|
@@ -6453,6 +6547,7 @@ class PlayKitSDK extends EventEmitter {
|
|
|
6453
6547
|
* @throws PlayKitError if validation fails or token type is invalid
|
|
6454
6548
|
*/
|
|
6455
6549
|
async setNickname(nickname) {
|
|
6550
|
+
this.ensureInitialized();
|
|
6456
6551
|
return await this.playerClient.setNickname(nickname);
|
|
6457
6552
|
}
|
|
6458
6553
|
// ============================================================
|