mirror of
https://github.com/facebook/docusaurus.git
synced 2025-06-02 10:52:35 +02:00
refactor: declare all props as interfaces (#6730)
* refactor: declare all props as interfaces * fix * fix...
This commit is contained in:
parent
5555290edc
commit
c38200ba5b
11 changed files with 44 additions and 55 deletions
|
@ -140,9 +140,9 @@ declare module '@docusaurus/Head' {
|
|||
import type {HelmetProps} from 'react-helmet-async';
|
||||
import type {ReactNode} from 'react';
|
||||
|
||||
export type HeadProps = HelmetProps & {children: ReactNode};
|
||||
export type Props = HelmetProps & {children: ReactNode};
|
||||
|
||||
const Head: (props: HeadProps) => JSX.Element;
|
||||
const Head: (props: Props) => JSX.Element;
|
||||
export default Head;
|
||||
}
|
||||
|
||||
|
@ -150,7 +150,7 @@ declare module '@docusaurus/Link' {
|
|||
import type {CSSProperties, ComponentProps} from 'react';
|
||||
|
||||
type NavLinkProps = Partial<import('react-router-dom').NavLinkProps>;
|
||||
export type LinkProps = NavLinkProps &
|
||||
export type Props = NavLinkProps &
|
||||
ComponentProps<'a'> & {
|
||||
readonly className?: string;
|
||||
readonly style?: CSSProperties;
|
||||
|
@ -162,7 +162,7 @@ declare module '@docusaurus/Link' {
|
|||
// escape hatch in case broken links check is annoying for a specific link
|
||||
readonly 'data-noBrokenLinkCheck'?: boolean;
|
||||
};
|
||||
const Link: (props: LinkProps) => JSX.Element;
|
||||
const Link: (props: Props) => JSX.Element;
|
||||
export default Link;
|
||||
}
|
||||
|
||||
|
|
|
@ -66,8 +66,8 @@ declare module '@theme/IdealImage' {
|
|||
images: SrcType[];
|
||||
};
|
||||
|
||||
export type Props = ComponentProps<'img'> & {
|
||||
img: {default: string} | {src: SrcImage; preSrc: string} | string;
|
||||
};
|
||||
export interface Props extends ComponentProps<'img'> {
|
||||
readonly img: {default: string} | {src: SrcImage; preSrc: string} | string;
|
||||
}
|
||||
export default function IdealImage(props: Props): JSX.Element;
|
||||
}
|
||||
|
|
|
@ -25,10 +25,10 @@ declare module '@docusaurus/plugin-pwa' {
|
|||
}
|
||||
|
||||
declare module '@theme/PwaReloadPopup' {
|
||||
export type PwaReloadPopupProps = {
|
||||
export interface Props {
|
||||
readonly onReload: () => void;
|
||||
};
|
||||
}
|
||||
|
||||
const PwaReloadPopup: (props: PwaReloadPopupProps) => JSX.Element;
|
||||
const PwaReloadPopup: (props: Props) => JSX.Element;
|
||||
export default PwaReloadPopup;
|
||||
}
|
||||
|
|
|
@ -9,11 +9,11 @@ import React, {useState} from 'react';
|
|||
import clsx from 'clsx';
|
||||
import Translate, {translate} from '@docusaurus/Translate';
|
||||
|
||||
import type {PwaReloadPopupProps} from '@theme/PwaReloadPopup';
|
||||
import type {Props} from '@theme/PwaReloadPopup';
|
||||
|
||||
import styles from './styles.module.css';
|
||||
|
||||
function PwaReloadPopup({onReload}: PwaReloadPopupProps): JSX.Element | false {
|
||||
function PwaReloadPopup({onReload}: Props): JSX.Element | false {
|
||||
const [isVisible, setIsVisible] = useState(true);
|
||||
|
||||
return (
|
||||
|
|
|
@ -208,9 +208,9 @@ declare module '@theme/DocSidebarItems' {
|
|||
import type {Props as DocSidebarItemProps} from '@theme/DocSidebarItem';
|
||||
import type {PropSidebarItem} from '@docusaurus/plugin-content-docs';
|
||||
|
||||
export type Props = Omit<DocSidebarItemProps, 'item' | 'index'> & {
|
||||
export interface Props extends Omit<DocSidebarItemProps, 'item' | 'index'> {
|
||||
readonly items: readonly PropSidebarItem[];
|
||||
};
|
||||
}
|
||||
|
||||
export default function DocSidebarItems(props: Props): JSX.Element;
|
||||
}
|
||||
|
@ -381,15 +381,15 @@ declare module '@theme/NavbarItem/DefaultNavbarItem' {
|
|||
|
||||
declare module '@theme/NavbarItem/NavbarNavLink' {
|
||||
import type {ReactNode} from 'react';
|
||||
import type {LinkProps} from '@docusaurus/Link';
|
||||
import type {Props as LinkProps} from '@docusaurus/Link';
|
||||
|
||||
export type Props = LinkProps & {
|
||||
export interface Props extends LinkProps {
|
||||
readonly activeBasePath?: string;
|
||||
readonly activeBaseRegex?: string;
|
||||
readonly exact?: boolean;
|
||||
readonly label?: ReactNode;
|
||||
readonly prependBaseUrlToHref?: string;
|
||||
};
|
||||
}
|
||||
|
||||
export default function NavbarNavLink(props: Props): JSX.Element;
|
||||
}
|
||||
|
@ -605,67 +605,58 @@ declare module '@theme/Details' {
|
|||
declare module '@theme/TOCItems' {
|
||||
import type {TOCItem} from '@docusaurus/types';
|
||||
|
||||
export type TOCItemsProps = {
|
||||
export interface Props {
|
||||
readonly toc: readonly TOCItem[];
|
||||
readonly minHeadingLevel?: number;
|
||||
readonly maxHeadingLevel?: number;
|
||||
readonly className?: string;
|
||||
readonly linkClassName?: string | null;
|
||||
readonly linkActiveClassName?: string;
|
||||
};
|
||||
}
|
||||
|
||||
export default function TOCItems(props: TOCItemsProps): JSX.Element;
|
||||
export default function TOCItems(props: Props): JSX.Element;
|
||||
}
|
||||
|
||||
declare module '@theme/TOC' {
|
||||
import type {TOCItem} from '@docusaurus/types';
|
||||
|
||||
// minHeadingLevel only exists as a per-doc option,
|
||||
// and won't have a default set by Joi. See TOC, TOCInline,
|
||||
// TOCCollapsible for examples
|
||||
export type TOCProps = {
|
||||
// minHeadingLevel only exists as a per-doc option, and won't have a default
|
||||
// set by Joi. See TOC, TOCInline, TOCCollapsible for examples
|
||||
export interface Props {
|
||||
readonly toc: readonly TOCItem[];
|
||||
readonly minHeadingLevel?: number;
|
||||
readonly maxHeadingLevel?: number;
|
||||
readonly className?: string;
|
||||
};
|
||||
}
|
||||
|
||||
export type TOCHeadingsProps = {
|
||||
readonly toc: readonly TOCItem[];
|
||||
readonly minHeadingLevel?: number;
|
||||
readonly maxHeadingLevel?: number;
|
||||
};
|
||||
|
||||
export const TOCHeadings: (props: TOCHeadingsProps) => JSX.Element;
|
||||
|
||||
const TOC: (props: TOCProps) => JSX.Element;
|
||||
const TOC: (props: Props) => JSX.Element;
|
||||
export default TOC;
|
||||
}
|
||||
|
||||
declare module '@theme/TOCInline' {
|
||||
import type {TOCItem} from '@docusaurus/types';
|
||||
|
||||
export type TOCInlineProps = {
|
||||
export interface Props {
|
||||
readonly toc: readonly TOCItem[];
|
||||
readonly minHeadingLevel?: number;
|
||||
readonly maxHeadingLevel?: number;
|
||||
};
|
||||
}
|
||||
|
||||
const TOCInline: (props: TOCInlineProps) => JSX.Element;
|
||||
const TOCInline: (props: Props) => JSX.Element;
|
||||
export default TOCInline;
|
||||
}
|
||||
|
||||
declare module '@theme/TOCCollapsible' {
|
||||
import type {TOCItem} from '@docusaurus/types';
|
||||
|
||||
export type TOCCollapsibleProps = {
|
||||
export interface Props {
|
||||
readonly className?: string;
|
||||
readonly minHeadingLevel?: number;
|
||||
readonly maxHeadingLevel?: number;
|
||||
readonly toc: readonly TOCItem[];
|
||||
};
|
||||
}
|
||||
|
||||
const TOCCollapsible: (props: TOCCollapsibleProps) => JSX.Element;
|
||||
const TOCCollapsible: (props: Props) => JSX.Element;
|
||||
export default TOCCollapsible;
|
||||
}
|
||||
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
|
||||
import React from 'react';
|
||||
import clsx from 'clsx';
|
||||
import type {TOCProps} from '@theme/TOC';
|
||||
import type {Props} from '@theme/TOC';
|
||||
import TOCItems from '@theme/TOCItems';
|
||||
import styles from './styles.module.css';
|
||||
|
||||
|
@ -16,7 +16,7 @@ import styles from './styles.module.css';
|
|||
const LINK_CLASS_NAME = 'table-of-contents__link toc-highlight';
|
||||
const LINK_ACTIVE_CLASS_NAME = 'table-of-contents__link--active';
|
||||
|
||||
function TOC({className, ...props}: TOCProps): JSX.Element {
|
||||
function TOC({className, ...props}: Props): JSX.Element {
|
||||
return (
|
||||
<div className={clsx(styles.tableOfContents, 'thin-scrollbar', className)}>
|
||||
<TOCItems
|
||||
|
|
|
@ -11,14 +11,14 @@ import Translate from '@docusaurus/Translate';
|
|||
import {useCollapsible, Collapsible} from '@docusaurus/theme-common';
|
||||
import styles from './styles.module.css';
|
||||
import TOCItems from '@theme/TOCItems';
|
||||
import type {TOCCollapsibleProps} from '@theme/TOCCollapsible';
|
||||
import type {Props} from '@theme/TOCCollapsible';
|
||||
|
||||
export default function TOCCollapsible({
|
||||
toc,
|
||||
className,
|
||||
minHeadingLevel,
|
||||
maxHeadingLevel,
|
||||
}: TOCCollapsibleProps): JSX.Element {
|
||||
}: Props): JSX.Element {
|
||||
const {collapsed, toggleCollapsed} = useCollapsible({
|
||||
initialState: true,
|
||||
});
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
*/
|
||||
|
||||
import React from 'react';
|
||||
import type {TOCInlineProps} from '@theme/TOCInline';
|
||||
import type {Props} from '@theme/TOCInline';
|
||||
import styles from './styles.module.css';
|
||||
import TOCItems from '@theme/TOCItems';
|
||||
|
||||
|
@ -14,7 +14,7 @@ function TOCInline({
|
|||
toc,
|
||||
minHeadingLevel,
|
||||
maxHeadingLevel,
|
||||
}: TOCInlineProps): JSX.Element {
|
||||
}: Props): JSX.Element {
|
||||
return (
|
||||
<div className={styles.tableOfContentsInline}>
|
||||
<TOCItems
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
*/
|
||||
|
||||
import React, {useMemo} from 'react';
|
||||
import type {TOCItemsProps} from '@theme/TOCItems';
|
||||
import type {Props} from '@theme/TOCItems';
|
||||
import type {TOCItem} from '@docusaurus/types';
|
||||
import {
|
||||
type TOCHighlightConfig,
|
||||
|
@ -62,7 +62,7 @@ export default function TOCItems({
|
|||
minHeadingLevel: minHeadingLevelOption,
|
||||
maxHeadingLevel: maxHeadingLevelOption,
|
||||
...props
|
||||
}: TOCItemsProps): JSX.Element | null {
|
||||
}: Props): JSX.Element | null {
|
||||
const themeConfig = useThemeConfig();
|
||||
|
||||
const minHeadingLevel =
|
||||
|
|
|
@ -7,9 +7,9 @@
|
|||
|
||||
import React from 'react';
|
||||
import {Helmet} from 'react-helmet-async';
|
||||
import type {HeadProps} from '@docusaurus/Head';
|
||||
import type {Props} from '@docusaurus/Head';
|
||||
|
||||
function Head(props: HeadProps): JSX.Element {
|
||||
function Head(props: Props): JSX.Element {
|
||||
return <Helmet {...props} />;
|
||||
}
|
||||
|
||||
|
|
|
@ -20,7 +20,7 @@ import {useLinksCollector} from '../LinksCollector';
|
|||
import {useBaseUrlUtils} from './useBaseUrl';
|
||||
import {applyTrailingSlash} from '@docusaurus/utils-common';
|
||||
|
||||
import type {LinkProps} from '@docusaurus/Link';
|
||||
import type {Props} from '@docusaurus/Link';
|
||||
import type docusaurus from '../docusaurus';
|
||||
|
||||
declare global {
|
||||
|
@ -46,7 +46,7 @@ function Link(
|
|||
'data-noBrokenLinkCheck': noBrokenLinkCheck,
|
||||
autoAddBaseUrl = true,
|
||||
...props
|
||||
}: LinkProps,
|
||||
}: Props,
|
||||
forwardedRef: React.ForwardedRef<HTMLAnchorElement>,
|
||||
): JSX.Element {
|
||||
const {
|
||||
|
@ -98,9 +98,7 @@ function Link(
|
|||
}
|
||||
|
||||
const preloaded = useRef(false);
|
||||
const LinkComponent = (
|
||||
isNavLink ? NavLink : RRLink
|
||||
) as ComponentType<LinkProps>;
|
||||
const LinkComponent = (isNavLink ? NavLink : RRLink) as ComponentType<Props>;
|
||||
|
||||
const IOSupported = ExecutionEnvironment.canUseIntersectionObserver;
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue