@jaamd/jaad 0.0.0-stage → 1.0.0-rc.1

package/src/docs/components/TableOfContents.astro

@@ -0,0 +1,71 @@
+---
+import type { DocsHeading } from '../types.ts'
+import { ui } from '../../site/runtime.ts'
+
+interface Props {
+    headings: DocsHeading[]
+    locale?: string
+}
+
+const { headings, locale } = Astro.props
+const t = ui(locale)
+---
+
+{headings.length > 0 && (
+    <nav id="docs-toc" aria-label={t('toc.label')} class="docs-toc">
+        <h2 class="docs-toc-title">{t('toc.title')}</h2>
+        <ul class="docs-toc-list">
+            {headings.map((heading) => (
+                <li>
+                    <a
+                        href={`#${heading.slug}`}
+                        data-toc-link
+                        class:list={['docs-toc-link', heading.depth === 3 && 'docs-toc-link-nested']}
+                    >
+                        {heading.text}
+                    </a>
+                </li>
+            ))}
+        </ul>
+    </nav>
+)}
+
+<script>
+    function initToc(): void {
+        const sidebar = document.getElementById('docs-toc')
+        // astro:page-load also fires on the first load, which would observe twice.
+        if (!sidebar || sidebar.dataset.tocInit) return
+        sidebar.dataset.tocInit = '1'
+
+        const links = Array.from(sidebar.querySelectorAll<HTMLAnchorElement>('[data-toc-link]'))
+        const headingEls = links
+            .map((link) => document.getElementById(link.getAttribute('href')!.slice(1)))
+            .filter(Boolean) as HTMLElement[]
+
+        if (!headingEls.length) return
+
+        const setActive = (id: string): void => {
+            links.forEach((link) => {
+                const isActive = link.getAttribute('href') === `#${id}`
+                if (isActive) link.setAttribute('aria-current', 'location')
+                else link.removeAttribute('aria-current')
+            })
+        }
+
+        const observer = new IntersectionObserver(
+            (entries) => {
+                entries.forEach((entry) => {
+                    if (entry.isIntersecting) setActive(entry.target.id)
+                })
+            },
+            { rootMargin: '-100px 0px -66%', threshold: 0 },
+        )
+
+        headingEls.forEach((el) => observer.observe(el))
+
+        document.addEventListener('astro:before-preparation', () => observer.disconnect(), { once: true })
+    }
+
+    initToc()
+    document.addEventListener('astro:page-load', initToc)
+</script>

package/src/docs/config.ts

