{"_id":"@accelint/postcss-tailwind-css-modules","_rev":"7-d778a844cb6dca71f12127168d393f98","name":"@accelint/postcss-tailwind-css-modules","dist-tags":{"latest":"1.1.0"},"versions":{"1.0.0":{"name":"@accelint/postcss-tailwind-css-modules","version":"1.0.0","keywords":["dev-tk","tooling"],"author":{"name":"https://hypergiant.com"},"license":"Apache-2.0","_id":"@accelint/postcss-tailwind-css-modules@1.0.0","maintainers":[{"name":"ray.knight-hypergiant","email":"ray.knight@hypergiant.com"},{"name":"hg-devsecops","email":"hg-devsecops@hypergiant.com"},{"name":"brandonjpierce","email":"brandonpierce91@gmail.com"},{"name":"bryan_hg","email":"bryan.kizer@hypergiant.com"},{"name":"isaac.kehle-hypergiant","email":"isaac.kehle@hypergiant.com"}],"homepage":"https://github.com/gohypergiant/standard-toolkit#readme","bugs":{"url":"https://github.com/gohypergiant/standard-toolkit/issues"},"dist":{"shasum":"0a3033123024d4a40ccb7fd13b68bae61afda9c5","tarball":"https://registry.npmjs.org/@accelint/postcss-tailwind-css-modules/-/postcss-tailwind-css-modules-1.0.0.tgz","fileCount":14,"integrity":"sha512-P/9cfKLeZXlkZkqMgjAbcp0hZYzlDBQAEhwLP6JueHQFEkmrqBfJ/7dqn9sXX9XD7KfoduxgHyYq8IAjsr7ovw==","signatures":[{"sig":"MEQCIHVEZ6Co+Yz42rgUIA+bFXUusFoc58pqqz/6ZJht3AInAiAvR4nBcVsTWhoSNgQ9TkJ7k4m6VmAARyDdedNtKQJBsw==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":22478},"main":"./dist/index.cjs","type":"module","_from":"file:accelint-postcss-tailwind-css-modules-1.0.0.tgz","owner":"default/pathfinder","title":"Postcss tailwind css modules plugin","types":"./dist/index.d.ts","module":"./dist/index.js","$schema":"https://json.schemastore.org/package","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"}},"private":false,"scripts":{"lint":"pnpm biome lint","build":"tsup","constellation-tracker":"node ../constellation-tracker/dist/main.js"},"subPath":"tooling/postcss-tailwind-css-modules","_npmUser":{"name":"brandonjpierce","email":"brandonpierce91@gmail.com"},"_resolved":"/tmp/7333a04bd41a001d9d3e5e2467ceaea3/accelint-postcss-tailwind-css-modules-1.0.0.tgz","_integrity":"sha512-P/9cfKLeZXlkZkqMgjAbcp0hZYzlDBQAEhwLP6JueHQFEkmrqBfJ/7dqn9sXX9XD7KfoduxgHyYq8IAjsr7ovw==","repository":{"url":"git+https://github.com/gohypergiant/standard-toolkit.git","type":"git"},"_npmVersion":"10.9.4","description":"Postcss plugin for resolving some problems that occur when using tailwind with css modules","directories":{},"sideEffects":false,"_nodeVersion":"22.21.1","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsup":"8.5.0","postcss":"^8.5.6","@types/node":"^24.9.0","postcss-selector-parser":"^7.1.1","@accelint/typescript-config":"0.1.4"},"peerDependencies":{"postcss":"^8.5.6","postcss-selector-parser":"^7.1.1"},"optionalDependencies":{"@tailwindcss/postcss":"^4.1.17"},"_npmOperationalInternal":{"tmp":"tmp/postcss-tailwind-css-modules_1.0.0_1765407681777_0.3522304556481115","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@accelint/postcss-tailwind-css-modules","version":"1.0.1","keywords":["dev-tk","tooling"],"author":{"name":"https://hypergiant.com"},"license":"Apache-2.0","_id":"@accelint/postcss-tailwind-css-modules@1.0.1","maintainers":[{"name":"ray.knight-hypergiant","email":"ray.knight@hypergiant.com"},{"name":"hg-devsecops","email":"hg-devsecops@hypergiant.com"},{"name":"brandonjpierce","email":"brandonpierce91@gmail.com"},{"name":"bryan_hg","email":"bryan.kizer@hypergiant.com"},{"name":"isaac.kehle-hypergiant","email":"isaac.kehle@hypergiant.com"}],"homepage":"https://github.com/gohypergiant/standard-toolkit#readme","bugs":{"url":"https://github.com/gohypergiant/standard-toolkit/issues"},"dist":{"shasum":"451b45f399bb189dd1d2157a3c103582ce2d678e","tarball":"https://registry.npmjs.org/@accelint/postcss-tailwind-css-modules/-/postcss-tailwind-css-modules-1.0.1.tgz","fileCount":16,"integrity":"sha512-8bm8JppD2mrcgNtbmnxN8vkle2LnohhL0RbEEbYilNIkksP/7En7U/gcLMatqwp0/ZLtgRkhaA0b0CVKJIE+tg==","signatures":[{"sig":"MEUCIQCQOPQMc4qzq04tj+3NDxj89sgu9iMskcrW/x2/tu1g5AIgedwuHEB6XG1kEo6Ei3VyB2R10ZBPRBRunkoL3STuWqo=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":34343},"main":"./dist/index.cjs","type":"module","_from":"file:accelint-postcss-tailwind-css-modules-1.0.1.tgz","owner":"default/pathfinder","title":"Postcss tailwind css modules plugin","types":"./dist/index.d.cts","module":"./dist/index.js","$schema":"https://json.schemastore.org/package","engines":{"node":">=22","pnpm":">=10"},"exports":{".":{"import":"./dist/index.js","require":"./dist/index.cjs"},"./package.json":"./package.json"},"private":false,"scripts":{"lint":"pnpm biome lint . --verbose","build":"pnpm tsdown","format":"pnpm biome format . --write --verbose","license":"pnpm zx ../../scripts/license.mjs","format:check":"pnpm biome format . --verbose","constellation-tracker":"pnpm exec constellation-tracker"},"subPath":"packages/postcss-tailwind-css-modules","_npmUser":{"name":"brandonjpierce","email":"brandonpierce91@gmail.com"},"_resolved":"/tmp/309b5f58ef7fd195eb03a55769fa5d98/accelint-postcss-tailwind-css-modules-1.0.1.tgz","_integrity":"sha512-8bm8JppD2mrcgNtbmnxN8vkle2LnohhL0RbEEbYilNIkksP/7En7U/gcLMatqwp0/ZLtgRkhaA0b0CVKJIE+tg==","repository":{"url":"git+https://github.com/gohypergiant/standard-toolkit.git","type":"git"},"_npmVersion":"11.6.2","description":"Postcss plugin for resolving some problems that occur when using tailwind with css modules","directories":{},"sideEffects":false,"_nodeVersion":"24.12.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"tsdown":"^0.18.0","postcss":"^8.5.6","@types/node":"^22","postcss-selector-parser":"^7.1.1","@accelint/typescript-config":"0.1.4"},"peerDependencies":{"postcss":"^8.5.6","postcss-selector-parser":"^7.1.1"},"optionalDependencies":{"@tailwindcss/postcss":"^4.1.17"},"_npmOperationalInternal":{"tmp":"tmp/postcss-tailwind-css-modules_1.0.1_1766092881449_0.988323507957088","host":"s3://npm-registry-packages-npm-production"}},"1.1.0":{"name":"@accelint/postcss-tailwind-css-modules","description":"Postcss plugin for resolving some problems that occur when using tailwind with css modules","version":"1.1.0","author":{"name":"https://hypergiant.com"},"$schema":"https://json.schemastore.org/package","devDependencies":{"@types/node":"^22","postcss":"^8.5.6","postcss-selector-parser":"^7.1.1","tsdown":"^0.18.0","vitest":"^4.0.15","@accelint/typescript-config":"0.1.4","@accelint/vitest-config":"0.1.6"},"engines":{"node":">=22","pnpm":">=10"},"exports":{".":{"import":"./dist/index.js","require":"./dist/index.cjs"},"./package.json":"./package.json"},"keywords":["dev-tk","tooling"],"license":"Apache-2.0","main":"./dist/index.cjs","module":"./dist/index.js","optionalDependencies":{"@tailwindcss/postcss":"^4.1.17"},"owner":"default/pathfinder","peerDependencies":{"postcss":"^8.5.6","postcss-selector-parser":"^7.1.1"},"private":false,"publishConfig":{"access":"public"},"repository":{"type":"git","url":"git+https://github.com/gohypergiant/standard-toolkit.git"},"sideEffects":false,"subPath":"packages/postcss-tailwind-css-modules","title":"Postcss tailwind css modules plugin","type":"module","types":"./dist/index.d.cts","scripts":{"build":"pnpm tsdown","constellation-tracker":"pnpm exec constellation-tracker","format":"pnpm biome format . --write --verbose","format:check":"pnpm biome format . --verbose","license":"pnpm zx ../../scripts/license.mjs","lint":"pnpm biome lint . --verbose","lint:package":"pnpm publint","test":"pnpm vitest run"},"_id":"@accelint/postcss-tailwind-css-modules@1.1.0","bugs":{"url":"https://github.com/gohypergiant/standard-toolkit/issues"},"homepage":"https://github.com/gohypergiant/standard-toolkit#readme","_integrity":"sha512-dRMdhT/J1p9WYEtzsKKF6AIptnSPBSDrA1StcNxT2RS3WzNUxN1Zk5gaeCax2iaFmzDxqhko2O3reEZAkd7gZw==","_resolved":"/tmp/ed277cd58d32a9a8dcadde72a7acedf3/accelint-postcss-tailwind-css-modules-1.1.0.tgz","_from":"file:accelint-postcss-tailwind-css-modules-1.1.0.tgz","_nodeVersion":"24.14.1","_npmVersion":"11.11.0","dist":{"integrity":"sha512-dRMdhT/J1p9WYEtzsKKF6AIptnSPBSDrA1StcNxT2RS3WzNUxN1Zk5gaeCax2iaFmzDxqhko2O3reEZAkd7gZw==","shasum":"2e67b5980a2f271a89e7f15c3b3e3bc3360a1023","tarball":"https://registry.npmjs.org/@accelint/postcss-tailwind-css-modules/-/postcss-tailwind-css-modules-1.1.0.tgz","fileCount":18,"unpackedSize":56235,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQDLcWztVqVkkbGqxuE8kQwHNaR3/BISZ555aNRYA2ZsHQIgfFq3xHLRQ32TWgxyrR4q9cclcA+vvJaq1atHK+FNzhU="}]},"_npmUser":{"name":"hg-devsecops","email":"hg-devsecops@hypergiant.com"},"directories":{},"maintainers":[{"name":"hg-devsecops","email":"hg-devsecops@hypergiant.com"},{"name":"brandonjpierce","email":"brandonpierce91@gmail.com"},{"name":"bryan_hg","email":"bryan.kizer@hypergiant.com"},{"name":"colin.leahy","email":"colin.leahy@hypergiant.com"},{"name":"jacob.foster.hg","email":"jacob.foster@hypergiant.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/postcss-tailwind-css-modules_1.1.0_1778192650327_0.3471697502765123"},"_hasShrinkwrap":false}},"time":{"created":"2025-12-10T23:01:21.573Z","modified":"2026-05-07T22:24:10.703Z","1.0.0":"2025-12-10T23:01:21.931Z","1.0.1":"2025-12-18T21:21:21.581Z","1.1.0":"2026-05-07T22:24:10.482Z"},"bugs":{"url":"https://github.com/gohypergiant/standard-toolkit/issues"},"author":{"name":"https://hypergiant.com"},"license":"Apache-2.0","homepage":"https://github.com/gohypergiant/standard-toolkit#readme","keywords":["dev-tk","tooling"],"repository":{"type":"git","url":"git+https://github.com/gohypergiant/standard-toolkit.git"},"description":"Postcss plugin for resolving some problems that occur when using tailwind with css modules","maintainers":[{"name":"hg-devsecops","email":"hg-devsecops@hypergiant.com"},{"name":"brandonjpierce","email":"brandonpierce91@gmail.com"},{"name":"bryan_hg","email":"bryan.kizer@hypergiant.com"},{"name":"colin.leahy","email":"colin.leahy@hypergiant.com"},{"name":"jacob.foster.hg","email":"jacob.foster@hypergiant.com"}],"readme":"# @accelint/postcss-tailwind-css-modules\n\nA PostCSS plugin that wraps Tailwind CSS `group/` and `peer/` classes in `:global()` pseudo-class to fix compatibility issues with CSS Modules.\n\n## Overview\n\nThis plugin uses [postcss-selector-parser](https://www.npmjs.com/package/postcss-selector-parser) to wrap specific class nodes in a `:global()` pseudo-class, solving issues with Tailwind's parent state utilities when used with CSS Modules.\n\n## Problem\n\nTailwind has utilities for [styling based on parent state](https://tailwindcss.com/docs/hover-focus-and-other-states#styling-based-on-parent-state) and [styling based on sibling state](https://tailwindcss.com/docs/hover-focus-and-other-states#styling-based-on-sibling-state). However, these utility classes rely on global classes. Without this plugin, CSS Modules hashes these classes, breaking Tailwind's parent/sibling state functionality.\n\n## Transformation Examples\n\n### Before and After\n\nWithout this plugin:\n\n<img width=\"847\" height=\"576\" alt=\"Screenshot 2025-12-01 at 9 02 31 PM\" src=\"https://github.com/user-attachments/assets/8e403cfa-aacc-445b-b24b-4bfb64f566c6\" />\n\nWith this plugin:\n\n<img width=\"784\" height=\"709\" alt=\"Screenshot 2025-12-01 at 9 04 10 PM\" src=\"https://github.com/user-attachments/assets/5ca6c4a7-bc81-48d3-9714-b8c7de906d6a\" />\n\n## Installation\n\n```bash\npnpm add -D @accelint/postcss-tailwind-css-modules\n```\n\nOr with npm:\n\n```bash\nnpm install --save-dev @accelint/postcss-tailwind-css-modules\n```\n\n## Usage\n\n### Turbo and Webpack\n\nAdd this plugin to your PostCSS config. It must come **after** the Tailwind PostCSS plugin.\n\n```javascript\n// postcss.config.js\nexport default {\n  plugins: {\n    '@tailwindcss/postcss': {},\n    '@accelint/postcss-tailwind-css-modules': {},\n  },\n};\n```\n\n### Vite\n\nContinue to use the Tailwind Vite plugin in your `vite.config.js`.\n\nYour `postcss.config.js` file only needs this plugin, as Tailwind's PostCSS processing is included in their Vite plugin.\n\n```javascript\n// postcss.config.js\nexport default {\n  plugins: {\n    '@accelint/postcss-tailwind-css-modules': {},\n  },\n};\n```\n\n> [!NOTE]\n> The array syntax for PostCSS plugin configuration does not work with Vite. Using `plugins: ['@accelint/postcss-tailwind-css-modules']` will cause errors. Use the object syntax shown above.\n\n## How It Works\n\nThe plugin:\n\n1. Only processes files ending in `.module.css`\n2. Finds all Tailwind `group/` and `peer/` classes in your CSS selectors\n3. Wraps them in `:global()` pseudo-class to prevent CSS Modules from hashing them\n4. Ensures each rule is transformed only once using symbol-based tracking\n\n**Input:**\n\n```css\n.group/sidebar {\n  /* styles */\n}\n\n.peer/checked {\n  /* styles */\n}\n```\n\n**Output:**\n\n```css\n:global(.group/sidebar) {\n  /* styles */\n}\n\n:global(.peer/checked) {\n  /* styles */\n}\n```\n\n## Supported Classes\n\nThe plugin wraps the following Tailwind parent state classes:\n\n- `group/` classes\n- `peer/` classes\n\n## Requirements\n\n- Node.js >= 22\n- pnpm >= 10\n- PostCSS ^8.5.6\n- postcss-selector-parser ^7.1.1\n\n## License\n\nApache-2.0\n","readmeFilename":"readme.md"}