@resolveio/client-lib-core 1.3.19 → 1.4.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.
- package/esm2020/lib/socket-manager.service.mjs +6 -13
- package/esm2020/lib/socket.service.mjs +33 -2
- package/esm2020/lib/widgets/collapse-table/collapse-table.component.mjs +3 -3
- package/fesm2015/resolveio-client-lib-core.mjs +39 -15
- package/fesm2015/resolveio-client-lib-core.mjs.map +1 -1
- package/fesm2020/resolveio-client-lib-core.mjs +39 -15
- package/fesm2020/resolveio-client-lib-core.mjs.map +1 -1
- package/lib/socket.service.d.ts +6 -0
- package/package.json +1 -1
|
@@ -261,6 +261,10 @@ class SocketService {
|
|
|
261
261
|
this.readyState$ = new BehaviorSubject(0);
|
|
262
262
|
//List of WebSocket sub-protocols
|
|
263
263
|
this.protocols = [];
|
|
264
|
+
this.pingInterval = null;
|
|
265
|
+
this.pongTimeout = null;
|
|
266
|
+
this.pingIntervalTime = 15000; // Time between each ping (e.g., 30 seconds)
|
|
267
|
+
this.pongTimeoutTime = 15000; // Time to wait for pong before closing connection (e.g., 10 seconds)
|
|
264
268
|
//Set up the default 'noop' event handlers
|
|
265
269
|
this.onopen = function (event) { };
|
|
266
270
|
this.onclose = function (event) { };
|
|
@@ -294,6 +298,7 @@ class SocketService {
|
|
|
294
298
|
this.readyState = WebSocket.OPEN;
|
|
295
299
|
this.readyState$.next(this.readyState);
|
|
296
300
|
this.onopen(event);
|
|
301
|
+
this.startPinging();
|
|
297
302
|
};
|
|
298
303
|
this.ws.onclose = (event) => {
|
|
299
304
|
if (this.timeout) {
|
|
@@ -308,9 +313,16 @@ class SocketService {
|
|
|
308
313
|
setTimeout(() => {
|
|
309
314
|
this.connect();
|
|
310
315
|
}, this.reconnectInterval);
|
|
316
|
+
this.stopPinging();
|
|
311
317
|
};
|
|
312
318
|
this.ws.onmessage = (event) => {
|
|
313
|
-
|
|
319
|
+
if (event.data === 'pong') {
|
|
320
|
+
this.log(new Date(), 'WS', 'pong received');
|
|
321
|
+
clearTimeout(this.pongTimeout);
|
|
322
|
+
}
|
|
323
|
+
else {
|
|
324
|
+
this.onmessage(event);
|
|
325
|
+
}
|
|
314
326
|
};
|
|
315
327
|
this.ws.onerror = (event) => {
|
|
316
328
|
this.log(new Date(), 'WS', 'onerror', this, event);
|
|
@@ -319,6 +331,25 @@ class SocketService {
|
|
|
319
331
|
};
|
|
320
332
|
}
|
|
321
333
|
}
|
|
334
|
+
startPinging() {
|
|
335
|
+
this.pingInterval = setInterval(() => {
|
|
336
|
+
if (this.ws && this.ws.readyState === WebSocket.OPEN) {
|
|
337
|
+
this.ws.send(['ping'].toString()); // You can adjust this based on the server's expectations
|
|
338
|
+
this.pongTimeout = setTimeout(() => {
|
|
339
|
+
this.log(new Date(), 'WS', 'pong not received, closing connection');
|
|
340
|
+
this.close();
|
|
341
|
+
}, this.pongTimeoutTime);
|
|
342
|
+
}
|
|
343
|
+
}, this.pingIntervalTime);
|
|
344
|
+
}
|
|
345
|
+
stopPinging() {
|
|
346
|
+
if (this.pingInterval) {
|
|
347
|
+
clearInterval(this.pingInterval);
|
|
348
|
+
}
|
|
349
|
+
if (this.pongTimeout) {
|
|
350
|
+
clearTimeout(this.pongTimeout);
|
|
351
|
+
}
|
|
352
|
+
}
|
|
322
353
|
send(...data) {
|
|
323
354
|
if (this.ws && this.ws.readyState === this.ws.OPEN) {
|
|
324
355
|
this.ws.send(JSON.stringify(data));
|
|
@@ -1185,18 +1216,11 @@ class SocketManagerService {
|
|
|
1185
1216
|
if (!this._runningQueue) {
|
|
1186
1217
|
if (this._sendQueue.length) {
|
|
1187
1218
|
this._runningQueue = true;
|
|
1188
|
-
|
|
1189
|
-
|
|
1190
|
-
|
|
1191
|
-
|
|
1192
|
-
|
|
1193
|
-
}
|
|
1194
|
-
else {
|
|
1195
|
-
break;
|
|
1196
|
-
}
|
|
1197
|
-
}
|
|
1198
|
-
else {
|
|
1199
|
-
break;
|
|
1219
|
+
if (this._socket && this._socket.ws && this.socketStatus === WebSocket.OPEN) {
|
|
1220
|
+
let nextSendItem = this._sendQueue[this._sendQueue.length - 1];
|
|
1221
|
+
let sendStatus = this._socket.send(...nextSendItem);
|
|
1222
|
+
if (sendStatus) {
|
|
1223
|
+
this._sendQueue.pop();
|
|
1200
1224
|
}
|
|
1201
1225
|
}
|
|
1202
1226
|
this._runningQueue = false;
|
|
@@ -3654,10 +3678,10 @@ class CollapseTableComponent {
|
|
|
3654
3678
|
}
|
|
3655
3679
|
}
|
|
3656
3680
|
CollapseTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.9", ngImport: i0, type: CollapseTableComponent, deps: [{ token: ResizeService }, { token: AccountManagerService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3657
|
-
CollapseTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.9", type: CollapseTableComponent, selector: "collapse-table", inputs: { collapseSize: "collapseSize", tableFixed: "tableFixed", headerFixed: "headerFixed", secondaryColor: "secondaryColor", tertiaryColor: "tertiaryColor" }, ngImport: i0, template: "<style>\n ::ng-deep :root {\n --primary-table-color: #3b3ee3;\n --primary-table-font-color: white;\n --font-size: 12px;\n --secondary-table-color: #87ceeb;\n --secondary-table-font-color: #000000;\n --tertiary-table-color: #ff4500;\n --tertiary-table-font-color: #000000;\n }\n\n\t:host /deep/ .collapseTable {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n /*table-layout: fixed;*/ \n }\n :host /deep/ .collapseTable tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable th, :host /deep/ .collapseTable td {\n padding: 0.625em;\n text-align: center;\n vertical-align: middle;\n }\n :host /deep/ .collapseTable th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--primary-table-color);\n color: var(--primary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n } \n :host /deep/ .collapseTable-sec {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n }\n :host /deep/ .collapseTable-sec tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable-sec th, :host /deep/ .collapseTable-sec td {\n padding: 0.625em;\n text-align: center;\n }\n :host /deep/ .collapseTable-sec th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--secondary-table-color);\n color: var(--secondary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n } \n :host /deep/ .collapseTable-tert {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n }\n :host /deep/ .collapseTable-tert tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable-tert th, :host /deep/ .collapseTable-tert td {\n padding: 0.625em;\n text-align: center;\n }\n :host /deep/ .collapseTable-tert th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--tertiary-table-color);\n color: var(--tertiary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n }\n \n .fixed {\n table-layout: fixed;\n }\n\n :host /deep/ .headerFixed thead, :host /deep/ .headerFixed tbody tr {\n display:table;\n width:100%;\n table-layout:fixed;\n }\n\n :host /deep/ .collapseTable,\n :host /deep/ .collapseTable-sec,\n :host /deep/ .collapseTable-tert {\n box-shadow: 0 0 15px rgba(0,0,0,0.25); \n }\n \n :host /deep/ .collapseTable > tr:first-child > th:first-child,\n :host /deep/ .collapseTable-sec > tr:first-child > th:first-child,\n :host /deep/ .collapseTable-tert > tr:first-child > th:first-child {\n border-top-left-radius: 10px;\n }\n\n :host /deep/ .collapseTable > tr:first-child > th:last-child,\n :host /deep/ .collapseTable-sec > tr:first-child > th:last-child,\n :host /deep/ .collapseTable-tert > tr:first-child > th:last-child {\n border-top-right-radius: 10px;\n }\n\n :host /deep/ .collapseTable > tr:last-child > td:first-child,\n :host /deep/ .collapseTable-sec > tr:last-child > td:first-child,\n :host /deep/ .collapseTable-tert > tr:last-child > td:first-child {\n border-bottom-left-radius: 10px;\n }\n\n :host /deep/ .collapseTable > tr:last-child > td:last-child,\n :host /deep/ .collapseTable-sec > tr:last-child > td:last-child,\n :host /deep/ .collapseTable-tert > tr:last-child > td:last-child {\n border-bottom-right-radius: 10px;\n }\n\n .hide {\n display: none;\n }\n</style>\n\n<div class=\"table-responsive-xl\">\n <table [ngClass]=\"getCollapseClass()\" style=\"border: none\" cellspacing=\"0\" cellpadding=\"0\">\n <ng-content></ng-content>\n </table>\n</div>", styles: ["\n ::ng-deep :root {\n --primary-table-color: #3b3ee3;\n --primary-table-font-color: white;\n --font-size: 12px;\n --secondary-table-color: #87ceeb;\n --secondary-table-font-color: #000000;\n --tertiary-table-color: #ff4500;\n --tertiary-table-font-color: #000000;\n }\n\n\t:host /deep/ .collapseTable {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n /*table-layout: fixed;*/ \n }\n :host /deep/ .collapseTable tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable th, :host /deep/ .collapseTable td {\n padding: 0.625em;\n text-align: center;\n vertical-align: middle;\n }\n :host /deep/ .collapseTable th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--primary-table-color);\n color: var(--primary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n } \n :host /deep/ .collapseTable-sec {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n }\n :host /deep/ .collapseTable-sec tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable-sec th, :host /deep/ .collapseTable-sec td {\n padding: 0.625em;\n text-align: center;\n }\n :host /deep/ .collapseTable-sec th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--secondary-table-color);\n color: var(--secondary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n } \n :host /deep/ .collapseTable-tert {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n }\n :host /deep/ .collapseTable-tert tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable-tert th, :host /deep/ .collapseTable-tert td {\n padding: 0.625em;\n text-align: center;\n }\n :host /deep/ .collapseTable-tert th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--tertiary-table-color);\n color: var(--tertiary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n }\n \n .fixed {\n table-layout: fixed;\n }\n\n :host /deep/ .headerFixed thead, :host /deep/ .headerFixed tbody tr {\n display:table;\n width:100%;\n table-layout:fixed;\n }\n\n :host /deep/ .collapseTable,\n :host /deep/ .collapseTable-sec,\n :host /deep/ .collapseTable-tert {\n box-shadow: 0 0 15px rgba(0,0,0,0.25); \n }\n \n :host /deep/ .collapseTable > tr:first-child > th:first-child,\n :host /deep/ .collapseTable-sec > tr:first-child > th:first-child,\n :host /deep/ .collapseTable-tert > tr:first-child > th:first-child {\n border-top-left-radius: 10px;\n }\n\n :host /deep/ .collapseTable > tr:first-child > th:last-child,\n :host /deep/ .collapseTable-sec > tr:first-child > th:last-child,\n :host /deep/ .collapseTable-tert > tr:first-child > th:last-child {\n border-top-right-radius: 10px;\n }\n\n :host /deep/ .collapseTable > tr:last-child > td:first-child,\n :host /deep/ .collapseTable-sec > tr:last-child > td:first-child,\n :host /deep/ .collapseTable-tert > tr:last-child > td:first-child {\n border-bottom-left-radius: 10px;\n }\n\n :host /deep/ .collapseTable > tr:last-child > td:last-child,\n :host /deep/ .collapseTable-sec > tr:last-child > td:last-child,\n :host /deep/ .collapseTable-tert > tr:last-child > td:last-child {\n border-bottom-right-radius: 10px;\n }\n\n .hide {\n display: none;\n }\n"], dependencies: [{ kind: "directive", type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
3681
|
+
CollapseTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.9", type: CollapseTableComponent, selector: "collapse-table", inputs: { collapseSize: "collapseSize", tableFixed: "tableFixed", headerFixed: "headerFixed", secondaryColor: "secondaryColor", tertiaryColor: "tertiaryColor" }, ngImport: i0, template: "<style>\n ::ng-deep :root {\n --primary-table-color: #3b3ee3;\n --primary-table-font-color: white;\n --font-size: 12px;\n --secondary-table-color: #87ceeb;\n --secondary-table-font-color: #000000;\n --tertiary-table-color: #ff4500;\n --tertiary-table-font-color: #000000;\n }\n\n\t:host /deep/ .collapseTable {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n /*table-layout: fixed;*/ \n }\n :host /deep/ .collapseTable tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable th, :host /deep/ .collapseTable td {\n padding: 0.625em;\n text-align: center;\n vertical-align: middle;\n }\n :host /deep/ .collapseTable th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--primary-table-color);\n color: var(--primary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n } \n :host /deep/ .collapseTable-sec {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n }\n :host /deep/ .collapseTable-sec tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable-sec th, :host /deep/ .collapseTable-sec td {\n padding: 0.625em;\n text-align: center;\n }\n :host /deep/ .collapseTable-sec th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--secondary-table-color);\n color: var(--secondary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n } \n :host /deep/ .collapseTable-tert {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n }\n :host /deep/ .collapseTable-tert tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable-tert th, :host /deep/ .collapseTable-tert td {\n padding: 0.625em;\n text-align: center;\n }\n :host /deep/ .collapseTable-tert th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--tertiary-table-color);\n color: var(--tertiary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n }\n \n .fixed {\n table-layout: fixed;\n }\n\n :host /deep/ .headerFixed thead, :host /deep/ .headerFixed tbody tr {\n display:table;\n width:100%;\n table-layout:fixed;\n }\n\n :host /deep/ .collapseTable,\n :host /deep/ .collapseTable-sec,\n :host /deep/ .collapseTable-tert {\n box-shadow: 0 0 15px rgba(0,0,0,0.25); \n }\n \n :host /deep/ .collapseTable > thead:first-of-type > tr:first-child > th:first-child,\n :host /deep/ .collapseTable-sec > thead:first-of-type > tr:first-child > th:first-child,\n :host /deep/ .collapseTable-tert > thead:first-of-type > tr:first-child > th:first-child {\n border-top-left-radius: 10px;\n }\n\n :host /deep/ .collapseTable > thead:first-of-type > tr:first-child > th:last-child,\n :host /deep/ .collapseTable-sec > thead:first-of-type > tr:first-child > th:last-child,\n :host /deep/ .collapseTable-tert > thead:first-of-type > tr:first-child > th:last-child {\n border-top-right-radius: 10px;\n }\n\n :host /deep/ .collapseTable > tbody:last-of-type > tr:last-child > td:first-child,\n :host /deep/ .collapseTable-sec > tbody:last-of-type > tr:last-child > td:first-child,\n :host /deep/ .collapseTable-tert > tbody:last-of-type > tr:last-child > td:first-child {\n border-bottom-left-radius: 10px;\n }\n\n :host /deep/ .collapseTable > tbody:last-of-type > tr:last-child > td:last-child,\n :host /deep/ .collapseTable-sec > tbody:last-of-type > tr:last-child > td:last-child,\n :host /deep/ .collapseTable-tert > tbody:last-of-type > tr:last-child > td:last-child {\n border-bottom-right-radius: 10px;\n }\n\n .hide {\n display: none;\n }\n</style>\n\n<div class=\"table-responsive-xl\">\n <table [ngClass]=\"getCollapseClass()\" style=\"border: none\" cellspacing=\"0\" cellpadding=\"0\">\n <ng-content></ng-content>\n </table>\n</div>", styles: ["\n ::ng-deep :root {\n --primary-table-color: #3b3ee3;\n --primary-table-font-color: white;\n --font-size: 12px;\n --secondary-table-color: #87ceeb;\n --secondary-table-font-color: #000000;\n --tertiary-table-color: #ff4500;\n --tertiary-table-font-color: #000000;\n }\n\n\t:host /deep/ .collapseTable {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n /*table-layout: fixed;*/ \n }\n :host /deep/ .collapseTable tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable th, :host /deep/ .collapseTable td {\n padding: 0.625em;\n text-align: center;\n vertical-align: middle;\n }\n :host /deep/ .collapseTable th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--primary-table-color);\n color: var(--primary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n } \n :host /deep/ .collapseTable-sec {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n }\n :host /deep/ .collapseTable-sec tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable-sec th, :host /deep/ .collapseTable-sec td {\n padding: 0.625em;\n text-align: center;\n }\n :host /deep/ .collapseTable-sec th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--secondary-table-color);\n color: var(--secondary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n } \n :host /deep/ .collapseTable-tert {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n }\n :host /deep/ .collapseTable-tert tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable-tert th, :host /deep/ .collapseTable-tert td {\n padding: 0.625em;\n text-align: center;\n }\n :host /deep/ .collapseTable-tert th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--tertiary-table-color);\n color: var(--tertiary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n }\n \n .fixed {\n table-layout: fixed;\n }\n\n :host /deep/ .headerFixed thead, :host /deep/ .headerFixed tbody tr {\n display:table;\n width:100%;\n table-layout:fixed;\n }\n\n :host /deep/ .collapseTable,\n :host /deep/ .collapseTable-sec,\n :host /deep/ .collapseTable-tert {\n box-shadow: 0 0 15px rgba(0,0,0,0.25); \n }\n \n :host /deep/ .collapseTable > thead:first-of-type > tr:first-child > th:first-child,\n :host /deep/ .collapseTable-sec > thead:first-of-type > tr:first-child > th:first-child,\n :host /deep/ .collapseTable-tert > thead:first-of-type > tr:first-child > th:first-child {\n border-top-left-radius: 10px;\n }\n\n :host /deep/ .collapseTable > thead:first-of-type > tr:first-child > th:last-child,\n :host /deep/ .collapseTable-sec > thead:first-of-type > tr:first-child > th:last-child,\n :host /deep/ .collapseTable-tert > thead:first-of-type > tr:first-child > th:last-child {\n border-top-right-radius: 10px;\n }\n\n :host /deep/ .collapseTable > tbody:last-of-type > tr:last-child > td:first-child,\n :host /deep/ .collapseTable-sec > tbody:last-of-type > tr:last-child > td:first-child,\n :host /deep/ .collapseTable-tert > tbody:last-of-type > tr:last-child > td:first-child {\n border-bottom-left-radius: 10px;\n }\n\n :host /deep/ .collapseTable > tbody:last-of-type > tr:last-child > td:last-child,\n :host /deep/ .collapseTable-sec > tbody:last-of-type > tr:last-child > td:last-child,\n :host /deep/ .collapseTable-tert > tbody:last-of-type > tr:last-child > td:last-child {\n border-bottom-right-radius: 10px;\n }\n\n .hide {\n display: none;\n }\n"], dependencies: [{ kind: "directive", type: i7.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
3658
3682
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.9", ngImport: i0, type: CollapseTableComponent, decorators: [{
|
|
3659
3683
|
type: Component,
|
|
3660
|
-
args: [{ selector: 'collapse-table', template: "<style>\n ::ng-deep :root {\n --primary-table-color: #3b3ee3;\n --primary-table-font-color: white;\n --font-size: 12px;\n --secondary-table-color: #87ceeb;\n --secondary-table-font-color: #000000;\n --tertiary-table-color: #ff4500;\n --tertiary-table-font-color: #000000;\n }\n\n\t:host /deep/ .collapseTable {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n /*table-layout: fixed;*/ \n }\n :host /deep/ .collapseTable tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable th, :host /deep/ .collapseTable td {\n padding: 0.625em;\n text-align: center;\n vertical-align: middle;\n }\n :host /deep/ .collapseTable th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--primary-table-color);\n color: var(--primary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n } \n :host /deep/ .collapseTable-sec {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n }\n :host /deep/ .collapseTable-sec tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable-sec th, :host /deep/ .collapseTable-sec td {\n padding: 0.625em;\n text-align: center;\n }\n :host /deep/ .collapseTable-sec th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--secondary-table-color);\n color: var(--secondary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n } \n :host /deep/ .collapseTable-tert {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n }\n :host /deep/ .collapseTable-tert tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable-tert th, :host /deep/ .collapseTable-tert td {\n padding: 0.625em;\n text-align: center;\n }\n :host /deep/ .collapseTable-tert th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--tertiary-table-color);\n color: var(--tertiary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n }\n \n .fixed {\n table-layout: fixed;\n }\n\n :host /deep/ .headerFixed thead, :host /deep/ .headerFixed tbody tr {\n display:table;\n width:100%;\n table-layout:fixed;\n }\n\n :host /deep/ .collapseTable,\n :host /deep/ .collapseTable-sec,\n :host /deep/ .collapseTable-tert {\n box-shadow: 0 0 15px rgba(0,0,0,0.25); \n }\n \n :host /deep/ .collapseTable > tr:first-child > th:first-child,\n :host /deep/ .collapseTable-sec > tr:first-child > th:first-child,\n :host /deep/ .collapseTable-tert > tr:first-child > th:first-child {\n border-top-left-radius: 10px;\n }\n\n :host /deep/ .collapseTable > tr:first-child > th:last-child,\n :host /deep/ .collapseTable-sec > tr:first-child > th:last-child,\n :host /deep/ .collapseTable-tert > tr:first-child > th:last-child {\n border-top-right-radius: 10px;\n }\n\n :host /deep/ .collapseTable > tr:last-child > td:first-child,\n :host /deep/ .collapseTable-sec > tr:last-child > td:first-child,\n :host /deep/ .collapseTable-tert > tr:last-child > td:first-child {\n border-bottom-left-radius: 10px;\n }\n\n :host /deep/ .collapseTable > tr:last-child > td:last-child,\n :host /deep/ .collapseTable-sec > tr:last-child > td:last-child,\n :host /deep/ .collapseTable-tert > tr:last-child > td:last-child {\n border-bottom-right-radius: 10px;\n }\n\n .hide {\n display: none;\n }\n</style>\n\n<div class=\"table-responsive-xl\">\n <table [ngClass]=\"getCollapseClass()\" style=\"border: none\" cellspacing=\"0\" cellpadding=\"0\">\n <ng-content></ng-content>\n </table>\n</div>" }]
|
|
3684
|
+
args: [{ selector: 'collapse-table', template: "<style>\n ::ng-deep :root {\n --primary-table-color: #3b3ee3;\n --primary-table-font-color: white;\n --font-size: 12px;\n --secondary-table-color: #87ceeb;\n --secondary-table-font-color: #000000;\n --tertiary-table-color: #ff4500;\n --tertiary-table-font-color: #000000;\n }\n\n\t:host /deep/ .collapseTable {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n /*table-layout: fixed;*/ \n }\n :host /deep/ .collapseTable tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable th, :host /deep/ .collapseTable td {\n padding: 0.625em;\n text-align: center;\n vertical-align: middle;\n }\n :host /deep/ .collapseTable th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--primary-table-color);\n color: var(--primary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n } \n :host /deep/ .collapseTable-sec {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n }\n :host /deep/ .collapseTable-sec tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable-sec th, :host /deep/ .collapseTable-sec td {\n padding: 0.625em;\n text-align: center;\n }\n :host /deep/ .collapseTable-sec th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--secondary-table-color);\n color: var(--secondary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n } \n :host /deep/ .collapseTable-tert {\n border: 1px solid #ccc;\n margin: 0;\n padding: 0;\n width: 100%;\n }\n :host /deep/ .collapseTable-tert tr {\n border: 1px solid #ddd;\n padding: 0.35em;\n }\n :host /deep/ .collapseTable-tert th, :host /deep/ .collapseTable-tert td {\n padding: 0.625em;\n text-align: center;\n }\n :host /deep/ .collapseTable-tert th {\n letter-spacing: 0.1em;\n text-transform: uppercase;\n background-color: var(--tertiary-table-color);\n color: var(--tertiary-table-font-color);\n font-size: var(--font-size);\n position: sticky;\n z-index: 10;\n top: 0;\n }\n \n .fixed {\n table-layout: fixed;\n }\n\n :host /deep/ .headerFixed thead, :host /deep/ .headerFixed tbody tr {\n display:table;\n width:100%;\n table-layout:fixed;\n }\n\n :host /deep/ .collapseTable,\n :host /deep/ .collapseTable-sec,\n :host /deep/ .collapseTable-tert {\n box-shadow: 0 0 15px rgba(0,0,0,0.25); \n }\n \n :host /deep/ .collapseTable > thead:first-of-type > tr:first-child > th:first-child,\n :host /deep/ .collapseTable-sec > thead:first-of-type > tr:first-child > th:first-child,\n :host /deep/ .collapseTable-tert > thead:first-of-type > tr:first-child > th:first-child {\n border-top-left-radius: 10px;\n }\n\n :host /deep/ .collapseTable > thead:first-of-type > tr:first-child > th:last-child,\n :host /deep/ .collapseTable-sec > thead:first-of-type > tr:first-child > th:last-child,\n :host /deep/ .collapseTable-tert > thead:first-of-type > tr:first-child > th:last-child {\n border-top-right-radius: 10px;\n }\n\n :host /deep/ .collapseTable > tbody:last-of-type > tr:last-child > td:first-child,\n :host /deep/ .collapseTable-sec > tbody:last-of-type > tr:last-child > td:first-child,\n :host /deep/ .collapseTable-tert > tbody:last-of-type > tr:last-child > td:first-child {\n border-bottom-left-radius: 10px;\n }\n\n :host /deep/ .collapseTable > tbody:last-of-type > tr:last-child > td:last-child,\n :host /deep/ .collapseTable-sec > tbody:last-of-type > tr:last-child > td:last-child,\n :host /deep/ .collapseTable-tert > tbody:last-of-type > tr:last-child > td:last-child {\n border-bottom-right-radius: 10px;\n }\n\n .hide {\n display: none;\n }\n</style>\n\n<div class=\"table-responsive-xl\">\n <table [ngClass]=\"getCollapseClass()\" style=\"border: none\" cellspacing=\"0\" cellpadding=\"0\">\n <ng-content></ng-content>\n </table>\n</div>" }]
|
|
3661
3685
|
}], ctorParameters: function () { return [{ type: ResizeService }, { type: AccountManagerService }]; }, propDecorators: { collapseSize: [{
|
|
3662
3686
|
type: Input
|
|
3663
3687
|
}], tableFixed: [{
|