postcss-focus-within 6.1.1 → 7.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +5 -0
- package/README.md +22 -7
- package/dist/browser-global.js +1 -1
- package/dist/browser-global.js.map +1 -1
- package/dist/browser.cjs +1 -1
- package/dist/browser.cjs.map +1 -1
- package/dist/browser.mjs +1 -1
- package/dist/browser.mjs.map +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.d.ts +5 -1
- package/dist/index.mjs +1 -1
- package/package.json +6 -5
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,10 @@
|
|
|
1
1
|
# Changes to PostCSS Focus Within
|
|
2
2
|
|
|
3
|
+
### 7.0.0 (January 24, 2023)
|
|
4
|
+
|
|
5
|
+
- Updated: Support for Node v14+ (major).
|
|
6
|
+
- Fix: Do not throw when a selector is invalid, show a warning instead.
|
|
7
|
+
|
|
3
8
|
### 6.1.1 (August 23, 2022)
|
|
4
9
|
|
|
5
10
|
- Fix: assign global browser polyfill to `window`, `self` or a blank object.
|
package/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
# PostCSS Focus Within [<img src="https://postcss.github.io/postcss/logo.svg" alt="PostCSS Logo" width="90" height="90" align="right">][
|
|
1
|
+
# PostCSS Focus Within [<img src="https://postcss.github.io/postcss/logo.svg" alt="PostCSS Logo" width="90" height="90" align="right">][PostCSS]
|
|
2
2
|
|
|
3
3
|
[<img alt="npm version" src="https://img.shields.io/npm/v/postcss-focus-within.svg" height="20">][npm-url] [<img alt="CSS Standard Status" src="https://cssdb.org/images/badges/focus-within-pseudo-class.svg" height="20">][css-url] [<img alt="Build Status" src="https://github.com/csstools/postcss-plugins/workflows/test/badge.svg" height="20">][cli-url] [<img alt="Discord" src="https://shields.io/badge/Discord-5865F2?logo=discord&logoColor=white">][discord]
|
|
4
4
|
|
|
@@ -48,8 +48,13 @@ postcss([
|
|
|
48
48
|
[PostCSS Focus Within] runs in all Node environments, with special
|
|
49
49
|
instructions for:
|
|
50
50
|
|
|
51
|
-
|
|
52
|
-
|
|
51
|
+
- [Node](INSTALL.md#node)
|
|
52
|
+
- [PostCSS CLI](INSTALL.md#postcss-cli)
|
|
53
|
+
- [PostCSS Load Config](INSTALL.md#postcss-load-config)
|
|
54
|
+
- [Webpack](INSTALL.md#webpack)
|
|
55
|
+
- [Next.js](INSTALL.md#nextjs)
|
|
56
|
+
- [Gulp](INSTALL.md#gulp)
|
|
57
|
+
- [Grunt](INSTALL.md#grunt)
|
|
53
58
|
|
|
54
59
|
## Options
|
|
55
60
|
|
|
@@ -143,7 +148,7 @@ or
|
|
|
143
148
|
|
|
144
149
|
```html
|
|
145
150
|
<!-- When using a CDN url you will have to manually update the version number -->
|
|
146
|
-
<script src="https://unpkg.com/postcss-focus-within@
|
|
151
|
+
<script src="https://unpkg.com/postcss-focus-within@7.0.0/dist/browser-global.js"></script>
|
|
147
152
|
<script>focusWithinInit()</script>
|
|
148
153
|
```
|
|
149
154
|
|
|
@@ -173,14 +178,24 @@ focusWithinInit({ replaceWith: '.focus-within });
|
|
|
173
178
|
|
|
174
179
|
This option should be used if it was changed at PostCSS configuration level.
|
|
175
180
|
|
|
181
|
+
### Using with Next.js
|
|
182
|
+
|
|
183
|
+
Given that Next.js imports packages both on the browser and on the server, you need to make sure that the package is only imported on the browser.
|
|
184
|
+
|
|
185
|
+
As outlined in the [Next.js documentation](https://nextjs.org/docs/advanced-features/dynamic-import#with-external-libraries), you need to load the package with a dynamic import:
|
|
186
|
+
|
|
187
|
+
```jsx
|
|
188
|
+
useEffect(async () => {
|
|
189
|
+
const focusWithinInit = (await import('postcss-focus-within/browser')).default;
|
|
190
|
+
focusWithinInit();
|
|
191
|
+
}, []);
|
|
192
|
+
```
|
|
193
|
+
|
|
176
194
|
[cli-url]: https://github.com/csstools/postcss-plugins/actions/workflows/test.yml?query=workflow/test
|
|
177
195
|
[css-url]: https://cssdb.org/#focus-within-pseudo-class
|
|
178
196
|
[discord]: https://discord.gg/bUadyRwkJS
|
|
179
197
|
[npm-url]: https://www.npmjs.com/package/postcss-focus-within
|
|
180
198
|
|
|
181
|
-
[Gulp PostCSS]: https://github.com/postcss/gulp-postcss
|
|
182
|
-
[Grunt PostCSS]: https://github.com/nDmitry/grunt-postcss
|
|
183
199
|
[PostCSS]: https://github.com/postcss/postcss
|
|
184
|
-
[PostCSS Loader]: https://github.com/postcss/postcss-loader
|
|
185
200
|
[PostCSS Focus Within]: https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-focus-within
|
|
186
201
|
[Selectors Level 4 specification]: https://www.w3.org/TR/selectors-4/#the-focus-within-pseudo
|
package/dist/browser-global.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
!function(){var e=[" ",">","~",":","+","@","#","(",")"];function
|
|
1
|
+
!function(){var e=[" ",">","~",":","+","@","#","(",")"];function isValidReplacement(t){for(var n=!0,i=0,c=e.length;i<c&&n;i++)t.indexOf(e[i])>-1&&(n=!1);return n}function focusWithin(e){var t={force:!1,replaceWith:"[focus-within]"};if(void 0!==e&&"force"in e&&(t.force=e.force),void 0!==e&&"replaceWith"in e&&(t.replaceWith=e.replaceWith),!isValidReplacement(t.replaceWith))throw new Error(t.replaceWith+" is not a valid replacement since it can't be applied to single elements.");try{if(document.querySelector(":focus-within"),!t.force)return}catch(d){}var n,i,c,o,r,a=(n=t.replaceWith,r=[],"."===n[0]?(i=n.slice(1),c=function remove(e){return e.classList.remove(i)},o=function add(e){return e.classList.add(i)}):(i=n.slice(1,-1),c=function remove(e){return e.removeAttribute(i,"")},o=function add(e){return e.setAttribute(i,"")}),function handleFocusChange(){r.forEach((function(e){return c(e)})),r.length=0;var e=document.activeElement;if(!/^(#document|HTML|BODY)$/.test(Object(e).nodeName))for(;e&&1===e.nodeType;)o(e),r.push(e),e=e.parentNode}),u=function initializeEventListeners(){document.documentElement.className.indexOf("js-focus-within")>-1||(document.documentElement.className=document.documentElement.className+" js-focus-within",document.addEventListener("focus",a,!0),document.addEventListener("blur",a,!0))};"complete"===document.readyState?u():document.addEventListener("DOMContentLoaded",u)}("object"==typeof window&&window||"object"==typeof self&&self||{}).focusWithinInit=focusWithin}();
|
|
2
2
|
//# sourceMappingURL=browser-global.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"browser-global.js","sources":["../src/is-valid-replacement.mjs","../src/browser.js","../src/browser-global.js"],"sourcesContent":["const INVALID_SELECTOR_CHAR = [\n\t' ', // Can't use child selector\n\t'>', // Can't use direct child selector\n\t'~', // Can't use sibling selector\n\t':', // Can't use pseudo selector\n\t'+', // Can't use adjacent selector\n\t'@', // Can't use at\n\t'#', // Can't use id selector\n\t'(', // Can't use parenthesis\n\t')', // Can't use parenthesis\n];\n\nexport default function isValidReplacement(selector) {\n\tlet isValid = true;\n\n\t// Purposely archaic so it's interoperable in old browsers\n\tfor (let i = 0, length = INVALID_SELECTOR_CHAR.length; i < length && isValid; i++) {\n\t\tif (selector.indexOf(INVALID_SELECTOR_CHAR[i]) > -1) {\n\t\t\tisValid = false;\n\t\t}\n\t}\n\n\treturn isValid;\n}\n","/* global document */\nimport isValidReplacement from './is-valid-replacement.mjs';\nfunction generateHandler(replaceWith) {\n\tlet selector;\n\tlet remove;\n\tlet add;\n\tconst lastElements = [];\n\n\tif (replaceWith[0] === '.') {\n\t\tselector = replaceWith.slice(1);\n\t\tremove = (el) => el.classList.remove(selector);\n\t\tadd = (el) => el.classList.add(selector);\n\t} else {\n\t\t// A bit naive\n\t\tselector = replaceWith.slice(1, -1);\n\t\tremove = (el) => el.removeAttribute(selector, '');\n\t\tadd = (el) => el.setAttribute(selector, '');\n\t}\n\n\treturn function handleFocusChange() {\n\t\tlastElements.forEach(lastElement => remove(lastElement));\n\t\tlastElements.length = 0;\n\n\t\tlet activeElement = document.activeElement;\n\n\t\t// only add focus if it has not been added and is not the document element\n\t\tif (!/^(#document|HTML|BODY)$/.test(Object(activeElement).nodeName)) {\n\t\t\twhile (activeElement && activeElement.nodeType === 1) {\n\t\t\t\tadd(activeElement);\n\t\t\t\tlastElements.push(activeElement);\n\n\t\t\t\tactiveElement = activeElement.parentNode;\n\t\t\t}\n\t\t}\n\t};\n}\n\nexport default function focusWithin(opts) {\n\t// configuration\n\tconst options = {\n\t\tforce: false,\n\t\treplaceWith: '[focus-within]',\n\t};\n\n\tif (typeof opts !== 'undefined' && 'force' in opts) {\n\t\toptions.force = opts.force;\n\t}\n\n\tif (typeof opts !== 'undefined' && 'replaceWith' in opts) {\n\t\toptions.replaceWith = opts.replaceWith;\n\t}\n\n\tif (!isValidReplacement(options.replaceWith)) {\n\t\tthrow new Error(`${options.replaceWith} is not a valid replacement since it can't be applied to single elements.`);\n\t}\n\n\ttry {\n\t\tdocument.querySelector(':focus-within');\n\n\t\tif (!options.force) {\n\t\t\treturn;\n\t\t}\n\t} catch (ignoredError) { /* do nothing and continue */ }\n\n\tconst handleFocusChange = generateHandler(options.replaceWith);\n\n\tconst initialize = function initializeEventListeners() {\n\t\tif (document.documentElement.className.indexOf('js-focus-within') > -1) {\n\t\t\treturn;\n\t\t}\n\n\t\tdocument.documentElement.className = document.documentElement.className + ' js-focus-within';\n\t\tdocument.addEventListener('focus', handleFocusChange, true);\n\t\tdocument.addEventListener('blur', handleFocusChange, true);\n\t};\n\n\tif (document.readyState === 'complete') {\n\t\tinitialize();\n\t} else {\n\t\tdocument.addEventListener('DOMContentLoaded', initialize);\n\t}\n}\n","/* global self,window */\nimport { default as focusWithinInit } from './browser';\n\n(function (global) {\n\tglobal.focusWithinInit = focusWithinInit;\n}('object' === typeof window && window || 'object' === typeof self && self || {}));\n"],"names":["INVALID_SELECTOR_CHAR","
|
|
1
|
+
{"version":3,"file":"browser-global.js","sources":["../src/is-valid-replacement.mjs","../src/browser.js","../src/browser-global.js"],"sourcesContent":["const INVALID_SELECTOR_CHAR = [\n\t' ', // Can't use child selector\n\t'>', // Can't use direct child selector\n\t'~', // Can't use sibling selector\n\t':', // Can't use pseudo selector\n\t'+', // Can't use adjacent selector\n\t'@', // Can't use at\n\t'#', // Can't use id selector\n\t'(', // Can't use parenthesis\n\t')', // Can't use parenthesis\n];\n\nexport default function isValidReplacement(selector) {\n\tlet isValid = true;\n\n\t// Purposely archaic so it's interoperable in old browsers\n\tfor (let i = 0, length = INVALID_SELECTOR_CHAR.length; i < length && isValid; i++) {\n\t\tif (selector.indexOf(INVALID_SELECTOR_CHAR[i]) > -1) {\n\t\t\tisValid = false;\n\t\t}\n\t}\n\n\treturn isValid;\n}\n","/* global document */\nimport isValidReplacement from './is-valid-replacement.mjs';\nfunction generateHandler(replaceWith) {\n\tlet selector;\n\tlet remove;\n\tlet add;\n\tconst lastElements = [];\n\n\tif (replaceWith[0] === '.') {\n\t\tselector = replaceWith.slice(1);\n\t\tremove = (el) => el.classList.remove(selector);\n\t\tadd = (el) => el.classList.add(selector);\n\t} else {\n\t\t// A bit naive\n\t\tselector = replaceWith.slice(1, -1);\n\t\tremove = (el) => el.removeAttribute(selector, '');\n\t\tadd = (el) => el.setAttribute(selector, '');\n\t}\n\n\treturn function handleFocusChange() {\n\t\tlastElements.forEach(lastElement => remove(lastElement));\n\t\tlastElements.length = 0;\n\n\t\tlet activeElement = document.activeElement;\n\n\t\t// only add focus if it has not been added and is not the document element\n\t\tif (!/^(#document|HTML|BODY)$/.test(Object(activeElement).nodeName)) {\n\t\t\twhile (activeElement && activeElement.nodeType === 1) {\n\t\t\t\tadd(activeElement);\n\t\t\t\tlastElements.push(activeElement);\n\n\t\t\t\tactiveElement = activeElement.parentNode;\n\t\t\t}\n\t\t}\n\t};\n}\n\nexport default function focusWithin(opts) {\n\t// configuration\n\tconst options = {\n\t\tforce: false,\n\t\treplaceWith: '[focus-within]',\n\t};\n\n\tif (typeof opts !== 'undefined' && 'force' in opts) {\n\t\toptions.force = opts.force;\n\t}\n\n\tif (typeof opts !== 'undefined' && 'replaceWith' in opts) {\n\t\toptions.replaceWith = opts.replaceWith;\n\t}\n\n\tif (!isValidReplacement(options.replaceWith)) {\n\t\tthrow new Error(`${options.replaceWith} is not a valid replacement since it can't be applied to single elements.`);\n\t}\n\n\ttry {\n\t\tdocument.querySelector(':focus-within');\n\n\t\tif (!options.force) {\n\t\t\treturn;\n\t\t}\n\t} catch (ignoredError) { /* do nothing and continue */ }\n\n\tconst handleFocusChange = generateHandler(options.replaceWith);\n\n\tconst initialize = function initializeEventListeners() {\n\t\tif (document.documentElement.className.indexOf('js-focus-within') > -1) {\n\t\t\treturn;\n\t\t}\n\n\t\tdocument.documentElement.className = document.documentElement.className + ' js-focus-within';\n\t\tdocument.addEventListener('focus', handleFocusChange, true);\n\t\tdocument.addEventListener('blur', handleFocusChange, true);\n\t};\n\n\tif (document.readyState === 'complete') {\n\t\tinitialize();\n\t} else {\n\t\tdocument.addEventListener('DOMContentLoaded', initialize);\n\t}\n}\n","/* global self,window */\nimport { default as focusWithinInit } from './browser';\n\n(function (global) {\n\tglobal.focusWithinInit = focusWithinInit;\n}('object' === typeof window && window || 'object' === typeof self && self || {}));\n"],"names":["INVALID_SELECTOR_CHAR","isValidReplacement","selector","isValid","i","length","indexOf","focusWithin","opts","options","force","replaceWith","Error","document","querySelector","ignoredError","remove","add","lastElements","handleFocusChange","slice","el","classList","removeAttribute","setAttribute","forEach","lastElement","activeElement","test","Object","nodeName","nodeType","push","parentNode","initialize","initializeEventListeners","documentElement","className","addEventListener","readyState","window","self","focusWithinInit"],"mappings":"YAAA,IAAMA,EAAwB,CAC7B,IACA,IACA,IACA,IACA,IACA,IACA,IACA,IACA,KAGc,SAASC,mBAAmBC,GAI1C,IAHA,IAAIC,GAAU,EAGLC,EAAI,EAAGC,EAASL,EAAsBK,OAAQD,EAAIC,GAAUF,EAASC,IACzEF,EAASI,QAAQN,EAAsBI,KAAO,IACjDD,GAAU,GAIZ,OAAOA,CACR,CCce,SAASI,YAAYC,GAEnC,IAAMC,EAAU,CACfC,OAAO,EACPC,YAAa,kBAWd,QARoB,IAATH,GAAwB,UAAWA,IAC7CC,EAAQC,MAAQF,EAAKE,YAGF,IAATF,GAAwB,gBAAiBA,IACnDC,EAAQE,YAAcH,EAAKG,cAGvBV,mBAAmBQ,EAAQE,aAC/B,MAAM,IAAIC,MAASH,EAAQE,YAAuF,6EAGnH,IAGC,GAFAE,SAASC,cAAc,kBAElBL,EAAQC,MACZ,MAEuB,CAAvB,MAAOK,GAAgB,CAEzB,IA9DwBJ,EACpBT,EACAc,EACAC,EACEC,EA0DAC,GA9DkBR,EA8DkBF,EAAQE,YA1D5CO,EAAe,GAEE,MAAnBP,EAAY,IACfT,EAAWS,EAAYS,MAAM,GAC7BJ,EAAS,gBAACK,GAAE,OAAKA,EAAGC,UAAUN,OAAOd,EAAS,EAC9Ce,EAAM,aAACI,GAAE,OAAKA,EAAGC,UAAUL,IAAIf,EAAS,IAGxCA,EAAWS,EAAYS,MAAM,GAAI,GACjCJ,EAAS,gBAACK,GAAE,OAAKA,EAAGE,gBAAgBrB,EAAU,GAAG,EACjDe,EAAM,aAACI,GAAE,OAAKA,EAAGG,aAAatB,EAAU,GAAG,GAGrC,SAASiB,oBACfD,EAAaO,SAAQ,SAAAC,GAAW,OAAIV,EAAOU,MAC3CR,EAAab,OAAS,EAEtB,IAAIsB,EAAgBd,SAASc,cAG7B,IAAK,0BAA0BC,KAAKC,OAAOF,GAAeG,UACzD,KAAOH,GAA4C,IAA3BA,EAAcI,UACrCd,EAAIU,GACJT,EAAac,KAAKL,GAElBA,EAAgBA,EAAcM,aAmC3BC,EAAa,SAASC,2BACvBtB,SAASuB,gBAAgBC,UAAU/B,QAAQ,oBAAsB,IAIrEO,SAASuB,gBAAgBC,UAAYxB,SAASuB,gBAAgBC,UAAY,mBAC1ExB,SAASyB,iBAAiB,QAASnB,GAAmB,GACtDN,SAASyB,iBAAiB,OAAQnB,GAAmB,KAG1B,aAAxBN,SAAS0B,WACZL,IAEArB,SAASyB,iBAAiB,mBAAoBJ,EAEhD,EC5EE,iBAAoBM,QAAUA,QAAU,iBAAoBC,MAAQA,MAAQ,IADtEC,gBAAkBA"}
|
package/dist/browser.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var e=[" ",">","~",":","+","@","#","(",")"];module.exports=function(
|
|
1
|
+
var e=[" ",">","~",":","+","@","#","(",")"];function isValidReplacement(t){for(var n=!0,c=0,i=e.length;c<i&&n;c++)t.indexOf(e[c])>-1&&(n=!1);return n}module.exports=function focusWithin(e){var t={force:!1,replaceWith:"[focus-within]"};if(void 0!==e&&"force"in e&&(t.force=e.force),void 0!==e&&"replaceWith"in e&&(t.replaceWith=e.replaceWith),!isValidReplacement(t.replaceWith))throw new Error(t.replaceWith+" is not a valid replacement since it can't be applied to single elements.");try{if(document.querySelector(":focus-within"),!t.force)return}catch(d){}var n,c,i,o,r,a=(n=t.replaceWith,r=[],"."===n[0]?(c=n.slice(1),i=function remove(e){return e.classList.remove(c)},o=function add(e){return e.classList.add(c)}):(c=n.slice(1,-1),i=function remove(e){return e.removeAttribute(c,"")},o=function add(e){return e.setAttribute(c,"")}),function handleFocusChange(){r.forEach((function(e){return i(e)})),r.length=0;var e=document.activeElement;if(!/^(#document|HTML|BODY)$/.test(Object(e).nodeName))for(;e&&1===e.nodeType;)o(e),r.push(e),e=e.parentNode}),u=function initializeEventListeners(){document.documentElement.className.indexOf("js-focus-within")>-1||(document.documentElement.className=document.documentElement.className+" js-focus-within",document.addEventListener("focus",a,!0),document.addEventListener("blur",a,!0))};"complete"===document.readyState?u():document.addEventListener("DOMContentLoaded",u)};
|
|
2
2
|
//# sourceMappingURL=browser.cjs.map
|
package/dist/browser.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"browser.cjs","sources":["../src/is-valid-replacement.mjs","../src/browser.js"],"sourcesContent":["const INVALID_SELECTOR_CHAR = [\n\t' ', // Can't use child selector\n\t'>', // Can't use direct child selector\n\t'~', // Can't use sibling selector\n\t':', // Can't use pseudo selector\n\t'+', // Can't use adjacent selector\n\t'@', // Can't use at\n\t'#', // Can't use id selector\n\t'(', // Can't use parenthesis\n\t')', // Can't use parenthesis\n];\n\nexport default function isValidReplacement(selector) {\n\tlet isValid = true;\n\n\t// Purposely archaic so it's interoperable in old browsers\n\tfor (let i = 0, length = INVALID_SELECTOR_CHAR.length; i < length && isValid; i++) {\n\t\tif (selector.indexOf(INVALID_SELECTOR_CHAR[i]) > -1) {\n\t\t\tisValid = false;\n\t\t}\n\t}\n\n\treturn isValid;\n}\n","/* global document */\nimport isValidReplacement from './is-valid-replacement.mjs';\nfunction generateHandler(replaceWith) {\n\tlet selector;\n\tlet remove;\n\tlet add;\n\tconst lastElements = [];\n\n\tif (replaceWith[0] === '.') {\n\t\tselector = replaceWith.slice(1);\n\t\tremove = (el) => el.classList.remove(selector);\n\t\tadd = (el) => el.classList.add(selector);\n\t} else {\n\t\t// A bit naive\n\t\tselector = replaceWith.slice(1, -1);\n\t\tremove = (el) => el.removeAttribute(selector, '');\n\t\tadd = (el) => el.setAttribute(selector, '');\n\t}\n\n\treturn function handleFocusChange() {\n\t\tlastElements.forEach(lastElement => remove(lastElement));\n\t\tlastElements.length = 0;\n\n\t\tlet activeElement = document.activeElement;\n\n\t\t// only add focus if it has not been added and is not the document element\n\t\tif (!/^(#document|HTML|BODY)$/.test(Object(activeElement).nodeName)) {\n\t\t\twhile (activeElement && activeElement.nodeType === 1) {\n\t\t\t\tadd(activeElement);\n\t\t\t\tlastElements.push(activeElement);\n\n\t\t\t\tactiveElement = activeElement.parentNode;\n\t\t\t}\n\t\t}\n\t};\n}\n\nexport default function focusWithin(opts) {\n\t// configuration\n\tconst options = {\n\t\tforce: false,\n\t\treplaceWith: '[focus-within]',\n\t};\n\n\tif (typeof opts !== 'undefined' && 'force' in opts) {\n\t\toptions.force = opts.force;\n\t}\n\n\tif (typeof opts !== 'undefined' && 'replaceWith' in opts) {\n\t\toptions.replaceWith = opts.replaceWith;\n\t}\n\n\tif (!isValidReplacement(options.replaceWith)) {\n\t\tthrow new Error(`${options.replaceWith} is not a valid replacement since it can't be applied to single elements.`);\n\t}\n\n\ttry {\n\t\tdocument.querySelector(':focus-within');\n\n\t\tif (!options.force) {\n\t\t\treturn;\n\t\t}\n\t} catch (ignoredError) { /* do nothing and continue */ }\n\n\tconst handleFocusChange = generateHandler(options.replaceWith);\n\n\tconst initialize = function initializeEventListeners() {\n\t\tif (document.documentElement.className.indexOf('js-focus-within') > -1) {\n\t\t\treturn;\n\t\t}\n\n\t\tdocument.documentElement.className = document.documentElement.className + ' js-focus-within';\n\t\tdocument.addEventListener('focus', handleFocusChange, true);\n\t\tdocument.addEventListener('blur', handleFocusChange, true);\n\t};\n\n\tif (document.readyState === 'complete') {\n\t\tinitialize();\n\t} else {\n\t\tdocument.addEventListener('DOMContentLoaded', initialize);\n\t}\n}\n"],"names":["INVALID_SELECTOR_CHAR","
|
|
1
|
+
{"version":3,"file":"browser.cjs","sources":["../src/is-valid-replacement.mjs","../src/browser.js"],"sourcesContent":["const INVALID_SELECTOR_CHAR = [\n\t' ', // Can't use child selector\n\t'>', // Can't use direct child selector\n\t'~', // Can't use sibling selector\n\t':', // Can't use pseudo selector\n\t'+', // Can't use adjacent selector\n\t'@', // Can't use at\n\t'#', // Can't use id selector\n\t'(', // Can't use parenthesis\n\t')', // Can't use parenthesis\n];\n\nexport default function isValidReplacement(selector) {\n\tlet isValid = true;\n\n\t// Purposely archaic so it's interoperable in old browsers\n\tfor (let i = 0, length = INVALID_SELECTOR_CHAR.length; i < length && isValid; i++) {\n\t\tif (selector.indexOf(INVALID_SELECTOR_CHAR[i]) > -1) {\n\t\t\tisValid = false;\n\t\t}\n\t}\n\n\treturn isValid;\n}\n","/* global document */\nimport isValidReplacement from './is-valid-replacement.mjs';\nfunction generateHandler(replaceWith) {\n\tlet selector;\n\tlet remove;\n\tlet add;\n\tconst lastElements = [];\n\n\tif (replaceWith[0] === '.') {\n\t\tselector = replaceWith.slice(1);\n\t\tremove = (el) => el.classList.remove(selector);\n\t\tadd = (el) => el.classList.add(selector);\n\t} else {\n\t\t// A bit naive\n\t\tselector = replaceWith.slice(1, -1);\n\t\tremove = (el) => el.removeAttribute(selector, '');\n\t\tadd = (el) => el.setAttribute(selector, '');\n\t}\n\n\treturn function handleFocusChange() {\n\t\tlastElements.forEach(lastElement => remove(lastElement));\n\t\tlastElements.length = 0;\n\n\t\tlet activeElement = document.activeElement;\n\n\t\t// only add focus if it has not been added and is not the document element\n\t\tif (!/^(#document|HTML|BODY)$/.test(Object(activeElement).nodeName)) {\n\t\t\twhile (activeElement && activeElement.nodeType === 1) {\n\t\t\t\tadd(activeElement);\n\t\t\t\tlastElements.push(activeElement);\n\n\t\t\t\tactiveElement = activeElement.parentNode;\n\t\t\t}\n\t\t}\n\t};\n}\n\nexport default function focusWithin(opts) {\n\t// configuration\n\tconst options = {\n\t\tforce: false,\n\t\treplaceWith: '[focus-within]',\n\t};\n\n\tif (typeof opts !== 'undefined' && 'force' in opts) {\n\t\toptions.force = opts.force;\n\t}\n\n\tif (typeof opts !== 'undefined' && 'replaceWith' in opts) {\n\t\toptions.replaceWith = opts.replaceWith;\n\t}\n\n\tif (!isValidReplacement(options.replaceWith)) {\n\t\tthrow new Error(`${options.replaceWith} is not a valid replacement since it can't be applied to single elements.`);\n\t}\n\n\ttry {\n\t\tdocument.querySelector(':focus-within');\n\n\t\tif (!options.force) {\n\t\t\treturn;\n\t\t}\n\t} catch (ignoredError) { /* do nothing and continue */ }\n\n\tconst handleFocusChange = generateHandler(options.replaceWith);\n\n\tconst initialize = function initializeEventListeners() {\n\t\tif (document.documentElement.className.indexOf('js-focus-within') > -1) {\n\t\t\treturn;\n\t\t}\n\n\t\tdocument.documentElement.className = document.documentElement.className + ' js-focus-within';\n\t\tdocument.addEventListener('focus', handleFocusChange, true);\n\t\tdocument.addEventListener('blur', handleFocusChange, true);\n\t};\n\n\tif (document.readyState === 'complete') {\n\t\tinitialize();\n\t} else {\n\t\tdocument.addEventListener('DOMContentLoaded', initialize);\n\t}\n}\n"],"names":["INVALID_SELECTOR_CHAR","isValidReplacement","selector","isValid","i","length","indexOf","focusWithin","opts","options","force","replaceWith","Error","document","querySelector","ignoredError","remove","add","lastElements","handleFocusChange","slice","el","classList","removeAttribute","setAttribute","forEach","lastElement","activeElement","test","Object","nodeName","nodeType","push","parentNode","initialize","initializeEventListeners","documentElement","className","addEventListener","readyState"],"mappings":"AAAA,IAAMA,EAAwB,CAC7B,IACA,IACA,IACA,IACA,IACA,IACA,IACA,IACA,KAGc,SAASC,mBAAmBC,GAI1C,IAHA,IAAIC,GAAU,EAGLC,EAAI,EAAGC,EAASL,EAAsBK,OAAQD,EAAIC,GAAUF,EAASC,IACzEF,EAASI,QAAQN,EAAsBI,KAAO,IACjDD,GAAU,GAIZ,OAAOA,CACR,gBCce,SAASI,YAAYC,GAEnC,IAAMC,EAAU,CACfC,OAAO,EACPC,YAAa,kBAWd,QARoB,IAATH,GAAwB,UAAWA,IAC7CC,EAAQC,MAAQF,EAAKE,YAGF,IAATF,GAAwB,gBAAiBA,IACnDC,EAAQE,YAAcH,EAAKG,cAGvBV,mBAAmBQ,EAAQE,aAC/B,MAAM,IAAIC,MAASH,EAAQE,YAAuF,6EAGnH,IAGC,GAFAE,SAASC,cAAc,kBAElBL,EAAQC,MACZ,MAEuB,CAAvB,MAAOK,GAAgB,CAEzB,IA9DwBJ,EACpBT,EACAc,EACAC,EACEC,EA0DAC,GA9DkBR,EA8DkBF,EAAQE,YA1D5CO,EAAe,GAEE,MAAnBP,EAAY,IACfT,EAAWS,EAAYS,MAAM,GAC7BJ,EAAS,gBAACK,GAAE,OAAKA,EAAGC,UAAUN,OAAOd,EAAS,EAC9Ce,EAAM,aAACI,GAAE,OAAKA,EAAGC,UAAUL,IAAIf,EAAS,IAGxCA,EAAWS,EAAYS,MAAM,GAAI,GACjCJ,EAAS,gBAACK,GAAE,OAAKA,EAAGE,gBAAgBrB,EAAU,GAAG,EACjDe,EAAM,aAACI,GAAE,OAAKA,EAAGG,aAAatB,EAAU,GAAG,GAGrC,SAASiB,oBACfD,EAAaO,SAAQ,SAAAC,GAAW,OAAIV,EAAOU,MAC3CR,EAAab,OAAS,EAEtB,IAAIsB,EAAgBd,SAASc,cAG7B,IAAK,0BAA0BC,KAAKC,OAAOF,GAAeG,UACzD,KAAOH,GAA4C,IAA3BA,EAAcI,UACrCd,EAAIU,GACJT,EAAac,KAAKL,GAElBA,EAAgBA,EAAcM,aAmC3BC,EAAa,SAASC,2BACvBtB,SAASuB,gBAAgBC,UAAU/B,QAAQ,oBAAsB,IAIrEO,SAASuB,gBAAgBC,UAAYxB,SAASuB,gBAAgBC,UAAY,mBAC1ExB,SAASyB,iBAAiB,QAASnB,GAAmB,GACtDN,SAASyB,iBAAiB,OAAQnB,GAAmB,KAG1B,aAAxBN,SAAS0B,WACZL,IAEArB,SAASyB,iBAAiB,mBAAoBJ,EAEhD"}
|
package/dist/browser.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var e=[" ",">","~",":","+","@","#","(",")"];function
|
|
1
|
+
var e=[" ",">","~",":","+","@","#","(",")"];function isValidReplacement(t){for(var n=!0,i=0,c=e.length;i<c&&n;i++)t.indexOf(e[i])>-1&&(n=!1);return n}function focusWithin(e){var t={force:!1,replaceWith:"[focus-within]"};if(void 0!==e&&"force"in e&&(t.force=e.force),void 0!==e&&"replaceWith"in e&&(t.replaceWith=e.replaceWith),!isValidReplacement(t.replaceWith))throw new Error(t.replaceWith+" is not a valid replacement since it can't be applied to single elements.");try{if(document.querySelector(":focus-within"),!t.force)return}catch(d){}var n,i,c,o,r,a=(n=t.replaceWith,r=[],"."===n[0]?(i=n.slice(1),c=function remove(e){return e.classList.remove(i)},o=function add(e){return e.classList.add(i)}):(i=n.slice(1,-1),c=function remove(e){return e.removeAttribute(i,"")},o=function add(e){return e.setAttribute(i,"")}),function handleFocusChange(){r.forEach((function(e){return c(e)})),r.length=0;var e=document.activeElement;if(!/^(#document|HTML|BODY)$/.test(Object(e).nodeName))for(;e&&1===e.nodeType;)o(e),r.push(e),e=e.parentNode}),u=function initializeEventListeners(){document.documentElement.className.indexOf("js-focus-within")>-1||(document.documentElement.className=document.documentElement.className+" js-focus-within",document.addEventListener("focus",a,!0),document.addEventListener("blur",a,!0))};"complete"===document.readyState?u():document.addEventListener("DOMContentLoaded",u)}export{focusWithin as default};
|
|
2
2
|
//# sourceMappingURL=browser.mjs.map
|
package/dist/browser.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"browser.mjs","sources":["../src/is-valid-replacement.mjs","../src/browser.js"],"sourcesContent":["const INVALID_SELECTOR_CHAR = [\n\t' ', // Can't use child selector\n\t'>', // Can't use direct child selector\n\t'~', // Can't use sibling selector\n\t':', // Can't use pseudo selector\n\t'+', // Can't use adjacent selector\n\t'@', // Can't use at\n\t'#', // Can't use id selector\n\t'(', // Can't use parenthesis\n\t')', // Can't use parenthesis\n];\n\nexport default function isValidReplacement(selector) {\n\tlet isValid = true;\n\n\t// Purposely archaic so it's interoperable in old browsers\n\tfor (let i = 0, length = INVALID_SELECTOR_CHAR.length; i < length && isValid; i++) {\n\t\tif (selector.indexOf(INVALID_SELECTOR_CHAR[i]) > -1) {\n\t\t\tisValid = false;\n\t\t}\n\t}\n\n\treturn isValid;\n}\n","/* global document */\nimport isValidReplacement from './is-valid-replacement.mjs';\nfunction generateHandler(replaceWith) {\n\tlet selector;\n\tlet remove;\n\tlet add;\n\tconst lastElements = [];\n\n\tif (replaceWith[0] === '.') {\n\t\tselector = replaceWith.slice(1);\n\t\tremove = (el) => el.classList.remove(selector);\n\t\tadd = (el) => el.classList.add(selector);\n\t} else {\n\t\t// A bit naive\n\t\tselector = replaceWith.slice(1, -1);\n\t\tremove = (el) => el.removeAttribute(selector, '');\n\t\tadd = (el) => el.setAttribute(selector, '');\n\t}\n\n\treturn function handleFocusChange() {\n\t\tlastElements.forEach(lastElement => remove(lastElement));\n\t\tlastElements.length = 0;\n\n\t\tlet activeElement = document.activeElement;\n\n\t\t// only add focus if it has not been added and is not the document element\n\t\tif (!/^(#document|HTML|BODY)$/.test(Object(activeElement).nodeName)) {\n\t\t\twhile (activeElement && activeElement.nodeType === 1) {\n\t\t\t\tadd(activeElement);\n\t\t\t\tlastElements.push(activeElement);\n\n\t\t\t\tactiveElement = activeElement.parentNode;\n\t\t\t}\n\t\t}\n\t};\n}\n\nexport default function focusWithin(opts) {\n\t// configuration\n\tconst options = {\n\t\tforce: false,\n\t\treplaceWith: '[focus-within]',\n\t};\n\n\tif (typeof opts !== 'undefined' && 'force' in opts) {\n\t\toptions.force = opts.force;\n\t}\n\n\tif (typeof opts !== 'undefined' && 'replaceWith' in opts) {\n\t\toptions.replaceWith = opts.replaceWith;\n\t}\n\n\tif (!isValidReplacement(options.replaceWith)) {\n\t\tthrow new Error(`${options.replaceWith} is not a valid replacement since it can't be applied to single elements.`);\n\t}\n\n\ttry {\n\t\tdocument.querySelector(':focus-within');\n\n\t\tif (!options.force) {\n\t\t\treturn;\n\t\t}\n\t} catch (ignoredError) { /* do nothing and continue */ }\n\n\tconst handleFocusChange = generateHandler(options.replaceWith);\n\n\tconst initialize = function initializeEventListeners() {\n\t\tif (document.documentElement.className.indexOf('js-focus-within') > -1) {\n\t\t\treturn;\n\t\t}\n\n\t\tdocument.documentElement.className = document.documentElement.className + ' js-focus-within';\n\t\tdocument.addEventListener('focus', handleFocusChange, true);\n\t\tdocument.addEventListener('blur', handleFocusChange, true);\n\t};\n\n\tif (document.readyState === 'complete') {\n\t\tinitialize();\n\t} else {\n\t\tdocument.addEventListener('DOMContentLoaded', initialize);\n\t}\n}\n"],"names":["INVALID_SELECTOR_CHAR","
|
|
1
|
+
{"version":3,"file":"browser.mjs","sources":["../src/is-valid-replacement.mjs","../src/browser.js"],"sourcesContent":["const INVALID_SELECTOR_CHAR = [\n\t' ', // Can't use child selector\n\t'>', // Can't use direct child selector\n\t'~', // Can't use sibling selector\n\t':', // Can't use pseudo selector\n\t'+', // Can't use adjacent selector\n\t'@', // Can't use at\n\t'#', // Can't use id selector\n\t'(', // Can't use parenthesis\n\t')', // Can't use parenthesis\n];\n\nexport default function isValidReplacement(selector) {\n\tlet isValid = true;\n\n\t// Purposely archaic so it's interoperable in old browsers\n\tfor (let i = 0, length = INVALID_SELECTOR_CHAR.length; i < length && isValid; i++) {\n\t\tif (selector.indexOf(INVALID_SELECTOR_CHAR[i]) > -1) {\n\t\t\tisValid = false;\n\t\t}\n\t}\n\n\treturn isValid;\n}\n","/* global document */\nimport isValidReplacement from './is-valid-replacement.mjs';\nfunction generateHandler(replaceWith) {\n\tlet selector;\n\tlet remove;\n\tlet add;\n\tconst lastElements = [];\n\n\tif (replaceWith[0] === '.') {\n\t\tselector = replaceWith.slice(1);\n\t\tremove = (el) => el.classList.remove(selector);\n\t\tadd = (el) => el.classList.add(selector);\n\t} else {\n\t\t// A bit naive\n\t\tselector = replaceWith.slice(1, -1);\n\t\tremove = (el) => el.removeAttribute(selector, '');\n\t\tadd = (el) => el.setAttribute(selector, '');\n\t}\n\n\treturn function handleFocusChange() {\n\t\tlastElements.forEach(lastElement => remove(lastElement));\n\t\tlastElements.length = 0;\n\n\t\tlet activeElement = document.activeElement;\n\n\t\t// only add focus if it has not been added and is not the document element\n\t\tif (!/^(#document|HTML|BODY)$/.test(Object(activeElement).nodeName)) {\n\t\t\twhile (activeElement && activeElement.nodeType === 1) {\n\t\t\t\tadd(activeElement);\n\t\t\t\tlastElements.push(activeElement);\n\n\t\t\t\tactiveElement = activeElement.parentNode;\n\t\t\t}\n\t\t}\n\t};\n}\n\nexport default function focusWithin(opts) {\n\t// configuration\n\tconst options = {\n\t\tforce: false,\n\t\treplaceWith: '[focus-within]',\n\t};\n\n\tif (typeof opts !== 'undefined' && 'force' in opts) {\n\t\toptions.force = opts.force;\n\t}\n\n\tif (typeof opts !== 'undefined' && 'replaceWith' in opts) {\n\t\toptions.replaceWith = opts.replaceWith;\n\t}\n\n\tif (!isValidReplacement(options.replaceWith)) {\n\t\tthrow new Error(`${options.replaceWith} is not a valid replacement since it can't be applied to single elements.`);\n\t}\n\n\ttry {\n\t\tdocument.querySelector(':focus-within');\n\n\t\tif (!options.force) {\n\t\t\treturn;\n\t\t}\n\t} catch (ignoredError) { /* do nothing and continue */ }\n\n\tconst handleFocusChange = generateHandler(options.replaceWith);\n\n\tconst initialize = function initializeEventListeners() {\n\t\tif (document.documentElement.className.indexOf('js-focus-within') > -1) {\n\t\t\treturn;\n\t\t}\n\n\t\tdocument.documentElement.className = document.documentElement.className + ' js-focus-within';\n\t\tdocument.addEventListener('focus', handleFocusChange, true);\n\t\tdocument.addEventListener('blur', handleFocusChange, true);\n\t};\n\n\tif (document.readyState === 'complete') {\n\t\tinitialize();\n\t} else {\n\t\tdocument.addEventListener('DOMContentLoaded', initialize);\n\t}\n}\n"],"names":["INVALID_SELECTOR_CHAR","isValidReplacement","selector","isValid","i","length","indexOf","focusWithin","opts","options","force","replaceWith","Error","document","querySelector","ignoredError","remove","add","lastElements","handleFocusChange","slice","el","classList","removeAttribute","setAttribute","forEach","lastElement","activeElement","test","Object","nodeName","nodeType","push","parentNode","initialize","initializeEventListeners","documentElement","className","addEventListener","readyState"],"mappings":"AAAA,IAAMA,EAAwB,CAC7B,IACA,IACA,IACA,IACA,IACA,IACA,IACA,IACA,KAGc,SAASC,mBAAmBC,GAI1C,IAHA,IAAIC,GAAU,EAGLC,EAAI,EAAGC,EAASL,EAAsBK,OAAQD,EAAIC,GAAUF,EAASC,IACzEF,EAASI,QAAQN,EAAsBI,KAAO,IACjDD,GAAU,GAIZ,OAAOA,CACR,CCce,SAASI,YAAYC,GAEnC,IAAMC,EAAU,CACfC,OAAO,EACPC,YAAa,kBAWd,QARoB,IAATH,GAAwB,UAAWA,IAC7CC,EAAQC,MAAQF,EAAKE,YAGF,IAATF,GAAwB,gBAAiBA,IACnDC,EAAQE,YAAcH,EAAKG,cAGvBV,mBAAmBQ,EAAQE,aAC/B,MAAM,IAAIC,MAASH,EAAQE,YAAuF,6EAGnH,IAGC,GAFAE,SAASC,cAAc,kBAElBL,EAAQC,MACZ,MAEuB,CAAvB,MAAOK,GAAgB,CAEzB,IA9DwBJ,EACpBT,EACAc,EACAC,EACEC,EA0DAC,GA9DkBR,EA8DkBF,EAAQE,YA1D5CO,EAAe,GAEE,MAAnBP,EAAY,IACfT,EAAWS,EAAYS,MAAM,GAC7BJ,EAAS,gBAACK,GAAE,OAAKA,EAAGC,UAAUN,OAAOd,EAAS,EAC9Ce,EAAM,aAACI,GAAE,OAAKA,EAAGC,UAAUL,IAAIf,EAAS,IAGxCA,EAAWS,EAAYS,MAAM,GAAI,GACjCJ,EAAS,gBAACK,GAAE,OAAKA,EAAGE,gBAAgBrB,EAAU,GAAG,EACjDe,EAAM,aAACI,GAAE,OAAKA,EAAGG,aAAatB,EAAU,GAAG,GAGrC,SAASiB,oBACfD,EAAaO,SAAQ,SAAAC,GAAW,OAAIV,EAAOU,MAC3CR,EAAab,OAAS,EAEtB,IAAIsB,EAAgBd,SAASc,cAG7B,IAAK,0BAA0BC,KAAKC,OAAOF,GAAeG,UACzD,KAAOH,GAA4C,IAA3BA,EAAcI,UACrCd,EAAIU,GACJT,EAAac,KAAKL,GAElBA,EAAgBA,EAAcM,aAmC3BC,EAAa,SAASC,2BACvBtB,SAASuB,gBAAgBC,UAAU/B,QAAQ,oBAAsB,IAIrEO,SAASuB,gBAAgBC,UAAYxB,SAASuB,gBAAgBC,UAAY,mBAC1ExB,SAASyB,iBAAiB,QAASnB,GAAmB,GACtDN,SAASyB,iBAAiB,OAAQnB,GAAmB,KAG1B,aAAxBN,SAAS0B,WACZL,IAEArB,SAASyB,iBAAiB,mBAAoBJ,EAEhD"}
|
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";
|
|
1
|
+
"use strict";var e=require("postcss-selector-parser");const s=[" ",">","~",":","+","@","#","(",")"];function isValidReplacement(e){let n=!0;for(let t=0,l=s.length;t<l&&n;t++)e.indexOf(s[t])>-1&&(n=!1);return n}const n="js-focus-within",t=":focus-within",creator=s=>{const l=Object.assign({preserve:!0,replaceWith:"[focus-within]",disablePolyfillReadyClass:!1},s),o=e().astSync(l.replaceWith);return isValidReplacement(l.replaceWith)?{postcssPlugin:"postcss-focus-within",Rule(s,{result:r}){if(!s.selector.toLowerCase().includes(t))return;const i=s.selectors.flatMap((i=>{if(!i.toLowerCase().includes(t))return[i];let a;try{a=e().astSync(i)}catch(e){return s.warn(r,`Failed to parse selector : "${i}" with message: "${e.message}"`),i}if(void 0===a)return[i];let c=!1;if(a.walkPseudos((e=>{e.value.toLowerCase()===t&&(e.nodes&&e.nodes.length||(c=!0,e.replaceWith(o.clone({}))))})),!c)return[i];const u=a.clone();if(!l.disablePolyfillReadyClass){var d,p,f,h,m;if(null!=(d=a.nodes)&&null!=(p=d[0])&&null!=(f=p.nodes)&&f.length)for(let s=0;s<a.nodes[0].nodes.length;s++){const t=a.nodes[0].nodes[s];if("combinator"===t.type||e.isPseudoElement(t)){a.nodes[0].insertBefore(t,e.className({value:n}));break}if(s===a.nodes[0].nodes.length-1){a.nodes[0].append(e.className({value:n}));break}}null!=(h=a.nodes)&&null!=(m=h[0])&&m.nodes&&(u.nodes[0].prepend(e.combinator({value:" "})),u.nodes[0].prepend(e.className({value:n})))}return[a.toString(),u.toString()]}));i.join(",")!==s.selectors.join(",")&&(s.cloneBefore({selectors:i}),l.preserve||s.remove())}}:{postcssPlugin:"postcss-focus-within",Once:(e,{result:s})=>{e.warn(s,`${l.replaceWith} is not a valid replacement since it can't be applied to single elements.`)}}};creator.postcss=!0,module.exports=creator;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,11 @@
|
|
|
1
1
|
import type { PluginCreator } from 'postcss';
|
|
2
|
-
|
|
2
|
+
/** postcss-focus-within plugin options */
|
|
3
|
+
export type pluginOptions = {
|
|
4
|
+
/** Preserve the original notation. default: true */
|
|
3
5
|
preserve?: boolean;
|
|
6
|
+
/** The replacement class to be used in the polyfill. default: "[focus-within]" */
|
|
4
7
|
replaceWith?: string;
|
|
8
|
+
/** Disable the selector prefix that is used to prevent a flash of incorrectly styled content. default: false */
|
|
5
9
|
disablePolyfillReadyClass?: boolean;
|
|
6
10
|
};
|
|
7
11
|
declare const creator: PluginCreator<pluginOptions>;
|
package/dist/index.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import e from"postcss-selector-parser";const s=[" ",">","~",":","+","@","#","(",")"];const n="
|
|
1
|
+
import e from"postcss-selector-parser";const s=[" ",">","~",":","+","@","#","(",")"];function isValidReplacement(e){let n=!0;for(let t=0,l=s.length;t<l&&n;t++)e.indexOf(s[t])>-1&&(n=!1);return n}const n="js-focus-within",t=":focus-within",creator=s=>{const l=Object.assign({preserve:!0,replaceWith:"[focus-within]",disablePolyfillReadyClass:!1},s),o=e().astSync(l.replaceWith);return isValidReplacement(l.replaceWith)?{postcssPlugin:"postcss-focus-within",Rule(s,{result:r}){if(!s.selector.toLowerCase().includes(t))return;const a=s.selectors.flatMap((a=>{if(!a.toLowerCase().includes(t))return[a];let i;try{i=e().astSync(a)}catch(e){return s.warn(r,`Failed to parse selector : "${a}" with message: "${e.message}"`),a}if(void 0===i)return[a];let c=!1;if(i.walkPseudos((e=>{e.value.toLowerCase()===t&&(e.nodes&&e.nodes.length||(c=!0,e.replaceWith(o.clone({}))))})),!c)return[a];const d=i.clone();if(!l.disablePolyfillReadyClass){var u,p,f,h,m;if(null!=(u=i.nodes)&&null!=(p=u[0])&&null!=(f=p.nodes)&&f.length)for(let s=0;s<i.nodes[0].nodes.length;s++){const t=i.nodes[0].nodes[s];if("combinator"===t.type||e.isPseudoElement(t)){i.nodes[0].insertBefore(t,e.className({value:n}));break}if(s===i.nodes[0].nodes.length-1){i.nodes[0].append(e.className({value:n}));break}}null!=(h=i.nodes)&&null!=(m=h[0])&&m.nodes&&(d.nodes[0].prepend(e.combinator({value:" "})),d.nodes[0].prepend(e.className({value:n})))}return[i.toString(),d.toString()]}));a.join(",")!==s.selectors.join(",")&&(s.cloneBefore({selectors:a}),l.preserve||s.remove())}}:{postcssPlugin:"postcss-focus-within",Once:(e,{result:s})=>{e.warn(s,`${l.replaceWith} is not a valid replacement since it can't be applied to single elements.`)}}};creator.postcss=!0;export{creator as default};
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "postcss-focus-within",
|
|
3
3
|
"description": "Use the :focus-within pseudo-selector in CSS",
|
|
4
|
-
"version": "
|
|
4
|
+
"version": "7.0.0",
|
|
5
5
|
"contributors": [
|
|
6
6
|
{
|
|
7
7
|
"name": "Antonio Laguna",
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
"url": "https://opencollective.com/csstools"
|
|
24
24
|
},
|
|
25
25
|
"engines": {
|
|
26
|
-
"node": "^
|
|
26
|
+
"node": "^14 || ^16 || >=18"
|
|
27
27
|
},
|
|
28
28
|
"main": "dist/index.cjs",
|
|
29
29
|
"module": "dist/index.mjs",
|
|
@@ -53,11 +53,12 @@
|
|
|
53
53
|
"postcss-selector-parser": "^6.0.10"
|
|
54
54
|
},
|
|
55
55
|
"peerDependencies": {
|
|
56
|
-
"postcss": "^8.
|
|
56
|
+
"postcss": "^8.4"
|
|
57
57
|
},
|
|
58
58
|
"scripts": {
|
|
59
|
-
"
|
|
60
|
-
"
|
|
59
|
+
"prebuild": "npm run clean",
|
|
60
|
+
"build": "rollup -c ../../rollup/default.mjs",
|
|
61
|
+
"clean": "node -e \"fs.rmSync('./dist', { recursive: true, force: true }); fs.mkdirSync('./dist');\"",
|
|
61
62
|
"docs": "node ../../.github/bin/generate-docs/install.mjs && node ../../.github/bin/generate-docs/readme.mjs",
|
|
62
63
|
"lint": "npm run lint:eslint && npm run lint:package-json",
|
|
63
64
|
"lint:eslint": "eslint ./src --ext .js --ext .ts --ext .mjs --no-error-on-unmatched-pattern",
|