Ust postcss instance provided to plugin

If we import `postcss` there’s a chance that our code is using a different version than the one the plugin was provided to. This can cause checks like `instanceof` in external tools to fail.

Author: thecrypticace

packages/@tailwindcss-postcss/src/ast.ts

@@ -1,7 +1,8 @@
-import postcss, {
-  Input,
+import {
+  type Postcss,
   type ChildNode as PostCssChildNode,
   type Container as PostCssContainerNode,
+  type Input as PostCssInput,
   type Root as PostCssRoot,
   type Source as PostcssSource,
 } from 'postcss'
@@ -12,9 +13,13 @@ import { DefaultMap } from '../../tailwindcss/src/utils/default-map'
 
 const EXCLAMATION_MARK = 0x21
 
-export function cssAstToPostCssAst(ast: AstNode[], source: PostcssSource | undefined): PostCssRoot {
-  let inputMap = new DefaultMap<Source, Input>((src) => {
-    return new Input(src.code, {
+export function cssAstToPostCssAst(
+  ast: AstNode[],
+  source: PostcssSource | undefined,
+  postcss: Postcss,
+): PostCssRoot {
+  let inputMap = new DefaultMap<Source, PostCssInput>((src) => {
+    return new postcss.Input(src.code, {
       map: source?.input.map,
       from: src.file ?? undefined,
     })
@@ -126,7 +131,7 @@ export function cssAstToPostCssAst(ast: AstNode[], source: PostcssSource | undef
 }
 
 export function postCssAstToCssAst(root: PostCssRoot): AstNode[] {
-  let inputMap = new DefaultMap<Input, Source>((input) => ({
+  let inputMap = new DefaultMap<PostCssInput, Source>((input) => ({
     file: input.file ?? input.id ?? null,
     code: input.css,
   }))

packages/@tailwindcss-postcss/src/index.ts

@@ -11,7 +11,7 @@ import { clearRequireCache } from '@tailwindcss/node/require-cache'
 import { Scanner } from '@tailwindcss/oxide'
 import fs from 'node:fs'
 import path, { relative } from 'node:path'
-import postcss, { type AcceptedPlugin, type PluginCreator } from 'postcss'
+import type { AcceptedPlugin, PluginCreator, Postcss, Root } from 'postcss'
 import { toCss, type AstNode } from '../../tailwindcss/src/ast'
 import { cssAstToPostCssAst, postCssAstToCssAst } from './ast'
 import fixRelativePathsPlugin from './postcss-fix-relative-paths'
@@ -23,13 +23,13 @@ interface CacheEntry {
   compiler: null | ReturnType<typeof compileAst>
   scanner: null | Scanner
   tailwindCssAst: AstNode[]
-  cachedPostCssAst: postcss.Root
-  optimizedPostCssAst: postcss.Root
+  cachedPostCssAst: Root
+  optimizedPostCssAst: Root
   fullRebuildPaths: string[]
 }
 const cache = new QuickLRU<string, CacheEntry>({ maxSize: 50 })
 
-function getContextFromCache(inputFile: string, opts: PluginOptions): CacheEntry {
+function getContextFromCache(inputFile: string, opts: PluginOptions, postcss: Postcss): CacheEntry {
   let key = `${inputFile}:${opts.base ?? ''}:${JSON.stringify(opts.optimize)}`
   if (cache.has(key)) return cache.get(key)!
   let entry = {
@@ -69,7 +69,7 @@ function tailwindcss(opts: PluginOptions = {}): AcceptedPlugin {
 
       {
         postcssPlugin: 'tailwindcss',
-        async Once(root, { result }) {
+        async Once(root, { result, postcss }) {
           using I = new Instrumentation()
 
           let inputFile = result.opts.from ?? ''
@@ -100,7 +100,7 @@ function tailwindcss(opts: PluginOptions = {}): AcceptedPlugin {
             DEBUG && I.end('Quick bail check')
           }
 
-          let context = getContextFromCache(inputFile, opts)
+          let context = getContextFromCache(inputFile, opts, postcss)
           let inputBasePath = path.dirname(path.resolve(inputFile))
 
           // Whether this is the first build or not, if it is, then we can
@@ -296,7 +296,7 @@ function tailwindcss(opts: PluginOptions = {}): AcceptedPlugin {
               } else {
                 // Convert our AST to a PostCSS AST
                 DEBUG && I.start('Transform Tailwind CSS AST into PostCSS AST')
-                context.cachedPostCssAst = cssAstToPostCssAst(tailwindCssAst, root.source)
+                context.cachedPostCssAst = cssAstToPostCssAst(tailwindCssAst, root.source, postcss)
                 DEBUG && I.end('Transform Tailwind CSS AST into PostCSS AST')
               }
             }