{"_id":"@csstools/postcss-mixins","_rev":"3-9757b018a50edd1d5961e47f44013bdd","name":"@csstools/postcss-mixins","dist-tags":{"latest":"1.1.0"},"versions":{"1.0.0":{"name":"@csstools/postcss-mixins","version":"1.0.0","keywords":["postcss-plugin"],"license":"MIT-0","_id":"@csstools/postcss-mixins@1.0.0","maintainers":[{"name":"jonathantneal","email":"jonathantneal@hotmail.com"},{"name":"alaguna","email":"sombragriselros@gmail.com"},{"name":"romainmenke","email":"romainmenke@gmail.com"}],"contributors":[{"url":"https://antonio.laguna.es","name":"Antonio Laguna","email":"antonio@laguna.es"},{"name":"Romain Menke","email":"romainmenke@gmail.com"}],"homepage":"https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-mixins#readme","bugs":{"url":"https://github.com/csstools/postcss-plugins/issues"},"dist":{"shasum":"c4e1f8dd5f2fa41a7ef6979e95b1621dadb46903","tarball":"https://registry.npmjs.org/@csstools/postcss-mixins/-/postcss-mixins-1.0.0.tgz","fileCount":6,"integrity":"sha512-rz6qjT2w9L3k65jGc2dX+3oGiSrYQ70EZPDrINSmSVoVys7lLBFH0tvEa8DW2sr9cbRVD/W+1sy8+7bfu0JUfg==","signatures":[{"sig":"MEYCIQDRpHYZ6XzRKnlkfVZUtOrYomfn4yVsMtMwpa67JXplFAIhAI6N1rec4SrZYdTOpHgQBy2vobG1OO5CwY6MjtCXANy9","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":5974},"type":"module","engines":{"node":">=20.19.0"},"exports":{".":{"types":"./dist/index.d.ts","default":"./dist/index.mjs"}},"funding":[{"url":"https://github.com/sponsors/csstools","type":"github"},{"url":"https://opencollective.com/csstools","type":"opencollective"}],"gitHead":"b67660b7a7af34cbfb48d2590d8b5cda5f3acf4c","scripts":{},"_npmUser":{"name":"romainmenke","email":"romainmenke@gmail.com"},"repository":{"url":"git+https://github.com/csstools/postcss-plugins.git","type":"git","directory":"plugins/postcss-mixins"},"_npmVersion":"11.6.2","description":"Use mixins in CSS","directories":{},"_nodeVersion":"25.1.0","dependencies":{"@csstools/css-tokenizer":"^4.0.0","@csstools/css-parser-algorithms":"^4.0.0"},"_hasShrinkwrap":false,"peerDependencies":{"postcss":"^8.4"},"_npmOperationalInternal":{"tmp":"tmp/postcss-mixins_1.0.0_1768414178963_0.538227254596126","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@csstools/postcss-mixins","version":"1.0.1","keywords":["postcss-plugin"],"license":"MIT-0","_id":"@csstools/postcss-mixins@1.0.1","maintainers":[{"name":"jonathantneal","email":"jonathantneal@hotmail.com"},{"name":"alaguna","email":"sombragriselros@gmail.com"},{"name":"romainmenke","email":"romainmenke@gmail.com"}],"contributors":[{"url":"https://antonio.laguna.es","name":"Antonio Laguna","email":"antonio@laguna.es"},{"name":"Romain Menke","email":"romainmenke@gmail.com"}],"homepage":"https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-mixins#readme","bugs":{"url":"https://github.com/csstools/postcss-plugins/issues"},"dist":{"shasum":"71b45daa07675924ee42374e216325bb52a3aa44","tarball":"https://registry.npmjs.org/@csstools/postcss-mixins/-/postcss-mixins-1.0.1.tgz","fileCount":6,"integrity":"sha512-yoBuCmY8zQ8b7LPTlnNeNikfNF/67qSZCOgaColQvVKSVZRqrPtwSysvhav0qXvrm7E8itm31SWrSyd2khFl7Q==","signatures":[{"sig":"MEUCIDxl2mkHEHx3ptnMJ2+uXXEg0akhpmCslPUBY/D/+uuEAiEA3DTsdozGuEP8c4/HrZiUT4oZ5ePJUQNm/hCRM+jJSQE=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"},{"sig":"MEUCIDOjH9wUAJSVtAv+ZO+o8nZR+1BNH0qKmYs559Zr79f+AiEAhFCO23O5kd+Qq20gYVuRa+bn6YMsVI3bF2VJFAc5UOA=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":6787},"type":"module","engines":{"node":">=20.19.0"},"exports":{".":{"types":"./dist/index.d.ts","default":"./dist/index.mjs"}},"funding":[{"url":"https://github.com/sponsors/csstools","type":"github"},{"url":"https://opencollective.com/csstools","type":"opencollective"}],"gitHead":"0a77596a53525327411ed5a717f280da696e605f","scripts":{},"_npmUser":{"name":"romainmenke","email":"romainmenke@gmail.com"},"repository":{"url":"git+https://github.com/csstools/postcss-plugins.git","type":"git","directory":"plugins/postcss-mixins"},"_npmVersion":"11.13.0","description":"Use mixins in CSS","directories":{},"_nodeVersion":"26.1.0","dependencies":{"@csstools/css-tokenizer":"^4.0.2","@csstools/css-parser-algorithms":"^4.0.1"},"_hasShrinkwrap":false,"peerDependencies":{"postcss":"^8.4"},"_npmOperationalInternal":{"tmp":"tmp/postcss-mixins_1.0.1_1790347181624_0.6431629941983463","host":"s3://npm-registry-packages-npm-production"}},"1.1.0":{"_id":"@csstools/postcss-mixins@1.1.0","bugs":{"url":"https://github.com/csstools/postcss-plugins/issues"},"dist":{"shasum":"df122bed93e572ecb5af2a34a4e986a0f1054a30","tarball":"https://registry.npmjs.org/@csstools/postcss-mixins/-/postcss-mixins-1.1.0.tgz","fileCount":6,"integrity":"sha512-7ZJ3esTx2pLJfQazrsD8eJwVFqiweSY/NXeXfr2vXdoAfkwMTYH7FoLue+VupofoH/2pI42Irpf3lkoFZ2JPiQ==","signatures":[{"sig":"MEUCIH28ujy3FP6SUvUSLmvEYFWuVlSog6owinWLAbo8AAnIAiEApk5KnQAXa5+Z/sbz6q+MJnJjqdVy9+NC/VtynqlWiFg=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"},{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIH2EIPgm8RMCVTS3fjDBszM7OkoN995PDTVBc6AUINfmAiBaKTVFjD6JdbPjml1Ix7Q7EYM6lHzLWUP9Xypb4kERew=="}],"unpackedSize":12680},"name":"@csstools/postcss-mixins","type":"module","engines":{"node":">=20.19.0"},"exports":{".":{"types":"./dist/index.d.ts","default":"./dist/index.mjs"}},"funding":[{"url":"https://github.com/sponsors/csstools","type":"github"},{"url":"https://opencollective.com/csstools","type":"opencollective"}],"gitHead":"2b4de9a3819ec1855fa8c6eb6b89ef75a968b8f9","license":"MIT-0","scripts":{},"version":"1.1.0","_npmUser":{"name":"romainmenke","email":"romainmenke@gmail.com"},"homepage":"https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-mixins#readme","keywords":["css","mixin","postcss","postcss-plugin"],"repository":{"url":"git+https://github.com/csstools/postcss-plugins.git","type":"git","directory":"plugins/postcss-mixins"},"_npmVersion":"11.13.0","description":"Use mixins in CSS","directories":{},"maintainers":[{"name":"jonathantneal","email":"jonathantneal@hotmail.com"},{"name":"alaguna","email":"sombragriselros@gmail.com"},{"name":"romainmenke","email":"romainmenke@gmail.com"}],"_nodeVersion":"26.1.0","contributors":[{"url":"https://antonio.laguna.es","name":"Antonio Laguna","email":"antonio@laguna.es"},{"name":"Romain Menke","email":"romainmenke@gmail.com"}],"dependencies":{"@csstools/css-tokenizer":"^4.0.2","@csstools/postcss-private-rule":"^1.0.3","@csstools/css-parser-algorithms":"^4.0.2"},"_hasShrinkwrap":false,"peerDependencies":{"postcss":"^8.4"},"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/postcss-mixins_1.1.0_1790835358089_0.208572251750196"}}},"time":{"created":"2026-01-14T18:09:38.892Z","modified":"2026-10-01T06:15:58.362Z","1.0.0":"2026-01-14T18:09:39.127Z","1.0.1":"2026-09-25T14:39:41.713Z","1.1.0":"2026-10-01T06:15:58.187Z"},"bugs":{"url":"https://github.com/csstools/postcss-plugins/issues"},"license":"MIT-0","homepage":"https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-mixins#readme","keywords":["css","mixin","postcss","postcss-plugin"],"repository":{"url":"git+https://github.com/csstools/postcss-plugins.git","type":"git","directory":"plugins/postcss-mixins"},"description":"Use mixins in CSS","contributors":[{"url":"https://antonio.laguna.es","name":"Antonio Laguna","email":"antonio@laguna.es"},{"name":"Romain Menke","email":"romainmenke@gmail.com"}],"maintainers":[{"name":"jonathantneal","email":"jonathantneal@hotmail.com"},{"name":"alaguna","email":"sombragriselros@gmail.com"},{"name":"romainmenke","email":"romainmenke@gmail.com"}],"readme":"# PostCSS Mixins [<img src=\"https://postcss.github.io/postcss/logo.svg\" alt=\"PostCSS Logo\" width=\"90\" height=\"90\" align=\"right\">][PostCSS]\n\n`npm install @csstools/postcss-mixins --save-dev`\n\n[PostCSS Mixins] lets you use `@mixin` and `@apply` following [CSS Mixins 1].\n\nSeveral specification aspects of CSS Mixins still need to be settled.  \nThis plugin is only a partial implementation to avoid conflicts with the final specification.\n\nUnsupported:\n- typed mixin arguments\n- layered `@mixin` declarations\n- mixin overrides\n\n```css\n@mixin --foo() {\n\tcolor: green;\n}\n\n.foo {\n\t@apply --foo;\n}\n\n@mixin --bar(--baz) {\n\tcolor: rgb(var(--baz) 127 0);\n}\n\n.bar {\n\t@apply --bar(200);\n}\n\n@mixin --a {\n\tfont-weight: 500;\n}\n\n@mixin --b {\n\t@apply --a;\n\tfont-size: 2rem;\n}\n\n.c {\n\t@apply --b;\n}\n\n/* becomes */\n\n.foo {\n\tcolor: green;\n}\n\n.bar {\n\t--_csstools-p-1agle9gi-0--arg-0: 200;\n\t--_csstools-p-1agle9gi-1--baz: var(--_csstools-p-1agle9gi-0--arg-0);\n\tcolor: rgb(var(--_csstools-p-1agle9gi-1--baz) 127 0);\n}\n\n.c {\n\tfont-weight: 500;\n\tfont-size: 2rem;\n}\n```\n\n## Usage\n\nAdd [PostCSS Mixins] to your project:\n\n```bash\nnpm install postcss @csstools/postcss-mixins --save-dev\n```\n\nUse it as a [PostCSS] plugin:\n\n```js\nconst postcss = require('postcss');\nconst postcssMixins = require('@csstools/postcss-mixins');\n\npostcss([\n\tpostcssMixins(/* pluginOptions */)\n]).process(YOUR_CSS /*, processOptions */);\n```\n\n\n\n## Options\n\n### preserve\n\nThe `preserve` option determines whether the original notation\nis preserved. By default, it is not preserved.\n\n```js\npostcssMixins({ preserve: true })\n```\n\n```css\n@mixin --foo() {\n\tcolor: green;\n}\n\n.foo {\n\t@apply --foo;\n}\n\n@mixin --bar(--baz) {\n\tcolor: rgb(var(--baz) 127 0);\n}\n\n.bar {\n\t@apply --bar(200);\n}\n\n@mixin --a {\n\tfont-weight: 500;\n}\n\n@mixin --b {\n\t@apply --a;\n\tfont-size: 2rem;\n}\n\n.c {\n\t@apply --b;\n}\n\n/* becomes */\n\n@mixin --foo() {\n\tcolor: green;\n}\n\n.foo {\n\tcolor: green;\n\t@apply --foo;\n}\n\n@mixin --bar(--baz) {\n\tcolor: rgb(var(--baz) 127 0);\n}\n\n.bar {\n\t--_csstools-p-1agle9gi-0--arg-0: 200;\n\t--_csstools-p-1agle9gi-1--baz: var(--_csstools-p-1agle9gi-0--arg-0);\n\tcolor: rgb(var(--_csstools-p-1agle9gi-1--baz) 127 0);\n\t@apply --bar(200);\n}\n\n@mixin --a {\n\tfont-weight: 500;\n}\n\n@mixin --b {\n\t@apply --a;\n\tfont-size: 2rem;\n}\n\n.c {\n\tfont-weight: 500;\n\tfont-size: 2rem;\n\t@apply --b;\n}\n```\n\n[cli-url]: https://github.com/csstools/postcss-plugins/actions/workflows/test.yml?query=workflow/test\n[css-url]: https://cssdb.org/#mixins\n[discord]: https://discord.gg/bUadyRwkJS\n[npm-url]: https://www.npmjs.com/package/@csstools/postcss-mixins\n\n[PostCSS]: https://github.com/postcss/postcss\n[PostCSS Mixins]: https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-mixins\n[CSS Mixins 1]: https://drafts.csswg.org/css-mixins/#mixin-rule\n","readmeFilename":"README.md"}