feat(docs,dgeni): add hostDirectives to directives and components

Author: griest024

libs/docs-utils/src/api/parse-host-directive-field.ts

@@ -0,0 +1,11 @@
+import { DaffDocsApiHostDirectiveInheritedField } from '../doc/public_api';
+
+const REGEX = /(?<field>\w+)(: (?<alias>\w+))?/;
+
+export const daffDocsApiParseHostDirectiveField = (field: string): DaffDocsApiHostDirectiveInheritedField => {
+  const result = REGEX.exec(field).groups;
+  return {
+    field: result.field,
+    parentField: result.alias,
+  };
+};

libs/docs-utils/src/api/parse-host-directive.ts

@@ -0,0 +1,16 @@
+const REGEX = /(directive: (?<directive>\w+))|(inputs: (?<inputs>\[.+\]))|(outputs: (?<outputs>\[.+\]))/g;
+
+type Groups = Partial<{
+  directive: string;
+  inputs: string;
+  outputs: string;
+}>;
+
+export const daffDocsApiParseHostDirective = (hostDirective: string): Groups =>
+  [...hostDirective.matchAll(REGEX)].reduce((groups, match) => {
+    // eslint-disable-next-line guard-for-in
+    for (const k in match.groups) {
+      groups[k] = match.groups[k] ?? groups[k];
+    }
+    return groups;
+  }, <Groups>{});

libs/docs-utils/src/api/public_api.ts

@@ -1,5 +1,7 @@
 export * from './array-to-dict';
 export * from './decorator.type';
+export * from './parse-host-directive';
+export * from './parse-host-directive-field';
 export * from './ref.type';
 export * from './role/public_api';
 export * from './type.enum';

libs/docs-utils/src/doc/api/directive.type.ts

@@ -3,17 +3,37 @@ import {
   DaffDocsApiClassProperty,
 } from './class.type';
 import { DaffDocsApiTypeProperty } from './type.type';
-import { DaffDocsApiRole } from '../../api/public_api';
+import {
+  DaffDocsApiRef,
+  DaffDocsApiRole,
+} from '../../api/public_api';
 
 export interface DaffApiDirectiveInputDoc extends DaffDocsApiClassProperty {
   required: boolean;
 }
 
