From f300517bb24a1aae21c0b66f4129032d57da3ed7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mateusz=20Burzy=C5=84ski?= <mateuszburzynski@gmail.com>
Date: Mon, 2 Dec 2024 12:40:44 +0100
Subject: [PATCH 1/3] Convert `@emotion/css-prettifier`'s source code to
 TypeScript

---
 .changeset/young-ears-give.md            |  5 ++
 packages/css-prettifier/package.json     |  8 +--
 packages/css-prettifier/src/index.d.ts   |  2 -
 packages/css-prettifier/src/index.js     | 50 -------------------
 packages/css-prettifier/src/index.tsx    | 62 ++++++++++++++++++++++++
 packages/css-prettifier/types/index.d.ts |  1 -
 yarn.lock                                |  8 +++
 7 files changed, 80 insertions(+), 56 deletions(-)
 create mode 100644 .changeset/young-ears-give.md
 delete mode 100644 packages/css-prettifier/src/index.d.ts
 delete mode 100644 packages/css-prettifier/src/index.js
 create mode 100644 packages/css-prettifier/src/index.tsx
 delete mode 100644 packages/css-prettifier/types/index.d.ts

diff --git a/.changeset/young-ears-give.md b/.changeset/young-ears-give.md
new file mode 100644
index 0000000000..36103e7b95
--- /dev/null
+++ b/.changeset/young-ears-give.md
@@ -0,0 +1,5 @@
+---
+'@emotion/css-prettifier': minor
+---
+
+Source code has been migrated to TypeScript. From now on type declarations will be emitted based on that, instead of being hand-written.
diff --git a/packages/css-prettifier/package.json b/packages/css-prettifier/package.json
index c025d598b7..d50599207d 100644
--- a/packages/css-prettifier/package.json
+++ b/packages/css-prettifier/package.json
@@ -8,6 +8,7 @@
   "author": "Mateusz Burzyński <mateuszburzynski@gmail.com> (https://github.com/Andarist)",
   "main": "dist/emotion-css-prettifier.cjs.js",
   "module": "dist/emotion-css-prettifier.esm.js",
+  "types": "dist/emotion-css-prettifier.cjs.d.ts",
   "exports": {
     ".": {
       "types": {
@@ -20,19 +21,20 @@
     },
     "./package.json": "./package.json"
   },
-  "types": "types/index.d.ts",
   "license": "MIT",
   "repository": "https://github.com/emotion-js/emotion/tree/main/packages/css-prettifier",
   "dependencies": {
     "@emotion/memoize": "^0.9.0",
     "stylis": "4.2.0"
   },
+  "devDependencies": {
+    "@types/stylis": "^4.2.6"
+  },
   "publishConfig": {
     "access": "public"
   },
   "files": [
     "src",
-    "dist",
-    "types/*.d.ts"
+    "dist"
   ]
 }
