Merge remote-tracking branch 'captainTorch/pretty-print'

TypeStrong · Oct 10, 2022 · 96f6e3e · 96f6e3e
2 parents afd4afb + 75edb48
commit 96f6e3e
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 3 deletions.
diff --git a/src/lib/output/themes/default/DefaultThemeRenderContext.ts b/src/lib/output/themes/default/DefaultThemeRenderContext.ts
@@ -46,13 +46,26 @@ function bind<F, L extends any[], R>(fn: (f: F, ...a: L) => R, first: F) {
 
 export class DefaultThemeRenderContext {
     options: Options;
+    private currentDepth = 0;
 
     constructor(private theme: DefaultTheme, options: Options) {
         this.options = options;
     }
 
     icons = icons;
 
+    getCurrentDepth(): number {
+        return this.currentDepth;
+    }
+
+    incrementCurrentDepth(): void {
+        this.currentDepth++;
+    }
+
+    decrementCurrentDepth(): void {
+        this.currentDepth--;
+    }
+
     hook = (name: keyof RendererHooks) =>
         this.theme.owner.hooks.emit(name, this);
 

diff --git a/src/lib/output/themes/default/partials/type.tsx b/src/lib/output/themes/default/partials/type.tsx
@@ -1,5 +1,6 @@
 import type { DefaultThemeRenderContext } from "../DefaultThemeRenderContext";
 import {
+    DeclarationReflection,
     LiteralType,
     ProjectReflection,
     ReferenceType,
@@ -66,6 +67,13 @@ function renderUniquePath(context: DefaultThemeRenderContext, reflection: Reflec
         </a>
     ));
 }
+function includeIndentation(context: DefaultThemeRenderContext): JSX.Element {
+    return context.getCurrentDepth() > 0 ? (
+        <span>{new Array(context.getCurrentDepth() * 4).fill("\u00A0").join("")}</span>
+    ) : (
+        <></>
+    );
+}
 
 // The type helper accepts an optional needsParens parameter that is checked
 // if an inner type may result in invalid output without them. For example:
@@ -277,8 +285,11 @@ const typeRenderers: {
     },
     reflection(context, type) {
         const members: JSX.Element[] = [];
+        const children: DeclarationReflection[] = type.declaration.children || [];
+
+        if (children.length) context.incrementCurrentDepth();
 
-        for (const item of type.declaration.children || []) {
+        for (const item of children) {
             if (item.getSignature && item.setSignature) {
                 members.push(
                     <>
@@ -359,14 +370,24 @@ const typeRenderers: {
         }
 
         if (members.length) {
-            const membersWithSeparators = members.flatMap((m) => [m, <span class="tsd-signature-symbol">; </span>]);
+            const membersWithSeparators = members.flatMap((m) => [
+                includeIndentation(context),
+                m,
+                <span class="tsd-signature-symbol">; </span>,
+                <br></br>,
+            ]);
             membersWithSeparators.pop();
 
+            context.decrementCurrentDepth();
+
             return (
                 <>
                     <span class="tsd-signature-symbol">{"{"} </span>
+                    <br></br>
                     {membersWithSeparators}
-                    <span class="tsd-signature-symbol"> {"}"}</span>
+                    <br></br>
+                    {includeIndentation(context)}
+                    <span class="tsd-signature-symbol">{"}"}</span>
                 </>
             );
         }