Fix overload rendering

Resolves #453 Resolves #1100
TypeStrong · Jul 9, 2022 · c6e9bf9 · c6e9bf9
1 parent e4fbb1c
commit c6e9bf9
Show file tree

Hide file tree

Showing 9 changed files with 49 additions and 297 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -3,6 +3,8 @@
 ### Bug Fixes
 
 -   The private member visibility option will now be respected in generated sites, #1992.
+-   Overload rendering will no longer be broken if JavaScript is disabled, #453.
+-   All overloads are now shown at once rather than requiring clicks to see the documentation for each signature, #1100.
 
 ## v0.23.6 (2022-07-08)
 

diff --git a/src/lib/output/themes/default/assets/bootstrap.ts b/src/lib/output/themes/default/assets/bootstrap.ts
@@ -1,7 +1,6 @@
 import { Application, registerComponent } from "./typedoc/Application";
 import { MenuHighlight } from "./typedoc/components/MenuHighlight";
 import { initSearch } from "./typedoc/components/Search";
-import { Signature } from "./typedoc/components/Signature";
 import { Toggle } from "./typedoc/components/Toggle";
 import { Filter } from "./typedoc/components/Filter";
 import { Accordion } from "./typedoc/components/Accordion";
@@ -10,7 +9,6 @@ import { initTheme } from "./typedoc/Theme";
 initSearch();
 
 registerComponent(MenuHighlight, ".menu-highlight");
-registerComponent(Signature, ".tsd-signatures");
 registerComponent(Toggle, "a[data-toggle]");
 registerComponent(Accordion, ".tsd-index-accordion");
 registerComponent(Filter, ".tsd-filter-item input[type=checkbox]");

diff --git a/src/lib/output/themes/default/assets/typedoc/components/Signature.ts b/src/lib/output/themes/default/assets/typedoc/components/Signature.ts
diff --git a/src/lib/output/themes/default/partials/header.tsx b/src/lib/output/themes/default/partials/header.tsx
@@ -2,15 +2,15 @@ import { hasTypeParameters, join, renderFlags } from "../../lib";
 import { JSX } from "../../../../utils";
 import type { DefaultThemeRenderContext } from "../DefaultThemeRenderContext";
 import type { PageEvent } from "../../../events";
