Skip to content

Commit 5d0b703

Browse files
jdillickjdillick
committed
Additional control to sort or exclude a sass partial. Update arcli component to use _reactium-style.scss, and no longer injects into another stylesheet. Adds reactium-gulp.js by default with partial.
1 parent 8235e62 commit 5d0b703

File tree

7 files changed

+87
-121
lines changed

7 files changed

+87
-121
lines changed

‎.core/.cli/commands/reactium/component/index.js

Lines changed: 2 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,6 @@
33
* Imports
44
* -----------------------------------------------------------------------------
55
*/
6-
7-
8-
9-
106
const path = require('path');
117
const fs = require('fs-extra');
128
const chalk = require('chalk');
@@ -210,10 +206,6 @@ const CONFORM = ({ input, props }) => {
210206
: val;
211207
break;
212208

213-
case 'inject':
214-
output[key] = formatImport(val, props);
215-
break;
216-
217209
default:
218210
output[key] = val;
219211
break;
@@ -244,30 +236,19 @@ const CONFORM = ({ input, props }) => {
244236
// Set the style import statement
245237
if (output.stylesheet === true) {
246238
const stylesheetFile = path.normalize(
247-
path.join(output.destination, '_style.scss'),
248-
);
249-
250-
const importString = output.inject.map(filepath =>
251-
path
252-
.relative(filepath, stylesheetFile)
253-
.replace(/^\..\//, '')
254-
.replace('_style.scss', 'style'),
239+
path.join(output.destination, '_reactium-style.scss'),
255240
);
256241

257242
output.stylesheet = {
258-
filename: '_style.scss',
243+
filename: '_reactium-style.scss',
259244
filepath: stylesheetFile,
260245
destination: output.destination,
261246
name: 'style',
262247
ext: '.scss',
263248
overwrite: '',
264-
inject: Array.from(output.inject),
265-
importString: importString,
266249
};
267250
}
268251

269-
delete output.inject;
270-
271252
return output;
272253
};
273254

@@ -416,25 +397,6 @@ const SCHEMA = ({ props }) => {
416397
return String(val).toUpperCase() === 'Y';
417398
},
418399
},
419-
inject: {
420-
pattern: /[0-9\s]/,
421-
description: `${chalk.white(
422-
'Import stylesheet to:',
423-
)} ${styles}\n ${chalk.white('Select:')}`,
424-
required: true,
425-
message: 'Select a number or list of numbers. Example: 1 2 3',
426-
ask: () => {
427-
try {
428-
return (
429-
prompt.override['stylesheet'] ||
430-
(prompt.history('stylesheet').value &&
431-
overwritable(prompt))
432-
);
433-
} catch (err) {
434-
return false;
435-
}
436-
},
437-
},
438400
services: {
439401
pattern: /^y|n|Y|N/,
440402
default: 'N',

‎.core/.cli/commands/reactium/style/actions.js

Lines changed: 29 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ const prettier = require('prettier');
55
const chalk = require('chalk');
66
const homedir = require('os').homedir();
77
const handlebars = require('handlebars').compile;
8+
const uuid = require('uuid/v4');
89

910
module.exports = spinner => {
1011
const message = text => {
@@ -76,48 +77,34 @@ module.exports = spinner => {
7677
});
7778
},
7879

79-
inject: ({ action, params }) => {
80-
const { importString = [], inject = [] } = params;
81-
82-
const promises =
83-
inject.length > 0
84-
? inject.map(
85-
(filepath, i) =>
86-
new Promise((resolve, reject) => {
87-
const istring = `\n@import '${
88-
importString[i]
89-
}';`;
90-
let content = fs.readFileSync(
91-
filepath,
92-
'utf-8',
93-
);
94-
if (content.indexOf(istring) < 0) {
95-
content += istring;
96-
fs.writeFile(filepath, content, error => {
97-
if (error) {
98-
reject(error);
99-
} else {
100-
resolve({
101-
action,
102-
filepath,
103-
status: 200,
104-
});
105-
}
106-
});
107-
} else {
108-
resolve({
109-
action,
110-
filepath,
111-
status: 200,
112-
});
113-
}
114-
}),
115-
)
116-
: [];
117-
118-
return promises.length > 0
119-
? Promise.all(promises)
120-
: new Promise(resolve => resolve({ action, status: 200 }));
80+
partialOrder: async ({ action, params }) => {
81+
const { destination, filename, filepath, overwrite } = params;
82+
83+
message(`reactium-gulp for ${chalk.cyan(filename)}...`);
84+
85+
fs.ensureDirSync(path.normalize(destination));
86+
const baseDir = path.basename(destination);
87+
const reactumGulp = path.resolve(destination, 'reactium-gulp.js');
88+
89+
// Template content
90+
const template = path.normalize(
91+
`${__dirname}/template/reactium-gulp.hbs`,
92+
);
93+
const content = handlebars(fs.readFileSync(template, 'utf-8'))({
94+
...params,
95+
id: uuid(),
96+
pattern: `/${baseDir}\\/${filename.replace('.scss', '')}/`,
97+
});
98+
99+
return new Promise((resolve, reject) => {
100+
fs.writeFile(reactumGulp, content, error => {
101+
if (error) {
102+
reject(error.Error);
103+
} else {
104+
resolve({ action, status: 200 });
105+
}
106+
});
107+
});
121108
},
122109
};
123110
};

‎.core/.cli/commands/reactium/style/index.js

Lines changed: 0 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -159,10 +159,6 @@ const CONFORM = ({ input, props }) => {
159159
output[key] = formatFilename(val);
160160
break;
161161

162-
case 'inject':
163-
output[key] = formatImport(val, props);
164-
break;
165-
166162
default:
167163
output[key] = val;
168164
break;
@@ -179,12 +175,6 @@ const CONFORM = ({ input, props }) => {
179175
const fnameReplace = output.filename.replace(/^_/, '').replace(ext, '');
180176
output['name'] = fnameReplace;
181177
output['ext'] = ext;
182-
output['importString'] = output.inject.map(filepath =>
183-
path
184-
.relative(filepath, output.filepath)
185-
.replace(/^\..\//, '')
186-
.replace(output.filename, fnameReplace),
187-
);
188178

189179
return output;
190180
};
@@ -277,26 +267,6 @@ const SCHEMA = ({ props }) => {
277267
return String(val).toLowerCase() === 'y';
278268
},
279269
},
280-
inject: {
281-
pattern: /[0-9\s]/,
282-
description: `${chalk.white(
283-
'Import to:',
284-
)} ${styles}\n ${chalk.white('Select:')}`,
285-
required: true,
286-
message: 'Select a number or list of numbers. Example: 1 2 3',
287-
ask: () => {
288-
let overwrite;
289-
try {
290-
overwrite =
291-
prompt.override['overwrite'] ||
292-
prompt.history('overwrite').value;
293-
} catch (err) {
294-
overwrite = true;
295-
}
296-
297-
return overwrite !== false;
298-
},
299-
},
300270
},
301271
};
302272
};

