Merge branch 'canary' into patch-1

vercel · Dec 12, 2020 · 0fcd3b9 · 0fcd3b9
2 parents 8d50849 + 5b89b1b
commit 0fcd3b9
Show file tree

Hide file tree

Showing 51 changed files with 384 additions and 80 deletions.
diff --git a/docs/advanced-features/i18n-routing.md b/docs/advanced-features/i18n-routing.md
@@ -214,6 +214,12 @@ export default function IndexPage(props) {
 }
 ```
 
+## Leveraging the NEXT_LOCALE cookie
+
+Next.js supports overriding the accept-language header with a `NEXT_LOCALE=the-locale` cookie. This cookie can be set using a language switcher and then when a user comes back to the site it will leverage the locale specified in the cookie.
+
+For example, if a user prefers the locale `fr` but a `NEXT_LOCALE=en` cookie is set the `en` locale will be used instead until the cookie is removed or expired.
+
 ## Search Engine Optimization
 
 Since Next.js knows what language the user is visiting it will automatically add the `lang` attribute to the `<html>` tag.

diff --git a/docs/api-reference/next/image.md b/docs/api-reference/next/image.md
@@ -93,7 +93,9 @@ Try it out:
 
 ### sizes
 
-A string mapping media queries to device sizes. Defaults to [Device Sizes](/docs/basic-features/image-optimization.md#device-sizes).
+A string mapping media queries to device sizes. Defaults to `100vw`.
+
+We recommend setting `sizes` when `layout="responsive"` and your image will not be the same width as the viewport.
 
 [Learn more](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-sizes).
 

diff --git a/examples/with-apollo/lib/apolloClient.js b/examples/with-apollo/lib/apolloClient.js
@@ -2,6 +2,7 @@ import { useMemo } from 'react'
 import { ApolloClient, HttpLink, InMemoryCache } from '@apollo/client'
 import { concatPagination } from '@apollo/client/utilities'
 import merge from 'deepmerge'
+import isEqual from 'lodash/isEqual'
 
 export const APOLLO_STATE_PROP_NAME = '__APOLLO_STATE__'
 
@@ -36,7 +37,15 @@ export function initializeApollo(initialState = null) {
     const existingCache = _apolloClient.extract()
 
     // Merge the existing cache into data passed from getStaticProps/getServerSideProps
-    const data = merge(initialState, existingCache)
+    const data = merge(initialState, existingCache, {
+      // combine arrays using object equality (like in sets)
+      arrayMerge: (destinationArray, sourceArray) => [
+        ...sourceArray,
+        ...destinationArray.filter((d) =>
+          sourceArray.every((s) => !isEqual(d, s))
+        ),
+      ],
+    })
 
     // Restore the cache with the merged data
     _apolloClient.cache.restore(data)

diff --git a/examples/with-apollo/package.json b/examples/with-apollo/package.json
@@ -9,6 +9,7 @@
   "dependencies": {
     "@apollo/client": "3.1.1",
     "deepmerge": "^4.2.2",
+    "lodash": "4.17.20",
     "graphql": "^15.3.0",
     "next": "latest",
     "prop-types": "^15.6.2",

diff --git a/examples/with-ionic-typescript/.gitignore b/examples/with-ionic-typescript/.gitignore
@@ -0,0 +1,37 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# vercel
+.vercel
+
+# Ionic
+public/svg
diff --git a/examples/with-ionic-typescript/README.md b/examples/with-ionic-typescript/README.md
@@ -0,0 +1,21 @@
+# Ionic with TypeScript Example
+
+Example app using Next.js with [Ionic](https://ionicframework.com/) and [TypeScript](https://www.typescriptlang.org/). You can learn more about Ionic in the [documentation](https://ionicframework.com/docs).
+
+## Deploy your own
+
+Deploy the example using [Vercel](https://vercel.com):
+
+[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/import/project?template=https://github.com/vercel/next.js/tree/canary/examples/with-ionic-typescript)
+
+## How to use
+
+Execute [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app) with [Yarn](https://yarnpkg.com/lang/en/docs/cli/create/) or [npx](https://github.com/zkat/npx#readme) to bootstrap the example:
+
+```bash
+npx create-next-app --example with-ionic-typescript with-ionic-typescript-app
+# or
+yarn create next-app --example with-ionic-typescript with-ionic-typescript-app
+```
+
+Deploy it to the cloud with [Vercel](https://vercel.com/import?filter=next.js&utm_source=github&utm_medium=readme&utm_campaign=next-example) ([Documentation](https://nextjs.org/docs/deployment)).
diff --git a/examples/with-ionic-typescript/ionic.d.ts b/examples/with-ionic-typescript/ionic.d.ts
@@ -0,0 +1,24 @@
+import { ReactText, HTMLAttributes } from 'react'
+import { JSX as LocalJSX } from '@ionic/core'
+import { JSX as IoniconsJSX } from 'ionicons'
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import IonicIntrinsicElements = LocalJSX.IntrinsicElements
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import IoniconsIntrinsicElements = IoniconsJSX.IntrinsicElements
+
+type ToReact<T> = {
+  [P in keyof T]?: T[P] &
+    Omit<HTMLAttributes<Element>, 'className'> & {
+      class?: string
+      key?: ReactText
+    }
+}
+
+declare global {
+  export namespace JSX {
+    interface IntrinsicElements
+      extends ToReact<IonicIntrinsicElements & IoniconsIntrinsicElements> {
+      key?: string
+    }
+  }
+}
diff --git a/examples/with-ionic-typescript/next-env.d.ts b/examples/with-ionic-typescript/next-env.d.ts
@@ -0,0 +1,2 @@
+/// <reference types="next" />
+/// <reference types="next/types/global" />
diff --git a/examples/with-ionic-typescript/next.config.js b/examples/with-ionic-typescript/next.config.js
@@ -0,0 +1,20 @@
+const path = require('path')
+const CopyPlugin = require('copy-webpack-plugin')
+module.exports = {
+  webpack: (config) => {
+    config.plugins.push(
+      new CopyPlugin({
+        patterns: [
+          {
+            from: path.join(
+              __dirname,
+              'node_modules/ionicons/dist/ionicons/svg'
+            ),
+            to: path.join(__dirname, 'public/svg'),
+          },
+        ],
+      })
+    )
+    return config
+  },
+}
diff --git a/examples/with-ionic-typescript/package.json b/examples/with-ionic-typescript/package.json
@@ -0,0 +1,24 @@
+{
+  "name": "with-ionic-typescript",
+  "version": "0.1.0",
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "export": "next export -o build"
+  },
+  "dependencies": {
+    "@ionic/core": "^5.4.1",
+    "ionicons": "^5.2.3",
+    "next": "latest",
+    "react": "17.0.1",
+    "react-dom": "17.0.1"
+  },
+  "devDependencies": {
+    "@types/node": "^14.14.6",
+    "@types/react": "^16.9.55",
+    "copy-webpack-plugin": "6.2.1",
+    "typescript": "^4.0.5"
+  },
+  "license": "MIT"
+}
diff --git a/examples/with-ionic-typescript/pages/_app.tsx b/examples/with-ionic-typescript/pages/_app.tsx
@@ -0,0 +1,44 @@
+import React, { useEffect } from 'react'
+import { defineCustomElements as ionDefineCustomElements } from '@ionic/core/loader'
+
+/* Core CSS required for Ionic components to work properly */
+import '@ionic/core/css/core.css'
+
+/* Basic CSS for apps built with Ionic */
+import '@ionic/core/css/normalize.css'
+import '@ionic/core/css/structure.css'
+import '@ionic/core/css/typography.css'
+
+/* Optional CSS utils that can be commented out */
+import '@ionic/core/css/padding.css'
+import '@ionic/core/css/float-elements.css'
+import '@ionic/core/css/text-alignment.css'
+import '@ionic/core/css/text-transformation.css'
+import '@ionic/core/css/flex-utils.css'
+import '@ionic/core/css/display.css'
+
+function MyApp({ Component, pageProps }) {
+  useEffect(() => {
+    ionDefineCustomElements(window)
+  })
+  return (
+    <ion-app>
+      <ion-header translucent>
+        <ion-toolbar>
+          <ion-title>Next.js with Ionic</ion-title>
+        </ion-toolbar>
+      </ion-header>
+
+      <ion-content fullscreen>
+        <Component {...pageProps} />
+      </ion-content>
+      <ion-footer>
+        <ion-toolbar>
+          <ion-title>Footer</ion-title>
+        </ion-toolbar>
+      </ion-footer>
+    </ion-app>
+  )
+}
+
+export default MyApp
diff --git a/examples/with-ionic-typescript/pages/index.tsx b/examples/with-ionic-typescript/pages/index.tsx
@@ -0,0 +1,32 @@
+import Image from 'next/image'
+
+export default function Home() {
+  return (
+    <ion-grid>
+      <ion-row>
+        {new Array(8).fill('').map((k, i) => (
+          <ion-col key={i} size="3">
+            <ion-card>
+              <Image
+                src="/cat.jpg"
+                alt="Picture of the author"
+                width={500}
+                height={500}
+              />
+              <ion-card-header>
+                <ion-card-subtitle>Destination</ion-card-subtitle>
+                <ion-card-title>Madison, WI</ion-card-title>
+              </ion-card-header>
+              <ion-card-content>
+                <ion-icon name="pin" slot="start"></ion-icon>
+                Keep close to Nature's heart... and break clear away, once in
+                awhile, and climb a mountain or spend a week in the woods. Wash
+                your spirit clean.
+              </ion-card-content>
+            </ion-card>
+          </ion-col>
+        ))}
+      </ion-row>
+    </ion-grid>
+  )
+}
diff --git a/examples/with-ionic-typescript/public/cat.jpg b/examples/with-ionic-typescript/public/cat.jpg
diff --git a/examples/with-ionic-typescript/public/favicon.ico b/examples/with-ionic-typescript/public/favicon.ico
diff --git a/examples/with-ionic-typescript/public/vercel.svg b/examples/with-ionic-typescript/public/vercel.svg
diff --git a/examples/with-ionic-typescript/tsconfig.json b/examples/with-ionic-typescript/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", "ionic.d.ts", "**/*.ts", "**/*.tsx"],
+  "exclude": ["node_modules"]
+}
diff --git a/examples/with-next-translate/.gitignore b/examples/with-next-translate/.gitignore
@@ -32,6 +32,3 @@ yarn-error.log*
 
 # vercel
 .vercel
-
-# next-translate
-pages/
diff --git a/examples/with-next-translate/i18n.json b/examples/with-next-translate/i18n.json
@@ -1,9 +1,6 @@
 {
   "locales": ["en", "ca"],
   "defaultLocale": "en",
-  "currentPagesDir": "_pages",
-  "finalPagesDir": "pages",
-  "localesPath": "locales",
   "pages": {
     "*": ["common"],
     "/": ["home"]

diff --git a/examples/with-next-translate/next.config.js b/examples/with-next-translate/next.config.js
@@ -1,8 +1,3 @@
-const { locales, defaultLocale } = require('./i18n.json')
+const nextTranslate = require('next-translate')
 
-module.exports = {
-  i18n: {
-    locales,
-    defaultLocale,
-  },
-}
+module.exports = nextTranslate({})
diff --git a/examples/with-next-translate/package.json b/examples/with-next-translate/package.json
@@ -1,13 +1,13 @@
 {
   "name": "with-next-translate",
   "scripts": {
-    "dev": "next-translate && next dev",
-    "build": "next-translate && next build",
+    "dev": "next dev",
+    "build": "next build",
     "start": "next start"
   },
   "dependencies": {
-    "next": "10.0.0",
-    "next-translate": "0.19.0",
+    "next": "10.0.3",
+    "next-translate": "1.0.0",
     "react": "17.0.1",
     "react-dom": "17.0.1"
   },

diff --git a/examples/with-next-translate/_pages/index.js → examples/with-next-translate/pages/index.js b/examples/with-next-translate/_pages/index.js → examples/with-next-translate/pages/index.js
diff --git a/lerna.json b/lerna.json
@@ -17,5 +17,5 @@
       "registry": "https://registry.npmjs.org/"
     }
   },
-  "version": "10.0.4-canary.3"
+  "version": "10.0.4-canary.4"
 }
diff --git a/packages/create-next-app/package.json b/packages/create-next-app/package.json
@@ -1,6 +1,6 @@
 {
   "name": "create-next-app",
-  "version": "10.0.4-canary.3",
+  "version": "10.0.4-canary.4",
   "keywords": [
     "react",
     "next",

diff --git a/packages/eslint-plugin-next/package.json b/packages/eslint-plugin-next/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/eslint-plugin-next",
-  "version": "10.0.4-canary.3",
+  "version": "10.0.4-canary.4",
   "description": "ESLint plugin for NextJS.",
   "main": "lib/index.js",
   "license": "MIT",

diff --git a/packages/next-bundle-analyzer/package.json b/packages/next-bundle-analyzer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/bundle-analyzer",
-  "version": "10.0.4-canary.3",
+  "version": "10.0.4-canary.4",
   "main": "index.js",
   "license": "MIT",
   "repository": {

diff --git a/packages/next-codemod/package.json b/packages/next-codemod/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/codemod",
-  "version": "10.0.4-canary.3",
+  "version": "10.0.4-canary.4",
   "license": "MIT",
   "dependencies": {
     "chalk": "4.1.0",

diff --git a/packages/next-env/package.json b/packages/next-env/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/env",
-  "version": "10.0.4-canary.3",
+  "version": "10.0.4-canary.4",
   "keywords": [
     "react",
     "next",

diff --git a/packages/next-mdx/package.json b/packages/next-mdx/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@next/mdx",
-  "version": "10.0.4-canary.3",
+  "version": "10.0.4-canary.4",
   "main": "index.js",
   "license": "MIT",
   "repository": {