@brillout/docpress 0.7.10 → 0.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/+config.ts +2 -10
- package/Layout.tsx +397 -67
- package/{navigation/NavigationHeader.tsx → Links.tsx} +6 -57
- package/MenuModal.tsx +146 -0
- package/autoScrollNav.ts +4 -5
- package/components/CodeBlockTransformer.tsx +0 -2
- package/components/Note.css +4 -4
- package/components/Note.tsx +0 -2
- package/components/Supporters.tsx +1 -0
- package/config/resolveHeadingsData.ts +20 -23
- package/config/resolvePageContext.ts +11 -1
- package/css/code/block.css +5 -5
- package/css/code/inline.css +1 -1
- package/css/code.css +9 -5
- package/css/index.css +0 -4
- package/css/reset.css +0 -6
- package/dist/+config.d.ts +1 -13
- package/dist/+config.js +0 -3
- package/dist/components/CodeBlockTransformer.d.ts +1 -0
- package/dist/components/CodeBlockTransformer.js +1 -0
- package/dist/components/Note.d.ts +1 -0
- package/dist/components/Note.js +1 -0
- package/dist/components/Supporters.js +1 -0
- package/dist/config/resolveHeadingsData.d.ts +5 -8
- package/dist/config/resolveHeadingsData.js +20 -22
- package/dist/config/resolvePageContext.d.ts +5 -7
- package/dist/config/resolvePageContext.js +2 -1
- package/dist/navigation/Navigation.d.ts +12 -17
- package/dist/navigation/Navigation.js +82 -74
- package/dist/renderer/getStyleColumnLayout.d.ts +7 -0
- package/dist/renderer/getStyleColumnLayout.js +174 -0
- package/dist/types/Heading.d.ts +2 -4
- package/dist/utils/client.d.ts +1 -0
- package/dist/utils/client.js +1 -0
- package/dist/utils/css.d.ts +1 -0
- package/dist/utils/css.js +27 -0
- package/dist/utils/getGlobalObject.d.ts +1 -0
- package/dist/utils/getGlobalObject.js +9 -0
- package/docsearch/DocSearchInstall.tsx +23 -0
- package/docsearch/SearchLink.tsx +48 -0
- package/docsearch/toggleDocsearchModal.ts +29 -0
- package/global.d.ts +7 -0
- package/initKeyBindings.ts +41 -0
- package/installSectionUrlHashs.ts +6 -5
- package/navigation/Navigation.css +101 -3
- package/navigation/Navigation.tsx +114 -128
- package/package.json +1 -8
- package/renderer/getPageElement.tsx +19 -7
- package/renderer/getStyleColumnLayout.ts +193 -0
- package/renderer/onRenderClient.tsx +17 -24
- package/renderer/onRenderHtml.tsx +3 -6
- package/types/Heading.ts +2 -5
- package/utils/client.ts +1 -0
- package/utils/css.ts +26 -0
- package/utils/getGlobalObject.ts +11 -0
- package/Layout.css +0 -63
- package/MobileHeader.tsx +0 -70
- package/algolia/DocSearch.css +0 -28
- package/components/FeatureList/FeatureList.client.ts +0 -60
- package/components/FeatureList/FeatureList.css +0 -119
- package/components/FeatureList/FeatureList.tsx +0 -114
- package/components/FeatureList/chevron.svg +0 -7
- package/css/block-design.css +0 -4
- package/dist/autoScrollNav.d.ts +0 -3
- package/dist/autoScrollNav.js +0 -36
- package/dist/components/Algolia/Hit.d.ts +0 -4
- package/dist/components/Algolia/Hit.js +0 -30
- package/dist/components/Algolia/SelectIcon.d.ts +0 -2
- package/dist/components/Algolia/SelectIcon.js +0 -7
- package/dist/components/Algolia/Snippet.d.ts +0 -13
- package/dist/components/Algolia/Snippet.js +0 -37
- package/dist/components/Algolia/SourceIcon.d.ts +0 -4
- package/dist/components/Algolia/SourceIcon.js +0 -23
- package/dist/components/Algolia/types.d.ts +0 -79
- package/dist/components/Algolia/types.js +0 -1
- package/dist/navigation/NavigationHeader.d.ts +0 -8
- package/dist/navigation/NavigationHeader.js +0 -75
- package/dist/navigation/navigation-fullscreen/NavigationFullscreenButton.d.ts +0 -6
- package/dist/navigation/navigation-fullscreen/NavigationFullscreenButton.js +0 -23
- package/dist/navigation/navigation-fullscreen/hotkeyLabel.d.ts +0 -1
- package/dist/navigation/navigation-fullscreen/hotkeyLabel.js +0 -1
- package/navigation/Navigation-highlight.css +0 -41
- package/navigation/Navigation-items.css +0 -116
- package/navigation/Navigation-layout.css +0 -129
- package/navigation/initMobileNavigation.ts +0 -23
- package/navigation/initPressKit.ts +0 -19
- package/navigation/navigation-fullscreen/NavigationFullscreenButton.css +0 -32
- package/navigation/navigation-fullscreen/NavigationFullscreenButton.tsx +0 -47
- package/navigation/navigation-fullscreen/chevron.svg +0 -1
- package/navigation/navigation-fullscreen/close.svg +0 -4
- package/navigation/navigation-fullscreen/hotkeyLabel.ts +0 -1
- package/navigation/navigation-fullscreen/initNavigationFullscreen.ts +0 -60
- package/renderer/getCSSForResponsiveFullcreenNavItems.ts +0 -127
|
@@ -10,24 +10,22 @@ type Exports = {
|
|
|
10
10
|
type PageContextOriginal = PageContextServer;
|
|
11
11
|
type PageContextResolved = ReturnType<typeof resolvePageContext>;
|
|
12
12
|
declare function resolvePageContext(pageContext: PageContextOriginal): {
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
currentUrl: string;
|
|
17
|
-
isDetachedPage: boolean;
|
|
18
|
-
};
|
|
13
|
+
isDetachedPage: boolean;
|
|
14
|
+
navItems: import("../navigation/Navigation").NavItem[];
|
|
15
|
+
navItemsAll: import("../navigation/Navigation").NavItemAll[];
|
|
19
16
|
linksAll: import("../components").LinkData[];
|
|
20
17
|
isLandingPage: boolean;
|
|
21
18
|
pageTitle: string | null;
|
|
22
19
|
documentTitle: string;
|
|
23
|
-
noSideNavigation: (true | "no-logo") | undefined;
|
|
24
20
|
topNavigationList: {
|
|
25
21
|
title: string;
|
|
26
22
|
url: string | null | undefined;
|
|
27
23
|
}[];
|
|
24
|
+
columnLayouts: number[][];
|
|
28
25
|
} & {
|
|
29
26
|
urlPathname: string;
|
|
30
27
|
meta: {
|
|
28
|
+
projectName: string;
|
|
31
29
|
faviconUrl: string;
|
|
32
30
|
twitterHandle: string;
|
|
33
31
|
bannerUrl: string | undefined;
|
|
@@ -6,10 +6,11 @@ function resolvePageContext(pageContext) {
|
|
|
6
6
|
var pageContextResolved = {};
|
|
7
7
|
objectAssign(pageContextResolved, resolveHeadingsData(pageContext));
|
|
8
8
|
var config = getConfig();
|
|
9
|
-
var faviconUrl = config.faviconUrl, algolia = config.algolia, tagline = config.tagline, twitterHandle = config.twitterHandle, bannerUrl = config.bannerUrl, websiteUrl = config.websiteUrl, topNavigationStyle = config.topNavigationStyle;
|
|
9
|
+
var faviconUrl = config.faviconUrl, algolia = config.algolia, tagline = config.tagline, twitterHandle = config.twitterHandle, bannerUrl = config.bannerUrl, websiteUrl = config.websiteUrl, topNavigationStyle = config.topNavigationStyle, projectName = config.projectInfo.projectName;
|
|
10
10
|
objectAssign(pageContextResolved, {
|
|
11
11
|
urlPathname: pageContext.urlPathname, // TODO: remove
|
|
12
12
|
meta: {
|
|
13
|
+
projectName: projectName,
|
|
13
14
|
faviconUrl: faviconUrl,
|
|
14
15
|
twitterHandle: twitterHandle,
|
|
15
16
|
bannerUrl: bannerUrl,
|
|
@@ -1,26 +1,21 @@
|
|
|
1
|
-
export {
|
|
2
|
-
export { NavigationMask };
|
|
3
|
-
export type { NavigationData };
|
|
1
|
+
export { NavigationContent };
|
|
4
2
|
export type { NavItem };
|
|
5
|
-
export {
|
|
6
|
-
export type { NavItemGrouped };
|
|
3
|
+
export type { NavItemAll };
|
|
7
4
|
import React from 'react';
|
|
8
5
|
import './Navigation.css';
|
|
9
|
-
|
|
10
|
-
declare function Navigation({ navItems, navItemsAll, currentUrl, isDetachedPage, }: {
|
|
11
|
-
navItems: NavItem[];
|
|
12
|
-
navItemsAll: NavItem[];
|
|
13
|
-
currentUrl: string;
|
|
14
|
-
isDetachedPage: boolean;
|
|
15
|
-
}): React.JSX.Element;
|
|
16
|
-
declare function NavigationMask(): React.JSX.Element;
|
|
6
|
+
import '@docsearch/css';
|
|
17
7
|
type NavItem = {
|
|
18
8
|
level: number;
|
|
19
9
|
url?: string | null;
|
|
20
10
|
title: string;
|
|
21
11
|
titleInNav: string;
|
|
12
|
+
menuModalFullWidth?: true;
|
|
13
|
+
};
|
|
14
|
+
type NavItemAll = NavItem & {
|
|
15
|
+
columnLayoutElement?: true;
|
|
22
16
|
};
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
17
|
+
declare function NavigationContent(props: {
|
|
18
|
+
navItems: NavItem[];
|
|
19
|
+
showOnlyRelevant?: true;
|
|
20
|
+
columnLayout?: true;
|
|
21
|
+
}): React.JSX.Element;
|
|
@@ -9,39 +9,47 @@ var __assign = (this && this.__assign) || function () {
|
|
|
9
9
|
};
|
|
10
10
|
return __assign.apply(this, arguments);
|
|
11
11
|
};
|
|
12
|
-
|
|
13
|
-
export {
|
|
14
|
-
// TODO/refactor: do this only on the server side?
|
|
15
|
-
export { groupByLevelMin };
|
|
12
|
+
// TODO/refactor: rename file and/or component
|
|
13
|
+
export { NavigationContent };
|
|
16
14
|
import React from 'react';
|
|
17
|
-
import {
|
|
18
|
-
import { assert, Emoji, assertWarning, jsxToTextContent } from '../utils/server';
|
|
15
|
+
import { assert, assertWarning, jsxToTextContent } from '../utils/server';
|
|
19
16
|
import './Navigation.css';
|
|
20
|
-
import { NavigationFullscreenClose } from './navigation-fullscreen/NavigationFullscreenButton';
|
|
21
17
|
import { parseTitle } from '../parseTitle';
|
|
22
|
-
import {
|
|
23
|
-
|
|
24
|
-
var navItems = _a.navItems, navItemsAll = _a.navItemsAll, currentUrl = _a.currentUrl, isDetachedPage = _a.isDetachedPage;
|
|
25
|
-
return (React.createElement(React.Fragment, null,
|
|
26
|
-
React.createElement("div", { id: "navigation-container" },
|
|
27
|
-
React.createElement(NavigationHeader, null),
|
|
28
|
-
React.createElement("div", { id: "navigation-body" },
|
|
29
|
-
isDetachedPage && (React.createElement(React.Fragment, null,
|
|
30
|
-
navItems.length > 1 && (React.createElement(NavigationContent, { id: "navigation-content-detached", navItems: navItems, currentUrl: currentUrl })),
|
|
31
|
-
React.createElement(DetachedPageNote, null))),
|
|
32
|
-
React.createElement(NavigationContent, { id: "navigation-content-main", navItems: navItemsAll, currentUrl: currentUrl }),
|
|
33
|
-
React.createElement(NavigationFullscreenClose, null))),
|
|
34
|
-
React.createElement("script", { dangerouslySetInnerHTML: { __html: autoScrollNav_SSR } })));
|
|
35
|
-
}
|
|
36
|
-
function NavigationMask() {
|
|
37
|
-
return React.createElement("div", { id: "mobile-navigation-mask" });
|
|
38
|
-
}
|
|
18
|
+
import { usePageContext } from '../renderer/usePageContext';
|
|
19
|
+
import '@docsearch/css';
|
|
39
20
|
function NavigationContent(props) {
|
|
40
|
-
var
|
|
41
|
-
var
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
21
|
+
var pageContext = usePageContext();
|
|
22
|
+
var navItemsWithComputed = getNavItemsWithComputed(props.navItems, pageContext.urlPathname);
|
|
23
|
+
var navContent;
|
|
24
|
+
if (!props.columnLayout) {
|
|
25
|
+
navContent = navItemsWithComputed
|
|
26
|
+
.filter(function (navItemGroup) { return !props.showOnlyRelevant || navItemGroup.isRelevant; })
|
|
27
|
+
.map(function (navItem, i) { return React.createElement(NavItemComponent, { navItem: navItem, key: i }); });
|
|
28
|
+
}
|
|
29
|
+
else {
|
|
30
|
+
assert(!props.showOnlyRelevant);
|
|
31
|
+
var navItemsColumnLayout = groupByColumnLayout(navItemsWithComputed);
|
|
32
|
+
var paddingBottom_1 = 40;
|
|
33
|
+
navContent = (React.createElement(React.Fragment, null, navItemsColumnLayout.map(function (_a, i) {
|
|
34
|
+
var navItemsColumnEntries = _a.navItemsColumnEntries, isFullWidth = _a.isFullWidth;
|
|
35
|
+
return (React.createElement("div", { key: i, style: {
|
|
36
|
+
display: 'flex',
|
|
37
|
+
justifyContent: 'center',
|
|
38
|
+
} },
|
|
39
|
+
React.createElement("div", { className: "column-layout-".concat(i), style: {
|
|
40
|
+
flexGrow: 1,
|
|
41
|
+
columnGap: 20,
|
|
42
|
+
paddingBottom: isFullWidth ? paddingBottom_1 : undefined,
|
|
43
|
+
} }, navItemsColumnEntries.map(function (navItemColumnEntry, j) { return (React.createElement("div", { key: j, className: "column-layout-entry", style: {
|
|
44
|
+
breakInside: 'avoid',
|
|
45
|
+
paddingBottom: !isFullWidth ? paddingBottom_1 : undefined,
|
|
46
|
+
width: '100%',
|
|
47
|
+
} },
|
|
48
|
+
React.createElement(NavItemComponent, { navItem: navItemColumnEntry }),
|
|
49
|
+
navItemColumnEntry.navItemChilds.map(function (navItem, k) { return (React.createElement(NavItemComponent, { navItem: navItem, key: k })); }))); }))));
|
|
50
|
+
})));
|
|
51
|
+
}
|
|
52
|
+
return (React.createElement("div", { className: "navigation-content", style: { marginTop: 10 } }, navContent));
|
|
45
53
|
}
|
|
46
54
|
function NavItemComponent(_a) {
|
|
47
55
|
var _b;
|
|
@@ -66,72 +74,72 @@ function NavItemComponent(_a) {
|
|
|
66
74
|
'nav-item',
|
|
67
75
|
'nav-item-level-' + navItem.level,
|
|
68
76
|
navItem.url && navItem.isActive && ' is-active',
|
|
69
|
-
navItem.url && navItem.isActiveFirst && ' is-active-first',
|
|
70
|
-
navItem.url && navItem.isActiveLast && ' is-active-last',
|
|
71
77
|
navItem.isFirstOfItsKind && 'nav-item-first-of-its-kind',
|
|
72
78
|
navItem.isLastOfItsKind && 'nav-item-last-of-its-kind',
|
|
73
79
|
]
|
|
74
80
|
.filter(Boolean)
|
|
75
81
|
.join(' '), href: (_b = navItem.url) !== null && _b !== void 0 ? _b : undefined }, titleInNavJsx));
|
|
76
82
|
}
|
|
77
|
-
function
|
|
78
|
-
var
|
|
79
|
-
var
|
|
83
|
+
function groupByColumnLayout(navItems) {
|
|
84
|
+
var navItemsColumnLayout = [];
|
|
85
|
+
var navItemsColumnEntries = [];
|
|
86
|
+
var isFullWidth;
|
|
80
87
|
navItems.forEach(function (navItem) {
|
|
81
|
-
if (navItem.level ===
|
|
82
|
-
|
|
88
|
+
if (navItem.level === 1) {
|
|
89
|
+
var isFullWidthPrevious = isFullWidth;
|
|
90
|
+
isFullWidth = !!navItem.menuModalFullWidth;
|
|
91
|
+
if (isFullWidthPrevious !== undefined && isFullWidthPrevious !== isFullWidth) {
|
|
92
|
+
navItemsColumnLayout.push({ navItemsColumnEntries: navItemsColumnEntries, isFullWidth: isFullWidthPrevious });
|
|
93
|
+
navItemsColumnEntries = [];
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
assert(isFullWidth !== undefined);
|
|
97
|
+
if (navItem.columnLayoutElement) {
|
|
98
|
+
assert(navItem.level === 1 || navItem.level === 4);
|
|
99
|
+
var navItemColumnEntry = __assign(__assign({}, navItem), { navItemChilds: [] });
|
|
100
|
+
navItemsColumnEntries.push(navItemColumnEntry);
|
|
83
101
|
}
|
|
84
102
|
else {
|
|
85
|
-
|
|
103
|
+
assert(navItem.level !== 1);
|
|
104
|
+
navItemsColumnEntries[navItemsColumnEntries.length - 1].navItemChilds.push(navItem);
|
|
86
105
|
}
|
|
87
106
|
});
|
|
88
|
-
|
|
107
|
+
assert(isFullWidth !== undefined);
|
|
108
|
+
navItemsColumnLayout.push({ navItemsColumnEntries: navItemsColumnEntries, isFullWidth: isFullWidth });
|
|
109
|
+
return navItemsColumnLayout;
|
|
89
110
|
}
|
|
90
|
-
function
|
|
91
|
-
|
|
111
|
+
function getNavItemsWithComputed(navItems, currentUrl) {
|
|
112
|
+
var navItemIdx;
|
|
113
|
+
var navItemsWithComputed = navItems.map(function (navItem, i) {
|
|
92
114
|
assert([1, 2, 3, 4].includes(navItem.level), navItem);
|
|
93
115
|
var navItemPrevious = navItems[i - 1];
|
|
94
116
|
var navItemNext = navItems[i + 1];
|
|
95
|
-
var isActiveFirst = false;
|
|
96
|
-
var isActiveLast = false;
|
|
97
117
|
var isActive = false;
|
|
98
118
|
if (navItem.url === currentUrl) {
|
|
99
119
|
assert(navItem.level === 2, { currentUrl: currentUrl });
|
|
120
|
+
assert(navItemIdx === undefined);
|
|
121
|
+
navItemIdx = i;
|
|
100
122
|
isActive = true;
|
|
101
|
-
isActiveFirst = true;
|
|
102
|
-
if ((navItemNext === null || navItemNext === void 0 ? void 0 : navItemNext.level) !== 3) {
|
|
103
|
-
isActiveLast = true;
|
|
104
|
-
}
|
|
105
|
-
}
|
|
106
|
-
if (navItem.level === 3) {
|
|
107
|
-
isActive = true;
|
|
108
|
-
if ((navItemNext === null || navItemNext === void 0 ? void 0 : navItemNext.level) !== 3) {
|
|
109
|
-
isActiveLast = true;
|
|
110
|
-
}
|
|
111
123
|
}
|
|
112
124
|
var isFirstOfItsKind = navItem.level !== (navItemPrevious === null || navItemPrevious === void 0 ? void 0 : navItemPrevious.level);
|
|
113
125
|
var isLastOfItsKind = navItem.level !== (navItemNext === null || navItemNext === void 0 ? void 0 : navItemNext.level);
|
|
114
|
-
|
|
126
|
+
var navItemComputed = __assign(__assign({}, navItem), { isActive: isActive, isRelevant: false, isFirstOfItsKind: isFirstOfItsKind, isLastOfItsKind: isLastOfItsKind });
|
|
127
|
+
return navItemComputed;
|
|
115
128
|
});
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
React.createElement("span", { style: {
|
|
133
|
-
opacity: 0.8,
|
|
134
|
-
} },
|
|
135
|
-
' ',
|
|
136
|
-
"\u2014 this page isn't listed in the navigation below.")));
|
|
129
|
+
// Set `isRelevant`
|
|
130
|
+
if (navItemIdx !== undefined) {
|
|
131
|
+
for (var i = navItemIdx; i >= 0; i--) {
|
|
132
|
+
var navItem = navItemsWithComputed[i];
|
|
133
|
+
navItem.isRelevant = true;
|
|
134
|
+
if (navItem.level === 1)
|
|
135
|
+
break;
|
|
136
|
+
}
|
|
137
|
+
for (var i = navItemIdx; i < navItemsWithComputed.length; i++) {
|
|
138
|
+
var navItem = navItemsWithComputed[i];
|
|
139
|
+
if (navItem.level === 1)
|
|
140
|
+
break;
|
|
141
|
+
navItem.isRelevant = true;
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
return navItemsWithComputed;
|
|
137
145
|
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export { getStyleColumnLayout };
|
|
2
|
+
export { determineColumnLayoutEntries };
|
|
3
|
+
import { type NavItemAll } from '../navigation/Navigation';
|
|
4
|
+
declare function determineColumnLayoutEntries(navItems: NavItemAll[]): {
|
|
5
|
+
columnLayouts: number[][];
|
|
6
|
+
};
|
|
7
|
+
declare function getStyleColumnLayout(columnLayouts: number[][]): string;
|
|
@@ -0,0 +1,174 @@
|
|
|
1
|
+
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
|
|
2
|
+
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
3
|
+
return cooked;
|
|
4
|
+
};
|
|
5
|
+
var __assign = (this && this.__assign) || function () {
|
|
6
|
+
__assign = Object.assign || function(t) {
|
|
7
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
8
|
+
s = arguments[i];
|
|
9
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
10
|
+
t[p] = s[p];
|
|
11
|
+
}
|
|
12
|
+
return t;
|
|
13
|
+
};
|
|
14
|
+
return __assign.apply(this, arguments);
|
|
15
|
+
};
|
|
16
|
+
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
17
|
+
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
18
|
+
if (ar || !(i in from)) {
|
|
19
|
+
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
20
|
+
ar[i] = from[i];
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
return to.concat(ar || Array.prototype.slice.call(from));
|
|
24
|
+
};
|
|
25
|
+
export { getStyleColumnLayout };
|
|
26
|
+
export { determineColumnLayoutEntries };
|
|
27
|
+
import { css } from '../utils/css';
|
|
28
|
+
import { assert, isBrowser } from '../utils/server';
|
|
29
|
+
assert(!isBrowser());
|
|
30
|
+
var columnWidthMin = 300;
|
|
31
|
+
var columnWidthMax = 350;
|
|
32
|
+
function determineColumnLayoutEntries(navItems) {
|
|
33
|
+
var navItemsWithLength = navItems.map(function (navItem) { return (__assign(__assign({}, navItem), { numberOfHeadings: navItem.level === 1 || navItem.level === 4 ? 0 : null })); });
|
|
34
|
+
var navItemLevel1;
|
|
35
|
+
var navItemLevel4;
|
|
36
|
+
navItemsWithLength.forEach(function (navItem) {
|
|
37
|
+
if (navItem.level === 1) {
|
|
38
|
+
navItemLevel1 = navItem;
|
|
39
|
+
navItemLevel4 = undefined;
|
|
40
|
+
return;
|
|
41
|
+
}
|
|
42
|
+
if (navItem.level === 4) {
|
|
43
|
+
navItemLevel4 = navItem;
|
|
44
|
+
return;
|
|
45
|
+
}
|
|
46
|
+
var bumpNavItemLength = function (navItem) {
|
|
47
|
+
assert(navItem.numberOfHeadings !== null);
|
|
48
|
+
navItem.numberOfHeadings++;
|
|
49
|
+
};
|
|
50
|
+
assert(navItemLevel1);
|
|
51
|
+
bumpNavItemLength(navItemLevel1);
|
|
52
|
+
if (navItemLevel4) {
|
|
53
|
+
bumpNavItemLength(navItemLevel4);
|
|
54
|
+
}
|
|
55
|
+
});
|
|
56
|
+
var columnLayouts = [];
|
|
57
|
+
var columns = [];
|
|
58
|
+
var isFullWidth;
|
|
59
|
+
navItemsWithLength.forEach(function (navItem, i) {
|
|
60
|
+
var isFullWidthBegin = false;
|
|
61
|
+
if (navItem.level === 1) {
|
|
62
|
+
var isFullWidthPrevious = isFullWidth;
|
|
63
|
+
isFullWidth = !!navItem.menuModalFullWidth;
|
|
64
|
+
if (isFullWidth)
|
|
65
|
+
isFullWidthBegin = true;
|
|
66
|
+
if (isFullWidthPrevious !== undefined && isFullWidthPrevious !== isFullWidth) {
|
|
67
|
+
columnLayouts.push(columns);
|
|
68
|
+
columns = [];
|
|
69
|
+
}
|
|
70
|
+
}
|
|
71
|
+
if (!isFullWidth
|
|
72
|
+
? navItem.level === 1
|
|
73
|
+
: (navItem.level === 4 && navItemsWithLength[i - 1].level !== 1) || isFullWidthBegin) {
|
|
74
|
+
if (isFullWidth) {
|
|
75
|
+
assert(navItem.level === 4 || (navItem.level === 1 && isFullWidthBegin));
|
|
76
|
+
}
|
|
77
|
+
else {
|
|
78
|
+
assert(navItem.level === 1);
|
|
79
|
+
}
|
|
80
|
+
assert(navItem.numberOfHeadings !== null);
|
|
81
|
+
columns.push(navItem.numberOfHeadings);
|
|
82
|
+
navItems[i].columnLayoutElement = true;
|
|
83
|
+
}
|
|
84
|
+
});
|
|
85
|
+
columnLayouts.push(columns);
|
|
86
|
+
return { columnLayouts: columnLayouts };
|
|
87
|
+
}
|
|
88
|
+
function getStyleColumnLayout(columnLayouts) {
|
|
89
|
+
var style = '\n';
|
|
90
|
+
columnLayouts.forEach(function (columns, i) {
|
|
91
|
+
var _loop_1 = function (numberOfColumns) {
|
|
92
|
+
var styleGivenNumberOfColumns = [];
|
|
93
|
+
styleGivenNumberOfColumns.push(css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n.column-layout-", " {\n column-count: ", ";\n max-width: min(100%, ", "px);\n}\n"], ["\n.column-layout-", " {\n column-count: ", ";\n max-width: min(100%, ", "px);\n}\n"])), i, numberOfColumns, columnWidthMax * numberOfColumns));
|
|
94
|
+
var columnsIdMap = determineColumns(columns, numberOfColumns);
|
|
95
|
+
var columnBreakPoints = determineColumnBreakPoints(columnsIdMap);
|
|
96
|
+
columnBreakPoints.forEach(function (columnBreakPoint, columnUngroupedId) {
|
|
97
|
+
styleGivenNumberOfColumns.push(css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n.column-layout-", " .column-layout-entry:nth-child(", ") {\n break-before: ", ";\n}\n"], ["\n.column-layout-", " .column-layout-entry:nth-child(", ") {\n break-before: ", ";\n}\n"])), i, columnUngroupedId + 1, columnBreakPoint ? 'column' : 'avoid'));
|
|
98
|
+
});
|
|
99
|
+
var noContainerQuery = numberOfColumns === columns.length;
|
|
100
|
+
if (!noContainerQuery) {
|
|
101
|
+
var maxWidth = (numberOfColumns + 1) * columnWidthMin - 1;
|
|
102
|
+
styleGivenNumberOfColumns = __spreadArray(__spreadArray([
|
|
103
|
+
//
|
|
104
|
+
"@container(max-width: ".concat(maxWidth, "px) {")
|
|
105
|
+
], styleGivenNumberOfColumns, true), [
|
|
106
|
+
"}",
|
|
107
|
+
], false);
|
|
108
|
+
}
|
|
109
|
+
style += styleGivenNumberOfColumns.join('\n') + '\n';
|
|
110
|
+
};
|
|
111
|
+
for (var numberOfColumns = columns.length; numberOfColumns >= 1; numberOfColumns--) {
|
|
112
|
+
_loop_1(numberOfColumns);
|
|
113
|
+
}
|
|
114
|
+
});
|
|
115
|
+
return style;
|
|
116
|
+
}
|
|
117
|
+
function determineColumnBreakPoints(columnsIdMap) {
|
|
118
|
+
assert(columnsIdMap[0] === 0);
|
|
119
|
+
var columnGroupedIdBefore = -1;
|
|
120
|
+
var columnBreakPoints = columnsIdMap.map(function (columnGroupedId) {
|
|
121
|
+
assert([
|
|
122
|
+
//
|
|
123
|
+
columnGroupedIdBefore,
|
|
124
|
+
columnGroupedIdBefore + 1,
|
|
125
|
+
].includes(columnGroupedId));
|
|
126
|
+
var val = columnGroupedId !== columnGroupedIdBefore;
|
|
127
|
+
columnGroupedIdBefore = columnGroupedId;
|
|
128
|
+
return val;
|
|
129
|
+
});
|
|
130
|
+
return columnBreakPoints;
|
|
131
|
+
}
|
|
132
|
+
function determineColumns(columnsUnmerged, numberOfColumns) {
|
|
133
|
+
assert(numberOfColumns <= columnsUnmerged.length);
|
|
134
|
+
var columnsMergingInit = columnsUnmerged.map(function (columnHeight, i) { return ({
|
|
135
|
+
columnIdsMerged: [i],
|
|
136
|
+
heightTotal: columnHeight,
|
|
137
|
+
}); });
|
|
138
|
+
var columnsMerged = mergeColumns(columnsMergingInit, numberOfColumns);
|
|
139
|
+
var columnsIdMap = new Array(columnsUnmerged.length);
|
|
140
|
+
assert(columnsMerged.length === numberOfColumns);
|
|
141
|
+
columnsMerged.forEach(function (columnMerged, columnMergedId) {
|
|
142
|
+
columnMerged.columnIdsMerged.forEach(function (columnId) {
|
|
143
|
+
columnsIdMap[columnId] = columnMergedId;
|
|
144
|
+
});
|
|
145
|
+
});
|
|
146
|
+
assert(columnsIdMap.length === columnsUnmerged.length);
|
|
147
|
+
return columnsIdMap;
|
|
148
|
+
}
|
|
149
|
+
function mergeColumns(columnsMerging, numberOfColumns) {
|
|
150
|
+
if (columnsMerging.length <= numberOfColumns)
|
|
151
|
+
return columnsMerging;
|
|
152
|
+
var mergeCandidate = null;
|
|
153
|
+
for (var i_1 = 0; i_1 <= columnsMerging.length - 2; i_1++) {
|
|
154
|
+
var column1 = columnsMerging[i_1 + 0];
|
|
155
|
+
var column2 = columnsMerging[i_1 + 1];
|
|
156
|
+
var heightTotal = column1.heightTotal + column2.heightTotal;
|
|
157
|
+
if (!mergeCandidate || mergeCandidate.heightTotal > heightTotal) {
|
|
158
|
+
mergeCandidate = {
|
|
159
|
+
i: i_1,
|
|
160
|
+
columnIdsMerged: __spreadArray(__spreadArray([], column1.columnIdsMerged, true), column2.columnIdsMerged, true),
|
|
161
|
+
heightTotal: heightTotal,
|
|
162
|
+
};
|
|
163
|
+
}
|
|
164
|
+
}
|
|
165
|
+
assert(mergeCandidate);
|
|
166
|
+
var i = mergeCandidate.i;
|
|
167
|
+
assert(-1 < i && i < columnsMerging.length - 1);
|
|
168
|
+
var columnsMergingMod = __spreadArray(__spreadArray(__spreadArray([], columnsMerging.slice(0, i), true), [
|
|
169
|
+
mergeCandidate
|
|
170
|
+
], false), columnsMerging.slice(i + 2), true);
|
|
171
|
+
assert(columnsMergingMod.length === columnsMerging.length - 1);
|
|
172
|
+
return mergeColumns(columnsMergingMod, numberOfColumns);
|
|
173
|
+
}
|
|
174
|
+
var templateObject_1, templateObject_2;
|
package/dist/types/Heading.d.ts
CHANGED
|
@@ -7,10 +7,10 @@ type HeadingResolved = {
|
|
|
7
7
|
level: number;
|
|
8
8
|
title: string;
|
|
9
9
|
titleInNav: string;
|
|
10
|
-
noSideNavigation?: NoSideNavigation;
|
|
11
10
|
topNavigation?: true | string;
|
|
12
11
|
linkBreadcrumb: string[];
|
|
13
12
|
sectionTitles?: string[];
|
|
13
|
+
menuModalFullWidth?: true;
|
|
14
14
|
} & Tmp;
|
|
15
15
|
type HeadingDetachedResolved = Omit<HeadingResolved, 'level' | 'linkBreadcrumb'> & {
|
|
16
16
|
level: 2;
|
|
@@ -19,6 +19,7 @@ type HeadingDetachedResolved = Omit<HeadingResolved, 'level' | 'linkBreadcrumb'>
|
|
|
19
19
|
type HeadingDefinitionCommon = {
|
|
20
20
|
title: string;
|
|
21
21
|
topNavigation?: true | string;
|
|
22
|
+
menuModalFullWidth?: true;
|
|
22
23
|
};
|
|
23
24
|
type HeadingDetachedDefinition = HeadingDefinitionCommon & {
|
|
24
25
|
url: string;
|
|
@@ -27,13 +28,11 @@ type HeadingDetachedDefinition = HeadingDefinitionCommon & {
|
|
|
27
28
|
type HeadingDefinition = HeadingDefinitionCommon & {
|
|
28
29
|
url?: null | string;
|
|
29
30
|
titleInNav?: string;
|
|
30
|
-
noSideNavigation?: NoSideNavigation;
|
|
31
31
|
} & HeadingDefinitionLevel & Tmp;
|
|
32
32
|
type IsCategory = {
|
|
33
33
|
url?: undefined;
|
|
34
34
|
titleDocument?: undefined;
|
|
35
35
|
titleInNav?: undefined;
|
|
36
|
-
noSideNavigation?: undefined;
|
|
37
36
|
};
|
|
38
37
|
type HeadingDefinitionLevel = ({
|
|
39
38
|
level: 1;
|
|
@@ -47,4 +46,3 @@ type HeadingDefinitionLevel = ({
|
|
|
47
46
|
type Tmp = {
|
|
48
47
|
titleDocument?: string;
|
|
49
48
|
};
|
|
50
|
-
type NoSideNavigation = true | 'no-logo';
|
package/dist/utils/client.d.ts
CHANGED
package/dist/utils/client.js
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function css(strings: TemplateStringsArray | string[], ...values: (string | number)[]): string;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
export function css(strings) {
|
|
2
|
+
var values = [];
|
|
3
|
+
for (var _i = 1; _i < arguments.length; _i++) {
|
|
4
|
+
values[_i - 1] = arguments[_i];
|
|
5
|
+
}
|
|
6
|
+
// The boring part
|
|
7
|
+
var result = strings
|
|
8
|
+
.map(function (str, i) {
|
|
9
|
+
var s = str;
|
|
10
|
+
if (i !== strings.length - 1) {
|
|
11
|
+
s += values[i];
|
|
12
|
+
}
|
|
13
|
+
return s;
|
|
14
|
+
})
|
|
15
|
+
.join('');
|
|
16
|
+
// Remove comments
|
|
17
|
+
result = result
|
|
18
|
+
.split('\n')
|
|
19
|
+
.filter(function (line) { return !line.startsWith('// '); })
|
|
20
|
+
.join('\n');
|
|
21
|
+
// Minifiy
|
|
22
|
+
result = result
|
|
23
|
+
.replace(/\s+/g, ' ') // Replace all whitespace sequences with a single space
|
|
24
|
+
.replace(/\s*([{}:;])\s*/g, '$1') // Remove space around {, }, :, ;
|
|
25
|
+
.trim(); // Trim any leading/trailing whitespace
|
|
26
|
+
return result;
|
|
27
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function getGlobalObject<T extends Record<string, unknown> = never>(key: `${string}.ts`, defaultValue: T): T;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export function getGlobalObject(
|
|
2
|
+
// We use the filename as key; each `getGlobalObject()` call should live inside a file with a unique filename.
|
|
3
|
+
key, defaultValue) {
|
|
4
|
+
// @ts-ignore
|
|
5
|
+
var globalObjectsAll = (globalThis[projectKey] = globalThis[projectKey] || {});
|
|
6
|
+
var globalObject = (globalObjectsAll[key] = globalObjectsAll[key] || defaultValue);
|
|
7
|
+
return globalObject;
|
|
8
|
+
}
|
|
9
|
+
var projectKey = '_docpress';
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
export { DocSearchInstall }
|
|
2
|
+
|
|
3
|
+
import React from 'react'
|
|
4
|
+
import { usePageContext } from '../renderer/usePageContext'
|
|
5
|
+
import { DocSearch as DocSearchButton } from '@docsearch/react'
|
|
6
|
+
import { Hit } from '../components/Algolia/Hit'
|
|
7
|
+
|
|
8
|
+
function DocSearchInstall() {
|
|
9
|
+
const pageContext = usePageContext()
|
|
10
|
+
const { algolia } = pageContext.meta
|
|
11
|
+
if (!algolia) return null
|
|
12
|
+
return (
|
|
13
|
+
<div style={{ display: 'none' }}>
|
|
14
|
+
<DocSearchButton
|
|
15
|
+
appId={algolia.appId}
|
|
16
|
+
indexName={algolia.indexName}
|
|
17
|
+
apiKey={algolia.apiKey}
|
|
18
|
+
insights={true}
|
|
19
|
+
hitComponent={Hit}
|
|
20
|
+
/>
|
|
21
|
+
</div>
|
|
22
|
+
)
|
|
23
|
+
}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
export { SearchLink }
|
|
2
|
+
|
|
3
|
+
import React from 'react'
|
|
4
|
+
import { openDocsearchModal } from './toggleDocsearchModal'
|
|
5
|
+
|
|
6
|
+
type PropsDiv = React.HTMLProps<HTMLDivElement>
|
|
7
|
+
function SearchLink(props: PropsDiv) {
|
|
8
|
+
return (
|
|
9
|
+
<div
|
|
10
|
+
{...props}
|
|
11
|
+
style={{
|
|
12
|
+
height: '100%',
|
|
13
|
+
display: 'flex',
|
|
14
|
+
alignItems: 'center',
|
|
15
|
+
cursor: 'pointer',
|
|
16
|
+
...props.style,
|
|
17
|
+
}}
|
|
18
|
+
className="colorize-on-hover"
|
|
19
|
+
onClick={(ev) => {
|
|
20
|
+
ev.preventDefault()
|
|
21
|
+
openDocsearchModal()
|
|
22
|
+
}}
|
|
23
|
+
aria-label="Ctrl + K"
|
|
24
|
+
data-balloon-pos="left"
|
|
25
|
+
data-balloon-blunt
|
|
26
|
+
data-balloon-nofocus
|
|
27
|
+
>
|
|
28
|
+
<SearchIcon />
|
|
29
|
+
Search
|
|
30
|
+
</div>
|
|
31
|
+
)
|
|
32
|
+
}
|
|
33
|
+
function SearchIcon() {
|
|
34
|
+
return (
|
|
35
|
+
<svg
|
|
36
|
+
style={{ marginRight: 'var(--icon-padding)', lineHeight: 0, width: '1.3em' }}
|
|
37
|
+
className="decolorize-6"
|
|
38
|
+
viewBox="0 0 20 20"
|
|
39
|
+
>
|
|
40
|
+
<path
|
|
41
|
+
d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z"
|
|
42
|
+
fill="none"
|
|
43
|
+
stroke="currentColor"
|
|
44
|
+
strokeWidth="2"
|
|
45
|
+
></path>
|
|
46
|
+
</svg>
|
|
47
|
+
)
|
|
48
|
+
}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
export { closeDocsearchModal }
|
|
2
|
+
export { openDocsearchModal }
|
|
3
|
+
|
|
4
|
+
import { assert } from '../utils/client'
|
|
5
|
+
|
|
6
|
+
function closeDocsearchModal() {
|
|
7
|
+
if (isClosed()) return
|
|
8
|
+
toggle()
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
function openDocsearchModal() {
|
|
12
|
+
if (!isClosed()) return
|
|
13
|
+
toggle()
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
// There doesn't seem be an official API to open/close the DocSearch modal:
|
|
17
|
+
// - https://github.com/algolia/docsearch/issues/2321
|
|
18
|
+
// - https://github.com/algolia/docsearch/blob/90f3c6aabbc324fe49e9a1dfe0906fcd4d90f27b/packages/docsearch-react/src/DocSearch.tsx#L52
|
|
19
|
+
function toggle() {
|
|
20
|
+
// Trigger https://github.com/algolia/docsearch/blob/90f3c6aabbc324fe49e9a1dfe0906fcd4d90f27b/packages/docsearch-react/src/useDocSearchKeyboardEvents.ts#L71
|
|
21
|
+
window.dispatchEvent(new KeyboardEvent('keydown', { key: 'k', ctrlKey: true }))
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
function isClosed() {
|
|
25
|
+
const test1 = !document.body.classList.contains('DocSearch--active')
|
|
26
|
+
const test2 = document.getElementsByClassName('DocSearch-Modal').length === 0
|
|
27
|
+
assert(test1 === test2)
|
|
28
|
+
return test1 || test2
|
|
29
|
+
}
|