diff --git a/packages/css-prettifier/src/index.d.ts b/packages/css-prettifier/src/index.d.ts
deleted file mode 100644
index 9e46093759..0000000000
--- a/packages/css-prettifier/src/index.d.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export * from '../types'
-export { default } from '../types'
diff --git a/packages/css-prettifier/src/index.js b/packages/css-prettifier/src/index.js
deleted file mode 100644
index efdbb5b7d5..0000000000
--- a/packages/css-prettifier/src/index.js
+++ /dev/null
@@ -1,50 +0,0 @@
-import memoize from '@emotion/memoize'
-import { compile, serialize, combine, tokenize } from 'stylis'
-
-// adjusted https://github.com/thysultan/stylis.js/blob/68b9043427c177b95a0fd6a2a13f5b636bf80236/src/Serializer.js#L26-L34
-const prettyStringify = memoize(
-  indentation => (element, index, children, callback) => {
-    switch (element.type) {
-      case '@import':
-        return (element.return = element.return || element.value) + '\n\n'
-      case 'decl':
-        return (element.return =
-          element.return || `${element.props}: ${element.children};\n`)
-      case 'comm':
-        return ''
-      case '@media':
-      case '@supports':
-        element.value = combine(
-          tokenize(element.value),
-          (value, index, children) => {
-            // (
-            if (value.charCodeAt(0) === 40 && children[index - 1] !== ' ') {
-              return ' ' + value
-            }
-            return value
-          }
-        )
-        break
-      case 'rule':
-        element.value = element.props.join(
-          element.root &&
-            (element.root.type === '@keyframes' ||
-              element.root.type === '@-webkit-keyframes')
-            ? ', '
-            : ',\n'
-        )
-    }
-
-    return (children = serialize(element.children, callback)).length
-      ? (element.return =
-          element.value +
-          ' {\n' +
-          children.trim().replace(/^/gm, indentation).replace(/^\s+$/gm, '') +
-          '\n}\n\n')
-      : ''
-  }
-)
-
-export default function prettify(styles, indentation = '  ') {
-  return serialize(compile(styles), prettyStringify(indentation)).trim()
-}
diff --git a/packages/css-prettifier/src/index.tsx b/packages/css-prettifier/src/index.tsx
new file mode 100644
index 0000000000..6fae8a5ba3
--- /dev/null
+++ b/packages/css-prettifier/src/index.tsx
@@ -0,0 +1,62 @@
+import memoize from '@emotion/memoize'
+import {
+  compile,
+  serialize,
+  combine,
+  tokenize,
+  type Middleware,
+  type Element
+} from 'stylis'
+
+// adjusted https://github.com/thysultan/stylis.js/blob/68b9043427c177b95a0fd6a2a13f5b636bf80236/src/Serializer.js#L26-L34
+const prettyStringify = memoize(
+  (indentation): Middleware =>
+    (element, index, children, callback) => {
+      switch (element.type) {
+        case '@import':
+          return (element.return = element.return || element.value) + '\n\n'
+        case 'decl':
+          return (element.return =
+            element.return || `${element.props}: ${element.children};\n`)
+        case 'comm':
+          return ''
+        case '@media':
+        case '@supports':
+          element.value = combine(
+            tokenize(element.value),
+            (value, index, children) => {
+              // (
+              if (value.charCodeAt(0) === 40 && children[index - 1] !== ' ') {
+                return ' ' + value
+              }
+              return value
+            }
+          )
+          break
+        case 'rule':
+          element.value = (element.props as string[]).join(
+            element.root &&
+              (element.root.type === '@keyframes' ||
+                element.root.type === '@-webkit-keyframes')
+              ? ', '
+              : ',\n'
+          )
+      }
+
+      const serialized = serialize(element.children as Element[], callback)
+      return serialized.length
+        ? (element.return =
+            element.value +
+            ' {\n' +
+            serialized
+              .trim()
+              .replace(/^/gm, indentation)
+              .replace(/^\s+$/gm, '') +
+            '\n}\n\n')
+        : ''
+    }
+)
+
+export default function prettify(styles: string, indentation = '  ') {
+  return serialize(compile(styles), prettyStringify(indentation)).trim()
+}
diff --git a/packages/css-prettifier/types/index.d.ts b/packages/css-prettifier/types/index.d.ts
deleted file mode 100644
index ea8733a22e..0000000000
--- a/packages/css-prettifier/types/index.d.ts
+++ /dev/null
@@ -1 +0,0 @@
-export default function prettify(styles: string, indentation?: string): string
diff --git a/yarn.lock b/yarn.lock
index e21f960d52..fbc6e78ca8 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2724,6 +2724,7 @@ __metadata:
   resolution: "@emotion/css-prettifier@workspace:packages/css-prettifier"
   dependencies:
     "@emotion/memoize": ^0.9.0
+    "@types/stylis": ^4.2.6
     stylis: 4.2.0
   languageName: unknown
   linkType: soft
@@ -6467,6 +6468,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/stylis@npm:^4.2.6":
+  version: 4.2.6
+  resolution: "@types/stylis@npm:4.2.6"
+  checksum: 3a1685f2b465eb943805252b5b2934fc8054fe8706f76e3e28544f69532296f42c042d0b402fadc486ef8e86cc3d8a2c66d2345241e0af8e07974dd36d85a79c
+  languageName: node
+  linkType: hard
+
 "@types/tapable@npm:^1, @types/tapable@npm:^1.0.5":
   version: 1.0.8
   resolution: "@types/tapable@npm:1.0.8"

From 2058cb4ed08ea713cd78d8cbfc8f0788537c0769 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mateusz=20Burzy=C5=84ski?= <mateuszburzynski@gmail.com>
Date: Mon, 2 Dec 2024 13:38:19 +0100
Subject: [PATCH 2/3] use .ts

---
 packages/css-prettifier/src/{index.tsx => index.ts} | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename packages/css-prettifier/src/{index.tsx => index.ts} (100%)

diff --git a/packages/css-prettifier/src/index.tsx b/packages/css-prettifier/src/index.ts
similarity index 100%
rename from packages/css-prettifier/src/index.tsx
rename to packages/css-prettifier/src/index.ts

From f090b114fe9c2e4607d757f5a4d1af97f29e915a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mateusz=20Burzy=C5=84ski?= <mateuszburzynski@gmail.com>
Date: Tue, 3 Dec 2024 09:31:11 +0100
Subject: [PATCH 3/3] fixed changeset content

---
 .changeset/grumpy-suits-cough.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.changeset/grumpy-suits-cough.md b/.changeset/grumpy-suits-cough.md
index 119ac0e925..fb59e8c155 100644
--- a/.changeset/grumpy-suits-cough.md
+++ b/.changeset/grumpy-suits-cough.md
@@ -2,4 +2,4 @@
 '@emotion/use-insertion-effect-with-fallbacks': minor
 ---
 
-Source code has been migrated to TypeScript. From now on type declarations will be emitted based on that, instead of being hand-written.
+Source code has been migrated to TypeScript.