@brillout/docpress 0.9.8 → 0.10.1

package/dist/MenuModal.d.ts

@@ -1,13 +0,0 @@
-export { MenuModal };
-export { toggleMenuModal };
-export { openMenuModal };
-export { closeMenuModal };
-export { closeMenuModalWithDelay };
-import React from 'react';
-declare function MenuModal({ isTopNav }: {
-    isTopNav: boolean;
-}): React.JSX.Element;
-declare function toggleMenuModal(): void;
-declare function openMenuModal(): void;
-declare function closeMenuModal(): void;
-declare function closeMenuModalWithDelay(delay: number): void;

package/dist/MenuModal.js

@@ -1,124 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-export { MenuModal };
-export { toggleMenuModal };
-export { openMenuModal };
-export { closeMenuModal };
-export { closeMenuModalWithDelay };
-import React from 'react';
-import { usePageContext } from './renderer/usePageContext';
-import { NavigationContent } from './navigation/Navigation';
-import { css } from './utils/css';
-import { containerQueryMobileLayout, containerQueryMobileMenu } from './Layout';
-import { NavSecondaryContent } from './NavSecondaryContent';
-import { getViewportWidth } from './utils/getViewportWidth';
-import { Style } from './utils/Style';
-var closeMenuModalPending;
-function MenuModal(_a) {
-    var isTopNav = _a.isTopNav;
-    return (React.createElement(React.Fragment, null,
-        React.createElement(Style, null, getStyle()),
-        React.createElement("div", { id: "menu-modal", className: "link-hover-animation add-transition", style: {
-                position: isTopNav ? 'absolute' : 'fixed',
-                width: '100%',
-                /* Firefox doesn't support `dvh` yet: https://caniuse.com/?search=dvh
-                 * - Always use `dvh` instead of `vh` once Firefox supports it.
-                 * - We use dvh because of mobile: https://stackoverflow.com/questions/37112218/css3-100vh-not-constant-in-mobile-browser/72245072#72245072
-                height: 'calc(100dvh - var(--nav-head-height))',
-                /*/
-                height: 'calc(100vh - var(--nav-head-height))',
-                maxHeight: 'calc(100dvh - var(--nav-head-height))',
-                //*/
-                top: 'var(--nav-head-height)',
-                left: 0,
-                zIndex: 9999,
-                overflow: 'scroll',
-                background: '#ededef',
-                transitionProperty: 'opacity',
-                // https://github.com/brillout/docpress/issues/23
-                // https://stackoverflow.com/questions/64514118/css-overscroll-behavior-contain-when-target-element-doesnt-overflow
-                // https://stackoverflow.com/questions/9538868/prevent-body-from-scrolling-when-a-modal-is-opened
-                overscrollBehavior: 'none',
-            }, onMouseOver: openMenuModal, onMouseLeave: closeMenuModal },
-            React.createElement("div", { style: {
-                    // Place <LinksBottom /> to the bottom
-                    display: 'flex',
-                    flexDirection: 'column',
-                    minHeight: 'calc(100dvh - var(--nav-head-height))',
-                    justifyContent: 'space-between',
-                    // We don't set `container` to parent beacuse of a Chrome bug (showing a blank <MenuModal>)
-                    container: 'container-viewport / inline-size',
-                } },
-                React.createElement(Nav, null),
-                React.createElement(NavSecondary, { className: "show-only-for-mobile" })),
-            React.createElement(CloseButton, { className: "show-only-for-mobile" }))));
-}
-function Nav() {
-    var pageContext = usePageContext();
-    var navItems = pageContext.navItemsAll;
-    return React.createElement(NavigationContent, { columnLayout: true, navItems: navItems });
-}
-function NavSecondary(_a) {
-    var className = _a.className;
-    return (React.createElement("div", { className: className, style: {
-            display: 'flex',
-            justifyContent: 'center',
-            marginTop: 20,
-        } },
-        React.createElement(NavSecondaryContent, { style: { height: 70 } })));
-}
-function getStyle() {
-    return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\nhtml:not(.menu-modal-show) #menu-modal {\n  opacity: 0;\n  pointer-events: none;\n}\n@container container-viewport (min-width: ", "px) {\n  #menu-modal .nav-item-level-3 {\n    display: none;\n  }\n}\n@media(max-width: ", "px) {\n  #menu-modal {\n    --nav-head-height: 0px !important;\n  }\n}\n@media(min-width: ", "px) {\n  .show-only-for-mobile {\n    display: none !important;\n  }\n}\n"], ["\nhtml:not(.menu-modal-show) #menu-modal {\n  opacity: 0;\n  pointer-events: none;\n}\n@container container-viewport (min-width: ", "px) {\n  #menu-modal .nav-item-level-3 {\n    display: none;\n  }\n}\n@media(max-width: ", "px) {\n  #menu-modal {\n    --nav-head-height: 0px !important;\n  }\n}\n@media(min-width: ", "px) {\n  .show-only-for-mobile {\n    display: none !important;\n  }\n}\n"])), containerQueryMobileLayout, containerQueryMobileMenu, containerQueryMobileMenu + 1);
-}
-function CloseButton(_a) {
-    var className = _a.className;
-    return (React.createElement("div", { className: className, onClick: toggleMenuModal, style: { position: 'fixed', top: 0, right: 0, zIndex: 10, padding: 11, cursor: 'pointer' }, "aria-label": 'Escape\nCtrl\xa0+\xa0M', "data-label-shift": true },
-        React.createElement("svg", { width: "48.855", height: "48.855", version: "1.1", viewBox: "0 0 22.901 22.901", xmlns: "http://www.w3.org/2000/svg" },
-            React.createElement("circle", { cx: "11.45", cy: "11.45", r: "10.607", fill: "#ececec", stroke: "#666", strokeDashoffset: "251.44", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "1.6875", style: { paintOrder: 'normal' } }),
-            React.createElement("path", { d: "m7.5904 6.2204 3.86 3.86 3.84-3.84a0.92 0.92 0 0 1 0.66-0.29 1 1 0 0 1 1 1 0.9 0.9 0 0 1-0.27 0.66l-3.89 3.84 3.89 3.89a0.9 0.9 0 0 1 0.27 0.61 1 1 0 0 1-1 1 0.92 0.92 0 0 1-0.69-0.27l-3.81-3.86-3.85 3.85a0.92 0.92 0 0 1-0.65 0.28 1 1 0 0 1-1-1 0.9 0.9 0 0 1 0.27-0.66l3.89-3.84-3.89-3.89a0.9 0.9 0 0 1-0.27-0.61 1 1 0 0 1 1-1c0.24 3e-3 0.47 0.1 0.64 0.27z", fill: "#666", stroke: "#666", strokeWidth: ".11719" }))));
-}
-function toggleMenuModal() {
-    document.documentElement.classList.toggle('menu-modal-show');
-    if (document.documentElement.classList.contains('menu-modal-show') &&
-        getViewportWidth() < containerQueryMobileLayout) {
-        autoScroll();
-    }
-}
-function autoScroll() {
-    var nav = document.querySelector('#menu-modal .navigation-content');
-    var href = window.location.pathname;
-    var navLinks = Array.from(nav.querySelectorAll("a[href=\"".concat(href, "\"]")));
-    var navLink = navLinks[0];
-    if (!navLink)
-        return;
-    // None of the following seemes to be working: https://stackoverflow.com/questions/19669786/check-if-element-is-visible-in-dom
-    if (findCollapsibleEl(navLink).classList.contains('collapsible-collapsed'))
-        return;
-    navLink.scrollIntoView({
-        behavior: 'instant',
-        block: 'center',
-        inline: 'start',
-    });
-}
-function findCollapsibleEl(navLink) {
-    var parentEl = navLink;
-    while (parentEl) {
-        if (parentEl.classList.contains('collapsible'))
-            return parentEl;
-        parentEl = parentEl.parentElement;
-    }
-    return null;
-}
-function openMenuModal() {
-    clearTimeout(closeMenuModalPending);
-    document.documentElement.classList.add('menu-modal-show');
-}
-function closeMenuModal() {
-    document.documentElement.classList.remove('menu-modal-show');
-}
-function closeMenuModalWithDelay(delay) {
-    closeMenuModalPending = setTimeout(closeMenuModal, delay);
-}
-var templateObject_1;

