Skip to content
This repository was archived by the owner on Jun 6, 2022. It is now read-only.

Commit 6380b00

Browse files
jonathantnealjonathantneal
committed
5.1.0
1 parent aadf18c commit 6380b00

13 files changed

+474
-40
lines changed

‎.tape.js

+185
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,36 @@ module.exports = {
1919
}
2020
}
2121
},
22+
'basic:import-fn': {
23+
message: 'supports { importFrom() } usage',
24+
options: {
25+
importFrom() {
26+
return {
27+
customSelectors: {
28+
':--heading': 'h1, h2, h3'
29+
}
30+
};
31+
}
32+
},
33+
expect: 'basic.import.expect.css',
34+
result: 'basic.import.result.css'
35+
},
36+
'basic:import-fn-promise': {
37+
message: 'supports { async importFrom() } usage',
38+
options: {
39+
importFrom() {
40+
return new Promise(resolve => {
41+
resolve({
42+
customSelectors: {
43+
':--heading': 'h1, h2, h3'
44+
}
45+
})
46+
});
47+
}
48+
},
49+
expect: 'basic.import.expect.css',
50+
result: 'basic.import.result.css'
51+
},
2252
'basic:import-json': {
2353
message: 'supports { importFrom: "test/import-selectors.json" } usage',
2454
options: {
@@ -42,6 +72,161 @@ module.exports = {
4272
},
4373
expect: 'basic.import.expect.css',
4474
result: 'basic.import.result.css'
75+
},
76+
'basic:import-css-from': {
77+
message: 'supports { importFrom: { from: "test/import-selectors.css" } } usage',
78+
options: {
79+
importFrom: { from: 'test/import-selectors.css' }
80+
},
81+
expect: 'basic.import.expect.css',
82+
result: 'basic.import.result.css'
83+
},
84+
'basic:import-css-from-type': {
85+
message: 'supports { importFrom: [ { from: "test/import-selectors.css", type: "css" } ] } usage',
86+
options: {
87+
importFrom: [ { from: 'test/import-selectors.css', type: 'css' } ]
88+
},
89+
expect: 'basic.import.expect.css',
90+
result: 'basic.import.result.css'
91+
},
92+
'basic:export': {
93+
message: 'supports { exportTo: { customSelectors: { ... } } } usage',
94+
options: {
95+
exportTo: (global.__exportSelectorObject = global.__exportSelectorObject || {
96+
customSelectors: null
97+
})
98+
},
99+
expect: 'basic.expect.css',
100+
result: 'basic.result.css',
101+
after() {
102+
if (__exportSelectorObject.customSelectors[':--foo'] !== '.foo') {
103+
throw new Error('The exportTo function failed');
104+
}
105+
}
106+
},
107+
'basic:export-fn': {
108+
message: 'supports { exportTo() } usage',
109+
options: {
110+
exportTo(customProperties) {
111+
if (customProperties[':--foo'] !== '.foo') {
112+
throw new Error('The exportTo function failed');
113+
}
114+
}
115+
},
116+
expect: 'basic.expect.css',
117+
result: 'basic.result.css'
118+
},
119+
'basic:export-fn-promise': {
120+
message: 'supports { async exportTo() } usage',
121+
options: {
122+
exportTo(customProperties) {
123+
return new Promise((resolve, reject) => {
124+
if (customProperties[':--foo'] !== '.foo') {
125+
reject('The exportTo function failed');
126+
} else {
127+
resolve();
128+
}
129+
});
130+
}
131+
},
132+
expect: 'basic.expect.css',
133+
result: 'basic.result.css'
134+
},
135+
'basic:export-json': {
136+
message: 'supports { exportTo: "test/export-selectors.json" } usage',
137+
options: {
138+
exportTo: 'test/export-selectors.json'
139+
},
140+
expect: 'basic.expect.css',
141+
result: 'basic.result.css',
142+
before() {
143+
global.__exportSelectorsString = require('fs').readFileSync('test/export-selectors.json', 'utf8');
144+
},
145+
after() {
146+
if (global.__exportSelectorsString !== require('fs').readFileSync('test/export-selectors.json', 'utf8')) {
147+
throw new Error('The original file did not match the freshly exported copy');
148+
}
149+
}
150+
},
151+
'basic:export-js': {
152+
message: 'supports { exportTo: "test/export-selectors.js" } usage',
153+
options: {
154+
exportTo: 'test/export-selectors.js'
155+
},
156+
expect: 'basic.expect.css',
157+
result: 'basic.result.css',
158+
before() {
159+
global.__exportSelectorsString = require('fs').readFileSync('test/export-selectors.js', 'utf8');
160+
},
161+
after() {
162+
if (global.__exportSelectorsString !== require('fs').readFileSync('test/export-selectors.js', 'utf8')) {
163+
throw new Error('The original file did not match the freshly exported copy');
164+
}
165+
}
166+
},
167+
'basic:export-mjs': {
168+
message: 'supports { exportTo: "test/export-selectors.mjs" } usage',
169+
options: {
170+
exportTo: 'test/export-selectors.mjs'
171+
},
172+
expect: 'basic.expect.css',
173+
result: 'basic.result.css',
174+
before() {
175+
global.__exportSelectorsString = require('fs').readFileSync('test/export-selectors.mjs', 'utf8');
176+
},
177+
after() {
178+
if (global.__exportSelectorsString !== require('fs').readFileSync('test/export-selectors.mjs', 'utf8')) {
179+
throw new Error('The original file did not match the freshly exported copy');
180+
}
181+
}
182+
},
183+
'basic:export-css': {
184+
message: 'supports { exportTo: "test/export-selectors.css" } usage',
185+
options: {
186+
exportTo: 'test/export-selectors.css'
187+
},
188+
expect: 'basic.expect.css',
189+
result: 'basic.result.css',
190+
before() {
191+
global.__exportSelectorsString = require('fs').readFileSync('test/export-selectors.css', 'utf8');
192+
},
193+
after() {
194+
if (global.__exportSelectorsString !== require('fs').readFileSync('test/export-selectors.css', 'utf8')) {
195+
throw new Error('The original file did not match the freshly exported copy');
196+
}
197+
}
198+
},
199+
'basic:export-css-to': {
200+
message: 'supports { exportTo: { to: "test/export-selectors.css" } } usage',
201+
options: {
202+
exportTo: { to: 'test/export-selectors.css' }
203+
},
204+
expect: 'basic.expect.css',
205+
result: 'basic.result.css',
206+
before() {
207+
global.__exportSelectorsString = require('fs').readFileSync('test/export-selectors.css', 'utf8');
208+
},
209+
after() {
210+
if (global.__exportSelectorsString !== require('fs').readFileSync('test/export-selectors.css', 'utf8')) {
211+
throw new Error('The original file did not match the freshly exported copy');
212+
}
213+
}
214+
},
215+
'basic:export-css-to-type': {
216+
message: 'supports { exportTo: { to: "test/export-selectors.css", type: "css" } } usage',
217+
options: {
218+
exportTo: { to: 'test/export-selectors.css', type: 'css' }
219+
},
220+
expect: 'basic.expect.css',
221+
result: 'basic.result.css',
222+
before() {
223+
global.__exportSelectorsString = require('fs').readFileSync('test/export-selectors.css', 'utf8');
224+
},
225+
after() {
226+
if (global.__exportSelectorsString !== require('fs').readFileSync('test/export-selectors.css', 'utf8')) {
227+
throw new Error('The original file did not match the freshly exported copy');
228+
}
229+
}
45230
}
46231
}
47232
};

