/
api-docs.component.html
122 lines (118 loc) · 4.1 KB
/
api-docs.component.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
<div class="api-doc-component" [class.deprecated]="apiDocs.deprecated">
<h3 [id]="apiDocs.className">
<a routerLink="." [fragment]="apiDocs.className" ngbdFragment title="Anchor link to: {{ apiDocs.className }}">
<i class="bi bi-link-45deg" style="font-size: 1.75rem; color: black"></i>
</a>
{{ apiDocs.className }}
<a
class="github-link"
(click)="trackSourceClick()"
href="https://github.com/ng-bootstrap/ng-bootstrap/tree/master/{{ apiDocs.fileName }}"
target="_blank"
title="Link to Github: {{ apiDocs.className }}"
>
<i class="bi bi-github" style="font-size: 1.5rem; color: black"></i>
</a>
</h3>
<ngbd-api-docs-badge
[type]="apiDocs.type"
[deprecated]="apiDocs.deprecated"
[since]="apiDocs.since"
></ngbd-api-docs-badge>
<p *ngIf="apiDocs.deprecated">{{ apiDocs.deprecated.description }}</p>
<p class="lead" [innerHTML]="apiDocs.description"></p>
<section>
<h4>
Selector: <code class="selector">{{ apiDocs.selector }}</code>
</h4>
<h6 *ngIf="apiDocs.exportAs">
Exported as: <code class="export-as">{{ apiDocs.exportAs }}</code>
</h6>
</section>
<ng-template [ngIf]="apiDocs.inputs.length">
<section>
<h4>Inputs</h4>
<table class="table table-sm">
<tbody>
<tr *ngFor="let input of apiDocs.inputs" [class.deprecated]="input.deprecated">
<td class="label-cell">
<code>{{ input.name }}</code
><br />
<span *ngIf="input.since" class="badge bg-info text-dark">since {{ input.since.version }}</span
>&ngsp;
<span *ngIf="input.deprecated" class="badge bg-secondary">deprecated {{ input.deprecated.version }}</span>
</td>
<td class="content-cell">
<p *ngIf="input.deprecated">{{ input.deprecated.description }}</p>
<p class="description" [innerHTML]="input.description"></p>
<div class="meta">
<div>
<i>Type: </i><code>{{ input.type }}</code>
</div>
<div *ngIf="defaultInputValue(input) || hasConfigProperty(input)">
<span
><i>Default value: </i><code>{{ defaultInputValue(input) || '-' }}</code></span
>&ngsp;
<span *ngIf="hasConfigProperty(input)">— initialized from {{ configServiceName }} service</span>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</section>
</ng-template>
<ng-template [ngIf]="apiDocs.outputs.length">
<section>
<h4>Outputs</h4>
<table class="table table-sm">
<tbody>
<tr *ngFor="let output of apiDocs.outputs" [class.deprecated]="output.deprecated">
<td class="label-cell">
<code>{{ output.name }}</code
><br />
<span *ngIf="output.since" class="badge bg-info text-dark">since {{ output.since.version }}</span
>&ngsp;
<span *ngIf="output.deprecated" class="badge bg-secondary"
>deprecated {{ output.deprecated.version }}</span
>
</td>
<td class="content-cell">
<p *ngIf="output.deprecated">{{ output.deprecated.description }}</p>
<p class="description" [innerHTML]="output.description"></p>
</td>
</tr>
</tbody>
</table>
</section>
</ng-template>
<ng-template [ngIf]="apiDocs.methods.length && apiDocs.exportAs">
<section>
<h4>Methods</h4>
<table class="table table-sm">
<tbody>
<tr *ngFor="let method of apiDocs.methods" [class.deprecated]="method.deprecated">
<td class="label-cell">
<code>{{ method.name }}</code
><br />
<span *ngIf="method.since" class="badge bg-info text-dark">since {{ method.since.version }}</span
>&ngsp;
<span *ngIf="method.deprecated" class="badge bg-secondary"
>deprecated {{ method.deprecated.version }}</span
>
</td>
<td class="content-cell">
<p class="signature">
<code>{{ methodSignature(method) }}</code
>&ngsp;
<small class="text-muted" title="Return type">=> {{ method.returnType }}</small>
</p>
<p *ngIf="method.deprecated">{{ method.deprecated.description }}</p>
<p class="description" [innerHTML]="method.description"></p>
</td>
</tr>
</tbody>
</table>
</section>
</ng-template>
</div>