collect plugins data

Author: github-actions[bot]

npm-data/links.json

@@ -421,5 +421,5 @@
 	],
 	"readme": "# PostCSS Custom Properties [<img src=\"https://postcss.github.io/postcss/logo.svg\" alt=\"PostCSS\" width=\"90\" height=\"90\" align=\"right\">][postcss]\n\n[![NPM Version][npm-img]][npm-url]\n[![CSS Standard Status][css-img]][css-url]\n[![Build Status][cli-img]][cli-url]\n[![Support Chat][git-img]][git-url]\n\n[PostCSS Custom Properties] lets you use Custom Properties in CSS, following\nthe [CSS Custom Properties] specification.\n\n[!['Can I use' table](https://caniuse.bitsofco.de/image/css-variables.png)](https://caniuse.com/#feat=css-variables)\n\n```pcss\n:root {\n  --color: red;\n}\n\nh1 {\n  color: var(--color);\n}\n\n/* becomes */\n\n:root {\n  --color: red;\n}\n\nh1 {\n  color: red;\n  color: var(--color);\n}\n```\n\n## Usage\n\nAdd [PostCSS Custom Properties] to your project:\n\n```bash\nnpm install postcss-custom-properties --save-dev\n```\n\nUse [PostCSS Custom Properties] to process your CSS:\n\n```js\nconst postcssCustomProperties = require('postcss-custom-properties');\n\npostcssCustomProperties.process(YOUR_CSS /*, processOptions, pluginOptions */);\n```\n\nOr use it as a [PostCSS] plugin:\n\n```js\nconst postcss = require('postcss');\nconst postcssCustomProperties = require('postcss-custom-properties');\n\npostcss([\n  postcssCustomProperties(/* pluginOptions */)\n]).process(YOUR_CSS /*, processOptions */);\n```\n\n[PostCSS Custom Properties] runs in all Node environments, with special instructions for:\n\n| [Node](INSTALL.md#node) | [PostCSS CLI](INSTALL.md#postcss-cli) | [Webpack](INSTALL.md#webpack) | [Create React App](INSTALL.md#create-react-app) | [Gulp](INSTALL.md#gulp) | [Grunt](INSTALL.md#grunt) |\n| --- | --- | --- | --- | --- | --- |\n\n## Options\n\n### preserve\n\nThe `preserve` option determines whether Custom Properties and properties using\ncustom properties should be preserved in their original form. By default, both\nof these are preserved.\n\n```js\npostcssCustomProperties({\n  preserve: false\n});\n```\n\n```pcss\n:root {\n  --color: red;\n}\n\nh1 {\n  color: var(--color);\n}\n\n/* becomes */\n\nh1 {\n  color: red;\n}\n```\n\n### importFrom\n\nThe `importFrom` option specifies sources where Custom Properties can be imported\nfrom, which might be CSS, JS, and JSON files, functions, and directly passed\nobjects.\n\n```js\npostcssCustomProperties({\n  importFrom: 'path/to/file.css' // => :root { --color: red }\n});\n```\n\n```pcss\nh1 {\n  color: var(--color);\n}\n\n/* becomes */\n\nh1 {\n  color: red;\n}\n```\n\nMultiple sources can be passed into this option, and they will be parsed in the\norder they are received. JavaScript files, JSON files, functions, and objects\nwill need to namespace Custom Properties using the `customProperties` or\n`custom-properties` key.\n\n```js\npostcssCustomProperties({\n  importFrom: [\n    'path/to/file.css',   // :root { --color: red; }\n    'and/then/this.js',   // module.exports = { customProperties: { '--color': 'red' } }\n    'and/then/that.json', // { \"custom-properties\": { \"--color\": \"red\" } }\n    {\n      customProperties: { '--color': 'red' }\n    },\n    () => {\n      const customProperties = { '--color': 'red' };\n\n      return { customProperties };\n    }\n  ]\n});\n```\n\nSee example imports written in [CSS](test/import-properties.css),\n[JS](test/import-properties.js), and [JSON](test/import-properties.json).\n\n### exportTo\n\nThe `exportTo` option specifies destinations where Custom Properties can be exported\nto, which might be CSS, JS, and JSON files, functions, and directly passed\nobjects.\n\n```js\npostcssCustomProperties({\n  exportTo: 'path/to/file.css' // :root { --color: red; }\n});\n```\n\nMultiple destinations can be passed into this option, and they will be parsed\nin the order they are received. JavaScript files, JSON files, and objects will\nneed to namespace Custom Properties using the `customProperties` or\n`custom-properties` key.\n\n```js\nconst cachedObject = { customProperties: {} };\n\npostcssCustomProperties({\n  exportTo: [\n    'path/to/file.css',   // :root { --color: red; }\n    'and/then/this.js',   // module.exports = { customProperties: { '--color': 'red' } }\n    'and/then/this.mjs',  // export const customProperties = { '--color': 'red' } }\n    'and/then/that.json', // { \"custom-properties\": { \"--color\": \"red\" } }\n    cachedObject,\n    customProperties => {\n      customProperties    // { '--color': 'red' }\n    }\n  ]\n});\n```\n\nSee example exports written to [CSS](test/export-properties.css),\n[JS](test/export-properties.js), [MJS](test/export-properties.mjs), and\n[JSON](test/export-properties.json).\n\n[cli-img]: https://img.shields.io/travis/postcss/postcss-custom-properties/master.svg\n[cli-url]: https://travis-ci.org/postcss/postcss-custom-properties\n[css-img]: https://cssdb.org/badge/custom-properties.svg\n[css-url]: https://cssdb.org/#custom-properties\n[git-img]: https://img.shields.io/badge/support-chat-blue.svg\n[git-url]: https://gitter.im/postcss/postcss\n[npm-img]: https://img.shields.io/npm/v/postcss-custom-properties.svg\n[npm-url]: https://www.npmjs.com/package/postcss-custom-properties\n\n[CSS Custom Properties]: https://www.w3.org/TR/css-variables-1/\n[PostCSS]: https://github.com/postcss/postcss\n[PostCSS Custom Properties]: https://github.com/postcss/postcss-custom-properties\n",
 	"readmeFilename": "README.md",
