From 3124a1a68213581a9cf118b93b6f56a2911269d6 Mon Sep 17 00:00:00 2001
From: Kasper Aamodt <kasper@aamodt.xyz>
Date: Fri, 19 Aug 2022 23:29:53 +0200
Subject: [PATCH 1/2] update to TS and update dependencies.

---
 examples/with-goober/package.json             | 13 +++++---
 .../with-goober/pages/{_app.js => _app.tsx}   |  9 +++---
 .../pages/{_document.js => _document.tsx}     | 19 +++++++++---
 .../with-goober/pages/{index.js => index.tsx} |  0
 examples/with-goober/tsconfig.json            | 30 +++++++++++++++++++
 5 files changed, 59 insertions(+), 12 deletions(-)
 rename examples/with-goober/pages/{_app.js => _app.tsx} (53%)
 rename examples/with-goober/pages/{_document.js => _document.tsx} (63%)
 rename examples/with-goober/pages/{index.js => index.tsx} (100%)
 create mode 100644 examples/with-goober/tsconfig.json

diff --git a/examples/with-goober/package.json b/examples/with-goober/package.json
index 8793b454ca5b..a92c1009be0d 100644
--- a/examples/with-goober/package.json
+++ b/examples/with-goober/package.json
@@ -6,10 +6,15 @@
     "start": "next start"
   },
   "dependencies": {
-    "goober": "^2.0.2",
-    "goober-autoprefixer": "^1.2.0",
+    "goober": "^2.1.10",
+    "goober-autoprefixer": "^1.2.3",
     "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.7",
+    "@types/react": "^18.0.17",
+    "typescript": "^4.7.4"
   }
 }
diff --git a/examples/with-goober/pages/_app.js b/examples/with-goober/pages/_app.tsx
similarity index 53%
rename from examples/with-goober/pages/_app.js
rename to examples/with-goober/pages/_app.tsx
index 1c7e527a9750..09fb2bf00f1b 100644
--- a/examples/with-goober/pages/_app.js
+++ b/examples/with-goober/pages/_app.tsx
@@ -1,12 +1,13 @@
-import React from 'react'
-import { prefix } from 'goober-autoprefixer'
+import { createElement } from 'react'
 import { setup } from 'goober'
+import { prefix } from 'goober/prefixer'
+import type { AppProps } from 'next/app'
 
 // goober's needs to know how to render the `styled` nodes.
 // So to let it know, we run the `setup` function with the
 // `createElement` function and prefixer function.
-setup(React.createElement, prefix)
+setup(createElement, prefix)
 
-export default function App({ Component, pageProps }) {
+export default function App({ Component, pageProps }: AppProps) {
   return <Component {...pageProps} />
 }
diff --git a/examples/with-goober/pages/_document.js b/examples/with-goober/pages/_document.tsx
similarity index 63%
rename from examples/with-goober/pages/_document.js
rename to examples/with-goober/pages/_document.tsx
index c7550d37d991..b3c283a033c7 100644
--- a/examples/with-goober/pages/_document.js
+++ b/examples/with-goober/pages/_document.tsx
@@ -1,10 +1,19 @@
-import Document, { Html, Head, Main, NextScript } from 'next/document'
 import { extractCss } from 'goober'
+import NextDocument, {
+  DocumentContext,
+  Head,
+  Html,
+  Main,
+  NextScript,
+} from 'next/document'
 
-export default class MyDocument extends Document {
-  static async getInitialProps({ renderPage }) {
+type Props = {
+  css: string
+}
+
+class Document extends NextDocument<Props> {
+  static async getInitialProps({ renderPage }: DocumentContext) {
     const page = await renderPage()
-    // Extrach the css for each page render
     const css = extractCss()
     return { ...page, css }
   }
@@ -27,3 +36,5 @@ export default class MyDocument extends Document {
     )
   }
 }
+
+export default Document
diff --git a/examples/with-goober/pages/index.js b/examples/with-goober/pages/index.tsx
similarity index 100%
rename from examples/with-goober/pages/index.js
rename to examples/with-goober/pages/index.tsx
diff --git a/examples/with-goober/tsconfig.json b/examples/with-goober/tsconfig.json
new file mode 100644
index 000000000000..5bee8c4d5710
--- /dev/null
+++ b/examples/with-goober/tsconfig.json
@@ -0,0 +1,30 @@
+{
+  "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",
+    "incremental": true
+  },
+  "include": [
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx"
+  ],
+  "exclude": [
+    "node_modules"
+  ]
+}

From 90550a29fe0c6dcfeacdc27f2a444bf3f992157f Mon Sep 17 00:00:00 2001
From: JJ Kasper <jj@jjsweb.site>
Date: Sun, 21 Aug 2022 17:50:36 -0500
Subject: [PATCH 2/2] lint-fix

---
 examples/with-goober/tsconfig.json | 16 +++-------------
 1 file changed, 3 insertions(+), 13 deletions(-)

diff --git a/examples/with-goober/tsconfig.json b/examples/with-goober/tsconfig.json
index 5bee8c4d5710..b8d597880a1a 100644
--- a/examples/with-goober/tsconfig.json
+++ b/examples/with-goober/tsconfig.json
@@ -1,11 +1,7 @@
 {
   "compilerOptions": {
     "target": "es5",
-    "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
-    ],
+    "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,
     "strict": false,
@@ -19,12 +15,6 @@
     "jsx": "preserve",
     "incremental": true
   },
-  "include": [
-    "next-env.d.ts",
-    "**/*.ts",
-    "**/*.tsx"
-  ],
-  "exclude": [
-    "node_modules"
-  ]
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
+  "exclude": ["node_modules"]
 }