@@ -0,0 +1,167 @@
+import { existsSync } from 'node:fs'
+import { relative, resolve, sep } from 'node:path'
+import { z } from 'astro/zod'
+import { editBaseFrom, type RepoInfo } from '../site/infer.ts'
+import { isLocale } from '../site/locales.ts'
+import { normaliseBasePath } from '../site/urls.ts'
+import { detectLocales, validateLocaleTree } from './locale-tree.ts'
+import { slugToTitle } from './model/ids.ts'
+
+/** The options of the documentation: where the markdown is and where it is served. */
+export const docsConfigShape = {
+    docsDir: z.string().default('./docs'),
+    routeBase: z.string().default('/'),
+    /** One directory per section, keyed by its url segment. Replaces `docsDir`. */
+    sections: z
+        .record(z.string(), z.object({ dir: z.string(), label: z.string().optional() }))
+        .superRefine((sections, context) => {
+            for (const key of Object.keys(sections)) {
+                if (/^[a-z0-9]+(-[a-z0-9]+)*$/.test(key)) continue
+                context.addIssue({
+                    code: 'custom',
+                    path: [key],
+                    message: 'a section key is its url segment: lowercase letters, digits and dashes',
+                })
+            }
+        })
+        .optional(),
+    editLink: z.union([z.boolean(), z.string()]).default(true),
+    /** Only when detection guesses wrong: pin the set, or false to switch it off. */
+    locales: z
+        .union([z.array(z.string().refine(isLocale, { message: 'not a locale code' })), z.literal(false)])
+        .optional(),
+}
+
+const docsConfigSchema = z.object(docsConfigShape)
+
+export type DocsConfig = z.output<typeof docsConfigSchema>
+
+/** Where the docs are and where they are served. */
+export interface DocsResolvedConfig {
+    /** Where the docs are mounted, without a trailing slash. Empty at the root. */
+    base: string
+    /** `docsDir` as configured, relative to the project. */
+    dir: string
+    /** Whether `dir` holds pages: always without sections; with them, only
+     *  when set, for the pages outside every section. */
+    dirInUse: boolean
+    /** Empty when the docs are not split into sections. */
+    sections: DocsSection[]
+    /** Edit url of the pages in `dir`, `:path` standing for the file. */
+    editBase: string | null
+}
+
+export interface DocsSection {
+    /** The url segment. */
+    key: string
+    label: string
+    /** As configured, relative to the project. */
+    dir: string
+    editBase: string | null
+}
+
+/** A directory of markdown, and the section it is when the docs have sections. */
+export interface DocsRoot {
+    /** Absolute. */
+    dir: string
+    section?: string
+}
+
+/** Empty at the root, otherwise one leading slash and no trailing one. */
+function resolveEditBase(editLink: DocsConfig['editLink'], repo: RepoInfo | null, docsDir: string): string | null {
+    if (typeof editLink === 'string') return editLink
+    if (!editLink || !repo) return null
+    return editBaseFrom(repo, docsDir)
+}
+
+function resolveSections(config: DocsConfig, repo: RepoInfo | null): DocsSection[] {
+    return Object.entries(config.sections ?? {}).map(([key, section]) => ({
+        key,
+        label: section.label ?? slugToTitle(key),
+        dir: section.dir,
+        editBase: resolveEditBase(config.editLink, repo, section.dir),
+    }))
+}
+
+/** No directory may be, or be inside, another. */
+function assertSeparateRoots(roots: DocsRoot[], cwd: string): void {
+    const paths = roots.map((root) => root.dir + sep)
+    const nested = roots.filter((_, at) => paths.some((other, from) => from !== at && paths[at].startsWith(other)))
+    if (nested.length === 0) return
+
+    throw new Error(
+        'jaad: sections overlap\n' +
+            nested
+                .map((root) => `  ${root.section ?? 'docsDir'}: ${relative(cwd, root.dir)} is, or is inside, another`)
+                .join('\n') +
+            '\nGive every section, and docsDir, a directory of its own.',
+    )
+}
+
+/**
+ * The docs, and the locale codes their directories are written in.
+ * `docsDirSet` tells whether the user set `docsDir`: alongside sections, only
+ * then does it hold pages.
+ */
+export function resolveDocsConfig(
+    config: DocsConfig,
+    lang: string,
+    docsDirSet: boolean,
+    repo: RepoInfo | null,
+    cwd: string,
+): { docs: DocsResolvedConfig; locales: string[] } {
+    const sections = resolveSections(config, repo)
+    const docs: DocsResolvedConfig = {
+        base: normaliseBasePath(config.routeBase),
+        dir: config.docsDir,
+        dirInUse: sections.length === 0 || docsDirSet,
+        sections,
+        editBase: resolveEditBase(config.editLink, repo, config.docsDir),
+    }
+
+    const roots = docsRoots(docs, cwd)
+    assertSeparateRoots(roots, cwd)
+    const locales = resolveLocales(config, lang, roots)
+
+    const ambiguous = sections.find((section) => locales.includes(section.key))
+    if (ambiguous) {
+        throw new Error(`jaad: section "${ambiguous.key}" has the name of a language the docs are written in`)
+    }
+
+    return { docs, locales }
+}
+
+/** Where the markdown lives: `dir` when in use, then the directory of every section. */
+export function docsRoots(docs: Pick<DocsResolvedConfig, 'dir' | 'dirInUse' | 'sections'>, cwd: string): DocsRoot[] {
+    return [
+        ...(docs.dirInUse ? [{ dir: resolve(cwd, docs.dir) }] : []),
+        ...docs.sections.map((section) => ({ dir: resolve(cwd, section.dir), section: section.key })),
+    ]
+}
+
+/** Directory names win; `locales` only overrides what detection found. */
+function resolveLocales(config: DocsConfig, lang: string, roots: DocsRoot[]): string[] {
+    if (config.locales === false) return []
+
+    const perRoot = roots.map((root) => resolveLocalesIn(root.dir, config, lang))
+    const [first, ...rest] = perRoot
+    const differing = rest.find((locales) => locales.join() !== first.join())
+    if (differing) {
+        throw new Error(
+            'jaad: sections disagree on their languages\n' +
+                `  found ${first.join(', ') || 'none'} and ${differing.join(', ') || 'none'}\n` +
+                'Give every section the same locale directories, or none.',
+        )
+    }
+    return first
+}
+
+function resolveLocalesIn(docsDir: string, config: DocsConfig, lang: string): string[] {
+    const locales = Array.isArray(config.locales) ? config.locales : detectLocales(docsDir, lang)
+    // A pinned list skips detection, and with it the missing-directory guard;
+    // the integration warns about that case with better words than readdir does.
+    if (locales.length === 0 || !existsSync(docsDir)) return []
+
+    validateLocaleTree(docsDir, locales, lang)
+    return locales.map((locale) => locale.toLowerCase()).toSorted()
+}