‎.core/.cli/commands/reactium/style/template/reactium-gulp.hbs

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
/**
2+
* For the purpose of organizing style partial DDD artifacts,
3+
* the following enums are defined (default ORGANISMS).
4+
*
5+
* ReactiumGulp.Enums.style.MIXINS = -1000
6+
* ReactiumGulp.Enums.style.VARIABLES = -900
7+
* ReactiumGulp.Enums.style.BASE = -800
8+
* ReactiumGulp.Enums.style.ATOMS = 0
9+
* ReactiumGulp.Enums.style.MOLECULES = 800
10+
* ReactiumGulp.Enums.style.ORGANISMS = 900
11+
* ReactiumGulp.Enums.style.OVERRIDES = 1000
12+
*
13+
* Set exclude to true to disable a partial by pattern.
14+
*/
15+
ReactiumGulp.Hook.registerSync('ddd-styles-partial', SassPartial => {
16+
SassPartial.register('{{id}}', {
17+
pattern: {{pattern}},
18+
exclude: false,
19+
order: ReactiumGulp.Enums.style.ORGANISMS,
20+
})
21+
});

‎.core/gulp.bootup.js

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,16 @@ global.LOG = global.BOOT;
6666

6767
global.ReactiumGulp = ReactiumGulp;
6868

