8000 feat: Upgrade to PostCSS v8 (#2) · cocco3/postcss-disabled@4b11d71 · GitHub
[go: up one dir, main page]
Skip to content

Commit 4b11d71

Browse files
cocco3cocco3
authored
feat: Upgrade to PostCSS v8 (#2)
1 parent 3e93d2a commit 4b11d71

File tree

12 files changed

+1489
-144
lines changed

12 files changed

+1489
-144
lines changed

‎.editorconfig‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,8 @@ root = true
22

33
[*]
44
indent_style = space
5-
indent_size = 4
5+
indent_size = 2
66
end_of_line = lf
77
charset = utf-8
88
trim_trailing_whitespace = true
99
insert_final_newline = true
10-
11-
[*.{json,yml}]
12-
indent_size = 2

‎.gitignore‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,5 @@
11
node_modules/
22
npm-debug.log
3+
yarn-error.log
4+
5+
coverage/

‎.npmignore‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
1-
.gitignore
2-
.editorconfig
3-
4-
node_modules/
1+
yarn-error.log
52
npm-debug.log
3+
package-lock.json
4+
yarn.lock
65

76
*.test.js
8-
.travis.yml
7+
.github
8+
.editorconfig
9+
coverage/

‎.prettierrc‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"semi": true,
3+
"singleQuote": true,
4+
"tabWidth": 2,
5+
"trailingComma": "es5",
6+
"useTabs": false
7+
}

‎.travis.yml‎

Lines changed: 0 additions & 6 deletions
This file was deleted.

‎CHANGELOG.md‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,9 @@
1-
1.0.0 - 2017-02-17
1+
# Changelog
22

3-
* Initial release
3+
## 2.0.0 - 2025-05-05
4+
5+
- Support PostCSS v8.x
6+
7+
## 1.0.0 - 2017-02-17
8+
9+
- Initial release

‎LICENSE‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
The MIT License (MIT)
22

3-
Copyright 2017 Joe Cocco <cocco3@gmail.com>
3+
Copyright 2025 Joe Cocco <cocco3@gmail.com>
44

55
Permission is hereby granted, free of charge, to any person obtaining a copy of
66
this software and associated documentation files (the "Software"), to deal in

‎README.md‎

Lines changed: 18 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,7 @@
1-
# PostCSS Disabled [![Build Status][ci-img]][ci]
1+
# PostCSS Disabled
22

3-
[PostCSS] plugin to add a disabled attribute and/or a disabled class when the ```:disabled``` pseudo class is present.
4-
5-
[PostCSS]: https://github.com/postcss/postcss
6-
[ci-img]: https://travis-ci.org/cocco3/postcss-disabled.svg
7-
[ci]: https://travis-ci.org/cocco3/postcss-disabled
3+
[PostCSS](https://github.com/postcss/postcss) plugin to add a disabled attribute
4+
and/or a disabled class when the `:disabled` pseudo class is present.
85

96
```css
107
/* Input */
@@ -23,18 +20,19 @@
2320

2421
## Usage
2522

23+
See [PostCSS docs](https://github.com/postcss/postcss#usage) for examples for your environment.
24+
2625
```js
27-
postcss([ require('postcss-disabled') ])
26+
postcss([require('postcss-disabled')]);
2827
```
2928

30-
See [PostCSS] docs for examples for your environment.
31-
3229
## Options
3330

3431
### addAttribute
35-
type: `Boolean`
36-
default: `true`
37-
Adds the [disabled] attribute selector
32+
33+
- type: `Boolean`
34+
- default: `true`
35+
- Adds a `[disabled]` attribute selector
3836

3937
```css
4038
/* Input */
@@ -52,9 +50,10 @@ Adds the [disabled] attribute selector
5250
```
5351

5452
### addClass
55-
type: `Boolean`
56-
default: `false`
57-
Adds a .disabled class
53+
54+
- type: `Boolean`
55+
- default: `false`
56+
- Adds a `.disabled` class selector
5857

5958
```css
6059
/* Input */
@@ -70,3 +69,7 @@ Adds a .disabled class
7069
background-color: #f9f9f9;
7170
}
7271
```
72+
73+
## Contributing
74+
75+
- [Writing a PostCSS plugin](https://github.com/postcss/postcss/blob/main/docs/writing-a-plugin.md)

‎index.js‎

Lines changed: 44 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,46 +1,47 @@
1-
var postcss = require('postcss');
2-
var extend = require('util')._extend;
3-
4-
var defaultOptions = {
1+
/**
2+
* @type {import('postcss').PluginCreator}
3+
*/
4+
module.exports = (opts = {}) => {
5+
const defaultOptions = {
56
addAttribute: true,
6-
addClass: false
7-
};
8-
9-
module.exports = postcss.plugin('postcss-disabled', function (opts) {
10-
11-
opts = extend(extend({}, defaultOptions), opts);
12-
13-
return function (root) {
14-
15-
root.walkRules(function (rule) {
16-
17-
if (rule.selector.indexOf(':disabled') !== -1) {
18-
19-
var disabledSelectors = [];
20-
21-
rule.selectors.forEach(function (selector) {
22-
23-
if (selector.indexOf(':disabled') !== -1) {
24-
25-
if (opts.addClass) {
26-
disabledSelectors.push(
27-
selector.replace(/:disabled/g, '.disabled')
28-
);
29-
}
30-
31-
if (opts.addAttribute) {
32-
disabledSelectors.push(
33-
selector.replace(/:disabled/g, '[disabled]')
34-
);
35-
}
36-
}
37-
});
38-
39-
if (disabledSelectors.length) {
40-
rule.selectors = rule.selectors.concat(disabledSelectors);
41-
}
7+
addClass: false,
8+
};
9+
10+
opts = Object.assign({}, defaultOptions, opts);
11+
12+
return {
13+
postcssPlugin: 'postcss-disabled',
14+
15+
Root(root) {
16+
root.walkRules((rule) => {
17+
if (rule.selector.includes(':disabled')) {
18+
const disabledSelectors = [];
19+
20+
rule.selectors.forEach((selector) => {
21+
if (selector.includes(':disabled')) {
22+
if (opts.addClass) {
23+
disabledSelectors.push(
24+
selector.replace(/:disabled/g, '.disabled')
25+
);
26+
}
27+
28+
if (opts.addAttribute) {
29+
disabledSelectors.push(
30+
selector.replace(/:disabled/g, '[disabled]')
31+
);
32+
}
4233
}
43-
});
34+
});
35+
36+
if (disabledSelectors.length) {
37+
rule.selectors = [
38+
...new Set([...rule.selectors, ...disabledSelectors]),
39+
];
40+
}
41+
}
42+
});
43+
},
44+
};
45+
};
4446

45-
};
46-
});
47+
module.exports.postcss = true;

‎index.test.js‎

Lines changed: 48 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -1,55 +1,53 @@
1-
var postcss = require('postcss');
2-
3-
var plugin = require('./');
4-
5-
var test = function (input, output, opts) {
6-
return postcss([ plugin(opts) ]).process(input)
7-
.then(function (result) {
8-
expect(result.css).toEqual(output);
9-
expect(result.warnings().length).toBe(0);
10-
});
11-
};
12-
13-
describe('postcss-disabled', function () {
14-
15-
it('default behavior, no options', function () {
16-
return test(
17-
'.foo:disabled { background-color: #f9f9f9; }',
18-
'.foo:disabled, .foo[disabled] { background-color: #f9f9f9; }',
19-
{}
20-
);
21-
});
22-
23-
it('addAttributes: true', function () {
24-
return test(
25-
'.foo:disabled { background-color: #f9f9f9; }',
26-
'.foo:disabled, .foo[disabled] { background-color: #f9f9f9; }',
27-
{ addAttribute: true }
28-
);
29-
});
1+
const postcss = require('postcss');
2+
const { equal } = require('node:assert');
3+
const { test } = require('node:test');
4+
5+
const plugin = require('./');
6+
7+
async function run(input, output, opts = {}) {
8+
let result = await postcss([plugin(opts)]).process(input, {
9+
from: undefined,
10+
});
11+
equal(result.css, output);
12+
equal(result.warnings().length, 0);
13+
}
14+
15+
test('default behavior, no options', async () => {
16+
await run(
17+
'.foo:disabled { background-color: #f9f9f9; }',
18+
'.foo:disabled, .foo[disabled] { background-color: #f9f9f9; }',
19+
{}
20+
);
21+
});
3022

31-
it('addAttributes: false', function () {
32-
return test(
33-
'.foo:disabled { background-color: #f9f9f9; }',
34-
'.foo:disabled { background-color: #f9f9f9; }',
35-
{ addAttribute: false }
36-
);
37-
});
23+
test('addAttributes: true', async () => {
24+
await run(
25+
'.foo:disabled { background-color: #f9f9f9; }',
26+
'.foo:disabled, .foo[disabled] { background-color: #f9f9f9; }',
27+
{ addAttribute: true }
28+
);
29+
});
3830

39-
it('addClass: true', function () {
40-
return test(
41-
'.foo:disabled { background-color: #f9f9f9; }',
42-
'.foo:disabled, .foo.disabled, .foo[disabled] { background-color: #f9f9f9; }',
43-
{ addClass: true }
44-
);
45-
});
31+
test('addAttributes: false', async () => {
32+
await run(
33+
'.foo:disabled { background-color: #f9f9f9; }',
34+
'.foo:disabled { background-color: #f9f9f9; }',
35+
{ addAttribute: false }
36+
);
37+
});
4638

47-
it('addClass: false', function () {
48-
return test(
49-
'.foo:disabled { background-color: #f9f9f9; }',
50-
'.foo:disabled, .foo[disabled] { background-color: #f9f9f9; }',
51-
{ addClass: false }
52-
);
53-
});
39+
test('addClass: true', async () => {
40+
await run(
41+
'.foo:disabled { background-color: #f9f9f9; }',
42+
'.foo:disabled, .foo.disabled, .foo[disabled] { background-color: #f9f9f9; }',
43+
{ addClass: true }
44+
);
45+
});
5446

47+
test('addClass: false', async () => {
48+
await run(
49+
'.foo:disabled { background-color: #f9f9f9; }',
50+
'.foo:disabled, .foo[disabled] { background-color: #f9f9f9; }',
51+
{ addClass: false }
52+
);
5553
});

0 commit comments

Comments
 (0)
0