package/src/docs/content.ts

@@ -0,0 +1,36 @@
+import { frontmatterFields } from '@jaamd/astro/frontmatter'
+import { glob } from 'astro/loaders'
+import { z } from 'astro/zod'
+import { defineCollection } from 'astro:content'
+import config from 'virtual:jaad/config'
+import { collectionIdFor, collectionName } from './model/ids.ts'
+
+const LOCALES = config.locales.map((locale) => locale.code)
+
+/** The markdown of one directory, as the pages of `section` when there is one. */
+const docs = (base: string, section?: string) =>
+    defineCollection({
+        loader: glob({
+            pattern: '**/*.md',
+            base,
+            // Keep URLs file-driven even if markdown contains an unrelated slug field.
+            generateId: ({ entry }) => collectionIdFor(entry, section, LOCALES),
+        }),
+        // Every field is optional: markdown without frontmatter works as-is.
+        schema: z.object({
+            ...frontmatterFields(z),
+            /** Shorter label, in navigation only. */
+            label: z.string().optional(),
+            /** Pairs this page with its translations when the slugs differ. */
+            translationKey: z.string().optional(),
+            /** Replaces the filename prefix number. */
+            order: z.number().int().optional(),
+        }),
+    })
+
+/** `docsPages` for `docsDir`, and one collection per section: each watches its
+ *  own directory. */
+export const collections = Object.fromEntries([
+    ...(config.docs.dirInUse ? [[collectionName(), docs(config.docs.dir)]] : []),
+    ...config.docs.sections.map((section) => [collectionName(section.key), docs(section.dir, section.key)]),
+])

package/src/docs/endpoints.ts

@@ -0,0 +1,89 @@
+import type { DocsPage } from './model/tree.ts'
+import config from 'virtual:jaad/config'
+import { getDocsTree } from './collection.ts'
+import { formatChapterTitle } from './model/ids.ts'
+import { pageDescription } from './model/rendered.ts'
+import { SECTIONS, docsUrls } from './runtime.ts'
+import { buildSearchIndex } from './search-index.ts'
+import { docsMarkdownHref } from './urls.ts'
+
+export async function searchIndexResponse(locale?: string): Promise<Response> {
+    const index = buildSearchIndex(await getDocsTree(locale), SECTIONS)
+
+    return new Response(JSON.stringify(index), {
+        headers: { 'Content-Type': 'application/json; charset=utf-8' },
+    })
+}
+
+interface Row {
+    title: string
+    slug: string
+    description: string | null
+}
+
+/** Plain-text index of every page, per the llms.txt convention. */
+export async function llmsResponse(site: URL | undefined, locale?: string): Promise<Response> {
+    const { pages: sortedPages } = await getDocsTree(locale)
+
+    const markdownHref = (slug: string): string => {
+        const href = docsMarkdownHref(slug, docsUrls(locale))
+        return site ? new URL(href, site.origin).href : href
+    }
+
+    const toLine = (row: Row): string =>
+        `- [${row.title}](${markdownHref(row.slug)})${row.description ? `: ${row.description}` : ''}`
+
+    /** Standalone pages first, then one heading per chapter. */
+    const outline = (pages: DocsPage[], heading: string): string[] => {
+        const standalone: Row[] = []
+        const chapters = new Map<string, Row[]>()
+
+        for (const page of pages) {
+            const { chapter, title } = page
+            const row: Row = {
+                title,
+                slug: page.slug,
+                description: page.data.description ?? pageDescription(page.source.rendered, title),
+            }
+
+            if (!chapter) {
+                standalone.push(row)
+                continue
+            }
+
+            const rows = chapters.get(chapter) ?? []
+            if (rows.length === 0) chapters.set(chapter, rows)
+            rows.push(row)
+        }
+
+        return [
+            ...(standalone.length > 0 ? [standalone.map(toLine).join('\n')] : []),
+            ...[...chapters].map(
+                ([chapter, rows]) =>
+                    `${heading} ${formatChapterTitle(chapter) ?? chapter}\n\n${rows.map(toLine).join('\n')}`,
+            ),
+        ]
+    }
+
+    // With sections, the pages outside them come first; each section is a
+    // heading, and its chapters sit one level below.
+    const loose = sortedPages.filter((page) => !page.section)
+    const sections: string[] =
+        SECTIONS.length === 0
+            ? outline(sortedPages, '##')
+            : [
+                  ...(loose.length > 0 ? outline(loose, '##') : []),
+                  ...SECTIONS.flatMap((section) => {
+                      const pages = sortedPages.filter((page) => page.section === section.key)
+                      return pages.length > 0 ? [`## ${section.label}`, ...outline(pages, '###')] : []
+                  }),
+              ]
+
+    const content = [`# ${config.title}`, ...(config.description ? [`> ${config.description}`] : []), ...sections].join(
+        '\n\n',
+    )
+
+    return new Response(content + '\n', {
+        headers: { 'Content-Type': 'text/plain; charset=utf-8' },
+    })
+}

