Skip to content

Commit 23cce3f

Browse files
collect plugins data
1 parent ddd0ddc commit 23cce3f

File tree

183 files changed

+2504
-2458
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

183 files changed

+2504
-2458
lines changed

npm-data/links.json

Lines changed: 208 additions & 208 deletions
Large diffs are not rendered by default.

npm-data/maintained-plugins.json

Lines changed: 440 additions & 440 deletions
Large diffs are not rendered by default.

npm-data/maybe-plugins.json

Lines changed: 972 additions & 926 deletions
Large diffs are not rendered by default.

npm-data/plugins.json

Lines changed: 705 additions & 705 deletions
Large diffs are not rendered by default.

npm-data/plugins/@766aya/postcss-px-to-viewport.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -123,5 +123,5 @@
123123
"license": "MIT",
124124
"readme": "# postcss-px-to-viewport\r\n[![NPM version](https://badge.fury.io/js/postcss-px-to-viewport.svg)](http://badge.fury.io/js/postcss-px-to-viewport)\r\n\r\nEnglish | [中文](README_CN.md) \r\n\r\nA plugin for [PostCSS](https://github.com/postcss/postcss) that generates viewport units (vw, vh, vmin, vmax) from pixel units.\r\n\r\n<a href=\"https://evrone.com/?utm_source=postcss-px-to-viewport\">\r\n <img src=\"https://user-images.githubusercontent.com/417688/34437029-dbfe4ee6-ecab-11e7-9d80-2b274b4149b3.png\"\r\n alt=\"Sponsored by Evrone\" width=\"231\">\r\n</a>\r\n\r\n## Demo\r\n\r\nIf your project involves a fixed width, this script will help to convert pixels into viewport units.\r\n\r\n### Input\r\n\r\n```css\r\n.class {\r\n margin: -10px .5vh;\r\n padding: 5vmin 9.5px 1px;\r\n border: 3px solid black;\r\n border-bottom-width: 1px;\r\n font-size: 14px;\r\n line-height: 20px;\r\n}\r\n\r\n.class2 {\r\n border: 1px solid black;\r\n margin-bottom: 1px;\r\n font-size: 20px;\r\n line-height: 30px;\r\n}\r\n\r\n@media (min-width: 750px) {\r\n .class3 {\r\n font-size: 16px;\r\n line-height: 22px;\r\n }\r\n}\r\n```\r\n\r\n### Output\r\n```css\r\n.class {\r\n margin: -3.125vw .5vh;\r\n padding: 5vmin 2.96875vw 1px;\r\n border: 0.9375vw solid black;\r\n border-bottom-width: 1px;\r\n font-size: 4.375vw;\r\n line-height: 6.25vw;\r\n}\r\n\r\n.class2 {\r\n border: 1px solid black;\r\n margin-bottom: 1px;\r\n font-size: 6.25vw;\r\n line-height: 9.375vw;\r\n}\r\n\r\n@media (min-width: 750px) {\r\n .class3 {\r\n font-size: 16px;\r\n line-height: 22px;\r\n }\r\n}\r\n```\r\n\r\n## Getting Started\r\n\r\n### Installation\r\nAdd via npm\r\n```\r\n$ npm install postcss-px-to-viewport --save-dev\r\n```\r\nor yarn\r\n```\r\n$ yarn add -D postcss-px-to-viewport\r\n```\r\n\r\n### Usage\r\n\r\nDefault Options:\r\n```js\r\n{\r\n unitToConvert: 'px',\r\n viewportWidth: 320,\r\n unitPrecision: 5,\r\n propList: ['*'],\r\n viewportUnit: 'vw',\r\n fontViewportUnit: 'vw',\r\n selectorBlackList: [],\r\n minPixelValue: 1,\r\n mediaQuery: false,\r\n replace: true,\r\n exclude: [],\r\n landscape: false,\r\n landscapeUnit: 'vw',\r\n landscapeWidth: 568\r\n}\r\n```\r\n- `unitToConvert` (String) unit to convert, by default, it is px.\r\n- `viewportWidth` (Number) The width of the viewport.\r\n- `unitPrecision` (Number) The decimal numbers to allow the vw units to grow to.\r\n- `propList` (Array) The properties that can change from px to vw.\r\n - Values need to be exact matches.\r\n - Use wildcard * to enable all properties. Example: ['*']\r\n - Use * at the start or end of a word. (['*position*'] will match background-position-y)\r\n - Use ! to not match a property. Example: ['*', '!letter-spacing']\r\n - Combine the \"not\" prefix with the other prefixes. Example: ['*', '!font*']\r\n- `viewportUnit` (String) Expected units.\r\n- `fontViewportUnit` (String) Expected units for font.\r\n- `selectorBlackList` (Array) The selectors to ignore and leave as px.\r\n - If value is string, it checks to see if selector contains the string.\r\n - `['body']` will match `.body-class`\r\n - If value is regexp, it checks to see if the selector matches the regexp.\r\n - `[/^body$/]` will match `body` but not `.body`\r\n- `minPixelValue` (Number) Set the minimum pixel value to replace.\r\n- `mediaQuery` (Boolean) Allow px to be converted in media queries.\r\n- `replace` (Boolean) replaces rules containing vw instead of adding fallbacks.\r\n- `exclude` (Array or Regexp) Ignore some files like 'node_modules'\r\n - If value is regexp, will ignore the matches files.\r\n - If value is array, the elements of the array are regexp.\r\n- `landscape` (Boolean) Adds `@media (orientation: landscape)` with values converted via `landscapeWidth`.\r\n- `landscapeUnit` (String) Expected unit for `landscape` option\r\n- `landscapeWidth` (Number) Viewport width for landscape orientation.\r\n\r\n#### Use with gulp-postcss\r\n\r\nadd to your `gulpfile.js`:\r\n```js\r\nvar gulp = require('gulp');\r\nvar postcss = require('gulp-postcss');\r\nvar pxtoviewport = require('postcss-px-to-viewport');\r\n\r\ngulp.task('css', function () {\r\n\r\n var processors = [\r\n pxtoviewport({\r\n viewportWidth: 320,\r\n viewportUnit: 'vmin'\r\n })\r\n ];\r\n\r\n return gulp.src(['build/css/**/*.css'])\r\n .pipe(postcss(processors))\r\n .pipe(gulp.dest('build/css'));\r\n});\r\n```\r\n\r\n#### Use with PostCss configuration file\r\n\r\nadd to your `postcss.config.js`\r\n```js\r\nmodule.exports = {\r\n plugins: {\r\n ...\r\n 'postcss-px-to-viewport': {\r\n // options\r\n }\r\n }\r\n}\r\n```\r\n\r\n## Running the tests\r\n\r\nIn order to run tests, you need to install `jasmine-node` globally:\r\n```\r\n$ npm install jasmine-node -g\r\n```\r\nThen run the tests via npm script:\r\n```\r\n$ npm run test\r\n```\r\n\r\n## Contributing\r\n\r\nPlease read [Code of Conduct](CODE-OF-CONDUCT.md) and [Contributing Guidelines](CONTRIBUTING.md) for submitting pull requests to us.\r\n\r\n## Versioning\r\n\r\nWe use [SemVer](http://semver.org/) for versioning. For the versions available, see the [tags on this repository](https://github.com/evrone/postcss-px-to-viewport/tags). \r\n\r\n## Changelog\r\n\r\nThe changelog is [here](CHANGELOG.md).\r\n\r\n## Authors\r\n\r\n* [Dmitry Karpunin](https://github.com/KODerFunk) - *Initial work*\r\n* [Ivan Bunin](https://github.com/chernobelenkiy)\r\n\r\nSee also the list of [contributors](https://github.com/evrone/postcss-px-to-viewport/contributors) who participated in this project.\r\n\r\n## License\r\n\r\nThis project is licensed under the [MIT License](LICENSE).\r\n\r\n## Acknowledgments\r\n\r\n* Hat tip to https://github.com/cuth/postcss-pxtorem/ for inspiring us for this project.\r\n",
125125
"readmeFilename": "README.md",
126-
"_downloads": 1
126+
"_downloads": 6
127127
}

