feat(website): show package members in a sidebar (#8245)

* feat(website): show package members in a sidebar

* fix: put response instead of loader

* Apply suggestions from code review

Co-authored-by: Noel <buechler.noel@outlook.com>

* chore: make requested changes

* refactor: make only package list scrollable

* feat: make sidebar mobile responsive

* fix: breakpoints for sidebar

Co-authored-by: Noel <buechler.noel@outlook.com>
This commit is contained in:
Suneet Tipirneni
2022-07-07 16:09:19 -04:00
committed by GitHub
parent 43f62bb667
commit e78c9c9ee9
18 changed files with 156 additions and 106 deletions

View File

@@ -8,14 +8,14 @@ import {
import { DocItem } from './DocItem';
import { DocMethod } from './DocMethod';
import { DocProperty } from './DocProperty';
import { type TokenDocumentation, genToken, TypeParameterData, generateTypeParamData } from '~/util/parse.server';
import { TypeParameterMixin } from './TypeParameterMixin';
import { type TokenDocumentation, genToken } from '~/util/parse.server';
export class DocClass extends DocItem<ApiClass> {
export class DocClass extends TypeParameterMixin(DocItem<ApiClass>) {
public readonly extendsTokens: TokenDocumentation[] | null;
public readonly implementsTokens: TokenDocumentation[][];
public readonly methods: DocMethod[] = [];
public readonly properties: DocProperty[] = [];
public readonly typeParameters: TypeParameterData[] = [];
public constructor(model: ApiModel, item: ApiClass) {
super(model, item);
@@ -29,8 +29,6 @@ export class DocClass extends DocItem<ApiClass> {
excerpt.excerpt.spannedTokens.map((token) => genToken(this.model, token)),
);
this.typeParameters = item.typeParameters.map((typeParam) => generateTypeParamData(model, typeParam));
for (const member of item.members) {
switch (member.kind) {
case ApiItemKind.Method:
@@ -52,7 +50,6 @@ export class DocClass extends DocItem<ApiClass> {
implementsTokens: this.implementsTokens,
methods: this.methods.map((method) => method.toJSON()),
properties: this.properties.map((prop) => prop.toJSON()),
typeParameters: this.typeParameters,
};
}
}

View File

@@ -1,26 +1,18 @@
import type { ApiFunction, ApiModel } from '@microsoft/api-extractor-model';
import type { ApiFunction, ApiModel, ApiParameterListMixin } from '@microsoft/api-extractor-model';
import { DocItem } from './DocItem';
import {
type ParameterDocumentation,
type TokenDocumentation,
genParameter,
genToken,
type TypeParameterData,
generateTypeParamData,
} from '~/util/parse.server';
import { TypeParameterMixin } from './TypeParameterMixin';
import { type TokenDocumentation, genToken, genParameter, ParameterDocumentation } from '~/util/parse.server';
export class DocFunction extends DocItem<ApiFunction> {
public readonly parameters: ParameterDocumentation[];
export class DocFunction extends TypeParameterMixin(DocItem<ApiFunction>) {
public readonly returnTypeTokens: TokenDocumentation[];
public readonly overloadIndex: number;
public readonly typeParameters: TypeParameterData[] = [];
public readonly parameters: ParameterDocumentation[];
public constructor(model: ApiModel, item: ApiFunction) {
super(model, item);
this.parameters = item.parameters.map((param) => genParameter(this.model, param));
this.returnTypeTokens = item.returnTypeExcerpt.spannedTokens.map((token) => genToken(this.model, token));
this.overloadIndex = item.overloadIndex;
this.typeParameters = item.typeParameters.map((typeParam) => generateTypeParamData(model, typeParam));
this.parameters = (item as ApiParameterListMixin).parameters.map((param) => genParameter(this.model, param));
}
public override toJSON() {
@@ -29,7 +21,6 @@ export class DocFunction extends DocItem<ApiFunction> {
parameters: this.parameters,
returnTypeTokens: this.returnTypeTokens,
overloadIndex: this.overloadIndex,
typeParameters: this.typeParameters,
};
}
}

View File

@@ -1,14 +1,14 @@
import { DocItem } from './DocItem';
import { DocMethodSignature } from './DocMethodSignature';
import { DocProperty } from './DocProperty';
import { TypeParameterMixin } from './TypeParameterMixin';
import { ApiInterface, ApiItemKind, ApiMethodSignature, ApiModel, ApiPropertySignature } from '~/api-extractor.server';
import { type TokenDocumentation, genToken, type TypeParameterData, generateTypeParamData } from '~/util/parse.server';
import { type TokenDocumentation, genToken } from '~/util/parse.server';
export class DocInterface extends DocItem<ApiInterface> {
export class DocInterface extends TypeParameterMixin(DocItem<ApiInterface>) {
public readonly extendsTokens: TokenDocumentation[][] | null;
public readonly methods: DocMethodSignature[] = [];
public readonly properties: DocProperty[] = [];
public readonly typeParameters: TypeParameterData[] = [];
public constructor(model: ApiModel, item: ApiInterface) {
super(model, item);
@@ -17,8 +17,6 @@ export class DocInterface extends DocItem<ApiInterface> {
excerpt.excerpt.spannedTokens.map((token) => genToken(this.model, token)),
);
this.typeParameters = item.typeParameters.map((typeParam) => generateTypeParamData(this.model, typeParam));
for (const member of item.members) {
switch (member.kind) {
case ApiItemKind.MethodSignature:
@@ -39,7 +37,6 @@ export class DocInterface extends DocItem<ApiInterface> {
extendsTokens: this.extendsTokens,
methods: this.methods.map((method) => method.toJSON()),
properties: this.properties.map((prop) => prop.toJSON()),
typeParameters: this.typeParameters,
};
}
}

View File

@@ -2,6 +2,8 @@ import type { ApiModel, ApiDeclaredItem } from '@microsoft/api-extractor-model';
import type { ReferenceData } from '~/model.server';
import { resolveName, genReference, resolveDocComment, TokenDocumentation, genToken } from '~/util/parse.server';
export type DocItemConstructor<T = DocItem> = new (...args: any[]) => T;
export class DocItem<T extends ApiDeclaredItem = ApiDeclaredItem> {
public readonly item: T;
public readonly name: string;

View File

@@ -1,33 +1,17 @@
import type { ApiMethod, ApiModel } from '@microsoft/api-extractor-model';
import { DocItem } from './DocItem';
import { DocFunction } from './DocFunction';
import { Visibility } from './Visibility';
import {
type ParameterDocumentation,
type TokenDocumentation,
genParameter,
genToken,
generateTypeParamData,
TypeParameterData,
} from '~/util/parse.server';
export class DocMethod extends DocItem<ApiMethod> {
public readonly parameters: ParameterDocumentation[];
export class DocMethod extends DocFunction {
public readonly static: boolean;
public readonly optional: boolean;
public readonly visibility: Visibility;
public readonly returnTypeTokens: TokenDocumentation[];
public readonly overloadIndex: number;
public readonly typeParameters: TypeParameterData[] = [];
public constructor(model: ApiModel, item: ApiMethod) {
super(model, item);
this.parameters = item.parameters.map((param) => genParameter(this.model, param));
this.static = item.isStatic;
this.optional = item.isOptional;
this.visibility = item.isProtected ? Visibility.Protected : Visibility.Public;
this.returnTypeTokens = item.returnTypeExcerpt.spannedTokens.map((token) => genToken(this.model, token));
this.overloadIndex = item.overloadIndex;
this.typeParameters = item.typeParameters.map((typeParam) => generateTypeParamData(this.model, typeParam));
}
public override toJSON() {
@@ -36,9 +20,6 @@ export class DocMethod extends DocItem<ApiMethod> {
static: this.static,
optional: this.optional,
visibility: this.visibility,
parameters: this.parameters,
returnTypeTokens: this.returnTypeTokens,
overloadIndex: this.overloadIndex,
};
}
}

View File

@@ -1,37 +1,18 @@
import type { ApiMethodSignature, ApiModel } from '@microsoft/api-extractor-model';
import { DocItem } from './DocItem';
import {
type ParameterDocumentation,
type TokenDocumentation,
genParameter,
genToken,
generateTypeParamData,
type TypeParameterData,
} from '~/util/parse.server';
import { DocFunction } from './DocFunction';
export class DocMethodSignature extends DocItem<ApiMethodSignature> {
public readonly parameters: ParameterDocumentation[];
export class DocMethodSignature extends DocFunction {
public readonly optional: boolean;
public readonly returnTypeTokens: TokenDocumentation[];
public readonly overloadIndex: number;
public readonly typeParameters: TypeParameterData[] = [];
public constructor(model: ApiModel, item: ApiMethodSignature) {
super(model, item);
this.parameters = item.parameters.map((param) => genParameter(this.model, param));
this.optional = item.isOptional;
this.returnTypeTokens = item.returnTypeExcerpt.spannedTokens.map((token) => genToken(this.model, token));
this.overloadIndex = item.overloadIndex;
this.typeParameters = item.typeParameters.map((typeParam) => generateTypeParamData(this.model, typeParam));
}
public override toJSON() {
return {
...super.toJSON(),
optional: this.optional,
parameters: this.parameters,
returnTypeTokens: this.returnTypeTokens,
overloadIndex: this.overloadIndex,
};
}
}

View File

@@ -1,22 +1,20 @@
import type { ApiModel, ApiTypeAlias } from '@microsoft/api-extractor-model';
import { DocItem } from './DocItem';
import { type TokenDocumentation, genToken, generateTypeParamData, type TypeParameterData } from '~/util/parse.server';
import { TypeParameterMixin } from './TypeParameterMixin';
import { type TokenDocumentation, genToken } from '~/util/parse.server';
export class DocTypeAlias extends DocItem<ApiTypeAlias> {
export class DocTypeAlias extends TypeParameterMixin(DocItem<ApiTypeAlias>) {
public readonly typeTokens: TokenDocumentation[];
public readonly typeParameters: TypeParameterData[] = [];
public constructor(model: ApiModel, item: ApiTypeAlias) {
super(model, item);
this.typeTokens = item.typeExcerpt.spannedTokens.map((token) => genToken(model, token));
this.typeParameters = item.typeParameters.map((typeParam) => generateTypeParamData(this.model, typeParam));
}
public override toJSON() {
return {
...super.toJSON(),
typeTokens: this.typeTokens,
typeParameters: this.typeParameters,
};
}
}

View File

@@ -0,0 +1,24 @@
import type { ApiItem, ApiModel, ApiTypeParameterListMixin } from '@microsoft/api-extractor-model';
import type { DocItemConstructor } from './DocItem';
import { generateTypeParamData, TypeParameterData } from '~/util/parse.server';
export function TypeParameterMixin<TBase extends DocItemConstructor>(Base: TBase) {
return class Mixed extends Base {
public readonly typeParameters: TypeParameterData[] = [];
public constructor(...args: any[]);
public constructor(model: ApiModel, item: ApiItem) {
super(model, item);
this.typeParameters = (item as ApiTypeParameterListMixin).typeParameters.map((typeParam) =>
generateTypeParamData(this.model, typeParam),
);
}
public override toJSON() {
return {
...super.toJSON(),
typeParameterData: this.typeParameters,
};
}
};
}