package/dist/NavSecondaryContent.d.ts

@@ -1,6 +0,0 @@
-export { NavSecondaryContent };
-import React from 'react';
-import '@docsearch/css';
-declare function NavSecondaryContent(props: {
-    style?: React.CSSProperties;
-}): React.JSX.Element;

package/dist/NavSecondaryContent.js

@@ -1,57 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-export { NavSecondaryContent };
-import React from 'react';
-import iconGithub from './icons/github.svg';
-import iconTwitter from './icons/twitter.svg';
-import iconDiscord from './icons/discord.svg';
-import iconChangelog from './icons/changelog.svg';
-import iconLanguages from './icons/languages.svg';
-import { usePageContext } from './renderer/usePageContext';
-import '@docsearch/css';
-function NavSecondaryContent(props) {
-    var pageContext = usePageContext();
-    var _a = pageContext.config, projectInfo = _a.projectInfo, i18n = _a.i18n;
-    var iconI18n = !i18n ? null : (React.createElement(LinkIcon, { className: "decolorize-4", icon: iconLanguages, href: '/languages', style: { height: 21, position: 'relative', top: 0, left: 0 } }));
-    return (React.createElement("div", __assign({}, props, { style: __assign({ display: 'flex', alignItems: 'center' }, props.style), className: "desktop-fade" }),
-        iconI18n,
-        projectInfo.discordInvite && (React.createElement(LinkIcon, { className: "decolorize-6", icon: iconDiscord, href: projectInfo.discordInvite })),
-        React.createElement(LinkIcon, { className: "decolorize-4", icon: iconTwitter, href: projectInfo.twitterProfile }),
-        React.createElement(LinkIcon, { className: "decolorize-4", icon: iconGithub, href: projectInfo.githubRepository }),
-        React.createElement(ChangelogButton, null)));
-}
-function ChangelogButton() {
-    var pageContext = usePageContext();
-    var projectInfo = pageContext.config.projectInfo;
-    return (React.createElement("a", { href: "".concat(projectInfo.githubRepository, "/blob/main/CHANGELOG.md"), className: "colorize-on-hover", style: {
-            display: 'flex',
-            alignItems: 'center',
-            padding: '0 5px',
-            height: '100%',
-        } },
-        React.createElement("div", { className: "button", style: {
-                display: 'flex',
-                alignItems: 'center',
-                padding: '2px 10px',
-                fontSize: '0.97em',
-            } },
-            React.createElement("span", { id: "version-number", className: "decolorize-7" },
-                "v",
-                projectInfo.projectVersion),
-            React.createElement("img", { className: "decolorize-6", src: iconChangelog, height: 16, style: { marginLeft: 6 } }))));
-}
-function LinkIcon(_a) {
-    var className = _a.className, icon = _a.icon, href = _a.href, style = _a.style;
-    return (React.createElement(React.Fragment, null,
-        React.createElement("a", { className: "colorize-on-hover", href: href, style: { padding: 5, display: 'inline-flex', lineHeight: 0, height: '100%', alignItems: 'center' } },
-            React.createElement("img", { className: className, src: icon, height: "20", style: style }))));
-}

