[pull] canary from vercel:canary

.devcontainer/devcontainer.json

@@ -32,8 +32,6 @@
     // Github latest can't be installed due to GPG issues: https://github.com/cli/cli/discussions/6222
     // "github-cli": "latest",
   },
-  // This is needed for forwarding X11: https://github.com/microsoft/vscode-remote-release/issues/3841
-  "runArgs": ["--net=host"],
   "remoteEnv": {
     "DISPLAY": ":0"
   }

.eslintrc.json

@@ -1,7 +1,7 @@
 {
   "root": true,
   "parser": "@babel/eslint-parser",
-  "plugins": ["react", "react-hooks", "jest", "import"],
+  "plugins": ["react", "react-hooks", "jest", "import", "jsdoc"],
   "env": {
     "browser": true,
     "commonjs": true,
@@ -96,7 +96,16 @@
         "@typescript-eslint/no-useless-constructor": "warn",
         "@typescript-eslint/prefer-literal-enum-member": "error",
         "@typescript-eslint/prefer-namespace-keyword": "error"
-      }
+      },
+      "overrides": [
+        {
+          "files": ["packages/**"],
+          "rules": {
+            "jsdoc/no-types": "error",
+            "jsdoc/no-undefined-types": "error"
+          }
+        }
+      ]
     },
     {
       "files": [

.github/actions/next-stats-action/package.json

@@ -1,6 +1,9 @@
 {
   "private": true,
   "main": "src/index.js",
+  "scripts": {
+    "turbo": "turbo"
+  },
   "dependencies": {
     "async-sema": "^3.1.0",
     "fs-extra": "^8.1.0",
@@ -12,6 +15,7 @@
     "prettier": "^1.18.2",
     "pretty-bytes": "^5.3.0",
     "pretty-ms": "^5.0.0",
-    "semver": "7.3.4"
+    "semver": "7.3.4",
+    "turbo": "1.6.3"
   }
 }

.github/actions/next-stats-action/src/prepare/repo-setup.js

@@ -10,6 +10,18 @@ const mockTrace = () => ({
   traceChild: () => mockTrace(),
 })
 
+let turboRepoRoot = path.join(__dirname, '..', '..', '..', '..', '..')
+
+// stats-action runs this code without access to the original repo.
+// In that case we just use the temporary directory (everything is temporary anyway in CI)
+if (turboRepoRoot === '/') {
+  turboRepoRoot = path.join(__dirname, '..', '..')
+}
+
+/** Save turbo cache to persistent storage */
+const turboCacheLocation = path.join(turboRepoRoot, 'node_modules/.cache/turbo')
+const packedPkgsDir = path.join(turboRepoRoot, 'test/tmp/packedPkgs')
+
 module.exports = (actionInfo) => {
   return {
     async cloneRepo(repoPath = '', dest = '') {
@@ -81,9 +93,15 @@ module.exports = (actionInfo) => {
         await rootSpan
           .traceChild('prepare packages for packing')
           .traceAsyncFn(async () => {
+            await fs.ensureDir(packedPkgsDir)
+            const repoData = require(path.join(repoDir, 'package.json'))
+
             for (const pkg of pkgs) {
               const pkgPath = path.join(repoDir, 'packages', pkg)
-              const packedPkgPath = path.join(pkgPath, `${pkg}-packed.tgz`)
+              const packedPkgPath = path.join(
+                packedPkgsDir,
+                `${pkg}-packed.tgz`
+              )
 
               const pkgDataPath = path.join(pkgPath, 'package.json')
               if (!fs.existsSync(pkgDataPath)) {
@@ -103,7 +121,8 @@ module.exports = (actionInfo) => {
             }
 
             for (const pkg of pkgDatas.keys()) {
-              const { pkgDataPath, pkgData } = pkgDatas.get(pkg)
+              const { pkgDataPath, pkgData, pkgPath, packedPkgPath } =
+                pkgDatas.get(pkg)
 
               for (const pkg of pkgDatas.keys()) {
                 const { packedPkgPath } = pkgDatas.get(pkg)
@@ -139,6 +158,27 @@ module.exports = (actionInfo) => {
                 }
               }
 
+              // Turbo requires package manager specification
+              pkgData.packageManager =
+                pkgData.packageManager || repoData.packageManager
+
+              pkgData.scripts = {
+                ...pkgData.scripts,
+                'test-pack': `yarn pack -f ${packedPkgPath}`,
+              }
+
+              await fs.writeJSON(path.join(pkgPath, 'turbo.json'), {
+                pipeline: {
+                  'test-pack': {
+                    outputs: [packedPkgPath],
+                    inputs: ['*', '!node_modules/', '!.turbo/'],
+                  },
+                },
+              })
+
+              // Turbo requires pnpm-lock.yaml that is not empty
+              await fs.writeFile(path.join(pkgPath, 'pnpm-lock.yaml'), '')
+
               await fs.writeFile(
                 pkgDataPath,
                 JSON.stringify(pkgData, null, 2),
@@ -157,9 +197,9 @@ module.exports = (actionInfo) => {
                 await packingSpan
                   .traceChild(`pack ${pkgName}`)
                   .traceAsyncFn(async () => {
-                    const { pkg, pkgPath } = pkgDatas.get(pkgName)
+                    const { pkgPath } = pkgDatas.get(pkgName)
                     await exec(
-                      `cd ${pkgPath} && yarn pack -f '${pkg}-packed.tgz'`,
+                      `pnpm run --dir="${turboRepoRoot}" turbo run test-pack --cache-dir="${turboCacheLocation}" --cwd="${pkgPath}"`,
                       true
                     )
                   })

.github/labeler.json

@@ -31,7 +31,18 @@
       { "type": "user", "pattern": "styfle" },
       { "type": "user", "pattern": "leerob" },
       { "type": "user", "pattern": "kdy1" },
-      { "type": "user", "pattern": "timneutkens" }
+      { "type": "user", "pattern": "timneutkens" },
+      { "type": "user", "pattern": "sebmarkbage" },
+      { "type": "user", "pattern": "wyattjoh" },
+      { "type": "user", "pattern": "kwonoj" },
+      { "type": "user", "pattern": "gnoff" },
+      { "type": "user", "pattern": "padmaia" },
+      { "type": "user", "pattern": "Brooooooklyn" },
+      { "type": "user", "pattern": "ForsakenHarmony" },
+      { "type": "user", "pattern": "feedthejim" },
+      { "type": "user", "pattern": "JanKaifer" },
+      { "type": "user", "pattern": "balazsorban44" },
+      { "type": "user", "pattern": "hanneslund" }
     ],
     "created-by: Next.js docs team": [
       { "type": "user", "pattern": "MaedahBatool" },

.github/workflows/build_test_deploy.yml

@@ -7,7 +7,7 @@ on:
 name: Build, test, and deploy
 
 env:
-  NAPI_CLI_VERSION: 2.12.0
+  NAPI_CLI_VERSION: 2.13.3
   TURBO_VERSION: 1.6.3
   RUST_TOOLCHAIN: nightly-2022-11-04
   PNPM_VERSION: 7.3.0
@@ -1128,7 +1128,7 @@ jobs:
             target: 'aarch64-pc-windows-msvc'
             build: |
               npm i -g "@napi-rs/cli@${NAPI_CLI_VERSION}" "turbo@${TURBO_VERSION}" "pnpm@${PNPM_VERSION}"
-              turbo run build-native-no-plugin -- --release --target aarch64-pc-windows-msvc --cargo-flags=--no-default-features
+              turbo run build-native-no-plugin-woa -- --release --target aarch64-pc-windows-msvc --cargo-flags=--no-default-features
     if: ${{ needs.build.outputs.isRelease == 'true' || (needs.build.outputs.swcChange == 'yup' && needs.build.outputs.turboToken != 'empty') }}
     needs: build
     name: stable - ${{ matrix.settings.target }} - node@16

.github/workflows/pull_request_stats.yml

@@ -5,7 +5,7 @@ on:
 name: Generate Pull Request Stats
 
 env:
-  NAPI_CLI_VERSION: 2.12.0
+  NAPI_CLI_VERSION: 2.13.3
   TURBO_VERSION: 1.6.3
   RUST_TOOLCHAIN: nightly-2022-11-04
   PNPM_VERSION: 7.3.0

contributing/core/developing.md

@@ -7,9 +7,9 @@
 To develop locally:
 
 1. Install the [GitHub CLI](https://github.com/cli/cli#installation).
-1. Clone the Next.js repository:
+1. Clone the Next.js repository (download only recent commits for faster clone):
    ```
-   gh repo clone vercel/next.js
+   gh repo clone vercel/next.js --depth=3000 --branch canary --single-branch
    ```
 1. Create a new branch:
    ```

docs/advanced-features/dynamic-import.md

@@ -13,26 +13,21 @@ description: Dynamically import JavaScript modules and React Components and spli
 
 Next.js supports lazy loading external libraries with `import()` and React components with `next/dynamic`. Deferred loading helps improve the initial loading performance by decreasing the amount of JavaScript necessary to render the page. Components or libraries are only imported and included in the JavaScript bundle when they're used.
 
-`next/dynamic` is an extension of [`React.lazy`](https://reactjs.org/docs/code-splitting.html#reactlazy). When used in combination with [`Suspense`](https://reactjs.org/docs/react-api.html#reactsuspense), components can delay hydration until the Suspense boundary is resolved.
+`next/dynamic` is a composite extension of [`React.lazy`](https://reactjs.org/docs/code-splitting.html#reactlazy) and [`Suspense`](https://reactjs.org/docs/react-api.html#reactsuspense), components can delay hydration until the Suspense boundary is resolved.
 
 ## Example
 
 By using `next/dynamic`, the header component will not be included in the page's initial JavaScript bundle. The page will render the Suspense `fallback` first, followed by the `Header` component when the `Suspense` boundary is resolved.
 
 ```jsx
 import dynamic from 'next/dynamic'
-import { Suspense } from 'react'
 
 const DynamicHeader = dynamic(() => import('../components/header'), {
-  suspense: true,
+  loading: () => 'Loading...',
 })
 
 export default function Home() {
-  return (
-    <Suspense fallback={`Loading...`}>
-      <DynamicHeader />
-    </Suspense>
-  )
+  return <DynamicHeader />
 }
 ```
 

docs/advanced-features/middleware.md

@@ -9,6 +9,7 @@ description: Learn how to use Middleware to run code before a request is complet
 
 | Version   | Changes                                                                                    |
 | --------- | ------------------------------------------------------------------------------------------ |
+| `v13.1.0` | Advanced Middleware flags added                                                            |
 | `v13.0.0` | Middleware can modify request headers, response headers, and send responses                |
 | `v12.2.0` | Middleware is stable                                                                       |
 | `v12.0.9` | Enforce absolute URLs in Edge Runtime ([PR](https://github.com/vercel/next.js/pull/33410)) |
@@ -220,18 +221,7 @@ export function middleware(request: NextRequest) {
 
 ## Producing a Response
 
-You can respond to middleware directly by returning a `NextResponse` (responding from middleware is available since Next.js v13.0.0).
-
-To enable middleware responses, update `next.config.js`:
-
-```js
-// next.config.js
-module.exports = {
-  experimental: {
-    allowMiddlewareResponseBody: true,
-  },
-}
-```
+You can respond to middleware directly by returning a `NextResponse` (responding from middleware is available since Next.js v13.1.0).
 
 Once enabled, you can provide a response from middleware using the `Response` or `NextResponse` API:
 
@@ -257,6 +247,66 @@ export function middleware(request: NextRequest) {
 }
 ```
 
+## Advanced Middleware Flags
+
+In `v13.1` of Next.js two additional flags were introduced for middleware, `skipMiddlewareUrlNormalize` and `skipTrailingSlashRedirect` to handle advanced use cases.
+
+`skipTrailingSlashRedirect` allows disabling Next.js default redirects for adding or removing trailing slashes allowing custom handling inside middleware which can allow maintaining the trailing slash for some paths but not others allowing easier incremental migrations.
+
+```js
+// next.config.js
+module.exports = {
+  skipTrailingSlashRedirect: true,
+}
+```
+
+```js
+// middleware.js
+
+const legacyPrefixes = ['/docs', '/blog']
+
+export default async function middleware(req) {
+  const { pathname } = req.nextUrl
+
+  if (legacyPrefixes.some((prefix) => pathname.startsWith(prefix))) {
+    return NextResponse.next()
+  }
+
+  // apply trailing slash handling
+  if (
+    !pathname.endsWith('/') &&
+    !pathname.match(/((?!\.well-known(?:\/.*)?)(?:[^/]+\/)*[^/]+\.\w+)/)
+  ) {
+    req.nextUrl.pathname += '/'
+    return NextResponse.redirect(req.nextUrl)
+  }
+}
+```
+
+`skipMiddlewareUrlNormalize` allows disabling the URL normalizing Next.js does to make handling direct visits and client-transitions the same. There are some advanced cases where you need full control using the original URL which this unlocks.
+
+```js
+// next.config.js
+
+module.exports = {
+  skipMiddlewareUrlNormalize: true,
+}
+```
+
+```js
+// middleware.js
+
+export default async function middleware(req) {
+  const { pathname } = req.nextUrl
+
+  // GET /_next/data/build-id/hello.json
+
+  console.log(pathname)
+  // with the flag this now /_next/data/build-id/hello.json
+  // without the flag this would be normalized to /hello
+}
+```
+
 ## Related
 
 <div class="card">

docs/api-reference/data-fetching/get-static-props.md

@@ -233,8 +233,7 @@ export const getStaticProps: GetStaticProps<{ posts: Post[] }> = async (
 If you want to get inferred typings for your props, you can use `InferGetStaticPropsType<typeof getStaticProps>`:
 
 ```tsx
-import { InferGetStaticPropsType } from 'next'
-import { GetStaticProps } from 'next'
+import type { InferGetStaticPropsType, GetStaticProps } from 'next'
 
 type Post = {
   author: string

docs/api-reference/next.config.js/disabling-http-keep-alive.md

@@ -4,19 +4,9 @@ description: Next.js will automatically use HTTP Keep-Alive by default. Learn mo
 
 # Disabling HTTP Keep-Alive
 
-Next.js automatically polyfills [node-fetch](/docs/basic-features/supported-browsers-features#polyfills) and enables [HTTP Keep-Alive](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Keep-Alive) by default. You may want to disable HTTP Keep-Alive for certain `fetch()` calls or globally.
+In Node.js versions prior to 18, Next.js automatically polyfills `fetch()` with [node-fetch](/docs/basic-features/supported-browsers-features#polyfills) and enables [HTTP Keep-Alive](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Keep-Alive) by default.
 
-For a single `fetch()` call, you can add the agent option:
-
-```js
-import { Agent } from 'https'
-
-const url = 'https://example.com'
-const agent = new Agent({ keepAlive: false })
-fetch(url, { agent })
-```
-
-To override all `fetch()` calls globally, you can use `next.config.js`:
+To disable HTTP Keep-Alive for all `fetch()` calls on the server-side, open `next.config.js` and add the `httpAgentOptions` config:
 
 ```js
 module.exports = {

errors/no-img-element.md

@@ -29,7 +29,7 @@ function Home() {
 export default Home
 ```
 
-If you would like to use `next/image` featrues such as blur-up placeholders but disable Image Optimization, you can do so using [unoptimized](https://nextjs.org/docs/api-reference/next/image#unoptimized).
+If you would like to use `next/image` features such as blur-up placeholders but disable Image Optimization, you can do so using [unoptimized](https://nextjs.org/docs/api-reference/next/image#unoptimized).
 
 <br />
 

examples/with-turbopack/README.md

@@ -11,21 +11,7 @@ This playground is a mirror of the [Next.js v13 App Directory Playground](https:
 1. Install dependencies: `yarn`
 1. Start the dev server: `yarn dev`
 
-**Note:** The playground uses [Tailwind CSS](https://tailwindcss.com). However, Turbopack does not yet support fully [PostCSS](https://turbo.build/pack/docs/features/css#postcss), but it does support CSS and CSS Modules. [As a workaround](https://turbo.build/pack/docs/features/css#tailwind-css), we run Tailwind through it's CLI upon `postinstall`. For live reload of CSS, you can run Tailwind in another process with the `--watch` flag or install `concurrently` and modify your `dev` script:
-
-```bash
-yarn add concurrently --dev
-```
-
-Then modify your `dev` script in `package.json`:
-
-```json
-{
-  "scripts": {
-    "dev": "concurrently \"next dev --turbo\" \"npm run tailwind --watch\""
-  }
-}
-```
+**Note:** The playground uses [Tailwind CSS](https://tailwindcss.com) via [PostCSS](https://turbo.build/pack/docs/features/css#postcss).
 
 For more information, see: https://turbo.build/pack/docs/features/css#tailwind-css
 

examples/with-turbopack/app/layout.tsx

@@ -1,4 +1,4 @@
-import '@/styles/dist.css';
+import '@/styles/globals.css';
 import React from 'react';
 import AddressBar from '@/ui/AddressBar';
 import GlobalNav from './GlobalNav';