Add type parameters to preview

Resolves #2455
TypeStrong · Dec 17, 2023 · 897daeb · 897daeb
1 parent f3acf82
commit 897daeb
Show file tree

Hide file tree

Showing 8 changed files with 18 additions and 12 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,8 +1,13 @@
 # Unreleased
 
+## Features
+
+-   Extended reflection preview view for interfaces to include type parameters, #2455.
+
 ### Bug Fixes
 
 -   Navigation triangle markers should no longer display on a separate line with some font settings, #2457.
+-   Keyword syntax highlighting introduced in 0.25.4 was not always applied to keywords.
 
 ## v0.25.4 (2023-11-26)
 

diff --git a/src/lib/output/themes/default/partials/member.getterSetter.tsx b/src/lib/output/themes/default/partials/member.getterSetter.tsx
@@ -16,7 +16,7 @@ export const memberGetterSetter = (context: DefaultThemeRenderContext, props: De
             {!!props.getSignature && (
                 <>
                     <li class="tsd-signature" id={props.getSignature.anchor}>
-                        <span class="tsd-signature-symbol">get</span> {props.name}
+                        <span class="tsd-signature-keyword">get</span> {props.name}
                         {context.memberSignatureTitle(props.getSignature, {
                             hideName: true,
                         })}
@@ -27,7 +27,7 @@ export const memberGetterSetter = (context: DefaultThemeRenderContext, props: De
             {!!props.setSignature && (
                 <>
                     <li class="tsd-signature" id={props.setSignature.anchor}>
-                        <span class="tsd-signature-symbol">set</span> {props.name}
+                        <span class="tsd-signature-keyword">set</span> {props.name}
                         {context.memberSignatureTitle(props.setSignature, {
                             hideName: true,
                         })}

diff --git a/src/lib/output/themes/default/partials/member.signature.title.tsx b/src/lib/output/themes/default/partials/member.signature.title.tsx
@@ -44,8 +44,8 @@ export function memberSignatureTitle(
                 <>
                     {props.kind === ReflectionKind.ConstructorSignature && (
                         <>
-                            {!!props.flags.isAbstract && <span class="tsd-signature-symbol">abstract </span>}
-                            <span class="tsd-signature-symbol">new </span>
+                            {!!props.flags.isAbstract && <span class="tsd-signature-keyword">abstract </span>}
+                            <span class="tsd-signature-keyword">new </span>
                         </>
                     )}
                 </>

diff --git a/src/lib/output/themes/default/partials/parameter.tsx b/src/lib/output/themes/default/partials/parameter.tsx
@@ -91,7 +91,7 @@ export const parameter = (context: DefaultThemeRenderContext, props: Declaration
                                     <li class="tsd-parameter">
                                         <h5>
                                             {context.reflectionFlags(item.getSignature)}
-                                            <span class="tsd-signature-symbol">get </span>
+                                            <span class="tsd-signature-keyword">get </span>
                                             <span class={getKindClass(item)}>{wbr(item.name)}</span>
                                             <span class="tsd-signature-symbol">(): </span>
                                             {context.type(item.getSignature.type)}
@@ -108,7 +108,7 @@ export const parameter = (context: DefaultThemeRenderContext, props: Declaration
                                     <li class="tsd-parameter">
                                         <h5>
                                             {context.reflectionFlags(item.setSignature)}
-                                            <span class="tsd-signature-symbol">set </span>
+                                            <span class="tsd-signature-keyword">set </span>
                                             <span class={getKindClass(item)}>{wbr(item.name)}</span>
                                             <span class="tsd-signature-symbol">(</span>
                                             {item.setSignature.parameters?.map((item) => (

diff --git a/src/lib/output/themes/default/partials/reflectionPreview.tsx b/src/lib/output/themes/default/partials/reflectionPreview.tsx
@@ -1,6 +1,6 @@
 import { DeclarationReflection, ReflectionKind, type Reflection, ReflectionType } from "../../../../models";
 import { JSX } from "../../../../utils";
-import { getKindClass } from "../../lib";
+import { getKindClass, renderTypeParametersSignature } from "../../lib";
 import type { DefaultThemeRenderContext } from "../DefaultThemeRenderContext";
 
 export function reflectionPreview(context: DefaultThemeRenderContext, props: Reflection) {
@@ -12,7 +12,8 @@ export function reflectionPreview(context: DefaultThemeRenderContext, props: Ref
         return (
             <div class="tsd-signature">
                 <span class="tsd-signature-keyword">interface </span>
-                <span class={getKindClass(props)}>{props.name} </span>
+                <span class={getKindClass(props)}>{props.name}</span>
+                {renderTypeParametersSignature(context, props.typeParameters)}{" "}
                 {context.type(new ReflectionType(props), { topLevelLinks: true })}
             </div>
         );

diff --git a/src/lib/output/themes/default/partials/typeParameters.tsx b/src/lib/output/themes/default/partials/typeParameters.tsx
@@ -16,7 +16,7 @@ export function typeParameters(context: DefaultThemeRenderContext, typeParameter
                                 <span class="tsd-kind-type-parameter">{item.name}</span>
                                 {!!item.type && (
                                     <>
-                                        <span class="tsd-signature-symbol"> extends </span>
+                                        <span class="tsd-signature-keyword"> extends </span>
                                         {context.type(item.type)}
                                     </>
                                 )}

diff --git a/src/lib/output/themes/lib.tsx b/src/lib/output/themes/lib.tsx
@@ -106,7 +106,7 @@ export function renderTypeParametersSignature(
                 <span class="tsd-signature-symbol">{"<"}</span>
                 {join(<span class="tsd-signature-symbol">{", "}</span>, typeParameters, (item) => (
                     <>
-                        {item.flags.isConst && "const "}
+                        {item.flags.isConst && <span class="tsd-signature-keyword">const </span>}
                         {item.varianceModifier ? `${item.varianceModifier} ` : ""}
                         <span class="tsd-signature-type tsd-kind-type-parameter">{item.name}</span>
                     </>
@@ -126,7 +126,7 @@ export function renderTypeParametersSignature(
                     <span class="tsd-signature-type tsd-kind-type-parameter">{item.name}</span>
                     {!!item.type && (
                         <>
-                            <span class="tsd-signature-symbol"> extends </span>
+                            <span class="tsd-signature-keyword"> extends </span>
                             {context.type(item.type)}
                         </>
                     )}

diff --git a/src/lib/serialization/components.ts b/src/lib/serialization/components.ts
@@ -10,7 +10,7 @@ import type { ModelToObject } from "./schema";
  * Additionally, each {@link Serializer} plugin must define a predicate that instructs the group
  * it belongs to.
  */
-export interface SerializerComponent<T> {
+export interface SerializerComponent<T extends {}> {
     /**
      * The priority this serializer should be executed with.
      * A higher priority means the {@link Serializer} will be applied earlier.