@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
|
@@ -222,6 +222,10 @@ class SocketService {
|
|
|
222
222
|
this.readyState$ = new BehaviorSubject(0);
|
|
223
223
|
//List of WebSocket sub-protocols
|
|
224
224
|
this.protocols = [];
|
|
225
|
+
this.pingInterval = null;
|
|
226
|
+
this.pongTimeout = null;
|
|
227
|
+
this.pingIntervalTime = 15000; // Time between each ping (e.g., 30 seconds)
|
|
228
|
+
this.pongTimeoutTime = 15000; // Time to wait for pong before closing connection (e.g., 10 seconds)
|
|
225
229
|
//Set up the default 'noop' event handlers
|
|
226
230
|
this.onopen = function (event) { };
|
|
227
231
|
this.onclose = function (event) { };
|
|
@@ -255,6 +259,7 @@ class SocketService {
|
|
|
255
259
|
this.readyState = WebSocket.OPEN;
|
|
256
260
|
this.readyState$.next(this.readyState);
|
|
257
261
|
this.onopen(event);
|
|
262
|
+
this.startPinging();
|
|
258
263
|
};
|
|
259
264
|
this.ws.onclose = (event) => {
|
|
260
265
|
if (this.timeout) {
|
|
@@ -269,9 +274,16 @@ class SocketService {
|
|
|
269
274
|
setTimeout(() => {
|
|
270
275
|
this.connect();
|
|
271
276
|
}, this.reconnectInterval);
|
|
277
|
+
this.stopPinging();
|
|
272
278
|
};
|
|
273
279
|
this.ws.onmessage = (event) => {
|
|
274
|
-
|
|
280
|
+
if (event.data === 'pong') {
|
|
281
|
+
this.log(new Date(), 'WS', 'pong received');
|
|
282
|
+
clearTimeout(this.pongTimeout);
|
|
283
|
+
}
|
|
284
|
+
else {
|
|
285
|
+
this.onmessage(event);
|
|
286
|
+
}
|
|
275
287
|
};
|
|
276
288
|
this.ws.onerror = (event) => {
|
|
277
289
|
this.log(new Date(), 'WS', 'onerror', this, event);
|
|
@@ -280,6 +292,25 @@ class SocketService {
|
|
|
280
292
|
};
|
|
281
293
|
}
|
|
282
294
|
}
|
|
295
|
+
startPinging() {
|
|
296
|
+
this.pingInterval = setInterval(() => {
|
|
297
|
+
if (this.ws && this.ws.readyState === WebSocket.OPEN) {
|
|
298
|
+
this.ws.send(['ping'].toString()); // You can adjust this based on the server's expectations
|
|
299
|
+
this.pongTimeout = setTimeout(() => {
|
|
300
|
+
this.log(new Date(), 'WS', 'pong not received, closing connection');
|
|
301
|
+
this.close();
|
|
302
|
+
}, this.pongTimeoutTime);
|
|
303
|
+
}
|
|
304
|
+
}, this.pingIntervalTime);
|
|
305
|
+
}
|
|
306
|
+
stopPinging() {
|
|
307
|
+
if (this.pingInterval) {
|
|
308
|
+
clearInterval(this.pingInterval);
|
|
309
|
+
}
|
|
310
|
+
if (this.pongTimeout) {
|
|
311
|
+
clearTimeout(this.pongTimeout);
|
|
312
|
+
}
|
|
313
|
+
}
|
|
283
314
|
send(...data) {
|
|
284
315
|
if (this.ws && this.ws.readyState === this.ws.OPEN) {
|
|
285
316
|
this.ws.send(JSON.stringify(data));
|
|
@@ -1203,18 +1234,11 @@ class SocketManagerService {
|
|
|
1203
1234
|
if (!this._runningQueue) {
|
|
1204
1235
|
if (this._sendQueue.length) {
|
|
1205
1236
|
this._runningQueue = true;
|
|
1206
|
-
|
|
1207
|
-
|
|
1208
|
-
|
|
1209
|
-
|
|
1210
|
-
|
|
1211
|
-
}
|
|
1212
|
-
else {
|
|
1213
|
-
break;
|
|
1214
|
-
}
|
|
1215
|
-
}
|
|
1216
|
-
else {
|
|
1217
|
-
break;
|
|
1237
|
+
if (this._socket && this._socket.ws && this.socketStatus === WebSocket.OPEN) {
|
|
1238
|
+
let nextSendItem = this._sendQueue[this._sendQueue.length - 1];
|
|
1239
|
+
let sendStatus = this._socket.send(...nextSendItem);
|
|
1240
|
+
if (sendStatus) {
|
|
1241
|
+
this._sendQueue.pop();
|
|
1218
1242
|
}
|
|
1219
1243
|
}
|
|
1220
1244
|
this._runningQueue = false;
|
|
@@ -3653,10 +3677,10 @@ class CollapseTableComponent {
|
|
|
3653
3677
|
}
|
|
3654
3678
|
}
|
|
3655
3679
|
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 });
|
|
3656
|
-
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"] }] });
|
|
3680
|
+
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"] }] });
|
|
3657
3681
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.9", ngImport: i0, type: CollapseTableComponent, decorators: [{
|
|
3658
3682
|
type: Component,
|
|
3659
|
-
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>" }]
|
|
3683
|
+
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>" }]
|
|
3660
3684
|
}], ctorParameters: function () { return [{ type: ResizeService }, { type: AccountManagerService }]; }, propDecorators: { collapseSize: [{
|
|
3661
3685
|
type: Input
|
|
3662
3686
|
}], tableFixed: [{
|