69+
ReactiumGulp.Enums.style = {
70+
MIXINS: -1000,
71+
VARIABLES: -900,
72+
BASE: -800,
73+
ATOMS: 0,
74+
MOLECULES: 800,
75+
ORGANISMS: 900,
76+
OVERRIDES: 1000,
77+
};
78+
6979
// Load reactium-gulp DDD artifact from plugin sources
7080
globby([
7181
`${rootPath}/.core/**/reactium-gulp.js`,

‎.core/gulp.config.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -67,8 +67,8 @@ const defaultConfig = {
6767
'!{reactium_modules/**/_*.scss}',
6868
],
6969
styleDDD: [
70-
'src/**/*/_reactium-style.scss',
71-
'reactium_modules/**/*/_reactium-style.scss',
70+
'src/**/*/_reactium-style*.scss',
71+
'reactium_modules/**/*/_reactium-style*.scss',
7272
],
7373
assets: [
7474
'.core/assets/**/*',

‎.core/gulp.tasks.js

Lines changed: 23 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -540,13 +540,13 @@ $assets: (
540540
};
541541

542542
const dddStylesPartial = done => {
543-
const SassPartialSort = ReactiumGulp.Utils.registryFactory(
544-
'SassPartialSort',
543+
const SassPartialRegistry = ReactiumGulp.Utils.registryFactory(
544+
'SassPartialRegistry',
545545
'id',
546546
ReactiumGulp.Utils.Registry.MODES.CLEAN,
547547
);
548548

549-
ReactiumGulp.Hook.runSync('ddd-styles-partial-sort', SassPartialSort);
549+
ReactiumGulp.Hook.runSync('ddd-styles-partial', SassPartialRegistry);
550550

551551
const stylePartials = globby
552552
.sync(config.src.styleDDD)
@@ -563,19 +563,35 @@ $assets: (
563563
.map(partial => partial.replace(/\.scss$/, ''))
564564
.sort((a, b) => {
565565
const aMatch =
566-
SassPartialSort.list.find(({ pattern }) =>
566+
SassPartialRegistry.list.find(({ pattern }) =>
567567
pattern.test(a),
568568
) || {};
569569
const bMatch =
570-
SassPartialSort.list.find(({ pattern }) =>
570+
SassPartialRegistry.list.find(({ pattern }) =>
571571
pattern.test(b),
572572
) || {};
573-
const aOrder = op.get(aMatch, 'order', 0);
574-
const bOrder = op.get(bMatch, 'order', 0);
573+
574+
const aOrder = op.get(
575+
aMatch,
576+
'order',
577+
ReactiumGulp.Enums.style.ORGANISMS,
578+
);
579+
const bOrder = op.get(
580+
bMatch,
581+
'order',
582+
ReactiumGulp.Enums.style.ORGANISMS,
583+
);
575584

576585
if (aOrder > bOrder) return 1;
577586
else if (bOrder > aOrder) return -1;
578587
return 0;
588+
})
589+
.filter(partial => {
590+
const match =
591+
SassPartialRegistry.list.find(({ pattern }) =>
592+
pattern.test(partial),
593+
) || {};
594+
return !match || op.get(match, 'exclude', false) !== true;
579595
});
580596

581597
const template = handlebars.compile(`

0 commit comments

Comments
 (0)