@hestia-earth/ui-components 0.28.5 → 0.28.7
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/common/data-table/data-table.component.d.ts +5 -4
- package/esm2022/common/data-table/data-table.component.mjs +17 -24
- package/fesm2022/hestia-earth-ui-components.mjs +52 -60
- package/fesm2022/hestia-earth-ui-components.mjs.map +1 -1
- package/package.json +1 -1
- package/styles.scss +1 -6
- package/svg-icons/icons.json +9 -5
- package/svg-icons/load.svg +10 -0
- package/svg-icons/styles.sass +11 -0
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import { AfterContentChecked, AfterViewInit
|
|
1
|
+
import { AfterContentChecked, AfterViewInit } from '@angular/core';
|
|
2
|
+
import { ResizedEvent } from '../resized.directive';
|
|
2
3
|
import * as i0 from "@angular/core";
|
|
3
|
-
export declare class DataTableComponent implements AfterViewInit, AfterContentChecked
|
|
4
|
+
export declare class DataTableComponent implements AfterViewInit, AfterContentChecked {
|
|
4
5
|
private readonly elementRef;
|
|
5
6
|
protected readonly minHeight: import("@angular/core").InputSignal<string | number>;
|
|
6
7
|
protected readonly maxHeight: import("@angular/core").InputSignal<string | number>;
|
|
@@ -8,12 +9,12 @@ export declare class DataTableComponent implements AfterViewInit, AfterContentCh
|
|
|
8
9
|
protected readonly height: import("@angular/core").WritableSignal<string>;
|
|
9
10
|
protected readonly width: import("@angular/core").WritableSignal<string>;
|
|
10
11
|
get isSmall(): boolean;
|
|
11
|
-
protected onResize(): void;
|
|
12
12
|
ngAfterViewInit(): void;
|
|
13
13
|
ngAfterContentChecked(): void;
|
|
14
|
-
|
|
14
|
+
constructor();
|
|
15
15
|
private get tableEl();
|
|
16
16
|
private updateTableSize;
|
|
17
|
+
protected onResized({ newRect: { width } }: ResizedEvent): void;
|
|
17
18
|
static ɵfac: i0.ɵɵFactoryDeclaration<DataTableComponent, never>;
|
|
18
19
|
static ɵcmp: i0.ɵɵComponentDeclaration<DataTableComponent, "he-data-table", never, { "minHeight": { "alias": "minHeight"; "required": false; "isSignal": true; }; "maxHeight": { "alias": "maxHeight"; "required": false; "isSignal": true; }; "small": { "alias": "small"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
19
20
|
}
|
|
@@ -1,30 +1,25 @@
|
|
|
1
|
-
import { ChangeDetectionStrategy, Component, ElementRef, HostBinding,
|
|
1
|
+
import { ChangeDetectionStrategy, Component, ElementRef, HostBinding, effect, inject, input, signal } from '@angular/core';
|
|
2
|
+
import { ResizedDirective } from '../resized.directive';
|
|
2
3
|
import * as i0 from "@angular/core";
|
|
3
4
|
const defaultSize = '100%';
|
|
4
5
|
export class DataTableComponent {
|
|
5
|
-
constructor() {
|
|
6
|
-
this.elementRef = inject(ElementRef);
|
|
7
|
-
this.minHeight = input(200);
|
|
8
|
-
this.maxHeight = input();
|
|
9
|
-
this.small = input(false);
|
|
10
|
-
this.height = signal(defaultSize);
|
|
11
|
-
this.width = signal(defaultSize);
|
|
12
|
-
}
|
|
13
6
|
get isSmall() {
|
|
14
7
|
return this.small();
|
|
15
8
|
}
|
|
16
|
-
onResize() {
|
|
17
|
-
this.updateTableSize();
|
|
18
|
-
}
|
|
19
9
|
ngAfterViewInit() {
|
|
20
10
|
this.updateTableSize();
|
|
21
11
|
}
|
|
22
12
|
ngAfterContentChecked() {
|
|
23
13
|
this.updateTableSize();
|
|
24
14
|
}
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
15
|
+
constructor() {
|
|
16
|
+
this.elementRef = inject(ElementRef);
|
|
17
|
+
this.minHeight = input(200);
|
|
18
|
+
this.maxHeight = input();
|
|
19
|
+
this.small = input(false);
|
|
20
|
+
this.height = signal(defaultSize);
|
|
21
|
+
this.width = signal(defaultSize);
|
|
22
|
+
effect(() => this.updateTableSize(), { allowSignalWrites: true });
|
|
28
23
|
}
|
|
29
24
|
get tableEl() {
|
|
30
25
|
return this.elementRef.nativeElement.querySelector('table');
|
|
@@ -34,20 +29,18 @@ export class DataTableComponent {
|
|
|
34
29
|
const minHeight = this.minHeight() ? +this.minHeight() : height;
|
|
35
30
|
const maxHeight = this.maxHeight() ? +this.maxHeight() : height;
|
|
36
31
|
this.height.set(`${Math.max(minHeight, Math.min(height, maxHeight))}px`);
|
|
37
|
-
|
|
38
|
-
|
|
32
|
+
}
|
|
33
|
+
onResized({ newRect: { width } }) {
|
|
34
|
+
this.width.set(`${width}px`);
|
|
39
35
|
}
|
|
40
36
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.11", ngImport: i0, type: DataTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
41
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.11", type: DataTableComponent, isStandalone: true, selector: "he-data-table", inputs: { minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, small: { classPropertyName: "small", publicName: "small", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "window:resize": "onResize()" }, properties: { "class.is-small": "this.isSmall" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"data-table-holder\" [style.height]=\"height()\" [style.width]=\"width()\">\n <div class=\"data-table-content\" [style.height]=\"height()\" [style.width]=\"width()\">\n <div class=\"table-container\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block;height:inherit;width:100%}:host *{box-sizing:border-box}:host .data-table-holder{overflow:hidden;position:relative;z-index:1}:host .data-table-content{position:absolute;top:0;left:0;z-index:1}:host ::ng-deep *{box-sizing:border-box}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container{overflow:auto!important;width:100%;height:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table{width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{height:42px;white-space:nowrap}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{border:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th span:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td span:first-child{display:inline-block;max-width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table .fixed-column{position:sticky}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{z-index:10}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{z-index:11}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{top:0;z-index:1070}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column{z-index:1071}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:0;max-width:300px;width:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{max-width:180px;width:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right{box-shadow:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right:after{position:absolute;content:\"\";height:100%;top:0;right:0;width:4px;box-shadow:2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #ffc000,inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #ffc000,2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.fixed-column.has-border-right:after{box-shadow:2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #c5cdd5,inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #c5cdd5,2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr{background-color:transparent!important}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr th{top:42px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr+tr th{top:84px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{background-color:#fff}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-hoverable>tbody>tr:not(.is-selected):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped>tbody>tr:not(.is-selected):nth-child(2n)>td{background-color:#fefcf7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped.is-hoverable>tr:not(.is-selected):nth-child(2n):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow{font-size:.875rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th{height:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{min-width:200px;max-width:200px;width:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{min-width:160px;max-width:160px;width:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr th{top:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr+tr th{top:60px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{height:30px;font-size:.875rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{padding-top:5px;padding-bottom:5px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
37
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.11", type: DataTableComponent, isStandalone: true, selector: "he-data-table", inputs: { minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, small: { classPropertyName: "small", publicName: "small", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.is-small": "this.isSmall" } }, ngImport: i0, template: "<div class=\"w-100 | data-table-holder\" [style.height]=\"height()\" (resized)=\"onResized($event)\">\n <div class=\"data-table-content\" [style.height]=\"height()\" [style.width]=\"width()\">\n <div class=\"table-container\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block;height:inherit;width:100%}:host *{box-sizing:border-box}:host .data-table-holder{overflow:hidden;position:relative;z-index:1}:host .data-table-content{position:absolute;top:0;left:0;z-index:1}:host ::ng-deep *{box-sizing:border-box}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container{overflow:auto!important;width:100%;height:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table{width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{height:42px;white-space:nowrap}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{border:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th span:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td span:first-child{display:inline-block;max-width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table .fixed-column{position:sticky}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{z-index:10}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{z-index:11}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{top:0;z-index:1070}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column{z-index:1071}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:0;max-width:300px;width:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{max-width:180px;width:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right{box-shadow:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right:after{position:absolute;content:\"\";height:100%;top:0;right:0;width:4px;box-shadow:2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #ffc000,inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #ffc000,2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.fixed-column.has-border-right:after{box-shadow:2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #c5cdd5,inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #c5cdd5,2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr{background-color:transparent!important}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr th{top:42px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr+tr th{top:84px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{background-color:#fff}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-hoverable>tbody>tr:not(.is-selected):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped>tbody>tr:not(.is-selected):nth-child(2n)>td{background-color:#fefcf7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped.is-hoverable>tr:not(.is-selected):nth-child(2n):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow{font-size:.875rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th{height:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{min-width:200px;max-width:200px;width:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{min-width:160px;max-width:160px;width:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr th{top:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr+tr th{top:60px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{height:30px;font-size:.875rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{padding-top:5px;padding-bottom:5px}\n"], dependencies: [{ kind: "directive", type: ResizedDirective, selector: "[resized]", outputs: ["resized"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
42
38
|
}
|
|
43
39
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.11", ngImport: i0, type: DataTableComponent, decorators: [{
|
|
44
40
|
type: Component,
|
|
45
|
-
args: [{ selector: 'he-data-table', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"data-table-holder\" [style.height]=\"height()\" [style.width]=\"width()\">\n <div class=\"data-table-content\" [style.height]=\"height()\" [style.width]=\"width()\">\n <div class=\"table-container\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block;height:inherit;width:100%}:host *{box-sizing:border-box}:host .data-table-holder{overflow:hidden;position:relative;z-index:1}:host .data-table-content{position:absolute;top:0;left:0;z-index:1}:host ::ng-deep *{box-sizing:border-box}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container{overflow:auto!important;width:100%;height:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table{width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{height:42px;white-space:nowrap}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{border:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th span:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td span:first-child{display:inline-block;max-width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table .fixed-column{position:sticky}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{z-index:10}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{z-index:11}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{top:0;z-index:1070}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column{z-index:1071}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:0;max-width:300px;width:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{max-width:180px;width:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right{box-shadow:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right:after{position:absolute;content:\"\";height:100%;top:0;right:0;width:4px;box-shadow:2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #ffc000,inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #ffc000,2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.fixed-column.has-border-right:after{box-shadow:2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #c5cdd5,inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #c5cdd5,2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr{background-color:transparent!important}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr th{top:42px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr+tr th{top:84px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{background-color:#fff}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-hoverable>tbody>tr:not(.is-selected):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped>tbody>tr:not(.is-selected):nth-child(2n)>td{background-color:#fefcf7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped.is-hoverable>tr:not(.is-selected):nth-child(2n):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow{font-size:.875rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th{height:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{min-width:200px;max-width:200px;width:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{min-width:160px;max-width:160px;width:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr th{top:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr+tr th{top:60px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{height:30px;font-size:.875rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{padding-top:5px;padding-bottom:5px}\n"] }]
|
|
46
|
-
}], propDecorators: { isSmall: [{
|
|
41
|
+
args: [{ selector: 'he-data-table', imports: [ResizedDirective], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"w-100 | data-table-holder\" [style.height]=\"height()\" (resized)=\"onResized($event)\">\n <div class=\"data-table-content\" [style.height]=\"height()\" [style.width]=\"width()\">\n <div class=\"table-container\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block;height:inherit;width:100%}:host *{box-sizing:border-box}:host .data-table-holder{overflow:hidden;position:relative;z-index:1}:host .data-table-content{position:absolute;top:0;left:0;z-index:1}:host ::ng-deep *{box-sizing:border-box}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container{overflow:auto!important;width:100%;height:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table{width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{height:42px;white-space:nowrap}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{border:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th span:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td span:first-child{display:inline-block;max-width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table .fixed-column{position:sticky}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{z-index:10}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{z-index:11}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{top:0;z-index:1070}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column{z-index:1071}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:0;max-width:300px;width:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{max-width:180px;width:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right{box-shadow:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right:after{position:absolute;content:\"\";height:100%;top:0;right:0;width:4px;box-shadow:2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #ffc000,inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #ffc000,2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.fixed-column.has-border-right:after{box-shadow:2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #c5cdd5,inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #c5cdd5,2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr{background-color:transparent!important}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr th{top:42px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr+tr th{top:84px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{background-color:#fff}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-hoverable>tbody>tr:not(.is-selected):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped>tbody>tr:not(.is-selected):nth-child(2n)>td{background-color:#fefcf7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped.is-hoverable>tr:not(.is-selected):nth-child(2n):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow{font-size:.875rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th{height:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{min-width:200px;max-width:200px;width:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{min-width:160px;max-width:160px;width:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr th{top:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr+tr th{top:60px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{height:30px;font-size:.875rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{padding-top:5px;padding-bottom:5px}\n"] }]
|
|
42
|
+
}], ctorParameters: () => [], propDecorators: { isSmall: [{
|
|
47
43
|
type: HostBinding,
|
|
48
44
|
args: ['class.is-small']
|
|
49
|
-
}], onResize: [{
|
|
50
|
-
type: HostListener,
|
|
51
|
-
args: ['window:resize', []]
|
|
52
45
|
}] } });
|
|
53
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
46
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0YS10YWJsZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvY29tbW9uL2RhdGEtdGFibGUvZGF0YS10YWJsZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9zcmMvY29tbW9uL2RhdGEtdGFibGUvZGF0YS10YWJsZS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBR0wsdUJBQXVCLEVBQ3ZCLFNBQVMsRUFDVCxVQUFVLEVBQ1YsV0FBVyxFQUNYLE1BQU0sRUFDTixNQUFNLEVBQ04sS0FBSyxFQUNMLE1BQU0sRUFDUCxNQUFNLGVBQWUsQ0FBQztBQUV2QixPQUFPLEVBQWdCLGdCQUFnQixFQUFFLE1BQU0sc0JBQXNCLENBQUM7O0FBRXRFLE1BQU0sV0FBVyxHQUFHLE1BQU0sQ0FBQztBQVUzQixNQUFNLE9BQU8sa0JBQWtCO0lBVTdCLElBQ1csT0FBTztRQUNoQixPQUFPLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQztJQUN0QixDQUFDO0lBRUQsZUFBZTtRQUNiLElBQUksQ0FBQyxlQUFlLEVBQUUsQ0FBQztJQUN6QixDQUFDO0lBRUQscUJBQXFCO1FBQ25CLElBQUksQ0FBQyxlQUFlLEVBQUUsQ0FBQztJQUN6QixDQUFDO0lBRUQ7UUF0QmlCLGVBQVUsR0FBRyxNQUFNLENBQUMsVUFBVSxDQUFDLENBQUM7UUFFOUIsY0FBUyxHQUFHLEtBQUssQ0FBa0IsR0FBRyxDQUFDLENBQUM7UUFDeEMsY0FBUyxHQUFHLEtBQUssRUFBbUIsQ0FBQztRQUNyQyxVQUFLLEdBQUcsS0FBSyxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBRXJCLFdBQU0sR0FBRyxNQUFNLENBQUMsV0FBVyxDQUFDLENBQUM7UUFDN0IsVUFBSyxHQUFHLE1BQU0sQ0FBQyxXQUFXLENBQUMsQ0FBQztRQWdCN0MsTUFBTSxDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxlQUFlLEVBQUUsRUFBRSxFQUFFLGlCQUFpQixFQUFFLElBQUksRUFBRSxDQUFDLENBQUM7SUFDcEUsQ0FBQztJQUVELElBQVksT0FBTztRQUNqQixPQUFPLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxDQUFDLGFBQWEsQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUM5RCxDQUFDO0lBRU8sZUFBZTtRQUNyQixNQUFNLE1BQU0sR0FBRyxJQUFJLENBQUMsT0FBTyxDQUFDLFlBQVksQ0FBQztRQUN6QyxNQUFNLFNBQVMsR0FBRyxJQUFJLENBQUMsU0FBUyxFQUFFLENBQUMsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUM7UUFDaEUsTUFBTSxTQUFTLEdBQUcsSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxTQUFTLEVBQUUsQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDO1FBQ2hFLElBQUksQ0FBQyxNQUFNLENBQUMsR0FBRyxDQUFDLEdBQUcsSUFBSSxDQUFDLEdBQUcsQ0FBQyxTQUFTLEVBQUUsSUFBSSxDQUFDLEdBQUcsQ0FBQyxNQUFNLEVBQUUsU0FBUyxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDM0UsQ0FBQztJQUVTLFNBQVMsQ0FBQyxFQUFFLE9BQU8sRUFBRSxFQUFFLEtBQUssRUFBRSxFQUFnQjtRQUN0RCxJQUFJLENBQUMsS0FBSyxDQUFDLEdBQUcsQ0FBQyxHQUFHLEtBQUssSUFBSSxDQUFDLENBQUM7SUFDL0IsQ0FBQzsrR0F4Q1Usa0JBQWtCO21HQUFsQixrQkFBa0IsaWhCQ3pCL0IseVNBT0EsaTVWRGNZLGdCQUFnQjs7NEZBSWYsa0JBQWtCO2tCQVI5QixTQUFTOytCQUNFLGVBQWUsV0FHaEIsQ0FBQyxnQkFBZ0IsQ0FBQyxjQUNmLElBQUksbUJBQ0MsdUJBQXVCLENBQUMsTUFBTTt3REFhcEMsT0FBTztzQkFEakIsV0FBVzt1QkFBQyxnQkFBZ0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBBZnRlckNvbnRlbnRDaGVja2VkLFxuICBBZnRlclZpZXdJbml0LFxuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ29tcG9uZW50LFxuICBFbGVtZW50UmVmLFxuICBIb3N0QmluZGluZyxcbiAgZWZmZWN0LFxuICBpbmplY3QsXG4gIGlucHV0LFxuICBzaWduYWxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmltcG9ydCB7IFJlc2l6ZWRFdmVudCwgUmVzaXplZERpcmVjdGl2ZSB9IGZyb20gJy4uL3Jlc2l6ZWQuZGlyZWN0aXZlJztcblxuY29uc3QgZGVmYXVsdFNpemUgPSAnMTAwJSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2hlLWRhdGEtdGFibGUnLFxuICB0ZW1wbGF0ZVVybDogJy4vZGF0YS10YWJsZS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL2RhdGEtdGFibGUuY29tcG9uZW50LnNjc3MnXSxcbiAgaW1wb3J0czogW1Jlc2l6ZWREaXJlY3RpdmVdLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaFxufSlcbmV4cG9ydCBjbGFzcyBEYXRhVGFibGVDb21wb25lbnQgaW1wbGVtZW50cyBBZnRlclZpZXdJbml0LCBBZnRlckNvbnRlbnRDaGVja2VkIHtcbiAgcHJpdmF0ZSByZWFkb25seSBlbGVtZW50UmVmID0gaW5qZWN0KEVsZW1lbnRSZWYpO1xuXG4gIHByb3RlY3RlZCByZWFkb25seSBtaW5IZWlnaHQgPSBpbnB1dDxzdHJpbmcgfCBudW1iZXI+KDIwMCk7XG4gIHByb3RlY3RlZCByZWFkb25seSBtYXhIZWlnaHQgPSBpbnB1dDxzdHJpbmcgfCBudW1iZXI+KCk7XG4gIHByb3RlY3RlZCByZWFkb25seSBzbWFsbCA9IGlucHV0KGZhbHNlKTtcblxuICBwcm90ZWN0ZWQgcmVhZG9ubHkgaGVpZ2h0ID0gc2lnbmFsKGRlZmF1bHRTaXplKTtcbiAgcHJvdGVjdGVkIHJlYWRvbmx5IHdpZHRoID0gc2lnbmFsKGRlZmF1bHRTaXplKTtcblxuICBASG9zdEJpbmRpbmcoJ2NsYXNzLmlzLXNtYWxsJylcbiAgcHVibGljIGdldCBpc1NtYWxsKCkge1xuICAgIHJldHVybiB0aGlzLnNtYWxsKCk7XG4gIH1cblxuICBuZ0FmdGVyVmlld0luaXQoKSB7XG4gICAgdGhpcy51cGRhdGVUYWJsZVNpemUoKTtcbiAgfVxuXG4gIG5nQWZ0ZXJDb250ZW50Q2hlY2tlZCgpIHtcbiAgICB0aGlzLnVwZGF0ZVRhYmxlU2l6ZSgpO1xuICB9XG5cbiAgY29uc3RydWN0b3IoKSB7XG4gICAgZWZmZWN0KCgpID0+IHRoaXMudXBkYXRlVGFibGVTaXplKCksIHsgYWxsb3dTaWduYWxXcml0ZXM6IHRydWUgfSk7XG4gIH1cblxuICBwcml2YXRlIGdldCB0YWJsZUVsKCkge1xuICAgIHJldHVybiB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudC5xdWVyeVNlbGVjdG9yKCd0YWJsZScpO1xuICB9XG5cbiAgcHJpdmF0ZSB1cGRhdGVUYWJsZVNpemUoKSB7XG4gICAgY29uc3QgaGVpZ2h0ID0gdGhpcy50YWJsZUVsLm9mZnNldEhlaWdodDtcbiAgICBjb25zdCBtaW5IZWlnaHQgPSB0aGlzLm1pbkhlaWdodCgpID8gK3RoaXMubWluSGVpZ2h0KCkgOiBoZWlnaHQ7XG4gICAgY29uc3QgbWF4SGVpZ2h0ID0gdGhpcy5tYXhIZWlnaHQoKSA/ICt0aGlzLm1heEhlaWdodCgpIDogaGVpZ2h0O1xuICAgIHRoaXMuaGVpZ2h0LnNldChgJHtNYXRoLm1heChtaW5IZWlnaHQsIE1hdGgubWluKGhlaWdodCwgbWF4SGVpZ2h0KSl9cHhgKTtcbiAgfVxuXG4gIHByb3RlY3RlZCBvblJlc2l6ZWQoeyBuZXdSZWN0OiB7IHdpZHRoIH0gfTogUmVzaXplZEV2ZW50KSB7XG4gICAgdGhpcy53aWR0aC5zZXQoYCR7d2lkdGh9cHhgKTtcbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cInctMTAwIHwgZGF0YS10YWJsZS1ob2xkZXJcIiBbc3R5bGUuaGVpZ2h0XT1cImhlaWdodCgpXCIgKHJlc2l6ZWQpPVwib25SZXNpemVkKCRldmVudClcIj5cbiAgPGRpdiBjbGFzcz1cImRhdGEtdGFibGUtY29udGVudFwiIFtzdHlsZS5oZWlnaHRdPVwiaGVpZ2h0KClcIiBbc3R5bGUud2lkdGhdPVwid2lkdGgoKVwiPlxuICAgIDxkaXYgY2xhc3M9XCJ0YWJsZS1jb250YWluZXJcIj5cbiAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, InjectionToken, inject, model, computed, output, signal, effect, Component as Component$1, ChangeDetectionStrategy, NgZone, ElementRef, Directive, Input, input, Pipe, viewChild, HostBinding,
|
|
2
|
+
import { Injectable, InjectionToken, inject, model, computed, output, signal, effect, Component as Component$1, ChangeDetectionStrategy, NgZone, ElementRef, Directive, Input, input, Pipe, viewChild, HostBinding, ViewEncapsulation, HostListener, EventEmitter as EventEmitter$1, ContentChild, Output, DestroyRef, NgModule, ViewChild, viewChildren, ChangeDetectorRef, forwardRef, ContentChildren } from '@angular/core';
|
|
3
3
|
import { toSignal, toObservable, outputFromObservable, takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
4
4
|
import * as i1 from '@angular/forms';
|
|
5
5
|
import { UntypedFormBuilder, Validators, FormsModule, ReactiveFormsModule, NG_VALUE_ACCESSOR, FormControl } from '@angular/forms';
|
|
@@ -2069,31 +2069,62 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.11", ngImpo
|
|
|
2069
2069
|
args: ['class']
|
|
2070
2070
|
}] } });
|
|
2071
2071
|
|
|
2072
|
-
|
|
2073
|
-
|
|
2072
|
+
class ResizedEvent {
|
|
2073
|
+
constructor(newRect, oldRect) {
|
|
2074
|
+
this.newRect = newRect;
|
|
2075
|
+
this.oldRect = oldRect;
|
|
2076
|
+
this.isFirst = oldRect == null;
|
|
2077
|
+
}
|
|
2078
|
+
}
|
|
2079
|
+
class ResizedDirective {
|
|
2074
2080
|
constructor() {
|
|
2075
|
-
this.
|
|
2076
|
-
this.
|
|
2077
|
-
this.
|
|
2078
|
-
this.
|
|
2079
|
-
|
|
2080
|
-
|
|
2081
|
+
this.element = inject(ElementRef);
|
|
2082
|
+
this.zone = inject(NgZone);
|
|
2083
|
+
this.resized = output();
|
|
2084
|
+
this.observer = new ResizeObserver(entries => this.zone.run(() => this.observe(entries)));
|
|
2085
|
+
}
|
|
2086
|
+
ngOnInit() {
|
|
2087
|
+
this.observer.observe(this.element.nativeElement);
|
|
2088
|
+
}
|
|
2089
|
+
ngOnDestroy() {
|
|
2090
|
+
this.observer.disconnect();
|
|
2091
|
+
}
|
|
2092
|
+
observe(entries) {
|
|
2093
|
+
const domSize = entries[0];
|
|
2094
|
+
const resizedEvent = new ResizedEvent(domSize.contentRect, this.oldRect);
|
|
2095
|
+
this.oldRect = domSize.contentRect;
|
|
2096
|
+
this.resized.emit(resizedEvent);
|
|
2081
2097
|
}
|
|
2098
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.11", ngImport: i0, type: ResizedDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2099
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.11", type: ResizedDirective, isStandalone: true, selector: "[resized]", outputs: { resized: "resized" }, ngImport: i0 }); }
|
|
2100
|
+
}
|
|
2101
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.11", ngImport: i0, type: ResizedDirective, decorators: [{
|
|
2102
|
+
type: Directive,
|
|
2103
|
+
args: [{
|
|
2104
|
+
selector: '[resized]',
|
|
2105
|
+
standalone: true
|
|
2106
|
+
}]
|
|
2107
|
+
}], ctorParameters: () => [] });
|
|
2108
|
+
|
|
2109
|
+
const defaultSize = '100%';
|
|
2110
|
+
class DataTableComponent {
|
|
2082
2111
|
get isSmall() {
|
|
2083
2112
|
return this.small();
|
|
2084
2113
|
}
|
|
2085
|
-
onResize() {
|
|
2086
|
-
this.updateTableSize();
|
|
2087
|
-
}
|
|
2088
2114
|
ngAfterViewInit() {
|
|
2089
2115
|
this.updateTableSize();
|
|
2090
2116
|
}
|
|
2091
2117
|
ngAfterContentChecked() {
|
|
2092
2118
|
this.updateTableSize();
|
|
2093
2119
|
}
|
|
2094
|
-
|
|
2095
|
-
|
|
2096
|
-
|
|
2120
|
+
constructor() {
|
|
2121
|
+
this.elementRef = inject(ElementRef);
|
|
2122
|
+
this.minHeight = input(200);
|
|
2123
|
+
this.maxHeight = input();
|
|
2124
|
+
this.small = input(false);
|
|
2125
|
+
this.height = signal(defaultSize);
|
|
2126
|
+
this.width = signal(defaultSize);
|
|
2127
|
+
effect(() => this.updateTableSize(), { allowSignalWrites: true });
|
|
2097
2128
|
}
|
|
2098
2129
|
get tableEl() {
|
|
2099
2130
|
return this.elementRef.nativeElement.querySelector('table');
|
|
@@ -2103,21 +2134,19 @@ class DataTableComponent {
|
|
|
2103
2134
|
const minHeight = this.minHeight() ? +this.minHeight() : height;
|
|
2104
2135
|
const maxHeight = this.maxHeight() ? +this.maxHeight() : height;
|
|
2105
2136
|
this.height.set(`${Math.max(minHeight, Math.min(height, maxHeight))}px`);
|
|
2106
|
-
|
|
2107
|
-
|
|
2137
|
+
}
|
|
2138
|
+
onResized({ newRect: { width } }) {
|
|
2139
|
+
this.width.set(`${width}px`);
|
|
2108
2140
|
}
|
|
2109
2141
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.11", ngImport: i0, type: DataTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2110
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.11", type: DataTableComponent, isStandalone: true, selector: "he-data-table", inputs: { minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, small: { classPropertyName: "small", publicName: "small", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "window:resize": "onResize()" }, properties: { "class.is-small": "this.isSmall" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"data-table-holder\" [style.height]=\"height()\" [style.width]=\"width()\">\n <div class=\"data-table-content\" [style.height]=\"height()\" [style.width]=\"width()\">\n <div class=\"table-container\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block;height:inherit;width:100%}:host *{box-sizing:border-box}:host .data-table-holder{overflow:hidden;position:relative;z-index:1}:host .data-table-content{position:absolute;top:0;left:0;z-index:1}:host ::ng-deep *{box-sizing:border-box}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container{overflow:auto!important;width:100%;height:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table{width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{height:42px;white-space:nowrap}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{border:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th span:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td span:first-child{display:inline-block;max-width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table .fixed-column{position:sticky}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{z-index:10}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{z-index:11}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{top:0;z-index:1070}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column{z-index:1071}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:0;max-width:300px;width:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{max-width:180px;width:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right{box-shadow:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right:after{position:absolute;content:\"\";height:100%;top:0;right:0;width:4px;box-shadow:2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #ffc000,inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #ffc000,2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.fixed-column.has-border-right:after{box-shadow:2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #c5cdd5,inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #c5cdd5,2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr{background-color:transparent!important}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr th{top:42px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr+tr th{top:84px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{background-color:#fff}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-hoverable>tbody>tr:not(.is-selected):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped>tbody>tr:not(.is-selected):nth-child(2n)>td{background-color:#fefcf7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped.is-hoverable>tr:not(.is-selected):nth-child(2n):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow{font-size:.875rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th{height:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{min-width:200px;max-width:200px;width:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{min-width:160px;max-width:160px;width:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr th{top:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr+tr th{top:60px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{height:30px;font-size:.875rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{padding-top:5px;padding-bottom:5px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2142
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.11", type: DataTableComponent, isStandalone: true, selector: "he-data-table", inputs: { minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, small: { classPropertyName: "small", publicName: "small", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.is-small": "this.isSmall" } }, ngImport: i0, template: "<div class=\"w-100 | data-table-holder\" [style.height]=\"height()\" (resized)=\"onResized($event)\">\n <div class=\"data-table-content\" [style.height]=\"height()\" [style.width]=\"width()\">\n <div class=\"table-container\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block;height:inherit;width:100%}:host *{box-sizing:border-box}:host .data-table-holder{overflow:hidden;position:relative;z-index:1}:host .data-table-content{position:absolute;top:0;left:0;z-index:1}:host ::ng-deep *{box-sizing:border-box}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container{overflow:auto!important;width:100%;height:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table{width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{height:42px;white-space:nowrap}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{border:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th span:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td span:first-child{display:inline-block;max-width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table .fixed-column{position:sticky}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{z-index:10}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{z-index:11}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{top:0;z-index:1070}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column{z-index:1071}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:0;max-width:300px;width:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{max-width:180px;width:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right{box-shadow:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right:after{position:absolute;content:\"\";height:100%;top:0;right:0;width:4px;box-shadow:2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #ffc000,inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #ffc000,2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.fixed-column.has-border-right:after{box-shadow:2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #c5cdd5,inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #c5cdd5,2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr{background-color:transparent!important}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr th{top:42px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr+tr th{top:84px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{background-color:#fff}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-hoverable>tbody>tr:not(.is-selected):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped>tbody>tr:not(.is-selected):nth-child(2n)>td{background-color:#fefcf7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped.is-hoverable>tr:not(.is-selected):nth-child(2n):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow{font-size:.875rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th{height:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{min-width:200px;max-width:200px;width:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{min-width:160px;max-width:160px;width:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr th{top:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr+tr th{top:60px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{height:30px;font-size:.875rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{padding-top:5px;padding-bottom:5px}\n"], dependencies: [{ kind: "directive", type: ResizedDirective, selector: "[resized]", outputs: ["resized"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2111
2143
|
}
|
|
2112
2144
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.11", ngImport: i0, type: DataTableComponent, decorators: [{
|
|
2113
2145
|
type: Component$1,
|
|
2114
|
-
args: [{ selector: 'he-data-table', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"data-table-holder\" [style.height]=\"height()\" [style.width]=\"width()\">\n <div class=\"data-table-content\" [style.height]=\"height()\" [style.width]=\"width()\">\n <div class=\"table-container\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block;height:inherit;width:100%}:host *{box-sizing:border-box}:host .data-table-holder{overflow:hidden;position:relative;z-index:1}:host .data-table-content{position:absolute;top:0;left:0;z-index:1}:host ::ng-deep *{box-sizing:border-box}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container{overflow:auto!important;width:100%;height:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table{width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{height:42px;white-space:nowrap}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{border:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th span:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td span:first-child{display:inline-block;max-width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table .fixed-column{position:sticky}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{z-index:10}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{z-index:11}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{top:0;z-index:1070}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column{z-index:1071}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:0;max-width:300px;width:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{max-width:180px;width:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right{box-shadow:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right:after{position:absolute;content:\"\";height:100%;top:0;right:0;width:4px;box-shadow:2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #ffc000,inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #ffc000,2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.fixed-column.has-border-right:after{box-shadow:2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #c5cdd5,inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #c5cdd5,2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr{background-color:transparent!important}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr th{top:42px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr+tr th{top:84px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{background-color:#fff}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-hoverable>tbody>tr:not(.is-selected):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped>tbody>tr:not(.is-selected):nth-child(2n)>td{background-color:#fefcf7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped.is-hoverable>tr:not(.is-selected):nth-child(2n):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow{font-size:.875rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th{height:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{min-width:200px;max-width:200px;width:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{min-width:160px;max-width:160px;width:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr th{top:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr+tr th{top:60px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{height:30px;font-size:.875rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{padding-top:5px;padding-bottom:5px}\n"] }]
|
|
2115
|
-
}], propDecorators: { isSmall: [{
|
|
2146
|
+
args: [{ selector: 'he-data-table', imports: [ResizedDirective], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"w-100 | data-table-holder\" [style.height]=\"height()\" (resized)=\"onResized($event)\">\n <div class=\"data-table-content\" [style.height]=\"height()\" [style.width]=\"width()\">\n <div class=\"table-container\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block;height:inherit;width:100%}:host *{box-sizing:border-box}:host .data-table-holder{overflow:hidden;position:relative;z-index:1}:host .data-table-content{position:absolute;top:0;left:0;z-index:1}:host ::ng-deep *{box-sizing:border-box}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container{overflow:auto!important;width:100%;height:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table{width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{height:42px;white-space:nowrap}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{border:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th span:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td span:first-child{display:inline-block;max-width:100%}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table .fixed-column{position:sticky}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{z-index:10}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{z-index:11}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th{top:0;z-index:1070}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column{z-index:1071}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:0;max-width:300px;width:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{max-width:180px;width:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right{box-shadow:none}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column.has-border-right:after{position:absolute;content:\"\";height:100%;top:0;right:0;width:4px;box-shadow:2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:300px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td.fixed-column{left:180px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #ffc000,inset -2px 0 #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #ffc000}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #ffc000,2px 0 4px #c4ae6c1a}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.has-border-right{box-shadow:inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr>th.fixed-column.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>tbody>tr>td.fixed-column.has-border-right:after{box-shadow:2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.has-border-right{box-shadow:inset 0 -1px #c5cdd5,inset -2px 0 #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right{box-shadow:inset 0 -1px #c5cdd5}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th:first-child.has-border-right:after,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-dark>thead>tr:last-child>th.fixed-column.has-border-right:after{box-shadow:inset 0 -1px #c5cdd5,2px 0 4px #6c8093}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr{background-color:transparent!important}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr th{top:42px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr+tr+tr th{top:84px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>thead>tr>th,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table>tbody>tr>td{background-color:#fff}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-hoverable>tbody>tr:not(.is-selected):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped>tbody>tr:not(.is-selected):nth-child(2n)>td{background-color:#fefcf7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-striped.is-hoverable>tr:not(.is-selected):nth-child(2n):hover>td{background-color:#f3f5f7}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow{font-size:.875rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th{height:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{min-width:200px;max-width:200px;width:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td:first-child,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{min-width:160px;max-width:160px;width:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:200px}@media screen and (max-width: 767px){:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr>th.fixed-column,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>tbody>tr>td.fixed-column{left:160px}}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr th{top:30px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow>thead>tr+tr+tr th{top:60px}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{height:30px;font-size:.875rem;line-height:1rem}:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .select select,:host ::ng-deep>.data-table-holder>.data-table-content>.table-container>.table.is-narrow .input{padding-top:5px;padding-bottom:5px}\n"] }]
|
|
2147
|
+
}], ctorParameters: () => [], propDecorators: { isSmall: [{
|
|
2116
2148
|
type: HostBinding,
|
|
2117
2149
|
args: ['class.is-small']
|
|
2118
|
-
}], onResize: [{
|
|
2119
|
-
type: HostListener,
|
|
2120
|
-
args: ['window:resize', []]
|
|
2121
2150
|
}] } });
|
|
2122
2151
|
|
|
2123
2152
|
const animationDuration = '300ms';
|
|
@@ -3505,43 +3534,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.11", ngImpo
|
|
|
3505
3534
|
}]
|
|
3506
3535
|
}] });
|
|
3507
3536
|
|
|
3508
|
-
class ResizedEvent {
|
|
3509
|
-
constructor(newRect, oldRect) {
|
|
3510
|
-
this.newRect = newRect;
|
|
3511
|
-
this.oldRect = oldRect;
|
|
3512
|
-
this.isFirst = oldRect == null;
|
|
3513
|
-
}
|
|
3514
|
-
}
|
|
3515
|
-
class ResizedDirective {
|
|
3516
|
-
constructor() {
|
|
3517
|
-
this.element = inject(ElementRef);
|
|
3518
|
-
this.zone = inject(NgZone);
|
|
3519
|
-
this.resized = output();
|
|
3520
|
-
this.observer = new ResizeObserver(entries => this.zone.run(() => this.observe(entries)));
|
|
3521
|
-
}
|
|
3522
|
-
ngOnInit() {
|
|
3523
|
-
this.observer.observe(this.element.nativeElement);
|
|
3524
|
-
}
|
|
3525
|
-
ngOnDestroy() {
|
|
3526
|
-
this.observer.disconnect();
|
|
3527
|
-
}
|
|
3528
|
-
observe(entries) {
|
|
3529
|
-
const domSize = entries[0];
|
|
3530
|
-
const resizedEvent = new ResizedEvent(domSize.contentRect, this.oldRect);
|
|
3531
|
-
this.oldRect = domSize.contentRect;
|
|
3532
|
-
this.resized.emit(resizedEvent);
|
|
3533
|
-
}
|
|
3534
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.11", ngImport: i0, type: ResizedDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
3535
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.11", type: ResizedDirective, isStandalone: true, selector: "[resized]", outputs: { resized: "resized" }, ngImport: i0 }); }
|
|
3536
|
-
}
|
|
3537
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.11", ngImport: i0, type: ResizedDirective, decorators: [{
|
|
3538
|
-
type: Directive,
|
|
3539
|
-
args: [{
|
|
3540
|
-
selector: '[resized]',
|
|
3541
|
-
standalone: true
|
|
3542
|
-
}]
|
|
3543
|
-
}], ctorParameters: () => [] });
|
|
3544
|
-
|
|
3545
3537
|
/* eslint-disable */
|
|
3546
3538
|
/**
|
|
3547
3539
|
* @class EventEmitter
|