@brillout/docpress 0.9.8 → 0.10.1

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.
Files changed (63) hide show
  1. package/Layout.tsx +102 -40
  2. package/{navigation → MenuModal}/Collapsible.css +7 -0
  3. package/MenuModal/NavigationWithColumnLayout.css +11 -0
  4. package/MenuModal/NavigationWithColumnLayout.tsx +253 -0
  5. package/MenuModal/toggleMenuModal.ts +132 -0
  6. package/MenuModal.tsx +68 -79
  7. package/{navigation/Navigation.css → NavItemComponent.css} +1 -23
  8. package/NavItemComponent.tsx +149 -0
  9. package/components/Note.css +0 -1
  10. package/config/resolveHeadingsData.ts +1 -1
  11. package/css/code/diff.css +10 -5
  12. package/css/code.css +1 -1
  13. package/css/colorize-on-hover.css +6 -7
  14. package/css/heading.css +9 -3
  15. package/css/index.css +1 -0
  16. package/dist/NavItemComponent.d.ts +39 -0
  17. package/dist/NavItemComponent.js +109 -0
  18. package/dist/config/resolveHeadingsData.d.ts +1 -1
  19. package/dist/config/resolvePageContext.d.ts +2 -2
  20. package/dist/renderer/determineNavItemsColumnLayout.d.ts +1 -1
  21. package/docsearch/SearchLink.tsx +7 -3
  22. package/icons/books.svg +46 -0
  23. package/icons/gear.svg +35 -0
  24. package/icons/index.ts +5 -0
  25. package/icons/magnifying-glass.svg +31 -0
  26. package/icons/seedling.svg +24 -0
  27. package/index.ts +2 -0
  28. package/initKeyBindings.ts +1 -1
  29. package/package.json +1 -1
  30. package/renderer/determineNavItemsColumnLayout.ts +1 -1
  31. package/renderer/initOnNavigation.ts +1 -1
  32. package/renderer/onRenderClient.tsx +1 -1
  33. package/utils/css.ts +0 -6
  34. package/dist/Layout.d.ts +0 -15
  35. package/dist/Layout.js +0 -321
  36. package/dist/MenuModal.d.ts +0 -13
  37. package/dist/MenuModal.js +0 -124
  38. package/dist/NavSecondaryContent.d.ts +0 -6
  39. package/dist/NavSecondaryContent.js +0 -57
  40. package/dist/autoScrollNav.d.ts +0 -3
  41. package/dist/autoScrollNav.js +0 -35
  42. package/dist/components/EditPageNote.d.ts +0 -7
  43. package/dist/components/EditPageNote.js +0 -11
  44. package/dist/docsearch/SearchLink.d.ts +0 -4
  45. package/dist/docsearch/SearchLink.js +0 -25
  46. package/dist/docsearch/toggleDocsearchModal.d.ts +0 -4
  47. package/dist/docsearch/toggleDocsearchModal.js +0 -26
  48. package/dist/navigation/Collapsible.d.ts +0 -10
  49. package/dist/navigation/Collapsible.js +0 -35
  50. package/dist/navigation/Navigation.d.ts +0 -21
  51. package/dist/navigation/Navigation.js +0 -255
  52. package/dist/utils/PassTrough.d.ts +0 -3
  53. package/dist/utils/PassTrough.js +0 -6
  54. package/dist/utils/Style.d.ts +0 -5
  55. package/dist/utils/Style.js +0 -6
  56. package/dist/utils/css.d.ts +0 -1
  57. package/dist/utils/css.js +0 -27
  58. package/dist/utils/getViewportWidth.d.ts +0 -1
  59. package/dist/utils/getViewportWidth.js +0 -4
  60. package/dist/utils/throttle.d.ts +0 -1
  61. package/dist/utils/throttle.js +0 -14
  62. package/navigation/Navigation.tsx +0 -382
  63. /package/{navigation → MenuModal}/Collapsible.tsx +0 -0
@@ -1,5 +1,5 @@
1
1
  export { resolveHeadingsData };
2
- import type { NavItem } from '../navigation/Navigation';
2
+ import type { NavItem } from '../NavItemComponent';
3
3
  import type { LinkData } from '../components';
4
4
  import type { PageContextOriginal } from './resolvePageContext';
