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

refactor(website): adjust typography (#8503)

Browse Source
This commit is contained in:
Suneet Tipirneni
2022-08-17 04:17:09 -04:00
committed by GitHub
parent d97cd936fd
commit 0f83402985
9 changed files with 43 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
packages/collection/src/collection.ts
View File

@@ -37,7 +37,7 @@ export class Collection<K, V> extends Map<K, V> {
* @param defaultValueGenerator - A function that generates the default value * @param defaultValueGenerator - A function that generates the default value
* *
* @example * @example
* ``` * ```ts
* collection.ensure(guildId, () => defaultGuildConfig); * collection.ensure(guildId, () => defaultGuildConfig);
* ``` * ```
*/ */
@@ -232,7 +232,7 @@ export class Collection<K, V> extends Map<K, V> {
* @param thisArg - Value to use as `this` when executing function * @param thisArg - Value to use as `this` when executing function
* *
* @example * @example
* ``` * ```ts
* collection.find(user => user.username === 'Bob'); * collection.find(user => user.username === 'Bob');
* ``` * ```
*/ */
@@ -261,7 +261,7 @@ export class Collection<K, V> extends Map<K, V> {
* @param thisArg - Value to use as `this` when executing function * @param thisArg - Value to use as `this` when executing function
* *
* @example * @example
* ``` * ```ts
* collection.findKey(user => user.username === 'Bob'); * collection.findKey(user => user.username === 'Bob');
* ``` * ```
*/ */
@@ -310,7 +310,7 @@ export class Collection<K, V> extends Map<K, V> {
* @param thisArg - Value to use as `this` when executing function * @param thisArg - Value to use as `this` when executing function
* *
* @example * @example
* ``` * ```ts
* collection.filter(user => user.username === 'Bob'); * collection.filter(user => user.username === 'Bob');
* ``` * ```
*/ */
@@ -344,7 +344,7 @@ export class Collection<K, V> extends Map<K, V> {
* @param thisArg - Value to use as `this` when executing function * @param thisArg - Value to use as `this` when executing function
* *
* @example * @example
* ``` * ```ts
* const [big, small] = collection.partition(guild => guild.memberCount > 250); * const [big, small] = collection.partition(guild => guild.memberCount > 250);
* ``` * ```
*/ */
@@ -395,7 +395,7 @@ export class Collection<K, V> extends Map<K, V> {
* @param thisArg - Value to use as `this` when executing function * @param thisArg - Value to use as `this` when executing function
* *
* @example * @example
* ``` * ```ts
* collection.flatMap(guild => guild.members.cache); * collection.flatMap(guild => guild.members.cache);
* ``` * ```
*/ */
@@ -417,7 +417,7 @@ export class Collection<K, V> extends Map<K, V> {
* @param thisArg - Value to use as `this` when executing function * @param thisArg - Value to use as `this` when executing function
* *
* @example * @example
* ``` * ```ts
* collection.map(user => user.tag); * collection.map(user => user.tag);
* ``` * ```
*/ */
@@ -443,7 +443,7 @@ export class Collection<K, V> extends Map<K, V> {
* @param thisArg - Value to use as `this` when executing function * @param thisArg - Value to use as `this` when executing function
* *
* @example * @example
* ``` * ```ts
* collection.mapValues(user => user.tag); * collection.mapValues(user => user.tag);
* ``` * ```
*/ */
@@ -465,7 +465,7 @@ export class Collection<K, V> extends Map<K, V> {
* @param thisArg - Value to use as `this` when executing function * @param thisArg - Value to use as `this` when executing function
* *
* @example * @example
* ``` * ```ts
* collection.some(user => user.discriminator === '0000'); * collection.some(user => user.discriminator === '0000');
* ``` * ```
*/ */
@@ -488,7 +488,7 @@ export class Collection<K, V> extends Map<K, V> {
* @param thisArg - Value to use as `this` when executing function * @param thisArg - Value to use as `this` when executing function
* *
* @example * @example
* ``` * ```ts
* collection.every(user => !user.bot); * collection.every(user => !user.bot);
* ``` * ```
*/ */
@@ -522,7 +522,7 @@ export class Collection<K, V> extends Map<K, V> {
* @param initialValue - Starting value for the accumulator * @param initialValue - Starting value for the accumulator
* *
* @example * @example
* ``` * ```ts
* collection.reduce((acc, guild) => acc + guild.memberCount, 0); * collection.reduce((acc, guild) => acc + guild.memberCount, 0);
* ``` * ```
*/ */
@@ -562,7 +562,7 @@ export class Collection<K, V> extends Map<K, V> {
* @param thisArg - Value to use as `this` when executing function * @param thisArg - Value to use as `this` when executing function
* *
* @example * @example
* ``` * ```ts
* collection * collection
* .each(user => console.log(user.username)) * .each(user => console.log(user.username))
* .filter(user => user.bot) * .filter(user => user.bot)
@@ -584,7 +584,7 @@ export class Collection<K, V> extends Map<K, V> {
* @param thisArg - Value to use as `this` when executing function * @param thisArg - Value to use as `this` when executing function
* *
* @example * @example
* ``` * ```ts
* collection * collection
* .tap(coll => console.log(coll.size)) * .tap(coll => console.log(coll.size))
* .filter(user => user.bot) * .filter(user => user.bot)
@@ -604,7 +604,7 @@ export class Collection<K, V> extends Map<K, V> {
* Creates an identical shallow copy of this collection. * Creates an identical shallow copy of this collection.
* *
* @example * @example
* ``` * ```ts
* const newColl = someColl.clone(); * const newColl = someColl.clone();
* ``` * ```
*/ */
@@ -618,7 +618,7 @@ export class Collection<K, V> extends Map<K, V> {
* @param collections - Collections to merge * @param collections - Collections to merge
* *
* @example * @example
* ``` * ```ts
* const newColl = someColl.concat(someOtherColl, anotherColl, ohBoyAColl); * const newColl = someColl.concat(someOtherColl, anotherColl, ohBoyAColl);
* ``` * ```
*/ */
@@ -661,7 +661,7 @@ export class Collection<K, V> extends Map<K, V> {
* If omitted, the collection is sorted according to each character's Unicode code point value, according to the string conversion of each element. * If omitted, the collection is sorted according to each character's Unicode code point value, according to the string conversion of each element.
* *
* @example * @example
* ``` * ```ts
* collection.sort((userA, userB) => userA.createdTimestamp - userB.createdTimestamp); * collection.sort((userA, userB) => userA.createdTimestamp - userB.createdTimestamp);
* ``` * ```
*/ */
@@ -718,7 +718,7 @@ export class Collection<K, V> extends Map<K, V> {
* @param whenInBoth - Function getting the result if the entry exists in both Collections * @param whenInBoth - Function getting the result if the entry exists in both Collections
* *
* @example * @example
* ``` * ```ts
* // Sums up the entries in two collections. * // Sums up the entries in two collections.
* coll.merge( * coll.merge(
* other, * other,
@@ -729,7 +729,7 @@ export class Collection<K, V> extends Map<K, V> {
* ``` * ```
* *
* @example * @example
* ``` * ```ts
* // Intersects two collections in a left-biased manner. * // Intersects two collections in a left-biased manner.
* coll.merge( * coll.merge(
* other, * other,
@@ -775,7 +775,7 @@ export class Collection<K, V> extends Map<K, V> {
* according to the string conversion of each element. * according to the string conversion of each element.
* *
* @example * @example
* ``` * ```ts
* collection.sorted((userA, userB) => userA.createdTimestamp - userB.createdTimestamp); * collection.sorted((userA, userB) => userA.createdTimestamp - userB.createdTimestamp);
* ``` * ```
*/ */
@@ -799,7 +799,7 @@ export class Collection<K, V> extends Map<K, V> {
* @param combine - Function to combine an existing entry with a new one * @param combine - Function to combine an existing entry with a new one
* *
* @example * @example
* ``` * ```ts
* Collection.combineEntries([["a", 1], ["b", 2], ["a", 2]], (x, y) => x + y); * Collection.combineEntries([["a", 1], ["b", 2], ["a", 2]], (x, y) => x + y);
* // returns Collection { "a" => 3, "b" => 2 } * // returns Collection { "a" => 3, "b" => 2 }
* ``` * ```

4
packages/website/src/components/CodeListing.tsx
View File

@@ -28,7 +28,7 @@ export function CodeListing({
comment?: AnyDocNodeJSON | null; comment?: AnyDocNodeJSON | null;
}) { }) {
return ( return (
<Stack key={name}> <Stack spacing="xs" key={name}>
<Group> <Group>
<Title order={4} className="font-mono"> <Title order={4} className="font-mono">
{name} {name}
@@ -38,9 +38,11 @@ export function CodeListing({
<HyperlinkedText tokens={typeTokens} /> <HyperlinkedText tokens={typeTokens} />
</Title> </Title>
</Group> </Group>
<Group>
{summary && <TSDoc node={summary} />} {summary && <TSDoc node={summary} />}
{comment && <TSDoc node={comment} />} {comment && <TSDoc node={comment} />}
{children} {children}
</Group>
</Stack> </Stack>
); );
} }

7
packages/website/src/components/DocContainer.tsx
View File

@@ -4,7 +4,6 @@ import type { ReactNode } from 'react';
import { VscListSelection, VscSymbolParameter } from 'react-icons/vsc'; import { VscListSelection, VscSymbolParameter } from 'react-icons/vsc';
import { PrismAsyncLight as SyntaxHighlighter } from 'react-syntax-highlighter'; import { PrismAsyncLight as SyntaxHighlighter } from 'react-syntax-highlighter';
import { vscDarkPlus } from 'react-syntax-highlighter/dist/cjs/styles/prism'; import { vscDarkPlus } from 'react-syntax-highlighter/dist/cjs/styles/prism';
import { CodeListingSeparatorType } from './CodeListing';
import { HyperlinkedText } from './HyperlinkedText'; import { HyperlinkedText } from './HyperlinkedText';
import { Section } from './Section'; import { Section } from './Section';
import { TypeParamTable } from './TypeParamTable'; import { TypeParamTable } from './TypeParamTable';
@@ -67,9 +66,6 @@ export function DocContainer({
<Title order={3} ml="xs"> <Title order={3} ml="xs">
Extends Extends
</Title> </Title>
<Title order={3} ml="xs">
{CodeListingSeparatorType.Type}
</Title>
<Text className="font-mono break-all"> <Text className="font-mono break-all">
<HyperlinkedText tokens={extendsTokens} /> <HyperlinkedText tokens={extendsTokens} />
</Text> </Text>
@@ -81,9 +77,6 @@ export function DocContainer({
<Title order={3} ml="xs"> <Title order={3} ml="xs">
Implements Implements
</Title> </Title>
<Title order={3} ml="xs">
{CodeListingSeparatorType.Type}
</Title>
<Text className="font-mono break-all"> <Text className="font-mono break-all">
{implementsTokens.map((token, idx) => ( {implementsTokens.map((token, idx) => (
<> <>

8
packages/website/src/components/MethodItem.tsx
View File

@@ -19,13 +19,13 @@ function getShorthandName(data: MethodResolvable) {
export function MethodItem({ data }: { data: MethodResolvable }) { export function MethodItem({ data }: { data: MethodResolvable }) {
return ( return (
<Stack> <Stack spacing="xs">
<Group> <Group>
<Stack> <Stack>
<Group> <Group>
<Title order={5} className="font-mono break-all">{`${getShorthandName(data)}`}</Title> <Title order={4} className="font-mono break-all">{`${getShorthandName(data)}`}</Title>
<Title order={5}>:</Title> <Title order={4}>:</Title>
<Title order={5} className="font-mono break-all"> <Title order={4} className="font-mono break-all">
<HyperlinkedText tokens={data.returnTypeTokens} /> <HyperlinkedText tokens={data.returnTypeTokens} />
</Title> </Title>
</Group> </Group>

5
packages/website/src/components/MethodList.tsx
View File

@@ -1,4 +1,4 @@
import { Stack } from '@mantine/core'; import { Divider, Stack } from '@mantine/core';
import { MethodItem } from './MethodItem'; import { MethodItem } from './MethodItem';
import type { DocMethod } from '~/DocModel/DocMethod'; import type { DocMethod } from '~/DocModel/DocMethod';
import type { DocMethodSignature } from '~/DocModel/DocMethodSignature'; import type { DocMethodSignature } from '~/DocModel/DocMethodSignature';
@@ -11,7 +11,10 @@ export function MethodList({
return ( return (
<Stack> <Stack>
{data.map((method) => ( {data.map((method) => (
<>
<MethodItem key={method.name} data={method} /> <MethodItem key={method.name} data={method} />
<Divider className="bg-gray-100" size="md" />
</>
))} ))}
</Stack> </Stack>
); );

2
packages/website/src/components/SidebarItems.tsx
View File

@@ -103,7 +103,7 @@ export function SidebarItems({
<Link key={i} href={member.path} passHref> <Link key={i} href={member.path} passHref>
<UnstyledButton className={classes.link} component="a" onClick={() => setOpened((o) => !o)}> <UnstyledButton className={classes.link} component="a" onClick={() => setOpened((o) => !o)}>
<Group> <Group>
<Text>{member.name}</Text> <Text className="line-clamp-1 text-ellipsis overflow-hidden">{member.name}</Text>
{member.overloadIndex && member.overloadIndex > 1 ? ( {member.overloadIndex && member.overloadIndex > 1 ? (
<Text size="xs" color="dimmed"> <Text size="xs" color="dimmed">
{member.overloadIndex} {member.overloadIndex}

4
packages/website/src/components/tsdoc/TSDoc.tsx
View File

@@ -21,13 +21,13 @@ export function TSDoc({ node }: { node: AnyDocNodeJSON }): JSX.Element {
switch (node.kind) { switch (node.kind) {
case DocNodeKind.PlainText: case DocNodeKind.PlainText:
return ( return (
<Text key={idx} span> <Text key={idx} span style={{ wordBreak: 'break-word' }}>
{(node as DocPlainTextJSON).text} {(node as DocPlainTextJSON).text}
</Text> </Text>
); );
case DocNodeKind.Paragraph: case DocNodeKind.Paragraph:
return ( return (
<Text key={idx} inline> <Text key={idx} inline style={{ wordBreak: 'break-word' }}>
{(node as DocNodeContainerJSON).nodes.map((node, idx) => createNode(node, idx))} {(node as DocNodeContainerJSON).nodes.map((node, idx) => createNode(node, idx))}
</Text> </Text>
); );

2
packages/ws/src/utils/utils.ts
View File

@@ -6,7 +6,7 @@ export type Awaitable<T> = T | Promise<T>;
* Yields the numbers in the given range as an array * Yields the numbers in the given range as an array
* *
* @example * @example
* ``` * ```ts
* range({ start: 3, end: 5 }); // [3, 4, 5] * range({ start: 3, end: 5 }); // [3, 4, 5]
* ``` * ```
*/ */

7
packages/ws/src/ws/WebSocketManager.ts
View File

@@ -81,14 +81,14 @@ export interface OptionalWebSocketManagerOptions {
* Use `null` to simply spawn 0 through `shardCount - 1` * Use `null` to simply spawn 0 through `shardCount - 1`
* *
* @example * @example
* ``` * ```ts
* const manager = new WebSocketManager({ * const manager = new WebSocketManager({
* shardIds: [1, 3, 7], // spawns shard 1, 3, and 7, nothing else * shardIds: [1, 3, 7], // spawns shard 1, 3, and 7, nothing else
* }); * });
* ``` * ```
* *
* @example * @example
* ``` * ```ts
* const manager = new WebSocketManager({ * const manager = new WebSocketManager({
* shardIds: { * shardIds: {
* start: 3, * start: 3,
@@ -127,8 +127,9 @@ export interface OptionalWebSocketManagerOptions {
compression: CompressionMethod | null; compression: CompressionMethod | null;
/** /**
* Function used to retrieve session information (and attempt to resume) for a given shard * Function used to retrieve session information (and attempt to resume) for a given shard
*
* @example * @example
* ``` * ```ts
* const manager = new WebSocketManager({ * const manager = new WebSocketManager({
* async retrieveSessionInfo(shardId): Awaitable<SessionInfo | null> { * async retrieveSessionInfo(shardId): Awaitable<SessionInfo | null> {
* // Fetch this info from redis or similar * // Fetch this info from redis or similar