From c65b87ee687d54b159b29b23b81516c194c12bdc Mon Sep 17 00:00:00 2001
From: Robin Malfait <malfait.robin@gmail.com>
Date: Mon, 31 Jan 2022 00:10:06 +0100
Subject: [PATCH 1/4] improve build files

Based on: https://nodejs.org/api/packages.html#conditional-exports
---
 packages/@headlessui-react/build/index.cjs |  7 +++++++
 packages/@headlessui-react/build/index.js  |  7 -------
 packages/@headlessui-react/package.json    | 13 +++++--------
 packages/@headlessui-vue/build/index.cjs   |  7 +++++++
 packages/@headlessui-vue/build/index.js    |  7 -------
 packages/@headlessui-vue/package.json      | 13 +++++--------
 scripts/build.sh                           |  7 +++----
 7 files changed, 27 insertions(+), 34 deletions(-)
 create mode 100644 packages/@headlessui-react/build/index.cjs
 delete mode 100644 packages/@headlessui-react/build/index.js
 create mode 100644 packages/@headlessui-vue/build/index.cjs
 delete mode 100644 packages/@headlessui-vue/build/index.js

diff --git a/packages/@headlessui-react/build/index.cjs b/packages/@headlessui-react/build/index.cjs
new file mode 100644
index 0000000000..92466f4507
--- /dev/null
+++ b/packages/@headlessui-react/build/index.cjs
@@ -0,0 +1,7 @@
+'use strict'
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./headlessui.prod.cjs')
+} else {
+  module.exports = require('./headlessui.dev.cjs')
+}
diff --git a/packages/@headlessui-react/build/index.js b/packages/@headlessui-react/build/index.js
deleted file mode 100644
index 473f46702e..0000000000
--- a/packages/@headlessui-react/build/index.js
+++ /dev/null
@@ -1,7 +0,0 @@
-'use strict'
-
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./headlessui.prod.cjs.js')
-} else {
-  module.exports = require('./headlessui.dev.cjs.js')
-}
diff --git a/packages/@headlessui-react/package.json b/packages/@headlessui-react/package.json
index 63d805cfe5..ec2c90fc99 100644
--- a/packages/@headlessui-react/package.json
+++ b/packages/@headlessui-react/package.json
@@ -2,7 +2,7 @@
   "name": "@headlessui/react",
   "version": "1.4.3",
   "description": "A set of completely unstyled, fully accessible UI components for React, designed to integrate beautifully with Tailwind CSS.",
-  "main": "dist/index.js",
+  "main": "dist/index.cjs",
   "typings": "dist/index.d.ts",
   "module": "dist/headlessui.esm.js",
   "license": "MIT",
@@ -11,14 +11,11 @@
     "dist"
   ],
   "exports": {
-    ".": {
-      "import": {
-        "default": "./dist/headlessui.esm.js"
-      },
-      "require": "./dist/index.js",
-      "types": "./dist/index.d.ts"
-    }
+    "import": "./dist/headlessui.esm.js",
+    "require": "./dist/index.cjs",
+    "types": "./dist/index.d.ts"
   },
+  "type": "module",
   "sideEffects": false,
   "engines": {
     "node": ">=10"
diff --git a/packages/@headlessui-vue/build/index.cjs b/packages/@headlessui-vue/build/index.cjs
new file mode 100644
index 0000000000..92466f4507
--- /dev/null
+++ b/packages/@headlessui-vue/build/index.cjs
@@ -0,0 +1,7 @@
+'use strict'
+
+if (process.env.NODE_ENV === 'production') {
+  module.exports = require('./headlessui.prod.cjs')
+} else {
+  module.exports = require('./headlessui.dev.cjs')
+}
diff --git a/packages/@headlessui-vue/build/index.js b/packages/@headlessui-vue/build/index.js
deleted file mode 100644
index 473f46702e..0000000000
--- a/packages/@headlessui-vue/build/index.js
+++ /dev/null
@@ -1,7 +0,0 @@
-'use strict'
-
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./headlessui.prod.cjs.js')
-} else {
-  module.exports = require('./headlessui.dev.cjs.js')
-}
diff --git a/packages/@headlessui-vue/package.json b/packages/@headlessui-vue/package.json
index 6d26c210d9..bd83d12ba9 100644
--- a/packages/@headlessui-vue/package.json
+++ b/packages/@headlessui-vue/package.json
@@ -2,7 +2,7 @@
   "name": "@headlessui/vue",
   "version": "1.4.3",
   "description": "A set of completely unstyled, fully accessible UI components for Vue 3, designed to integrate beautifully with Tailwind CSS.",
