@brillout/docpress 0.15.12 → 0.15.13-commit-ffe283f
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/ExternalLinks.tsx +32 -10
- package/Layout.tsx +190 -160
- package/MenuModal/NavigationWithColumnLayout.tsx +18 -11
- package/MenuModal/toggleMenuModal.ts +2 -2
- package/MenuModal.tsx +4 -4
- package/NavItemComponent.tsx +15 -1
- package/determineNavItemsColumnLayout.spec.ts +518 -0
- package/determineNavItemsColumnLayout.ts +11 -10
- package/dist/NavItemComponent.d.ts +24 -2
- package/dist/determineNavItemsColumnLayout.js +10 -9
- package/dist/types/Config.d.ts +1 -0
- package/docsearch/SearchLink.tsx +5 -1
- package/icons/coin.svg +38 -0
- package/icons/index.ts +2 -0
- package/icons/loudspeaker.svg +1 -0
- package/package.json +1 -1
- package/types/Config.ts +1 -0
|
@@ -15,8 +15,8 @@ function determineNavItemsColumnLayout(navItems: NavItem[]): undefined {
|
|
|
15
15
|
numberOfColumns,
|
|
16
16
|
)
|
|
17
17
|
columnEntries.forEach((columnEntry, i) => {
|
|
18
|
-
columnEntry.navItemLeader.
|
|
19
|
-
columnEntry.navItemLeader.
|
|
18
|
+
columnEntry.navItemLeader.isPotentialColumn ??= {}
|
|
19
|
+
columnEntry.navItemLeader.isPotentialColumn[numberOfColumns] = columnMapping[i]
|
|
20
20
|
})
|
|
21
21
|
}
|
|
22
22
|
})
|
|
@@ -61,7 +61,10 @@ function getColumnEntries(navItems: NavItem[]) {
|
|
|
61
61
|
const isFullWidthCategoryPrevious = isFullWidthCategory
|
|
62
62
|
isFullWidthCategory = !!navItem.menuModalFullWidth
|
|
63
63
|
if (isFullWidthCategory) isFullWidthCategoryBegin = true
|
|
64
|
-
if (
|
|
64
|
+
if (
|
|
65
|
+
isFullWidthCategoryPrevious !== undefined &&
|
|
66
|
+
(isFullWidthCategoryPrevious !== isFullWidthCategory || (isFullWidthCategory && columnEntries.length > 0))
|
|
67
|
+
) {
|
|
65
68
|
columnLayouts.push(columnEntries)
|
|
66
69
|
columnEntries = []
|
|
67
70
|
}
|
|
@@ -82,13 +85,11 @@ function getColumnEntries(navItems: NavItem[]) {
|
|
|
82
85
|
assert(numberOfHeadings !== null)
|
|
83
86
|
if (isFullWidthCategoryBegin) {
|
|
84
87
|
assert(navItem.level === 1)
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
assert(navItemNext.numberOfHeadings)
|
|
91
|
-
numberOfHeadings = navItemNext.numberOfHeadings
|
|
88
|
+
// If followed by a level-4 heading, use its count instead
|
|
89
|
+
if (navItemNext && navItemNext.level === 4) {
|
|
90
|
+
assert(navItemNext.numberOfHeadings)
|
|
91
|
+
numberOfHeadings = navItemNext.numberOfHeadings
|
|
92
|
+
}
|
|
92
93
|
}
|
|
93
94
|
columnEntries.push({ navItemLeader: navItems[i], numberOfEntries: numberOfHeadings })
|
|
94
95
|
}
|
|
@@ -15,8 +15,22 @@ type NavItem = {
|
|
|
15
15
|
title: string;
|
|
16
16
|
titleInNav: string;
|
|
17
17
|
menuModalFullWidth?: true;
|
|
18
|
-
|
|
18
|
+
/**
|
|
19
|
+
* Maps viewport column counts to column indices.
|
|
20
|
+
* Indicates this nav item is a "column entry" (a level-1 or level-4 heading that starts a new column section).
|
|
21
|
+
* Example: `{ 1: 0, 2: 1, 3: 0 }` means:
|
|
22
|
+
* - When there's 1 column, put this item in column 0
|
|
23
|
+
* - When there are 2 columns, put it in column 1
|
|
24
|
+
* - When there are 3 columns, put it in column 0
|
|
25
|
+
*/
|
|
26
|
+
isPotentialColumn?: ColumnMap;
|
|
19
27
|
};
|
|
28
|
+
/**
|
|
29
|
+
* A mapping of viewport column counts to column indices.
|
|
30
|
+
* Used to determine which column a nav item should be placed in for different viewport widths.
|
|
31
|
+
* Key: number of columns in the viewport
|
|
32
|
+
* Value: the column index (0-based) where this item should be placed
|
|
33
|
+
*/
|
|
20
34
|
type ColumnMap = Record<number, number>;
|
|
21
35
|
type PropsNavItem = PropsAnchor & PropsSpan;
|
|
22
36
|
type PropsAnchor = React.HTMLProps<HTMLAnchorElement>;
|
|
@@ -38,5 +52,13 @@ declare function getNavItemsWithComputed(navItems: NavItem[], currentUrl: string
|
|
|
38
52
|
title: string;
|
|
39
53
|
titleInNav: string;
|
|
40
54
|
menuModalFullWidth?: true;
|
|
41
|
-
|
|
55
|
+
/**
|
|
56
|
+
* Maps viewport column counts to column indices.
|
|
57
|
+
* Indicates this nav item is a "column entry" (a level-1 or level-4 heading that starts a new column section).
|
|
58
|
+
* Example: `{ 1: 0, 2: 1, 3: 0 }` means:
|
|
59
|
+
* - When there's 1 column, put this item in column 0
|
|
60
|
+
* - When there are 2 columns, put it in column 1
|
|
61
|
+
* - When there are 3 columns, put it in column 0
|
|
62
|
+
*/
|
|
63
|
+
isPotentialColumn?: ColumnMap;
|
|
42
64
|
}[];
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
export { determineNavItemsColumnLayout };
|
|
2
|
-
import { assert
|
|
2
|
+
import { assert } from './utils/assert';
|
|
3
3
|
function determineNavItemsColumnLayout(navItems) {
|
|
4
4
|
const columnLayouts = getColumnEntries(navItems);
|
|
5
5
|
columnLayouts.forEach((columnEntries) => {
|
|
6
6
|
for (let numberOfColumns = columnEntries.length; numberOfColumns >= 1; numberOfColumns--) {
|
|
7
7
|
const columnMapping = determineColumnLayout(columnEntries.map((columnEntry) => columnEntry.numberOfEntries), numberOfColumns);
|
|
8
8
|
columnEntries.forEach((columnEntry, i) => {
|
|
9
|
-
columnEntry.navItemLeader.
|
|
10
|
-
columnEntry.navItemLeader.
|
|
9
|
+
columnEntry.navItemLeader.isPotentialColumn ??= {};
|
|
10
|
+
columnEntry.navItemLeader.isPotentialColumn[numberOfColumns] = columnMapping[i];
|
|
11
11
|
});
|
|
12
12
|
}
|
|
13
13
|
});
|
|
@@ -49,7 +49,8 @@ function getColumnEntries(navItems) {
|
|
|
49
49
|
isFullWidthCategory = !!navItem.menuModalFullWidth;
|
|
50
50
|
if (isFullWidthCategory)
|
|
51
51
|
isFullWidthCategoryBegin = true;
|
|
52
|
-
if (isFullWidthCategoryPrevious !== undefined &&
|
|
52
|
+
if (isFullWidthCategoryPrevious !== undefined &&
|
|
53
|
+
(isFullWidthCategoryPrevious !== isFullWidthCategory || (isFullWidthCategory && columnEntries.length > 0))) {
|
|
53
54
|
columnLayouts.push(columnEntries);
|
|
54
55
|
columnEntries = [];
|
|
55
56
|
}
|
|
@@ -69,11 +70,11 @@ function getColumnEntries(navItems) {
|
|
|
69
70
|
assert(numberOfHeadings !== null);
|
|
70
71
|
if (isFullWidthCategoryBegin) {
|
|
71
72
|
assert(navItem.level === 1);
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
73
|
+
// If followed by a level-4 heading, use its count instead
|
|
74
|
+
if (navItemNext && navItemNext.level === 4) {
|
|
75
|
+
assert(navItemNext.numberOfHeadings);
|
|
76
|
+
numberOfHeadings = navItemNext.numberOfHeadings;
|
|
77
|
+
}
|
|
77
78
|
}
|
|
78
79
|
columnEntries.push({ navItemLeader: navItems[i], numberOfEntries: numberOfHeadings });
|
|
79
80
|
}
|
package/dist/types/Config.d.ts
CHANGED
package/docsearch/SearchLink.tsx
CHANGED
|
@@ -33,7 +33,11 @@ function SearchIcon() {
|
|
|
33
33
|
<img
|
|
34
34
|
src={iconMagnifyingGlass}
|
|
35
35
|
width={18}
|
|
36
|
-
style={{
|
|
36
|
+
style={{
|
|
37
|
+
marginRight: 'var(--icon-text-padding)',
|
|
38
|
+
position: 'relative',
|
|
39
|
+
top: 1,
|
|
40
|
+
}}
|
|
37
41
|
className="decolorize-7"
|
|
38
42
|
/>
|
|
39
43
|
)
|
package/icons/coin.svg
ADDED
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
<svg width="448.52" height="448.52" data-name="Layer 1" version="1.1" viewBox="0 0 448.52 448.52" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<defs>
|
|
3
|
+
<linearGradient id="linear-gradient" x1="256" x2="256" y1="460.43" y2="11.91" gradientTransform="translate(-31.74,-11)" gradientUnits="userSpaceOnUse">
|
|
4
|
+
<stop stop-color="#bd7f26" offset="0"/>
|
|
5
|
+
<stop stop-color="#e3ca75" offset="1"/>
|
|
6
|
+
</linearGradient>
|
|
7
|
+
<linearGradient id="linear-gradient-2" x1="256" x2="256" y1="449.56" y2="22.68" gradientTransform="translate(-31.74,-11)" gradientUnits="userSpaceOnUse">
|
|
8
|
+
<stop stop-color="#e5b151" offset="0"/>
|
|
9
|
+
<stop stop-color="#ffd645" offset="1"/>
|
|
10
|
+
</linearGradient>
|
|
11
|
+
<linearGradient id="linear-gradient-3" x1="1902.1" x2="1902.1" y1="5236.8" y2="4882" gradientTransform="rotate(180 1063.2 2641.5)" gradientUnits="userSpaceOnUse">
|
|
12
|
+
<stop stop-color="#bd7f26" offset="0"/>
|
|
13
|
+
<stop stop-color="#fbf2ac" offset="1"/>
|
|
14
|
+
</linearGradient>
|
|
15
|
+
<linearGradient id="linear-gradient-4" x1="1902.1" x2="1902.1" y1="5228.2" y2="4890.5" gradientTransform="rotate(180 1063.2 2641.5)" gradientUnits="userSpaceOnUse">
|
|
16
|
+
<stop stop-color="#edb300" offset="0"/>
|
|
17
|
+
<stop stop-color="#be871d" offset="1"/>
|
|
18
|
+
</linearGradient>
|
|
19
|
+
<linearGradient id="linear-gradient-5" x1="256" x2="256" y1="372.53" y2="113.06" gradientTransform="translate(-31.74,-11)" gradientUnits="userSpaceOnUse">
|
|
20
|
+
<stop stop-color="#bd7f26" offset="0"/>
|
|
21
|
+
<stop stop-color="#bd7f26" offset="1"/>
|
|
22
|
+
</linearGradient>
|
|
23
|
+
<linearGradient id="linear-gradient-6" x1="256" x2="256" y1="105.52" y2="365" gradientTransform="translate(-31.74,-11)" gradientUnits="userSpaceOnUse">
|
|
24
|
+
<stop stop-color="#ffd645" offset="0"/>
|
|
25
|
+
<stop stop-color="#e5b151" offset="1"/>
|
|
26
|
+
</linearGradient>
|
|
27
|
+
</defs>
|
|
28
|
+
<title>dollar_coin</title>
|
|
29
|
+
<g fill-rule="evenodd">
|
|
30
|
+
<path d="m224.26 448.52c123.53 0 224.26-100.67 224.26-224.13 0-123.73-100.73-224.39-224.26-224.39s-224.26 100.66-224.26 224.39c0 123.46 100.74 224.13 224.26 224.13z" fill="url(#linear-gradient)"/>
|
|
31
|
+
<path d="m224.26 437.7c117.57 0 213.44-95.81 213.44-213.31 0-117.76-95.87-213.57-213.44-213.57s-213.44 95.81-213.44 213.57c0 117.5 95.88 213.31 213.44 213.31z" fill="url(#linear-gradient-2)"/>
|
|
32
|
+
<path d="m224.26 46.89c-97.7 0-177.37 79.62-177.37 177.27 0 97.84 79.67 177.47 177.37 177.47s177.37-79.63 177.37-177.47c0-97.65-79.67-177.27-177.37-177.27z" fill="url(#linear-gradient-3)"/>
|
|
33
|
+
<path d="m224.26 55.45c-93 0-168.81 75.78-168.81 168.71 0 93.14 75.81 168.91 168.81 168.91s168.81-75.77 168.81-168.91c0-92.93-75.81-168.71-168.81-168.71z" fill="url(#linear-gradient-4)"/>
|
|
34
|
+
<path d="m158 271.81h13.42c15.66 0 15.41 2.48 22.62 14.66 8 13.42 26.1 21.37 45.48 13.17 9.69-4.22 17.15-17.14 8.7-32.06-8-14.41-26.59-16.4-45-20.88-19.89-5-40.76-11.68-51-26.84-15.66-23.86-15.41-57.66 17.4-78.29 13.17-8.21 26.6-13.42 41.76-14.91v-14.41c0-10.69 3-10.19 12.92-10.19 4.48 0 8 0.24 9.95 1.74s2.23 4.47 2.23 9.19v13.92a62.1 62.1 0 0 1 9.44 1.49c27.34 4.72 45.23 15.41 53.43 43.24 4.23 14.17-2.73 17.15-15.65 17.15h-19.82c-12.43 0-14.66-3-17.89-14.41-1.49-4.72-3.73-8.2-7.45-10.44-15.91-9.69-43.75-1.74-42.5 19.63 1 14.17 20.62 19.38 40.76 25.6 26.1 7.7 53.69 15.16 64.62 39.76 11.68 26.6 4.47 56.42-25.1 73.32a106.88 106.88 0 0 1-39.77 12.92v14.66c0 10.69-2 11.68-11.93 11.68-10.68 0-13.17 0-13.17-11.68v-14.4a145.16 145.16 0 0 1-20.14-3c-27.09-5.71-40.76-17.64-48.21-43.74-3.98-14.4 1.24-16.88 14.9-16.88z" fill="url(#linear-gradient-5)"/>
|
|
35
|
+
<path d="m158 256.74h13.42c15.66 0 15.41 2.48 22.62 14.66 8 13.42 26.1 21.37 45.48 13.17 9.69-4.22 17.15-17.14 8.7-32.06-8-14.41-26.59-16.4-45-20.88-19.89-5-40.76-11.68-51-26.84-15.66-23.86-15.41-57.66 17.4-78.29 13.17-8.21 26.6-13.42 41.76-14.91v-14.41c0-10.69 3-10.19 12.92-10.19 4.48 0 8 0.24 9.95 1.74s2.23 4.47 2.23 9.19v13.92a62.1 62.1 0 0 1 9.44 1.49c27.34 4.72 45.23 15.41 53.43 43.24 4.23 14.17-2.73 17.15-15.65 17.15h-19.82c-12.43 0-14.66-3-17.89-14.41-1.49-4.72-3.73-8.2-7.45-10.44-15.91-9.69-43.75-1.74-42.5 19.63 1 14.17 20.62 19.38 40.76 25.6 26.1 7.7 53.69 15.16 64.62 39.76 11.68 26.6 4.47 56.42-25.1 73.32a106.88 106.88 0 0 1-39.77 12.92v14.66c0 10.69-2 11.68-11.93 11.68-10.68 0-13.17 0-13.17-11.68v-14.39a145.16 145.16 0 0 1-20.14-3c-27.09-5.71-40.76-17.64-48.21-43.74-3.98-14.41 1.24-16.89 14.9-16.89z" fill="#fbf2ac"/>
|
|
36
|
+
<path d="m158 264.27h13.42c15.66 0 15.41 2.48 22.62 14.66 8 13.42 26.1 21.37 45.48 13.17 9.74-4.21 17.15-17.1 8.74-32.1-8-14.41-26.59-16.4-45-20.88-19.89-5-40.76-11.68-51-26.84-15.66-23.86-15.41-57.66 17.4-78.29 13.17-8.21 26.6-13.42 41.76-14.91v-14.37c0-10.69 3-10.19 12.92-10.19 4.48 0 8 0.24 9.95 1.74s2.23 4.47 2.23 9.19v13.92a62.1 62.1 0 0 1 9.44 1.49c27.34 4.72 45.23 15.41 53.43 43.24 4.23 14.17-2.73 17.15-15.65 17.15h-19.86c-12.43 0-14.66-3-17.89-14.41-1.49-4.72-3.73-8.2-7.45-10.44-15.91-9.69-43.75-1.74-42.5 19.63 1 14.17 20.62 19.38 40.76 25.6 26.1 7.7 53.69 15.16 64.62 39.76 11.68 26.6 4.47 56.42-25.1 73.32a106.88 106.88 0 0 1-39.77 12.92v14.66c0 10.69-2 11.68-11.93 11.68-10.68 0-13.17 0-13.17-11.68v-14.39a145.16 145.16 0 0 1-20.14-3c-27.09-5.71-40.76-17.64-48.21-43.74-3.98-14.4 1.24-16.89 14.9-16.89z" fill="url(#linear-gradient-6)"/>
|
|
37
|
+
</g>
|
|
38
|
+
</svg>
|
package/icons/index.ts
CHANGED
|
@@ -8,3 +8,5 @@ export { default as iconCompass } from './compass.svg'
|
|
|
8
8
|
export { default as iconScroll } from './scroll.svg'
|
|
9
9
|
export { default as iconGlobe } from './globe.svg'
|
|
10
10
|
export { default as iconPlug } from './plug.svg'
|
|
11
|
+
export { default as iconLoudspeaker } from './loudspeaker.svg'
|
|
12
|
+
export { default as iconCoin } from './coin.svg'
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36"><path fill="#BE1931" d="M12.908 30.75c-.276 2.209-2.291 3-4.5 3s-3.776-1.791-3.5-4l1-9c.276-2.209 2.291-4 4.5-4s6.468 0 3.5 4-1 10-1 10z"/><path fill="#CCD6DD" d="M35.825 14.75c0 6.902-1.544 12.5-3.45 12.5-1.905 0-20.45-5.598-20.45-12.5 0-6.903 18.545-12.5 20.45-12.5 1.906 0 3.45 5.597 3.45 12.5z"/><ellipse fill="#66757F" cx="32.375" cy="14.75" rx="3.45" ry="12.5"/><path fill="#DD2E44" d="M17.925 21.75l-14-1c-5 0-5-12 0-12l14-1c-3 3-3 11 0 14z"/><ellipse fill="#99AAB5" cx="31.325" cy="14.75" rx="1.5" ry="4.348"/></svg>
|
package/package.json
CHANGED