npm-data/plugins/@austinserb/react-zero-ui.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2810,5 +2810,5 @@
28102810
],
28112811
"readme": "# React Zero‑UI (Beta)\n\n**Instant UI state updates. ZERO React re‑renders. <1 KB runtime.**\n\nPre‑render your UI once, flip a `data-*` attribute to update — that's it.\n\n<a href=\"https://bundlephobia.com/package/@austinserb/[email protected]\" target=\"_blank\" rel=\"noopener noreferrer\"><img src=\"https://badgen.net/bundlephobia/min/@austinserb/[email protected]\" alt=\"npm version\" /> </a><a href=\"https://www.npmjs.com/package/@austinserb/react-zero-ui\" target=\"_blank\" rel=\"noopener noreferrer\"><img src=\"https://img.shields.io/npm/v/@austinserb/react-zero-ui\" alt=\"npm version\" /></a> <a href=\"https://opensource.org/licenses/MIT\" target=\"_blank\" rel=\"noopener noreferrer\"><img src=\"https://img.shields.io/badge/License-MIT-yellow.svg\" alt=\"License: MIT\" /></a> ![CI](https://github.com/austin1serb/react-zero-ui/actions/workflows/ci.yml/badge.svg?branch=main)\n\n---\n\n\n## 📚 Quick Links\n\n- [⚡️ Quick Start](#️-quick-start)\n- [🏄‍♂️ Usage](#-usage)\n- [🧬 How it works](#-how-it-works)\n- [✅ Features](#-features)\n- [🏗 Best Practices](#-best-practices)\n\n---\n\n## 🚀 Live Demo\n\n| Example | Link | What it shows | Link to Code |\n| --------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------- |\n| Interactive menu with render tracker | <a href=\"https://react-zero-ui.vercel.app/\" target=\"_blank\" rel=\"noopener noreferrer\"><strong>Main Demo↗</strong></a> | Compare Zero‑UI vs. React side‑by‑side while toggling a menu. | <a href=\"https://github.com/Austin1serb/React-Zero-UI/tree/main/examples/demo\" target=\"_blank\" rel=\"noopener noreferrer\">Github</a> |\n| React benchmark (10 000 nested nodes) | <a href=\"https://react-zero-ui.vercel.app/react\" target=\"_blank\" rel=\"noopener noreferrer\"><strong>React 10k↗</strong></a> | How long the traditional React render path takes. | <a href=\"https://github.com/Austin1serb/React-Zero-UI/tree/main/examples/demo/src/app/react\" target=\"_blank\" rel=\"noopener noreferrer\">Github</a> |\n| Zero‑UI benchmark (10 000 nested nodes) | <a href=\"https://react-zero-ui.vercel.app/zero-ui\" target=\"_blank\" rel=\"noopener noreferrer\"><strong style=\"text-align: nowrap;\">Zero‑UI 10k↗</strong></a> | Identical DOM, but powered by Zero‑UI's `data-*` switch. | <a href=\"https://github.com/Austin1serb/React-Zero-UI/tree/main/examples/demo/src/app/zero-ui\" target=\"_blank\" rel=\"noopener noreferrer\">Github</a> |\n\n---\n\n## 🧐 Why Zero‑UI?\n\nEvery `setState` in React triggers the full VDOM → Diff → Reconciliation → Paint pipeline. For _pure UI state_ (themes, menus, toggles) that work is wasted.\n\n**Zero‑UI introduces \"_PRE‑rendering_\":**\n\n1. Tailwind variants for every state are **generated at build‑time**.\n2. The app **pre‑renders once**.\n3. Runtime state changes only **flip a `data-*` attribute on `<body>`**.\n\nResult → **5-10× faster visual updates** with **ZERO additional bundle cost**.\n\n### 📊 Micro‑benchmarks (Apple M1)\n\n| Nodes updated | React state | Zero‑UI | Speed‑up |\n| ------------- | ----------- | ------- | -------- |\n| 10,000 | \\~50 ms | \\~5 ms | **10×** |\n| 25,000 | \\~180 ms | \\~15 ms | **12×** |\n| 50,000 | \\~300 ms | \\~20 ms | **15×** |\n\nRe‑run these numbers yourself via the links above.\n\n---\n\n## ⚡️ Quick Start\n\n> **Prerequisite:** Tailwind CSS v4 must already be initialized in your project.\n\n```bash\n# Inside an existing *Next.js (App Router)* or *Vite* repo\nnpx create-zero-ui\n```\n\nThat's it — the CLI patch‑installs the required Babel & PostCSS plugins and updates `configs` for you.\n\n### Manual Install\n\n```bash\nnpm install @austinserb/react-zero-ui\n```\n\nThen follow **Setup →** for your bundler.\n\n---\n\n## 🔧 Setup\n\n### Vite\n\n```js\n// vite.config.*\nimport { zeroUIPlugin } from '@austinserb/react-zero-ui/vite';\n\nexport default {\n\t// ❗️Remove the default `tailwindcss()` plugin — Zero‑UI extends it internally\n\tplugins: [zeroUIPlugin()],\n};\n```\n\n### Next.js (App Router)\n\n1. **Spread `bodyAttributes` on `<body>`** in your root layout.\n\n ```tsx\n // app/layout.tsx\n import { bodyAttributes } from '@austinserb/react-zero-ui/attributes';\n // or: import { bodyAttributes } from '../.zero-ui/attributes';\n\n export default function RootLayout({ children }) {\n \treturn (\n \t\t<html lang=\"en\">\n \t\t\t<body {...bodyAttributes}>{children}</body>\n \t\t</html>\n \t);\n }\n ```\n\n2. **Add the PostCSS plugin (must come _before_ Tailwind).**\n\n ```js\n // postcss.config.js\n module.exports = { plugins: { '@austinserb/react-zero-ui/postcss': {}, tailwindcss: {} } };\n ```\n\n---\n\n## 🏄‍♂️ Usage\n\n![react zero ui usage explained](docs/assets/useui-explained.webp)\n\n---\n\n## 🛠 API\n\n### `useUI(key, defaultValue)`\n\n```ts\nconst [staleValue, setValue] = useUI<'open' | 'closed'>('sidebar', 'closed');\n```\n\n- `key` → becomes `data-{key}` on `<body>`.\n- `defaultValue` → optional, prevents FOUC.\n- **Note:** the returned `staleValue` does **not** update (`useUI` is write‑only).\n\n### Tailwind variants\n\n```jsx\n<div className=\"sidebar-open:translate-x-0 sidebar-closed:-translate-x-full\" />\n```\n\nAny `data-{key}=\"{value}\"` pair becomes a variant: `{key}-{value}:`.\n\n---\n\n## 🧬 How it works\n\n1. **`useUI`** → writes to `data-*` attributes on `<body>`.\n2. **Babel plugin** → scans code, finds every `key/value`, injects them into **PostCSS**.\n3. **PostCSS plugin** → generates static Tailwind classes **at build‑time**.\n4. **Runtime** → changing state only touches the attribute — no VDOM, no reconciliation, no re‑paint.\n\n---\n\n## ✅ Features\n\n- **Zero React re‑renders** for UI‑only state.\n- **Global setters** — call from any component or util.\n- **Tiny**: < 1 KB gzipped runtime.\n- **TypeScript‑first**.\n- **SSR‑friendly** (Next.js & Vite SSR).\n- **Framework‑agnostic CSS** — generated classes work in plain HTML / Vue / Svelte as well.\n\n---\n\n## 🏗 Best Practices\n\n1. **UI state only** → themes, layout toggles, feature flags.\n2. **Business logic stays in React** → fetching, data mutation, etc.\n3. **Kebab‑case keys** → e.g. `sidebar-open`.\n4. **Provide defaults** to avoid Flash‑Of‑Unstyled‑Content.\n\n---\n\n## 🤝 Contributing\n\nPRs & issues welcome! Please read the [Contributing Guide](CONTRIBUTING.md).\n\n---\n\n## 📜 License\n\n[MIT](LICENSE) © Austin Serb\n\n---\n\nBuilt with ❤️ for the React community. If Zero‑UI makes your app feel ZERO fast, please ⭐️ the repo!\n",
28122812
"readmeFilename": "README.md",
2813-
"_downloads": 132
2813+
"_downloads": 131
28142814
}

npm-data/plugins/@csstools/postcss-alpha-function.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -162,5 +162,5 @@
162162
"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",
163163
"readmeFilename": "README.md",
164164
"_rev": "1-dfd5d923cafcf9db887ca8f23760f6f3",
165-
"_downloads": 920289
165+
"_downloads": 975703
166166
}

0 commit comments

Comments
 (0)