mirror of
https://github.com/discordjs/discord.js.git
synced 2026-03-13 01:53:30 +01:00
fix(website): keys
This commit is contained in:
@@ -155,7 +155,7 @@ function Member({ member }: { member?: ApiItem }) {
|
||||
case 'Class':
|
||||
return <Class clazz={member as ApiClass} />;
|
||||
case 'Function':
|
||||
return <Function item={member as ApiFunction} key={`${member.displayName}-${member.containerKey}`} />;
|
||||
return <Function item={member as ApiFunction} />;
|
||||
case 'Interface':
|
||||
return <Interface item={member as ApiInterface} />;
|
||||
case 'TypeAlias':
|
||||
|
||||
@@ -4,7 +4,7 @@ import { VscChevronDown } from '@react-icons/all-files/vsc/VscChevronDown';
|
||||
import { VscVersions } from '@react-icons/all-files/vsc/VscVersions';
|
||||
import { Menu, MenuButton, MenuItem, useMenuState } from 'ariakit/menu';
|
||||
import type { PropsWithChildren, ReactNode } from 'react';
|
||||
import { useState } from 'react';
|
||||
import { useMemo, useState } from 'react';
|
||||
|
||||
export interface OverloadSwitcherProps {
|
||||
overloads: ReactNode[];
|
||||
@@ -15,6 +15,20 @@ export default function OverloadSwitcher({ overloads, children }: PropsWithChild
|
||||
const overloadedNode = overloads[overloadIndex - 1]!;
|
||||
const menu = useMenuState({ gutter: 8, sameWidth: true, fitViewport: true });
|
||||
|
||||
const menuItems = useMemo(
|
||||
() =>
|
||||
overloads.map((_, idx) => (
|
||||
<MenuItem
|
||||
className="hover:bg-light-700 active:bg-light-800 dark:bg-dark-600 dark:hover:bg-dark-500 dark:active:bg-dark-400 focus:ring-width-2 focus:ring-blurple my-0.5 cursor-pointer rounded bg-white p-3 text-sm outline-0 focus:ring"
|
||||
key={idx}
|
||||
onClick={() => setOverloadIndex(idx + 1)}
|
||||
>
|
||||
{`Overload ${idx + 1}`}
|
||||
</MenuItem>
|
||||
)),
|
||||
[overloads],
|
||||
);
|
||||
|
||||
return (
|
||||
<div className="flex flex-col place-items-start gap-2">
|
||||
<MenuButton
|
||||
@@ -37,15 +51,7 @@ export default function OverloadSwitcher({ overloads, children }: PropsWithChild
|
||||
className="dark:bg-dark-600 border-light-800 dark:border-dark-100 focus:ring-width-2 focus:ring-blurple z-20 flex flex-col rounded border bg-white p-1 outline-0 focus:ring"
|
||||
state={menu}
|
||||
>
|
||||
{overloads.map((_, idx) => (
|
||||
<MenuItem
|
||||
className="hover:bg-light-700 active:bg-light-800 dark:bg-dark-600 dark:hover:bg-dark-500 dark:active:bg-dark-400 focus:ring-width-2 focus:ring-blurple my-0.5 cursor-pointer rounded bg-white p-3 text-sm outline-0 focus:ring"
|
||||
key={idx}
|
||||
onClick={() => setOverloadIndex(idx + 1)}
|
||||
>
|
||||
{`Overload ${idx + 1}`}
|
||||
</MenuItem>
|
||||
))}
|
||||
{menuItems}
|
||||
</Menu>
|
||||
{children}
|
||||
{overloadedNode}
|
||||
|
||||
@@ -65,7 +65,7 @@ export function TableOfContentItems({ serializedMembers }: TableOfContentsItemPr
|
||||
(member): member is TableOfContentsSerializedProperty =>
|
||||
member.kind === 'Property' || member.kind === 'PropertySignature',
|
||||
)
|
||||
.map((prop) => <TableOfContentsPropertyItem key={`${prop.name}-${prop.kind}`} property={prop} />),
|
||||
.map((prop, idx) => <TableOfContentsPropertyItem key={`${prop.name}-${prop.kind}-${idx}`} property={prop} />),
|
||||
[serializedMembers],
|
||||
);
|
||||
|
||||
@@ -76,9 +76,9 @@ export function TableOfContentItems({ serializedMembers }: TableOfContentsItemPr
|
||||
(member): member is TableOfContentsSerializedMethod =>
|
||||
member.kind === 'Method' || member.kind === 'MethodSignature',
|
||||
)
|
||||
.map((member) => (
|
||||
.map((member, idx) => (
|
||||
<TableOfContentsMethodItem
|
||||
key={`${member.name}${member.overloadIndex ? `:${member.overloadIndex}` : ''}`}
|
||||
key={`${member.name}${member.overloadIndex ? `:${member.overloadIndex}` : ''}-${idx}`}
|
||||
method={member}
|
||||
/>
|
||||
)),
|
||||
|
||||
Reference in New Issue
Block a user