package/dist/autoScrollNav.d.ts

@@ -1,3 +0,0 @@
-export { autoScrollNav };
-export declare const autoScrollNav_SSR: string;
-declare function autoScrollNav(): void;

package/dist/autoScrollNav.js

@@ -1,35 +0,0 @@
-export { autoScrollNav };
-export var autoScrollNav_SSR = "autoScrollNav();".concat(autoScrollNav.toString());
-// - We cannot use TypeScript syntax because of autoScrollNav_SSR
-// - We have to save & restore `document.documentElement.scrollTop` because scrollIntoView() scrolls the main view. (I don't know why).
-//   - Failed alternatives:
-//     - scrollIntoViewIfNeeded() (https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoViewIfNeeded) would work (it doesn't scroll the main view) but Firefox doesn't support it.
-//     - Doesn't work: the scrolling is off by hundreds of px (I guess because this function runs too early while the page is still rendering).
-//       ```js
-//       const offset = navLink.offsetTop - (window.innerHeight / 2)
-//       navigationContainerEl.scrollTop = offset
-//       ```
-//     - Doesn't work: scrollIntoView() still scrolls the main view
-//       ```js
-//       const overflowOriginal = document.documentElement.style.overflow
-//       document.documentElement.style.overflow = 'hidden'
-//       // ...
-//       document.documentElement.style.overflow = overflowOriginal
-//       ```
-function autoScrollNav() {
-    var nav = document.querySelector('#nav-left .navigation-content');
-    if (!nav)
-        return;
-    var href = window.location.pathname;
-    var navLinks = Array.from(nav.querySelectorAll("a[href=\"".concat(href, "\"]")));
-    var navLink = navLinks[0];
-    if (!navLink)
-        return;
-    var scrollTopOriginal = document.documentElement.scrollTop;
-    navLink.scrollIntoView({
-        behavior: 'instant',
-        block: 'center',
-        inline: 'start',
-    });
-    document.documentElement.scrollTop = scrollTopOriginal;
-}

