From c7e8e42d73e0453a74659e82dbda951a2f9c2527 Mon Sep 17 00:00:00 2001
From: Benjamin Leonard <hello@benleonard.co.uk>
Date: Thu, 5 Dec 2024 17:41:10 +0000
Subject: [PATCH] TS ESM Tailwind config

---
 package-lock.json                        |  9 +++++----
 package.json                             |  2 +-
 tailwind.config.js => tailwind.config.ts | 22 +++++++++-------------
 3 files changed, 15 insertions(+), 18 deletions(-)
 rename tailwind.config.js => tailwind.config.ts (84%)

diff --git a/package-lock.json b/package-lock.json
index 617fee5ee..48eb63546 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,7 +12,7 @@
       "dependencies": {
         "@floating-ui/react": "^0.26.23",
         "@headlessui/react": "^2.1.8",
-        "@oxide/design-system": "^1.7.2",
+        "@oxide/design-system": "^1.7.3--canary.ccb9825.0",
         "@radix-ui/react-accordion": "^1.2.0",
         "@radix-ui/react-dialog": "^1.0.5",
         "@radix-ui/react-focus-guards": "1.0.1",
@@ -1725,9 +1725,10 @@
       "license": "MIT"
     },
     "node_modules/@oxide/design-system": {
-      "version": "1.7.2",
-      "resolved": "https://registry.npmjs.org/@oxide/design-system/-/design-system-1.7.2.tgz",
-      "integrity": "sha512-irP+7mcZ0Mx0SQ50NcnVbdUQqqOYcqArmWGbYzEas0JnQz7hr0LSm7oUpnyDhJO3GwtUV3n2XUjmCjLgeWR1xA==",
+      "version": "1.7.3--canary.ccb9825.0",
+      "resolved": "https://registry.npmjs.org/@oxide/design-system/-/design-system-1.7.3--canary.ccb9825.0.tgz",
+      "integrity": "sha512-M+fTF0RjydkJQM9AiMhWDoE7dRWDGlvkgj28ZhkawXAepsQcOMLPrW9W5VGTtogIzSDwqIVFzDiXeYdh51DsoA==",
+      "license": "MPL 2.0",
       "dependencies": {
         "@floating-ui/react": "^0.25.1",
         "@headlessui/react": "^1.7.17",
diff --git a/package.json b/package.json
index 28614f383..cd5168600 100644
--- a/package.json
+++ b/package.json
@@ -34,7 +34,7 @@
   "dependencies": {
     "@floating-ui/react": "^0.26.23",
     "@headlessui/react": "^2.1.8",
-    "@oxide/design-system": "^1.7.2",
+    "@oxide/design-system": "^1.7.3--canary.ccb9825.0",
     "@radix-ui/react-accordion": "^1.2.0",
     "@radix-ui/react-dialog": "^1.0.5",
     "@radix-ui/react-focus-guards": "1.0.1",
diff --git a/tailwind.config.js b/tailwind.config.ts
similarity index 84%
rename from tailwind.config.js
rename to tailwind.config.ts
index 634586b46..b5a9bcf8c 100644
--- a/tailwind.config.js
+++ b/tailwind.config.ts
@@ -6,19 +6,16 @@
  * Copyright Oxide Computer Company
  */
 
-// @ts-check
+import { type Config } from 'tailwindcss'
+import plugin from 'tailwindcss/plugin'
 
-/** @type {import('tailwindcss/lib/util/createPlugin').default} */
-// @ts-expect-error
-const plugin = require('tailwindcss/plugin')
-const {
-  textUtilities,
-  colorUtilities,
+import {
   borderRadiusTokens,
+  colorUtilities,
   elevationUtilities,
-} = require('@oxide/design-system/styles/dist/tailwind-tokens.js')
+  textUtilities,
+} from '@oxide/design-system/styles/dist/tailwind-tokens.ts'
 
-/** @type {import('tailwindcss/tailwind-config').TailwindConfig} */
 module.exports = {
   corePlugins: {
     fontFamily: false,
@@ -57,7 +54,7 @@ module.exports = {
       },
     },
     borderRadius: {
-      none: 0,
+      none: '0',
       ...borderRadiusTokens,
     },
     colors: {
@@ -66,7 +63,7 @@ module.exports = {
     },
   },
   plugins: [
-    plugin(({ addVariant, addUtilities, variants }) => {
+    plugin(({ addVariant, addUtilities }) => {
       addVariant('children', '& > *')
       addVariant('selected', '.is-selected &')
       addVariant('disabled', ['&.visually-disabled', '&:disabled'])
@@ -78,11 +75,10 @@ module.exports = {
             },
           }))
           .reduce((p, c) => ({ ...p, ...c }), {}),
-        variants
       )
       addUtilities(textUtilities)
       addUtilities(colorUtilities)
       addUtilities(elevationUtilities)
     }),
   ],
-}
+} satisfies Config