@docusaurus/theme-classic 0.0.0-4836 → 0.0.0-4839

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 (23) hide show
  1. package/lib/theme-classic.d.ts +24 -4
  2. package/lib-next/theme/BlogLayout/index.js +1 -5
  3. package/lib-next/theme/BlogSidebar/Desktop/index.js +41 -0
  4. package/lib-next/theme/BlogSidebar/{styles.module.css → Desktop/styles.module.css} +1 -5
  5. package/lib-next/theme/BlogSidebar/Mobile/index.js +36 -0
  6. package/lib-next/theme/BlogSidebar/index.js +7 -47
  7. package/lib-next/theme/BlogTagsListPage/index.js +2 -3
  8. package/lib-next/theme/BlogTagsPostsPage/index.js +4 -6
  9. package/lib-next/theme/DocTagDocListPage/index.js +3 -3
  10. package/lib-next/theme/Tag/index.js +2 -3
  11. package/lib-next/theme/TagsListInline/index.js +1 -1
  12. package/package.json +13 -13
  13. package/src/theme/BlogLayout/index.tsx +1 -5
  14. package/src/theme/BlogSidebar/Desktop/index.tsx +45 -0
  15. package/src/theme/BlogSidebar/{styles.module.css → Desktop/styles.module.css} +1 -5
  16. package/src/theme/BlogSidebar/Mobile/index.tsx +38 -0
  17. package/src/theme/BlogSidebar/index.tsx +7 -49
  18. package/src/theme/BlogTagsListPage/index.tsx +2 -3
  19. package/src/theme/BlogTagsPostsPage/index.tsx +8 -5
  20. package/src/theme/DocTagDocListPage/index.tsx +3 -4
  21. package/src/theme/Tag/index.tsx +2 -4
  22. package/src/theme/TagsListInline/index.tsx +1 -1
  23. package/src/theme-classic.d.ts +24 -4
package/lib/theme-classic.d.ts CHANGED
@@ -47,13 +47,33 @@ declare module '@theme/BlogListPaginator' {
47
47
  export default function BlogListPaginator(props: Props): JSX.Element;
48
48
  }
49
49
 