package/dist/components/EditPageNote.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-export { EditPageNote };
-declare function EditPageNote({ pageContext }: {
-    pageContext: {
-        urlPathname: string;
-    };
-}): React.JSX.Element;

package/dist/components/EditPageNote.js

@@ -1,11 +0,0 @@
-import React from 'react';
-import { RepoLink } from './RepoLink';
-export { EditPageNote };
-function EditPageNote(_a) {
-    var pageContext = _a.pageContext;
-    var text = (React.createElement(React.Fragment, null,
-        React.createElement("span", { style: { fontFamily: 'emoji' } }, "\u270D"),
-        " Edit this page"));
-    return (React.createElement("div", { style: { marginTop: 50 } },
-        React.createElement(RepoLink, { path: '/docs/pages' + pageContext.urlPathname + '/+Page.mdx', text: text, editMode: true })));
-}

package/dist/docsearch/SearchLink.d.ts

@@ -1,4 +0,0 @@
-export { SearchLink };
-import React from 'react';
-type PropsAnchor = React.HTMLProps<HTMLAnchorElement>;
-declare function SearchLink(props: PropsAnchor): React.JSX.Element;

package/dist/docsearch/SearchLink.js

@@ -1,25 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-export { SearchLink };
-import React from 'react';
-import { openDocsearchModal } from './toggleDocsearchModal';
-function SearchLink(props) {
-    return (React.createElement("a", __assign({}, props, { style: __assign({ height: '100%', display: 'flex', alignItems: 'center', cursor: 'pointer' }, props.style), className: ['colorize-on-hover', props.className].filter(Boolean).join(' '), onClick: function (ev) {
-            ev.preventDefault();
-            openDocsearchModal();
-        }, "aria-label": 'Ctrl\xa0+\xa0K' }),
-        React.createElement(SearchIcon, null),
-        "Search"));
-}
-function SearchIcon() {
-    return (React.createElement("span", { style: { marginRight: 'var(--icon-text-padding)', fontSize: '1.1em' }, className: "decolorize-7 desktop-fade" }, "\uD83D\uDD0D"));
-}

package/dist/docsearch/toggleDocsearchModal.d.ts

@@ -1,4 +0,0 @@
-export { closeDocsearchModal };
-export { openDocsearchModal };
-declare function closeDocsearchModal(): void;
-declare function openDocsearchModal(): void;

package/dist/docsearch/toggleDocsearchModal.js

@@ -1,26 +0,0 @@
-export { closeDocsearchModal };
-export { openDocsearchModal };
-import { assert } from '../utils/client';
-function closeDocsearchModal() {
-    if (isClosed())
-        return;
-    toggle();
-}
-function openDocsearchModal() {
-    if (!isClosed())
-        return;
-    toggle();
-}
-// There doesn't seem be an official API to open/close the DocSearch modal:
-// - https://github.com/algolia/docsearch/issues/2321
-// - https://github.com/algolia/docsearch/blob/90f3c6aabbc324fe49e9a1dfe0906fcd4d90f27b/packages/docsearch-react/src/DocSearch.tsx#L52
-function toggle() {
-    // Trigger https://github.com/algolia/docsearch/blob/90f3c6aabbc324fe49e9a1dfe0906fcd4d90f27b/packages/docsearch-react/src/useDocSearchKeyboardEvents.ts#L71
-    window.dispatchEvent(new KeyboardEvent('keydown', { key: 'k', ctrlKey: true }));
-}
-function isClosed() {
-    var test1 = !document.body.classList.contains('DocSearch--active');
-    var test2 = document.getElementsByClassName('DocSearch-Modal').length === 0;
-    assert(test1 === test2);
-    return test1 || test2;
-}

