UNPKG

@alauda/doom

Version:

Doctor Doom making docs.

23 lines (22 loc) 1.11 kB
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime"; import BananaSlug from 'github-slugger'; import { Children, useMemo } from 'react'; import { X } from './_X.js'; import { useUid } from './_context.js'; // TODO: use context to simplify the usage of `slugger` export const HeadingTitle = ({ slug, slugger, level, children, }) => { const uid = useUid(); const HeadingComponents = useMemo(() => { return [null, X.h1, X.h2, X.h3, X.h4, X.h5, X.h6]; }, []); const HeadingComponent = HeadingComponents[level]; const slugFromChildren = useMemo(() => // eslint-disable-next-line @eslint-react/no-children-to-array Children.toArray(children) .filter((it) => typeof it === 'string') .join(''), [children]); const id = useMemo(() => [uid, slug || slugger?.slug(slugFromChildren)] .filter(Boolean) .join('-') || undefined, [uid, slug, slugger, slugFromChildren]); return (_jsxs(HeadingComponent, { id: id, children: [children, _jsx(X.a, { className: "header-anchor", href: `#${id}`, "aria-hidden": true, children: "#" })] })); };