From 7f7b858cd4f5f5c26b4559d6f5661d0c8ace1737 Mon Sep 17 00:00:00 2001 From: Joshua Chen Date: Wed, 6 Oct 2021 01:04:24 +0800 Subject: [PATCH] refactor: make all Props defined as interface + readonly (#5636) * Initial work * Fix --- .eslintrc.js | 6 + .../src/index.d.ts | 8 +- .../src/plugin-content-blog.d.ts | 26 +-- .../src/plugin-content-docs.d.ts | 29 ++- .../src/plugin-content-pages.d.ts | 4 +- .../docusaurus-plugin-debug/src/types.d.ts | 14 +- .../src/theme/DocTagDocListPage/index.tsx | 10 +- .../docusaurus-theme-classic/src/types.d.ts | 195 ++++++++++-------- packages/docusaurus-types/src/index.d.ts | 8 +- .../src/client/PendingNavigation.tsx | 6 +- website/docs/lifecycle-apis.md | 4 +- 11 files changed, 169 insertions(+), 141 deletions(-) diff --git a/.eslintrc.js b/.eslintrc.js index 3cd3bc0255..427c59ef54 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -126,6 +126,12 @@ module.exports = { '@typescript-eslint/no-shadow': ERROR, 'no-redeclare': OFF, '@typescript-eslint/no-redeclare': ERROR, + '@typescript-eslint/no-empty-interface': [ + 'error', + { + allowSingleExtends: true, + }, + ], }, overrides: [ { diff --git a/packages/docusaurus-module-type-aliases/src/index.d.ts b/packages/docusaurus-module-type-aliases/src/index.d.ts index 409b5dfbe5..03db7a2a16 100644 --- a/packages/docusaurus-module-type-aliases/src/index.d.ts +++ b/packages/docusaurus-module-type-aliases/src/index.d.ts @@ -228,10 +228,10 @@ declare module '@docusaurus/ComponentCreator' { } declare module '@docusaurus/BrowserOnly' { - export type Props = { - children?: () => JSX.Element; - fallback?: JSX.Element; - }; + export interface Props { + readonly children?: () => JSX.Element; + readonly fallback?: JSX.Element; + } const BrowserOnly: (props: Props) => JSX.Element | null; export default BrowserOnly; } diff --git a/packages/docusaurus-plugin-content-blog/src/plugin-content-blog.d.ts b/packages/docusaurus-plugin-content-blog/src/plugin-content-blog.d.ts index 2c1e8767e0..bbe00a6ab4 100644 --- a/packages/docusaurus-plugin-content-blog/src/plugin-content-blog.d.ts +++ b/packages/docusaurus-plugin-content-blog/src/plugin-content-blog.d.ts @@ -16,9 +16,9 @@ declare module '@theme/BlogSidebar' { items: BlogSidebarItem[]; }; - export type Props = { + export interface Props { readonly sidebar: BlogSidebar; - }; + } const BlogSidebar: (props: Props) => JSX.Element; export default BlogSidebar; @@ -57,10 +57,10 @@ declare module '@theme/BlogPostPage' { (): JSX.Element; }; - export type Props = { + export interface Props { readonly sidebar: BlogSidebar; readonly content: Content; - }; + } const BlogPostPage: (props: Props) => JSX.Element; export default BlogPostPage; @@ -82,11 +82,11 @@ declare module '@theme/BlogListPage' { readonly totalPages: number; }; - export type Props = { + export interface Props { readonly sidebar: BlogSidebar; readonly metadata: Metadata; readonly items: readonly {readonly content: Content}[]; - }; + } const BlogListPage: (props: Props) => JSX.Element; export default BlogListPage; @@ -103,10 +103,10 @@ declare module '@theme/BlogTagsListPage' { slug: string; }; - export type Props = { + export interface Props { readonly sidebar: BlogSidebar; readonly tags: Readonly>; - }; + } const BlogTagsListPage: (props: Props) => JSX.Element; export default BlogTagsListPage; @@ -117,11 +117,11 @@ declare module '@theme/BlogTagsPostsPage' { import type {Tag} from '@theme/BlogTagsListPage'; import type {Content} from '@theme/BlogPostPage'; - export type Props = { + export interface Props { readonly sidebar: BlogSidebar; readonly metadata: Tag; readonly items: readonly {readonly content: Content}[]; - }; + } const BlogTagsPostsPage: (props: Props) => JSX.Element; export default BlogTagsPostsPage; @@ -132,11 +132,11 @@ declare module '@theme/BlogArchivePage' { export type ArchiveBlogPost = Content; - export type Props = { + export interface Props { readonly archive: { - blogPosts: readonly ArchiveBlogPost[]; + readonly blogPosts: readonly ArchiveBlogPost[]; }; - }; + } export default function BlogArchivePage(props: Props): JSX.Element; } diff --git a/packages/docusaurus-plugin-content-docs/src/plugin-content-docs.d.ts b/packages/docusaurus-plugin-content-docs/src/plugin-content-docs.d.ts index 5385721a34..9c39f80738 100644 --- a/packages/docusaurus-plugin-content-docs/src/plugin-content-docs.d.ts +++ b/packages/docusaurus-plugin-content-docs/src/plugin-content-docs.d.ts @@ -116,7 +116,7 @@ declare module '@theme/DocItem' { }[]; }; - export type Props = { + export interface Props { readonly route: DocumentRoute; readonly versionMetadata: PropVersionMetadata; readonly content: { @@ -126,7 +126,7 @@ declare module '@theme/DocItem' { readonly contentTitle: string | undefined; (): JSX.Element; }; - }; + } const DocItem: (props: Props) => JSX.Element; export default DocItem; @@ -141,16 +141,25 @@ declare module '@theme/DocItemFooter' { declare module '@theme/DocTagsListPage' { import type {PropTagsListPage} from '@docusaurus/plugin-content-docs-types'; - export type Props = PropTagsListPage; - export default function DocItemFooter(props: Props): JSX.Element; + export interface Props extends PropTagsListPage {} + export default function DocTagsListPage(props: Props): JSX.Element; +} + +declare module '@theme/DocTagDocListPage' { + import type {PropTagDocList} from '@docusaurus/plugin-content-docs-types'; + + export interface Props { + readonly tag: PropTagDocList; + } + export default function DocTagDocListPage(props: Props): JSX.Element; } declare module '@theme/DocVersionBanner' { import type {PropVersionMetadata} from '@docusaurus/plugin-content-docs-types'; - export type Props = { + export interface Props { readonly versionMetadata: PropVersionMetadata; - }; + } const DocVersionBanner: (props: Props) => JSX.Element; export default DocVersionBanner; @@ -160,7 +169,7 @@ declare module '@theme/DocPage' { import type {PropVersionMetadata} from '@docusaurus/plugin-content-docs-types'; import type {DocumentRoute} from '@theme/DocItem'; - export type Props = { + export interface Props { readonly location: {readonly pathname: string}; readonly versionMetadata: PropVersionMetadata; readonly route: { @@ -168,7 +177,7 @@ declare module '@theme/DocPage' { readonly component: () => JSX.Element; readonly routes: DocumentRoute[]; }; - }; + } const DocPage: (props: Props) => JSX.Element; export default DocPage; @@ -177,13 +186,13 @@ declare module '@theme/DocPage' { declare module '@theme/Seo' { import type {ReactNode} from 'react'; - export type Props = { + export interface Props { readonly title?: string; readonly description?: string; readonly keywords?: readonly string[] | string; readonly image?: string; readonly children?: ReactNode; - }; + } const Seo: (props: Props) => JSX.Element; export default Seo; diff --git a/packages/docusaurus-plugin-content-pages/src/plugin-content-pages.d.ts b/packages/docusaurus-plugin-content-pages/src/plugin-content-pages.d.ts index ff347f9fc0..f5f411d230 100644 --- a/packages/docusaurus-plugin-content-pages/src/plugin-content-pages.d.ts +++ b/packages/docusaurus-plugin-content-pages/src/plugin-content-pages.d.ts @@ -12,7 +12,7 @@ declare module '@docusaurus/plugin-content-pages' { declare module '@theme/MDXPage' { import type {TOCItem} from '@docusaurus/types'; - export type Props = { + export interface Props { readonly content: { readonly frontMatter: { readonly title: string; @@ -28,7 +28,7 @@ declare module '@theme/MDXPage' { readonly toc: readonly TOCItem[]; (): JSX.Element; }; - }; + } const MDXPage: (props: Props) => JSX.Element; export default MDXPage; diff --git a/packages/docusaurus-plugin-debug/src/types.d.ts b/packages/docusaurus-plugin-debug/src/types.d.ts index e21f8108c1..890a2b38a8 100644 --- a/packages/docusaurus-plugin-debug/src/types.d.ts +++ b/packages/docusaurus-plugin-debug/src/types.d.ts @@ -14,9 +14,9 @@ declare module '@theme/DebugConfig' { declare module '@theme/DebugContent' { import type {AllContent} from '@docusaurus/types'; - export type Props = { - allContent: AllContent; - }; + export interface Props { + readonly allContent: AllContent; + } export default function DebugContent(props: Props): JSX.Element; } @@ -25,10 +25,10 @@ declare module '@theme/DebugGlobalData' { } declare module '@theme/DebugJsonView' { - export type Props = { - src: unknown; - collapseDepth?: number; - }; + export interface Props { + readonly src: unknown; + readonly collapseDepth?: number; + } export default function DebugJsonView(props: Props): JSX.Element; } diff --git a/packages/docusaurus-theme-classic/src/theme/DocTagDocListPage/index.tsx b/packages/docusaurus-theme-classic/src/theme/DocTagDocListPage/index.tsx index b72e39ab01..5a5dbe24f4 100644 --- a/packages/docusaurus-theme-classic/src/theme/DocTagDocListPage/index.tsx +++ b/packages/docusaurus-theme-classic/src/theme/DocTagDocListPage/index.tsx @@ -10,15 +10,9 @@ import React from 'react'; import Layout from '@theme/Layout'; import Link from '@docusaurus/Link'; import {ThemeClassNames, usePluralForm} from '@docusaurus/theme-common'; -import type { - PropTagDocList, - PropTagDocListDoc, -} from '@docusaurus/plugin-content-docs-types'; +import type {PropTagDocListDoc} from '@docusaurus/plugin-content-docs-types'; import Translate, {translate} from '@docusaurus/Translate'; - -type Props = { - tag: PropTagDocList; -}; +import type {Props} from '@theme/DocTagDocListPage'; // Very simple pluralization: probably good enough for now function useNDocsTaggedPlural() { diff --git a/packages/docusaurus-theme-classic/src/types.d.ts b/packages/docusaurus-theme-classic/src/types.d.ts index a22b412822..2d40c63cbf 100644 --- a/packages/docusaurus-theme-classic/src/types.d.ts +++ b/packages/docusaurus-theme-classic/src/types.d.ts @@ -22,7 +22,9 @@ declare module '@theme/AnnouncementBar' { declare module '@theme/BlogListPaginator' { import type {Metadata} from '@theme/BlogListPage'; - export type Props = {readonly metadata: Metadata}; + export interface Props { + readonly metadata: Metadata; + } const BlogListPaginator: (props: Props) => JSX.Element; export default BlogListPaginator; @@ -31,14 +33,14 @@ declare module '@theme/BlogListPaginator' { declare module '@theme/BlogPostItem' { import type {FrontMatter, Assets, Metadata} from '@theme/BlogPostPage'; - export type Props = { + export interface Props { readonly frontMatter: FrontMatter; readonly assets: Assets; readonly metadata: Metadata; readonly truncated?: string | boolean; readonly isBlogPostPage?: boolean; readonly children: JSX.Element; - }; + } const BlogPostItem: (props: Props) => JSX.Element; export default BlogPostItem; @@ -47,9 +49,9 @@ declare module '@theme/BlogPostItem' { declare module '@theme/BlogPostAuthor' { import type {Metadata} from '@theme/BlogPostPage'; - export type Props = { + export interface Props { readonly author: Metadata['authors'][number]; - }; + } export default function BlogPostAuthor(props: Props): JSX.Element; } @@ -57,10 +59,10 @@ declare module '@theme/BlogPostAuthor' { declare module '@theme/BlogPostAuthors' { import type {Metadata, Assets} from '@theme/BlogPostPage'; - export type Props = { + export interface Props { readonly authors: Metadata['authors']; readonly assets: Assets; - }; + } export default function BlogPostAuthors(props: Props): JSX.Element; } @@ -68,7 +70,10 @@ declare module '@theme/BlogPostAuthors' { declare module '@theme/BlogPostPaginator' { type Item = {readonly title: string; readonly permalink: string}; - export type Props = {readonly nextItem?: Item; readonly prevItem?: Item}; + export interface Props { + readonly nextItem?: Item; + readonly prevItem?: Item; + } const BlogPostPaginator: (props: Props) => JSX.Element; export default BlogPostPaginator; @@ -79,10 +84,10 @@ declare module '@theme/BlogLayout' { import type {Props as LayoutProps} from '@theme/Layout'; import type {BlogSidebar} from '@theme/BlogSidebar'; - export type Props = LayoutProps & { + export interface Props extends LayoutProps { readonly sidebar?: BlogSidebar; readonly toc?: ReactNode; - }; + } const BlogLayout: (props: Props) => JSX.Element; export default BlogLayout; @@ -91,12 +96,12 @@ declare module '@theme/BlogLayout' { declare module '@theme/CodeBlock' { import {ReactElement} from 'react'; - export type Props = { + export interface Props { readonly children: string | ReactElement; readonly className?: string; readonly metastring?: string; readonly title?: string; - }; + } const CodeBlock: (props: Props) => JSX.Element; export default CodeBlock; @@ -105,9 +110,9 @@ declare module '@theme/CodeBlock' { declare module '@theme/DocPaginator' { type PageInfo = {readonly permalink: string; readonly title: string}; - export type Props = { + export interface Props { readonly metadata: {readonly previous?: PageInfo; readonly next?: PageInfo}; - }; + } const DocPaginator: (props: Props) => JSX.Element; export default DocPaginator; @@ -116,12 +121,14 @@ declare module '@theme/DocPaginator' { declare module '@theme/DocSidebar' { import type {PropSidebarItem} from '@docusaurus/plugin-content-docs-types'; - export type Props = { + export interface Props { readonly path: string; readonly sidebar: readonly PropSidebarItem[]; readonly onCollapse: () => void; readonly isHidden: boolean; - }; + // MobileSecondaryFilter expects Record + readonly [key: string]: unknown; + } const DocSidebar: (props: Props) => JSX.Element; export default DocSidebar; @@ -136,9 +143,9 @@ declare module '@theme/DocSidebarItem' { readonly tabIndex?: number; }; - export type Props = DocSidebarPropsBase & { + export interface Props extends DocSidebarPropsBase { readonly item: PropSidebarItem; - }; + } const DocSidebarItem: (props: Props) => JSX.Element; export default DocSidebarItem; @@ -154,9 +161,9 @@ declare module '@theme/DocVersionSuggestions' { } declare module '@theme/EditThisPage' { - export type Props = { + export interface Props { readonly editUrl: string; - }; + } const EditThisPage: (props: Props) => JSX.Element; export default EditThisPage; } @@ -170,7 +177,7 @@ declare module '@theme/Heading' { import type {ComponentProps} from 'react'; export type HeadingType = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'; - export type Props = ComponentProps; + export interface Props extends ComponentProps {} const Heading: (Tag: HeadingType) => (props: Props) => JSX.Element; export default Heading; @@ -285,21 +292,21 @@ declare module '@theme/hooks/useKeyboardNavigation' { declare module '@theme/Layout' { import type {ReactNode} from 'react'; - export type Props = { - children: ReactNode; - title?: string; - noFooter?: boolean; - description?: string; - image?: string; - keywords?: string | string[]; - permalink?: string; - wrapperClassName?: string; - pageClassName?: string; - searchMetadatas?: { - version?: string; - tag?: string; + export interface Props { + readonly children: ReactNode; + readonly title?: string; + readonly noFooter?: boolean; + readonly description?: string; + readonly image?: string; + readonly keywords?: string | string[]; + readonly permalink?: string; + readonly wrapperClassName?: string; + readonly pageClassName?: string; + readonly searchMetadatas?: { + readonly version?: string; + readonly tag?: string; }; - }; + } const Layout: (props: Props) => JSX.Element; export default Layout; @@ -308,29 +315,29 @@ declare module '@theme/Layout' { declare module '@theme/LayoutHead' { import type {Props as LayoutProps} from '@theme/Layout'; - export type Props = Omit; + export interface Props extends Omit {} const LayoutHead: (props: Props) => JSX.Element; export default LayoutHead; } declare module '@theme/SearchMetadatas' { - export type Props = { - locale?: string; - version?: string; - tag?: string; - }; + export interface Props { + readonly locale?: string; + readonly version?: string; + readonly tag?: string; + } const SearchMetadatas: (props: Props) => JSX.Element; export default SearchMetadatas; } declare module '@theme/LastUpdated' { - export type Props = { - lastUpdatedAt?: number; - formattedLastUpdatedAt?: string; - lastUpdatedBy?: string; - }; + export interface Props { + readonly lastUpdatedAt?: number; + readonly formattedLastUpdatedAt?: string; + readonly lastUpdatedBy?: string; + } const LastUpdated: (props: Props) => JSX.Element; export default LastUpdated; @@ -387,9 +394,9 @@ declare module '@theme/NavbarItem/DefaultNavbarItem' { readonly position?: 'left' | 'right'; }; - export type Props = DesktopOrMobileNavBarItemProps & { + export interface Props extends DesktopOrMobileNavBarItemProps { readonly mobile?: boolean; - }; + } export const NavLink: (props: NavLinkProps) => JSX.Element; @@ -407,16 +414,18 @@ declare module '@theme/NavbarItem/DropdownNavbarItem' { readonly className?: string; }; - export type Props = DesktopOrMobileNavBarItemProps & { + export interface Props extends DesktopOrMobileNavBarItemProps { readonly mobile?: boolean; - }; + } const DropdownNavbarItem: (props: Props) => JSX.Element; export default DropdownNavbarItem; } declare module '@theme/NavbarItem/SearchNavbarItem' { - export type Props = {readonly mobile?: boolean}; + export interface Props { + readonly mobile?: boolean; + } const SearchNavbarItem: (props: Props) => JSX.Element; export default SearchNavbarItem; @@ -426,10 +435,10 @@ declare module '@theme/NavbarItem/LocaleDropdownNavbarItem' { import type {Props as DropdownNavbarItemProps} from '@theme/NavbarItem/DropdownNavbarItem'; import type {LinkLikeNavbarItemProps} from '@theme/NavbarItem'; - export type Props = DropdownNavbarItemProps & { + export interface Props extends DropdownNavbarItemProps { readonly dropdownItemsBefore: LinkLikeNavbarItemProps[]; readonly dropdownItemsAfter: LinkLikeNavbarItemProps[]; - }; + } const LocaleDropdownNavbarItem: (props: Props) => JSX.Element; export default LocaleDropdownNavbarItem; @@ -439,12 +448,12 @@ declare module '@theme/NavbarItem/DocsVersionDropdownNavbarItem' { import type {Props as DropdownNavbarItemProps} from '@theme/NavbarItem/DropdownNavbarItem'; import type {LinkLikeNavbarItemProps} from '@theme/NavbarItem'; - export type Props = DropdownNavbarItemProps & { + export interface Props extends DropdownNavbarItemProps { readonly docsPluginId?: string; readonly dropdownActiveClassDisabled?: boolean; readonly dropdownItemsBefore: LinkLikeNavbarItemProps[]; readonly dropdownItemsAfter: LinkLikeNavbarItemProps[]; - }; + } const DocsVersionDropdownNavbarItem: (props: Props) => JSX.Element; export default DocsVersionDropdownNavbarItem; @@ -453,7 +462,9 @@ declare module '@theme/NavbarItem/DocsVersionDropdownNavbarItem' { declare module '@theme/NavbarItem/DocsVersionNavbarItem' { import type {Props as DefaultNavbarItemProps} from '@theme/NavbarItem/DefaultNavbarItem'; - export type Props = DefaultNavbarItemProps & {readonly docsPluginId?: string}; + export interface Props extends DefaultNavbarItemProps { + readonly docsPluginId?: string; + } const DocsVersionNavbarItem: (props: Props) => JSX.Element; export default DocsVersionNavbarItem; @@ -462,10 +473,10 @@ declare module '@theme/NavbarItem/DocsVersionNavbarItem' { declare module '@theme/NavbarItem/DocNavbarItem' { import type {Props as DefaultNavbarItemProps} from '@theme/NavbarItem/DefaultNavbarItem'; - export type Props = DefaultNavbarItemProps & { + export interface Props extends DefaultNavbarItemProps { readonly docId: string; readonly docsPluginId?: string; - }; + } const DocsSidebarNavbarItem: (props: Props) => JSX.Element; export default DocsSidebarNavbarItem; @@ -509,14 +520,14 @@ declare module '@theme/NavbarItem' { declare module '@theme/TabItem' { import type {ReactNode} from 'react'; - export type Props = { + export interface Props { readonly children: ReactNode; readonly value: string; readonly default?: boolean; readonly label?: string; readonly hidden?: boolean; readonly className?: string; - }; + } const TabItem: (props: Props) => JSX.Element; export default TabItem; @@ -526,7 +537,7 @@ declare module '@theme/Tabs' { import type {ReactElement} from 'react'; import type {Props as TabItemProps} from '@theme/TabItem'; - export type Props = { + export interface Props { readonly lazy?: boolean; readonly block?: boolean; readonly children: readonly ReactElement[]; @@ -534,7 +545,7 @@ declare module '@theme/Tabs' { readonly values?: readonly {value: string; label?: string}[]; readonly groupId?: string; readonly className?: string; - }; + } const Tabs: (props: Props) => JSX.Element; export default Tabs; @@ -543,12 +554,12 @@ declare module '@theme/Tabs' { declare module '@theme/ThemedImage' { import type {ComponentProps} from 'react'; - export type Props = { + export interface Props extends Omit, 'src'> { readonly sources: { readonly light: string; readonly dark: string; }; - } & Omit, 'src'>; + } const ThemedImage: (props: Props) => JSX.Element; export default ThemedImage; @@ -557,14 +568,16 @@ declare module '@theme/ThemedImage' { declare module '@theme/Details' { import {Details, DetailsProps} from '@docusaurus/theme-common'; - export type Props = DetailsProps; + export interface Props extends DetailsProps {} export default Details; } declare module '@theme/ThemeProvider' { import type {ReactNode} from 'react'; - export type Props = {readonly children: ReactNode}; + export interface Props { + readonly children: ReactNode; + } const ThemeProvider: (props: Props) => JSX.Element; export default ThemeProvider; @@ -640,11 +653,11 @@ declare module '@theme/TOCCollapsible' { declare module '@theme/Toggle' { import type {SyntheticEvent} from 'react'; - export type Props = { + export interface Props { readonly className?: string; readonly checked: boolean; readonly onChange: (e: SyntheticEvent) => void; - }; + } const Toggle: (props: Props) => JSX.Element; export default Toggle; @@ -653,7 +666,9 @@ declare module '@theme/Toggle' { declare module '@theme/UserPreferencesProvider' { import type {ReactNode} from 'react'; - export type Props = {readonly children: ReactNode}; + export interface Props { + readonly children: ReactNode; + } const UserPreferencesProvider: (props: Props) => JSX.Element; export default UserPreferencesProvider; @@ -662,7 +677,9 @@ declare module '@theme/UserPreferencesProvider' { declare module '@theme/LayoutProviders' { import type {ReactNode} from 'react'; - export type Props = {readonly children: ReactNode}; + export interface Props { + readonly children: ReactNode; + } const LayoutProviders: (props: Props) => JSX.Element; export default LayoutProviders; @@ -689,10 +706,10 @@ declare module '@theme/UserPreferencesContext' { declare module '@theme/Logo' { import type {ComponentProps} from 'react'; - export type Props = { - imageClassName?: string; - titleClassName?: string; - } & ComponentProps<'a'>; + export interface Props extends ComponentProps<'a'> { + readonly imageClassName?: string; + readonly titleClassName?: string; + } const Logo: (props: Props) => JSX.Element; export default Logo; @@ -701,7 +718,7 @@ declare module '@theme/Logo' { declare module '@theme/IconArrow' { import type {ComponentProps} from 'react'; - export type Props = ComponentProps<'svg'>; + export interface Props extends ComponentProps<'svg'> {} const IconArrow: (props: Props) => JSX.Element; export default IconArrow; @@ -710,7 +727,7 @@ declare module '@theme/IconArrow' { declare module '@theme/IconEdit' { import type {ComponentProps} from 'react'; - export type Props = ComponentProps<'svg'>; + export interface Props extends ComponentProps<'svg'> {} const IconEdit: (props: Props) => JSX.Element; export default IconEdit; @@ -719,7 +736,7 @@ declare module '@theme/IconEdit' { declare module '@theme/IconMenu' { import type {ComponentProps} from 'react'; - export type Props = ComponentProps<'svg'>; + export interface Props extends ComponentProps<'svg'> {} const IconMenu: (props: Props) => JSX.Element; export default IconMenu; @@ -728,14 +745,16 @@ declare module '@theme/IconMenu' { declare module '@theme/IconClose' { import type {ComponentProps} from 'react'; - export type Props = ComponentProps<'svg'>; - export default function IconClose(props: Props): JSX.Element; + export interface Props extends ComponentProps<'svg'> {} + + const IconClose: (props: Props) => JSX.Element; + export default IconClose; } declare module '@theme/IconLanguage' { import type {ComponentProps} from 'react'; - export type Props = ComponentProps<'svg'>; + export interface Props extends ComponentProps<'svg'> {} const IconLanguage: (props: Props) => JSX.Element; export default IconLanguage; @@ -744,7 +763,7 @@ declare module '@theme/IconLanguage' { declare module '@theme/IconExternalLink' { import type {ComponentProps} from 'react'; - export type Props = ComponentProps<'svg'>; + export interface Props extends ComponentProps<'svg'> {} const IconExternalLink: (props: Props) => JSX.Element; export default IconExternalLink; @@ -756,17 +775,17 @@ declare module '@theme/TagsListByLetter' { permalink: string; count: number; }>; - export type Props = Readonly<{ - tags: readonly TagsListItem[]; - }>; + export interface Props { + readonly tags: readonly TagsListItem[]; + } export default function TagsListByLetter(props: Props): JSX.Element; } declare module '@theme/TagsListInline' { export type Tag = Readonly<{label: string; permalink}>; - export type Props = Readonly<{ - tags: readonly Tag[]; - }>; + export interface Props { + readonly tags: readonly Tag[]; + } export default function TagsListInline(props: Props): JSX.Element; } @@ -774,7 +793,7 @@ declare module '@theme/Tag' { import type {TagsListItem} from '@theme/TagsListByLetter'; import type {Optional} from 'utility-types'; - export type Props = Optional; + export interface Props extends Optional {} export default function Tag(props: Props): JSX.Element; } diff --git a/packages/docusaurus-types/src/index.d.ts b/packages/docusaurus-types/src/index.d.ts index 2699c0db18..7a87d6b543 100644 --- a/packages/docusaurus-types/src/index.d.ts +++ b/packages/docusaurus-types/src/index.d.ts @@ -211,10 +211,10 @@ export interface InjectedHtmlTags { export type HtmlTags = string | HtmlTagObject | (string | HtmlTagObject)[]; export interface Props extends LoadContext, InjectedHtmlTags { - siteMetadata: DocusaurusSiteMetadata; - routes: RouteConfig[]; - routesPaths: string[]; - plugins: LoadedPlugin[]; + readonly siteMetadata: DocusaurusSiteMetadata; + readonly routes: RouteConfig[]; + readonly routesPaths: string[]; + readonly plugins: LoadedPlugin[]; } export interface PluginContentLoadedActions { diff --git a/packages/docusaurus/src/client/PendingNavigation.tsx b/packages/docusaurus/src/client/PendingNavigation.tsx index 42f4f11674..4812171acc 100644 --- a/packages/docusaurus/src/client/PendingNavigation.tsx +++ b/packages/docusaurus/src/client/PendingNavigation.tsx @@ -20,9 +20,9 @@ import './nprogress.css'; nprogress.configure({showSpinner: false}); interface Props extends RouteComponentProps { - routes: RouteConfig[]; - delay: number; - location: Location; + readonly routes: RouteConfig[]; + readonly delay: number; + readonly location: Location; } interface State { nextRouteHasLoaded: boolean; diff --git a/website/docs/lifecycle-apis.md b/website/docs/lifecycle-apis.md index a0cbc889eb..c30034b994 100644 --- a/website/docs/lifecycle-apis.md +++ b/website/docs/lifecycle-apis.md @@ -396,7 +396,7 @@ module.exports = function (context, options) { Called when a (production) build finishes. ```ts -type Props = { +interface Props { siteDir: string; generatedFilesDir: string; siteConfig: DocusaurusConfig; @@ -407,7 +407,7 @@ type Props = { postBodyTags: string; routesPaths: string[]; plugins: Plugin[]; -}; +} ``` Example: