@jigisha_ruparel/taf-client-detail-angular 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -0,0 +1,168 @@
|
|
|
1
|
+
import * as i1 from '@angular/common';
|
|
2
|
+
import { CommonModule } from '@angular/common';
|
|
3
|
+
import * as i0 from '@angular/core';
|
|
4
|
+
import { Input, Directive, booleanAttribute, ContentChildren, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* Renders a field's value itself, instead of printing the string — for the rows that carry a
|
|
8
|
+
* control (a masked SSN with a reveal toggle, a link, a pill).
|
|
9
|
+
*
|
|
10
|
+
* ```html
|
|
11
|
+
* <ng-template tafDetailValue="ssn" let-field>…</ng-template>
|
|
12
|
+
* ```
|
|
13
|
+
*/
|
|
14
|
+
class TafDetailValueDirective {
|
|
15
|
+
template;
|
|
16
|
+
/** The `key` of the field this template renders. */
|
|
17
|
+
key = '';
|
|
18
|
+
constructor(template) {
|
|
19
|
+
this.template = template;
|
|
20
|
+
}
|
|
21
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: TafDetailValueDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
22
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.5", type: TafDetailValueDirective, isStandalone: true, selector: "ng-template[tafDetailValue]", inputs: { key: ["tafDetailValue", "key"] }, ngImport: i0 });
|
|
23
|
+
}
|
|
24
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: TafDetailValueDirective, decorators: [{
|
|
25
|
+
type: Directive,
|
|
26
|
+
args: [{ selector: 'ng-template[tafDetailValue]', standalone: true }]
|
|
27
|
+
}], ctorParameters: () => [{ type: i0.TemplateRef }], propDecorators: { key: [{
|
|
28
|
+
type: Input,
|
|
29
|
+
args: ['tafDetailValue']
|
|
30
|
+
}] } });
|
|
31
|
+
/**
|
|
32
|
+
* `<taf-detail>` — the read-only field list a record's detail view is made of: label on one side,
|
|
33
|
+
* value on the other, in one or more columns, optionally grouped under section titles.
|
|
34
|
+
*
|
|
35
|
+
* Every detail screen hand-rolls this, usually as a one-off `field-row` component repeated a few
|
|
36
|
+
* dozen times. Declaring the fields as data instead means a section is a list, not markup — and the
|
|
37
|
+
* rows that genuinely need a control keep one, through a `tafDetailValue` template keyed by field.
|
|
38
|
+
*
|
|
39
|
+
* Empty values print `emptyText` ("—") rather than collapsing the row, because in a clinical record
|
|
40
|
+
* "we don't hold this" and "this row doesn't exist" are different statements. `hideEmpty` opts into
|
|
41
|
+
* dropping them where that distinction doesn't matter.
|
|
42
|
+
*
|
|
43
|
+
* Ships NO theme — `taf-detail__*` class hooks only.
|
|
44
|
+
*/
|
|
45
|
+
class TafDetailComponent {
|
|
46
|
+
valueTemplates;
|
|
47
|
+
/** A flat field list — the common case. Ignored when `sections` is given. */
|
|
48
|
+
fields = [];
|
|
49
|
+
/** Titled groups, for a panel that shows several. */
|
|
50
|
+
sections = [];
|
|
51
|
+
/** A column count, or a CSS track list for uneven columns. */
|
|
52
|
+
columns = 1;
|
|
53
|
+
/** What an empty value prints. */
|
|
54
|
+
emptyText = '—';
|
|
55
|
+
/** Drop rows with no value instead of printing `emptyText`. */
|
|
56
|
+
hideEmpty = false;
|
|
57
|
+
/** Tighter rows, for a panel that shows many fields at once. */
|
|
58
|
+
dense = false;
|
|
59
|
+
get sectionList() {
|
|
60
|
+
return this.sections.length ? this.sections : [{ fields: this.fields }];
|
|
61
|
+
}
|
|
62
|
+
shown(fields) {
|
|
63
|
+
if (!this.hideEmpty)
|
|
64
|
+
return fields;
|
|
65
|
+
return fields.filter((f) => f.value !== undefined && f.value !== null && f.value !== '');
|
|
66
|
+
}
|
|
67
|
+
tracks(columns) {
|
|
68
|
+
return typeof columns === 'number' ? `repeat(${columns}, minmax(0, 1fr))` : columns;
|
|
69
|
+
}
|
|
70
|
+
text(f) {
|
|
71
|
+
return f.value === undefined || f.value === null || f.value === '' ? this.emptyText : String(f.value);
|
|
72
|
+
}
|
|
73
|
+
templateFor(f) {
|
|
74
|
+
if (!f.key || !this.valueTemplates)
|
|
75
|
+
return null;
|
|
76
|
+
return this.valueTemplates.find((t) => t.key === f.key)?.template ?? null;
|
|
77
|
+
}
|
|
78
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: TafDetailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
79
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.5", type: TafDetailComponent, isStandalone: true, selector: "taf-detail", inputs: { fields: "fields", sections: "sections", columns: "columns", emptyText: "emptyText", hideEmpty: ["hideEmpty", "hideEmpty", booleanAttribute], dense: ["dense", "dense", booleanAttribute] }, queries: [{ propertyName: "valueTemplates", predicate: TafDetailValueDirective }], ngImport: i0, template: `
|
|
80
|
+
<div class="taf-detail" [attr.data-dense]="dense ? '' : null">
|
|
81
|
+
<ng-container *ngFor="let s of sectionList">
|
|
82
|
+
<div class="taf-detail__section">
|
|
83
|
+
<p class="taf-detail__section-title" *ngIf="s.title">{{ s.title }}</p>
|
|
84
|
+
<dl class="taf-detail__fields" [style.grid-template-columns]="tracks(s.columns ?? columns)">
|
|
85
|
+
<ng-container *ngFor="let f of shown(s.fields)">
|
|
86
|
+
<div
|
|
87
|
+
class="taf-detail__row"
|
|
88
|
+
[style.grid-column]="f.span && f.span > 1 ? 'span ' + f.span : null"
|
|
89
|
+
[attr.data-key]="f.key || null"
|
|
90
|
+
>
|
|
91
|
+
<dt class="taf-detail__label">{{ f.label }}</dt>
|
|
92
|
+
<dd class="taf-detail__value" [attr.title]="f.hint || null">
|
|
93
|
+
<ng-container
|
|
94
|
+
*ngIf="templateFor(f) as tpl; else plain"
|
|
95
|
+
[ngTemplateOutlet]="tpl"
|
|
96
|
+
[ngTemplateOutletContext]="{ $implicit: f }"
|
|
97
|
+
></ng-container>
|
|
98
|
+
<ng-template #plain>{{ text(f) }}</ng-template>
|
|
99
|
+
</dd>
|
|
100
|
+
</div>
|
|
101
|
+
</ng-container>
|
|
102
|
+
</dl>
|
|
103
|
+
</div>
|
|
104
|
+
</ng-container>
|
|
105
|
+
</div>
|
|
106
|
+
`, isInline: true, styles: ["taf-detail{display:contents}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
107
|
+
}
|
|
108
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: TafDetailComponent, decorators: [{
|
|
109
|
+
type: Component,
|
|
110
|
+
args: [{ selector: 'taf-detail', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: `
|
|
111
|
+
<div class="taf-detail" [attr.data-dense]="dense ? '' : null">
|
|
112
|
+
<ng-container *ngFor="let s of sectionList">
|
|
113
|
+
<div class="taf-detail__section">
|
|
114
|
+
<p class="taf-detail__section-title" *ngIf="s.title">{{ s.title }}</p>
|
|
115
|
+
<dl class="taf-detail__fields" [style.grid-template-columns]="tracks(s.columns ?? columns)">
|
|
116
|
+
<ng-container *ngFor="let f of shown(s.fields)">
|
|
117
|
+
<div
|
|
118
|
+
class="taf-detail__row"
|
|
119
|
+
[style.grid-column]="f.span && f.span > 1 ? 'span ' + f.span : null"
|
|
120
|
+
[attr.data-key]="f.key || null"
|
|
121
|
+
>
|
|
122
|
+
<dt class="taf-detail__label">{{ f.label }}</dt>
|
|
123
|
+
<dd class="taf-detail__value" [attr.title]="f.hint || null">
|
|
124
|
+
<ng-container
|
|
125
|
+
*ngIf="templateFor(f) as tpl; else plain"
|
|
126
|
+
[ngTemplateOutlet]="tpl"
|
|
127
|
+
[ngTemplateOutletContext]="{ $implicit: f }"
|
|
128
|
+
></ng-container>
|
|
129
|
+
<ng-template #plain>{{ text(f) }}</ng-template>
|
|
130
|
+
</dd>
|
|
131
|
+
</div>
|
|
132
|
+
</ng-container>
|
|
133
|
+
</dl>
|
|
134
|
+
</div>
|
|
135
|
+
</ng-container>
|
|
136
|
+
</div>
|
|
137
|
+
`, styles: ["taf-detail{display:contents}\n"] }]
|
|
138
|
+
}], propDecorators: { valueTemplates: [{
|
|
139
|
+
type: ContentChildren,
|
|
140
|
+
args: [TafDetailValueDirective]
|
|
141
|
+
}], fields: [{
|
|
142
|
+
type: Input
|
|
143
|
+
}], sections: [{
|
|
144
|
+
type: Input
|
|
145
|
+
}], columns: [{
|
|
146
|
+
type: Input
|
|
147
|
+
}], emptyText: [{
|
|
148
|
+
type: Input
|
|
149
|
+
}], hideEmpty: [{
|
|
150
|
+
type: Input,
|
|
151
|
+
args: [{ transform: booleanAttribute }]
|
|
152
|
+
}], dense: [{
|
|
153
|
+
type: Input,
|
|
154
|
+
args: [{ transform: booleanAttribute }]
|
|
155
|
+
}] } });
|
|
156
|
+
/**
|
|
157
|
+
* Everything `<taf-detail>` needs, in one import: `imports: [...TAF_DETAIL]`.
|
|
158
|
+
* Importing the component alone makes every `tafDetailValue` template inert — the field falls back
|
|
159
|
+
* to printing its string, with no error.
|
|
160
|
+
*/
|
|
161
|
+
const TAF_DETAIL = [TafDetailComponent, TafDetailValueDirective];
|
|
162
|
+
|
|
163
|
+
/**
|
|
164
|
+
* Generated bundle index. Do not edit.
|
|
165
|
+
*/
|
|
166
|
+
|
|
167
|
+
export { TAF_DETAIL, TafDetailComponent, TafDetailValueDirective };
|
|
168
|
+
//# sourceMappingURL=jigisha_ruparel-taf-client-detail-angular.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"jigisha_ruparel-taf-client-detail-angular.mjs","sources":["../../src/taf-detail.component.ts","../../src/jigisha_ruparel-taf-client-detail-angular.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport {\n ChangeDetectionStrategy,\n Component,\n ContentChildren,\n Directive,\n Input,\n QueryList,\n TemplateRef,\n booleanAttribute,\n} from '@angular/core';\n\n/** One label/value row. `key` is only needed when a template overrides this row's value. */\nexport interface TafDetailField {\n label: string;\n value?: string | number | null;\n key?: string;\n /** A title attribute, where the value is long or abbreviated. */\n hint?: string;\n /** How many columns this row spans in a multi-column layout. */\n span?: number;\n}\n\n/** A titled group of fields. */\nexport interface TafDetailSection {\n title?: string;\n fields: readonly TafDetailField[];\n /** Columns for this section only; the component's own `columns` otherwise. */\n columns?: number | string;\n}\n\n/**\n * Renders a field's value itself, instead of printing the string — for the rows that carry a\n * control (a masked SSN with a reveal toggle, a link, a pill).\n *\n * ```html\n * <ng-template tafDetailValue=\"ssn\" let-field>…</ng-template>\n * ```\n */\n@Directive({ selector: 'ng-template[tafDetailValue]', standalone: true })\nexport class TafDetailValueDirective {\n /** The `key` of the field this template renders. */\n @Input('tafDetailValue') key = '';\n constructor(readonly template: TemplateRef<{ $implicit: TafDetailField }>) {}\n}\n\n/**\n * `<taf-detail>` — the read-only field list a record's detail view is made of: label on one side,\n * value on the other, in one or more columns, optionally grouped under section titles.\n *\n * Every detail screen hand-rolls this, usually as a one-off `field-row` component repeated a few\n * dozen times. Declaring the fields as data instead means a section is a list, not markup — and the\n * rows that genuinely need a control keep one, through a `tafDetailValue` template keyed by field.\n *\n * Empty values print `emptyText` (\"—\") rather than collapsing the row, because in a clinical record\n * \"we don't hold this\" and \"this row doesn't exist\" are different statements. `hideEmpty` opts into\n * dropping them where that distinction doesn't matter.\n *\n * Ships NO theme — `taf-detail__*` class hooks only.\n */\n@Component({\n selector: 'taf-detail',\n standalone: true,\n imports: [CommonModule],\n changeDetection: ChangeDetectionStrategy.OnPush,\n template: `\n <div class=\"taf-detail\" [attr.data-dense]=\"dense ? '' : null\">\n <ng-container *ngFor=\"let s of sectionList\">\n <div class=\"taf-detail__section\">\n <p class=\"taf-detail__section-title\" *ngIf=\"s.title\">{{ s.title }}</p>\n <dl class=\"taf-detail__fields\" [style.grid-template-columns]=\"tracks(s.columns ?? columns)\">\n <ng-container *ngFor=\"let f of shown(s.fields)\">\n <div\n class=\"taf-detail__row\"\n [style.grid-column]=\"f.span && f.span > 1 ? 'span ' + f.span : null\"\n [attr.data-key]=\"f.key || null\"\n >\n <dt class=\"taf-detail__label\">{{ f.label }}</dt>\n <dd class=\"taf-detail__value\" [attr.title]=\"f.hint || null\">\n <ng-container\n *ngIf=\"templateFor(f) as tpl; else plain\"\n [ngTemplateOutlet]=\"tpl\"\n [ngTemplateOutletContext]=\"{ $implicit: f }\"\n ></ng-container>\n <ng-template #plain>{{ text(f) }}</ng-template>\n </dd>\n </div>\n </ng-container>\n </dl>\n </div>\n </ng-container>\n </div>\n `,\n styles: [\n `\n taf-detail { display: contents; }\n `,\n ],\n})\nexport class TafDetailComponent {\n @ContentChildren(TafDetailValueDirective) valueTemplates?: QueryList<TafDetailValueDirective>;\n\n /** A flat field list — the common case. Ignored when `sections` is given. */\n @Input() fields: readonly TafDetailField[] = [];\n /** Titled groups, for a panel that shows several. */\n @Input() sections: readonly TafDetailSection[] = [];\n /** A column count, or a CSS track list for uneven columns. */\n @Input() columns: number | string = 1;\n /** What an empty value prints. */\n @Input() emptyText = '—';\n /** Drop rows with no value instead of printing `emptyText`. */\n @Input({ transform: booleanAttribute }) hideEmpty = false;\n /** Tighter rows, for a panel that shows many fields at once. */\n @Input({ transform: booleanAttribute }) dense = false;\n\n get sectionList(): readonly TafDetailSection[] {\n return this.sections.length ? this.sections : [{ fields: this.fields }];\n }\n\n protected shown(fields: readonly TafDetailField[]): readonly TafDetailField[] {\n if (!this.hideEmpty) return fields;\n return fields.filter((f) => f.value !== undefined && f.value !== null && f.value !== '');\n }\n\n protected tracks(columns: number | string): string {\n return typeof columns === 'number' ? `repeat(${columns}, minmax(0, 1fr))` : columns;\n }\n\n protected text(f: TafDetailField): string {\n return f.value === undefined || f.value === null || f.value === '' ? this.emptyText : String(f.value);\n }\n\n protected templateFor(f: TafDetailField): TemplateRef<{ $implicit: TafDetailField }> | null {\n if (!f.key || !this.valueTemplates) return null;\n return this.valueTemplates.find((t) => t.key === f.key)?.template ?? null;\n }\n}\n\n/**\n * Everything `<taf-detail>` needs, in one import: `imports: [...TAF_DETAIL]`.\n * Importing the component alone makes every `tafDetailValue` template inert — the field falls back\n * to printing its string, with no error.\n */\nexport const TAF_DETAIL = [TafDetailComponent, TafDetailValueDirective] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
package/package.json
ADDED
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@jigisha_ruparel/taf-client-detail-angular",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"description": "<taf-detail> — the themeless read-only field list a record detail view is made of: labels, values, columns, sections.",
|
|
5
|
+
"publishConfig": {
|
|
6
|
+
"access": "public",
|
|
7
|
+
"directory": "dist"
|
|
8
|
+
},
|
|
9
|
+
"peerDependencies": {
|
|
10
|
+
"@angular/core": ">=17",
|
|
11
|
+
"@angular/common": ">=17"
|
|
12
|
+
},
|
|
13
|
+
"dependencies": {
|
|
14
|
+
"tslib": "^2.3.0"
|
|
15
|
+
},
|
|
16
|
+
"module": "fesm2022/jigisha_ruparel-taf-client-detail-angular.mjs",
|
|
17
|
+
"typings": "types/jigisha_ruparel-taf-client-detail-angular.d.ts",
|
|
18
|
+
"exports": {
|
|
19
|
+
"./package.json": {
|
|
20
|
+
"default": "./package.json"
|
|
21
|
+
},
|
|
22
|
+
".": {
|
|
23
|
+
"types": "./types/jigisha_ruparel-taf-client-detail-angular.d.ts",
|
|
24
|
+
"default": "./fesm2022/jigisha_ruparel-taf-client-detail-angular.mjs"
|
|
25
|
+
}
|
|
26
|
+
},
|
|
27
|
+
"sideEffects": false,
|
|
28
|
+
"type": "module"
|
|
29
|
+
}
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { QueryList, TemplateRef } from '@angular/core';
|
|
3
|
+
|
|
4
|
+
/** One label/value row. `key` is only needed when a template overrides this row's value. */
|
|
5
|
+
interface TafDetailField {
|
|
6
|
+
label: string;
|
|
7
|
+
value?: string | number | null;
|
|
8
|
+
key?: string;
|
|
9
|
+
/** A title attribute, where the value is long or abbreviated. */
|
|
10
|
+
hint?: string;
|
|
11
|
+
/** How many columns this row spans in a multi-column layout. */
|
|
12
|
+
span?: number;
|
|
13
|
+
}
|
|
14
|
+
/** A titled group of fields. */
|
|
15
|
+
interface TafDetailSection {
|
|
16
|
+
title?: string;
|
|
17
|
+
fields: readonly TafDetailField[];
|
|
18
|
+
/** Columns for this section only; the component's own `columns` otherwise. */
|
|
19
|
+
columns?: number | string;
|
|
20
|
+
}
|
|
21
|
+
/**
|
|
22
|
+
* Renders a field's value itself, instead of printing the string — for the rows that carry a
|
|
23
|
+
* control (a masked SSN with a reveal toggle, a link, a pill).
|
|
24
|
+
*
|
|
25
|
+
* ```html
|
|
26
|
+
* <ng-template tafDetailValue="ssn" let-field>…</ng-template>
|
|
27
|
+
* ```
|
|
28
|
+
*/
|
|
29
|
+
declare class TafDetailValueDirective {
|
|
30
|
+
readonly template: TemplateRef<{
|
|
31
|
+
$implicit: TafDetailField;
|
|
32
|
+
}>;
|
|
33
|
+
/** The `key` of the field this template renders. */
|
|
34
|
+
key: string;
|
|
35
|
+
constructor(template: TemplateRef<{
|
|
36
|
+
$implicit: TafDetailField;
|
|
37
|
+
}>);
|
|
38
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<TafDetailValueDirective, never>;
|
|
39
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<TafDetailValueDirective, "ng-template[tafDetailValue]", never, { "key": { "alias": "tafDetailValue"; "required": false; }; }, {}, never, never, true, never>;
|
|
40
|
+
}
|
|
41
|
+
/**
|
|
42
|
+
* `<taf-detail>` — the read-only field list a record's detail view is made of: label on one side,
|
|
43
|
+
* value on the other, in one or more columns, optionally grouped under section titles.
|
|
44
|
+
*
|
|
45
|
+
* Every detail screen hand-rolls this, usually as a one-off `field-row` component repeated a few
|
|
46
|
+
* dozen times. Declaring the fields as data instead means a section is a list, not markup — and the
|
|
47
|
+
* rows that genuinely need a control keep one, through a `tafDetailValue` template keyed by field.
|
|
48
|
+
*
|
|
49
|
+
* Empty values print `emptyText` ("—") rather than collapsing the row, because in a clinical record
|
|
50
|
+
* "we don't hold this" and "this row doesn't exist" are different statements. `hideEmpty` opts into
|
|
51
|
+
* dropping them where that distinction doesn't matter.
|
|
52
|
+
*
|
|
53
|
+
* Ships NO theme — `taf-detail__*` class hooks only.
|
|
54
|
+
*/
|
|
55
|
+
declare class TafDetailComponent {
|
|
56
|
+
valueTemplates?: QueryList<TafDetailValueDirective>;
|
|
57
|
+
/** A flat field list — the common case. Ignored when `sections` is given. */
|
|
58
|
+
fields: readonly TafDetailField[];
|
|
59
|
+
/** Titled groups, for a panel that shows several. */
|
|
60
|
+
sections: readonly TafDetailSection[];
|
|
61
|
+
/** A column count, or a CSS track list for uneven columns. */
|
|
62
|
+
columns: number | string;
|
|
63
|
+
/** What an empty value prints. */
|
|
64
|
+
emptyText: string;
|
|
65
|
+
/** Drop rows with no value instead of printing `emptyText`. */
|
|
66
|
+
hideEmpty: boolean;
|
|
67
|
+
/** Tighter rows, for a panel that shows many fields at once. */
|
|
68
|
+
dense: boolean;
|
|
69
|
+
get sectionList(): readonly TafDetailSection[];
|
|
70
|
+
protected shown(fields: readonly TafDetailField[]): readonly TafDetailField[];
|
|
71
|
+
protected tracks(columns: number | string): string;
|
|
72
|
+
protected text(f: TafDetailField): string;
|
|
73
|
+
protected templateFor(f: TafDetailField): TemplateRef<{
|
|
74
|
+
$implicit: TafDetailField;
|
|
75
|
+
}> | null;
|
|
76
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<TafDetailComponent, never>;
|
|
77
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<TafDetailComponent, "taf-detail", never, { "fields": { "alias": "fields"; "required": false; }; "sections": { "alias": "sections"; "required": false; }; "columns": { "alias": "columns"; "required": false; }; "emptyText": { "alias": "emptyText"; "required": false; }; "hideEmpty": { "alias": "hideEmpty"; "required": false; }; "dense": { "alias": "dense"; "required": false; }; }, {}, ["valueTemplates"], never, true, never>;
|
|
78
|
+
static ngAcceptInputType_hideEmpty: unknown;
|
|
79
|
+
static ngAcceptInputType_dense: unknown;
|
|
80
|
+
}
|
|
81
|
+
/**
|
|
82
|
+
* Everything `<taf-detail>` needs, in one import: `imports: [...TAF_DETAIL]`.
|
|
83
|
+
* Importing the component alone makes every `tafDetailValue` template inert — the field falls back
|
|
84
|
+
* to printing its string, with no error.
|
|
85
|
+
*/
|
|
86
|
+
declare const TAF_DETAIL: readonly [typeof TafDetailComponent, typeof TafDetailValueDirective];
|
|
87
|
+
|
|
88
|
+
export { TAF_DETAIL, TafDetailComponent, TafDetailValueDirective };
|
|
89
|
+
export type { TafDetailField, TafDetailSection };
|