chore: next 13

This commit is contained in:
iCrawl
2022-11-25 14:29:32 +01:00
parent d0c82561b8
commit 33a82b7bce
20 changed files with 252 additions and 223 deletions

View File

@@ -1,12 +1,11 @@
/* eslint-disable tsdoc/syntax */
import { URL, fileURLToPath } from 'node:url';
import { fileURLToPath } from 'node:url';
/**
* @type {import('next').NextConfig}
*/
export default {
reactStrictMode: true,
swcMinify: true,
eslint: {
ignoreDuringBuilds: true,
},

View File

@@ -50,7 +50,7 @@
"ariakit": "^2.0.0-next.41",
"cmdk": "^0.1.20",
"meilisearch": "^0.29.1",
"next": "^12.3.4",
"next": "^13.0.5",
"next-mdx-remote": "^4.2.0",
"next-progress": "^2.2.0",
"next-themes": "^0.2.1",

View File

@@ -7,10 +7,13 @@ export function HyperlinkedText({ tokens }: { tokens: TokenDocumentation[] }) {
{tokens.map((token, idx) => {
if (token.path) {
return (
<Link href={token.path} key={idx} prefetch={false}>
<a className="text-blurple focus:ring-width-2 focus:ring-blurple rounded outline-0 focus:ring">
{token.text}
</a>
<Link
className="text-blurple focus:ring-width-2 focus:ring-blurple rounded outline-0 focus:ring"
href={token.path}
key={idx}
prefetch={false}
>
{token.text}
</Link>
);
}

View File

@@ -5,10 +5,12 @@ export function InheritanceText({ data }: { data: InheritanceData }) {
return (
<span className="font-semibold">
Inherited from{' '}
<Link href={data.path} prefetch={false}>
<a className="text-blurple focus:ring-width-2 focus:ring-blurple rounded font-mono outline-0 focus:ring">
{data.parentName}
</a>
<Link
className="text-blurple focus:ring-width-2 focus:ring-blurple rounded font-mono outline-0 focus:ring"
href={data.path}
prefetch={false}
>
{data.parentName}
</Link>
</span>
);

View File

@@ -82,23 +82,24 @@ export function SidebarItems({
.map((group, idx) => (
<Section icon={resolveIcon(group)} key={idx} title={group}>
{groupItems[group].map((member, index) => (
<Link href={member.path} key={index} prefetch={false}>
<a
className={`dark:border-dark-100 border-light-800 focus:ring-width-2 focus:ring-blurple ml-5 flex flex-col border-l p-[5px] pl-6 outline-0 focus:rounded focus:border-0 focus:ring ${
asPath === member.path
? 'bg-blurple text-white'
: 'dark:hover:bg-dark-200 dark:active:bg-dark-100 hover:bg-light-700 active:bg-light-800'
}`}
onClick={() => setOpened(false)}
title={member.name}
>
<div className="flex flex-row place-items-center gap-2 lg:text-sm">
<span className="truncate">{member.name}</span>
{member.overloadIndex && member.overloadIndex > 1 ? (
<span className="text-xs">{member.overloadIndex}</span>
) : null}
</div>
</a>
<Link
className={`dark:border-dark-100 border-light-800 focus:ring-width-2 focus:ring-blurple ml-5 flex flex-col border-l p-[5px] pl-6 outline-0 focus:rounded focus:border-0 focus:ring ${
asPath === member.path
? 'bg-blurple text-white'
: 'dark:hover:bg-dark-200 dark:active:bg-dark-100 hover:bg-light-700 active:bg-light-800'
}`}
href={member.path}
key={index}
onClick={() => setOpened(false)}
prefetch={false}
title={member.name}
>
<div className="flex flex-row place-items-center gap-2 lg:text-sm">
<span className="truncate">{member.name}</span>
{member.overloadIndex && member.overloadIndex > 1 ? (
<span className="text-xs">{member.overloadIndex}</span>
) : null}
</div>
</Link>
))}
</Section>

View File

@@ -1,7 +1,7 @@
import type { getMembers, ApiClassJSON, ApiInterfaceJSON } from '@discordjs/api-extractor-utils';
import { Button } from 'ariakit/button';
import { Menu, MenuButton, MenuItem, useMenuState } from 'ariakit/menu';
import Image from 'next/future/image';
import Image from 'next/image';
import Link from 'next/link';
import type { MDXRemoteSerializeResult } from 'next-mdx-remote';
import { useTheme } from 'next-themes';
@@ -89,7 +89,6 @@ export function SidebarLayout({
...PACKAGES.map((pkg) => (
<Link href={`/docs/packages/${pkg}/main`} key={pkg} passHref prefetch={false}>
<MenuItem
as="a"
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 rounded bg-white p-3 text-sm outline-0 focus:ring"
onClick={() => packageMenu.setOpen(false)}
state={packageMenu}
@@ -109,7 +108,6 @@ export function SidebarLayout({
?.map((item) => (
<Link href={`/docs/packages/${packageName}/${item}`} key={item} passHref prefetch={false}>
<MenuItem
as="a"
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 rounded bg-white p-3 text-sm outline-0 focus:ring"
onClick={() => versionMenu.setOpen(false)}
state={versionMenu}
@@ -129,8 +127,13 @@ export function SidebarLayout({
.split('/')
.slice(1)
.map((path, idx, original) => (
<Link href={`/${original.slice(0, idx + 1).join('/')}`} key={idx} prefetch={false}>
<a className="focus:ring-width-2 focus:ring-blurple rounded outline-0 hover:underline focus:ring">{path}</a>
<Link
className="focus:ring-width-2 focus:ring-blurple rounded outline-0 hover:underline focus:ring"
href={`/${original.slice(0, idx + 1).join('/')}`}
key={idx}
prefetch={false}
>
{path}
</Link>
)),
[asPathWithoutContainerKey],

View File

@@ -38,20 +38,26 @@ export function TSDoc({ node }: { node: AnyDocNodeJSON }): JSX.Element {
if (codeDestination) {
return (
<Link href={codeDestination.path} key={idx} prefetch={false}>
<a className="text-blurple focus:ring-width-2 focus:ring-blurple rounded font-mono outline-0 focus:ring">
{text ?? codeDestination.name}
</a>
<Link
className="text-blurple focus:ring-width-2 focus:ring-blurple rounded font-mono outline-0 focus:ring"
href={codeDestination.path}
key={idx}
prefetch={false}
>
{text ?? codeDestination.name}
</Link>
);
}
if (urlDestination) {
return (
<Link href={urlDestination} key={idx} prefetch={false}>
<a className="text-blurple focus:ring-width-2 focus:ring-blurple rounded font-mono outline-0 focus:ring">
{text ?? urlDestination}
</a>
<Link
className="text-blurple focus:ring-width-2 focus:ring-blurple rounded font-mono outline-0 focus:ring"
href={urlDestination}
key={idx}
prefetch={false}
>
{text ?? urlDestination}
</Link>
);
}

View File

@@ -11,10 +11,12 @@ export default function FourOhFourPage() {
<div className="mx-auto flex h-full max-w-lg flex-col place-content-center place-items-center gap-8 py-16 px-8 lg:py-0 lg:px-6">
<h1 className="text-[9rem] font-black leading-none md:text-[12rem]">404</h1>
<h2 className="text-[2rem] md:text-[3rem]">Not found.</h2>
<Link href="/docs/packages" prefetch={false}>
<a className="bg-blurple focus:ring-width-2 flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-row place-items-center rounded border-0 px-6 text-base font-semibold leading-none text-white no-underline outline-0 focus:ring focus:ring-white active:translate-y-px">
Take me back
</a>
<Link
className="bg-blurple focus:ring-width-2 flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-row place-items-center rounded border-0 px-6 text-base font-semibold leading-none text-white no-underline outline-0 focus:ring focus:ring-white active:translate-y-px"
href="/docs/packages"
prefetch={false}
>
Take me back
</Link>
</div>
</>

View File

@@ -70,22 +70,27 @@ export default function VersionsRoute(props: Partial<VersionProps> & { error?: s
<div className="flex grow flex-col place-content-center gap-4">
<h1 className="text-2xl font-semibold">Select a version:</h1>
{props.data?.versions.map((version) => (
<Link href={`/docs/packages/${props.packageName}/${version}`} key={version} prefetch={false}>
<a className="dark:bg-dark-400 dark:border-dark-100 dark:hover:bg-dark-300 dark:active:bg-dark-200 focus:ring-width-2 focus:ring-blurple flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-col place-content-center rounded border border-neutral-300 bg-transparent p-4 text-base font-semibold leading-none text-black outline-0 hover:bg-neutral-100 focus:ring active:translate-y-px active:bg-neutral-200 dark:text-white">
<Link
className="dark:bg-dark-400 dark:border-dark-100 dark:hover:bg-dark-300 dark:active:bg-dark-200 focus:ring-width-2 focus:ring-blurple flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-col place-content-center rounded border border-neutral-300 bg-transparent p-4 text-base font-semibold leading-none text-black outline-0 hover:bg-neutral-100 focus:ring active:translate-y-px active:bg-neutral-200 dark:text-white"
href={`/docs/packages/${props.packageName}/${version}`}
key={version}
prefetch={false}
>
<div className="flex flex-row place-content-between place-items-center gap-4">
<div className="flex flex-row place-content-between place-items-center gap-4">
<div className="flex flex-row place-content-between place-items-center gap-4">
<VscVersions size={25} />
<h2 className="font-semibold">{version}</h2>
</div>
<VscArrowRight size={20} />
<VscVersions size={25} />
<h2 className="font-semibold">{version}</h2>
</div>
</a>
<VscArrowRight size={20} />
</div>
</Link>
)) ?? null}
<Link href="/docs/packages" prefetch={false}>
<a className="bg-blurple focus:ring-width-2 flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-row place-items-center gap-2 place-self-center rounded border-0 px-4 text-base font-semibold leading-none text-white no-underline outline-0 focus:ring focus:ring-white active:translate-y-px">
<VscArrowLeft size={20} /> Go back
</a>
<Link
className="bg-blurple focus:ring-width-2 flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-row place-items-center gap-2 place-self-center rounded border-0 px-4 text-base font-semibold leading-none text-white no-underline outline-0 focus:ring focus:ring-white active:translate-y-px"
href="/docs/packages"
prefetch={false}
>
<VscArrowLeft size={20} /> Go back
</Link>
</div>
</div>

View File

@@ -78,34 +78,39 @@ export default function PackagesRoute(props: Partial<PackageProps> & { error?: s
</div>
</a>
{PACKAGES.map((pkg) => (
<Link href={`/docs/packages/${pkg}/${findLatestVersion(pkg)?.version ?? 'main'}`} key={pkg} prefetch={false}>
<a className="dark:bg-dark-400 dark:border-dark-100 dark:hover:bg-dark-300 dark:active:bg-dark-200 focus:ring-width-2 focus:ring-blurple flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-row place-content-between rounded border border-neutral-300 bg-transparent p-4 text-base font-semibold leading-none text-black outline-0 hover:bg-neutral-100 focus:ring active:translate-y-px active:bg-neutral-200 dark:text-white">
<Link
className="dark:bg-dark-400 dark:border-dark-100 dark:hover:bg-dark-300 dark:active:bg-dark-200 focus:ring-width-2 focus:ring-blurple flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-row place-content-between rounded border border-neutral-300 bg-transparent p-4 text-base font-semibold leading-none text-black outline-0 hover:bg-neutral-100 focus:ring active:translate-y-px active:bg-neutral-200 dark:text-white"
href={`/docs/packages/${pkg}/${findLatestVersion(pkg)?.version ?? 'main'}`}
key={pkg}
prefetch={false}
>
<div className="flex grow flex-row place-content-between place-items-center gap-4">
<div className="flex grow flex-row place-content-between place-items-center gap-4">
<div className="flex grow flex-row place-content-between place-items-center gap-4">
<div className="flex flex-row place-content-between place-items-center gap-4">
<VscPackage size={25} />
<h2 className="font-semibold">{pkg}</h2>
</div>
<Link href={`/docs/packages/${pkg}`} prefetch={false}>
<Button
as="div"
className="bg-blurple focus:ring-width-2 flex h-6 transform-gpu cursor-pointer select-none appearance-none flex-row place-content-center place-items-center rounded border-0 px-2 text-xs font-semibold leading-none text-white outline-0 focus:ring focus:ring-white active:translate-y-px"
onClick={async (ev: MouseEvent<HTMLDivElement>) => handleClick(ev, pkg)}
role="link"
>
Select version
</Button>
</Link>
<div className="flex flex-row place-content-between place-items-center gap-4">
<VscPackage size={25} />
<h2 className="font-semibold">{pkg}</h2>
</div>
<VscArrowRight size={20} />
<Link href={`/docs/packages/${pkg}`} prefetch={false}>
<Button
as="div"
className="bg-blurple focus:ring-width-2 flex h-6 transform-gpu cursor-pointer select-none appearance-none flex-row place-content-center place-items-center rounded border-0 px-2 text-xs font-semibold leading-none text-white outline-0 focus:ring focus:ring-white active:translate-y-px"
onClick={async (ev: MouseEvent<HTMLDivElement>) => handleClick(ev, pkg)}
role="link"
>
Select version
</Button>
</Link>
</div>
</a>
<VscArrowRight size={20} />
</div>
</Link>
))}
<Link href="/" prefetch={false}>
<a className="bg-blurple focus:ring-width-2 flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-row place-items-center gap-2 place-self-center rounded border-0 px-4 text-base font-semibold leading-none text-white no-underline outline-0 focus:ring focus:ring-white active:translate-y-px">
<VscArrowLeft size={20} /> Go back
</a>
<Link
className="bg-blurple focus:ring-width-2 flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-row place-items-center gap-2 place-self-center rounded border-0 px-4 text-base font-semibold leading-none text-white no-underline outline-0 focus:ring focus:ring-white active:translate-y-px"
href="/"
prefetch={false}
>
<VscArrowLeft size={20} /> Go back
</Link>
</div>
</div>

View File

@@ -1,4 +1,4 @@
import Image from 'next/future/image';
import Image from 'next/image';
import Link from 'next/link';
import { FiExternalLink } from 'react-icons/fi';
import vercelLogo from '../assets/powered-by-vercel.svg';
@@ -20,10 +20,12 @@ export default function IndexRoute() {
significantly tidier and easier to comprehend.
</p>
<div className="flex flex-row gap-4">
<Link href="/docs" prefetch={false}>
<a className="bg-blurple focus:ring-width-2 flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-row place-items-center rounded border-0 px-6 text-base font-semibold leading-none text-white no-underline outline-0 focus:ring focus:ring-white active:translate-y-px">
Docs
</a>
<Link
className="bg-blurple focus:ring-width-2 flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-row place-items-center rounded border-0 px-6 text-base font-semibold leading-none text-white no-underline outline-0 focus:ring focus:ring-white active:translate-y-px"
href="/docs"
prefetch={false}
>
Docs
</Link>
<a
className="dark:bg-dark-400 dark:border-dark-100 dark:hover:bg-dark-300 dark:active:bg-dark-200 border-light-900 hover:bg-light-200 active:bg-light-300 focus:ring-blurple focus:ring-width-2 flex h-11 transform-gpu cursor-pointer select-none appearance-none flex-row place-items-center gap-2 rounded border bg-transparent px-4 text-base font-semibold leading-none text-black no-underline outline-0 focus:ring active:translate-y-px dark:text-white"