Merge branch 'canary' into feat/configurable-dynamic-guards

.github/workflows/validate_issue.yml

@@ -15,4 +15,3 @@ jobs:
         run: node ./.github/actions/issue-validator/index.mjs
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          DEBUG: 1

examples/react-remove-properties/next.config.js

@@ -1,6 +1,6 @@
 /** @type {import('next').NextConfig} */
 module.exports = {
-  experimental: {
+  compiler: {
     reactRemoveProperties: true,
     // Or, specify a custom list of regular expressions to match properties to remove.
     // The regexes defined here are processed in Rust so the syntax is different from

examples/using-preact/next.config.js

@@ -1,5 +1,8 @@
 const withPreact = require('next-plugin-preact')
 
-module.exports = withPreact({
+/** @type {import('next').NextConfig} */
+const nextConfig = {
   /* regular next.js config options here */
-})
+}
+
+module.exports = withPreact(nextConfig)

examples/using-preact/package.json

@@ -5,14 +5,18 @@
     "build": "next build",
     "start": "next start"
   },
-  "devDependencies": {},
   "dependencies": {
-    "next": "^12.0.0",
-    "next-plugin-preact": "^3.0.6",
-    "preact": "^10.5.15",
-    "preact-render-to-string": "^5.1.19",
-    "react": "npm:@preact/compat@^17.0.2",
-    "react-dom": "npm:@preact/compat@^17.0.2",
-    "react-ssr-prepass": "npm:preact-ssr-prepass@^1.2.0"
+    "next": "latest",
+    "next-plugin-preact": "latest",
+    "preact": "^10.10.6",
+    "preact-render-to-string": "^5.2.3",
+    "react": "npm:@preact/compat@^17.1.1",
+    "react-dom": "npm:@preact/compat@^17.1.1",
+    "react-ssr-prepass": "npm:preact-ssr-prepass@1.2.0"
+  },
+  "devDependencies": {
+    "@types/node": "18.7.15",
+    "@types/react": "16.9.17",
+    "typescript": "4.8.2"
   }
 }

examples/using-preact/pages/about.tsx

@@ -0,0 +1,3 @@
+export default function AboutPage() {
+  return <div>About us</div>
+}

examples/using-preact/pages/index.js → examples/using-preact/pages/index.tsx

@@ -1,6 +1,6 @@
 import Link from 'next/link'
 
-export default function Home() {
+export default function IndexPage() {
   return (
     <div>
       Hello World.{' '}

examples/using-preact/pages/ssg.tsx

@@ -0,0 +1,13 @@
+import { InferGetStaticPropsType } from 'next'
+
+export function getStaticProps() {
+  return {
+    props: { framework: 'preact' },
+  }
+}
+
+export default function SSGPage({
+  framework,
+}: InferGetStaticPropsType<typeof getStaticProps>) {
+  return <div>{framework} ssg example</div>
+}

examples/using-preact/pages/ssr.tsx

@@ -0,0 +1,13 @@
+import { InferGetServerSidePropsType } from 'next'
+
+export function getServerSideProps() {
+  return {
+    props: { framework: 'preact' },
+  }
+}
+
+export default function SSRPage({
+  framework,
+}: InferGetServerSidePropsType<typeof getServerSideProps>) {
+  return <div>{framework} ssr example</div>
+}

examples/using-preact/tsconfig.json

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

examples/with-context-api/components/Counter.tsx

@@ -0,0 +1,57 @@
+import {
+  useReducer,
+  useContext,
+  createContext,
+  ReactNode,
+  Dispatch,
+} from 'react'
+
+type CounterState = number
+type CounterAction =
+  | {
+      type: 'INCREASE' | 'DECREASE'
+    }
+  | {
+      type: 'INCREASE_BY'
+      payload: number
+    }
+
+const CounterStateContext = createContext<CounterState>(0)
+const CounterDispatchContext = createContext<Dispatch<CounterAction>>(
+  () => null
+)
+
+const reducer = (state: CounterState, action: CounterAction) => {
+  switch (action.type) {
+    case 'INCREASE':
+      return state + 1
+    case 'DECREASE':
+      return state - 1
+    case 'INCREASE_BY':
+      return state + action.payload
+    default:
+      throw new Error(`Unknown action: ${JSON.stringify(action)}`)
+  }
+}
+
+type CounterProviderProps = {
+  children: ReactNode
+  initialValue?: number
+}
+
+export const CounterProvider = ({
+  children,
+  initialValue = 0,
+}: CounterProviderProps) => {
+  const [state, dispatch] = useReducer(reducer, initialValue)
+  return (
+    <CounterDispatchContext.Provider value={dispatch}>
+      <CounterStateContext.Provider value={state}>
+        {children}
+      </CounterStateContext.Provider>
+    </CounterDispatchContext.Provider>
+  )
+}
+
+export const useCount = () => useContext(CounterStateContext)
+export const useDispatchCount = () => useContext(CounterDispatchContext)

examples/with-context-api/package.json

@@ -7,7 +7,12 @@
   },
   "dependencies": {
     "next": "latest",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2"
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "devDependencies": {
+    "@types/node": "18.7.15",
+    "@types/react": "16.9.17",
+    "typescript": "4.8.2"
   }
 }

examples/with-context-api/pages/_app.js → examples/with-context-api/pages/_app.tsx

@@ -1,11 +1,10 @@
+import type { AppProps } from 'next/app'
 import { CounterProvider } from '../components/Counter'
 
-function MyApp({ Component, pageProps }) {
+export default function MyApp({ Component, pageProps }: AppProps) {
   return (
     <CounterProvider>
       <Component {...pageProps} />
     </CounterProvider>
   )
 }
-
-export default MyApp

examples/with-context-api/pages/about.js → examples/with-context-api/pages/about.tsx

@@ -1,15 +1,16 @@
+import type { MouseEvent } from 'react'
 import Link from 'next/link'
 import { useCount, useDispatchCount } from '../components/Counter'
 
 const AboutPage = () => {
   const count = useCount()
   const dispatch = useDispatchCount()
 
-  const handleIncrease = (event) =>
+  const handleIncrease = (event: MouseEvent<HTMLButtonElement>) =>
     dispatch({
       type: 'INCREASE',
     })
-  const handleIncrease15 = (event) =>
+  const handleIncrease15 = (event: MouseEvent<HTMLButtonElement>) =>
     dispatch({
       type: 'INCREASE_BY',
       payload: 15,

examples/with-context-api/pages/index.js → examples/with-context-api/pages/index.tsx

@@ -1,15 +1,16 @@
+import type { MouseEvent } from 'react'
 import Link from 'next/link'
 import { useCount, useDispatchCount } from '../components/Counter'
 
 const IndexPage = () => {
   const count = useCount()
   const dispatch = useDispatchCount()
 
-  const handleIncrease = (event) =>
+  const handleIncrease = (event: MouseEvent<HTMLButtonElement>) =>
     dispatch({
       type: 'INCREASE',
     })
-  const handleDecrease = (event) =>
+  const handleDecrease = (event: MouseEvent<HTMLButtonElement>) =>
     dispatch({
       type: 'DECREASE',
     })

examples/with-context-api/tsconfig.json

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

examples/with-react-jss/package.json

@@ -7,8 +7,13 @@
   },
   "dependencies": {
     "next": "latest",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
-    "react-jss": "^10.3.0"
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-jss": "^10.9.2"
+  },
+  "devDependencies": {
+    "@types/node": "18.7.15",
+    "@types/react": "18.0.18",
+    "typescript": "4.8.2"
   }
 }

examples/with-react-jss/pages/_app.js → examples/with-react-jss/pages/_app.tsx

@@ -1,9 +1,10 @@
+import type { AppProps } from 'next/app'
 import { useEffect } from 'react'
 
-export default function App({ Component, pageProps }) {
+export default function App({ Component, pageProps }: AppProps) {
   useEffect(() => {
     const style = document.getElementById('server-side-styles')
-    if (style) {
+    if (style && style.parentNode) {
       style.parentNode.removeChild(style)
     }
   }, [])

examples/with-react-jss/pages/_document.js → examples/with-react-jss/pages/_document.tsx

@@ -1,8 +1,8 @@
-import Document from 'next/document'
+import Document, { DocumentContext } from 'next/document'
 import { SheetsRegistry, JssProvider, createGenerateId } from 'react-jss'
 
 export default class JssDocument extends Document {
-  static async getInitialProps(ctx) {
+  static async getInitialProps(ctx: DocumentContext) {
     const registry = new SheetsRegistry()
     const generateId = createGenerateId()
     const originalRenderPage = ctx.renderPage

examples/with-react-jss/pages/index.js → examples/with-react-jss/pages/index.tsx

@@ -12,7 +12,7 @@ const useStyles = createUseStyles({
   },
 })
 
-function Index() {
+export default function IndexPage() {
   const classes = useStyles()
 
   return (
@@ -23,5 +23,3 @@ function Index() {
     </div>
   )
 }
-
-export default Index

examples/with-react-jss/tsconfig.json

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