-	"_downloads": 142
+	"_downloads": 98
 }

npm-data/maintained-plugins.json

@@ -186,5 +186,5 @@
 	"license": "MIT",
 	"readme": "# Bike plugin [![npm version][npm-image]][npm-url] [![Deps][deps-image]][deps-url]\n\n<img align=\"right\" width=\"135\" height=\"95\"\n     title=\"Philosopher’s stone, logo of PostCSS\"\n     src=\"http://postcss.github.io/postcss/logo-leftp.svg\">\n\n> This [PostCSS] plugin for implements transformation of custom At-rules to BEM-like rules\n\n[PostCSS]: https://github.com/postcss/postcss\n[posthtml-bike]: https://github.com/Satanpit/posthtml-bike\n\n## Install\n\n```\nnpm install -S @bikejs/postcss-bem\n```\n\n## Usage\n\n```javascript\nconst { readFileSync } = require('fs');\nconst postcss = require('postcss');\nconst bike = require('postcss-bike');\n\nconst css = readFileSync('input.css');\n\npostcss([bike()]).process(css).then((res) => console.log(output.css));\n```\n\n## Example\n\n### Default\n\n```css\n@component example {\n  display: flex;\n  flex-flow: column nowrap;\n  justify-content: space-between;\n  background-color: #f5f5f5;\n  color: #333;\n\n  @mod theme[dark] {\n    background-color: #333;\n    color: #f5f5f5;\n\n    @elem header, footer {\n      background-color: #1b1b1b;\n      color: #fff;\n    }\n  }\n\n  @elem header {\n    flex: 0 0 50px;\n    background-color: #fff;\n    color: #000;\n  }\n\n  @elem main {\n    flex: 1 1 auto;\n\n    @mod hidden {\n      display: none;\n    }\n  }\n\n  @elem footer {\n    flex: 0 0 50px;\n    background-color: #fff;\n    color: #000;\n  }\n}\n```\n\nTransformed to:\n\n```css\n.example {\n  display: flex;\n  flex-flow: column nowrap;\n  justify-content: space-between;\n  background-color: #f5f5f5;\n  color: #333;\n}\n.example_theme_dark {\n  background-color: #333;\n  color: #f5f5f5;\n}\n.example_theme_dark .example__header,\n.example_theme_dark .example__footer {\n  background-color: #1b1b1b;\n  color: #fff;\n}\n.example__header {\n  flex: 0 0 50px;\n  background-color: #fff;\n  color: #000;\n}\n.example__main {\n  flex: 1 1 auto;\n}\n.example__main_hidden {\n  display: none;\n}\n.example__footer {\n  flex: 0 0 50px;\n  background-color: #fff;\n  color: #000;\n}\n```\n\n## Options\n\n### `component`\n\ntype: `String`  \ndefault: `{component: 'component'}`\n\nAllows to set custom name for component `@rule`.\n\n### `element`\n\ntype: `String`  \ndefault: `{element: 'elem'}`\n\nAllows to set custom name for element `@rule`.\n\n### `modifier`\n\ntype: `String`  \ndefault: `{modifier: 'mod'}`\n\nAllows to set custom name for modifier `@rule`.\n\n### `modifierRegExp`\n\ntype: `RegExp`  \ndefault: `{modifierRegExp: /(\\w+)\\[(\\w+)\\]/}`\n\nAllows to set custom regular expressions for modifier params. Where `$1` is Modifier Name and `$2` is Modifier Value. For \nchanging Modifier Value Separator, change default separator `\\[$2\\]`, which goes before and after `$2` (only this `[ ]` symbols).\n\n\n### License [MIT](LICENSE)\n\n[travis-url]: https://travis-ci.org/Bike-JS/postcss-bike\n[travis-image]: http://img.shields.io/travis/Bike-JS/postcss-bike.svg?style=flat-square\n\n[npm-url]: https://www.npmjs.org/package/postcss-bike\n[npm-image]: http://img.shields.io/npm/v/postcss-bike.svg?style=flat-square\n\n[deps-url]: https://david-dm.org/artem-tolstykh/postcss-bike\n[deps-image]: https://david-dm.org/artem-tolstykh/postcss-bike.svg?style=flat-square\n",
 	"readmeFilename": "README.md",
