Skip to content

Commit cc8511c

Browse files
authored
Migrate postcss-logical (#39)
* Migrate postcss-logical * Migrate postcss-logical
1 parent cc42421 commit cc8511c

21 files changed

+94
-221
lines changed

plugins/postcss-logical/.editorconfig

-15
This file was deleted.

plugins/postcss-logical/.github/workflows/test.yml

-18
This file was deleted.

plugins/postcss-logical/.gitignore

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
11
node_modules
2-
index.*.*
2+
dist
33
package-lock.json
44
yarn.lock
55
*.log*
66
*.result.css
7-
.*
7+
*.result.css.map
88
!.editorconfig
99
!.gitignore
1010
!.rollup.js
1111
!.tape.js
12+
!.travis.yml
1213
!.github

plugins/postcss-logical/.rollup.js

-17
This file was deleted.

plugins/postcss-logical/CONTRIBUTING.md

-65
This file was deleted.

plugins/postcss-logical/INSTALL.md

+2-10
Original file line numberDiff line numberDiff line change
@@ -14,15 +14,7 @@ Add [PostCSS Logical Properties and Values] to your project:
1414
npm install postcss-logical --save-dev
1515
```
1616

17-
Use [PostCSS Logical Properties and Values] to process your CSS:
18-
19-
```js
20-
const postcssLogical = require('postcss-logical');
21-
22-
postcssLogical.process(YOUR_CSS /*, processOptions, pluginOptions */);
23-
```
24-
25-
Or use it as a [PostCSS] plugin:
17+
Use [PostCSS Logical Properties and Values] as a [PostCSS] plugin:
2618

2719
```js
2820
const postcss = require('postcss');
@@ -167,6 +159,6 @@ grunt.initConfig({
167159
[PostCSS]: https://github.com/postcss/postcss
168160
[PostCSS CLI]: https://github.com/postcss/postcss-cli
169161
[PostCSS Loader]: https://github.com/postcss/postcss-loader
170-
[PostCSS Logical Properties and Values]: https://github.com/csstools/postcss-logical
162+
[PostCSS Logical Properties and Values]: https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-logical
171163
[React App Rewire PostCSS]: https://github.com/csstools/react-app-rewire-postcss
172164
[React App Rewired]: https://github.com/timarney/react-app-rewired

plugins/postcss-logical/README.md

+4-12
Original file line numberDiff line numberDiff line change
@@ -142,15 +142,7 @@ Add [PostCSS Logical Properties and Values] to your project:
142142
npm install postcss-logical --save-dev
143143
```
144144

145-
Use [PostCSS Logical Properties and Values] to process your CSS:
146-
147-
```js
148-
const postcssLogical = require('postcss-logical');
149-
150-
postcssLogical.process(YOUR_CSS /*, processOptions, pluginOptions */);
151-
```
152-
153-
Or use it as a [PostCSS] plugin:
145+
Use [PostCSS Logical Properties and Values] as a [PostCSS] plugin:
154146

155147
```js
156148
const postcss = require('postcss');
@@ -186,8 +178,8 @@ the `dir` option will be ignored.
186178

187179
[css-img]: https://cssdb.org/badge/logical-properties-and-values.svg
188180
[css-url]: https://cssdb.org/#logical-properties-and-values
189-
[cli-img]: https://github.com/csstools/postcss-logical/workflows/test/badge.svg
190-
[cli-url]: https://github.com/csstools/postcss-logical/actions/workflows/test.yml?query=workflow/test
181+
[cli-img]: https://github.com/csstools/postcss-plugins/workflows/test/badge.svg
182+
[cli-url]: https://github.com/csstools/postcss-plugins/actions/workflows/test.yml?query=workflow/test
191183
[git-img]: https://img.shields.io/badge/support-chat-blue.svg
192184
[git-url]: https://gitter.im/postcss/postcss
193185
[npm-img]: https://img.shields.io/npm/v/postcss-logical.svg
@@ -198,4 +190,4 @@ the `dir` option will be ignored.
198190
[Grunt PostCSS]: https://github.com/nDmitry/grunt-postcss
199191
[PostCSS]: https://github.com/postcss/postcss
200192
[PostCSS Loader]: https://github.com/postcss/postcss-loader
201-
[PostCSS Logical Properties and Values]: https://github.com/csstools/postcss-logical
193+
[PostCSS Logical Properties and Values]: https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-logical

plugins/postcss-logical/package.json

+27-40
Original file line numberDiff line numberDiff line change
@@ -4,54 +4,36 @@
44
"description": "Use logical properties and values in CSS",
55
"author": "Jonathan Neal <jonathantneal@hotmail.com>",
66
"license": "CC0-1.0",
7-
"repository": "csstools/postcss-logical",
8-
"homepage": "https://github.com/csstools/postcss-logical#readme",
9-
"bugs": "https://github.com/csstools/postcss-logical/issues",
10-
"main": "index.cjs.js",
11-
"module": "index.esm.mjs",
7+
"homepage": "https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-logical#readme",
8+
"bugs": "https://github.com/csstools/postcss-plugins/issues",
9+
"main": "dist/index.cjs",
10+
"module": "dist/index.mjs",
1211
"files": [
13-
"index.cjs.js",
14-
"index.cjs.js.map",
15-
"index.esm.mjs",
16-
"index.esm.mjs.map"
12+
"CHANGELOG.md",
13+
"INSTALL.md",
14+
"LICENSE.md",
15+
"README.md",
16+
"dist"
1717
],
18+
"bin": {
19+
"postcss-logical": "dist/cli.mjs"
20+
},
1821
"scripts": {
19-
"build": "rollup --config .rollup.js --silent",
20-
"prepublishOnly": "npm test",
21-
"pretest:tape": "npm run build",
22-
"test": "npm run test:js && npm run test:tape",
23-
"test:js": "eslint src/{*,**/*}.js --cache --ignore-path .gitignore --quiet",
24-
"test:tape": "postcss-tape"
22+
"prepublishOnly": "npm run build && npm run test",
23+
"lint": "eslint src/**/*.js",
24+
"test": "postcss-tape",
25+
"build": "rollup -c ../../rollup/default.js",
26+
"stryker": "stryker run --logLevel error"
2527
},
2628
"engines": {
27-
"node": ">=12"
28-
},
29-
"peerDependencies": {
30-
"postcss": "^8.3"
29+
"node": "^12 || ^14 || >=16"
3130
},
3231
"devDependencies": {
33-
"@babel/core": "7.15.5",
34-
"@babel/preset-env": "7.15.6",
35-
"@rollup/plugin-babel": "5.3.0",
36-
"eslint": "7.32.0",
3732
"postcss": "8.3.6",
38-
"postcss-tape": "6.0.1",
39-
"pre-commit": "1.2.2",
40-
"rollup": "2.56.3"
33+
"postcss-tape": "6.0.1"
4134
},
42-
"eslintConfig": {
43-
"env": {
44-
"browser": true,
45-
"es6": true,
46-
"node": true
47-
},
48-
"extends": "eslint:recommended",
49-
"parserOptions": {
50-
"ecmaVersion": 2020,
51-
"impliedStrict": true,
52-
"sourceType": "module"
53-
},
54-
"root": true
35+
"peerDependencies": {
36+
"postcss": "^8.3"
5537
},
5638
"keywords": [
5739
"postcss",
@@ -80,5 +62,10 @@
8062
"padding",
8163
"size",
8264
"text"
83-
]
65+
],
66+
"repository": {
67+
"type": "git",
68+
"url": "https://github.com/csstools/postcss-plugins.git",
69+
"directory": "plugins/postcss-logical"
70+
}
8471
}

plugins/postcss-logical/src/cli.js

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import plugin from './index';
2+
import { cli, helpTextLogger } from '@csstools/base-cli';
3+
4+
cli(
5+
plugin,
6+
['dir', 'preserve'],
7+
helpTextLogger(
8+
'postcss-logical',
9+
'PostCSS Logical',
10+
'Lets you use logical, rather than physical, direction and dimension mappings in CSS, following the CSS Logical Properties and Values specification.',
11+
{
12+
dir: 'ltr|rtl',
13+
preserve: true,
14+
},
15+
),
16+
);

plugins/postcss-logical/src/index.js

+6-6
Original file line numberDiff line numberDiff line change
@@ -29,8 +29,8 @@ function postcssLogicalProperties(opts) {
2929
if (!parent.nodes.length) {
3030
parent.remove();
3131
}
32-
}
33-
}
32+
};
33+
};
3434