package/dist/navigation/Collapsible.d.ts

@@ -1,10 +0,0 @@
-export { Collapsible };
-import React from 'react';
-import './Collapsible.css';
-declare function Collapsible({ head, children, disabled, collapsedInit, marginBottomOnExpand, }: {
-    head: (onClick: () => void) => React.ReactNode;
-    children: React.ReactNode;
-    disabled: boolean;
-    collapsedInit: boolean;
-    marginBottomOnExpand?: number;
-}): React.JSX.Element;

package/dist/navigation/Collapsible.js

@@ -1,35 +0,0 @@
-export { Collapsible };
-import React, { useRef, useState } from 'react';
-import { cls } from '../utils/cls';
-import './Collapsible.css';
-function Collapsible(_a) {
-    var head = _a.head, children = _a.children, _b = _a.disabled, disabled = _b === void 0 ? false : _b, collapsedInit = _a.collapsedInit, marginBottomOnExpand = _a.marginBottomOnExpand;
-    var _c = useState(collapsedInit), collapsed = _c[0], setCollapsed = _c[1];
-    var _d = useState(false), isAnimating = _d[0], setIsAnimating = _d[1];
-    var contentRef = useRef(null);
-    var onClick = function () {
-        if (!disabled) {
-            setIsAnimating(true);
-            if (!collapsed) {
-                // If expanding, set height to current scroll height before animation
-                contentRef.current.style.height = "".concat(contentRef.current.scrollHeight, "px");
-                // Force a reflow
-                contentRef.current.offsetHeight;
-            }
-            setCollapsed(function (prev) { return !prev; });
-        }
-    };
-    var onTransitionEnd = function () {
-        setIsAnimating(false);
-    };
-    var showContent = disabled ? true : !collapsed;
-    return (React.createElement("div", { className: cls(['collapsible', !disabled && (showContent ? 'collapsible-expanded' : 'collapsible-collapsed')]) },
-        head(onClick),
-        React.createElement("div", { ref: contentRef, onTransitionEnd: onTransitionEnd, style: {
-                height: !showContent ? 0 : isAnimating ? contentRef.current.scrollHeight : 'auto',
-                overflow: 'hidden',
-                transition: 'none 0.3s ease',
-                transitionProperty: 'height, margin-bottom',
-                marginBottom: (showContent && marginBottomOnExpand) || undefined,
-            }, "aria-expanded": showContent }, children)));
-}

package/dist/navigation/Navigation.d.ts

@@ -1,21 +0,0 @@
-export { NavigationContent };
-export type { NavItem };
-import React from 'react';
-import './Navigation.css';
-import '@docsearch/css';
-import '../global.d.ts';
-type NavItem = {
-    level: number;
-    url?: string | null;
-    color?: string;
-    title: string;
-    titleInNav: string;
-    menuModalFullWidth?: true;
-    isColumnEntry?: ColumnMap;
-};
-declare function NavigationContent(props: {
-    navItems: NavItem[];
-    showOnlyRelevant?: true;
-    columnLayout?: true;
-}): React.JSX.Element;
-type ColumnMap = Record<number, number>;

package/dist/navigation/Navigation.js