-	"_downloads": 2
+	"_downloads": 3
 }

npm-data/maybe-plugins.json

@@ -162,5 +162,5 @@
 	"readme": "# PostCSS Alpha Function [<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-alpha-function --save-dev`\n\n[PostCSS Alpha Function] lets you use the `alpha` function in\nCSS, following the [CSS Color] specification.\n\n```css\n.color {\n\tcolor: alpha(from #dddd / calc(alpha / 2));\n}\n\n:root {\n\t--a-color: alpha(from rgb(2 1 0 / var(--a)) / calc(alpha / 2));\n}\n\n/* becomes */\n\n.color {\n\tcolor: rgb(from #dddd r g b / calc(alpha / 2));\n}\n\n:root {\n\t--a-color: rgb(from rgb(2 1 0 / var(--a)) r g b / calc(alpha / 2));\n}\n```\n\n## Usage\n\nAdd [PostCSS Alpha Function] to your project:\n\n```bash\nnpm install postcss @csstools/postcss-alpha-function --save-dev\n```\n\nUse it as a [PostCSS] plugin:\n\n```js\nconst postcss = require('postcss');\nconst postcssAlphaFunction = require('@csstools/postcss-alpha-function');\n\npostcss([\n\tpostcssAlphaFunction(/* 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\npostcssAlphaFunction({ preserve: true })\n```\n\n```css\n.color {\n\tcolor: alpha(from #dddd / calc(alpha / 2));\n}\n\n:root {\n\t--a-color: alpha(from rgb(2 1 0 / var(--a)) / calc(alpha / 2));\n}\n\n/* becomes */\n\n.color {\n\tcolor: rgb(from #dddd r g b / calc(alpha / 2));\n\tcolor: alpha(from #dddd / calc(alpha / 2));\n}\n\n:root {\n\t--a-color: rgb(from rgb(2 1 0 / var(--a)) r g b / calc(alpha / 2));\n}\n\n@supports (color: alpha(from red / 1)) and (color: rgb(0 0 0 / 0)) {\n:root {\n\t--a-color: alpha(from rgb(2 1 0 / var(--a)) / calc(alpha / 2));\n}\n}\n```\n\n### enableProgressiveCustomProperties\n\nThe `enableProgressiveCustomProperties` option determines whether the original notation\nis wrapped with `@supports` when used in Custom Properties. By default, it is enabled.\n\n> [!NOTE]\n> We only recommend disabling this when you set `preserve` to `false` or if you bring your own fix for Custom Properties.  \n> See what the plugin does in its [README](https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-progressive-custom-properties#readme).\n\n```js\npostcssAlphaFunction({ enableProgressiveCustomProperties: false })\n```\n\n```css\n.color {\n\tcolor: alpha(from #dddd / calc(alpha / 2));\n}\n\n:root {\n\t--a-color: alpha(from rgb(2 1 0 / var(--a)) / calc(alpha / 2));\n}\n\n/* becomes */\n\n.color {\n\tcolor: rgb(from #dddd r g b / calc(alpha / 2));\n\tcolor: alpha(from #dddd / calc(alpha / 2));\n}\n\n:root {\n\t--a-color: rgb(from rgb(2 1 0 / var(--a)) r g b / calc(alpha / 2));\n\t--a-color: alpha(from rgb(2 1 0 / var(--a)) / calc(alpha / 2));\n}\n```\n\n_Custom properties do not fallback to the previous declaration_\n\n## Copyright : color conversions\n\nThis software or document includes material copied from or derived from https://github.com/w3c/csswg-drafts/tree/main/css-color-4. Copyright © 2022 W3C® (MIT, ERCIM, Keio, Beihang).\n\n[cli-url]: https://github.com/csstools/postcss-plugins/actions/workflows/test.yml?query=workflow/test\n[css-url]: https://cssdb.org/#alpha-function\n[discord]: https://discord.gg/bUadyRwkJS\n[npm-url]: https://www.npmjs.com/package/@csstools/postcss-alpha-function\n\n[PostCSS]: https://github.com/postcss/postcss\n[PostCSS Alpha Function]: https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-alpha-function\n[CSS Color]: https://drafts.csswg.org/css-color-5/#relative-alpha\n",
 	"readmeFilename": "README.md",
 	"_rev": "1-dfd5d923cafcf9db887ca8f23760f6f3",
