UNPKG

@amsterdam/design-system-react

Version:

All React components from the Amsterdam Design System. Use it to compose pages in your website or application.

22 lines (21 loc) 1.08 kB
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime"; /** * @license EUPL-1.2+ * Copyright Gemeente Amsterdam */ import clsx from 'clsx'; import { forwardRef } from 'react'; import { TableOfContentsLink } from './TableOfContentsLink'; import { TableOfContentsList } from './TableOfContentsList'; import { Heading } from '../Heading'; const TableOfContentsRoot = forwardRef(({ children, className, heading, headingLevel = 2, ...restProps }, ref) => { return (_jsxs("nav", { ...restProps, className: clsx('ams-table-of-contents', className), ref: ref, children: [heading && (_jsx(Heading, { className: "ams-table-of-contents__heading", level: headingLevel, size: "level-4", children: heading })), children] })); }); TableOfContentsRoot.displayName = 'TableOfContents'; /** * @see {@link https://designsystem.amsterdam/?path=/docs/components-navigation-table-of-contents--docs Table Of Contents docs at Amsterdam Design System} */ export const TableOfContents = Object.assign(TableOfContentsRoot, { Link: TableOfContentsLink, List: TableOfContentsList, });