3535
const makeTransformWithoutSplittingValues = (transform) => {
3636
return (decl) => {
@@ -40,8 +40,8 @@ function postcssLogicalProperties(opts) {
4040
if (!parent.nodes.length) {
4141
parent.remove();
4242
}
43-
}
44-
}
43+
};
44+
};
4545

4646
return {
4747
postcssPlugin: 'postcss-logical-properties',
@@ -126,8 +126,8 @@ function postcssLogicalProperties(opts) {
126126

127127
// Transition helpers
128128
'transition': makeTransform(transformTransition),
129-
'transition-property': makeTransform(transformTransition)
130-
}
129+
'transition-property': makeTransform(transformTransition),
130+
},
131131
};
132132
}
133133
postcssLogicalProperties.postcss = true;

plugins/postcss-logical/src/lib/clone-decl.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,5 +3,5 @@ import matchInsetPrefix from './match-inset-prefix';
33

44
export default (decl, suffix, value) => decl.cloneBefore({
55
prop: `${decl.prop.replace(matchSide, '$1')}${suffix}`.replace(matchInsetPrefix, ''),
6-
value
6+
value,
77
});

plugins/postcss-logical/src/lib/clone-rule.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,10 @@ import postcss from 'postcss';
22

33
export default (decl, dir) => {
44
const rule = Object(decl.parent).type === 'rule' ? decl.parent.cloneBefore({
5-
raws: {}
5+
raws: {},
66
}).removeAll() : postcss.rule({ selector: '&' });
77

8-
rule.assign({'selectors': rule.selectors.map(selector => `${selector}:dir(${dir})`)})
8+
rule.assign({'selectors': rule.selectors.map(selector => `${selector}:dir(${dir})`)});
99

1010
return rule;
1111
};

plugins/postcss-logical/src/lib/split.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ function splitByRegExp(string, re, isTrimmed) {
4444
buffer = '';
4545
split = false;
4646
} else {
47-
buffer += char
47+
buffer += char;
4848
}
4949
}
5050

plugins/postcss-logical/src/lib/transform-border-radius.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -24,13 +24,13 @@ export default (decl, values, dir, preserve) => {
2424

2525
function lDecl(decl) {
2626
return decl.cloneBefore({
27-
prop: decl.prop.replace(logicalRadii, ($, prefix, direction, suffix) => `${prefix}${ltrRadii[direction]}${suffix}`)
27+
prop: decl.prop.replace(logicalRadii, ($, prefix, direction, suffix) => `${prefix}${ltrRadii[direction]}${suffix}`),
2828
});
2929
}
3030

3131
function rDecl(decl) {
3232
return decl.cloneBefore({
33-
prop: decl.prop.replace(logicalRadii, ($, prefix, direction, suffix) => `${prefix}${rtlRadii[direction]}${suffix}`)
33+
prop: decl.prop.replace(logicalRadii, ($, prefix, direction, suffix) => `${prefix}${rtlRadii[direction]}${suffix}`),
3434
});
3535
}
3636

0 commit comments

Comments
 (0)