Nomchy/discord.js
1
0
Fork 0
mirror of https://github.com/discordjs/discord.js.git synced 2026-03-17 12:03:31 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(website): Show constructor information (#8540)

Browse Source
This commit is contained in:
Suneet Tipirneni
2022-08-22 03:45:53 -04:00
committed by GitHub
parent dd44e8b6ec
commit e42fd16369
66 changed files with 689 additions and 625 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
packages/website/src/components/Sections.tsx
View File

@@ -1,18 +1,16 @@
import { Stack, Group, Badge, Title } from '@mantine/core';
import { useMediaQuery } from '@mantine/hooks';
import { VscSymbolConstant, VscSymbolMethod, VscSymbolProperty } from 'react-icons/vsc';
import { MethodList } from './MethodList';
import { ParameterTable } from './ParameterTable';
import { PropertyList } from './PropertyList';
import { Section } from './Section';
import type { DocClass } from '~/DocModel/DocClass';
import type { DocInterface } from '~/DocModel/DocInterface';
import { TSDoc } from './tsdoc/TSDoc';
import type { ApiClassJSON, ApiConstructorJSON, ApiInterfaceJSON } from '~/DocModel/ApiNodeJSONEncoder';
import type { ParameterDocumentation } from '~/util/parse.server';
export function PropertiesSection({
data,
}: {
data: ReturnType<DocClass['toJSON']>['properties'] | ReturnType<DocInterface['toJSON']>['properties'];
}) {
export function PropertiesSection({ data }: { data: ApiClassJSON['properties'] | ApiInterfaceJSON['properties'] }) {
const matches = useMediaQuery('(max-width: 768px)', true, { getInitialValueInEffect: false });
return data.length ? (
@@ -22,11 +20,7 @@ export function PropertiesSection({
) : null;
}
export function MethodsSection({
data,
}: {
data: ReturnType<DocClass['toJSON']>['methods'] | ReturnType<DocInterface['toJSON']>['methods'];
}) {
export function MethodsSection({ data }: { data: ApiClassJSON['methods'] | ApiInterfaceJSON['methods'] }) {
const matches = useMediaQuery('(max-width: 768px)', true, { getInitialValueInEffect: false });
return data.length ? (
@@ -45,3 +39,48 @@ export function ParametersSection({ data }: { data: ParameterDocumentation[] })
</Section>
) : null;
}
export function ConstructorSection({ data }: { data: ApiConstructorJSON }) {
const matches = useMediaQuery('(max-width: 768px)', true, { getInitialValueInEffect: false });
function getShorthandName(): string {
return `constructor(${data.parameters.reduce((prev, cur, index) => {
if (index === 0) {
return `${prev}${cur.isOptional ? `[${cur.name}]` : cur.name}`;
}
return `${prev}, ${cur.isOptional ? `[${cur.name}]` : cur.name}`;
}, '')})`;
}
return data.parameters.length ? (
<Section title="Constructor" icon={<VscSymbolMethod />} padded dense={matches}>
<Stack id={`${data.name}`} className="scroll-mt-30" spacing="xs">
<Group>
<Stack>
<Group>
{data.deprecated ? (
<Badge variant="filled" color="red">
Deprecated
</Badge>
) : null}
{data.protected ? <Badge variant="filled">Protected</Badge> : null}
<Title sx={{ wordBreak: 'break-all' }} order={4} className="font-mono">
{getShorthandName()}
</Title>
</Group>
</Stack>
</Group>
<Group sx={{ display: data.summary || data.parameters.length ? 'block' : 'none' }} mb="lg">
<Stack>
{data.deprecated ? <TSDoc node={data.deprecated} /> : null}
{data.summary ? <TSDoc node={data.summary} /> : null}
{data.remarks ? <TSDoc node={data.remarks} /> : null}
{data.comment ? <TSDoc node={data.comment} /> : null}
{data.parameters.length ? <ParameterTable data={data.parameters} /> : null}
</Stack>
</Group>
</Stack>
</Section>
) : null;
}