Fix typings of dynamic suspense (#28740)

x-ref: #27611 (comment)

packages/next/shared/lib/dynamic.tsx

@@ -33,17 +33,18 @@ export type LoadableBaseOptions<P = {}> = LoadableGeneratedOptions & {
   ssr?: boolean
 }
 
-export type LoadableSuspenseOptions<P = {}> = {
-  loader: Loader<P>
+export type LoadableSuspenseOptions = {
   suspense?: boolean
 }
 
 export type LoadableOptions<P = {}> = LoadableBaseOptions<P>
 
-export type DynamicOptions<P = {}> = LoadableBaseOptions<P>
+export type DynamicOptions<P = {}> =
+  | LoadableBaseOptions<P>
+  | LoadableSuspenseOptions
 
 export type LoadableFn<P = {}> = (
-  opts: LoadableOptions<P> | LoadableSuspenseOptions<P>
+  opts: LoadableOptions<P> | LoadableSuspenseOptions
 ) => React.ComponentType<P>
 
 export type LoadableComponent<P = {}> = React.ComponentType<P>
@@ -113,7 +114,9 @@ export default function dynamic<P = {}>(
   // Support for passing options, eg: dynamic(import('../hello-world'), {loading: () => <p>Loading something</p>})
   loadableOptions = { ...loadableOptions, ...options }
 
-  const suspenseOptions = loadableOptions as LoadableSuspenseOptions<P>
+  const suspenseOptions = loadableOptions as LoadableSuspenseOptions & {
+    loader: Loader<P>
+  }
   if (!process.env.__NEXT_CONCURRENT_FEATURES) {
     // Error if react root is not enabled and `suspense` option is set to true
     if (!process.env.__NEXT_REACT_ROOT && suspenseOptions.suspense) {

test/integration/react-18/app/components/ts-foo.tsx

@@ -0,0 +1,3 @@
+export default function TsFoo() {
+  return <div>ts-foo</div>
+}

test/integration/react-18/app/pages/suspense/typing.tsx

@@ -0,0 +1,14 @@
+import React, { Suspense } from 'react'
+import dynamic from 'next/dynamic'
+
+const DynamicFoo = dynamic(() => import('../../components/ts-foo'), {
+  suspense: true,
+})
+
+export default function Typing() {
+  return (
+    <Suspense fallback={null}>
+      <DynamicFoo />
+    </Suspense>
+  )
+}

test/integration/react-18/app/tsconfig.json

@@ -0,0 +1,19 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": false,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve"
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
+  "exclude": ["node_modules"]
+}