private _renderElements()

in playground/src/DocHtmlView.tsx [65:183]
101 lines of code
12 McCabe index (conditional complexity)

  private _renderElements(): React.ReactNode[] {
    const docComment: tsdoc.DocComment = this.props.docComment;
    const outputElements: React.ReactNode[] = [];

    // Summary
    if (docComment.summarySection) {
      outputElements.push(
        <React.Fragment key="summary">
          <h1 className="doc-heading">Summary</h1>
          {this._renderContainer(docComment.summarySection)}
        </React.Fragment>
      );
    }

    // Parameters
    if (docComment.params.count > 0) {
      const rows: React.ReactNode[] = [];

      for (const paramBlock of docComment.params.blocks) {
        rows.push(
          <tr key={`param_${rows.length}`}>
            <td>{paramBlock.parameterName}</td>
            <td>{this._renderContainer(paramBlock.content)}</td>
          </tr>
        );
      }

      outputElements.push(
        <React.Fragment key="parameters">
          <h1 className="doc-heading">Parameters</h1>
          <table className="doc-table">
            <thead>
              <tr>
                <th>Name</th>
                <th>Description</th>
              </tr>
            </thead>
            <tbody>{rows}</tbody>
          </table>
        </React.Fragment>
      );
    }

    // Returns
    if (docComment.returnsBlock) {
      outputElements.push(
        <React.Fragment key="returns">
          <h1 className="doc-heading">Return Value</h1>
          {this._renderContainer(docComment.returnsBlock.content)}
        </React.Fragment>
      );
    }

    if (docComment.remarksBlock) {
      outputElements.push(
        <React.Fragment key="remarks">
          <h1 className="doc-heading">Remarks</h1>
          {this._renderContainer(docComment.remarksBlock.content)}
        </React.Fragment>
      );
    }

    const exampleBlocks: tsdoc.DocBlock[] = docComment.customBlocks.filter(
      (x) => x.blockTag.tagNameWithUpperCase === tsdoc.StandardTags.example.tagNameWithUpperCase
    );

    let exampleNumber: number = 1;
    for (const exampleBlock of exampleBlocks) {
      const heading: string = exampleBlocks.length > 1 ? `Example ${exampleNumber}` : 'Example';

      outputElements.push(
        <React.Fragment key="seeAlso">
          <h2 className="doc-heading">{heading}</h2>
          {this._renderContainer(exampleBlock.content)}
        </React.Fragment>
      );

      ++exampleNumber;
    }

    if (docComment.seeBlocks.length > 0) {
      const listItems: React.ReactNode[] = [];
      for (const seeBlock of docComment.seeBlocks) {
        listItems.push(<li key={`item_${listItems.length}`}>{this._renderContainer(seeBlock.content)}</li>);
      }

      outputElements.push(
        <React.Fragment key="seeAlso">
          <h1 className="doc-heading">See Also</h1>
          <ul>{listItems}</ul>
        </React.Fragment>
      );
    }

    const modifierTags: ReadonlyArray<tsdoc.DocBlockTag> = docComment.modifierTagSet.nodes;

    if (modifierTags.length > 0) {
      const modifierElements: React.ReactNode[] = [];

      for (const modifierTag of modifierTags) {
        const key: string = `modifier_${modifierElements.length}`;
        modifierElements.push(
          <React.Fragment key={key}>
            {' '}
            <code className="doc-code-span">{modifierTag.tagName}</code>
          </React.Fragment>
        );
      }

      outputElements.push(
        <React.Fragment key="modifiers">
          <h1 className="doc-heading">Modifiers</h1>
          {modifierElements}
        </React.Fragment>
      );
    }

    return outputElements;
  }