@taiga-ui/addon-table 5.0.0-canary.cf66fed → 5.0.0-canary.d205016
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/components/reorder/reorder.component.d.ts +1 -5
- package/components/table/directives/stuck.directive.d.ts +1 -1
- package/components/table/index.d.ts +1 -0
- package/components/table/pipes/sorter.pipe.d.ts +8 -0
- package/components/table/pipes/table-sort.pipe.d.ts +4 -4
- package/components/table/table.d.ts +2 -1
- package/components/table/th/th.component.d.ts +1 -2
- package/fesm2022/taiga-ui-addon-table-components-reorder.mjs +5 -5
- package/fesm2022/taiga-ui-addon-table-components-reorder.mjs.map +1 -1
- package/fesm2022/taiga-ui-addon-table-components-table-pagination.mjs +8 -10
- package/fesm2022/taiga-ui-addon-table-components-table-pagination.mjs.map +1 -1
- package/fesm2022/taiga-ui-addon-table-components-table.mjs +73 -66
- package/fesm2022/taiga-ui-addon-table-components-table.mjs.map +1 -1
- package/fesm2022/taiga-ui-addon-table-directives-table-control.mjs +9 -9
- package/fesm2022/taiga-ui-addon-table-directives-table-control.mjs.map +1 -1
- package/fesm2022/taiga-ui-addon-table-directives-table-filters.mjs +12 -12
- package/fesm2022/taiga-ui-addon-table-directives-table-filters.mjs.map +1 -1
- package/fesm2022/taiga-ui-addon-table-tokens.mjs.map +1 -1
- package/package.json +24 -10
|
@@ -2,7 +2,7 @@ import * as i0 from '@angular/core';
|
|
|
2
2
|
import { ChangeDetectionStrategy, ViewEncapsulation, Component, input, inject, TemplateRef, Directive, computed, effect, model, output, signal, forwardRef, untracked, contentChildren, Pipe, viewChild, PLATFORM_ID, contentChild } from '@angular/core';
|
|
3
3
|
import { DOCUMENT, NgTemplateOutlet, isPlatformServer } from '@angular/common';
|
|
4
4
|
import { outputFromObservable, toSignal, takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
5
|
-
import { EMPTY_CLIENT_RECT } from '@taiga-ui/cdk/constants';
|
|
5
|
+
import { EMPTY_CLIENT_RECT, TUI_VERSION } from '@taiga-ui/cdk/constants';
|
|
6
6
|
import { tuiTypedFromEvent, tuiPreventDefault, tuiWatch } from '@taiga-ui/cdk/observables';
|
|
7
7
|
import { tuiInjectElement } from '@taiga-ui/cdk/utils/dom';
|
|
8
8
|
import { switchMap, distinctUntilChanged, map, takeUntil, catchError, EMPTY, Subject, timer, of } from 'rxjs';
|
|
@@ -23,10 +23,10 @@ import { PolymorpheusOutlet } from '@taiga-ui/polymorpheus';
|
|
|
23
23
|
import { TuiControl } from '@taiga-ui/cdk/classes';
|
|
24
24
|
|
|
25
25
|
class TuiTableCaption {
|
|
26
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
27
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
26
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableCaption, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
27
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: TuiTableCaption, isStandalone: true, selector: "caption[tuiCaption]", ngImport: i0, template: '<ng-content/>', isInline: true, styles: ["caption[tuiCaption]{caption-side:bottom;text-align:start;padding:.75rem 0;color:var(--tui-text-secondary)}caption[tuiCaption]>*{vertical-align:middle}caption[tuiCaption]>*:not(:first-child){margin-inline-start:.5rem}caption[tuiCaption] tui-pagination:not(:first-child),caption[tuiCaption] tui-pager:not(:first-child){display:inline-flex;vertical-align:middle}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
28
28
|
}
|
|
29
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
29
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableCaption, decorators: [{
|
|
30
30
|
type: Component,
|
|
31
31
|
args: [{ selector: 'caption[tuiCaption]', template: '<ng-content/>', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["caption[tuiCaption]{caption-side:bottom;text-align:start;padding:.75rem 0;color:var(--tui-text-secondary)}caption[tuiCaption]>*{vertical-align:middle}caption[tuiCaption]>*:not(:first-child){margin-inline-start:.5rem}caption[tuiCaption] tui-pagination:not(:first-child),caption[tuiCaption] tui-pager:not(:first-child){display:inline-flex;vertical-align:middle}\n"] }]
|
|
32
32
|
}] });
|
|
@@ -36,10 +36,10 @@ class TuiTableCell {
|
|
|
36
36
|
this.tuiCell = input('');
|
|
37
37
|
this.template = inject((TemplateRef));
|
|
38
38
|
}
|
|
39
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
40
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.
|
|
39
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableCell, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
40
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.19", type: TuiTableCell, isStandalone: true, selector: "ng-template[tuiCell]", inputs: { tuiCell: { classPropertyName: "tuiCell", publicName: "tuiCell", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
|
|
41
41
|
}
|
|
42
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
42
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableCell, decorators: [{
|
|
43
43
|
type: Directive,
|
|
44
44
|
args: [{ selector: 'ng-template[tuiCell]' }]
|
|
45
45
|
}] });
|
|
@@ -49,10 +49,10 @@ class TuiTableHead {
|
|
|
49
49
|
this.tuiHead = input.required();
|
|
50
50
|
this.template = inject((TemplateRef));
|
|
51
51
|
}
|
|
52
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
53
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.
|
|
52
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableHead, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
53
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.19", type: TuiTableHead, isStandalone: true, selector: "[tuiHead]", inputs: { tuiHead: { classPropertyName: "tuiHead", publicName: "tuiHead", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
|
|
54
54
|
}
|
|
55
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
55
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableHead, decorators: [{
|
|
56
56
|
type: Directive,
|
|
57
57
|
args: [{ selector: '[tuiHead]' }]
|
|
58
58
|
}] });
|
|
@@ -67,10 +67,10 @@ class TuiTableResized {
|
|
|
67
67
|
}));
|
|
68
68
|
this.tuiResized = outputFromObservable(this.tuiResized$);
|
|
69
69
|
}
|
|
70
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
71
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
70
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableResized, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
71
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.19", type: TuiTableResized, isStandalone: true, selector: "[tuiResized]", outputs: { tuiResized: "tuiResized" }, ngImport: i0 }); }
|
|
72
72
|
}
|
|
73
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
73
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableResized, decorators: [{
|
|
74
74
|
type: Directive,
|
|
75
75
|
args: [{ selector: '[tuiResized]' }]
|
|
76
76
|
}] });
|
|
@@ -99,25 +99,18 @@ class TuiStuck {
|
|
|
99
99
|
constructor() {
|
|
100
100
|
this.stuck = toSignal(inject(WaIntersectionObserverService).pipe(map((entries) => (entries[entries.length - 1]?.intersectionRatio ?? 0) < 1), distinctUntilChanged(), tuiWatch(), catchError(() => EMPTY)));
|
|
101
101
|
}
|
|
102
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
103
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
102
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiStuck, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
103
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.19", type: TuiStuck, isStandalone: true, host: { properties: { "class._stuck": "stuck()" } }, providers: [
|
|
104
104
|
WaIntersectionObserverService,
|
|
105
|
-
{
|
|
106
|
-
provide: WA_INTERSECTION_THRESHOLD,
|
|
107
|
-
useValue: [0, 1],
|
|
108
|
-
},
|
|
105
|
+
{ provide: WA_INTERSECTION_THRESHOLD, useValue: [0, 1] },
|
|
109
106
|
], ngImport: i0 }); }
|
|
110
107
|
}
|
|
111
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
108
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiStuck, decorators: [{
|
|
112
109
|
type: Directive,
|
|
113
110
|
args: [{
|
|
114
|
-
selector: 'tui-stuck:never',
|
|
115
111
|
providers: [
|
|
116
112
|
WaIntersectionObserverService,
|
|
117
|
-
{
|
|
118
|
-
provide: WA_INTERSECTION_THRESHOLD,
|
|
119
|
-
useValue: [0, 1],
|
|
120
|
-
},
|
|
113
|
+
{ provide: WA_INTERSECTION_THRESHOLD, useValue: [0, 1] },
|
|
121
114
|
],
|
|
122
115
|
host: { '[class._stuck]': 'stuck()' },
|
|
123
116
|
}]
|
|
@@ -125,12 +118,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
|
|
|
125
118
|
|
|
126
119
|
const EMPTY_COMPARATOR = () => 0;
|
|
127
120
|
class Styles {
|
|
128
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
129
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
121
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: Styles, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
122
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: Styles, isStandalone: true, selector: "ng-component", exportAs: ["tui-table-5.0.0-canary.d205016"], ngImport: i0, template: '', isInline: true, styles: ["table[tuiTable]:where(*[data-tui-version=\"5.0.0-canary.d205016\"]){border-collapse:separate;border-spacing:0;isolation:isolate}table[tuiTable]:where(*[data-tui-version=\"5.0.0-canary.d205016\"]) [tuiCell]{padding:0}table[tuiTable]:where(*[data-tui-version=\"5.0.0-canary.d205016\"]) [tuiTitle]{white-space:nowrap}table[tuiTable]:where(*[data-tui-version=\"5.0.0-canary.d205016\"]) [tuiTitle] tui-icon{font-size:1rem}table[tuiTable]:where(*[data-tui-version=\"5.0.0-canary.d205016\"]) [tuiSubtitle]{color:var(--tui-text-secondary)}table[tuiTable]:where(*[data-tui-version=\"5.0.0-canary.d205016\"]) [tuiTh] [tuiCell],table[tuiTable]:where(*[data-tui-version=\"5.0.0-canary.d205016\"]) [tuiTh] [tuiTitle]{font:inherit;color:inherit}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
130
123
|
}
|
|
131
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
124
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: Styles, decorators: [{
|
|
132
125
|
type: Component,
|
|
133
|
-
args: [{ template: '', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush,
|
|
126
|
+
args: [{ template: '', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: `tui-table-${TUI_VERSION}`, styles: ["table[tuiTable]:where(*[data-tui-version=\"5.0.0-canary.d205016\"]){border-collapse:separate;border-spacing:0;isolation:isolate}table[tuiTable]:where(*[data-tui-version=\"5.0.0-canary.d205016\"]) [tuiCell]{padding:0}table[tuiTable]:where(*[data-tui-version=\"5.0.0-canary.d205016\"]) [tuiTitle]{white-space:nowrap}table[tuiTable]:where(*[data-tui-version=\"5.0.0-canary.d205016\"]) [tuiTitle] tui-icon{font-size:1rem}table[tuiTable]:where(*[data-tui-version=\"5.0.0-canary.d205016\"]) [tuiSubtitle]{color:var(--tui-text-secondary)}table[tuiTable]:where(*[data-tui-version=\"5.0.0-canary.d205016\"]) [tuiTh] [tuiCell],table[tuiTable]:where(*[data-tui-version=\"5.0.0-canary.d205016\"]) [tuiTh] [tuiTitle]{font:inherit;color:inherit}\n"] }]
|
|
134
127
|
}] });
|
|
135
128
|
class TuiTableDirective {
|
|
136
129
|
constructor() {
|
|
@@ -163,8 +156,8 @@ class TuiTableDirective {
|
|
|
163
156
|
this.sorter.set(sorter || EMPTY_COMPARATOR.bind({}));
|
|
164
157
|
this.direction.set(direction);
|
|
165
158
|
}
|
|
166
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
167
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.
|
|
159
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
160
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.19", type: TuiTableDirective, isStandalone: true, selector: "table[tuiTable]", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, sorter: { classPropertyName: "sorter", publicName: "sorter", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { direction: "directionChange", sorter: "sorterChange", sortChange: "sortChange" }, host: { attributes: { "tuiTable": "", "data-tui-version": "5.0.0-canary.d205016" }, properties: { "attr.data-size": "size()" } }, providers: [
|
|
168
161
|
{
|
|
169
162
|
provide: WA_INTERSECTION_ROOT_MARGIN,
|
|
170
163
|
useValue: '10000px 10000px 10000px 0px',
|
|
@@ -176,7 +169,7 @@ class TuiTableDirective {
|
|
|
176
169
|
tuiProgressOptionsProvider({ size: 's', color: 'var(--tui-text-action)' }),
|
|
177
170
|
], hostDirectives: [{ directive: TuiStuck }], ngImport: i0 }); }
|
|
178
171
|
}
|
|
179
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
172
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableDirective, decorators: [{
|
|
180
173
|
type: Directive,
|
|
181
174
|
args: [{
|
|
182
175
|
selector: 'table[tuiTable]',
|
|
@@ -194,6 +187,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
|
|
|
194
187
|
hostDirectives: [TuiStuck],
|
|
195
188
|
host: {
|
|
196
189
|
tuiTable: '',
|
|
190
|
+
'data-tui-version': TUI_VERSION,
|
|
197
191
|
'[attr.data-size]': 'size()',
|
|
198
192
|
},
|
|
199
193
|
}]
|
|
@@ -241,17 +235,17 @@ class TuiTableTh {
|
|
|
241
235
|
return (this.sorter() === this.table?.sorter() &&
|
|
242
236
|
this.table?.direction() === TuiSortDirection.Desc);
|
|
243
237
|
}
|
|
244
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
245
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
238
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableTh, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
239
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: TuiTableTh, isStandalone: true, selector: "th[tuiTh]", inputs: { minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, sorter: { classPropertyName: "sorter", publicName: "sorter", isSignal: true, isRequired: false, transformFunction: null }, resizable: { classPropertyName: "resizable", publicName: "resizable", isSignal: true, isRequired: false, transformFunction: null }, sticky: { classPropertyName: "sticky", publicName: "sticky", isSignal: true, isRequired: false, transformFunction: null }, requiredSort: { classPropertyName: "requiredSort", publicName: "requiredSort", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sorter: "sorterChange" }, host: { properties: { "style.min-width.px": "width() || minWidth()", "style.width.px": "width() || minWidth()", "style.max-width.px": "width() || maxWidth()", "class._sticky": "sticky()" } }, ngImport: i0, template: "@if (sorter() && table) {\n <button\n type=\"button\"\n class=\"t-sort\"\n [class.t-sort_sorted]=\"isCurrent\"\n (click)=\"updateSorterAndDirection()\"\n >\n <ng-container [ngTemplateOutlet]=\"content\" />\n <tui-icon\n class=\"t-icon\"\n [icon]=\"icon\"\n />\n </button>\n} @else {\n <ng-container [ngTemplateOutlet]=\"content\" />\n}\n<ng-template #content>\n <ng-content />\n</ng-template>\n@if (resizable()) {\n <div\n class=\"t-bar\"\n (tuiResized)=\"onResized($event)\"\n ></div>\n}\n", styles: [":host{transition-property:box-shadow;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:relative;inset-block-start:0;block-size:var(--tui-height-m);font:var(--tui-typography-body-s);text-align:start;font-weight:700;color:var(--tui-text-secondary);background:var(--tui-background-base);cursor:default;padding:0 .75rem;box-sizing:border-box;box-shadow:0 .3125rem #ededed00;border:1px solid var(--tui-border-normal)}:host:not(:first-child){border-inline-start:none}:host._sticky,:host-context(._stuck) :host._sticky{position:sticky;z-index:3000}:host._sticky:first-child,:host-context(._stuck) :host._sticky:first-child{inset-inline-start:0}:host._sticky:after,:host-context(._stuck) :host._sticky:after{transition-property:opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;content:\"\";position:absolute;inset-block-start:0;inset-inline-start:100%;inset-block-end:0;inline-size:.3125rem;pointer-events:none;background:#edededb3;opacity:0}:host-context(._stuck) :host{z-index:2000}:host-context(tr:not(:first-child)){border-block-start:none}:host-context(table[data-size=\"l\"]){block-size:var(--tui-height-l);font:var(--tui-typography-body-m);font-weight:700;padding:0 1rem}:host-context(table[data-size=\"s\"]){block-size:var(--tui-height-s);font:var(--tui-typography-body-s);font-weight:700;padding:0 .5rem}:host-context(thead[tuiThead]){position:sticky}:host-context(table._stuck)._sticky:after{opacity:1}:host-context(thead[tuiThead]._stuck){box-shadow:0 .3125rem #edededb3}:host-context([tuiTheme=\"dark\"])._sticky:after{background:#3c3c3ce6}:host-context([tuiTheme=\"dark\"] thead[tuiThead]._stuck){box-shadow:0 .3125rem #3c3c3ce6}:host-context([tuiTheme=\"dark\"] thead[tuiThead]._stuck):first-child{box-shadow:.0625rem .3125rem #3c3c3ce6}:host-context(table[data-size=\"l\"] thead[tuiThead] tr:nth-child(2)){inset-block-start:var(--tui-height-l)}:host-context(table[data-size=\"m\"] thead[tuiThead] tr:nth-child(2)){inset-block-start:var(--tui-height-m)}:host-context(table[data-size=\"s\"] thead[tuiThead] tr:nth-child(2)){inset-block-start:var(--tui-height-s)}.t-sort{transition-property:color;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;-webkit-appearance:none;appearance:none;padding:0;border:0;background:none;line-height:inherit;text-decoration:none;display:inline-flex;vertical-align:top;flex-direction:inherit;align-items:center;outline:none;font:inherit;text-transform:inherit;color:inherit;cursor:pointer}.t-sort_sorted{color:var(--tui-text-primary)}.t-sort:focus-visible{background:var(--tui-service-selection-background)}.t-sort:hover{color:var(--tui-text-primary)}.t-bar{transition-property:opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:absolute;inset-block-start:0;inset-block-end:0;inset-inline-end:-1px;inline-size:.1875rem;justify-self:flex-end;border-inline-start:2px solid transparent;background:var(--tui-status-warning);background-clip:content-box;cursor:ew-resize;opacity:0}.t-bar:hover,.t-bar:active{opacity:1}.t-icon:before{font-size:1rem}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: TuiIcon, selector: "tui-icon:not([tuiBadge])", inputs: ["background"] }, { kind: "directive", type: TuiTableResized, selector: "[tuiResized]", outputs: ["tuiResized"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
246
240
|
}
|
|
247
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
241
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableTh, decorators: [{
|
|
248
242
|
type: Component,
|
|
249
243
|
args: [{ selector: 'th[tuiTh]', imports: [NgTemplateOutlet, TuiIcon, TuiTableResized], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
250
244
|
'[style.min-width.px]': 'width() || minWidth()',
|
|
251
245
|
'[style.width.px]': 'width() || minWidth()',
|
|
252
246
|
'[style.max-width.px]': 'width() || maxWidth()',
|
|
253
247
|
'[class._sticky]': 'sticky()',
|
|
254
|
-
}, template: "@if (sorter() && table) {\n <button\n type=\"button\"\n class=\"t-sort\"\n [class.t-sort_sorted]=\"isCurrent\"\n (click)=\"updateSorterAndDirection()\"\n >\n <ng-container [ngTemplateOutlet]=\"content\" />\n <tui-icon\n class=\"t-icon\"\n [icon]=\"icon\"\n />\n </button>\n} @else {\n <ng-container [ngTemplateOutlet]=\"content\" />\n}\n<ng-template #content>\n <ng-content />\n</ng-template>\n@if (resizable()) {\n <div\n class=\"t-bar\"\n (tuiResized)=\"onResized($event)\"\n ></div>\n}\n", styles: [":host{transition-property:box-shadow;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:relative;
|
|
248
|
+
}, template: "@if (sorter() && table) {\n <button\n type=\"button\"\n class=\"t-sort\"\n [class.t-sort_sorted]=\"isCurrent\"\n (click)=\"updateSorterAndDirection()\"\n >\n <ng-container [ngTemplateOutlet]=\"content\" />\n <tui-icon\n class=\"t-icon\"\n [icon]=\"icon\"\n />\n </button>\n} @else {\n <ng-container [ngTemplateOutlet]=\"content\" />\n}\n<ng-template #content>\n <ng-content />\n</ng-template>\n@if (resizable()) {\n <div\n class=\"t-bar\"\n (tuiResized)=\"onResized($event)\"\n ></div>\n}\n", styles: [":host{transition-property:box-shadow;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:relative;inset-block-start:0;block-size:var(--tui-height-m);font:var(--tui-typography-body-s);text-align:start;font-weight:700;color:var(--tui-text-secondary);background:var(--tui-background-base);cursor:default;padding:0 .75rem;box-sizing:border-box;box-shadow:0 .3125rem #ededed00;border:1px solid var(--tui-border-normal)}:host:not(:first-child){border-inline-start:none}:host._sticky,:host-context(._stuck) :host._sticky{position:sticky;z-index:3000}:host._sticky:first-child,:host-context(._stuck) :host._sticky:first-child{inset-inline-start:0}:host._sticky:after,:host-context(._stuck) :host._sticky:after{transition-property:opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;content:\"\";position:absolute;inset-block-start:0;inset-inline-start:100%;inset-block-end:0;inline-size:.3125rem;pointer-events:none;background:#edededb3;opacity:0}:host-context(._stuck) :host{z-index:2000}:host-context(tr:not(:first-child)){border-block-start:none}:host-context(table[data-size=\"l\"]){block-size:var(--tui-height-l);font:var(--tui-typography-body-m);font-weight:700;padding:0 1rem}:host-context(table[data-size=\"s\"]){block-size:var(--tui-height-s);font:var(--tui-typography-body-s);font-weight:700;padding:0 .5rem}:host-context(thead[tuiThead]){position:sticky}:host-context(table._stuck)._sticky:after{opacity:1}:host-context(thead[tuiThead]._stuck){box-shadow:0 .3125rem #edededb3}:host-context([tuiTheme=\"dark\"])._sticky:after{background:#3c3c3ce6}:host-context([tuiTheme=\"dark\"] thead[tuiThead]._stuck){box-shadow:0 .3125rem #3c3c3ce6}:host-context([tuiTheme=\"dark\"] thead[tuiThead]._stuck):first-child{box-shadow:.0625rem .3125rem #3c3c3ce6}:host-context(table[data-size=\"l\"] thead[tuiThead] tr:nth-child(2)){inset-block-start:var(--tui-height-l)}:host-context(table[data-size=\"m\"] thead[tuiThead] tr:nth-child(2)){inset-block-start:var(--tui-height-m)}:host-context(table[data-size=\"s\"] thead[tuiThead] tr:nth-child(2)){inset-block-start:var(--tui-height-s)}.t-sort{transition-property:color;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;-webkit-appearance:none;appearance:none;padding:0;border:0;background:none;line-height:inherit;text-decoration:none;display:inline-flex;vertical-align:top;flex-direction:inherit;align-items:center;outline:none;font:inherit;text-transform:inherit;color:inherit;cursor:pointer}.t-sort_sorted{color:var(--tui-text-primary)}.t-sort:focus-visible{background:var(--tui-service-selection-background)}.t-sort:hover{color:var(--tui-text-primary)}.t-bar{transition-property:opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:absolute;inset-block-start:0;inset-block-end:0;inset-inline-end:-1px;inline-size:.1875rem;justify-self:flex-end;border-inline-start:2px solid transparent;background:var(--tui-status-warning);background-clip:content-box;cursor:ew-resize;opacity:0}.t-bar:hover,.t-bar:active{opacity:1}.t-icon:before{font-size:1rem}\n"] }]
|
|
255
249
|
}] });
|
|
256
250
|
class TuiTableSortKeyException extends Error {
|
|
257
251
|
constructor() {
|
|
@@ -286,10 +280,10 @@ class TuiTableSortable {
|
|
|
286
280
|
get match() {
|
|
287
281
|
return this.sortBy.tuiSortBy() === this.key;
|
|
288
282
|
}
|
|
289
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
290
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.
|
|
283
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableSortable, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
284
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.19", type: TuiTableSortable, isStandalone: true, selector: "th[tuiTh][tuiSortable]", inputs: { sortable: { classPropertyName: "sortable", publicName: "tuiSortable", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
|
|
291
285
|
}
|
|
292
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
286
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableSortable, decorators: [{
|
|
293
287
|
type: Directive,
|
|
294
288
|
args: [{ selector: 'th[tuiTh][tuiSortable]' }]
|
|
295
289
|
}] });
|
|
@@ -315,24 +309,24 @@ class TuiTableSortBy {
|
|
|
315
309
|
getKey(sorter) {
|
|
316
310
|
return this.sortables().find((s) => s.sorter() === sorter)?.key || null;
|
|
317
311
|
}
|
|
318
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
319
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "19.2.
|
|
312
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableSortBy, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
313
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "19.2.19", type: TuiTableSortBy, isStandalone: true, selector: "table[tuiTable][tuiSortBy]", inputs: { tuiSortBy: { classPropertyName: "tuiSortBy", publicName: "tuiSortBy", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { tuiSortChange: "tuiSortChange" }, queries: [{ propertyName: "sortables", predicate: TuiTableSortable, descendants: true, isSignal: true }], ngImport: i0 }); }
|
|
320
314
|
}
|
|
321
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
315
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableSortBy, decorators: [{
|
|
322
316
|
type: Directive,
|
|
323
317
|
args: [{ selector: 'table[tuiTable][tuiSortBy]' }]
|
|
324
318
|
}] });
|
|
325
319
|
|
|
326
320
|
class TuiTableThead {
|
|
327
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
328
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
321
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableThead, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
322
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.19", type: TuiTableThead, isStandalone: true, selector: "thead[tuiThead]", providers: [
|
|
329
323
|
{
|
|
330
324
|
provide: WA_INTERSECTION_ROOT_MARGIN,
|
|
331
325
|
useValue: '0px 10000px 10000px 10000px',
|
|
332
326
|
},
|
|
333
327
|
], hostDirectives: [{ directive: TuiStuck }], ngImport: i0 }); }
|
|
334
328
|
}
|
|
335
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
329
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableThead, decorators: [{
|
|
336
330
|
type: Directive,
|
|
337
331
|
args: [{
|
|
338
332
|
selector: 'thead[tuiThead]',
|
|
@@ -346,6 +340,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
|
|
|
346
340
|
}]
|
|
347
341
|
}] });
|
|
348
342
|
|
|
343
|
+
class TuiSorterPipe {
|
|
344
|
+
transform(key) {
|
|
345
|
+
return (a, b) => tuiDefaultSort(a[key], b[key]);
|
|
346
|
+
}
|
|
347
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiSorterPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
348
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.19", ngImport: i0, type: TuiSorterPipe, isStandalone: true, name: "tuiSorter" }); }
|
|
349
|
+
}
|
|
350
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiSorterPipe, decorators: [{
|
|
351
|
+
type: Pipe,
|
|
352
|
+
args: [{ name: 'tuiSorter' }]
|
|
353
|
+
}] });
|
|
354
|
+
|
|
349
355
|
class TuiTableSortPipe {
|
|
350
356
|
constructor() {
|
|
351
357
|
this.table = inject((TuiTableDirective));
|
|
@@ -356,10 +362,10 @@ class TuiTableSortPipe {
|
|
|
356
362
|
untracked(() => this.data.set(data ?? []));
|
|
357
363
|
return this.sorted();
|
|
358
364
|
}
|
|
359
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
360
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.
|
|
365
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableSortPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
366
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.19", ngImport: i0, type: TuiTableSortPipe, isStandalone: true, name: "tuiTableSort", pure: false }); }
|
|
361
367
|
}
|
|
362
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
368
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableSortPipe, decorators: [{
|
|
363
369
|
type: Pipe,
|
|
364
370
|
args: [{
|
|
365
371
|
name: 'tuiTableSort',
|
|
@@ -394,10 +400,10 @@ class TuiTableExpand {
|
|
|
394
400
|
el.style.removeProperty('display');
|
|
395
401
|
return height;
|
|
396
402
|
}
|
|
397
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
398
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.
|
|
403
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableExpand, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
404
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.19", type: TuiTableExpand, isStandalone: true, selector: "tui-table-expand", inputs: { expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expanded: "expandedChange" }, host: { attributes: { "ngSkipHydration": "true" }, listeners: { "tuiPresent": "visible$.next($event)" } }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, isSignal: true }], hostDirectives: [{ directive: i1.TuiPresent, outputs: ["tuiPresent", "tuiPresent"] }], ngImport: i0, template: "<div\n #content\n class=\"t-content\"\n [class.t-content_open]=\"expanded() && !transitioning()\"\n>\n <ng-content />\n</div>\n\n<div\n class=\"t-filler\"\n [class.t-filler_open]=\"expanded()\"\n [style.--t-height.px]=\"contentHeight()\"\n (animationcancel)=\"transitioning.set(false)\"\n (animationend)=\"transitioning.set(false)\"\n (animationstart)=\"transitioning.set(true)\"\n></div>\n", styles: ["@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes open{0%{block-size:0}to{block-size:var(--t-height)}}@keyframes close{0%{block-size:var(--t-height)}to{block-size:0}}:host{display:contents}:host:not(._visible){--tui-duration: 0ms}.t-content{display:none}.t-content_open{display:contents}.t-content_open ::ng-deep tr{animation:fade-in var(--tui-duration)}.t-filler{animation:close calc(var(--tui-duration) + 1ms)}.t-filler_open{animation:open calc(var(--tui-duration) + 1ms)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
399
405
|
}
|
|
400
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
406
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableExpand, decorators: [{
|
|
401
407
|
type: Component,
|
|
402
408
|
args: [{ selector: 'tui-table-expand', changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
|
|
403
409
|
{
|
|
@@ -415,12 +421,12 @@ class TuiTableTd {
|
|
|
415
421
|
this.control = contentChild((TuiControl));
|
|
416
422
|
this.textfield = contentChild((TuiTextfieldComponent));
|
|
417
423
|
}
|
|
418
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
419
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.
|
|
424
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableTd, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
425
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.2.19", type: TuiTableTd, isStandalone: true, selector: "th[tuiTd], td[tuiTd]", host: { properties: { "class._editable": "control() || textfield()" } }, queries: [{ propertyName: "control", first: true, predicate: (TuiControl), descendants: true, isSignal: true }, { propertyName: "textfield", first: true, predicate: (TuiTextfieldComponent), descendants: true, isSignal: true }], ngImport: i0, template: '<ng-content />', isInline: true, styles: [":host{transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:relative;text-align:start;background:var(--tui-background-base);border:1px solid var(--tui-border-normal);border-block-start:none;box-sizing:border-box}:host:first-child{inset-inline-start:0}:host:not(:first-child){border-inline-start:none}:host._editable{padding:0!important;vertical-align:top}:host(th){position:sticky;z-index:100}:host(th):after{transition-property:opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;content:\"\";position:absolute;inset-block-start:0;inset-block-end:0;inset-inline-start:100%;inline-size:.3125rem;pointer-events:none;background:#edededb3;opacity:0}:host(th):focus-within:not(:disabled){z-index:1100}:host-context([tuiTheme=\"dark\"]):after{background:#3c3c3ce6}:host-context(table._stuck){z-index:1000}:host-context(table._stuck):last-of-type:after{opacity:1}:host-context(table[data-size=\"l\"]){block-size:var(--tui-height-l);font:var(--tui-typography-body-m);padding:calc(1rem - 1px) 1rem 1rem}:host-context(table[data-size=\"m\"]){block-size:var(--tui-height-m);font:var(--tui-typography-body-s);padding:calc(.625rem - 1px) .75rem .625rem}:host-context(table[data-size=\"s\"]){block-size:var(--tui-height-s);font:var(--tui-typography-body-s);padding:calc(.25rem - 1px) .5rem .25rem}:host(td):focus-within{z-index:100!important}:host(td):not(:focus-within){z-index:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
420
426
|
}
|
|
421
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
427
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableTd, decorators: [{
|
|
422
428
|
type: Component,
|
|
423
|
-
args: [{ selector: 'th[tuiTd], td[tuiTd]', template: '<ng-content />', changeDetection: ChangeDetectionStrategy.OnPush, host: { '[class._editable]': 'control() || textfield()' }, styles: [":host{transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:relative;text-align:start;background:var(--tui-background-base);border:1px solid var(--tui-border-normal);border-block-start:none;box-sizing:border-box
|
|
429
|
+
args: [{ selector: 'th[tuiTd], td[tuiTd]', template: '<ng-content />', changeDetection: ChangeDetectionStrategy.OnPush, host: { '[class._editable]': 'control() || textfield()' }, styles: [":host{transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;position:relative;text-align:start;background:var(--tui-background-base);border:1px solid var(--tui-border-normal);border-block-start:none;box-sizing:border-box}:host:first-child{inset-inline-start:0}:host:not(:first-child){border-inline-start:none}:host._editable{padding:0!important;vertical-align:top}:host(th){position:sticky;z-index:100}:host(th):after{transition-property:opacity;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;content:\"\";position:absolute;inset-block-start:0;inset-block-end:0;inset-inline-start:100%;inline-size:.3125rem;pointer-events:none;background:#edededb3;opacity:0}:host(th):focus-within:not(:disabled){z-index:1100}:host-context([tuiTheme=\"dark\"]):after{background:#3c3c3ce6}:host-context(table._stuck){z-index:1000}:host-context(table._stuck):last-of-type:after{opacity:1}:host-context(table[data-size=\"l\"]){block-size:var(--tui-height-l);font:var(--tui-typography-body-m);padding:calc(1rem - 1px) 1rem 1rem}:host-context(table[data-size=\"m\"]){block-size:var(--tui-height-m);font:var(--tui-typography-body-s);padding:calc(.625rem - 1px) .75rem .625rem}:host-context(table[data-size=\"s\"]){block-size:var(--tui-height-s);font:var(--tui-typography-body-s);padding:calc(.25rem - 1px) .5rem .25rem}:host(td):focus-within{z-index:100!important}:host(td):not(:focus-within){z-index:0}\n"] }]
|
|
424
430
|
}] });
|
|
425
431
|
|
|
426
432
|
class TuiTableTr {
|
|
@@ -431,10 +437,10 @@ class TuiTableTr {
|
|
|
431
437
|
this.items = computed(() => this.cells().reduce((record, item) => ({ ...record, [item.tuiCell()]: item }), {}));
|
|
432
438
|
this.item = computed(() => this.body.data()[this.body.rows().findIndex((row) => row === this)]);
|
|
433
439
|
}
|
|
434
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
435
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
440
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableTr, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
441
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: TuiTableTr, isStandalone: true, selector: "tr[tuiTr]", queries: [{ propertyName: "cells", predicate: i0.forwardRef(() => TuiTableCell), isSignal: true }], ngImport: i0, template: "@if (items(); as items) {\n @for (key of table.columns(); track key) {\n <ng-container [ngTemplateOutlet]=\"(items[key] && items[key].template) || plain\">\n <ng-template #plain>\n <td tuiTd>\n {{ item()[key] }}\n </td>\n </ng-template>\n </ng-container>\n }\n} @else {\n <td></td>\n}\n<ng-content />\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: TuiTableTd, selector: "th[tuiTd], td[tuiTd]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
436
442
|
}
|
|
437
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
443
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableTr, decorators: [{
|
|
438
444
|
type: Component,
|
|
439
445
|
args: [{ selector: 'tr[tuiTr]', imports: [NgTemplateOutlet, TuiTableTd], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (items(); as items) {\n @for (key of table.columns(); track key) {\n <ng-container [ngTemplateOutlet]=\"(items[key] && items[key].template) || plain\">\n <ng-template #plain>\n <td tuiTd>\n {{ item()[key] }}\n </td>\n </ng-template>\n </ng-container>\n }\n} @else {\n <td></td>\n}\n<ng-content />\n" }]
|
|
440
446
|
}] });
|
|
@@ -454,12 +460,12 @@ class TuiTableTbody {
|
|
|
454
460
|
this.open.set(!this.open());
|
|
455
461
|
};
|
|
456
462
|
}
|
|
457
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
458
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
463
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableTbody, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
464
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: TuiTableTbody, isStandalone: true, selector: "tbody[tuiTbody]", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, heading: { classPropertyName: "heading", publicName: "heading", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange" }, queries: [{ propertyName: "rows", predicate: i0.forwardRef(() => TuiTableTr), isSignal: true }], ngImport: i0, template: "@if (heading()) {\n <tr>\n <th\n class=\"t-heading\"\n [colSpan]=\"table.columns().length\"\n >\n <button\n type=\"button\"\n class=\"t-expand\"\n (click)=\"onClick()\"\n >\n <span class=\"t-name\">\n <ng-container *polymorpheusOutlet=\"heading() as text\">\n {{ text }}\n </ng-container>\n </span>\n <tui-icon\n class=\"t-chevron\"\n [tuiChevron]=\"open()\"\n />\n </button>\n </th>\n </tr>\n}\n@if (open()) {\n <ng-content />\n}\n", styles: [":host{border-color:var(--tui-border-normal)}:host tr{border-color:inherit}.t-expand{-webkit-appearance:none;appearance:none;padding:0;border:0;background:none;font:inherit;line-height:inherit;text-decoration:none;display:flex;inline-size:100%;block-size:100%;align-items:center;box-sizing:border-box;outline:none;font-weight:700;cursor:pointer;border-color:inherit}.t-expand:focus-visible .t-name{background:var(--tui-service-selection-background)}.t-expand:before,.t-expand:after{content:\"\";position:sticky;block-size:100%;border-inline-start:1px solid;border-color:inherit}.t-expand:before{inset-inline-start:0}.t-expand:after{inset-inline-end:0}.t-heading{transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;block-size:var(--tui-height-m);font:var(--tui-typography-body-s);padding:0;background:var(--tui-background-neutral-1);border-block-end:1px solid var(--tui-border-normal);border-color:inherit}.t-heading:hover{background:var(--tui-background-neutral-1-hover)}:host-context(table[data-size=\"l\"]) .t-heading{font:var(--tui-typography-body-m);block-size:var(--tui-height-l)}.t-name{position:sticky;display:inline-block;inset-inline-start:.75rem}:host-context(table[data-size=\"l\"]) .t-name{inset-inline-start:1rem}.t-chevron{position:sticky;inset-inline-end:.75rem;margin:0 .6875rem 0 auto}\n"], dependencies: [{ kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "directive", type: TuiChevron, selector: "[tuiChevron]", inputs: ["tuiChevron"] }, { kind: "component", type: TuiIcon, selector: "tui-icon:not([tuiBadge])", inputs: ["background"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
459
465
|
}
|
|
460
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
466
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableTbody, decorators: [{
|
|
461
467
|
type: Component,
|
|
462
|
-
args: [{ selector: 'tbody[tuiTbody]', imports: [PolymorpheusOutlet, TuiChevron, TuiIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (heading()) {\n <tr>\n <th\n class=\"t-heading\"\n [colSpan]=\"table.columns().length\"\n >\n <button\n type=\"button\"\n class=\"t-expand\"\n (click)=\"onClick()\"\n >\n <span class=\"t-name\">\n <ng-container *polymorpheusOutlet=\"heading() as text\">\n {{ text }}\n </ng-container>\n </span>\n <tui-icon\n class=\"t-chevron\"\n [tuiChevron]=\"open()\"\n />\n </button>\n </th>\n </tr>\n}\n@if (open()) {\n <ng-content />\n}\n", styles: [":host{border-color:var(--tui-border-normal)}:host tr{border-color:inherit}.t-expand{-webkit-appearance:none;appearance:none;padding:0;border:0;background:none;font:inherit;line-height:inherit;text-decoration:none;display:flex;inline-size:100%;block-size:100%;align-items:center;box-sizing:border-box;outline:none;font-weight:700;cursor:pointer;border-color:inherit}.t-expand:focus-visible .t-name{background:var(--tui-service-selection-background)}.t-expand:before,.t-expand:after{content:\"\";position:sticky;block-size:100%;border-inline-start:1px solid;border-color:inherit}.t-expand:before{
|
|
468
|
+
args: [{ selector: 'tbody[tuiTbody]', imports: [PolymorpheusOutlet, TuiChevron, TuiIcon], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (heading()) {\n <tr>\n <th\n class=\"t-heading\"\n [colSpan]=\"table.columns().length\"\n >\n <button\n type=\"button\"\n class=\"t-expand\"\n (click)=\"onClick()\"\n >\n <span class=\"t-name\">\n <ng-container *polymorpheusOutlet=\"heading() as text\">\n {{ text }}\n </ng-container>\n </span>\n <tui-icon\n class=\"t-chevron\"\n [tuiChevron]=\"open()\"\n />\n </button>\n </th>\n </tr>\n}\n@if (open()) {\n <ng-content />\n}\n", styles: [":host{border-color:var(--tui-border-normal)}:host tr{border-color:inherit}.t-expand{-webkit-appearance:none;appearance:none;padding:0;border:0;background:none;font:inherit;line-height:inherit;text-decoration:none;display:flex;inline-size:100%;block-size:100%;align-items:center;box-sizing:border-box;outline:none;font-weight:700;cursor:pointer;border-color:inherit}.t-expand:focus-visible .t-name{background:var(--tui-service-selection-background)}.t-expand:before,.t-expand:after{content:\"\";position:sticky;block-size:100%;border-inline-start:1px solid;border-color:inherit}.t-expand:before{inset-inline-start:0}.t-expand:after{inset-inline-end:0}.t-heading{transition-property:background;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;block-size:var(--tui-height-m);font:var(--tui-typography-body-s);padding:0;background:var(--tui-background-neutral-1);border-block-end:1px solid var(--tui-border-normal);border-color:inherit}.t-heading:hover{background:var(--tui-background-neutral-1-hover)}:host-context(table[data-size=\"l\"]) .t-heading{font:var(--tui-typography-body-m);block-size:var(--tui-height-l)}.t-name{position:sticky;display:inline-block;inset-inline-start:.75rem}:host-context(table[data-size=\"l\"]) .t-name{inset-inline-start:1rem}.t-chevron{position:sticky;inset-inline-end:.75rem;margin:0 .6875rem 0 auto}\n"] }]
|
|
463
469
|
}] });
|
|
464
470
|
|
|
465
471
|
class TuiTableThGroup {
|
|
@@ -469,10 +475,10 @@ class TuiTableThGroup {
|
|
|
469
475
|
this.computedHeads = computed(() => this.heads().reduce((record, item) => ({ ...record, [item.tuiHead()]: item }), {}));
|
|
470
476
|
this.table = inject(forwardRef(() => TuiTableDirective));
|
|
471
477
|
}
|
|
472
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
473
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.
|
|
478
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableThGroup, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
479
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: TuiTableThGroup, isStandalone: true, selector: "tr[tuiThGroup]", queries: [{ propertyName: "th", first: true, predicate: i0.forwardRef(() => TuiTableTh), descendants: true, isSignal: true }, { propertyName: "heads", predicate: i0.forwardRef(() => TuiTableHead), isSignal: true }], ngImport: i0, template: "<ng-content />\n@if (computedHeads(); as headings) {\n @for (key of table.columns(); track key) {\n <ng-container\n [ngTemplateOutlet]=\"headings?.[key]?.template || plain\"\n [ngTemplateOutletContext]=\"{$implicit: key}\"\n />\n }\n <ng-template\n #plain\n let-key\n >\n @if (!th() && !heads().length) {\n <th tuiTh>\n {{ key.toString() }}\n </th>\n }\n </ng-template>\n}\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: TuiTableTh, selector: "th[tuiTh]", inputs: ["minWidth", "maxWidth", "sorter", "resizable", "sticky", "requiredSort"], outputs: ["sorterChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
474
480
|
}
|
|
475
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
481
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TuiTableThGroup, decorators: [{
|
|
476
482
|
type: Component,
|
|
477
483
|
args: [{ selector: 'tr[tuiThGroup]', imports: [NgTemplateOutlet, TuiTableTh], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content />\n@if (computedHeads(); as headings) {\n @for (key of table.columns(); track key) {\n <ng-container\n [ngTemplateOutlet]=\"headings?.[key]?.template || plain\"\n [ngTemplateOutletContext]=\"{$implicit: key}\"\n />\n }\n <ng-template\n #plain\n let-key\n >\n @if (!th() && !heads().length) {\n <th tuiTh>\n {{ key.toString() }}\n </th>\n }\n </ng-template>\n}\n" }]
|
|
478
484
|
}] });
|
|
@@ -491,6 +497,7 @@ const TuiTable = [
|
|
|
491
497
|
TuiTableSortable,
|
|
492
498
|
TuiTableThead,
|
|
493
499
|
TuiTableResized,
|
|
500
|
+
TuiSorterPipe,
|
|
494
501
|
TuiTableSortPipe,
|
|
495
502
|
TuiTableExpand,
|
|
496
503
|
];
|
|
@@ -499,5 +506,5 @@ const TuiTable = [
|
|
|
499
506
|
* Generated bundle index. Do not edit.
|
|
500
507
|
*/
|
|
501
508
|
|
|
502
|
-
export { TUI_TABLE_DEFAULT_OPTIONS, TUI_TABLE_OPTIONS, TuiSortDirection, TuiStuck, TuiTable, TuiTableCaption, TuiTableCell, TuiTableDirective, TuiTableExpand, TuiTableHead, TuiTableResized, TuiTableSortBy, TuiTableSortKeyException, TuiTableSortPipe, TuiTableSortable, TuiTableTbody, TuiTableTd, TuiTableTh, TuiTableThGroup, TuiTableThead, TuiTableTr, tuiTableOptionsProvider };
|
|
509
|
+
export { TUI_TABLE_DEFAULT_OPTIONS, TUI_TABLE_OPTIONS, TuiSortDirection, TuiSorterPipe, TuiStuck, TuiTable, TuiTableCaption, TuiTableCell, TuiTableDirective, TuiTableExpand, TuiTableHead, TuiTableResized, TuiTableSortBy, TuiTableSortKeyException, TuiTableSortPipe, TuiTableSortable, TuiTableTbody, TuiTableTd, TuiTableTh, TuiTableThGroup, TuiTableThead, TuiTableTr, tuiTableOptionsProvider };
|
|
503
510
|
//# sourceMappingURL=taiga-ui-addon-table-components-table.mjs.map
|