{ "name": "postcss-focus-within", "versions": { "1.0.0": { "name": "postcss-focus-within", "version": "1.0.0", "description": "[![NPM Version][npm-img]][npm-url] [![Build Status][cli-img]][cli-url] [![Windows Build Status][win-img]][win-url] [![Gitter Chat][git-img]][git-url]", "author": { "name": "Jonathan Neal", "email": "jonathantneal@hotmail.com" }, "license": "CC0-1.0", "repository": { "type": "git", "url": "git+https://github.com/jonathantneal/postcss-focus-within.git" }, "homepage": "https://github.com/jonathantneal/postcss-focus-within#readme", "bugs": { "url": "https://github.com/jonathantneal/postcss-focus-within/issues" }, "main": "index.bundle.js", "module": "index.js", "files": [ "index.js", "index.bundle.js" ], "scripts": { "prepublishOnly": "npm test", "pretest": "rollup -c .rollup.js --silent", "test": "echo 'Running tests...'; npm run test:ec && npm run test:js && npm run test:tape", "test:ec": "echint --ignore index.bundle.js test", "test:js": "eslint *.js --cache --ignore-path .gitignore --quiet", "test:tape": "postcss-tape" }, "engines": { "node": ">=4.0.0" }, "dependencies": { "postcss": "^6.0" }, "devDependencies": { "babel-core": "^6.26", "babel-eslint": "^8.2", "babel-preset-env": "^1.6", "echint": "^4.0", "eslint": "^4.18", "eslint-config-dev": "2.0", "postcss-tape": "2.2", "pre-commit": "^1.2", "rollup": "^0.56", "rollup-plugin-babel": "^3.0" }, "eslintConfig": { "extends": "dev", "parser": "babel-eslint" }, "keywords": [ "postcss", "css", "postcss-plugin", "focus", "within", "polyfill", "pseudos", "selectors", "accessibility", "a11y", "descendants", "ancestors" ], "gitHead": "ee63ee4246a8107b64f65afa4e13d047839c2593", "_id": "postcss-focus-within@1.0.0", "_npmVersion": "5.6.0", "_nodeVersion": "9.5.0", "_npmUser": { "name": "jonathantneal", "email": "jonathantneal@hotmail.com" }, "dist": { "integrity": "sha512-iGLg941dX/e8zVCr6V6OhF+K23/KxgENwDlIYd6w9mcO26AKgvEUZs4kYB2b6ku7G93KI9p14SuCdez5tWKP+g==", "shasum": "dbaa2e5c2f599cce6384d4afc0073414f2203546", "tarball": "https://registry.npmjs.org/postcss-focus-within/-/postcss-focus-within-1.0.0.tgz", "fileCount": 6, "unpackedSize": 13354 }, "maintainers": [ { "name": "jonathantneal", "email": "jonathantneal@hotmail.com" } ], "directories": {}, "_npmOperationalInternal": { "host": "s3://npm-registry-packages", "tmp": "tmp/postcss-focus-within_1.0.0_1518910058056_0.7729713731156693" }, "_hasShrinkwrap": false, "contributors": [] }, "2.0.0": { "name": "postcss-focus-within", "version": "2.0.0", "description": "Ise the :focus-within pseudo-selector in CSS", "author": { "name": "Jonathan Neal", "email": "jonathantneal@hotmail.com" }, "license": "CC0-1.0", "repository": { "type": "git", "url": "git+https://github.com/jonathantneal/postcss-focus-within.git" }, "homepage": "https://github.com/jonathantneal/postcss-focus-within#readme", "bugs": { "url": "https://github.com/jonathantneal/postcss-focus-within/issues" }, "main": "index.cjs.js", "module": "index.es.js", "files": [ "index.cjs.js", "index.es.js" ], "scripts": { "prepublishOnly": "npm test", "pretest": "rollup -c .rollup.js --silent", "test": "echo 'Running tests...'; npm run test:js && npm run test:tape", "test:js": "eslint *.js --cache --ignore-path .gitignore --quiet", "test:tape": "postcss-tape" }, "engines": { "node": ">=4.0.0" }, "dependencies": { "postcss": "^6.0.21" }, "devDependencies": { "babel-core": "^6.26.0", "babel-eslint": "^8.2.2", "babel-preset-env": "^1.6.1", "eslint": "^4.19.1", "eslint-config-dev": "2.0.0", "postcss-tape": "2.2.0", "pre-commit": "^1.2.2", "rollup": "^0.57.1", "rollup-plugin-babel": "^3.0.3" }, "eslintConfig": { "extends": "dev", "parser": "babel-eslint" }, "keywords": [ "postcss", "css", "postcss-plugin", "focus", "within", "polyfill", "pseudos", "selectors", "accessibility", "a11y", "descendants", "ancestors" ], "gitHead": "1596182fbd0d23a936bcd6389b360f4e0afd5cef", "_id": "postcss-focus-within@2.0.0", "_npmVersion": "5.8.0", "_nodeVersion": "9.11.1", "_npmUser": { "name": "jonathantneal", "email": "jonathantneal@hotmail.com" }, "dist": { "integrity": "sha512-LTbT/dxZ3FahpOv1XZMyRLNnBk5QWVU4HL/p82iFkzoPNVhNQazaYIujHXTOAKea5clgjbj6GdFj7mU7qzy1kQ==", "shasum": "7ff76ad8b5e9a000c0123d9690a76752c36c0c52", "tarball": "https://registry.npmjs.org/postcss-focus-within/-/postcss-focus-within-2.0.0.tgz", "fileCount": 6, "unpackedSize": 14736 }, "maintainers": [ { "name": "jonathantneal", "email": "jonathantneal@hotmail.com" } ], "directories": {}, "_npmOperationalInternal": { "host": "s3://npm-registry-packages", "tmp": "tmp/postcss-focus-within_2.0.0_1523152522342_0.6922532908309977" }, "_hasShrinkwrap": false, "contributors": [] }, "3.0.0": { "name": "postcss-focus-within", "version": "3.0.0", "description": "Use the :focus-within pseudo-selector in CSS", "author": { "name": "Jonathan Neal", "email": "jonathantneal@hotmail.com" }, "license": "CC0-1.0", "repository": { "type": "git", "url": "git+https://github.com/jonathantneal/postcss-focus-within.git" }, "homepage": "https://github.com/jonathantneal/postcss-focus-within#readme", "bugs": { "url": "https://github.com/jonathantneal/postcss-focus-within/issues" }, "main": "index.cjs.js", "module": "index.es.mjs", "scripts": { "prepublishOnly": "npm test", "pretest": "rollup -c .rollup.js --silent", "test": "echo 'Running tests...'; npm run test:js && npm run test:tape", "test:js": "eslint *.js --cache --ignore-path .gitignore --quiet", "test:tape": "postcss-tape" }, "engines": { "node": ">=6.0.0" }, "dependencies": { "postcss": "^7.0.2" }, "devDependencies": { "@babel/core": "^7.0.0", "@babel/preset-env": "^7.0.0", "babel-eslint": "^9.0.0", "eslint": "^5.6.0", "eslint-config-dev": "2.0.0", "postcss-tape": "2.2.0", "pre-commit": "^1.2.2", "rollup": "^0.66.0", "rollup-plugin-babel": "^4.0.1" }, "eslintConfig": { "extends": "dev", "parser": "babel-eslint" }, "keywords": [ "postcss", "css", "postcss-plugin", "focus", "within", "polyfill", "pseudos", "selectors", "accessibility", "a11y", "descendants", "ancestors" ], "gitHead": "382ed07404b3665e1d31bd795a0c028033bc8276", "_id": "postcss-focus-within@3.0.0", "_npmVersion": "6.4.1", "_nodeVersion": "10.10.0", "_npmUser": { "name": "jonathantneal", "email": "jonathantneal@hotmail.com" }, "dist": { "integrity": "sha512-W0APui8jQeBKbCGZudW37EeMCjDeVxKgiYfIIEo8Bdh5SpB9sxds/Iq8SEuzS0Q4YFOlG7EPFulbbxujpkrV2w==", "shasum": "763b8788596cee9b874c999201cdde80659ef680", "tarball": "https://registry.npmjs.org/postcss-focus-within/-/postcss-focus-within-3.0.0.tgz", "fileCount": 8, "unpackedSize": 17197, "npm-signature": "-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJboHcPCRA9TVsSAnZWagAASs4P/0gGNCJS6HHqtOBIpPWK\nZ74a/qcYE9KamXVkUDoJQLjiIExTxH5RLbrV2sVLGZLL4xR/3QwUb5PxWLkR\nLIyCsduEhcUNpvNJMD9lG/YYXE6eLqVz1CPWH52Ea2QDVFNahKHf1vELcey9\nfTxDgW5506pddk1YsNBbvoB+kO0/8M1abtkQ/8PfDUv5gBGhHjhz0bvZRRaf\n8J5jvUheT0dDmMqUllZEEYra1LNF1YrwrI7/b1y52OM3FCe41aePucVLB9Fn\nm1Z+tFgII9H8keXOmtqqW6FmiSISx+a0cNq8gQj7JZO4UckcooyL5YDvxGSw\nFZxjifcQscMwl7m1YJtt2qPiT7sY/iV0cVEQSSoLYoiEyXTDxI1A0Nn4vu72\nh6cWPXzg/SxWU7Q35kbzlK8vcucP0EClk1UDGwtwTlNN/y2vbMwGrWHVP/uo\nYHFTvACP1UxvtY2ZsF3DsZ40zmTwTcr05GIzQI67qNmXqyTcNb7yT8N2ZC0O\nqRDt1l0pkTV1Y1aAT03GAB9GvmNAz5NfnqelVTztZ4UmGztfoVEfU/V6bLJU\n2qmuq31ajgp3vwcwz3ypnbdWEXOdTPEv5ZMaL8ijQFSaDLurP5bBTYWQKp60\niVEVd8GBIvCszbC3KHo32ZP8vKHtjaBhGH8SycMm96tyLxj9Tch//MTYan1r\nsyXk\r\n=4pk9\r\n-----END PGP SIGNATURE-----\r\n" }, "maintainers": [ { "name": "jonathantneal", "email": "jonathantneal@hotmail.com" } ], "directories": {}, "_npmOperationalInternal": { "host": "s3://npm-registry-packages", "tmp": "tmp/postcss-focus-within_3.0.0_1537242894675_0.266156652750438" }, "_hasShrinkwrap": false, "contributors": [] }, "4.0.0": { "name": "postcss-focus-within", "version": "4.0.0", "description": "Use the :focus-within pseudo-selector in CSS", "author": { "name": "Jonathan Neal", "email": "jonathantneal@hotmail.com" }, "license": "CC0-1.0", "repository": { "type": "git", "url": "git+https://github.com/csstools/postcss-focus-within.git" }, "homepage": "https://github.com/csstools/postcss-focus-within#readme", "bugs": { "url": "https://github.com/csstools/postcss-focus-within/issues" }, "main": "dist/index.cjs.js", "module": "dist/index.esm.mjs", "scripts": { "build": "npx rollup -c .rollup.js", "build:watch": "npx rollup -c .rollup.js --watch", "lint": "npx eslint --cache src", "lint:fix": "npx eslint --cache --fix", "pretest": "npm install && npm run build", "test": "npm run lint && npm run tape", "tape": "npx postcss-tape" }, "engines": { "node": ">=10.0.0" }, "dependencies": { "postcss": "^7.0.27" }, "devDependencies": { "@babel/core": "^7.9.0", "@babel/preset-env": "^7.9.5", "babel-eslint": "^10.1.0", "eslint": "^6.8.0", "postcss-tape": "5.0.2", "pre-commit": "^1.2.2", "rollup": "^2.6.1", "rollup-plugin-babel": "^4.4.0" }, "babel": { "presets": [ [ "@babel/env", { "targets": "maintained node versions" } ] ] }, "eslintConfig": { "env": { "es6": true, "node": true }, "extends": "eslint:recommended", "parser": "babel-eslint" }, "rollup": { "input": "src/index.js", "plugins": [ "rollup-plugin-babel" ], "output": [ { "file": "dist/index.cjs.js", "format": "cjs" }, { "file": "dist/index.esm.js", "format": "esm" } ] }, "keywords": [ "postcss", "css", "postcss-plugin", "focus", "within", "polyfill", "pseudos", "selectors", "accessibility", "a11y", "descendants", "ancestors" ], "gitHead": "d82b739c98fae042d2520c52643028f5be74bc26", "_id": "postcss-focus-within@4.0.0", "_nodeVersion": "13.12.0", "_npmVersion": "6.14.4", "dist": { "integrity": "sha512-fO+5/StoHEswmdDQ7V3rhlx4i1cUOjQItae3scu8Nki5h35/fvr8J1vakFnSN4gZ7zzthflpedVsMZPDXNzxaA==", "shasum": "c6b428e13403ba053704ce338514584b6cd880c3", "tarball": "https://registry.npmjs.org/postcss-focus-within/-/postcss-focus-within-4.0.0.tgz", "fileCount": 6, "unpackedSize": 14658, "npm-signature": "-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJelGvRCRA9TVsSAnZWagAA4RgP+wQd2v65mJmZU77uZ2GC\nCua1sqf7/9H98RjJ6uj7/vcuTSxZdJtx0Xv+v+jan4feGWauoMFa+zfGAiLG\nJ3+QunXqu/19YLM6F8gZpwAXVQNY2RVtdsd75TTcRrClkH7nnZo+aDQXmMLj\nY+lyxiy1rR4bFSXsCz7/gOaLTyQaAChhh9jm9cVD0ZJKyuefodul0+/tTxDb\n5HfFKfcuh6qNi1Uule/vxrf5YT5nfKxWN+cdNnhRFCg7AOfapETBs3gcLaO+\nAZIA8XlgTpcdevYqQdiWBS+OZb5tuLTucJ+ctEm4GrdIajTiE3KEzzlKh+cs\n6mzDMFpjJ49hEN3gmdCP6VdJKyThp3eVBczmLLRHKsOFyRkmmr+OdAizo8uF\nFyubyDSLNmN7AfQG7N0NaE+uvtWt1QA/R1cC+VyHwzLzq5nRIuMp7Va+yRpt\nA9mZ8YtnG0L7ZiPKxREemMCoHgTHyb/n6amYEBCZYXEty7hjQ080YDKxC6XB\nbB2epTTm0eZOaoVMYlG47bwusqjKr6WRiJpCEojpEl9TYkPne+4RqduQ5A8b\ndEz40ESrrvC9LYVY0Wjrow31wj81GgVA9TUkHGGPiJq8SgkRQgdcgTX4s9be\nhNPUmntATZO9ylrevTcd0YaM16uoubtjmger9tBtZzIhyVjjMG+J5xl9KPnV\napUV\r\n=YOXX\r\n-----END PGP SIGNATURE-----\r\n" }, "maintainers": [ { "name": "jonathantneal", "email": "jonathantneal@hotmail.com" } ], "_npmUser": { "name": "jonathantneal", "email": "jonathantneal@hotmail.com" }, "directories": {}, "_npmOperationalInternal": { "host": "s3://npm-registry-packages", "tmp": "tmp/postcss-focus-within_4.0.0_1586785233377_0.8103446826494147" }, "_hasShrinkwrap": false, "contributors": [] } }, "time": { "created": "2018-02-17T23:27:38.056Z", "1.0.0": "2018-02-17T23:27:38.113Z", "modified": "2020-04-13T13:40:36.212Z", "2.0.0": "2018-04-08T01:55:22.443Z", "3.0.0": "2018-09-18T03:54:54.810Z", "4.0.0": "2020-04-13T13:40:33.531Z" }, "users": {}, "dist-tags": { "latest": "4.0.0" }, "_uplinks": { "npmjs": { "etag": "W/\"b2cb8c77ef4fecba68eab9b5186300a2\"", "fetched": 1600679295871 } }, "_distfiles": { "postcss-focus-within-1.0.0.tgz": { "url": "https://registry.npmjs.org/postcss-focus-within/-/postcss-focus-within-1.0.0.tgz", "sha": "dbaa2e5c2f599cce6384d4afc0073414f2203546", "registry": "npmjs" }, "postcss-focus-within-2.0.0.tgz": { "url": "https://registry.npmjs.org/postcss-focus-within/-/postcss-focus-within-2.0.0.tgz", "sha": "7ff76ad8b5e9a000c0123d9690a76752c36c0c52", "registry": "npmjs" }, "postcss-focus-within-3.0.0.tgz": { "url": "https://registry.npmjs.org/postcss-focus-within/-/postcss-focus-within-3.0.0.tgz", "sha": "763b8788596cee9b874c999201cdde80659ef680", "registry": "npmjs" }, "postcss-focus-within-4.0.0.tgz": { "url": "https://registry.npmjs.org/postcss-focus-within/-/postcss-focus-within-4.0.0.tgz", "sha": "c6b428e13403ba053704ce338514584b6cd880c3", "registry": "npmjs" } }, "_attachments": { "postcss-focus-within-3.0.0.tgz": { "shasum": "763b8788596cee9b874c999201cdde80659ef680" } }, "_rev": "2-8979098384355e5f", "_id": "postcss-focus-within", "readme": "# PostCSS Focus Within [\"PostCSS][postcss]\n\n[\"npm][npm-url]\n[\"CSS][css-url]\n[\"build][cli-url]\n[\"support][git-url]\n\n[PostCSS Focus Within] lets you use the `:focus-within` pseudo-class in CSS,\nfollowing the [Selectors Level 4 specification].\n\nIt is the companion to the [focus-within polyfill].\n\n[!['Can I use' table](https://caniuse.bitsofco.de/image/css-focus-within.png)](https://caniuse.com/#feat=css-focus-within)\n\n```css\n.my-form-field:focus-within label {\n background-color: yellow;\n}\n\n/* becomes */\n\n.my-form-field[focus-within] label {\n background-color: yellow;\n}\n\n.my-form-field:focus-within label {\n background-color: yellow;\n}\n```\n\n[PostCSS Focus Within] duplicates rules using the `:focus-within` pseudo-class\nwith a `[focus-within]` attribute selector, the same selector used by the\n[focus-within polyfill]. This replacement selector can be changed using the\n`replaceWith` option. Also, the preservation of the original `:focus-within`\nrule can be disabled using the `preserve` option.\n\n## Usage\n\nAdd [PostCSS Focus Within] to your project:\n\n```bash\nnpm install postcss-focus-within --save-dev\n```\n\nUse [PostCSS Focus Within] to process your CSS:\n\n```js\nconst postcssFocusWithin = require('postcss-focus-within');\n\npostcssFocusWithin.process(YOUR_CSS /*, processOptions, pluginOptions */);\n```\n\nOr use it as a [PostCSS] plugin:\n\n```js\nconst postcss = require('postcss');\nconst postcssFocusWithin = require('postcss-focus-within');\n\npostcss([\n postcssFocusWithin(/* pluginOptions */)\n]).process(YOUR_CSS /*, processOptions */);\n```\n\n[PostCSS Focus Within] runs in all Node environments, with special\ninstructions 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 defines whether the original selector should remain. By\ndefault, the original selector is preserved.\n\n```js\nfocusWithin({ preserve: false });\n```\n\n```css\n.my-form-field:focus-within label {\n background-color: yellow;\n}\n\n/* becomes */\n\n.my-form-field[focus-within] label {\n background-color: yellow;\n}\n```\n\n### replaceWith\n\nThe `replaceWith` option defines the selector to replace `:focus-within`. By\ndefault, the replacement selector is `[focus-within]`.\n\n```js\nfocusWithin({ replaceWith: '.focus-within' });\n```\n\n```css\n.my-form-field:focus-within label {\n background-color: yellow;\n}\n\n/* becomes */\n\n.my-form-field.focus-within label {\n background-color: yellow;\n}\n\n.my-form-field:focus-within label {\n background-color: yellow;\n}\n```\n\n[css-url]: https://cssdb.org/#focus-within-pseudo-class\n[cli-url]: https://travis-ci.org/csstools/postcss-focus-within\n[git-url]: https://gitter.im/postcss/postcss\n[npm-url]: https://www.npmjs.com/package/postcss-focus-within\n\n[focus-within polyfill]: https://github.com/jsxtools/focus-within\n[Gulp PostCSS]: https://github.com/postcss/gulp-postcss\n[Grunt PostCSS]: https://github.com/nDmitry/grunt-postcss\n[PostCSS]: https://github.com/postcss/postcss\n[PostCSS Focus Within]: https://github.com/csstools/postcss-focus-within\n[PostCSS Loader]: https://github.com/postcss/postcss-loader\n[Selectors Level 4 specification]: https://www.w3.org/TR/selectors-4/#the-focus-within-pseudo" }