-	"_downloads": 515217
+	"_downloads": 684445
 }

npm-data/plugins.json

@@ -2895,5 +2895,5 @@
 	],
 	"readme": "# PostCSS Cascade Layers [<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-cascade-layers --save-dev`\n\n[PostCSS Cascade Layers] lets you use `@layer` following the [Cascade Layers Specification]. For more information on layers, checkout [A Complete Guide to CSS Cascade Layers] by Miriam Suzanne.\n\n```css\n\ntarget {\n\tcolor: purple;\n}\n\n@layer {\n\ttarget {\n\t\tcolor: green;\n\t}\n}\n\n\n/* becomes */\n\n\ntarget:not(#\\#) {\n\tcolor: purple;\n}\n\ntarget {\n\t\tcolor: green;\n\t}\n\n```\n\n## How it works\n\n[PostCSS Cascade Layers] creates \"layers\" of specificity.\n\nIt applies extra specificity on all your styles based on :\n- the most specific selector found\n- the order in which layers are defined\n\n```css\n@layer A, B;\n\n@layer B {\n\t.a-less-specific-selector {\n\t\t/* styles */\n\t}\n}\n\n@layer A {\n\t#something #very-specific {\n\t\t/* styles */\n\t}\n}\n\n@layer C {\n\t.a-less-specific-selector {\n\t\t/* styles */\n\t}\n}\n```\n\nmost specific selector :\n- `#something #very-specific`\n- `[2, 0, 0]`\n- `2 + 1` -> `3` to ensure there is no overlap\n\nthe order in which layers are defined :\n- `A`\n- `B`\n- `C`\n\n| layer | previous adjustment | specificity adjustment | selector |\n| ------ | ------ | ----------- | --- |\n| `A` | `0` | `0 + 0 = 0` | N/A |\n| `B` | `0` | `0 + 3 = 3` | `:not(#\\#):not(#\\#):not(#\\#)` |\n| `C` | `3` | `3 + 3 = 6` | `:not(#\\#):not(#\\#):not(#\\#):not(#\\#):not(#\\#):not(#\\#)` |\n\nThis approach lets more important (later) layers always override less important (earlier) layers.<br>\nAnd layers have enough room internally so that each selector works and overrides as expected.\n\nMore layers with more specificity will cause longer `:not(...)` selectors to be generated.\n\n> [!IMPORTANT]\n> [PostCSS Cascade Layers] assumes to process your complete CSS bundle.<br>If your build tool processes files individually or processes files in parallel the output will be incorrect.<br>Using [`@csstools/postcss-bundler`](https://github.com/csstools/postcss-plugins/tree/main/plugin-packs/postcss-bundler) and `@import` statements is one way to make sure your CSS is bundled before it is processed by this plugin.\n\n\n## Usage\n\nAdd [PostCSS Cascade Layers] to your project:\n\n```bash\nnpm install postcss @csstools/postcss-cascade-layers --save-dev\n```\n\nUse it as a [PostCSS] plugin:\n\n```js\nconst postcss = require('postcss');\nconst postcssCascadeLayers = require('@csstools/postcss-cascade-layers');\n\npostcss([\n\tpostcssCascadeLayers(/* pluginOptions */)\n]).process(YOUR_CSS /*, processOptions */);\n```\n\n\n\n## Options\n\n### onRevertLayerKeyword\n\nThe `onRevertLayerKeyword` option enables warnings if `revert-layer` is used.\nTransforming `revert-layer` for older browsers is not possible in this plugin.\n\nDefaults to `warn`\n\n```js\npostcssCascadeLayers({ onRevertLayerKeyword: 'warn' }) // 'warn' | false\n```\n\n```css\n/* [postcss-cascade-layers]: handling \"revert-layer\" is unsupported by this plugin and will cause style differences between browser versions. */\n@layer {\n\t.foo {\n\t\tcolor: revert-layer;\n\t}\n}\n```\n\n### onConditionalRulesChangingLayerOrder\n\nThe `onConditionalRulesChangingLayerOrder` option enables warnings if layers are declared in multiple different orders in conditional rules.\nTransforming these layers correctly for older browsers is not possible in this plugin.\n\nDefaults to `warn`\n\n```js\npostcssCascadeLayers({ onConditionalRulesChangingLayerOrder: 'warn' }) // 'warn' | false\n```\n\n```css\n/* [postcss-cascade-layers]: handling different layer orders in conditional rules is unsupported by this plugin and will cause style differences between browser versions. */\n@media (min-width: 10px) {\n\t@layer B {\n\t\t.foo {\n\t\t\tcolor: red;\n\t\t}\n\t}\n}\n\n@layer A {\n\t.foo {\n\t\tcolor: pink;\n\t}\n}\n\n@layer B {\n\t.foo {\n\t\tcolor: red;\n\t}\n}\n```\n\n### onImportLayerRule\n\nThe `@import` at-rule can also be used with cascade layers, specifically to create a new layer like so: \n```css\n@import 'theme.css' layer(utilities);\n```\nIf your CSS uses `@import` with layers, you will also need the [postcss-import] plugin. This plugin alone will not handle the `@import` at-rule.  \n\nThis plugin will warn you when it detects that [postcss-import] did not transform`@import` at-rules.\n\n```js\npostcssCascadeLayers({ onImportLayerRule: 'warn' }) // 'warn' | false\n```\n\n### Contributors\nThe contributors to this plugin were [Olu Niyi-Awosusi] and [Sana Javed] from [Oddbird] and Romain Menke.\n\n[cli-url]: https://github.com/csstools/postcss-plugins/actions/workflows/test.yml?query=workflow/test\n[css-url]: https://cssdb.org/#cascade-layers\n[discord]: https://discord.gg/bUadyRwkJS\n[npm-url]: https://www.npmjs.com/package/@csstools/postcss-cascade-layers\n\n[PostCSS]: https://github.com/postcss/postcss\n[PostCSS Cascade Layers]: https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-cascade-layers\n[Cascade Layers Specification]: https://www.w3.org/TR/css-cascade-5/#layering\n[A Complete Guide to CSS Cascade Layers]: https://css-tricks.com/css-cascade-layers/\n[Olu Niyi-Awosusi]: https://github.com/oluoluoxenfree\n[Sana Javed]: https://github.com/sanajaved7\n[Oddbird]: https://github.com/oddbird\n[postcss-import]: https://github.com/postcss/postcss-import\n",
 	"readmeFilename": "README.md",
-	"_downloads": 20163454
+	"_downloads": 19645789
 }