package/src/docs/integration.ts

@@ -0,0 +1,249 @@
+import type { JaadResolvedConfig } from '../config.ts'
+import type { DocsRoot } from './config.ts'
+import type { AstroIntegration } from 'astro'
+import { existsSync, readFileSync, readdirSync } from 'node:fs'
+import { join, relative } from 'node:path'
+import { fileURLToPath, pathToFileURL } from 'node:url'
+import { prefixedLocales } from '../site/locales.ts'
+import { normaliseBasePath } from '../site/urls.ts'
+import { docsRoots } from './config.ts'
+import { rehypeDocLinks, satteriDocLinks } from './link-plugins.ts'
+import { getDocCollectionId, splitDocLocale } from './model/ids.ts'
+import { buildDocsTree, type DocsSource } from './model/tree.ts'
+import { docsPageHref, type DocsUrlOptions } from './urls.ts'
+
+type SetupParams = Parameters<NonNullable<AstroIntegration['hooks']['astro:config:setup']>>[0]
+
+const DOCS_FRAME_ID = 'virtual:jaad/docs-frame'
+const RESOLVED_DOCS_FRAME = '\0' + DOCS_FRAME_ID
+
+/** The frame around every docs page: the project's own, or JAAD's. */
+function docsFrameVirtualPlugin(docsFrame: () => string) {
+    return {
+        name: 'jaad:docs-frame',
+        resolveId: (source: string) => (source === DOCS_FRAME_ID ? RESOLVED_DOCS_FRAME : null),
+        load: (id: string) =>
+            id === RESOLVED_DOCS_FRAME ? `export { default } from ${JSON.stringify(docsFrame())};` : null,
+    }
+}
+
+/** A named url that redirects to its page's canonical one. */
+export interface DocsAlias {
+    locale?: string
+    slug: string
+}
+
+export interface IntegrationState {
+    deploymentBase: string
+    aliases: DocsAlias[]
+    docsFrame: string
+}
+
+const INDEX_PAGE_NAMES = ['index.astro', 'index.md', 'index.mdx', 'index.html', 'index.js', 'index.ts']
+
+const NOT_FOUND_PAGE_NAMES = ['404.astro', '404.md', '404.mdx', '404.html', '404.js', '404.ts']
+
+/** A plugin this integration registered on an earlier setup run. */
+const isDocLinks = (plugin: unknown): boolean =>
+    (typeof plugin === 'function' || (typeof plugin === 'object' && plugin !== null)) &&
+    ['jaad-doc-links', 'jaadDocLinks'].includes((plugin as { name?: string }).name ?? '')
+
+const routeEntrypoint = (file: string) => fileURLToPath(new URL(`./routes/${file}`, import.meta.url))
+
+export function shouldInjectNotFound(docsBase: string, srcDir: URL): boolean {
+    return docsBase === '' && !NOT_FOUND_PAGE_NAMES.some((name) => existsSync(new URL(`pages/${name}`, srcDir)))
+}
+
+/** The two fields that move the first page of the docs or of a section. */
+function readFrontmatter(source: string): { order?: number; draft?: boolean } {
+    const block = /^---\r?\n([\s\S]*?)\r?\n---/.exec(source)
+    if (!block) return {}
+
+    const order = /^order:\s*(-?\d+)\s*$/m.exec(block[1])
+    const draft = /^draft:\s*(true|false)\s*$/m.exec(block[1])
+    return {
+        order: order ? Number(order[1]) : undefined,
+        draft: draft ? draft[1] === 'true' : undefined,
+    }
+}
+
+/** The aliases of every locale. The content collection is not available this
+ *  early, so the pages are read from disk. */
+export function findAliases(roots: DocsRoot[], locales: string[] = []): DocsAlias[] {
+    const sources: DocsSource[] = []
+
+    const visit = (root: DocsRoot, current: string) => {
+        for (const entry of readdirSync(current, { withFileTypes: true }).toSorted((a, b) =>
+            a.name.localeCompare(b.name),
+        )) {
+            const file = join(current, entry.name)
+            if (entry.isDirectory()) visit(root, file)
+            else if (entry.isFile() && entry.name.endsWith('.md')) {
+                const front = readFrontmatter(readFileSync(file, 'utf8'))
+                if (front.draft) continue
+
+                const { locale, id } = splitDocLocale(getDocCollectionId(relative(root.dir, file)), locales)
+                sources.push({
+                    id,
+                    path: id,
+                    locale: locale ?? undefined,
+                    section: root.section,
+                    data: { order: front.order },
+                })
+            }
+        }
+    }
+    for (const root of roots) {
+        if (existsSync(root.dir)) visit(root, root.dir)
+    }
+
+    const sections = roots.flatMap((root) => root.section ?? [])
+    return (locales.length > 0 ? locales : [undefined]).flatMap((locale) => {
+        // The slugs are all that is read: the urls need no mount.
+        const tree = buildDocsTree(
+            sources.filter((source) => source.locale === locale),
+            { sections, urls: { docsBase: '' } },
+        )
+        return tree.pages.flatMap((page) => page.aliases.map((slug) => ({ locale, slug })))
+    })
+}
+
+export function getInjectedRoutes(docsBase: string, locales: string[] = []): [string, string][] {
+    // `[...slug]` already absorbs "it/guide" and "it". Only the two fixed
+    // endpoints need a route of their own, and `[locale]` hands them the code.
+    const perLocale: [string, string][] =
+        locales.length > 0
+            ? [
+                  [`${docsBase}/[locale]/search-index.json`, 'search-index-locale.json.ts'],
+                  [`${docsBase}/[locale]/llms.txt`, 'llms-locale.txt.ts'],
+              ]
+            : []
+
+    return [
+        [docsBase, 'docs-index.astro'],
+        [`${docsBase}/search-index.json`, 'search-index.json.ts'],
+        [`${docsBase}/llms.txt`, 'llms.txt.ts'],
+        ...perLocale,
+        [`${docsBase}/[...slug]`, 'docs-slug.astro'],
+        [`${docsBase}/[...slug].md`, 'docs-slug.md.ts'],
+    ]
+}
+
+export function createIntegrationState(): IntegrationState {
+    return {
+        deploymentBase: '',
+        aliases: [],
+        docsFrame: fileURLToPath(new URL('./layouts/DefaultDocsFrame.astro', import.meta.url)),
+    }
+}
+
+/** Routes, the docs frame, the 404 page, aliases and the link plugins. */
+export function setupDocs(
+    { config: astroConfig, updateConfig, injectRoute, addWatchFile, logger }: SetupParams,
+    config: JaadResolvedConfig,
+    state: IntegrationState,
+    discoverAliases: boolean,
+): void {
+    updateConfig({ vite: { plugins: [docsFrameVirtualPlugin(() => state.docsFrame)] } })
+
+    for (const [pattern, entrypoint] of getInjectedRoutes(
+        config.docs.base,
+        prefixedLocales(config.locales, config.defaultLocale),
+    )) {
+        injectRoute({
+            pattern,
+            entrypoint: routeEntrypoint(entrypoint),
+            prerender: true,
+        })
+    }
+
+    const customDocsFrame = new URL('jaad/DocsFrame.astro', astroConfig.srcDir)
+    if (existsSync(customDocsFrame)) {
+        state.docsFrame = fileURLToPath(customDocsFrame)
+        addWatchFile(customDocsFrame)
+    }
+
+    if (shouldInjectNotFound(config.docs.base, astroConfig.srcDir)) {
+        injectRoute({
+            pattern: '/404',
+            entrypoint: routeEntrypoint('404.astro'),
+            prerender: true,
+        })
+    }
+
+    const root = fileURLToPath(astroConfig.root)
+    const roots = docsRoots(config.docs, root)
+    const locales = config.locales.map((locale) => locale.code)
+
+    const missing = roots.filter(({ dir }) => !existsSync(dir))
+    for (const { dir } of missing) {
+        logger.warn(
+            `${relative(root, dir)} does not exist, so it adds no pages. ` +
+                'Create it, or point docsDir or the section at your markdown.',
+        )
+    }
+    if (discoverAliases && missing.length < roots.length) {
+        state.aliases = findAliases(roots, locales)
+    }
+    for (const { dir } of roots) addWatchFile(pathToFileURL(dir))
+
+    const links = {
+        roots,
+        locales,
+        urls: (locale?: string): DocsUrlOptions => ({
+            docsBase: config.docs.base,
+            deploymentBase: normaliseBasePath(astroConfig.base),
+            locale,
+            defaultLocale: config.defaultLocale,
+        }),
+    }
+    // New arrays: a shared processor would stack duplicates across setup runs.
+    const processor = astroConfig.markdown.processor as {
+        name: string
+        options: { hastPlugins?: unknown[]; rehypePlugins?: unknown[] }
+    }
+    if (processor.name === 'satteri') {
+        processor.options.hastPlugins = [
+            ...(processor.options.hastPlugins ?? []).filter((plugin) => !isDocLinks(plugin)),
+            satteriDocLinks(links),
+        ]
+    } else if (processor.name === 'unified') {
+        processor.options.rehypePlugins = [
+            ...(processor.options.rehypePlugins ?? []).filter((plugin) => !isDocLinks(plugin)),
+            rehypeDocLinks(links),
+        ]
+    }
+
+    if (config.docs.base === '') {
+        const ownIndex = INDEX_PAGE_NAMES.find((name) => existsSync(new URL(`pages/${name}`, astroConfig.srcDir)))
+        if (ownIndex) {
+            logger.warn(
+                `${ownIndex} owns the site root while JAAD docs are mounted there. ` +
+                    'Set routeBase: "/docs" to keep a landing page and mount the docs below it.',
+            )
+        }
+    }
+}
+
+const withoutTrailingSlash = (value: string) => (value.length > 1 ? value.replace(/\/$/, '') : value)
+
+export function createSitemapFilter(
+    docsBase: string,
+    state: Pick<IntegrationState, 'deploymentBase' | 'aliases'>,
+    defaultLocale?: string,
+): (page: string) => boolean {
+    return (page) => {
+        if (state.aliases.length === 0) return true
+
+        const pathname = withoutTrailingSlash(new URL(page).pathname)
+        return !state.aliases.some((alias) => {
+            const urls: DocsUrlOptions = {
+                docsBase,
+                deploymentBase: state.deploymentBase,
+                locale: alias.locale,
+                defaultLocale,
+            }
+            return pathname === withoutTrailingSlash(docsPageHref(alias.slug, urls))
+        })
+    }
+}

package/src/docs/layouts/DefaultDocsFrame.astro

@@ -0,0 +1,33 @@
+---
+import type { DocsFrameProps } from '../advanced.ts'
+
+type Props = DocsFrameProps
+---
+
+<div data-jaad-default-frame class="docs-frame">
+    <slot name="header" />
+
+    <div class="docs-container">
+        <slot name="sidebar" />
+
+        <div class="docs-main">
+            <main class="docs-page-main">
+                <slot name="mobile-navigation" />
+
+                <article>
+                    <slot name="breadcrumbs" />
+                    <slot name="content" />
+                </article>
+
+                <slot name="page-navigation" />
+            </main>
+        </div>
+
+        <aside class="docs-sidebar-right jaad-sidebar">
+            <slot name="table-of-contents" />
+            <slot name="page-actions" />
+        </aside>
+
+        <slot name="footer" />
+    </div>
+</div>