‎CHANGELOG.md

+5
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,10 @@
11
# Changes to PostCSS Custom Selectors
22

3+
### 5.1.0 (September 12, 2018)
4+
5+
- Added: New `exportTo` function to specify where to export custom selectors
6+
- Updated: `importFrom` option to support passing it a function
7+
38
### 5.0.0 (September 7, 2018)
49

510
- Added: New `preserve` option to preserve custom selectors and rules using them

‎CONTRIBUTING.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ scope and avoid unrelated commits.
2626
cd postcss-custom-selectors
2727

2828
# Assign the original repo to a remote called "upstream"
29-
git remote add upstream git@github.com:jonathantneal/postcss-custom-selectors.git
29+
git remote add upstream git@github.com:postcss/postcss-custom-selectors.git
3030

3131
# Install the tools necessary for testing
3232
npm install

‎INSTALL.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -164,7 +164,7 @@ grunt.initConfig({
164164
[Grunt PostCSS]: https://github.com/nDmitry/grunt-postcss
165165
[PostCSS]: https://github.com/postcss/postcss
166166
[PostCSS CLI]: https://github.com/postcss/postcss-cli
167-
[PostCSS Custom Selectors]: https://github.com/jonathantneal/postcss-custom-selectors
167+
[PostCSS Custom Selectors]: https://github.com/postcss/postcss-custom-selectors
168168
[PostCSS Loader]: https://github.com/postcss/postcss-loader
169169
[React App Rewire PostCSS]: https://github.com/csstools/react-app-rewire-postcss
170170
[React App Rewired]: https://github.com/timarney/react-app-rewired

‎README.md

+46-9
Original file line numberDiff line numberDiff line change
@@ -76,12 +76,12 @@ article :--heading + p {}
7676
### importFrom
7777

7878
The `importFrom` option specifies sources where custom selectors can be
79-
imported from, which might be CSS, JS, and JSON files, and directly passed
80-
objects.
79+
imported from, which might be CSS, JS, and JSON files, functions, and directly
80+
passed objects.
8181

8282
```js
8383
postcssCustomSelectors({
84-
importFrom: 'path/to/file.css' // => @custom-selector h1, h2, h3
84+
importFrom: 'path/to/file.css' // => @custom-selector :--heading h1, h2, h3;
8585
});
8686
```
8787

@@ -95,9 +95,9 @@ article :--heading + p {
9595
article h1 + p, article h2 + p, article h3 + p {}
9696
```
9797

98-
Multiple files can be passed into this option, and they will be parsed in the
99-
order they are received. JavaScript files, JSON files, and objects will need
100-
to namespace custom selectors using the `customProperties` or
98+
Multiple sources can be passed into this option, and they will be parsed in the
99+
order they are received. JavaScript files, JSON files, functions, and objects
100+
will need to namespace custom selectors using the `customProperties` or
101101
`custom-properties` key.
102102

103103
```js
@@ -107,9 +107,46 @@ postcssCustomSelectors({
107107
'and/then/this.js',
108108
'and/then/that.json',
109109
{
110-
customSelectors: {
111-
':--heading': 'h1, h2, h3'
112-
}
110+
customSelectors: { ':--heading': 'h1, h2, h3' }
111+
},
112+
() => {
113+
const customProperties = { ':--heading': 'h1, h2, h3' };
114+
115+
return { customProperties };
116+
}
117+
]
118+
});
119+
```
120+
121+
### exportTo
122+
123+
The `exportTo` option specifies destinations where custom selectors can be
124+
exported to, which might be CSS, JS, and JSON files, functions, and directly
125+
passed objects.
126+
127+
```js
128+
postcssCustomSelectors({
129+
exportTo: 'path/to/file.css' // @custom-selector :--heading h1, h2, h3;
130+
});
131+
```
132+
133+
Multiple destinations can be passed into this option, and they will be parsed
134+
in the order they are received. JavaScript files, JSON files, and objects will
135+
need to namespace custom selectors using the `customProperties` or
136+
`custom-properties` key.
137+
138+
```js
139+
const cachedObject = { customSelectors: {} };
140+
141+
postcssCustomSelectors({
142+
exportTo: [
143+
'path/to/file.css', // @custom-selector :--heading h1, h2, h3;
144+
'and/then/this.js', // module.exports = { customSelectors: { ':--heading': 'h1, h2, h3' } }
145+
'and/then/this.mjs', // export const customSelectors = { ':--heading': 'h1, h2, h3' } }
146+
'and/then/that.json', // { "custom-selectors": { ":--heading": "h1, h2, h3" } }
147+
cachedObject,
148+
customProperties => {
149+
customProperties // { ':--heading': 'h1, h2, h3' }
113150
}
114151
]
115152
});

‎index.js

+7-1
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,18 @@ import postcss from 'postcss';
22
import getCustomSelectors from './lib/custom-selectors-from-root';
33
import transformRules from './lib/transform-rules';
44
import importCustomSelectorsFromSources from './lib/import-from';
5+
import exportCustomSelectorsToDestinations from './lib/export-to';
56

67
export default postcss.plugin('postcss-custom-selectors', opts => {
78
// whether to preserve custom selectors and rules using them
89
const preserve = Boolean(Object(opts).preserve);
910

10-
// sources from where to import custom selectors
11+
// sources to import custom selectors from
1112
const importFrom = [].concat(Object(opts).importFrom || []);
1213

14+
// destinations to export custom selectors to
15+
const exportTo = [].concat(Object(opts).exportTo || []);
16+
1317
// promise any custom selectors are imported
1418
const customSelectorsPromise = importCustomSelectorsFromSources(importFrom);
1519

@@ -19,6 +23,8 @@ export default postcss.plugin('postcss-custom-selectors', opts => {
1923
getCustomSelectors(root, { preserve })
2024
);
2125

26+
await exportCustomSelectorsToDestinations(customProperties, exportTo);
27+
2228
transformRules(root, customProperties, { preserve });
2329
};
2430
});

0 commit comments

Comments
 (0)