Skip to content

Commit 3ec0117

Browse files
mistrykaran91mistrykaran91
committed
refactor(dgeni): streamline directive and component metadata handling
Currently, docs is not grouped based on Components and Directives. This fix will separate those two sections. Fixes angular#24093
1 parent dc70692 commit 3ec0117

9 files changed

+69
-43
lines changed

‎tools/dgeni/common/decorators.ts

+10-6
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,11 @@ export function isProperty(doc: MemberDoc): boolean {
3030
}
3131

3232
export function isDirective(doc: ClassExportDoc): boolean {
33-
return hasClassDecorator(doc, 'Component') || hasClassDecorator(doc, 'Directive');
33+
return hasClassDecorator(doc, 'Directive');
34+
}
35+
36+
export function isComponent(doc: ClassExportDoc): boolean {
37+
return hasClassDecorator(doc, 'Component');
3438
}
3539

3640
export function isService(doc: ClassExportDoc): boolean {
@@ -50,12 +54,12 @@ export function isPrimaryExportDoc(doc: ApiDoc): boolean {
5054
return hasJsDocTag(doc, 'docs-primary-export');
5155
}
5256

53-
export function getDirectiveSelectors(classDoc: CategorizedClassDoc): string[] | undefined {
54-
if (classDoc.directiveMetadata) {
55-
const directiveSelectors: string = classDoc.directiveMetadata.get('selector');
57+
export function getSelectors(classDoc: CategorizedClassDoc): string[] | undefined {
58+
if (classDoc.metadata) {
59+
const selectors: string = classDoc.metadata.get('selector');
5660

57-
if (directiveSelectors) {
58-
return directiveSelectors
61+
if (selectors) {
62+
return selectors
5963
.replace(/[\r\n]/g, '')
6064
.split(/\s*,\s*/)
6165
.filter(s => s !== '');

‎tools/dgeni/common/dgeni-definitions.ts

+8-7
Original file line numberDiff line numberDiff line change
@@ -29,23 +29,24 @@ export interface CategorizedClassLikeDoc extends ClassLikeExportDoc, Deprecation
2929
/** Extended Dgeni class document that includes extracted Angular metadata. */
3030
export interface CategorizedClassDoc extends ClassExportDoc, CategorizedClassLikeDoc {
3131
isDirective: boolean;
32+
isComponent: boolean;
3233
isService: boolean;
3334
isNgModule: boolean;
3435
isTestHarness: boolean;
35-
directiveExportAs?: string | null;
36-
directiveSelectors?: string[];
37-
directiveMetadata: Map<string, any> | null;
36+
exportAs?: string | null;
37+
selectors?: string[];
38+
metadata: Map<string, any> | null;
3839
extendedDoc: ClassLikeExportDoc | undefined;
3940
inheritedDocs: ClassLikeExportDoc[];
4041
}
4142

4243
/** Extended Dgeni property-member document that includes extracted Angular metadata. */
4344
export interface CategorizedPropertyMemberDoc extends PropertyMemberDoc, DeprecationInfo {
4445
description: string;
45-
isDirectiveInput: boolean;
46-
isDirectiveOutput: boolean;
47-
directiveInputAlias: string;
48-
directiveOutputAlias: string;
46+
isInput: boolean;
47+
isOutput: boolean;
48+
inputAlias: string;
49+
outputAlias: string;
4950
}
5051

5152
/** Extended Dgeni method-member document that simplifies logic for the Dgeni template. */

‎tools/dgeni/common/directive-metadata.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import {CategorizedClassDoc} from './dgeni-definitions';
1616
* export class MyComponent {}
1717
* ```
1818
*/
19-
export function getDirectiveMetadata(classDoc: CategorizedClassDoc): Map<string, any> | null {
19+
export function getMetadata(classDoc: CategorizedClassDoc): Map<string, any> | null {
2020
const declaration = classDoc.symbol.valueDeclaration;
2121
const decorators =
2222
declaration && ts.isClassDeclaration(declaration) ? ts.getDecorators(declaration) : null;

‎tools/dgeni/common/sort-members.ts

+2-8
Original file line numberDiff line numberDiff line change
@@ -41,17 +41,11 @@ export function sortCategorizedPropertyMembers(
4141
}
4242

4343
// Sort in the order of: Inputs, Outputs, neither
44-
if (
45-
(docA.isDirectiveInput && !docB.isDirectiveInput) ||
46-
(docA.isDirectiveOutput && !docB.isDirectiveInput && !docB.isDirectiveOutput)
47-
) {
44+
if ((docA.isInput && !docB.isInput) || (docA.isOutput && !docB.isInput && !docB.isOutput)) {
4845
return -1;
4946
}
5047

51-
if (
52-
(docB.isDirectiveInput && !docA.isDirectiveInput) ||
53-
(docB.isDirectiveOutput && !docA.isDirectiveInput && !docA.isDirectiveOutput)
54-
) {
48+
if ((docB.isInput && !docA.isInput) || (docB.isOutput && !docA.isInput && !docA.isOutput)) {
5549
return 1;
5650
}
5751

‎tools/dgeni/processors/categorizer.ts

+17-11
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,8 @@ import {MemberDoc} from 'dgeni-packages/typescript/api-doc-types/MemberDoc';
66
import {getInheritedDocsOfClass} from '../common/class-inheritance';
77
import {
88
decorateDeprecatedDoc,
9-
getDirectiveSelectors,
9+
getSelectors,
10+
isComponent,
1011
isDirective,
1112
isMethod,
1213
isNgModule,
@@ -22,7 +23,7 @@ import {
2223
CategorizedPropertyMemberDoc,
2324
CategorizedTypeAliasExportDoc,
2425
} from '../common/dgeni-definitions';
25-
import {getDirectiveMetadata} from '../common/directive-metadata';
26+
import {getMetadata} from '../common/directive-metadata';
2627
import {normalizeFunctionParameters} from '../common/normalize-function-parameters';
2728
import {isPublicDoc} from '../common/private-docs';
2829
import {getInputBindingData, getOutputBindingData} from '../common/property-bindings';
@@ -111,7 +112,7 @@ export class Categorizer implements Processor {
111112
// clauses for the Dgeni document. To make the template syntax simpler and more readable,
112113
// store the extended class in a variable.
113114
classDoc.extendedDoc = classDoc.extendsClauses[0] ? classDoc.extendsClauses[0].doc! : undefined;
114-
classDoc.directiveMetadata = getDirectiveMetadata(classDoc);
115+
classDoc.metadata = getMetadata(classDoc);
115116
classDoc.inheritedDocs = getInheritedDocsOfClass(classDoc, this._exportSymbolsToDocsMap);
116117

117118
classDoc.methods.push(
@@ -134,10 +135,15 @@ export class Categorizer implements Processor {
134135
}
135136

136137
// Categorize the current visited classDoc into its Angular type.
137-
if (isDirective(classDoc) && classDoc.directiveMetadata) {
138+
if ((isDirective(classDoc) || isComponent(classDoc)) && classDoc.metadata) {
139+
if (isComponent(classDoc)) {
140+
classDoc.isComponent = true;
141+
} else {
142+
classDoc.isDirective = true;
143+
}
138144
classDoc.isDirective = true;
139-
classDoc.directiveExportAs = classDoc.directiveMetadata.get('exportAs');
140-
classDoc.directiveSelectors = getDirectiveSelectors(classDoc);
145+
classDoc.exportAs = classDoc.metadata.get('exportAs');
146+
classDoc.selectors = getSelectors(classDoc);
141147
} else if (isService(classDoc)) {
142148
classDoc.isService = true;
143149
} else if (isNgModule(classDoc)) {
@@ -190,17 +196,17 @@ export class Categorizer implements Processor {
190196

191197
const metadata =
192198
propertyDoc.containerDoc.docType === 'class'
193-
? (propertyDoc.containerDoc as CategorizedClassDoc).directiveMetadata
199+
? (propertyDoc.containerDoc as CategorizedClassDoc).metadata
194200
: null;
195201

196202
const inputMetadata = metadata ? getInputBindingData(propertyDoc, metadata) : null;
197203
const outputMetadata = metadata ? getOutputBindingData(propertyDoc, metadata) : null;
198204

199-
propertyDoc.isDirectiveInput = !!inputMetadata;
200-
propertyDoc.directiveInputAlias = (inputMetadata && inputMetadata.alias) || '';
205+
propertyDoc.isInput = !!inputMetadata;
206+
propertyDoc.inputAlias = (inputMetadata && inputMetadata.alias) || '';
201207

202-
propertyDoc.isDirectiveOutput = !!outputMetadata;
203-
propertyDoc.directiveOutputAlias = (outputMetadata && outputMetadata.alias) || '';
208+
propertyDoc.isOutput = !!outputMetadata;
209+
propertyDoc.outputAlias = (outputMetadata && outputMetadata.alias) || '';
204210
}
205211

206212
/**

‎tools/dgeni/processors/entry-point-grouper.ts

+3
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,9 @@ export class EntryPointDoc {
4747
/** List of categorized class docs that are defining a directive. */
4848
directives: CategorizedClassDoc[] = [];
4949

50+
/** List of categorized class docs that are defining a directive. */
51+
components: CategorizedClassDoc[] = [];
52+
5053
/** List of categorized class docs that are defining a service. */
5154
services: CategorizedClassDoc[] = [];
5255

‎tools/dgeni/templates/class.template.html

+13-4
Original file line numberDiff line numberDiff line change
@@ -17,18 +17,27 @@ <h4 id="{$ class.name $}" class="docs-header-link docs-api-h4 docs-api-class-nam
1717
<p class="docs-api-class-description">{$ class.description | marked | safe $}</p>
1818
{%- endif -%}
1919

20-
{%- if class.directiveSelectors -%}
20+
{%- if class.selectors and class.isComponent -%}
21+
<p class="docs-api-component-selectors">
22+
<span class="docs-api-class-selector-label">Selector:</span>
23+
{% for selector in class.selectors %}
24+
<span class="docs-api-class-selector-name">{$ selector $}</span>
25+
{% endfor %}
26+
</p>
27+
{%- endif -%}
28+
29+
{%- if class.selectors and class.isDirective -%}
2130
<p class="docs-api-directive-selectors">
2231
<span class="docs-api-class-selector-label">Selector:</span>
23-
{% for selector in class.directiveSelectors %}
32+
{% for selector in class.selectors %}
2433
<span class="docs-api-class-selector-name">{$ selector $}</span>
2534
{% endfor %}
2635
</p>
2736
{%- endif -%}
2837

29-
{%- if class.directiveExportAs -%}
38+
{%- if class.exportAs -%}
3039
<span class="docs-api-class-export-label">Exported as:</span>
31-
<span class="docs-api-class-export-name">{$ class.directiveExportAs $}</span>
40+
<span class="docs-api-class-export-name">{$ class.exportAs $}</span>
3241
{%- endif -%}
3342

3443
{%- if class.isDeprecated -%}

‎tools/dgeni/templates/entry-point.template.html

+9
Original file line numberDiff line numberDiff line change
@@ -60,6 +60,15 @@ <h3 id="{$ doc.name $}-services" class="docs-header-link docs-api-h3">
6060
{% endfor %}
6161
{%- endif -%}
6262

63+
{%- if doc.components.length -%}
64+
<h3 id="{$ doc.name $}-components" class="docs-header-link docs-api-h3">
65+
<span header-link="components"></span>
66+
Components
67+
</h3>
68+
{% for component in doc.components %}
69+
{$ class(component) $}
70+
{% endfor %}
71+
{%- endif -%}
6372

6473
{%- if doc.directives.length -%}
6574
<h3 id="{$ doc.name $}-directives" class="docs-header-link docs-api-h3">

‎tools/dgeni/templates/property.template.html

+6-6
Original file line numberDiff line numberDiff line change
@@ -2,19 +2,19 @@
22

33
<tr class="docs-api-properties-row">
44
<td class="docs-api-properties-name-cell">
5-
{%- if property.isDirectiveInput -%}
5+
{%- if property.isInput -%}
66
<div class="docs-api-input-marker">
7-
{%- if property.directiveInputAlias -%}
8-
@Input(<span class="docs-api-input-alias">{$ property.directiveInputAlias $}</span>)
7+
{%- if property.inputAlias -%}
8+
@Input(<span class="docs-api-input-alias">{$ property.inputAlias $}</span>)
99
{% else %}
1010
@Input()
1111
{%- endif -%}
1212
</div>
1313
{%- endif -%}
14-
{%- if property.isDirectiveOutput -%}
14+
{%- if property.isOutput -%}
1515
<div class="docs-api-output-marker">
16-
{%- if property.directiveOutputAlias -%}
17-
@Output(<span class="docs-api-output-alias">{$ property.directiveOutputAlias $}</span>)
16+
{%- if property.outputAlias -%}
17+
@Output(<span class="docs-api-output-alias">{$ property.outputAlias $}</span>)
1818
{% else %}
1919
@Output()
2020
{%- endif -%}

0 commit comments

Comments
 (0)