92 lines
2.7 KiB
Plaintext
92 lines
2.7 KiB
Plaintext
---
|
|
import BaseLayout from './BaseLayout.astro';
|
|
import Breadcrumbs from '../components/site/Breadcrumbs.astro';
|
|
import Sidebar from '../components/site/Sidebar.astro';
|
|
import DocToc from '../components/docs/DocToc.astro';
|
|
import type { Locale } from '../i18n/locales.js';
|
|
import type { SidebarItem } from '../utils/navigation.js';
|
|
import '../styles/docs.css';
|
|
|
|
interface DocTocHeading {
|
|
depth: number;
|
|
slug: string;
|
|
text: string;
|
|
}
|
|
|
|
interface Props {
|
|
lang: Locale;
|
|
title: string;
|
|
description: string;
|
|
sectionLabel: string;
|
|
sectionHref: string;
|
|
sidebarItems: SidebarItem[];
|
|
sidebarSearch?: {
|
|
label: string;
|
|
empty: string;
|
|
};
|
|
tocHeadings?: readonly DocTocHeading[];
|
|
tocLabel?: string;
|
|
}
|
|
|
|
const { lang, title, description, sectionLabel, sectionHref, sidebarItems, sidebarSearch, tocHeadings, tocLabel } =
|
|
Astro.props;
|
|
const resolvedTocLabel = tocLabel ?? (lang === 'zh-CN' ? '本页目录' : 'On This Page');
|
|
const hasGeneratedToc = tocHeadings?.some(heading => heading.depth === 2 || heading.depth === 3) ?? false;
|
|
const codeCopyConfigJson = JSON.stringify(
|
|
lang === 'zh-CN'
|
|
? {
|
|
copyLabel: '复制',
|
|
copiedLabel: '已复制',
|
|
failedLabel: '复制失败',
|
|
}
|
|
: {
|
|
copyLabel: 'Copy',
|
|
copiedLabel: 'Copied',
|
|
failedLabel: 'Failed',
|
|
},
|
|
).replace(/</g, '\\u003c');
|
|
---
|
|
|
|
<BaseLayout lang={lang} title={title} description={description} pageClass="docs-page">
|
|
<Fragment slot="mobileNav">
|
|
<Sidebar items={sidebarItems} currentPath={Astro.url.pathname} search={sidebarSearch}>
|
|
{
|
|
hasGeneratedToc && (
|
|
<Fragment slot="activeContent">
|
|
<DocToc headings={tocHeadings ?? []} label={resolvedTocLabel} />
|
|
</Fragment>
|
|
)
|
|
}
|
|
</Sidebar>
|
|
</Fragment>
|
|
|
|
<main class:list={['docs-shell', hasGeneratedToc && 'has-toc']}>
|
|
<Sidebar items={sidebarItems} currentPath={Astro.url.pathname} search={sidebarSearch} />
|
|
<article class="docs-content">
|
|
<Breadcrumbs
|
|
items={[
|
|
{ label: sectionLabel, href: sectionHref },
|
|
{ label: title, href: Astro.url.pathname },
|
|
]}
|
|
/>
|
|
<header class="docs-heading">
|
|
<h1>{title}</h1>
|
|
<p>{description}</p>
|
|
</header>
|
|
<slot />
|
|
</article>
|
|
{hasGeneratedToc && <DocToc headings={tocHeadings ?? []} label={resolvedTocLabel} />}
|
|
</main>
|
|
<script is:inline type="application/json" data-docs-code-copy-config set:html={codeCopyConfigJson} />
|
|
</BaseLayout>
|
|
|
|
<script>
|
|
import { mountDocsCodeTools } from '../client/docs.js';
|
|
|
|
const configElement = document.querySelector<HTMLScriptElement>('[data-docs-code-copy-config]');
|
|
|
|
if (configElement?.textContent) {
|
|
mountDocsCodeTools(JSON.parse(configElement.textContent));
|
|
}
|
|
</script>
|