@docusaurus/theme-classic 2.0.0-beta.12faed89d → 2.0.0-beta.14

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 (349) hide show
  1. package/README.md +1 -1
  2. package/lib/admonitions.css +35 -0
  3. package/lib/deps.d.ts +13 -0
  4. package/lib/index.js +16 -15
  5. package/lib/prism-include-languages.js +9 -5
  6. package/{lib-next/types.d.ts → lib/theme-classic.d.ts} +338 -156
  7. package/lib/translations.js +16 -7
  8. package/lib/types.d.ts +0 -629
  9. package/lib/validateThemeConfig.js +232 -248
  10. package/lib-next/theme/Admonition/index.js +101 -0
  11. package/lib-next/theme/AnnouncementBar/index.js +7 -12
  12. package/lib-next/theme/AnnouncementBar/styles.module.css +23 -32
  13. package/lib-next/theme/BackToTopButton/index.js +131 -0
  14. package/lib-next/theme/BackToTopButton/styles.module.css +42 -0
  15. package/lib-next/theme/BlogArchivePage/index.js +80 -0
  16. package/lib-next/theme/BlogLayout/index.js +40 -0
  17. package/lib-next/theme/BlogListPage/index.js +17 -25
  18. package/lib-next/theme/BlogPostAuthor/index.js +46 -0
  19. package/{lib/theme/MDXPage → lib-next/theme/BlogPostAuthor}/styles.module.css +4 -2
  20. package/lib-next/theme/BlogPostAuthors/index.js +34 -0
  21. package/{lib/theme/IconExternalLink → lib-next/theme/BlogPostAuthors}/styles.module.css +3 -4
  22. package/lib-next/theme/BlogPostItem/index.js +79 -86
  23. package/lib-next/theme/BlogPostPage/index.js +70 -35
  24. package/lib-next/theme/BlogSidebar/index.js +11 -13
  25. package/lib-next/theme/BlogSidebar/styles.module.css +2 -2
  26. package/lib-next/theme/BlogTagsListPage/index.js +14 -55
  27. package/lib-next/theme/BlogTagsPostsPage/index.js +29 -39
  28. package/lib-next/theme/CodeBlock/index.js +23 -149
  29. package/lib-next/theme/CodeBlock/styles.module.css +12 -9
  30. package/lib-next/theme/Details/index.js +20 -0
  31. package/lib-next/theme/Details/styles.module.css +13 -0
  32. package/lib-next/theme/DocCard/index.js +80 -0
  33. package/lib-next/theme/DocCard/styles.module.css +43 -0
  34. package/lib-next/theme/DocCardList/index.js +19 -0
  35. package/lib-next/theme/DocCategoryGeneratedIndexPage/index.js +49 -0
  36. package/lib-next/theme/DocCategoryGeneratedIndexPage/styles.module.css +18 -0
  37. package/lib-next/theme/DocItem/index.js +30 -59
  38. package/lib-next/theme/DocItem/styles.module.css +2 -11
  39. package/lib-next/theme/DocItemFooter/index.js +79 -0
  40. package/{lib/theme/DocSidebarItem → lib-next/theme/DocItemFooter}/styles.module.css +8 -5
  41. package/lib-next/theme/DocPage/index.js +46 -23
  42. package/lib-next/theme/DocPaginator/index.js +5 -33
  43. package/lib-next/theme/DocPaginatorNavLink/index.js +36 -0
  44. package/lib-next/theme/DocSidebar/index.js +37 -43
  45. package/lib-next/theme/DocSidebarItem/index.js +115 -65
  46. package/lib-next/theme/DocSidebarItem/styles.module.css +4 -0
  47. package/lib-next/theme/DocTagDocListPage/index.js +89 -0
  48. package/lib-next/theme/DocTagsListPage/index.js +38 -0
  49. package/lib-next/theme/DocVersionBadge/index.js +27 -0
  50. package/lib-next/theme/DocVersionBanner/index.js +28 -14
  51. package/lib-next/theme/EditThisPage/index.js +6 -1
  52. package/lib-next/theme/ErrorPageContent.js +35 -0
  53. package/lib-next/theme/Footer/index.js +90 -39
  54. package/lib-next/theme/Heading/index.js +24 -29
  55. package/lib-next/theme/Heading/styles.css +5 -6
  56. package/lib-next/theme/Heading/styles.module.css +9 -5
  57. package/lib-next/theme/IconArrow/index.js +2 -2
  58. package/lib-next/theme/IconClose/index.js +23 -0
  59. package/lib-next/theme/IconEdit/index.js +2 -2
  60. package/lib-next/theme/IconExternalLink/index.js +2 -2
  61. package/lib-next/theme/IconLanguage/index.js +2 -2
  62. package/lib-next/theme/IconMenu/index.js +2 -2
  63. package/lib-next/theme/LastUpdated/index.js +3 -2
  64. package/lib-next/theme/Layout/index.js +3 -1
  65. package/lib-next/theme/LayoutHead/index.js +18 -23
  66. package/lib-next/theme/LayoutProviders/index.js +8 -5
  67. package/lib-next/theme/Logo/index.js +25 -21
  68. package/lib-next/theme/MDXComponents/index.js +34 -7
  69. package/{lib/theme/hooks → lib-next/theme/MDXComponents}/styles.css +3 -2
  70. package/lib-next/theme/MDXPage/index.js +10 -2
  71. package/lib-next/theme/Navbar/index.js +62 -34
  72. package/lib-next/theme/Navbar/styles.module.css +3 -39
  73. package/lib-next/theme/NavbarItem/DefaultNavbarItem.js +45 -143
  74. package/lib-next/theme/NavbarItem/DocNavbarItem.js +7 -7
  75. package/lib-next/theme/NavbarItem/DocsVersionDropdownNavbarItem.js +31 -19
  76. package/lib-next/theme/NavbarItem/DropdownNavbarItem.js +158 -0
  77. package/lib-next/theme/NavbarItem/{LocaleDropdownNavbarItem.js → LocaleDropdownNavbarItem/index.js} +4 -12
  78. package/lib-next/theme/NavbarItem/LocaleDropdownNavbarItem/styles.module.css +11 -0
  79. package/lib-next/theme/NavbarItem/index.js +25 -12
  80. package/lib-next/theme/{SearchMetadatas → SearchMetadata}/index.js +1 -1
  81. package/lib-next/theme/Seo/index.js +11 -7
  82. package/lib-next/theme/TOC/index.js +12 -36
  83. package/lib-next/theme/TOC/styles.module.css +1 -1
  84. package/lib-next/theme/TOCCollapsible/index.js +13 -4
  85. package/lib-next/theme/TOCCollapsible/styles.module.css +1 -0
  86. package/lib-next/theme/TOCInline/index.js +10 -28
  87. package/lib-next/theme/TOCItems/index.js +85 -0
  88. package/lib-next/theme/Tabs/__tests__/index.test.js +142 -0
  89. package/lib-next/theme/Tabs/index.js +103 -48
  90. package/lib-next/theme/Tabs/styles.module.css +0 -13
  91. package/lib-next/theme/Tag/index.js +27 -0
  92. package/lib-next/theme/Tag/styles.module.css +70 -0
  93. package/lib-next/theme/TagsListByLetter/index.js +42 -0
  94. package/lib-next/theme/TagsListByLetter/styles.module.css +11 -0
  95. package/lib-next/theme/TagsListInline/index.js +31 -0
  96. package/lib-next/theme/TagsListInline/styles.module.css +15 -0
  97. package/lib-next/theme/ThemeProvider/index.js +10 -7
  98. package/lib-next/theme/ThemedImage/index.js +5 -5
  99. package/lib-next/theme/Toggle/index.js +34 -37
  100. package/lib-next/theme/Toggle/styles.module.css +91 -3
  101. package/lib-next/theme/UserPreferencesProvider/index.js +9 -6
  102. package/lib-next/theme/hooks/useHideableNavbar.js +31 -44
  103. package/lib-next/theme/hooks/useTheme.js +4 -5
  104. package/lib-next/theme/hooks/useWindowSize.js +2 -6
  105. package/lib-next/theme/prism-include-languages.js +2 -1
  106. package/package.json +26 -24
  107. package/src/admonitions.css +35 -0
  108. package/src/deps.d.ts +13 -0
  109. package/src/index.ts +23 -20
  110. package/{lib-next/prism-include-languages.js → src/prism-include-languages.ts} +0 -0
  111. package/src/theme/Admonition/index.tsx +106 -0
  112. package/src/theme/AnnouncementBar/index.tsx +8 -12
  113. package/src/theme/AnnouncementBar/styles.module.css +23 -32
  114. package/src/theme/BackToTopButton/index.tsx +142 -0
  115. package/src/theme/BackToTopButton/styles.module.css +42 -0
  116. package/src/theme/BlogArchivePage/index.tsx +91 -0
  117. package/src/theme/BlogLayout/index.tsx +44 -0
  118. package/src/theme/BlogListPage/index.tsx +18 -25
  119. package/src/theme/BlogPostAuthor/index.tsx +49 -0
  120. package/{lib/theme/IconEdit → src/theme/BlogPostAuthor}/styles.module.css +4 -3
  121. package/src/theme/BlogPostAuthors/index.tsx +39 -0
  122. package/src/theme/BlogPostAuthors/styles.module.css +11 -0
  123. package/src/theme/BlogPostItem/index.tsx +70 -80
  124. package/src/theme/BlogPostPage/index.tsx +72 -35
  125. package/src/theme/BlogSidebar/index.tsx +11 -13
  126. package/src/theme/BlogSidebar/styles.module.css +2 -2
  127. package/src/theme/BlogTagsListPage/index.tsx +14 -57
  128. package/src/theme/BlogTagsPostsPage/index.tsx +29 -39
  129. package/src/theme/CodeBlock/index.tsx +27 -151
  130. package/src/theme/CodeBlock/styles.module.css +12 -9
  131. package/src/theme/Details/index.tsx +24 -0
  132. package/src/theme/Details/styles.module.css +13 -0
  133. package/src/theme/DocCard/index.tsx +100 -0
  134. package/src/theme/DocCard/styles.module.css +43 -0
  135. package/src/theme/DocCardList/index.tsx +27 -0
  136. package/src/theme/DocCategoryGeneratedIndexPage/index.tsx +53 -0
  137. package/src/theme/DocCategoryGeneratedIndexPage/styles.module.css +18 -0
  138. package/src/theme/DocItem/index.tsx +30 -60
  139. package/src/theme/DocItem/styles.module.css +2 -11
  140. package/src/theme/DocItemFooter/index.tsx +91 -0
  141. package/{lib/theme/BlogPostItem → src/theme/DocItemFooter}/styles.module.css +8 -8
  142. package/src/theme/DocPage/index.tsx +44 -22
  143. package/src/theme/DocPaginator/index.tsx +5 -33
  144. package/src/theme/DocPaginatorNavLink/index.tsx +38 -0
  145. package/src/theme/DocSidebar/index.tsx +38 -39
  146. package/src/theme/DocSidebarItem/index.tsx +108 -49
  147. package/src/theme/DocSidebarItem/styles.module.css +4 -0
  148. package/src/theme/DocTagDocListPage/index.tsx +89 -0
  149. package/src/theme/DocTagsListPage/index.tsx +41 -0
  150. package/src/theme/DocVersionBadge/index.tsx +30 -0
  151. package/src/theme/DocVersionBanner/index.tsx +48 -21
  152. package/src/theme/EditThisPage/index.tsx +6 -1
  153. package/src/theme/ErrorPageContent.tsx +41 -0
  154. package/src/theme/Footer/index.tsx +103 -42
  155. package/src/theme/Heading/index.tsx +24 -31
  156. package/src/theme/Heading/styles.css +5 -6
  157. package/src/theme/Heading/styles.module.css +9 -5
  158. package/src/theme/IconArrow/index.tsx +2 -2
  159. package/src/theme/IconClose/index.tsx +26 -0
  160. package/src/theme/IconEdit/index.tsx +2 -2
  161. package/src/theme/IconExternalLink/index.tsx +2 -5
  162. package/src/theme/IconLanguage/index.tsx +2 -6
  163. package/src/theme/IconMenu/index.tsx +3 -3
  164. package/src/theme/LastUpdated/index.tsx +3 -2
  165. package/src/theme/Layout/index.tsx +3 -1
  166. package/src/theme/LayoutHead/index.tsx +18 -17
  167. package/src/theme/LayoutProviders/index.tsx +8 -5
  168. package/src/theme/Logo/index.tsx +21 -17
  169. package/src/theme/MDXComponents/index.tsx +39 -5
  170. package/src/theme/MDXComponents/styles.css +11 -0
  171. package/src/theme/MDXPage/index.tsx +10 -2
  172. package/src/theme/Navbar/index.tsx +62 -35
  173. package/src/theme/Navbar/styles.module.css +3 -39
  174. package/src/theme/NavbarItem/DefaultNavbarItem.tsx +42 -149
  175. package/src/theme/NavbarItem/DocNavbarItem.tsx +12 -16
  176. package/src/theme/NavbarItem/DocsVersionDropdownNavbarItem.tsx +33 -21
  177. package/src/theme/NavbarItem/DocsVersionNavbarItem.tsx +7 -3
  178. package/src/theme/NavbarItem/DropdownNavbarItem.tsx +180 -0
  179. package/src/theme/NavbarItem/{LocaleDropdownNavbarItem.tsx → LocaleDropdownNavbarItem/index.tsx} +8 -9
  180. package/src/theme/NavbarItem/LocaleDropdownNavbarItem/styles.module.css +11 -0
  181. package/src/theme/NavbarItem/index.tsx +41 -16
  182. package/src/theme/{SearchMetadatas → SearchMetadata}/index.tsx +2 -2
  183. package/src/theme/Seo/index.tsx +7 -4
  184. package/src/theme/TOC/index.tsx +13 -35
  185. package/src/theme/TOC/styles.module.css +1 -1
  186. package/src/theme/TOCCollapsible/index.tsx +13 -4
  187. package/src/theme/TOCCollapsible/styles.module.css +1 -0
  188. package/src/theme/TOCInline/index.tsx +13 -32
  189. package/src/theme/TOCItems/index.tsx +96 -0
  190. package/src/theme/Tabs/index.tsx +110 -54
  191. package/src/theme/Tabs/styles.module.css +0 -13
  192. package/src/theme/Tag/index.tsx +31 -0
  193. package/src/theme/Tag/styles.module.css +70 -0
  194. package/src/theme/TagsListByLetter/index.tsx +45 -0
  195. package/src/theme/TagsListByLetter/styles.module.css +11 -0
  196. package/src/theme/TagsListInline/index.tsx +35 -0
  197. package/src/theme/TagsListInline/styles.module.css +15 -0
  198. package/src/theme/ThemeProvider/index.tsx +6 -2
  199. package/src/theme/ThemedImage/index.tsx +5 -5
  200. package/src/theme/Toggle/index.tsx +36 -43
  201. package/src/theme/Toggle/styles.module.css +91 -3
  202. package/src/theme/UserPreferencesProvider/index.tsx +9 -6
  203. package/src/theme/hooks/useHideableNavbar.ts +32 -45
  204. package/src/theme/hooks/useTabGroupChoice.ts +2 -2
  205. package/src/theme/hooks/useTheme.ts +4 -5
  206. package/src/theme/hooks/useWindowSize.ts +2 -7
  207. package/src/theme/prism-include-languages.ts +3 -2
  208. package/src/theme-classic.d.ts +822 -0
  209. package/src/translations.ts +41 -23
  210. package/src/types.d.ts +0 -629
  211. package/src/{validateThemeConfig.js → validateThemeConfig.ts} +160 -100
  212. package/babel.config.js +0 -35
  213. package/codeTranslations/README.md +0 -20
  214. package/codeTranslations/ar.json +0 -56
  215. package/codeTranslations/base.json +0 -110
  216. package/codeTranslations/bn.json +0 -56
  217. package/codeTranslations/da.json +0 -56
  218. package/codeTranslations/de.json +0 -56
  219. package/codeTranslations/es.json +0 -56
  220. package/codeTranslations/fa.json +0 -56
  221. package/codeTranslations/fil.json +0 -56
  222. package/codeTranslations/fr.json +0 -56
  223. package/codeTranslations/he.json +0 -56
  224. package/codeTranslations/hi.json +0 -56
  225. package/codeTranslations/ja.json +0 -56
  226. package/codeTranslations/ko.json +0 -56
  227. package/codeTranslations/pl.json +0 -56
  228. package/codeTranslations/pt-BR.json +0 -56
  229. package/codeTranslations/pt-PT.json +0 -56
  230. package/codeTranslations/ru.json +0 -56
  231. package/codeTranslations/tr.json +0 -56
  232. package/codeTranslations/vi.json +0 -56
  233. package/codeTranslations/zh-Hans.json +0 -56
  234. package/codeTranslations/zh-Hant.json +0 -56
  235. package/lib/__tests__/__snapshots__/translations.test.ts.snap +0 -116
  236. package/lib/__tests__/translations.test.js +0 -112
  237. package/lib/__tests__/validateThemeConfig.test.js +0 -333
  238. package/lib/theme/AnnouncementBar/index.js +0 -72
  239. package/lib/theme/AnnouncementBar/styles.module.css +0 -72
  240. package/lib/theme/BlogListPage/index.js +0 -71
  241. package/lib/theme/BlogListPaginator/index.js +0 -63
  242. package/lib/theme/BlogPostItem/index.js +0 -161
  243. package/lib/theme/BlogPostPage/index.js +0 -69
  244. package/lib/theme/BlogPostPaginator/index.js +0 -64
  245. package/lib/theme/BlogSidebar/index.js +0 -51
  246. package/lib/theme/BlogSidebar/styles.module.css +0 -44
  247. package/lib/theme/BlogTagsListPage/index.js +0 -76
  248. package/lib/theme/BlogTagsPostsPage/index.js +0 -100
  249. package/lib/theme/CodeBlock/index.js +0 -253
  250. package/lib/theme/CodeBlock/styles.module.css +0 -68
  251. package/lib/theme/DocItem/index.js +0 -138
  252. package/lib/theme/DocItem/styles.module.css +0 -31
  253. package/lib/theme/DocPage/index.js +0 -139
  254. package/lib/theme/DocPage/styles.module.css +0 -85
  255. package/lib/theme/DocPaginator/index.js +0 -63
  256. package/lib/theme/DocSidebar/index.js +0 -133
  257. package/lib/theme/DocSidebar/styles.module.css +0 -106
  258. package/lib/theme/DocSidebarItem/index.js +0 -175
  259. package/lib/theme/DocVersionBanner/index.js +0 -128
  260. package/lib/theme/EditThisPage/index.js +0 -31
  261. package/lib/theme/Footer/index.js +0 -115
  262. package/lib/theme/Footer/styles.module.css +0 -15
  263. package/lib/theme/Heading/index.js +0 -76
  264. package/lib/theme/Heading/styles.css +0 -23
  265. package/lib/theme/Heading/styles.module.css +0 -15
  266. package/lib/theme/IconArrow/index.js +0 -28
  267. package/lib/theme/IconEdit/index.js +0 -34
  268. package/lib/theme/IconExternalLink/index.js +0 -30
  269. package/lib/theme/IconLanguage/index.js +0 -29
  270. package/lib/theme/IconMenu/index.js +0 -30
  271. package/lib/theme/LastUpdated/index.js +0 -61
  272. package/lib/theme/Layout/index.js +0 -64
  273. package/lib/theme/Layout/styles.css +0 -27
  274. package/lib/theme/LayoutHead/index.js +0 -144
  275. package/lib/theme/LayoutProviders/index.js +0 -38
  276. package/lib/theme/Logo/index.js +0 -60
  277. package/lib/theme/MDXComponents/index.js +0 -65
  278. package/lib/theme/MDXPage/index.js +0 -66
  279. package/lib/theme/Navbar/index.js +0 -248
  280. package/lib/theme/Navbar/styles.module.css +0 -63
  281. package/lib/theme/NavbarItem/DefaultNavbarItem.js +0 -210
  282. package/lib/theme/NavbarItem/DocNavbarItem.js +0 -63
  283. package/lib/theme/NavbarItem/DocsVersionDropdownNavbarItem.js +0 -76
  284. package/lib/theme/NavbarItem/DocsVersionNavbarItem.js +0 -43
  285. package/lib/theme/NavbarItem/LocaleDropdownNavbarItem.js +0 -72
  286. package/lib/theme/NavbarItem/SearchNavbarItem.js +0 -28
  287. package/lib/theme/NavbarItem/index.js +0 -54
  288. package/lib/theme/NotFound.js +0 -57
  289. package/lib/theme/SearchBar.js +0 -15
  290. package/lib/theme/SearchMetadatas/index.js +0 -33
  291. package/lib/theme/Seo/index.js +0 -49
  292. package/lib/theme/SkipToContent/index.js +0 -71
  293. package/lib/theme/SkipToContent/styles.module.css +0 -14
  294. package/lib/theme/TOC/index.js +0 -60
  295. package/lib/theme/TOC/styles.module.css +0 -23
  296. package/lib/theme/TOCCollapsible/index.js +0 -51
  297. package/lib/theme/TOCCollapsible/styles.module.css +0 -49
  298. package/lib/theme/TOCInline/index.js +0 -53
  299. package/lib/theme/TOCInline/styles.module.css +0 -12
  300. package/lib/theme/TabItem/index.js +0 -32
  301. package/lib/theme/Tabs/index.js +0 -150
  302. package/lib/theme/Tabs/styles.module.css +0 -23
  303. package/lib/theme/ThemeContext.js +0 -21
  304. package/lib/theme/ThemeProvider/index.js +0 -38
  305. package/lib/theme/ThemedImage/index.js +0 -49
  306. package/lib/theme/ThemedImage/styles.module.css +0 -18
  307. package/lib/theme/Toggle/index.js +0 -94
  308. package/lib/theme/Toggle/styles.css +0 -103
  309. package/lib/theme/Toggle/styles.module.css +0 -17
  310. package/lib/theme/UserPreferencesContext.js +0 -18
  311. package/lib/theme/UserPreferencesProvider/index.js +0 -36
  312. package/lib/theme/hooks/useContextualSearchFilters.js +0 -47
  313. package/lib/theme/hooks/useDocs.js +0 -18
  314. package/lib/theme/hooks/useHideableNavbar.js +0 -92
  315. package/lib/theme/hooks/useKeyboardNavigation.js +0 -45
  316. package/lib/theme/hooks/useLocationHash.js +0 -28
  317. package/lib/theme/hooks/useLockBodyScroll.js +0 -26
  318. package/lib/theme/hooks/usePrismTheme.js +0 -36
  319. package/lib/theme/hooks/useScrollPosition.js +0 -49
  320. package/lib/theme/hooks/useTOCHighlight.js +0 -87
  321. package/lib/theme/hooks/useTabGroupChoice.js +0 -51
  322. package/lib/theme/hooks/useTheme.js +0 -99
  323. package/lib/theme/hooks/useThemeContext.js +0 -31
  324. package/lib/theme/hooks/useUserPreferencesContext.js +0 -31
  325. package/lib/theme/hooks/useWindowSize.js +0 -73
  326. package/lib/theme/prism-include-languages.js +0 -39
  327. package/lib-next/__tests__/__snapshots__/translations.test.ts.snap +0 -116
  328. package/lib-next/__tests__/translations.test.js +0 -128
  329. package/lib-next/__tests__/validateThemeConfig.test.js +0 -333
  330. package/lib-next/index.js +0 -221
  331. package/lib-next/theme/Toggle/styles.css +0 -103
  332. package/lib-next/theme/hooks/useContextualSearchFilters.js +0 -41
  333. package/lib-next/theme/hooks/useLocationHash.js +0 -20
  334. package/lib-next/theme/hooks/useScrollPosition.js +0 -38
  335. package/lib-next/theme/hooks/useTOCHighlight.js +0 -84
  336. package/lib-next/translations.js +0 -145
  337. package/lib-next/validateThemeConfig.js +0 -319
  338. package/src/__tests__/__snapshots__/translations.test.ts.snap +0 -116
  339. package/src/__tests__/translations.test.ts +0 -116
  340. package/src/__tests__/validateThemeConfig.test.js +0 -333
  341. package/src/prism-include-languages.js +0 -11
  342. package/src/theme/Toggle/styles.css +0 -103
  343. package/src/theme/hooks/useContextualSearchFilters.ts +0 -52
  344. package/src/theme/hooks/useLocationHash.ts +0 -25
  345. package/src/theme/hooks/useScrollPosition.ts +0 -45
  346. package/src/theme/hooks/useTOCHighlight.ts +0 -98
  347. package/tsconfig.json +0 -12
  348. package/update-code-translations.js +0 -242
  349. package/update-code-translations.test.js +0 -33