@@ -1,255 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-// TODO/refactor: rename file and/or component
-export { NavigationContent };
-import React, { useEffect, useState } from 'react';
-import { assert, assertWarning, jsxToTextContent } from '../utils/server';
-import './Navigation.css';
-import { parseTitle } from '../parseTitle';
-import { usePageContext } from '../renderer/usePageContext';
-import '@docsearch/css';
-import '../global.d.ts';
-import { getViewportWidth } from '../utils/getViewportWidth';
-import { navLeftWidthMax, navLeftWidthMin } from '../Layout';
-import { throttle } from '../utils/throttle';
-import { Collapsible } from './Collapsible';
-function NavigationContent(props) {
-    var pageContext = usePageContext();
-    var navItemsWithComputed = getNavItemsWithComputed(props.navItems, pageContext.urlPathname);
-    var navContent;
-    if (!props.columnLayout) {
-        var navItemsRelevant = navItemsWithComputed;
-        if (props.showOnlyRelevant)
-            navItemsRelevant = navItemsRelevant.filter(function (navItemGroup) { return navItemGroup.isRelevant; });
-        navContent = navItemsRelevant.map(function (navItem, i) { return React.createElement(NavItemComponent, { navItem: navItem, key: i }); });
-    }
-    else {
-        assert(!props.showOnlyRelevant);
-        navContent = React.createElement(NavigationWithColumnLayout, { navItemsWithComputed: navItemsWithComputed });
-    }
-    return (React.createElement("div", { className: "navigation-content", style: { marginTop: 10 } }, navContent));
-}
-function NavigationWithColumnLayout(props) {
-    var _a = useState(), viewportWidth = _a[0], setViewportWidth = _a[1];
-    var updateviewportwidth = function () { return setViewportWidth(getViewportWidth()); };
-    useEffect(function () {
-        updateviewportwidth();
-        window.addEventListener('resize', throttle(updateviewportwidth, 300), { passive: true });
-    });
-    var navItemsByColumnLayouts = getNavItemsByColumnLayouts(props.navItemsWithComputed, viewportWidth);
-    return (React.createElement(React.Fragment, null, navItemsByColumnLayouts.map(function (columnLayout, i) { return (React.createElement("div", { key: i }, columnLayout.isFullWidthCategory ? (React.createElement("div", { style: { marginTop: 0 } },
-        React.createElement(ColumnsWrapper, { numberOfColumns: columnLayout.columns.length },
-            React.createElement(Collapsible, { head: function (onClick) { return React.createElement(NavItemComponent, { navItem: columnLayout.navItemLevel1, onClick: onClick }); }, disabled: columnLayout.columns.length > 1, collapsedInit: !columnLayout.navItemLevel1.isRelevant, marginBottomOnExpand: 10 },
-                React.createElement(ColumnsLayout, { className: "collapsible" },
-                    columnLayout.columns.map(function (column, j) { return (React.createElement(Column, { key: j }, column.navItems.map(function (navItem, k) { return (React.createElement(NavItemComponent, { key: k, navItem: navItem })); }))); }),
-                    React.createElement(CategoryBorder, { navItemLevel1: columnLayout.navItemLevel1 })))))) : (React.createElement(ColumnsWrapper, { numberOfColumns: columnLayout.columns.length },
-        React.createElement(ColumnsLayout, null, columnLayout.columns.map(function (column, j) { return (React.createElement(Column, { key: j }, column.categories.map(function (category, k) { return (React.createElement("div", { key: k, style: { marginBottom: 0 } },
-            React.createElement(Collapsible, { head: function (onClick) { return React.createElement(NavItemComponent, { navItem: category.navItemLevel1, onClick: onClick }); }, disabled: columnLayout.columns.length > 1, collapsedInit: !category.navItemLevel1.isRelevant, marginBottomOnExpand: 40 },
-                category.navItems.map(function (navItem, l) { return (React.createElement(NavItemComponent, { key: l, navItem: navItem })); }),
-                React.createElement(CategoryBorder, { navItemLevel1: category.navItemLevel1 })))); }))); })))))); })));
-}
-function Column(_a) {
-    var children = _a.children;
-    return (React.createElement("div", { style: {
-            flexGrow: 1,
-            maxWidth: navLeftWidthMax,
-            display: 'flex',
-            flexDirection: 'column',
-        } }, children));
-}
-function ColumnsWrapper(_a) {
-    var children = _a.children, numberOfColumns = _a.numberOfColumns;
-    return (React.createElement("div", { style: {
-            width: numberOfColumns * (navLeftWidthMax + 20),
-            maxWidth: '100%',
-            margin: 'auto',
-        } }, children));
-}
-function ColumnsLayout(_a) {
-    var children = _a.children, className = _a.className;
-    return (React.createElement("div", { className: className, style: {
-            display: 'flex',
-            justifyContent: 'space-between',
-        } }, children));
-}
-function CategoryBorder(_a) {
-    var navItemLevel1 = _a.navItemLevel1;
-    assert(navItemLevel1.level === 1);
-    return React.createElement("div", { className: "category-border", style: { background: navItemLevel1.color } });
-}
-function NavItemComponent(_a) {
-    var _b;
-    var _c;
-    var navItem = _a.navItem, onClick = _a.onClick;
-    assert([1, 2, 3, 4].includes(navItem.level), navItem);
-    var titleJsx = parseTitle(navItem.title);
-    var titleInNavJsx = parseTitle(navItem.titleInNav);
-    if (navItem.level === 1 || navItem.level === 4) {
-        assert(navItem.url === undefined);
-    }
-    else {
-        var sectionTitle = jsxToTextContent(titleJsx);
-        assertWarning(navItem.url, [
-            "".concat(jsxToTextContent(titleInNavJsx), " is missing a URL hash."),
-            "Add a URL hash with: `## ".concat(sectionTitle, "{#some-hash}`."),
-            /* TODO/eventually: not implemented yet.
-            `Use \`<h2 id="url-hash">${sectionTitle}</h2>\` instead of \`## ${sectionTitle}\`.`,
-            */
-        ].join(' '));
-    }
-    var children = titleInNavJsx;
-    if (navItem.level === 1) {
-        children = (React.createElement(React.Fragment, null,
-            children,
-            React.createElement(Chevron, { className: "collapsible-icon", height: 9 })));
-    }
-    var props = {
-        href: (_c = navItem.url) !== null && _c !== void 0 ? _c : undefined,
-        children: children,
-        onClick: onClick,
-        className: [
-            'nav-item',
-            'nav-item-level-' + navItem.level,
-            navItem.url && navItem.isActive && ' is-active',
-            navItem.isFirstOfItsKind && 'nav-item-first-of-its-kind',
-            navItem.isLastOfItsKind && 'nav-item-last-of-its-kind',
-        ]
-            .filter(Boolean)
-            .join(' '),
-    };
-    if (navItem.level === 1) {
-        props.style = (_b = {},
-            _b['--category-color'] = navItem.color,
-            _b);
-    }
-    if (navItem.level === 2 || navItem.level === 3) {
-        return React.createElement("a", __assign({}, props));
-    }
-    else {
-        return React.createElement("span", __assign({}, props));
-    }
-}
-function getNavItemsByColumnLayouts(navItems, viewportWidth) {
-    if (viewportWidth === void 0) { viewportWidth = 0; }
-    var navItemsByColumnEntries = getNavItemsByColumnEntries(navItems);
-    var numberOfColumnsMax = Math.floor(viewportWidth / navLeftWidthMin) || 1;
-    var navItemsByColumnLayouts = navItemsByColumnEntries.map(function (_a) {
-        var columnEntries = _a.columnEntries, isFullWidthCategory = _a.isFullWidthCategory;
-        var numberOfColumns = Math.min(numberOfColumnsMax, columnEntries.length);
-        if (!isFullWidthCategory) {
-            var columns_1 = [];
-            columnEntries.forEach(function (columnEntry) {
-                var _a;
-                var idx = numberOfColumns === 1 ? 0 : columnEntry.columnMap[numberOfColumns];
-                assert(idx >= 0);
-                (_a = columns_1[idx]) !== null && _a !== void 0 ? _a : (columns_1[idx] = { categories: [] });
-                var navItemLevel1 = columnEntry.navItems[0];
-                var navItems = columnEntry.navItems.slice(1);
-                columns_1[idx].categories.push({ navItemLevel1: navItemLevel1, navItems: navItems });
-            });
-            var navItemsByColumnLayout = { columns: columns_1, isFullWidthCategory: isFullWidthCategory };
-            return navItemsByColumnLayout;
-        }
-        else {
-            var navItemLevel1_1;
-            var columns_2 = [];
-            columnEntries.forEach(function (columnEntry, i) {
-                var _a;
-                var _b;
-                var idx = numberOfColumns === 1 ? 0 : columnEntry.columnMap[numberOfColumns];
-                assert(idx >= 0);
-                (_b = columns_2[idx]) !== null && _b !== void 0 ? _b : (columns_2[idx] = { navItems: [] });
-                var navItems = columnEntry.navItems;
-                if (i === 0) {
-                    navItemLevel1_1 = navItems[0];
-                    navItems = navItems.slice(1);
-                }
-                (_a = columns_2[idx].navItems).push.apply(_a, navItems);
-            });
-            var navItemsByColumnLayout = {
-                columns: columns_2,
-                navItemLevel1: navItemLevel1_1,
-                isFullWidthCategory: isFullWidthCategory,
-            };
-            return navItemsByColumnLayout;
-        }
-    });
-    return navItemsByColumnLayouts;
-}
-function getNavItemsByColumnEntries(navItems) {
-    var navItemsByColumnEntries = [];
-    var columnEntries = [];
-    var columnEntry;
-    var isFullWidthCategory;
-    navItems.forEach(function (navItem) {
-        if (navItem.level === 1) {
-            var isFullWidthCategoryPrevious = isFullWidthCategory;
-            isFullWidthCategory = !!navItem.menuModalFullWidth;
-            if (isFullWidthCategoryPrevious !== undefined && isFullWidthCategoryPrevious !== isFullWidthCategory) {
-                navItemsByColumnEntries.push({ columnEntries: columnEntries, isFullWidthCategory: isFullWidthCategoryPrevious });
-                columnEntries = [];
-            }
-        }
-        assert(isFullWidthCategory !== undefined);
-        if (navItem.isColumnEntry) {
-            assert(navItem.level === 1 || navItem.level === 4);
-            columnEntry = { navItems: [navItem], columnMap: navItem.isColumnEntry };
-            columnEntries.push(columnEntry);
-        }
-        else {
-            assert(navItem.level !== 1);
-            columnEntry.navItems.push(navItem);
-        }
-    });
-    assert(isFullWidthCategory !== undefined);
-    navItemsByColumnEntries.push({ columnEntries: columnEntries, isFullWidthCategory: isFullWidthCategory });
-    return navItemsByColumnEntries;
-}
-function getNavItemsWithComputed(navItems, currentUrl) {
-    var navItemIdx;
-    var navItemsWithComputed = navItems.map(function (navItem, i) {
-        assert([1, 2, 3, 4].includes(navItem.level), navItem);
-        var navItemPrevious = navItems[i - 1];
-        var navItemNext = navItems[i + 1];
-        var isActive = false;
-        if (navItem.url === currentUrl) {
-            assert(navItem.level === 2, { currentUrl: currentUrl });
-            assert(navItemIdx === undefined);
-            navItemIdx = i;
-            isActive = true;
-        }
-        var isFirstOfItsKind = navItem.level !== (navItemPrevious === null || navItemPrevious === void 0 ? void 0 : navItemPrevious.level);
-        var isLastOfItsKind = navItem.level !== (navItemNext === null || navItemNext === void 0 ? void 0 : navItemNext.level);
-        var navItemComputed = __assign(__assign({}, navItem), { isActive: isActive, isRelevant: false, isFirstOfItsKind: isFirstOfItsKind, isLastOfItsKind: isLastOfItsKind });
-        return navItemComputed;
-    });
-    // Set `isRelevant`
-    if (navItemIdx !== undefined) {
-        for (var i = navItemIdx; i >= 0; i--) {
-            var navItem = navItemsWithComputed[i];
-            navItem.isRelevant = true;
-            if (navItem.level === 1)
-                break;
-        }
-        for (var i = navItemIdx; i < navItemsWithComputed.length; i++) {
-            var navItem = navItemsWithComputed[i];
-            if (navItem.level === 1)
-                break;
-            navItem.isRelevant = true;
-        }
-    }
-    return navItemsWithComputed;
-}
-function Chevron(props) {
-    return (React.createElement("svg", __assign({ viewBox: "0 0 512 292.52", xmlns: "http://www.w3.org/2000/svg" }, props),
-        React.createElement("path", { fill: "#aaa", d: "M10.725 82.42L230.125 261.82c6.8 6.8 16.2 10.7 25.9 10.7s19.1-3.9 25.9-10.7l219.4-179.4c14.3-14.3 14.3-37.4 0-51.7s-37.4-14.3-51.7 0l-193.6 153.6-193.6-153.6c-14.3-14.3-37.4-14.3-51.7 0s-14.3 37.5 0 51.7z" })));
-}