diff --git a/packages/next/client/script.tsx b/packages/next/client/script.tsx index 7a6dd80922661..05e12cfdb54cb 100644 --- a/packages/next/client/script.tsx +++ b/packages/next/client/script.tsx @@ -7,7 +7,7 @@ import { requestIdleCallback } from './request-idle-callback' const ScriptCache = new Map() const LoadCache = new Set() -export interface Props extends ScriptHTMLAttributes { +export interface ScriptProps extends ScriptHTMLAttributes { strategy?: 'afterInteractive' | 'lazyOnload' | 'beforeInteractive' id?: string onLoad?: () => void @@ -15,6 +15,11 @@ export interface Props extends ScriptHTMLAttributes { children?: React.ReactNode } +/** + * @deprecated Use `ScriptProps` instead. + */ +export type Props = ScriptProps + const ignoreProps = [ 'onLoad', 'dangerouslySetInnerHTML', @@ -23,7 +28,7 @@ const ignoreProps = [ 'strategy', ] -const loadScript = (props: Props): void => { +const loadScript = (props: ScriptProps): void => { const { src, id, @@ -90,7 +95,7 @@ const loadScript = (props: Props): void => { document.body.appendChild(el) } -function handleClientScriptLoad(props: Props) { +function handleClientScriptLoad(props: ScriptProps) { const { strategy = 'afterInteractive' } = props if (strategy === 'afterInteractive') { loadScript(props) @@ -101,7 +106,7 @@ function handleClientScriptLoad(props: Props) { } } -function loadLazyScript(props: Props) { +function loadLazyScript(props: ScriptProps) { if (document.readyState === 'complete') { requestIdleCallback(() => loadScript(props)) } else { @@ -111,11 +116,11 @@ function loadLazyScript(props: Props) { } } -export function initScriptLoader(scriptLoaderItems: Props[]) { +export function initScriptLoader(scriptLoaderItems: ScriptProps[]) { scriptLoaderItems.forEach(handleClientScriptLoad) } -function Script(props: Props): JSX.Element | null { +function Script(props: ScriptProps): JSX.Element | null { const { src = '', onLoad = () => {}, diff --git a/packages/next/pages/_document.tsx b/packages/next/pages/_document.tsx index 3316f623bbb12..cda62e2aeb266 100644 --- a/packages/next/pages/_document.tsx +++ b/packages/next/pages/_document.tsx @@ -14,7 +14,7 @@ import { import { BuildManifest, getPageFiles } from '../server/get-page-files' import { cleanAmpPath } from '../server/utils' import { htmlEscapeJsonString } from '../server/htmlescape' -import Script, { Props as ScriptLoaderProps } from '../client/script' +import Script, { ScriptProps } from '../client/script' export { DocumentContext, DocumentInitialProps, DocumentProps } @@ -76,7 +76,7 @@ function getPreNextScripts(context: DocumentProps, props: OriginProps) { const { scriptLoader, disableOptimizedLoading } = context return (scriptLoader.beforeInteractive || []).map( - (file: ScriptLoaderProps, index: number) => { + (file: ScriptProps, index: number) => { const { strategy, ...scriptProps } = file return (