package/lib-next/theme/MDXComponents/index.js CHANGED
@@ -5,10 +5,30 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
  import React, {isValidElement} from 'react';
8
+ import Head from '@docusaurus/Head';
8
9
  import Link from '@docusaurus/Link';
9
10
  import CodeBlock from '@theme/CodeBlock';
10
11
  import Heading from '@theme/Heading';
12
+ import Details from '@theme/Details';
13
+ import './styles.css'; // MDX elements are wrapped through the MDX pragma
14
+ // In some cases (notably usage with Head/Helmet) we need to unwrap those elements.
15
+
16
+ function unwrapMDXElement(element) {
17
+ if (element?.props?.mdxType && element?.props?.originalType) {
18
+ const {mdxType, originalType, ...newProps} = element.props;
19
+ return React.createElement(element.props.originalType, newProps);
20
+ }
21
+
22
+ return element;
23
+ }
24
+
11
25
  const MDXComponents = {
26
+ head: (props) => {
27
+ const unwrappedChildren = React.Children.map(props.children, (child) =>
28
+ unwrapMDXElement(child),
29
+ );
30
+ return <Head {...props}>{unwrappedChildren}</Head>;
31
+ },
12
32
  code: (props) => {
13
33
  const {children} = props; // For retrocompatibility purposes (pretty rare use case)
14
34
  // See https://github.com/facebook/docusaurus/pull/1584
@@ -27,20 +47,27 @@ const MDXComponents = {
27
47
  pre: (props) => {
28
48
  const {children} = props; // See comment for `code` above
29
49
 
30
- if (isValidElement(children?.props?.children)) {
31
- return children?.props.children;
50
+ if (isValidElement(children) && isValidElement(children?.props?.children)) {
51
+ return children.props.children;
32
52
  }
33
53
 
34
54
  return (
35
55
  <CodeBlock
36
- {...(isValidElement(children)
37
- ? children?.props
38
- : {
39
- children,
40
- })}
56
+ {...(isValidElement(children) ? children?.props : {...props})}
41
57
  />
42
58
  );
43
59
  },
60
+ details: (props) => {
61
+ const items = React.Children.toArray(props.children); // Split summary item from the rest to pass it as a separate prop to the Detais theme component
62
+
63
+ const summary = items.find((item) => item?.props?.mdxType === 'summary');
64
+ const children = <>{items.filter((item) => item !== summary)}</>;
65
+ return (
66
+ <Details {...props} summary={summary}>
67
+ {children}
68
+ </Details>
69
+ );
70
+ },
44
71
  h1: Heading('h1'),
45
72
  h2: Heading('h2'),
46
73
  h3: Heading('h3'),
package/{lib/theme/hooks → lib-next/theme/MDXComponents}/styles.css RENAMED
@@ -5,6 +5,7 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- body:not(.navigation-with-keyboard) *:not(input):focus {
9
- outline: none;
8
+ ul.contains-task-list {
9
+ padding-left: 0;
10
+ list-style: none;
10
11
  }
package/lib-next/theme/MDXPage/index.js CHANGED
@@ -15,7 +15,11 @@ import styles from './styles.module.css';
15
15
 
16
16
  function MDXPage(props) {
17
17
  const {content: MDXPageContent} = props;
18
- const {frontMatter, metadata} = MDXPageContent;
18
+ const {
19
+ // TODO this frontmatter is not validated/normalized, it's the raw user-provided one. We should expose normalized one too!
20
+ frontMatter,
21
+ metadata,
22
+ } = MDXPageContent;
19
23
  const {
20
24
  title,
21
25
  description,
@@ -39,7 +43,11 @@ function MDXPage(props) {
39
43
  </div>
40
44
  {!hideTableOfContents && MDXPageContent.toc && (
41
45
  <div className="col col--2">
42
- <TOC toc={MDXPageContent.toc} />
46
+ <TOC
47
+ toc={MDXPageContent.toc}
48
+ minHeadingLevel={frontMatter.toc_min_heading_level}
49
+ maxHeadingLevel={frontMatter.toc_max_heading_level}
50
+ />
43
51
  </div>
44
52
  )}
45
53
  </div>
package/lib-next/theme/Navbar/index.js CHANGED
@@ -14,16 +14,24 @@ import {
14
14
  useThemeConfig,
15
15
  useMobileSecondaryMenuRenderer,
16
16
  usePrevious,
17
+ useHistoryPopHandler,
17
18
  } from '@docusaurus/theme-common';
18
19
  import useHideableNavbar from '@theme/hooks/useHideableNavbar';
19
20
  import useLockBodyScroll from '@theme/hooks/useLockBodyScroll';
20
21
  import useWindowSize from '@theme/hooks/useWindowSize';
22
+ import {useActivePlugin} from '@theme/hooks/useDocs';
21
23
  import NavbarItem from '@theme/NavbarItem';
22
24
  import Logo from '@theme/Logo';
23
25
  import IconMenu from '@theme/IconMenu';
26
+ import IconClose from '@theme/IconClose';
24
27
  import styles from './styles.module.css'; // retrocompatible with v1
25
28
 
26
- const DefaultNavItemPosition = 'right'; // If split links by left/right
29
+ const DefaultNavItemPosition = 'right';
30
+
31
+ function useNavbarItems() {
32
+ // TODO temporary casting until ThemeConfig type is improved
33
+ return useThemeConfig().navbar.items;
34
+ } // If split links by left/right
27
35
  // if position is unspecified, fallback to right (as v1)
28
36
 
29
37
  function splitNavItemsByPosition(items) {
@@ -44,7 +52,19 @@ function useMobileSidebar() {
44
52
 
45
53
  const shouldRender = windowSize === 'mobile'; // || windowSize === 'ssr';
46
54
 
47
- const [shown, setShown] = useState(false);
55
+ const [shown, setShown] = useState(false); // Close mobile sidebar on navigation pop
56
+ // Most likely firing when using the Android back button (but not only)
57
+
58
+ useHistoryPopHandler(() => {
59
+ if (shown) {
60
+ setShown(false); // Should we prevent the navigation here?
61
+ // See https://github.com/facebook/docusaurus/pull/5462#issuecomment-911699846
62
+
63
+ return false; // prevent pop navigation
64
+ }
65
+
66
+ return undefined;
67
+ });
48
68
  const toggle = useCallback(() => {
49
69
  setShown((s) => !s);
50
70
  }, []);
@@ -81,12 +101,13 @@ function useSecondaryMenu({sidebarShown, toggleSidebar}) {
81
101
  toggleSidebar,
82
102
  });
83
103
  const previousContent = usePrevious(content);
84
- const [shown, setShown] = useState(() => {
85
- // /!\ content is set with useEffect,
86
- // so it's not available on mount anyway
87
- // "return !!content" => always returns false
88
- return false;
89
- }); // When content is become available for the first time (set in useEffect)
104
+ const [shown, setShown] = useState(
105
+ () =>
106
+ // /!\ content is set with useEffect,
107
+ // so it's not available on mount anyway
108
+ // "return !!content" => always returns false
109
+ false,
110
+ ); // When content is become available for the first time (set in useEffect)
90
111
  // we set this content to be shown!
91
112
 
92
113
  useEffect(() => {
@@ -121,9 +142,7 @@ function useSecondaryMenu({sidebarShown, toggleSidebar}) {
121
142
 
122
143
  function NavbarMobileSidebar({sidebarShown, toggleSidebar}) {
123
144
  useLockBodyScroll(sidebarShown);
124
- const {
125
- navbar: {items},
126
- } = useThemeConfig();
145
+ const items = useNavbarItems();
127
146
  const colorModeToggle = useColorModeToggle();
128
147
  const secondaryMenu = useSecondaryMenu({
129
148
  sidebarShown,
@@ -137,42 +156,49 @@ function NavbarMobileSidebar({sidebarShown, toggleSidebar}) {
137
156
  imageClassName="navbar__logo"
138
157
  titleClassName="navbar__title"
139
158
  />
140
- {!colorModeToggle.disabled && sidebarShown && (
159
+ {!colorModeToggle.disabled && (
141
160
  <Toggle
161
+ className={styles.navbarSidebarToggle}
142
162
  checked={colorModeToggle.isDarkTheme}
143
163
  onChange={colorModeToggle.toggle}
144
164
  />
145
165
  )}
166
+ <button
167
+ type="button"
168
+ className="clean-btn navbar-sidebar__close"
169
+ onClick={toggleSidebar}>
170
+ <IconClose
171
+ color="var(--ifm-color-emphasis-600)"
172
+ className={styles.navbarSidebarCloseSvg}
173
+ />
174
+ </button>
146
175
  </div>
147
176
 
148
177
  <div
149
- className={clsx('navbar-sidebar__items', styles.menuWrapper, {
150
- [styles.menuWrapperSecondaryMenuShown]: secondaryMenu.shown,
178
+ className={clsx('navbar-sidebar__items', {
179
+ 'navbar-sidebar__items--show-secondary': secondaryMenu.shown,
151
180
  })}>
152
- <div className="menu">
181
+ <div className="navbar-sidebar__item menu">
153
182
  <ul className="menu__list">
154
183
  {items.map((item, i) => (
155
- <NavbarItem
156
- mobile
157
- {...item} // TODO fix typing
158
- onClick={toggleSidebar}
159
- key={i}
160
- />
184
+ <NavbarItem mobile {...item} onClick={toggleSidebar} key={i} />
161
185
  ))}
162
186
  </ul>
163
187
  </div>
164
188
 
165
- <div className={styles.secondaryMenu}>
166
- <button
167
- type="button"
168
- className={clsx('clean-btn', styles.backButton)}
169
- onClick={secondaryMenu.hide}>
170
- <Translate
171
- id="theme.navbar.mobileSidebarSecondaryMenu.backButtonLabel"
172
- description="The label of the back button to return to main menu, inside the mobile navbar sidebar secondary menu (notably used to display the docs sidebar)">
173
- ← Back to main menu
174
- </Translate>
175
- </button>
189
+ <div className="navbar-sidebar__item menu">
190
+ {items.length > 0 && (
191
+ <button
192
+ type="button"
193
+ className="clean-btn navbar-sidebar__back"
194
+ onClick={secondaryMenu.hide}>
195
+ <Translate
196
+ id="theme.navbar.mobileSidebarSecondaryMenu.backButtonLabel"
197
+ description="The label of the back button to return to main menu, inside the mobile navbar sidebar secondary menu (notably used to display the docs sidebar)">
198
+ ← Back to main menu
199
+ </Translate>
200
+ </button>
201
+ )}
176
202
  {secondaryMenu.content}
177
203
  </div>
178
204
  </div>
@@ -182,11 +208,13 @@ function NavbarMobileSidebar({sidebarShown, toggleSidebar}) {
182
208
 
183
209
  function Navbar() {
184
210
  const {
185
- navbar: {items, hideOnScroll, style},
211
+ navbar: {hideOnScroll, style},
186
212
  } = useThemeConfig();
187
213
  const mobileSidebar = useMobileSidebar();
188
214
  const colorModeToggle = useColorModeToggle();
215
+ const activeDocPlugin = useActivePlugin();
189
216
  const {navbarRef, isNavbarVisible} = useHideableNavbar(hideOnScroll);
217
+ const items = useNavbarItems();
190
218
  const hasSearchNavbarItem = items.some((item) => item.type === 'search');
191
219
  const {leftItems, rightItems} = splitNavItemsByPosition(items);
192
220
  return (
@@ -201,7 +229,7 @@ function Navbar() {
201
229
  })}>
202
230
  <div className="navbar__inner">
203
231
  <div className="navbar__items">
204
- {items?.length > 0 && (
232
+ {(items?.length > 0 || activeDocPlugin) && (
205
233
  <button
206
234
  aria-label="Navigation bar toggle"
207
235
  className="navbar__toggle clean-btn"
package/lib-next/theme/Navbar/styles.module.css CHANGED
@@ -8,7 +8,7 @@
8
8
  /*
9
9
  Hide toggle in small viewports
10
10
  */
11
- @media screen and (max-width: 997px) {
11
+ @media (max-width: 996px) {
12
12
  .toggle {
13
13
  display: none;
14
14
  }
@@ -22,42 +22,6 @@ Hide toggle in small viewports
22
22
  transform: translate3d(0, calc(-100% - 2px), 0);
23
23
  }
24
24
 
25
- :global(.navbar-sidebar__items) {
26
- padding: 0;
27
- }
28
-
29
- :global(.navbar-sidebar) {
30
- overflow-x: hidden;
31
- }
32
-
33
- .menuWrapper {
34
- display: flex;
35
- width: calc(var(--ifm-navbar-sidebar-width));
36
- transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
37
- transform: translateZ(0);
38
- }
39
-
40
- .menuWrapperSecondaryMenuShown {
41
- transform: translate3d(calc((var(--ifm-navbar-sidebar-width)) * -1), 0, 0);
42
- }
43
-
44
- .menuWrapper > div {
45
- flex-shrink: 0;
46
- width: calc(var(--ifm-navbar-sidebar-width));
47
- font-weight: var(--ifm-font-weight-semibold);
48
- padding: 0.5rem;
49
- }
50
-
51
- .backButton {
52
- width: calc(100% + 1rem);
53
- margin: 0 0 0.7rem -0.5rem;
54
- text-align: left;
55
- font-size: 15px;
56
- padding: 0.6rem 1.5rem;
57
- background: var(--ifm-menu-color-background-active);
58
- font-weight: var(--ifm-button-font-weight);
59
- }
60
-
61
- .secondaryMenu {
62
- padding-top: 0 !important;
25
+ .navbarSidebarToggle {
26
+ margin-right: 1rem;
63
27
  }
package/lib-next/theme/NavbarItem/DefaultNavbarItem.js CHANGED
@@ -4,27 +4,22 @@
4
4
  * This source code is licensed under the MIT license found in the
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
- import React, {useState, useRef, useEffect} from 'react';
7
+ import React from 'react';
8
8
  import clsx from 'clsx';
9
9
  import Link from '@docusaurus/Link';
10
10
  import useBaseUrl from '@docusaurus/useBaseUrl';
11
- import {useLocation} from '@docusaurus/router';
12
- import {
13
- isSamePath,
14
- useCollapsible,
15
- Collapsible,
16
- } from '@docusaurus/theme-common';
17
11
  import IconExternalLink from '@theme/IconExternalLink';
18
12
  import isInternalUrl from '@docusaurus/isInternalUrl';
13
+ import {isRegexpStringMatch} from '@docusaurus/theme-common';
14
+ import {getInfimaActiveClassName} from './index';
19
15
  const dropdownLinkActiveClass = 'dropdown__link--active';
20
-
21
- function NavLink({
16
+ export function NavLink({
22
17
  activeBasePath,
23
18
  activeBaseRegex,
24
19
  to,
25
20
  href,
26
21
  label,
27
- activeClassName = 'navbar__link--active',
22
+ activeClassName = '',
28
23
  prependBaseUrlToHref,
29
24
  ...props
30
25
  }) {
@@ -45,13 +40,15 @@ function NavLink({
45
40
  }
46
41
  : {
47
42
  isNavLink: true,
48
- activeClassName,
43
+ activeClassName: !props.className?.includes(activeClassName)
44
+ ? activeClassName
45
+ : '',
49
46
  to: toUrl,
50
47
  ...(activeBasePath || activeBaseRegex
51
48
  ? {
52
49
  isActive: (_match, location) =>
53
50
  activeBaseRegex
54
- ? new RegExp(activeBaseRegex).test(location.pathname)
51
+ ? isRegexpStringMatch(activeBaseRegex, location.pathname)
55
52
  : location.pathname.startsWith(activeBaseUrl),
56
53
  }
57
54
  : null),
@@ -74,150 +71,55 @@ function NavLink({
74
71
  );
75
72
  }
76
73
 
77
- function NavItemDesktop({items, position, className, ...props}) {
78
- const dropdownRef = useRef(null);
79
- const dropdownMenuRef = useRef(null);
80
- const [showDropdown, setShowDropdown] = useState(false);
81
- useEffect(() => {
82
- const handleClickOutside = (event) => {
83
- if (!dropdownRef.current || dropdownRef.current.contains(event.target)) {
84
- return;
85
- }
86
-
87
- setShowDropdown(false);
88
- };
89
-
90
- document.addEventListener('mousedown', handleClickOutside);
91
- document.addEventListener('touchstart', handleClickOutside);
92
- return () => {
93
- document.removeEventListener('mousedown', handleClickOutside);
94
- document.removeEventListener('touchstart', handleClickOutside);
95
- };
96
- }, [dropdownRef]);
97
-
98
- const navLinkClassNames = (extraClassName, isDropdownItem = false) =>
99
- clsx(
100
- {
101
- 'navbar__item navbar__link': !isDropdownItem,
102
- dropdown__link: isDropdownItem,
103
- },
104
- extraClassName,
105
- );
74
+ function DefaultNavbarItemDesktop({
75
+ className,
76
+ isDropdownItem = false,
77
+ ...props
78
+ }) {
79
+ const element = (
80
+ <NavLink
81
+ className={clsx(
82
+ isDropdownItem ? 'dropdown__link' : 'navbar__item navbar__link',
83
+ className,
84
+ )}
85
+ {...props}
86
+ />
87
+ );
106
88
 
107
- if (!items) {
108
- return <NavLink className={navLinkClassNames(className)} {...props} />;
89
+ if (isDropdownItem) {
90
+ return <li>{element}</li>;
109
91
  }
110
92
 
111
- return (
112
- <div
113
- ref={dropdownRef}
114
- className={clsx('navbar__item', 'dropdown', 'dropdown--hoverable', {
115
- 'dropdown--left': position === 'left',
116
- 'dropdown--right': position === 'right',
117
- 'dropdown--show': showDropdown,
118
- })}>
119
- <NavLink
120
- className={navLinkClassNames(className)}
121
- {...props}
122
- onClick={props.to ? undefined : (e) => e.preventDefault()}
123
- onKeyDown={(e) => {
124
- if (e.key === 'Enter') {
125
- e.preventDefault();
126
- setShowDropdown(!showDropdown);
127
- }
128
- }}>
129
- {props.children ?? props.label}
130
- </NavLink>
131
- <ul ref={dropdownMenuRef} className="dropdown__menu">
132
- {items.map(({className: childItemClassName, ...childItemProps}, i) => (
133
- <li key={i}>
134
- <NavLink
135
- onKeyDown={(e) => {
136
- if (i === items.length - 1 && e.key === 'Tab') {
137
- e.preventDefault();
138
- setShowDropdown(false);
139
- const nextNavbarItem = dropdownRef.current.nextElementSibling;
140
-
141
- if (nextNavbarItem) {
142
- nextNavbarItem.focus();
143
- }
144
- }
145
- }}
146
- activeClassName={dropdownLinkActiveClass}
147
- className={navLinkClassNames(childItemClassName, true)}
148
- {...childItemProps}
149
- />
150
- </li>
151
- ))}
152
- </ul>
153
- </div>
154
- );
93
+ return element;
155
94
  }
156
95
 
157
- function NavItemMobile({
158
- items,
96
+ function DefaultNavbarItemMobile({
159
97
  className,
160
- position: _position,
161
- // Need to destructure position from props so that it doesn't get passed on.
98
+ isDropdownItem: _isDropdownItem,
162
99
  ...props
163
100
  }) {
164
- const {pathname} = useLocation();
165
- const {collapsed, toggleCollapsed} = useCollapsible({
166
- initialState: () =>
167
- !items?.some((item) => isSamePath(item.to, pathname)) ?? true,
168
- });
169
-
170
- const navLinkClassNames = (extraClassName, isSubList = false) =>
171
- clsx(
172
- 'menu__link',
173
- {
174
- 'menu__link--sublist': isSubList,
175
- },
176
- extraClassName,
177
- );
178
-
179
- if (!items) {
180
- return (
181
- <li className="menu__list-item">
182
- <NavLink className={navLinkClassNames(className)} {...props} />
183
- </li>
184
- );
185
- }
186
-
187
101
  return (
188
- <li
189
- className={clsx('menu__list-item', {
190
- 'menu__list-item--collapsed': collapsed,
191
- })}>
192
- <NavLink
193
- role="button"
194
- className={navLinkClassNames(className, true)}
195
- {...props}
196
- onClick={(e) => {
197
- e.preventDefault();
198
- toggleCollapsed();
199
- }}>
200
- {props.children ?? props.label}
201
- </NavLink>
202
- <Collapsible as="ul" className="menu__list" collapsed={collapsed}>
203
- {items.map(({className: childItemClassName, ...childItemProps}, i) => (
204
- <li className="menu__list-item" key={i}>
205
- <NavLink
206
- activeClassName="menu__link--active"
207
- className={navLinkClassNames(childItemClassName)}
208
- {...childItemProps}
209
- onClick={props.onClick}
210
- />
211
- </li>
212
- ))}
213
- </Collapsible>
102
+ <li className="menu__list-item">
103
+ <NavLink className={clsx('menu__link', className)} {...props} />
214
104
  </li>
215
105
  );
216
106
  }
217
107
 
218
- function DefaultNavbarItem({mobile = false, ...props}) {
219
- const Comp = mobile ? NavItemMobile : NavItemDesktop;
220
- return <Comp {...props} />;
108
+ function DefaultNavbarItem({
109
+ mobile = false,
110
+ position: _position,
111
+ // Need to destructure position from props so that it doesn't get passed on.
112
+ ...props
113
+ }) {
114
+ const Comp = mobile ? DefaultNavbarItemMobile : DefaultNavbarItemDesktop;
115
+ return (
116
+ <Comp
117
+ {...props}
118
+ activeClassName={
119
+ props.activeClassName ?? getInfimaActiveClassName(mobile)
120
+ }
121
+ />
122
+ );
221
123
  }
222
124
 
223
125
  export default DefaultNavbarItem;
package/lib-next/theme/NavbarItem/DocNavbarItem.js CHANGED
@@ -8,12 +8,11 @@ import React from 'react';
8
8
  import DefaultNavbarItem from '@theme/NavbarItem/DefaultNavbarItem';
9
9
  import {useLatestVersion, useActiveDocContext} from '@theme/hooks/useDocs';
10
10
  import clsx from 'clsx';
11
- import {useDocsPreferredVersion} from '@docusaurus/theme-common';
12
- import {uniq} from '@docusaurus/utils-common';
11
+ import {getInfimaActiveClassName} from './index';
12
+ import {useDocsPreferredVersion, uniq} from '@docusaurus/theme-common';
13
13
 
14
14
  function getDocInVersions(versions, docId) {
15
- // vanilla-js flatten, TODO replace soon by ES flat() / flatMap()
16
- const allDocs = [].concat(...versions.map((version) => version.docs));
15
+ const allDocs = versions.flatMap((version) => version.docs);
17
16
  const doc = allDocs.find((versionDoc) => versionDoc.id === docId);
18
17
 
19
18
  if (!doc) {
@@ -29,7 +28,6 @@ Available doc ids are:\n- ${docIds}`);
29
28
 
30
29
  export default function DocNavbarItem({
31
30
  docId,
32
- activeSidebarClassName,
33
31
  label: staticLabel,
34
32
  docsPluginId,
35
33
  ...props
@@ -42,14 +40,16 @@ export default function DocNavbarItem({
42
40
  [activeVersion, preferredVersion, latestVersion].filter(Boolean),
43
41
  );
44
42
  const doc = getDocInVersions(versions, docId);
43
+ const activeDocInfimaClassName = getInfimaActiveClassName(props.mobile);
45
44
  return (
46
45
  <DefaultNavbarItem
47
46
  exact
48
47
  {...props}
49
48
  className={clsx(props.className, {
50
- [activeSidebarClassName]:
51
- activeDoc && activeDoc.sidebar === doc.sidebar,
49
+ [activeDocInfimaClassName]:
50
+ activeDoc?.sidebar && activeDoc.sidebar === doc.sidebar,
52
51
  })}
52
+ activeClassName={activeDocInfimaClassName}
53
53
  label={staticLabel ?? doc.id}
54
54
  to={doc.path}
55
55
  />