-import { DeclarationReflection, Reflection } from "../../../../models";
+import { DeclarationReflection, Reflection, ReflectionKind } from "../../../../models";
 
 export const header = (context: DefaultThemeRenderContext, props: PageEvent<Reflection>) => {
     const HeadingLevel = props.model.isProject() ? "h2" : "h1";
     return (
         <div class="tsd-page-title">
             {!!props.model.parent && <ul class="tsd-breadcrumb">{context.breadcrumb(props.model)}</ul>}
             <HeadingLevel>
-                {props.model.kindString !== "Project" && `${props.model.kindString ?? ""} `}
+                {props.model.kind !== ReflectionKind.Project && `${props.model.kindString ?? ""} `}
                 {props.model.name}
                 {props.model instanceof DeclarationReflection &&
                     props.model.version !== undefined &&

diff --git a/src/lib/output/themes/default/partials/member.getterSetter.tsx b/src/lib/output/themes/default/partials/member.getterSetter.tsx
@@ -6,26 +6,27 @@ export const memberGetterSetter = (context: DefaultThemeRenderContext, props: De
     <>
         <ul class={"tsd-signatures " + props.cssClasses}>
             {!!props.getSignature && (
-                <li class="tsd-signature" id={props.getSignature.anchor}>
-                    <span class="tsd-signature-symbol">get</span> {props.name}
-                    {context.memberSignatureTitle(props.getSignature, {
-                        hideName: true,
-                    })}
-                </li>
+                <>
+                    <li class="tsd-signature" id={props.getSignature.anchor}>
+                        <span class="tsd-signature-symbol">get</span> {props.name}
+                        {context.memberSignatureTitle(props.getSignature, {
+                            hideName: true,
+                        })}
+                    </li>
+                    <li class="tsd-description">{context.memberSignatureBody(props.getSignature)}</li>
+                </>
             )}
             {!!props.setSignature && (
-                <li class="tsd-signature" id={props.setSignature.anchor}>
-                    <span class="tsd-signature-symbol">set</span> {props.name}
-                    {context.memberSignatureTitle(props.setSignature, {
-                        hideName: true,
-                    })}
-                </li>
+                <>
+                    <li class="tsd-signature" id={props.setSignature.anchor}>
+                        <span class="tsd-signature-symbol">set</span> {props.name}
+                        {context.memberSignatureTitle(props.setSignature, {
+                            hideName: true,
+                        })}
+                    </li>
+                    <li class="tsd-description">{context.memberSignatureBody(props.setSignature)}</li>
+                </>
             )}
         </ul>
-
-        <ul class="tsd-descriptions">
-            {!!props.getSignature && <li class="tsd-description">{context.memberSignatureBody(props.getSignature)}</li>}
-            {!!props.setSignature && <li class="tsd-description">{context.memberSignatureBody(props.setSignature)}</li>}
-        </ul>
     </>
 );
diff --git a/src/lib/output/themes/default/partials/member.signature.title.tsx b/src/lib/output/themes/default/partials/member.signature.title.tsx
@@ -1,7 +1,7 @@
 import { join, renderTypeParametersSignature, wbr } from "../../lib";
 import type { DefaultThemeRenderContext } from "../DefaultThemeRenderContext";
 import { JSX } from "../../../../utils";
-import type { SignatureReflection } from "../../../../models";
+import { ReflectionKind, SignatureReflection } from "../../../../models";
 
 export const memberSignatureTitle = (
     context: DefaultThemeRenderContext,
@@ -13,7 +13,7 @@ export const memberSignatureTitle = (
             wbr(props.name)
         ) : (
             <>
-                {props.kindString === "Constructor signature" && (
+                {props.kind === ReflectionKind.ConstructorSignature && (
                     <>
                         {!!props.flags.isAbstract && <span class="tsd-signature-symbol">abstract </span>}
                         <span class="tsd-signature-symbol">new </span>

diff --git a/src/lib/output/themes/default/partials/member.signatures.tsx b/src/lib/output/themes/default/partials/member.signatures.tsx
@@ -1,20 +1,19 @@
 import type { DefaultThemeRenderContext } from "../DefaultThemeRenderContext";
 import { JSX } from "../../../../utils";
 import type { DeclarationReflection } from "../../../../models";
+import { anchorIcon } from "./anchor-icon";
 
 export const memberSignatures = (context: DefaultThemeRenderContext, props: DeclarationReflection) => (
     <>
         <ul class={"tsd-signatures " + props.cssClasses}>
             {props.signatures?.map((item) => (
-                <li class="tsd-signature" id={item.anchor}>
-                    {context.memberSignatureTitle(item)}
-                </li>
-            ))}
-        </ul>
-
-        <ul class="tsd-descriptions">
-            {props.signatures?.map((item) => (
-                <li class="tsd-description">{context.memberSignatureBody(item)}</li>
+                <>
+                    <li class="tsd-signature tsd-anchor-link" id={item.anchor}>
+                        {context.memberSignatureTitle(item)}
+                        {anchorIcon(context, item.anchor)}
+                    </li>
+                    <li class="tsd-description">{context.memberSignatureBody(item)}</li>
+                </>
             ))}
         </ul>
     </>

diff --git a/src/lib/output/themes/default/partials/parameter.tsx b/src/lib/output/themes/default/partials/parameter.tsx
@@ -10,21 +10,18 @@ export const parameter = (context: DefaultThemeRenderContext, props: Declaration
                 <li class="tsd-parameter-signature">
                     <ul class={"tsd-signatures " + props.cssClasses}>
                         {props.signatures.map((item) => (
-                            <li class="tsd-signature" id={item.anchor}>
-                                {context.memberSignatureTitle(item, {
-                                    hideName: true,
-                                })}
-                            </li>
-                        ))}
-                    </ul>
-
-                    <ul class="tsd-descriptions">
-                        {props.signatures.map((item) => (
-                            <li class="tsd-description">
-                                {context.memberSignatureBody(item, {
-                                    hideSources: true,
-                                })}
-                            </li>
+                            <>
+                                <li class="tsd-signature" id={item.anchor}>
+                                    {context.memberSignatureTitle(item, {
+                                        hideName: true,
+                                    })}
+                                </li>
+                                <li class="tsd-description">
+                                    {context.memberSignatureBody(item, {
+                                        hideSources: true,
+                                    })}
+                                </li>
+                            </>
                         ))}
                     </ul>
                 </li>