5
5
  declare function resolveHeadingsData(pageContext: PageContextOriginal): {
@@ -10,8 +10,8 @@ type Exports = {
10
10
  type PageContextOriginal = PageContextServer;
11
11
  type PageContextResolved = ReturnType<typeof resolvePageContext>;
12
12
  declare function resolvePageContext(pageContext: PageContextOriginal): {
13
- navItemsAll: import("../navigation/Navigation").NavItem[];
14
- navItemsDetached: import("../navigation/Navigation").NavItem[] | undefined;
13
+ navItemsAll: import("../NavItemComponent").NavItem[];
14
+ navItemsDetached: import("../NavItemComponent").NavItem[] | undefined;
15
15
  linksAll: import("../components").LinkData[];
16
16
  isLandingPage: boolean;
17
17
  pageTitle: string | null;
@@ -1,3 +1,3 @@
1
1
  export { determineNavItemsColumnLayout };
2
- import { type NavItem } from '../navigation/Navigation';
2
+ import { type NavItem } from '../NavItemComponent';
3
3
  declare function determineNavItemsColumnLayout(navItems: NavItem[]): undefined;
@@ -2,6 +2,7 @@ export { SearchLink }
2
2
 
3
3
  import React from 'react'
4
4
  import { openDocsearchModal } from './toggleDocsearchModal'
5
+ import { iconMagnifyingGlass } from '../icons'
5
6
 
6
7
  type PropsAnchor = React.HTMLProps<HTMLAnchorElement>
7
8
  function SearchLink(props: PropsAnchor) {
@@ -29,8 +30,11 @@ function SearchLink(props: PropsAnchor) {
29
30
  }
30
31
  function SearchIcon() {
31
32
  return (
32
- <span style={{ marginRight: 'var(--icon-text-padding)', fontSize: '1.1em' }} className="decolorize-7 desktop-fade">
33
- 🔍
34
- </span>
33
+ <img
34
+ src={iconMagnifyingGlass}
35
+ width={21}
36
+ style={{ marginRight: 'var(--icon-text-padding)' }}
37
+ className="decolorize-7 desktop-fade"
38
+ />
35
39
  )
36
40
  }
@@ -0,0 +1,46 @@
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <!-- Generator: Adobe Illustrator 25.2.3, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
+ <svg width="120" height="120" version="1.1" viewBox="0 0 120 120" xml:space="preserve" xmlns="http://www.w3.org/2000/svg">
4
+ <g transform="translate(-3.9652 -5.0005)">
5
+
6
+ <path d="m118.03 102.32-45.74 20.68c-2.82 1.33-5.76 1.2-8.46-0.36l-57.74-29.32c-1.65-1.06-2.14-2.61-2.04-3.69s0.35-2.25 3.25-3.09l4.28-1.58 57.92 31.57 41.16-16.82z" fill="#01579b"/>
7
+ <path d="m71.74 119.69c-2.32 1.09-5.03 0.99-7.26-0.26l-56.37-28.4c-0.8-0.44-1.04-1.45-0.56-2.23 1.24-2.05 3.52-8.53-0.24-13.91l63.66 30.65z" fill="#f5f5f5"/>
8
+ <path d="m115.59 99.98s-43.83 19.7-43.85 19.71c-1.45 0.63-4.34 1.75-7.67-0.49 2.63 0.19 4.48-0.9 5.43-2.67 0.93-1.72 0.65-4.54-0.48-6.13-0.69-0.96-2.54-2.49-3.35-3.35l47.43-18.55c4.2-1.73 8.14 0.86 8.77 4.01 0.7 3.56-3.84 6.47-6.28 7.47z" fill="#94c6d6"/>
9
+ <path d="m117.78 86.96-45.27 20.2c-2.85 1.13-6.04 0.98-8.77-0.4l-57.84-29.38c-0.56-0.28-1.39-1.05-1.72-2.1-0.54-1.75 0.14-3.95 2.19-4.65l62.68 31.95 42.92-18.37z" fill="#01579b"/>
10
+ <path d="m121.19 89.89-4.93-1.79-10.16 0.59-33.58 14.99c-2.85 1.13-6.04 0.98-8.77-0.4l-57.85-29.37c-1.49-0.76-1.17-2.97 0.47-3.28l41.69-18.65c1.19-0.22 2.41-0.09 3.52 0.38l59.49 28.36s9.45 6.47 10.12 9.17z" fill="#0091ea"/>
11
+ <path d="m105.53 88.98s6.26-2.45 11.18-2.23 6.63 3.67 6.63 3.67c-0.93-4.23-5.3-6.39-5.3-6.39l-65-32.73c-0.45-0.19-2.11-0.58-4.66 0.47-2.06 0.85-8.79 4-8.79 4z" fill="#616161"/>
12
+ <path d="m123.62 91.22c-0.47-1.87-1.63-3.87-3.77-4.84-2.82-1.27-6.84-0.94-9.41 0.4l-4.91 2.18v3.46l6.21-2.76c6.04-2.69 8.72 1.34 8.95 2.29 0.96 3.87-0.9 6.11-6.39 8.63l-8.92 4.02v3.48l10.26-4.57c4.54-1.82 9.72-5.24 7.98-12.29z" fill="#424242"/>
13
+
14
+
15
+ <polygon points="18.45 65.23 37.88 91.93 33.01 90.31 15.74 66.44" fill="#01579b"/>
16
+
17
+
18
+ <polygon points="55.16 101.31 52.08 98.87 105.53 87.96 105.53 89.71 98.04 92.55" fill="#01579b"/>
19
+
20
+
21
+ <path d="m14.8 46.18 67.51-11.28 29.49 32.47c1.49 1.57 0.68 4.17-1.44 4.6l-69.7 14.3z" fill="#9ccc65"/>
22
+
23
+ <path d="m110.36 69.17-69.22 14.02-0.22 3.3 69.44-14.24c1.96-0.41 2.78-2.65 1.71-4.23-0.38 0.56-0.96 1-1.71 1.15z" fill="#689f38"/>
24
+
25
+ <path d="m114.09 84.3c0.73 1.16 0.07 2.69-1.27 2.96l-63.72 12.92c-3.83 0.79-7.59-1.72-7.93-5.62-0.29-3.3 1.94-6.29 5.19-6.97l61.28-13.76z" fill="#689f38"/>
26
+ <path d="m55.59 80.1-25.38-36.32-14.48 3.83c-3.35 3.33-2.1 8.8-2.1 8.8s22.17 35.58 25.67 40.13 8.61 3.84 8.61 3.84l8.63-1.74-0.9-16.1z" fill="#616161"/>
27
+ <path d="m55.59 80.34-12.19 2.52c-3.33 0.75-3.93 3.88-3.93 3.88l-29.43-42.17s-4.19 5.07-1.41 9.38l30.67 42.59c3.35 4.77 8.61 3.88 8.61 3.88l8.63-1.74-0.89-15.78z" fill="#424242"/>
28
+ <path d="m110.25 83c0.31 0.68-0.09 1.47-0.82 1.62l-60.93 12.5c-3.83 0.79-6.54-1.75-6.4-5.21 0.18-4.37 2.63-6.22 5.87-6.89l61.23-12.51s-2.08 2.34-0.49 6.72c0.54 1.51 1.12 2.85 1.54 3.77z" fill="#b9e4ea"/>
29
+ <line x1="45.21" x2="19.1" y1="83.7" y2="46.76" fill="none" stroke="#424242" stroke-miterlimit="10" stroke-width="2.071"/>
30
+
31
+ <polygon points="12.32 53.71 51.12 73.48 47.26 67.95 13.68 51.03" fill="#424242"/>
32
+ <polygon points="47.26 68.18 50.88 73.36 64.95 80.55 75.43 78.94 108.79 64.03 106.33 61.33 68.5 78.69" fill="#689f38"/>
33
+
34
+ <path d="m118.02 57.35-45.73 20.68c-2.82 1.33-5.76 1.2-8.46-0.36l-57.74-29.32c-1.65-1.06-2.14-2.61-2.04-3.69s0.35-2.25 3.25-3.09l2.71-1 59.32 29.11 48.17-19.93z" fill="#c62828"/>
35
+ <path d="m71.73 74.72c-2.32 1.09-5.03 0.99-7.26-0.26l-56.37-28.4c-0.8-0.44-1.04-1.45-0.56-2.23 1.24-2.05 3.52-8.53-0.24-13.91l62.24 31.66z" fill="#f5f5f5"/>
36
+ <path d="m115.58 55.01s-43.83 19.7-43.85 19.71c-1.45 0.63-4.34 1.75-7.67-0.49 2.63 0.19 4.48-0.9 5.43-2.67 0.93-1.72 0.65-4.54-0.48-6.13-0.69-0.96-2.54-2.49-3.35-3.35l47.43-18.55c4.2-1.73 8.14 0.86 8.77 4.01 0.7 3.56-3.84 6.47-6.28 7.47z" fill="#94c6d6"/>
37
+ <path d="m117.78 41.99-45.27 20.2c-2.85 1.13-6.04 0.98-8.77-0.4l-57.85-29.38c-0.6-0.3-1.5-1.07-1.79-2.16-0.43-1.62 0.13-3.75 2.26-4.59l53.01-11.23z" fill="#c62828"/>
38
+ <path d="m121.18 44.92-4.93-1.79-10.16 0.59-33.58 14.99c-2.85 1.13-6.04 0.98-8.77-0.4l-57.85-29.38c-1.49-0.76-0.96-2.77 0.47-3.28l41.7-18.64c1.19-0.22 2.41-0.09 3.52 0.38l59.49 28.36s9.44 6.46 10.11 9.17z" fill="#f44336"/>
39
+ <path d="m105.53 44s5.21-1.83 10.13-1.61 7.69 3.05 7.69 3.05c-1.01-4.52-5.3-6.39-5.3-6.39l-65-32.73c-0.45-0.19-2.11-0.58-4.66 0.47-2.06 0.85-8.79 4-8.79 4z" fill="#616161"/>
40
+
41
+ <polygon points="47.17 7.32 114.81 41.22 111.48 41.86 44.97 8.31" fill="#424242"/>
42
+
43
+ <path d="m123.61 46.25c-0.47-1.87-1.26-3.68-3.49-4.62-2.85-1.2-5.45-1.45-9.69 0.18l-4.91 2.18v3.46l6.21-2.76c3.15-1.48 7.79-1.16 8.95 2.29 1.27 3.78-0.9 6.11-6.39 8.63l-8.92 4.02v3.48l10.26-4.57c4.55-1.82 9.73-5.24 7.98-12.29z" fill="#424242"/>
44
+
45
+ </g>
46
+ </svg>
package/icons/gear.svg ADDED
@@ -0,0 +1,35 @@
1
+ <?xml version="1.0" encoding="utf-8"?>
2
+ <!-- Generator: Adobe Illustrator 25.2.3, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
+ <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
4
+ viewBox="0 0 128 128" style="enable-background:new 0 0 128 128;" xml:space="preserve">
5
+ <g>
6
+ <path style="fill:#82AEC0;" d="M124,71.85v-15.7c0-0.59-0.45-1.09-1.03-1.15l-17.83-1.89c-0.47-0.05-0.85-0.38-0.98-0.83
7
+ c-0.86-2.95-2.03-5.76-3.48-8.39c-0.23-0.41-0.19-0.92,0.11-1.28l11.28-13.94c0.37-0.46,0.34-1.13-0.08-1.54l-11.1-11.1
8
+ c-0.42-0.42-1.08-0.45-1.54-0.08L85.39,27.22c-0.37,0.3-0.87,0.33-1.28,0.11c-2.64-1.45-5.45-2.62-8.39-3.48
9
+ c-0.45-0.13-0.78-0.51-0.83-0.98L73,5.03C72.94,4.45,72.44,4,71.85,4h-15.7C55.56,4,55.06,4.45,55,5.03l-1.89,17.83
10
+ c-0.05,0.47-0.38,0.85-0.83,0.98c-2.95,0.86-5.76,2.03-8.39,3.48c-0.41,0.23-0.92,0.19-1.28-0.11L28.67,15.94
11
+ c-0.46-0.37-1.13-0.34-1.54,0.08l-11.1,11.1c-0.42,0.42-0.45,1.08-0.08,1.54l11.28,13.94c0.3,0.37,0.33,0.87,0.11,1.28
12
+ c-1.45,2.64-2.62,5.45-3.48,8.39c-0.13,0.45-0.51,0.78-0.98,0.83L5.03,55C4.45,55.06,4,55.56,4,56.15v15.7
13
+ c0,0.59,0.45,1.09,1.03,1.15l17.83,1.89c0.47,0.05,0.85,0.38,0.98,0.83c0.86,2.95,2.03,5.76,3.48,8.39
14
+ c0.23,0.41,0.19,0.92-0.11,1.28L15.94,99.33c-0.37,0.46-0.34,1.13,0.08,1.54l11.1,11.1c0.42,0.42,1.08,0.45,1.54,0.08l13.94-11.28
15
+ c0.37-0.3,0.87-0.33,1.28-0.11c2.64,1.45,5.45,2.62,8.39,3.48c0.45,0.13,0.78,0.51,0.83,0.98L55,122.97
16
+ c0.06,0.59,0.56,1.03,1.15,1.03h15.7c0.59,0,1.09-0.45,1.15-1.03l1.89-17.83c0.05-0.47,0.38-0.85,0.83-0.98
17
+ c2.95-0.86,5.76-2.03,8.39-3.48c0.41-0.23,0.92-0.19,1.28,0.11l13.94,11.28c0.46,0.37,1.13,0.34,1.54-0.08l11.1-11.1
18
+ c0.42-0.42,0.45-1.08,0.08-1.54l-11.28-13.94c-0.3-0.37-0.33-0.87-0.11-1.28c1.45-2.64,2.62-5.45,3.48-8.39
19
+ c0.13-0.45,0.51-0.78,0.98-0.83L122.97,73C123.55,72.94,124,72.44,124,71.85z M64,75.28c-6.23,0-11.28-5.05-11.28-11.28
20
+ S57.77,52.72,64,52.72S75.28,57.77,75.28,64S70.23,75.28,64,75.28z"/>
21
+ <path style="fill:#2F7889;" d="M80.56,49.48c3.67,4.18,5.78,9.77,5.43,15.85c-0.65,11.16-9.83,20.19-21,20.68
22
+ c-4.75,0.21-9.18-1.09-12.86-3.45c-0.28-0.18-0.58,0.2-0.34,0.44c4.46,4.55,10.85,7.22,17.85,6.67
23
+ c10.78-0.85,19.56-9.5,20.55-20.27c0.77-8.36-3.06-15.87-9.23-20.33C80.67,48.87,80.34,49.22,80.56,49.48z"/>
24
+ <g>
25
+ <path style="fill:#B9E4EA;" d="M43.87,65.32C43.2,52.17,51.7,42.53,63.88,42.53c0.65,0,1.68,0,2.48,0.92c1.01,1.18,1.1,2.6,0,3.77
26
+ c-0.81,0.86-1.95,0.92-2.53,1C51.53,49.81,48.65,57.57,48,64.99c-0.03,0.33,0.06,2.35-1.71,2.56
27
+ C44.14,67.8,43.88,65.64,43.87,65.32z"/>
28
+ </g>
29
+ <g>
30
+ <path style="fill:#94D1E0;" d="M25.24,65.87c-0.01-22.03,15.9-40.19,38.13-41.05c0.68-0.03,2.45,0,3.55,0.99
31
+ c1.01,0.91,1.38,2.51,0.79,3.82c-0.95,2.11-2.85,2.07-3.36,2.09c-18.51,0.66-34.18,15.73-34.19,33.95c0,0.29-0.05,0.58-0.15,0.84
32
+ l-0.1,0.25c-0.76,1.98-3.52,2.09-4.43,0.18l0,0C25.33,66.6,25.24,66.24,25.24,65.87z"/>
33
+ </g>
34
+ </g>
35
+ </svg>
package/icons/index.ts ADDED
@@ -0,0 +1,5 @@
1
+ // Playground: https://www.figma.com/design/EFFQgT1aDH5exs2bABaIFJ/Icons?t=y0K2dHfJgpxMIl1e-0
2
+ export { default as iconGear } from './gear.svg'
3
+ export { default as iconBooks } from './books.svg'
4
+ export { default as iconSeedling } from './seedling.svg'
5
+ export { default as iconMagnifyingGlass } from './magnifying-glass.svg'
@@ -0,0 +1,31 @@
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <!-- Generator: Adobe Illustrator 25.2.3, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
+ <svg id="_x31_" width="120.06" height="120.06" version="1.1" viewBox="0 0 120.06 120.06" xml:space="preserve" xmlns="http://www.w3.org/2000/svg">
4
+ <g transform="translate(-3.9699 -3.9648)">
5
+
6
+ <path d="m47.63 12.67c19.85 0 34.8 14.95 34.8 34.8s-16.15 36.01-36 36.01-34.8-14.95-34.8-34.8 16.15-36.01 36-36.01" fill="#81d4fa" opacity=".6"/>
7
+ <path d="m47.63 12.67c19.85 0 34.8 14.95 34.8 34.8s-16.15 36.01-36 36.01-34.8-14.95-34.8-34.8 16.15-36.01 36-36.01m-29.61 4.1c-19.68 19.68-10.02 48.43-2.33 56.28 14.23 14.52 40.83 22.79 60.73 2.88 18.43-18.43 11.81-41.8-1.17-56.09-8.62-9.48-37.56-22.74-57.23-3.07z" fill="#616161"/>
8
+ <path d="m99.78 90.86-8.33 8.38-19.62-19.8s-1.66-3.19 1.62-6.47 6.71-1.91 6.71-1.91z" fill="#bdbdbd"/>
9
+ <path d="m88.5 76.96c-1.13-0.9-5.05-3-9.36 1.28-4.3 4.28-2.55 7.66-1.7 8.91 0 0 30.53 33.87 31.92 35.27 2.05 2.05 6.26 0.3 10.16-3.6s5.78-7.67 3.58-9.87c-1.79-1.79-33.47-31.09-34.6-31.99z" fill="#616161"/>
10
+ <path d="m43.92 8.64c19.85 0 36 16.15 36 36s-16.15 36-36 36-36-16.15-36-36 16.15-36 36-36m0-3.96c-22.06 0-39.95 17.89-39.95 39.95s17.89 39.95 39.95 39.95 39.95-17.88 39.95-39.95-17.89-39.95-39.95-39.95z" fill="#bdbdbd"/>
11
+
12
+ <ellipse transform="matrix(.7071 -.7071 .7071 .7071 -47.973 116.8)" cx="117.01" cy="116.31" rx="9.25" ry="3.56" fill="#424242"/>
13
+ <linearGradient id="SVGID_1_" x1="20.385" x2="36.781" y1="18.024" y2="44.616" gradientUnits="userSpaceOnUse">
14
+ <stop stop-color="#fff" offset=".2853"/>
15
+ <stop stop-color="#fff" stop-opacity="0" offset="1"/>
16
+ </linearGradient>
17
+ <path d="m26.52 23.6c-6.52 6.83-9.08 14.39-9.14 22.79-0.02 3.09 0.41 6.36 2.32 8.78s5.7 3.57 8.2 1.76c1.66-1.2 2.35-3.29 3.16-5.16 1.24-2.87 2.97-5.54 5.1-7.84 2.66-2.88 5.92-5.18 8.46-8.16s4.35-7.01 3.33-10.8c-1.01-3.71-4.67-6.33-8.48-6.76s-9.19 1.45-12.95 5.39z" fill="url(#SVGID_1_)"/>
18
+ <g fill="#fff" opacity=".59">
19
+ <path d="m64.05 75.78c0-0.46 0.22-0.88 0.59-1.15 1.95-1.39 7.2-4.64 11.73-13.28 2.63-5.04 3.63-9.24 3.91-10.74 0.79-4.24 3.01-2.82 2.7-0.08-0.36 3.12-3.07 16.85-16.68 26.38-0.95 0.67-2.25 0.03-2.25-1.13z"/>
20
+
21
+
22
+ <path d="m26.39 11.39c-0.13 1.3-2.34 2.53-2.73 2.78-2.02 1.3-7.02 3.85-11.59 12.47-2.13 4.01-3.66 8.14-4.18 10.19-0.85 3.35-3.14 2.68-2.7-0.05 0.5-3.1 3.85-16.69 17.88-25.58 0.99-0.62 3.49-1.53 3.32 0.19z"/>
23
+ </g>
24
+
25
+ <linearGradient id="SVGID_2_" x1="58.951" x2="63.085" y1="95.509" y2="52.792" gradientUnits="userSpaceOnUse">
26
+ <stop stop-color="#fff" offset=".2853"/>
27
+ <stop stop-color="#fff" stop-opacity="0" offset="1"/>
28
+ </linearGradient>
29
+ <path d="m55.92 73.93c-4.45 0.81-5.77-1.05-5.21-2.9 0.44-1.47 2.08-2.1 3.55-2.54 7.84-2.35 14.46-8.84 19.27-15.28 0.11 5.59-1.36 8.83-4.05 12.15-2.63 3.23-6.72 7.32-13.56 8.57z" fill="url(#SVGID_2_)"/>
30
+ </g>
31
+ </svg>
@@ -0,0 +1,24 @@
1
+ <svg width="120" height="120" viewBox="0 0 120 120" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g clip-path="url(#clip0_1_2)">
3
+ <path d="M70.614 45.43C70.614 45.43 70.444 45.64 70.134 46.03C69.834 46.42 69.334 47 68.794 47.74C68.304 48.5 67.644 49.33 67.004 50.44C66.684 50.99 66.334 51.57 65.974 52.18C65.634 52.8 65.304 53.48 64.944 54.17C64.574 54.85 64.244 55.6 63.914 56.38C63.594 57.16 63.194 57.94 62.924 58.79C62.624 59.63 62.304 60.5 61.984 61.38C61.714 62.28 61.444 63.21 61.174 64.15C60.874 65.08 60.694 66.07 60.454 67.05C60.224 68.03 59.984 69.02 59.834 70.05C59.664 71.07 59.474 72.09 59.314 73.12L58.924 76.24C58.774 77.27 58.724 78.33 58.644 79.37C58.584 80.41 58.464 81.45 58.444 82.48C58.424 84.55 58.294 86.58 58.394 88.55C58.444 90.52 58.474 92.42 58.644 94.23C58.784 96.03 58.864 97.74 59.084 99.31C59.264 100.88 59.424 102.32 59.564 103.6C59.764 104.87 59.934 105.98 60.074 106.89C60.354 108.71 60.514 109.76 60.514 109.76L60.534 109.87C60.764 111.35 59.744 112.74 58.264 112.96C56.784 113.19 55.394 112.17 55.174 110.69C55.174 110.67 55.164 110.63 55.164 110.61C55.164 110.61 55.024 109.53 54.794 107.63C54.674 106.68 54.534 105.53 54.364 104.21C54.254 102.88 54.134 101.38 54.004 99.75C53.844 98.12 53.824 96.34 53.754 94.46C53.654 92.58 53.704 90.59 53.734 88.54C53.714 86.49 53.934 84.36 54.034 82.21C54.094 81.13 54.254 80.05 54.364 78.96C54.494 77.87 54.584 76.78 54.784 75.7C54.964 74.62 55.144 73.53 55.314 72.45C55.534 71.38 55.794 70.31 56.024 69.25C56.244 68.19 56.534 67.15 56.834 66.13C57.144 65.11 57.384 64.09 57.754 63.12C58.094 62.14 58.434 61.19 58.764 60.25C59.154 59.33 59.524 58.43 59.894 57.56C60.234 56.68 60.694 55.87 61.074 55.06C61.464 54.26 61.854 53.49 62.284 52.77C62.704 52.05 63.084 51.36 63.484 50.71C63.904 50.08 64.314 49.49 64.694 48.93C65.434 47.81 66.254 46.89 66.834 46.11C67.454 45.37 67.954 44.86 68.294 44.47C68.634 44.1 68.814 43.9 68.814 43.9C69.254 43.42 69.994 43.38 70.474 43.82C70.954 44.25 71.004 44.95 70.614 45.43Z" fill="#6FBB39" stroke="#6FBB39" stroke-width="4.4032"/>
4
+ <path d="M0.00440228 30.38C0.00440228 30.38 -0.815599 56.3 20.0444 68.2C40.9044 80.1 56.2044 72.12 56.2044 72.12C56.2044 72.12 60.2044 26.14 0.00440228 30.38Z" fill="url(#paint0_linear_1_2)"/>
5
+ <path opacity="0.2" d="M7.5944 32.84C24.1244 32.84 36.4644 37.15 44.2844 45.64C52.5944 54.66 53.4844 66.11 53.5044 70.28C51.6044 70.97 47.9144 72 42.9644 72C35.8344 72 28.5744 69.92 21.3944 65.82C5.9044 56.99 3.2644 39.45 2.8244 32.96C4.4444 32.88 6.0444 32.84 7.5944 32.84ZM7.5944 30.1C5.1844 30.1 2.6644 30.19 0.00440228 30.38C0.00440228 30.38 -0.815599 56.3 20.0444 68.2C28.9544 73.29 36.8544 74.74 42.9744 74.74C51.1844 74.74 56.2044 72.12 56.2044 72.12C56.2044 72.12 59.8444 30.1 7.5944 30.1Z" fill="#3C743E"/>
6
+ <path d="M119.72 6.0005C119.72 6.0005 89.58 -1.8395 72.11 18.7505C54.64 39.3405 59.89 59.8405 59.89 59.8405C59.89 59.8405 111.59 72.5305 119.72 6.0005Z" fill="url(#paint1_linear_1_2)"/>
7
+ <path opacity="0.2" d="M106.28 7.2705C110.7 7.2705 114.41 7.7705 116.67 8.1605C113.94 27.2005 107.2 41.0305 96.6 49.3005C87.32 56.5405 76.86 58.0605 69.71 58.0605C66.47 58.0605 63.84 57.7505 62.24 57.4905C61.51 52.4205 60.62 36.5005 74.19 20.5005C83.49 9.5705 96.77 7.2705 106.28 7.2705ZM106.28 4.5305C96.03 4.5305 82.03 7.0605 72.11 18.7405C54.64 39.3305 59.89 59.8405 59.89 59.8405C59.89 59.8405 63.83 60.8105 69.71 60.8105C85.12 60.8105 113.83 54.1605 119.71 6.0005C119.72 6.0005 114.08 4.5305 106.28 4.5305Z" fill="#3C743E"/>
8
+ <path opacity="0.2" d="M63.364 53.49C63.364 53.49 63.834 52.68 64.664 51.27C65.074 50.56 65.574 49.71 66.214 48.73C66.844 47.76 67.514 46.63 68.334 45.48C69.134 44.31 69.994 43.04 70.974 41.75C71.914 40.43 72.994 39.1 74.104 37.72C74.644 37.02 75.264 36.36 75.844 35.67C76.434 34.98 77.034 34.28 77.674 33.61C78.304 32.93 78.944 32.25 79.594 31.57C80.264 30.91 80.924 30.24 81.594 29.58C82.254 28.91 82.974 28.29 83.654 27.65C84.334 27.01 85.034 26.38 85.744 25.79C87.134 24.57 88.564 23.44 89.944 22.35C91.344 21.29 92.704 20.27 94.034 19.35C95.364 18.44 96.614 17.58 97.814 16.84C98.994 16.07 100.094 15.41 101.084 14.84C102.064 14.25 102.924 13.75 103.644 13.37C105.074 12.58 105.894 12.13 105.894 12.13C105.894 12.13 105.094 12.62 103.704 13.47C103.004 13.89 102.164 14.43 101.214 15.06C100.254 15.68 99.184 16.39 98.054 17.2C96.894 17.99 95.684 18.9 94.414 19.87C93.134 20.84 91.834 21.91 90.494 23.03C89.174 24.17 87.814 25.35 86.494 26.62C85.814 27.24 85.164 27.88 84.514 28.55C83.874 29.22 83.194 29.85 82.574 30.54C81.944 31.22 81.314 31.91 80.694 32.59C80.094 33.29 79.494 33.99 78.904 34.69C78.304 35.38 77.744 36.09 77.194 36.8C76.654 37.51 76.074 38.18 75.574 38.89C74.554 40.29 73.554 41.64 72.684 42.98C71.774 44.29 70.994 45.57 70.264 46.75C69.514 47.92 68.914 49.03 68.354 50C67.794 50.96 67.324 51.84 66.944 52.57C66.184 54.02 65.744 54.85 65.744 54.85C65.394 55.52 64.564 55.78 63.894 55.42C63.224 55.06 62.964 54.24 63.324 53.57L63.364 53.49Z" stroke="#1C5705" stroke-width="2.8913"/>
9
+ <path opacity="0.2" d="M50.264 67C50.264 67 49.834 66.19 49.074 64.78C48.884 64.43 48.674 64.04 48.444 63.61C48.194 63.21 47.924 62.78 47.644 62.32C47.074 61.39 46.444 60.34 45.634 59.25C45.244 58.7 44.834 58.12 44.414 57.53C43.954 56.96 43.484 56.37 43.004 55.77C42.064 54.53 40.904 53.37 39.784 52.1C38.564 50.93 37.364 49.64 35.984 48.5C34.664 47.29 33.214 46.21 31.774 45.1C30.284 44.07 28.814 42.99 27.254 42.11C25.744 41.15 24.164 40.36 22.654 39.56C21.894 39.17 21.114 38.85 20.374 38.5C19.624 38.16 18.894 37.82 18.154 37.56C17.424 37.28 16.714 37 16.024 36.74C15.334 36.47 14.644 36.29 13.994 36.07C13.344 35.86 12.714 35.66 12.114 35.48C11.504 35.32 10.934 35.18 10.394 35.04C9.314 34.75 8.374 34.52 7.584 34.39C6.014 34.08 5.114 33.91 5.114 33.91C5.114 33.91 6.024 34.05 7.604 34.29C8.404 34.39 9.354 34.59 10.454 34.83C11.004 34.95 11.584 35.07 12.194 35.2C12.804 35.36 13.434 35.54 14.104 35.72C14.764 35.91 15.474 36.07 16.174 36.31C16.884 36.55 17.604 36.79 18.354 37.05C19.114 37.29 19.864 37.6 20.634 37.91C21.404 38.23 22.204 38.52 22.984 38.88C24.544 39.62 26.174 40.36 27.754 41.27C29.374 42.1 30.914 43.14 32.474 44.12C33.984 45.19 35.514 46.24 36.914 47.41C38.374 48.51 39.654 49.78 40.954 50.94C42.154 52.2 43.404 53.34 44.424 54.58C44.954 55.18 45.464 55.77 45.954 56.34C46.414 56.94 46.864 57.51 47.284 58.06C48.164 59.15 48.884 60.22 49.514 61.18C49.834 61.66 50.134 62.1 50.414 62.51C50.664 62.93 50.894 63.31 51.094 63.65C51.914 65.03 52.384 65.82 52.384 65.82C52.724 66.4 52.534 67.14 51.954 67.49C51.374 67.84 50.624 67.64 50.284 67.06C50.284 67.03 50.274 67.01 50.264 67Z" fill="#1C5705" stroke="#1C5705" stroke-width="2.1354"/>
10
+ </g>
11
+ <defs>
12
+ <linearGradient id="paint0_linear_1_2" x1="5.621" y1="33.1035" x2="47.1524" y2="67.9055" gradientUnits="userSpaceOnUse">
13
+ <stop stop-color="#A3E854"/>
14
+ <stop offset="0.9952" stop-color="#83CA45"/>
15
+ </linearGradient>
16
+ <linearGradient id="paint1_linear_1_2" x1="63.4274" y1="55.1325" x2="109.914" y2="12.1805" gradientUnits="userSpaceOnUse">
17
+ <stop offset="0.0048071" stop-color="#73C02F"/>
18
+ <stop offset="1" stop-color="#B1ED6C"/>
19
+ </linearGradient>
20
+ <clipPath id="clip0_1_2">
21
+ <rect width="119.72" height="119.72" fill="white"/>
22
+ </clipPath>
23
+ </defs>
24
+ </svg>
package/index.ts CHANGED
@@ -7,8 +7,10 @@ export {
7
7
  ImportMeta,
8
8
  Emoji,
9
9
  } from './components'
10
+ export { MenuToggle } from './Layout'
10
11
  export { usePageContext } from './renderer/usePageContext'
11
12
  export * from './components/Note'
13
+ export * from './icons/index'
12
14
  export { assert } from './utils/assert'
13
15
  export type { Config } from './types/Config'
14
16
  export type { HeadingDefinition, HeadingDetachedDefinition } from './types/Heading'
@@ -1,7 +1,7 @@
1
1
  export { initKeyBindings }
2
2
 
3
3
  import { closeDocsearchModal } from './docsearch/toggleDocsearchModal'
4
- import { closeMenuModal } from './MenuModal'
4
+ import { closeMenuModal } from './MenuModal/toggleMenuModal'
5
5
 
6
6
  function initKeyBindings() {
7
7
  window.addEventListener(
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@brillout/docpress",
3
- "version": "0.9.8",
3
+ "version": "0.10.1",
4
4
  "type": "module",
5
5
  "dependencies": {
6
6
  "@brillout/picocolors": "^1.0.10",
@@ -3,7 +3,7 @@ export { determineNavItemsColumnLayout }
3
3
  // A CSS-only solution doesn't seem to exist.
4
4
  // - https://github.com/brillout/docpress/blob/2e41d8b9df098ff8312b02f7e9d41a202548e2b9/src/renderer/getStyleColumnLayout.ts#L4-L26
5
5
 
6
- import { type NavItem } from '../navigation/Navigation'
6
+ import { type NavItem } from '../NavItemComponent'
7
7
  import { assert, assertUsage, isBrowser } from '../utils/server'
8
8
  assert(!isBrowser())
9
9
 
@@ -1,7 +1,7 @@
1
1
  export { initOnNavigation }
2
2
 
3
3
  import { isBrowser } from '../utils/isBrowser'
4
- import { closeMenuModal } from '../MenuModal'
4
+ import { closeMenuModal } from '../MenuModal/toggleMenuModal'
5
5
  import { unexpandNav } from '../Layout'
6
6
 
7
7
  function onNavigation() {
@@ -5,7 +5,7 @@ import type { PageContextClient } from 'vike/types'
5
5
  import ReactDOM from 'react-dom/client'
6
6
  import { PageContextResolved } from '../config/resolvePageContext'
7
7
  import { getPageElement } from './getPageElement'
8
- import { closeMenuModal } from '../MenuModal'
8
+ import { closeMenuModal } from '../MenuModal/toggleMenuModal'
9
9
  import '../css/index.css'
10
10
  import { autoScrollNav } from '../autoScrollNav'
11
11
  import { installSectionUrlHashs } from '../installSectionUrlHashs'
package/utils/css.ts CHANGED
@@ -10,12 +10,6 @@ export function css(strings: TemplateStringsArray | string[], ...values: (string
10
10
  })
11
11
  .join('')
12
12
 
13
- // Remove comments
14
- result = result
15
- .split('\n')
16
- .filter((line) => !line.startsWith('// '))
17
- .join('\n')
18
-
19
13
  // Minifiy
20
14
  result = result
21
15
  .replace(/\s+/g, ' ') // Replace all whitespace sequences with a single space
package/dist/Layout.d.ts DELETED
@@ -1,15 +0,0 @@
1
- export { Layout };
2
- export { containerQueryMobileLayout };
3
- export { containerQueryMobileMenu };
4
- export { navLeftWidthMin };
5
- export { navLeftWidthMax };
6
- export { unexpandNav };
7
- import React from 'react';
8
- declare const navLeftWidthMax = 370;
9
- declare const navLeftWidthMin = 300;
10
- declare const containerQueryMobileMenu = 1000;
11
- declare const containerQueryMobileLayout: 1143;
12
- declare function Layout({ children }: {
13
- children: React.ReactNode;
14
- }): React.JSX.Element;
15
- declare function unexpandNav(): void;
package/dist/Layout.js DELETED
@@ -1,321 +0,0 @@
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
- export { Layout };
17
- export { containerQueryMobileLayout };
18
- export { containerQueryMobileMenu };
19
- export { navLeftWidthMin };
20
- export { navLeftWidthMax };
21
- export { unexpandNav };
22
- import React from 'react';
23
- import { NavigationContent } from './navigation/Navigation';
24
- import { EditPageNote } from './components/EditPageNote';
25
- import { parseTitle } from './parseTitle';
26
- import { usePageContext, usePageContext2 } from './renderer/usePageContext';
27
- import { NavSecondaryContent } from './NavSecondaryContent';
28
- import { closeMenuModalWithDelay, openMenuModal, toggleMenuModal } from './MenuModal';
29
- import { MenuModal } from './MenuModal';
30
- import { autoScrollNav_SSR } from './autoScrollNav';
31
- import { SearchLink } from './docsearch/SearchLink';
32
- import { navigate } from 'vike/client/router';
33
- import { css } from './utils/css';
34
- import { PassThrough } from './utils/PassTrough';
35
- import { Style } from './utils/Style';
36
- import { cls } from './utils/cls';
37
- var blockMargin = 3;
38
- var mainViewPadding = 20;
39
- var mainViewWidthMax = 800;
40
- var navLeftWidthMax = 370;
41
- var navLeftWidthMin = 300;
42
- var mainViewMax = (mainViewWidthMax + mainViewPadding * 2); // 840 = 800 + 20 * 2
43
- var containerQueryMobileMenu = 1000;
44
- var containerQueryMobileLayout = (mainViewMax + navLeftWidthMin); // 1143 = 840 + 300
45
- var containerQueryExtraSpace = (mainViewMax + navLeftWidthMax + blockMargin); // 1213 = 840 + 370 + 3
46
- // Avoid whitespace at the bottom of pages with almost no content
47
- var whitespaceBuster1 = {
48
- minHeight: '100vh',
49
- display: 'flex',
50
- flexDirection: 'column',
51
- };
52
- var whitespaceBuster2 = {
53
- flexGrow: 1,
54
- };
55
- function Layout(_a) {
56
- var _b;
57
- var children = _a.children;
58
- var pageContext = usePageContext();
59
- var isLandingPage = pageContext.isLandingPage;
60
- var content;
61
- if (isLandingPage) {
62
- content = React.createElement(LayoutLandingPage, null, children);
63
- }
64
- else {
65
- content = React.createElement(LayoutDocsPage, null, children);
66
- }
67
- return (React.createElement("div", { style: (_b = {},
68
- _b['--bg-color'] = '#f5f5f7',
69
- _b['--block-margin'] = "".concat(blockMargin, "px"),
70
- _b['--icon-text-padding'] = '8px',
71
- // ['--nav-head-height']: `${isLandingPage ? 70 : 60}px`,
72
- _b['--nav-head-height'] = "60px",
73
- _b) },
74
- React.createElement(MenuModal, { isTopNav: isLandingPage }),
75
- React.createElement("div", { className: isLandingPage ? '' : 'doc-page', style: __assign({
76
- // We don't add `container` to `body` nor `html` beacuse in Firefox it breaks the `position: fixed` of <MenuModal>
77
- // https://stackoverflow.com/questions/74601420/css-container-inline-size-and-fixed-child
78
- container: 'container-viewport / inline-size' }, whitespaceBuster1) },
79
- React.createElement(NavHead, null),
80
- content)));
81
- }
82
- function LayoutDocsPage(_a) {
83
- var children = _a.children;
84
- var pageContext = usePageContext();
85
- var hideNavLeftAlways = pageContext.navItemsDetached && pageContext.navItemsDetached.length <= 1;
86
- return (React.createElement(React.Fragment, null,
87
- React.createElement("style", null, getStyle()),
88
- React.createElement("div", { style: __assign({ display: 'flex' }, whitespaceBuster2) },
89
- React.createElement(NavLeft, null),
90
- React.createElement("div", { id: "nav-left-margin", className: "low-prio-grow", style: { width: 0, maxWidth: 50, background: 'var(--bg-color)' } }),
91
- React.createElement(PageContent, null, children))));
92
- function getStyle() {
93
- var style = css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n@container container-viewport (min-width: ", "px) {\n .low-prio-grow {\n flex-grow: 1;\n }\n #navigation-container {\n width: ", "px !important;\n }\n}"], ["\n@container container-viewport (min-width: ", "px) {\n .low-prio-grow {\n flex-grow: 1;\n }\n #navigation-container {\n width: ", "px !important;\n }\n}"])), containerQueryExtraSpace, navLeftWidthMax);
94
- var navLeftHide = css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n#nav-left, #nav-left-margin {\n display: none;\n}\n.page-wrapper {\n --main-view-padding: 10px !important;\n flex-grow: 1;\n align-items: center;\n}\n.page-content {\n margin: auto;\n}\n#menu-modal {\n position: absolute !important;\n}\n"], ["\n#nav-left, #nav-left-margin {\n display: none;\n}\n.page-wrapper {\n --main-view-padding: 10px !important;\n flex-grow: 1;\n align-items: center;\n}\n.page-content {\n margin: auto;\n}\n#menu-modal {\n position: absolute !important;\n}\n"])));
95
- if (!hideNavLeftAlways) {
96
- navLeftHide = css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n@container container-viewport (max-width: ", "px) {\n ", "\n}\n@container container-viewport (min-width: ", "px) {\n .nav-head-top {\n display: none !important;\n }\n}\n"], ["\n@container container-viewport (max-width: ", "px) {\n ", "\n}\n@container container-viewport (min-width: ", "px) {\n .nav-head-top {\n display: none !important;\n }\n}\n"])), containerQueryMobileLayout - 1, navLeftHide, containerQueryMobileLayout);
97
- }
98
- style += navLeftHide;
99
- return style;
100
- }
101
- }
102
- function LayoutLandingPage(_a) {
103
- var children = _a.children;
104
- return (React.createElement(React.Fragment, null,
105
- React.createElement(PageContent, null, children)));
106
- }
107
- function PageContent(_a) {
108
- var _b;
109
- var children = _a.children;
110
- var pageContext = usePageContext();
111
- var isLandingPage = pageContext.isLandingPage, pageTitle = pageContext.pageTitle;
112
- var pageTitleParsed = pageTitle && parseTitle(pageTitle);
113
- var globalNote = pageContext.config.globalNote;
114
- var ifDocPage = function (style) { return (isLandingPage ? {} : style); };
115
- return (React.createElement("div", { className: "page-wrapper low-prio-grow", style: __assign({
116
- // Avoid overflow, see https://stackoverflow.com/questions/36230944/prevent-flex-items-from-overflowing-a-container/66689926#66689926
117
- minWidth: 0 }, ifDocPage({
118
- backgroundColor: 'var(--bg-color)',
119
- paddingBottom: 50,
120
- })) },
121
- React.createElement("div", { className: "page-content", style: __assign((_b = {}, _b['--main-view-padding'] = "".concat(mainViewPadding, "px"), _b), ifDocPage({
122
- width: "calc(".concat(mainViewWidthMax, "px + 2 * var(--main-view-padding))"),
123
- maxWidth: '100%',
124
- padding: '20px var(--main-view-padding)',
125
- })) },
126
- globalNote,
127
- pageTitleParsed && React.createElement("h1", { id: "".concat(pageContext.urlPathname.replace('/', '')) }, pageTitleParsed),
128
- children,
129
- !isLandingPage && React.createElement(EditPageNote, { pageContext: pageContext }))));
130
- }
131
- function NavLeft() {
132
- var pageContext = usePageContext();
133
- var navItemsAll = pageContext.navItemsAll, navItemsDetached = pageContext.navItemsDetached;
134
- return (React.createElement(React.Fragment, null,
135
- React.createElement("div", { id: "nav-left", className: "link-hover-animation", style: {
136
- flexGrow: 1,
137
- borderRight: 'var(--block-margin) solid white',
138
- zIndex: 1,
139
- } },
140
- React.createElement("div", { style: {
141
- position: 'sticky',
142
- top: 0,
143
- } },
144
- React.createElement(NavHead, { isNavLeft: true }),
145
- React.createElement("div", { style: {
146
- backgroundColor: 'var(--bg-color)',
147
- display: 'flex',
148
- justifyContent: 'flex-end',
149
- } },
150
- React.createElement("div", { id: "navigation-container", style: {
151
- top: 0,
152
- height: "calc(100vh - var(--nav-head-height) - var(--block-margin))",
153
- overflowY: 'auto',
154
- overscrollBehavior: 'contain',
155
- paddingBottom: 40,
156
- minWidth: navLeftWidthMin,
157
- maxWidth: navLeftWidthMax,
158
- width: '100%',
159
- } }, navItemsDetached ? (React.createElement(NavigationContent, { navItems: navItemsDetached })) : (React.createElement(NavigationContent, { navItems: navItemsAll, showOnlyRelevant: true })))))),
160
- React.createElement("script", { dangerouslySetInnerHTML: { __html: autoScrollNav_SSR } })));
161
- }
162
- function NavHead(_a) {
163
- var _b;
164
- var isNavLeft = _a.isNavLeft;
165
- var pageContext = usePageContext();
166
- var pageContext2 = usePageContext2();
167
- var projectName = pageContext.meta.projectName;
168
- var isLandingPage = pageContext.isLandingPage;
169
- var navMaxWidth = pageContext.config.navMaxWidth;
170
- var linkStyle = {
171
- height: '100%',
172
- padding: '0 var(--padding-side)',
173
- justifyContent: 'center',
174
- };
175
- var TopNavigation = pageContext2.config.TopNavigation || PassThrough;
176
- var navSecondaryContent = (React.createElement("div", { className: isNavLeft ? 'show-on-nav-hover add-transition' : 'hide-on-shrink desktop-grow', style: __assign({ padding: 0, display: 'flex', height: '100%' }, (!isNavLeft
177
- ? {}
178
- : {
179
- position: 'absolute',
180
- left: '100%',
181
- top: 0,
182
- paddingLeft: 'var(--block-margin)',
183
- '--padding-side': '20px',
184
- width: mainViewMax, // guaranteed real estate
185
- })) },
186
- React.createElement(TopNavigation, null),
187
- !isNavLeft && React.createElement("div", { className: "desktop-grow" }),
188
- React.createElement(NavSecondaryContent, { style: {
189
- display: 'inline-flex',
190
- fontSize: '1.06em',
191
- padding: '0 var(--padding-side)',
192
- marginLeft: -8,
193
- } })));
194
- return (React.createElement("div", { className: cls(['nav-head-full-width', !isNavLeft && 'nav-head-top', 'link-hover-animation']), style: {
195
- display: 'flex',
196
- justifyContent: isNavLeft ? 'flex-end' : 'center',
197
- backgroundColor: 'var(--bg-color)',
198
- borderBottom: 'var(--block-margin) solid white',
199
- position: 'relative',
200
- } },
201
- isNavLeft && React.createElement(NavHeaderLeftFullWidthBackground, null),
202
- React.createElement("div", { style: {
203
- container: 'container-nav-head / inline-size',
204
- width: '100%',
205
- minWidth: isNavLeft && navLeftWidthMin,
206
- maxWidth: isNavLeft && navLeftWidthMax,
207
- } },
208
- React.createElement("div", { className: "nav-head-content", style: (_b = {
209
- width: '100%',
210
- maxWidth: navMaxWidth,
211
- margin: 'auto',
212
- height: 'var(--nav-head-height)',
213
- fontSize: "min(16.96px, ".concat(isProjectNameShort(projectName) ? '4.8cqw' : '4.5cqw', ")"),
214
- color: '#666'
215
- },
216
- _b['--icon-text-padding'] = 'min(8px, 1.8cqw)',
217
- _b.display = 'flex',
218
- _b.justifyContent = 'center',
219
- _b) },
220
- React.createElement(NavLogo, { className: "mobile-grow-half" }),
221
- !isNavLeft && React.createElement("div", { className: "desktop-grow" }),
222
- React.createElement(SearchLink, { className: "mobile-grow-half", style: linkStyle }),
223
- React.createElement(MenuLink, { className: "mobile-grow-full", style: linkStyle }),
224
- navSecondaryContent)),
225
- getStyle()));
226
- function getStyle() {
227
- var style = css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n@container container-nav-head (max-width: 550px) {\n .mobile-grow-full {\n flex-grow: 1;\n }\n .mobile-grow-half {\n flex-grow: 0.5;\n }\n .nav-head-content {\n --padding-side: 0px;\n }\n .nav-logo {\n padding-left: 15px;\n margin-left: -10px;\n }\n}\n@container container-nav-head (min-width: 501px) {\n .nav-head-content {\n --padding-side: 35px;\n }\n .nav-logo {\n padding: 0 var(--padding-side);\n }\n}\n@media(max-width: ", "px) {\n .hide-on-shrink {\n display: none !important;\n }\n}\n"], ["\n@container container-nav-head (max-width: 550px) {\n .mobile-grow-full {\n flex-grow: 1;\n }\n .mobile-grow-half {\n flex-grow: 0.5;\n }\n .nav-head-content {\n --padding-side: 0px;\n }\n .nav-logo {\n padding-left: 15px;\n margin-left: -10px;\n }\n}\n@container container-nav-head (min-width: 501px) {\n .nav-head-content {\n --padding-side: 35px;\n }\n .nav-logo {\n padding: 0 var(--padding-side);\n }\n}\n@media(max-width: ", "px) {\n .hide-on-shrink {\n display: none !important;\n }\n}\n"])), containerQueryMobileMenu);
228
- if (navMaxWidth) {
229
- style += css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n@media(min-width: ", "px) {\n .desktop-grow {\n flex-grow: 1;\n }\n .desktop-fade {\n transition: opacity 0.3s ease-in-out !important;\n }\n html:not(.menu-modal-show) .nav-head-top:not(:hover) .desktop-fade {\n transition: opacity 0.3s ease-in-out !important;\n opacity: 0.5;\n }\n}\n"], ["\n@media(min-width: ", "px) {\n .desktop-grow {\n flex-grow: 1;\n }\n .desktop-fade {\n transition: opacity 0.3s ease-in-out !important;\n }\n html:not(.menu-modal-show) .nav-head-top:not(:hover) .desktop-fade {\n transition: opacity 0.3s ease-in-out !important;\n opacity: 0.5;\n }\n}\n"])), containerQueryMobileMenu + 1);
230
- }
231
- if (isLandingPage && !navMaxWidth)
232
- style += css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n@media(min-width: ", "px) {\n .nav-logo {\n display: none !important;\n }\n}\n"], ["\n@media(min-width: ", "px) {\n .nav-logo {\n display: none !important;\n }\n}\n"])), containerQueryMobileMenu + 1);
233
- if (isNavLeft) {
234
- style += css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n\n.show-on-nav-hover {\n opacity: 0;\n transition-property: opacity;\n pointer-events: none;\n}\nhtml:not(.unexpand-nav) :has(.nav-head-full-width:hover) .show-on-nav-hover,\nhtml:not(.unexpand-nav) :has(.show-on-nav-hover:hover) .show-on-nav-hover,\nhtml:not(.unexpand-nav).menu-modal-show .show-on-nav-hover {\n opacity: 1;\n pointer-events: all;\n}\n"], ["\n\n.show-on-nav-hover {\n opacity: 0;\n transition-property: opacity;\n pointer-events: none;\n}\nhtml:not(.unexpand-nav) :has(.nav-head-full-width:hover) .show-on-nav-hover,\nhtml:not(.unexpand-nav) :has(.show-on-nav-hover:hover) .show-on-nav-hover,\nhtml:not(.unexpand-nav).menu-modal-show .show-on-nav-hover {\n opacity: 1;\n pointer-events: all;\n}\n"])));
235
- }
236
- return React.createElement(Style, null, style);
237
- }
238
- }
239
- function unexpandNav() {
240
- document.documentElement.classList.add('unexpand-nav');
241
- // Using setTimeout() because requestAnimationFrame() doesn't delay enough
242
- setTimeout(function () {
243
- document.documentElement.classList.remove('unexpand-nav');
244
- }, 1000);
245
- }
246
- function NavHeaderLeftFullWidthBackground() {
247
- return (React.createElement(React.Fragment, null,
248
- React.createElement("div", { className: "nav-bg show-on-nav-hover add-transition", style: {
249
- height: '100%',
250
- zIndex: -1,
251
- background: 'var(--bg-color)',
252
- position: 'absolute',
253
- left: 0,
254
- top: 0,
255
- boxSizing: 'content-box',
256
- borderBottom: 'var(--block-margin) solid white',
257
- } }),
258
- React.createElement(Style, null,
259
- // (min-width: 0px) => trick to always apply => @container seems to always require a condition
260
- css(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n@container container-viewport (min-width: 0px) {\n .nav-bg {\n width: 100cqw;\n }\n}\n"], ["\n@container container-viewport (min-width: 0px) {\n .nav-bg {\n width: 100cqw;\n }\n}\n"]))))));
261
- }
262
- function NavLogo(_a) {
263
- var _b;
264
- var className = _a.className;
265
- var pageContext = usePageContext();
266
- var iconSize = (_b = pageContext.config.navLogoSize) !== null && _b !== void 0 ? _b : 39;
267
- var projectName = pageContext.meta.projectName;
268
- return (React.createElement("a", { className: cls(['nav-logo', className]), style: {
269
- display: 'flex',
270
- alignItems: 'center',
271
- color: 'inherit',
272
- height: '100%',
273
- justifyContent: 'flex-start',
274
- }, href: "/" },
275
- React.createElement("img", { src: pageContext.meta.faviconUrl, height: iconSize, width: iconSize, onContextMenu: function (ev) {
276
- if (!pageContext.config.pressKit)
277
- return; // no /press page
278
- if (window.location.pathname === '/press')
279
- return;
280
- ev.preventDefault();
281
- navigate('/press#logo');
282
- } }),
283
- React.createElement("span", { style: __assign({ marginLeft: "calc(var(--icon-text-padding) + 2px)", fontSize: isProjectNameShort(projectName) ? '1.65em' : '1.3em' }, pageContext.config.navLogoTextStyle) }, projectName)));
284
- }
285
- function isProjectNameShort(projectName) {
286
- return projectName.length <= 4;
287
- }
288
- var onMouseIgnore;
289
- function MenuLink(props) {
290
- return (React.createElement("div", __assign({}, props, { style: __assign({ height: '100%', display: 'flex', alignItems: 'center', cursor: 'default', userSelect: 'none' }, props.style), className: ['colorize-on-hover menu-toggle', props.className].filter(Boolean).join(' '), onClick: function (ev) {
291
- ev.preventDefault();
292
- toggleMenuModal();
293
- }, onMouseOver: function () {
294
- if (onMouseIgnore)
295
- return;
296
- openMenuModal();
297
- }, onMouseLeave: function () {
298
- if (onMouseIgnore)
299
- return;
300
- closeMenuModalWithDelay(100);
301
- }, onTouchStart: function () {
302
- onMouseIgnore = setTimeout(function () {
303
- onMouseIgnore = undefined;
304
- }, 1000);
305
- } }),
306
- React.createElement("span", { className: "text-docs" },
307
- React.createElement(DocsIcon, null),
308
- " Docs"),
309
- React.createElement("span", { className: "text-menu" },
310
- React.createElement(MenuIcon, null),
311
- " Menu"),
312
- React.createElement(Style, null, css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n@media(max-width: ", "px) {\n .text-docs {\n display: none;\n }\n}\n@media(min-width: ", "px) {\n .text-menu {\n display: none;\n }\n}\n"], ["\n@media(max-width: ", "px) {\n .text-docs {\n display: none;\n }\n}\n@media(min-width: ", "px) {\n .text-menu {\n display: none;\n }\n}\n"])), containerQueryMobileMenu, containerQueryMobileMenu + 1))));
313
- }
314
- function DocsIcon() {
315
- return (React.createElement("span", { style: { marginRight: 'calc(var(--icon-text-padding) + 2px)' }, className: "decolorize-6 desktop-fade" }, "\uD83D\uDCDA"));
316
- }
317
- function MenuIcon() {
318
- return (React.createElement("svg", { style: { marginRight: 'calc(var(--icon-text-padding) + 2px)', verticalAlign: 'top', width: '1.3em' }, className: "decolorize-6 desktop-fade", viewBox: "0 0 448 512" },
319
- React.createElement("path", { fill: "currentColor", d: "M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z" })));
320
- }
321
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;