50
- declare module '@theme/BlogSidebar' {
50
+ declare module '@theme/BlogSidebar/Desktop' {
51
+ import type {BlogSidebar} from '@docusaurus/plugin-content-blog';
52
+
53
+ export interface Props {
54
+ readonly sidebar: BlogSidebar;
55
+ }
56
+
57
+ export default function BlogSidebarDesktop(props: Props): JSX.Element;
58
+ }
59
+
60
+ declare module '@theme/BlogSidebar/Mobile' {
51
61
  import type {BlogSidebar} from '@docusaurus/plugin-content-blog';
52
62
 
53
63
  export interface Props {
54
64
  readonly sidebar: BlogSidebar;
55
65
  }
56
66
 
67
+ export default function BlogSidebarMobile(props: Props): JSX.Element;
68
+ }
69
+
70
+ declare module '@theme/BlogSidebar' {
71
+ import type {BlogSidebar} from '@docusaurus/plugin-content-blog';
72
+
73
+ export interface Props {
74
+ readonly sidebar?: BlogSidebar;
75
+ }
76
+
57
77
  export default function BlogSidebar(props: Props): JSX.Element;
58
78
  }
59
79
 
@@ -1011,7 +1031,7 @@ declare module '@theme/IconExternalLink' {
1011
1031
  }
1012
1032
 
1013
1033
  declare module '@theme/TagsListByLetter' {
1014
- import type {TagsListItem} from '@docusaurus/theme-common';
1034
+ import type {TagsListItem} from '@docusaurus/types';
1015
1035
 
1016
1036
  export interface Props {
1017
1037
  readonly tags: readonly TagsListItem[];
@@ -1020,7 +1040,7 @@ declare module '@theme/TagsListByLetter' {
1020
1040
  }
1021
1041
 
1022
1042
  declare module '@theme/TagsListInline' {
1023
- import type {Tag} from '@docusaurus/utils';
1043
+ import type {Tag} from '@docusaurus/types';
1024
1044
 
1025
1045
  export interface Props {
1026
1046
  readonly tags: readonly Tag[];
@@ -1029,7 +1049,7 @@ declare module '@theme/TagsListInline' {
1029
1049
  }
1030
1050
 
1031
1051
  declare module '@theme/Tag' {
1032
- import type {TagsListItem} from '@docusaurus/theme-common';
1052
+ import type {TagsListItem} from '@docusaurus/types';
1033
1053
  import type {Optional} from 'utility-types';
1034
1054
 
1035
1055
  export interface Props extends Optional<TagsListItem, 'count'> {}
package/lib-next/theme/BlogLayout/index.js CHANGED
@@ -15,11 +15,7 @@ export default function BlogLayout(props) {
15
15
  <Layout {...layoutProps}>
16
16
  <div className="container margin-vert--lg">
17
17
  <div className="row">
18
- {hasSidebar && (
19
- <aside className="col col--3">
20
- <BlogSidebar sidebar={sidebar} />
21
- </aside>
22
- )}
18
+ <BlogSidebar sidebar={sidebar} />
23
19
  <main
24
20
  className={clsx('col', {
25
21
  'col--7': hasSidebar,
package/lib-next/theme/BlogSidebar/Desktop/index.js ADDED
@@ -0,0 +1,41 @@
1
+ /**
2
+ * Copyright (c) Facebook, Inc. and its affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+ import React from 'react';
8
+ import clsx from 'clsx';
9
+ import Link from '@docusaurus/Link';
10
+ import {translate} from '@docusaurus/Translate';
11
+ import styles from './styles.module.css';
12
+ export default function BlogSidebarDesktop({sidebar}) {
13
+ return (
14
+ <aside className="col col--3">
15
+ <nav
16
+ className={clsx(styles.sidebar, 'thin-scrollbar')}
17
+ aria-label={translate({
18
+ id: 'theme.blog.sidebar.navAriaLabel',
19
+ message: 'Blog recent posts navigation',
20
+ description: 'The ARIA label for recent posts in the blog sidebar',
21
+ })}>
22
+ <div className={clsx(styles.sidebarItemTitle, 'margin-bottom--md')}>
23
+ {sidebar.title}
24
+ </div>
25
+ <ul className={styles.sidebarItemList}>
26
+ {sidebar.items.map((item) => (
27
+ <li key={item.permalink} className={styles.sidebarItem}>
28
+ <Link
29
+ isNavLink
30
+ to={item.permalink}
31
+ className={styles.sidebarItemLink}
32
+ activeClassName={styles.sidebarItemLinkActive}>
33
+ {item.title}
34
+ </Link>
35
+ </li>
36
+ ))}
37
+ </ul>
38
+ </nav>
39
+ </aside>
40
+ );
41
+ }
package/lib-next/theme/BlogSidebar/{styles.module.css → Desktop/styles.module.css} RENAMED
@@ -40,11 +40,7 @@
40
40
  }
41
41
 
42
42
  @media (max-width: 996px) {
43
- .sidebarDesktop {
44
- display: none;
45
- }
46
-
47
43
  .sidebar {
48
- top: 0;
44
+ display: none;
49
45
  }
50
46
  }
package/lib-next/theme/BlogSidebar/Mobile/index.js ADDED
@@ -0,0 +1,36 @@
1
+ /**
2
+ * Copyright (c) Facebook, Inc. and its affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+ import React from 'react';
8
+ import Link from '@docusaurus/Link';
9
+ import {NavbarSecondaryMenuFiller} from '@docusaurus/theme-common';
10
+
11
+ function BlogSidebarMobileSecondaryMenu({sidebar}) {
12
+ return (
13
+ <ul className="menu__list">
14
+ {sidebar.items.map((item) => (
15
+ <li key={item.permalink} className="menu__list-item">
16
+ <Link
17
+ isNavLink
18
+ to={item.permalink}
19
+ className="menu__link"
20
+ activeClassName="menu__link--active">
21
+ {item.title}
22
+ </Link>
23
+ </li>
24
+ ))}
25
+ </ul>
26
+ );
27
+ }
28
+
29
+ export default function BlogSidebarMobile(props) {
30
+ return (
31
+ <NavbarSecondaryMenuFiller
32
+ component={BlogSidebarMobileSecondaryMenu}
33
+ props={props}
34
+ />
35
+ );
36
+ }
package/lib-next/theme/BlogSidebar/index.js CHANGED
@@ -5,59 +5,19 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
  import React from 'react';
8
- import clsx from 'clsx';
9
- import Link from '@docusaurus/Link';
10
- import {translate} from '@docusaurus/Translate';
11
- import {
12
- NavbarSecondaryMenuFiller,
13
- useWindowSize,
14
- } from '@docusaurus/theme-common';
15
- import styles from './styles.module.css';
16
-
17
- function BlogSidebarContent({sidebar, className}) {
18
- return (
19
- <nav
20
- className={clsx(styles.sidebar, 'thin-scrollbar', className)}
21
- aria-label={translate({
22
- id: 'theme.blog.sidebar.navAriaLabel',
23
- message: 'Blog recent posts navigation',
24
- description: 'The ARIA label for recent posts in the blog sidebar',
25
- })}>
26
- <div className={clsx(styles.sidebarItemTitle, 'margin-bottom--md')}>
27
- {sidebar.title}
28
- </div>
29
- <ul className={styles.sidebarItemList}>
30
- {sidebar.items.map((item) => (
31
- <li key={item.permalink} className={styles.sidebarItem}>
32
- <Link
33
- isNavLink
34
- to={item.permalink}
35
- className={styles.sidebarItemLink}
36
- activeClassName={styles.sidebarItemLinkActive}>
37
- {item.title}
38
- </Link>
39
- </li>
40
- ))}
41
- </ul>
42
- </nav>
43
- );
44
- }
45
-
46
- export default function BlogSidebar(props) {
8
+ import BlogSidebarDesktop from '@theme/BlogSidebar/Desktop';
9
+ import BlogSidebarMobile from '@theme/BlogSidebar/Mobile';
10
+ import {useWindowSize} from '@docusaurus/theme-common';
11
+ export default function BlogSidebar({sidebar}) {
47
12
  const windowSize = useWindowSize();
48
13
 
49
- if (props.sidebar.items.length === 0) {
14
+ if (!sidebar?.items.length) {
50
15
  return null;
51
16
  } // Mobile sidebar doesn't need to be server-rendered
52
17
 
53
18
  if (windowSize === 'mobile') {
54
- return (
55
- <NavbarSecondaryMenuFiller
56
- component={BlogSidebarContent}
57
- props={{...props, className: 'margin-left--md'}}
58
- />
59
- );
19
+ return <BlogSidebarMobile sidebar={sidebar} />;
60
20
  }
61
21
 
62
- return <BlogSidebarContent {...props} className={styles.sidebarDesktop} />;
22
+ return <BlogSidebarDesktop sidebar={sidebar} />;
63
23
  }
package/lib-next/theme/BlogTagsListPage/index.js CHANGED
@@ -15,8 +15,7 @@ import {
15
15
  } from '@docusaurus/theme-common';
16
16
  import SearchMetadata from '../SearchMetadata';
17
17
  import clsx from 'clsx';
18
- export default function BlogTagsListPage(props) {
19
- const {tags, sidebar} = props;
18
+ export default function BlogTagsListPage({tags, sidebar}) {
20
19
  const title = translateTagsPageTitle();
21
20
  return (
22
21
  <HtmlClassNameProvider
@@ -28,7 +27,7 @@ export default function BlogTagsListPage(props) {
28
27
  <SearchMetadata tag="blog_tags_list" />
29
28
  <BlogLayout sidebar={sidebar}>
30
29
  <h1>{title}</h1>
31
- <TagsListByLetter tags={Object.values(tags)} />
30
+ <TagsListByLetter tags={tags} />
32
31
  </BlogLayout>
33
32
  </HtmlClassNameProvider>
34
33
  );
package/lib-next/theme/BlogTagsPostsPage/index.js CHANGED
@@ -38,9 +38,7 @@ function useBlogPostsPlural() {
38
38
  );
39
39
  }
40
40
 
41
- export default function BlogTagsPostsPage(props) {
42
- const {metadata, items, sidebar, listMetadata} = props;
43
- const {allTagsPath, name: tagName, count} = metadata;
41
+ export default function BlogTagsPostsPage({tag, items, sidebar, listMetadata}) {
44
42
  const blogPostsPlural = useBlogPostsPlural();
45
43
  const title = translate(
46
44
  {
@@ -49,8 +47,8 @@ export default function BlogTagsPostsPage(props) {
49
47
  message: '{nPosts} tagged with "{tagName}"',
50
48
  },
51
49
  {
52
- nPosts: blogPostsPlural(count),
53
- tagName,
50
+ nPosts: blogPostsPlural(tag.count),
51
+ tagName: tag.label,
54
52
  },
55
53
  );
56
54
  return (
@@ -65,7 +63,7 @@ export default function BlogTagsPostsPage(props) {
65
63
  <header className="margin-bottom--xl">
66
64
  <h1>{title}</h1>
67
65
 
68
- <Link href={allTagsPath}>
66
+ <Link href={tag.allTagsPath}>
69
67
  <Translate
70
68
  id="theme.tags.tagsPageLink"
71
69
  description="The label of the link targeting the tag list page">
package/lib-next/theme/DocTagDocListPage/index.js CHANGED
@@ -56,8 +56,8 @@ export default function DocTagDocListPage({tag}) {
56
56
  message: '{nDocsTagged} with "{tagName}"',
57
57
  },
58
58
  {
59
- nDocsTagged: nDocsTaggedPlural(tag.docs.length),
60
- tagName: tag.name,
59
+ nDocsTagged: nDocsTaggedPlural(tag.count),
60
+ tagName: tag.label,
61
61
  },
62
62
  );
63
63
  return (
@@ -83,7 +83,7 @@ export default function DocTagDocListPage({tag}) {
83
83
  </Link>
84
84
  </header>
85
85
  <section className="margin-vert--lg">
86
- {tag.docs.map((doc) => (
86
+ {tag.items.map((doc) => (
87
87
  <DocItem key={doc.id} doc={doc} />
88
88
  ))}
89
89
  </section>
package/lib-next/theme/Tag/index.js CHANGED
@@ -8,8 +8,7 @@ import React from 'react';
8
8
  import clsx from 'clsx';
9
9
  import Link from '@docusaurus/Link';
10
10
  import styles from './styles.module.css';
11
- export default function Tag(props) {
12
- const {permalink, name, count} = props;
11
+ export default function Tag({permalink, label, count}) {
13
12
  return (
14
13
  <Link
15
14
  href={permalink}
@@ -17,7 +16,7 @@ export default function Tag(props) {
17
16
  styles.tag,
18
17
  count ? styles.tagWithCount : styles.tagRegular,
19
18
  )}>
20
- {name}
19
+ {label}
21
20
  {count && <span>{count}</span>}
22
21
  </Link>
23
22
  );
package/lib-next/theme/TagsListInline/index.js CHANGED
@@ -22,7 +22,7 @@ export default function TagsListInline({tags}) {
22
22
  <ul className={clsx(styles.tags, 'padding--none', 'margin-left--sm')}>
23
23
  {tags.map(({label, permalink: tagPermalink}) => (
24
24
  <li key={tagPermalink} className={styles.tag}>
25
- <Tag name={label} permalink={tagPermalink} />
25
+ <Tag label={label} permalink={tagPermalink} />
26
26
  </li>
27
27
  ))}
28
28
  </ul>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@docusaurus/theme-classic",
3
- "version": "0.0.0-4836",
3
+ "version": "0.0.0-4839",
4
4
  "description": "Classic theme for Docusaurus",
5
5
  "main": "lib/index.js",
6
6
  "types": "src/theme-classic.d.ts",
@@ -21,15 +21,15 @@
21
21
  "format:lib-next": "prettier --config ../../.prettierrc --write \"lib-next/**/*.{js,ts,jsx,tsc}\""
22
22
  },
23
23
  "dependencies": {
24
- "@docusaurus/core": "0.0.0-4836",
25
- "@docusaurus/plugin-content-blog": "0.0.0-4836",
26
- "@docusaurus/plugin-content-docs": "0.0.0-4836",
27
- "@docusaurus/plugin-content-pages": "0.0.0-4836",
28
- "@docusaurus/theme-common": "0.0.0-4836",
29
- "@docusaurus/theme-translations": "0.0.0-4836",
30
- "@docusaurus/utils": "0.0.0-4836",
31
- "@docusaurus/utils-common": "0.0.0-4836",
32
- "@docusaurus/utils-validation": "0.0.0-4836",
24
+ "@docusaurus/core": "0.0.0-4839",
25
+ "@docusaurus/plugin-content-blog": "0.0.0-4839",
26
+ "@docusaurus/plugin-content-docs": "0.0.0-4839",
27
+ "@docusaurus/plugin-content-pages": "0.0.0-4839",
28
+ "@docusaurus/theme-common": "0.0.0-4839",
29
+ "@docusaurus/theme-translations": "0.0.0-4839",
30
+ "@docusaurus/utils": "0.0.0-4839",
31
+ "@docusaurus/utils-common": "0.0.0-4839",
32
+ "@docusaurus/utils-validation": "0.0.0-4839",
33
33
  "@mdx-js/react": "^1.6.22",
34
34
  "clsx": "^1.1.1",
35
35
  "copy-text-to-clipboard": "^3.0.1",
@@ -42,8 +42,8 @@
42
42
  "rtlcss": "^3.5.0"
43
43
  },
44
44
  "devDependencies": {
45
- "@docusaurus/module-type-aliases": "0.0.0-4836",
46
- "@docusaurus/types": "0.0.0-4836",
45
+ "@docusaurus/module-type-aliases": "0.0.0-4839",
46
+ "@docusaurus/types": "0.0.0-4839",
47
47
  "@types/mdx-js__react": "^1.5.5",
48
48
  "@types/prismjs": "^1.26.0",
49
49
  "@types/rtlcss": "^3.1.3",
@@ -59,5 +59,5 @@
59
59
  "engines": {
60
60
  "node": ">=14"
61
61
  },
62
- "gitHead": "9f5e74fd2fa4695a5c69ee02ad12d59f2fc4c621"
62
+ "gitHead": "9e77b44561516ba299e3f93d4e6d0c47c687494d"
63
63
  }
package/src/theme/BlogLayout/index.tsx CHANGED
@@ -20,11 +20,7 @@ export default function BlogLayout(props: Props): JSX.Element {
20
20
  <Layout {...layoutProps}>
21
21
  <div className="container margin-vert--lg">
22
22
  <div className="row">
23
- {hasSidebar && (
24
- <aside className="col col--3">
25
- <BlogSidebar sidebar={sidebar} />
26
- </aside>
27
- )}
23
+ <BlogSidebar sidebar={sidebar} />
28
24
  <main
29
25
  className={clsx('col', {
30
26
  'col--7': hasSidebar,
package/src/theme/BlogSidebar/Desktop/index.tsx ADDED
@@ -0,0 +1,45 @@
1
+ /**
2
+ * Copyright (c) Facebook, Inc. and its affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+
8
+ import React from 'react';
9
+ import clsx from 'clsx';
10
+ import Link from '@docusaurus/Link';
11
+ import {translate} from '@docusaurus/Translate';
12
+
13
+ import styles from './styles.module.css';
14
+ import type {Props} from '@theme/BlogSidebar/Desktop';
15
+
16
+ export default function BlogSidebarDesktop({sidebar}: Props): JSX.Element {
17
+ return (
18
+ <aside className="col col--3">
19
+ <nav
20
+ className={clsx(styles.sidebar, 'thin-scrollbar')}
21
+ aria-label={translate({
22
+ id: 'theme.blog.sidebar.navAriaLabel',
23
+ message: 'Blog recent posts navigation',
24
+ description: 'The ARIA label for recent posts in the blog sidebar',
25
+ })}>
26
+ <div className={clsx(styles.sidebarItemTitle, 'margin-bottom--md')}>
27
+ {sidebar.title}
28
+ </div>
29
+ <ul className={styles.sidebarItemList}>
30
+ {sidebar.items.map((item) => (
31
+ <li key={item.permalink} className={styles.sidebarItem}>
32
+ <Link
33
+ isNavLink
34
+ to={item.permalink}
35
+ className={styles.sidebarItemLink}
36
+ activeClassName={styles.sidebarItemLinkActive}>
37
+ {item.title}
38
+ </Link>
39
+ </li>
40
+ ))}
41
+ </ul>
42
+ </nav>
43
+ </aside>
44
+ );
45
+ }
package/src/theme/BlogSidebar/{styles.module.css → Desktop/styles.module.css} RENAMED
@@ -40,11 +40,7 @@
40
40
  }
41
41
 
42
42
  @media (max-width: 996px) {
43
- .sidebarDesktop {
44
- display: none;
45
- }
46
-
47
43
  .sidebar {
48
- top: 0;
44
+ display: none;
49
45
  }
50
46
  }
package/src/theme/BlogSidebar/Mobile/index.tsx ADDED
@@ -0,0 +1,38 @@
1
+ /**
2
+ * Copyright (c) Facebook, Inc. and its affiliates.
3
+ *
4
+ * This source code is licensed under the MIT license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+
8
+ import React from 'react';
9
+ import Link from '@docusaurus/Link';
10
+ import {NavbarSecondaryMenuFiller} from '@docusaurus/theme-common';
11
+ import type {Props} from '@theme/BlogSidebar/Mobile';
12
+
13
+ function BlogSidebarMobileSecondaryMenu({sidebar}: Props): JSX.Element {
14
+ return (
15
+ <ul className="menu__list">
16
+ {sidebar.items.map((item) => (
17
+ <li key={item.permalink} className="menu__list-item">
18
+ <Link
19
+ isNavLink
20
+ to={item.permalink}
21
+ className="menu__link"
22
+ activeClassName="menu__link--active">
23
+ {item.title}
24
+ </Link>
25
+ </li>
26
+ ))}
27
+ </ul>
28
+ );
29
+ }
30
+
31
+ export default function BlogSidebarMobile(props: Props): JSX.Element {
32
+ return (
33
+ <NavbarSecondaryMenuFiller
34
+ component={BlogSidebarMobileSecondaryMenu}
35
+ props={props}
36
+ />
37
+ );
38
+ }
package/src/theme/BlogSidebar/index.tsx CHANGED
@@ -6,61 +6,19 @@
6
6
  */
7
7
 
8
8
  import React from 'react';
9
- import clsx from 'clsx';
10
- import Link from '@docusaurus/Link';
11
- import {translate} from '@docusaurus/Translate';
12
- import {
13
- NavbarSecondaryMenuFiller,
14
- useWindowSize,
15
- } from '@docusaurus/theme-common';
9
+ import BlogSidebarDesktop from '@theme/BlogSidebar/Desktop';
10
+ import BlogSidebarMobile from '@theme/BlogSidebar/Mobile';
11
+ import {useWindowSize} from '@docusaurus/theme-common';
16
12
  import type {Props} from '@theme/BlogSidebar';
17
- import styles from './styles.module.css';
18
13
 
19
- function BlogSidebarContent({
20
- sidebar,
21
- className,
22
- }: Props & {className?: string}): JSX.Element {
23
- return (
24
- <nav
25
- className={clsx(styles.sidebar, 'thin-scrollbar', className)}
26
- aria-label={translate({
27
- id: 'theme.blog.sidebar.navAriaLabel',
28
- message: 'Blog recent posts navigation',
29
- description: 'The ARIA label for recent posts in the blog sidebar',
30
- })}>
31
- <div className={clsx(styles.sidebarItemTitle, 'margin-bottom--md')}>
32
- {sidebar.title}
33
- </div>
34
- <ul className={styles.sidebarItemList}>
35
- {sidebar.items.map((item) => (
36
- <li key={item.permalink} className={styles.sidebarItem}>
37
- <Link
38
- isNavLink
39
- to={item.permalink}
40
- className={styles.sidebarItemLink}
41
- activeClassName={styles.sidebarItemLinkActive}>
42
- {item.title}
43
- </Link>
44
- </li>
45
- ))}
46
- </ul>
47
- </nav>
48
- );
49
- }
50
-
51
- export default function BlogSidebar(props: Props): JSX.Element | null {
14
+ export default function BlogSidebar({sidebar}: Props): JSX.Element | null {
52
15
  const windowSize = useWindowSize();
53
- if (props.sidebar.items.length === 0) {
16
+ if (!sidebar?.items.length) {
54
17
  return null;
55
18
  }
56
19
  // Mobile sidebar doesn't need to be server-rendered
57
20
  if (windowSize === 'mobile') {
58
- return (
59
- <NavbarSecondaryMenuFiller
60
- component={BlogSidebarContent}
61
- props={{...props, className: 'margin-left--md'}}
62
- />
63
- );
21
+ return <BlogSidebarMobile sidebar={sidebar} />;
64
22
  }
65
- return <BlogSidebarContent {...props} className={styles.sidebarDesktop} />;
23
+ return <BlogSidebarDesktop sidebar={sidebar} />;
66
24
  }
package/src/theme/BlogTagsListPage/index.tsx CHANGED
@@ -19,8 +19,7 @@ import {
19
19
  import SearchMetadata from '../SearchMetadata';
20
20
  import clsx from 'clsx';
21
21
 
22
- export default function BlogTagsListPage(props: Props): JSX.Element {
23
- const {tags, sidebar} = props;
22
+ export default function BlogTagsListPage({tags, sidebar}: Props): JSX.Element {
24
23
  const title = translateTagsPageTitle();
25
24
  return (
26
25
  <HtmlClassNameProvider
@@ -32,7 +31,7 @@ export default function BlogTagsListPage(props: Props): JSX.Element {
32
31
  <SearchMetadata tag="blog_tags_list" />
33
32
  <BlogLayout sidebar={sidebar}>
34
33
  <h1>{title}</h1>
35
- <TagsListByLetter tags={Object.values(tags)} />
34
+ <TagsListByLetter tags={tags} />
36
35
  </BlogLayout>
37
36
  </HtmlClassNameProvider>
38
37
  );
package/src/theme/BlogTagsPostsPage/index.tsx CHANGED
@@ -40,9 +40,12 @@ function useBlogPostsPlural() {
40
40
  );
41
41
  }
42
42
 
43
- export default function BlogTagsPostsPage(props: Props): JSX.Element {
44
- const {metadata, items, sidebar, listMetadata} = props;
45
- const {allTagsPath, name: tagName, count} = metadata;
43
+ export default function BlogTagsPostsPage({
44
+ tag,
45
+ items,
46
+ sidebar,
47
+ listMetadata,
48
+ }: Props): JSX.Element {
46
49
  const blogPostsPlural = useBlogPostsPlural();
47
50
  const title = translate(
48
51
  {
@@ -50,7 +53,7 @@ export default function BlogTagsPostsPage(props: Props): JSX.Element {
50
53
  description: 'The title of the page for a blog tag',
51
54
  message: '{nPosts} tagged with "{tagName}"',
52
55
  },
53
- {nPosts: blogPostsPlural(count), tagName},
56
+ {nPosts: blogPostsPlural(tag.count), tagName: tag.label},
54
57
  );
55
58
 
56
59
  return (
@@ -65,7 +68,7 @@ export default function BlogTagsPostsPage(props: Props): JSX.Element {
65
68
  <header className="margin-bottom--xl">
66
69
  <h1>{title}</h1>
67
70
 
68
- <Link href={allTagsPath}>
71
+ <Link href={tag.allTagsPath}>
69
72
  <Translate
70
73
  id="theme.tags.tagsPageLink"
71
74
  description="The label of the link targeting the tag list page">
package/src/theme/DocTagDocListPage/index.tsx CHANGED
@@ -15,7 +15,6 @@ import {
15
15
  ThemeClassNames,
16
16
  usePluralForm,
17
17
  } from '@docusaurus/theme-common';
18
- import type {PropTagDocListDoc} from '@docusaurus/plugin-content-docs';
19
18
  import Translate, {translate} from '@docusaurus/Translate';
20
19
  import type {Props} from '@theme/DocTagDocListPage';
21
20
  import SearchMetadata from '@theme/SearchMetadata';
@@ -39,7 +38,7 @@ function useNDocsTaggedPlural() {
39
38
  );
40
39
  }
41
40
 
42
- function DocItem({doc}: {doc: PropTagDocListDoc}): JSX.Element {
41
+ function DocItem({doc}: {doc: Props['tag']['items'][number]}): JSX.Element {
43
42
  return (
44
43
  <article className="margin-vert--lg">
45
44
  <Link to={doc.permalink}>
@@ -58,7 +57,7 @@ export default function DocTagDocListPage({tag}: Props): JSX.Element {
58
57
  description: 'The title of the page for a docs tag',
59
58
  message: '{nDocsTagged} with "{tagName}"',
60
59
  },
61
- {nDocsTagged: nDocsTaggedPlural(tag.docs.length), tagName: tag.name},
60
+ {nDocsTagged: nDocsTaggedPlural(tag.count), tagName: tag.label},
62
61
  );
63
62
 
64
63
  return (
@@ -84,7 +83,7 @@ export default function DocTagDocListPage({tag}: Props): JSX.Element {
84
83
  </Link>
85
84
  </header>
86
85
  <section className="margin-vert--lg">
87
- {tag.docs.map((doc) => (
86
+ {tag.items.map((doc) => (
88
87
  <DocItem key={doc.id} doc={doc} />
89
88
  ))}
90
89
  </section>
package/src/theme/Tag/index.tsx CHANGED
@@ -12,9 +12,7 @@ import type {Props} from '@theme/Tag';
12
12
 
13
13
  import styles from './styles.module.css';
14
14
 
15
- export default function Tag(props: Props): JSX.Element {
16
- const {permalink, name, count} = props;
17
-
15
+ export default function Tag({permalink, label, count}: Props): JSX.Element {
18
16
  return (
19
17
  <Link
20
18
  href={permalink}
@@ -22,7 +20,7 @@ export default function Tag(props: Props): JSX.Element {
22
20
  styles.tag,
23
21
  count ? styles.tagWithCount : styles.tagRegular,
24
22
  )}>
25
- {name}
23
+ {label}
26
24
  {count && <span>{count}</span>}
27
25
  </Link>
28
26
  );
package/src/theme/TagsListInline/index.tsx CHANGED
@@ -26,7 +26,7 @@ export default function TagsListInline({tags}: Props): JSX.Element {
26
26
  <ul className={clsx(styles.tags, 'padding--none', 'margin-left--sm')}>
27
27
  {tags.map(({label, permalink: tagPermalink}) => (
28
28
  <li key={tagPermalink} className={styles.tag}>
29
- <Tag name={label} permalink={tagPermalink} />
29
+ <Tag label={label} permalink={tagPermalink} />
30
30
  </li>
31
31
  ))}
32
32
  </ul>
package/src/theme-classic.d.ts CHANGED
@@ -47,13 +47,33 @@ declare module '@theme/BlogListPaginator' {
47
47
  export default function BlogListPaginator(props: Props): JSX.Element;
48
48
  }
49
49
 
50
- declare module '@theme/BlogSidebar' {
50
+ declare module '@theme/BlogSidebar/Desktop' {
51
+ import type {BlogSidebar} from '@docusaurus/plugin-content-blog';
52
+
53
+ export interface Props {
54
+ readonly sidebar: BlogSidebar;
55
+ }
56
+
57
+ export default function BlogSidebarDesktop(props: Props): JSX.Element;
58
+ }
59
+
60
+ declare module '@theme/BlogSidebar/Mobile' {
51
61
  import type {BlogSidebar} from '@docusaurus/plugin-content-blog';
52
62
 
53
63
  export interface Props {
54
64
  readonly sidebar: BlogSidebar;
55
65
  }
56
66
 
67
+ export default function BlogSidebarMobile(props: Props): JSX.Element;
68
+ }
69
+
70
+ declare module '@theme/BlogSidebar' {
71
+ import type {BlogSidebar} from '@docusaurus/plugin-content-blog';
72
+
73
+ export interface Props {
74
+ readonly sidebar?: BlogSidebar;
75
+ }
76
+
57
77
  export default function BlogSidebar(props: Props): JSX.Element;
58
78
  }
59
79
 
@@ -1011,7 +1031,7 @@ declare module '@theme/IconExternalLink' {
1011
1031
  }
1012
1032
 
1013
1033
  declare module '@theme/TagsListByLetter' {
1014
- import type {TagsListItem} from '@docusaurus/theme-common';
1034
+ import type {TagsListItem} from '@docusaurus/types';
1015
1035
 
1016
1036
  export interface Props {
1017
1037
  readonly tags: readonly TagsListItem[];
@@ -1020,7 +1040,7 @@ declare module '@theme/TagsListByLetter' {
1020
1040
  }
1021
1041
 
1022
1042
  declare module '@theme/TagsListInline' {
1023
- import type {Tag} from '@docusaurus/utils';
1043
+ import type {Tag} from '@docusaurus/types';
1024
1044
 
1025
1045
  export interface Props {
1026
1046
  readonly tags: readonly Tag[];
@@ -1029,7 +1049,7 @@ declare module '@theme/TagsListInline' {
1029
1049
  }
1030
1050
 
1031
1051
  declare module '@theme/Tag' {
1032
- import type {TagsListItem} from '@docusaurus/theme-common';
1052
+ import type {TagsListItem} from '@docusaurus/types';
1033
1053
  import type {Optional} from 'utility-types';
1034
1054
 
1035
1055
  export interface Props extends Optional<TagsListItem, 'count'> {}