+export interface DaffDocsApiHostDirectiveInheritedField {
+  /**
+   * The name of the field on this directive.
+   */
+  field: string;
+  /**
+   * If the field is aliased, this will be the field in the parent.
+   */
+  parentField?: string;
+}
+
+export interface DaffDocsApiHostDirective {
+  directive: DaffDocsApiRef;
+  inputs: Array<DaffDocsApiHostDirectiveInheritedField>;
+  outputs: Array<DaffDocsApiHostDirectiveInheritedField>;
+}
+
 export interface DaffApiDirective extends DaffDocsApiClass {
   selector: string;
   inputs: Array<DaffApiDirectiveInputDoc>;
   outputs: Array<DaffDocsApiTypeProperty>;
-  // hostDirectives: Array
+  hostDirectives: Array<DaffDocsApiHostDirective>;
 }
 
 export interface DaffApiDirectiveDoc extends DaffApiDirective {

libs/docs-utils/src/doc/api/type.type.ts

@@ -9,6 +9,7 @@ import { DaffApiDocBase } from './base.type';
 import { DaffDocsApiFunctionParam } from './function.type';
 import {
   DaffDocsApiDecorator,
+  DaffDocsApiRef,
   DaffDocsApiRole,
 } from '../../api/public_api';
 import { DaffDocsRenderedContent } from '../rendered-content.type';
@@ -19,6 +20,7 @@ export interface DaffDocsApiTypeProperty extends Pick<PropertyMemberDoc, MemberF
   decorators: Array<DaffDocsApiDecorator>;
   description: DaffDocsRenderedContent;
   type: DaffDocsRenderedContent;
+  inheritedFrom?: DaffDocsApiRef;
 }
 
 export interface DaffDocsApiTypeMethod extends Pick<MethodMemberDoc, MemberFields | 'typeParameters'> {

tools/dgeni/src/transforms/daffodil-api-package/processors/add-source.ts

@@ -125,7 +125,9 @@ const interfaceBlock = (doc: DaffApiType): string => {
 const classBlock = (doc: ClassExportDoc & DaffDocsApiClass): string => {
   const decorators = doc.decorators?.length > 0
     ? doc.decorators.reduce((acc, decorator) =>
-      `${acc}@${decorator.name}()\n`
+      decorator.name === 'Component' && (<any>decorator.argumentInfo[0]).hostDirectives?.length > 0
+        ? `${acc}@${decorator.name}({\n${tab()}hostDirectives: [${(<any>decorator.argumentInfo[0]).hostDirectives.reduce((acc_, hd) => `${acc_}\n${indent(hd, 2)},`, '')}\n${tab()}]\n})\n`
+        : `${acc}@${decorator.name}()\n`
     , '')
     : '';
   const parents = doc.extendsClauses.length > 0

tools/dgeni/src/transforms/daffodil-api-package/processors/role.ts

@@ -5,6 +5,7 @@ import type { ConstExportDoc } from 'dgeni-packages/typescript/api-doc-types/Con
 import type { FunctionExportDoc } from 'dgeni-packages/typescript/api-doc-types/FunctionExportDoc';
 import { MethodMemberDoc } from 'dgeni-packages/typescript/api-doc-types/MethodMemberDoc';
 import { PropertyMemberDoc } from 'dgeni-packages/typescript/api-doc-types/PropertyMemberDoc';
+import { createRef } from 'tools/dgeni/src/utils/create-ref';
 import { TypeFlags } from 'typescript';
 
 import {
@@ -27,6 +28,9 @@ import {
   DaffDocsApiTypeProperty,
   daffDocsGetRoleFromTsDoc,
   DaffDocsTsDocument,
+  daffDocsApiParseHostDirective,
+  daffDocsApiParseHostDirectiveField,
+  DaffDocsApiHostDirective,
 } from '@daffodil/docs-utils';
 
 import { InlineTagProcessor } from './inline-tag-processor';
@@ -229,6 +233,7 @@ export class RoleProcessor implements FilterableProcessor {
   readonly directiveSerialize = serializeFactory<DaffApiDirective>(
     [
       'selector',
+      'hostDirectives',
     ],
     {
       inputs: arraySerializer(this.inputSerialize),
@@ -242,6 +247,7 @@ export class RoleProcessor implements FilterableProcessor {
   constructor(
     private markdown: MarkdownCodeProcessor,
     private inlineTagProcessor: InlineTagProcessor,
+    private aliasMap,
   ) {}
 
   $process(docs: Array<Document>): Array<Document> {
@@ -309,9 +315,44 @@ export class RoleProcessor implements FilterableProcessor {
   directive(doc: SerializableDoc & DaffApiDirective & ClassExportDoc): SerializableDoc & DaffApiDirective {
     this.klass(<any>doc);
     doc.serializer = this.directiveSerialize;
+    const directiveArg: any = doc.decorators[0].argumentInfo[0];
     doc.inputs = [];
     doc.outputs = [];
-    doc.selector = doc.decorators[0].argumentInfo[0][0];
+    doc.selector = directiveArg.selector;
+    doc.hostDirectives = (<Array<string>>directiveArg.hostDirectives)
+      ?.map(daffDocsApiParseHostDirective)
+      .map<DaffDocsApiHostDirective>(({ directive, inputs, outputs }) => ({
+        directive: createRef(directive),
+        inputs: inputs ? JSON.parse(inputs.replaceAll('\'', '\"')).map(daffDocsApiParseHostDirectiveField) : [],
+        outputs: outputs ? JSON.parse(outputs.replaceAll('\'', '\"')).map(daffDocsApiParseHostDirectiveField) : [],
+      })) || [];
+    doc.hostDirectives.forEach((hostDirective) => {
+      const directiveDoc = this.aliasMap.getDocs(hostDirective.directive.label)[0];
+      if (directiveDoc) {
+        hostDirective.inputs.forEach((input) => {
+          const parentInput = directiveDoc.members.find((member) => member.name === input.parentField || input.field);
+          if (parentInput) {
+            doc.inputs.push({
+              ...parentInput,
+              name: input.field,
+              required: !parentInput.isOptional,
+              inheritedFrom: hostDirective.directive,
+            });
+          }
+        });
+        hostDirective.outputs.forEach((output) => {
+          const parentOutput = directiveDoc.members.find((member) => member.name === output.parentField || output.field);
+          if (parentOutput) {
+            doc.outputs.push({
+              ...parentOutput,
+              name: output.field,
+              required: !parentOutput.isOptional,
+              inheritedFrom: hostDirective.directive,
+            });
+          }
+        });
+      }
+    });
     // TODO: support signals
     doc.props = doc.props.reduce((acc, prop) => {
       if (prop.decorators?.find(({ name }) => name === 'Input')) {
@@ -443,5 +484,5 @@ export class RoleProcessor implements FilterableProcessor {
 
 export const ROLE_PROVIDER = <const>[
   ROLE_PROCESSOR_NAME,
-  (markdown: MarkdownCodeProcessor, inlineTagProcessorForRealz: InlineTagProcessor) => new RoleProcessor(markdown, inlineTagProcessorForRealz),
+  (markdown: MarkdownCodeProcessor, inlineTagProcessorForRealz: InlineTagProcessor, aliasMap) => new RoleProcessor(markdown, inlineTagProcessorForRealz, aliasMap),
 ];

tools/dgeni/src/utils/create-ref.ts

@@ -0,0 +1,12 @@
+import { DaffDocsApiRef } from '@daffodil/docs-utils';
+
+import { absolutifyPaths } from '../processors/absolutify-paths';
+import { CollectLinkableSymbolsProcessor } from '../processors/collect-linkable-symbols';
+
+export const createRef = (text: string): DaffDocsApiRef =>
+  CollectLinkableSymbolsProcessor.symbols.has(text)
+    ? {
+      label: text,
+      path: absolutifyPaths(CollectLinkableSymbolsProcessor.symbols.get(text)),
+    }
+    : undefined;

tools/dgeni/tsconfig.json

@@ -9,7 +9,8 @@
       "jasmine",
       "node"
     ],
-    "esModuleInterop": true
+    "esModuleInterop": true,
+		"downlevelIteration": true
   },
   "include": [
     "**/*.ts"