-  "main": "dist/index.js",
+  "main": "dist/index.cjs",
   "typings": "dist/index.d.ts",
   "module": "dist/headlessui.esm.js",
   "license": "MIT",
@@ -11,14 +11,11 @@
     "dist"
   ],
   "exports": {
-    ".": {
-      "import": {
-        "default": "./dist/headlessui.esm.js"
-      },
-      "require": "./dist/index.js",
-      "types": "./dist/index.d.ts"
-    }
+    "import": "./dist/headlessui.esm.js",
+    "require": "./dist/index.cjs",
+    "types": "./dist/index.d.ts"
   },
+  "type": "module",
   "sideEffects": false,
   "engines": {
     "node": ">=10"
diff --git a/scripts/build.sh b/scripts/build.sh
index 76c8b88e70..860a8c0298 100755
--- a/scripts/build.sh
+++ b/scripts/build.sh
@@ -17,10 +17,9 @@ sharedOptions+=("--platform=browser")
 sharedOptions+=("--target=es2020")
 
 # Generate actual builds
-NODE_ENV=production  $esbuild $input --format=esm  --outfile=$outdir/$name.esm.js      --minify ${sharedOptions[@]} $@ &
-NODE_ENV=production  $esbuild $input --format=cjs  --outfile=$outdir/$name.prod.cjs.js --minify ${sharedOptions[@]} $@ &
-NODE_ENV=production  $esbuild $input --format=iife --outfile=$outdir/$name.iife.js     --minify ${sharedOptions[@]} $@ &
-NODE_ENV=development $esbuild $input --format=cjs  --outfile=$outdir/$name.dev.cjs.js           ${sharedOptions[@]} $@ &
+NODE_ENV=production  $esbuild $input --format=esm  --outfile=$outdir/$name.esm.js    --minify ${sharedOptions[@]} $@ &
+NODE_ENV=production  $esbuild $input --format=cjs  --outfile=$outdir/$name.prod.cjs  --minify ${sharedOptions[@]} $@ &
+NODE_ENV=development $esbuild $input --format=cjs  --outfile=$outdir/$name.dev.cjs            ${sharedOptions[@]} $@ &
 
 # Generate types
 tsc --emitDeclarationOnly --outDir $outdir &

From 39751cda4bee94b6fc6d9ed2073b505791a45b61 Mon Sep 17 00:00:00 2001
From: Robin Malfait <malfait.robin@gmail.com>
Date: Mon, 31 Jan 2022 12:17:02 +0100
Subject: [PATCH 2/4] update changelog

---
 CHANGELOG.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index e02468b748..e8414b8ad0 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -13,6 +13,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Improve controlled Tabs behaviour ([#1050](https://github.com/tailwindlabs/headlessui/pull/1050))
 - Improve typeahead search logic ([#1051](https://github.com/tailwindlabs/headlessui/pull/1051))
 - Improve overal codebase, use modern tech like `esbuild` and TypeScript 4! ([#1055](https://github.com/tailwindlabs/headlessui/pull/1055))
+- Improve build files ([#1078](https://github.com/tailwindlabs/headlessui/pull/1078))
 
 ### Added
 
@@ -25,6 +26,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Ensure correct order when conditionally rendering `MenuItem`, `ListboxOption` and `RadioGroupOption` ([#1045](https://github.com/tailwindlabs/headlessui/pull/1045))
 - Improve typeahead search logic ([#1051](https://github.com/tailwindlabs/headlessui/pull/1051))
 - Improve overal codebase, use modern tech like `esbuild` and TypeScript 4! ([#1055](https://github.com/tailwindlabs/headlessui/pull/1055))
+- Improve build files ([#1078](https://github.com/tailwindlabs/headlessui/pull/1078))
 
 ### Added
 

From 6174c47291765038bccba36df08eacb7c6693e82 Mon Sep 17 00:00:00 2001
From: Robin Malfait <malfait.robin@gmail.com>
Date: Mon, 31 Jan 2022 12:29:27 +0100
Subject: [PATCH 3/4] convert .js to .cjs

---
 jest.config.cjs                                                | 3 +++
 jest.config.js                                                 | 3 ---
 jest/{create-jest-config.js => create-jest-config.cjs}         | 0
 packages/@headlessui-react/{jest.config.js => jest.config.cjs} | 3 +--
 packages/@headlessui-vue/{jest.config.js => jest.config.cjs}   | 3 +--
 5 files changed, 5 insertions(+), 7 deletions(-)
 create mode 100644 jest.config.cjs
 delete mode 100644 jest.config.js
 rename jest/{create-jest-config.js => create-jest-config.cjs} (100%)
 rename packages/@headlessui-react/{jest.config.js => jest.config.cjs} (50%)
 rename packages/@headlessui-vue/{jest.config.js => jest.config.cjs} (50%)

diff --git a/jest.config.cjs b/jest.config.cjs
new file mode 100644
index 0000000000..8333297a4b
--- /dev/null
+++ b/jest.config.cjs
@@ -0,0 +1,3 @@
+module.exports = {
+  projects: ['<rootDir>/packages/*/jest.config.cjs'],
+}
diff --git a/jest.config.js b/jest.config.js
deleted file mode 100644
index 1acc73533d..0000000000
--- a/jest.config.js
+++ /dev/null
@@ -1,3 +0,0 @@
-module.exports = {
-  projects: ['<rootDir>/packages/*/jest.config.js'],
-}
diff --git a/jest/create-jest-config.js b/jest/create-jest-config.cjs
similarity index 100%
rename from jest/create-jest-config.js
rename to jest/create-jest-config.cjs
diff --git a/packages/@headlessui-react/jest.config.js b/packages/@headlessui-react/jest.config.cjs
similarity index 50%
rename from packages/@headlessui-react/jest.config.js
rename to packages/@headlessui-react/jest.config.cjs
index 95fe4bfa1a..8dc6875268 100644
--- a/packages/@headlessui-react/jest.config.js
+++ b/packages/@headlessui-react/jest.config.cjs
@@ -1,3 +1,2 @@
-const create = require('../../jest/create-jest-config.js')
-
+let create = require('../../jest/create-jest-config.cjs')
 module.exports = create(__dirname, { displayName: 'React' })
diff --git a/packages/@headlessui-vue/jest.config.js b/packages/@headlessui-vue/jest.config.cjs
similarity index 50%
rename from packages/@headlessui-vue/jest.config.js
rename to packages/@headlessui-vue/jest.config.cjs
index 4596442e75..7dcc0d44a3 100644
--- a/packages/@headlessui-vue/jest.config.js
+++ b/packages/@headlessui-vue/jest.config.cjs
@@ -1,3 +1,2 @@
-const create = require('../../jest/create-jest-config.js')
-
+let create = require('../../jest/create-jest-config.cjs')
 module.exports = create(__dirname, { displayName: ' Vue ' })

From 47756e2f5ac5e76275dbadfd05db3e96ca6455a7 Mon Sep 17 00:00:00 2001
From: Robin Malfait <malfait.robin@gmail.com>
Date: Mon, 31 Jan 2022 12:40:19 +0100
Subject: [PATCH 4/4] make vue & react playground pages similar
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

A bit out of scope for this issue, but bothered me while testing around
🙃
---
 packages/playground-vue/src/components/Home.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/playground-vue/src/components/Home.vue b/packages/playground-vue/src/components/Home.vue
index cde352323d..3d2f30493e 100644
--- a/packages/playground-vue/src/components/Home.vue
+++ b/packages/playground-vue/src/components/Home.vue
@@ -1,6 +1,6 @@
 <template>
-  <div class="container my-24">
-    <div class="prose mx-auto">
+  <div class="container mx-auto my-24">
+    <div class="prose">
       <h2>Examples</h2>
       <Examples :examples="examples" />
     </div>