@penskemediacorp/larva 1.25.0 → 1.28.0

package/scripts/build-html.js

@@ -9,14 +9,17 @@ const getAllPatternsObj = require( '../lib/utils/getAllPatternsObj' );
 
 const config = getAppConfiguration( 'patterns' );
 const cliArgs = getArgsFromCli();
-const source = 'larva' === cliArgs[1] ? 'larva' : 'project';
-const port = process.env.NODE_PORT || '3000' ;
+const source = 'larva' === cliArgs[ 1 ] ? 'larva' : 'project';
+const port = process.env.NODE_PORT || '3000';
 
 const urlBase = 'http://localhost:' + port + '/' + source;
 const buildPath = path.join( process.cwd(), './build/html/' + source );
 
 const patternsObj = ( () => {
-	const patternDir = 'larva' === source ? config.larvaPatternsDir : config.projectPatternsDir;
+	const patternDir =
+		'larva' === source
+			? config.larvaPatternsDir
+			: config.projectPatternsDir;
 	return getAllPatternsObj( patternDir );
 } )();
 
@@ -32,7 +35,7 @@ const staticPaths = [
 	'',
 ];
 
-staticPaths.forEach( p => {
+staticPaths.forEach( ( p ) => {
 	// Only build these paths for the larva source.
 	if ( p === 'style-guide' || p === 'css' ) {
 		if ( 'larva' !== source ) {
@@ -40,13 +43,17 @@ staticPaths.forEach( p => {
 		}
 	}
 
-	routesArr.push( p )
-});
-
-generateStatic( routesArr, buildPath, ( message ) => {
-
-	// TODO: copy assets into build path
-	// copy assets from larva package to static
-	// copy assets from project to assets
-	console.log( message );
-}, urlBase );
+	routesArr.push( p );
+} );
+
+generateStatic(
+	routesArr,
+	buildPath,
+	( message ) => {
+		// TODO: copy assets into build path
+		// copy assets from larva package to static
+		// copy assets from project to assets
+		console.log( message );
+	},
+	urlBase
+);

package/scripts/build-icons.js

@@ -1,14 +1,17 @@
 'use strict';
 
-const SVGSpriter = require('svg-sprite');
-const path = require('path');
-const mkdirp = require('mkdirp');
-const globby = require('globby');
-const fs = require('fs');
+const SVGSpriter = require( 'svg-sprite' );
+const path = require( 'path' );
+const mkdirp = require( 'mkdirp' );
+const globby = require( 'globby' );
+const fs = require( 'fs' );
 const svgoConfig = require( './config/svgo-config.json' );
 
 const projectIconsPath = path.join( process.cwd(), './src/svg/icons' );
-const larvaIconsPath = path.join( process.cwd(), './node_modules/@penskemediacorp/larva-svg/src' );
+const larvaIconsPath = path.join(
+	process.cwd(),
+	'./node_modules/@penskemediacorp/larva-svg/src'
+);
 
 // TODO: unfinished feature
 // const getSassVarsString = require( './lib/getSassVarsString' );
@@ -19,20 +22,20 @@ const config = {
 	mode: {
 		defs: {
 			example: true,
-			sprite: 'sprite.defs.svg'
-		}
+			sprite: 'sprite.defs.svg',
+		},
 	},
 	shape: {
 		id: {
 			separator: '',
 		},
 		transform: {
-			svgo: svgoConfig
-		}
+			svgo: svgoConfig,
+		},
 	},
 	svg: {
 		dimensionAttributes: false,
-	}
+	},
 };
 
 const spriter = new SVGSpriter( config );
@@ -40,21 +43,30 @@ const spriter = new SVGSpriter( config );
 const svgFiles = globby.sync( [ larvaIconsPath, projectIconsPath ], {
 	expandDirectories: {
 		extensions: [ 'svg' ],
-	}
-});
+	},
+} );
 
 // TODO: unfinished feature
 // let scssIcons = {};
 
-console.log( `Looking for icon SVGs in ${path.relative( process.cwd(), larvaIconsPath )} and ${path.relative( process.cwd(), projectIconsPath )}...` );
+console.log(
+	`Looking for icon SVGs in ${ path.relative(
+		process.cwd(),
+		larvaIconsPath
+	) } and ${ path.relative( process.cwd(), projectIconsPath ) }...`
+);
 
-svgFiles.forEach( file => {
+svgFiles.forEach( ( file ) => {
 	// TODO: unfinished feature.
 	// Build Sass vars object
 	// scssIcons[ path.basename( file, '.svg' ) ] = fs.readFileSync( file, { encoding: 'utf-8' } );
 
-	spriter.add( file, path.basename( file ), fs.readFileSync( file, { encoding: 'utf-8' } ) );
-});
+	spriter.add(
+		file,
+		path.basename( file ),
+		fs.readFileSync( file, { encoding: 'utf-8' } )
+	);
+} );
 
 console.log( 'Building SVG icon sprite...' );
 
@@ -63,18 +75,18 @@ console.log( 'Building SVG icon sprite...' );
 // fs.writeFileSync( path.join( process.cwd(), './build/a-icon-svg.scss' ), getSassVarsString( scssIcons ) );
 
 // Compile the sprite
-spriter.compile( function( error, result, cssData ) {
-
+spriter.compile( function ( error, result, cssData ) {
 	// Run through all configured output modes
-	for ( var mode in result ) {
-
+	for ( const mode in result ) {
 		// Run through all created resources and write them to disk
-		for ( var type in result[mode] ) {
-			mkdirp.sync( path.dirname( result[mode][type].path ) );
-			fs.writeFileSync( result[mode][type].path, result[mode][type].contents );
+		for ( const type in result[ mode ] ) {
+			mkdirp.sync( path.dirname( result[ mode ][ type ].path ) );
+			fs.writeFileSync(
+				result[ mode ][ type ].path,
+				result[ mode ][ type ].contents
+			);
 		}
-
 	}
 
 	console.log( 'Completed building SVG icon sprite.' );
-});
+} );

package/scripts/build-scss.js

@@ -9,7 +9,7 @@ const args = [
 	'--gulpfile',
 	gulpfilePath,
 	'--cwd',
-	process.cwd()
+	process.cwd(),
 ];
 
 spawnScript( './node_modules/.bin/gulp', args );

package/scripts/config/.eslintrc.json

@@ -7,5 +7,6 @@
 		"rules": {
 			"import/no-unresolved": "off"
 		}
-	} ]
+	} ],
+	"root": true
 }

package/scripts/config/gulpfile.js

@@ -65,7 +65,6 @@ const buildScss = (
 	minify = false,
 	generateImportantVariants = false
 ) => {
-
 	if ( minify ) {
 		sassOpts.outputStyle = 'compressed';
 	}

package/scripts/config/stylelint.config.js

@@ -1,5 +1,5 @@
 const rules = {
-	'extends': '@penskemediacorp/stylelint-config'
+	extends: '@penskemediacorp/stylelint-config',
 };
 
 module.exports = rules;

package/scripts/config/webpack.config.js

@@ -1,5 +1,5 @@
 const path = require( 'path' );
-const ESLintPlugin = require('eslint-webpack-plugin');
+const ESLintPlugin = require( 'eslint-webpack-plugin' );
 
 const getConfig = require( '../../index' ).getConfig;
 
@@ -11,21 +11,20 @@ const entries = getConfig( 'webpack' ).entries;
 const aliases = {
 	'@larva-js': path.resolve( './node_modules/@penskemediacorp/larva-js/src' ),
 	'@npm': path.resolve( './node_modules/' ),
-	... getConfig( 'webpack' ).aliases
+	...getConfig( 'webpack' ).aliases,
 };
 
 const eslintConfig = getConfig( 'eslint', true );
-const eslintConfigFile = undefined !== eslintConfig ? eslintConfig.configFile : null;
+const eslintConfigFile =
+	undefined !== eslintConfig ? eslintConfig.configFile : null;
 
 // Tools
 const { CleanWebpackPlugin } = require( 'clean-webpack-plugin' );
 
-
 //=========================================================
 //  Rules
 //---------------------------------------------------------
 const rules = {
-
 	/**
 	 * JS Loaders
 	 */
@@ -40,16 +39,16 @@ const rules = {
 		exclude: /(node_modules|nobundle|vendor)/,
 		loader: 'babel-loader',
 		query: {
-			presets: [ '@babel/preset-env' ]
-		}
-	}
+			presets: [ '@babel/preset-env' ],
+		},
+	},
 };
 
 const plugins = {
 	cleanup: new CleanWebpackPlugin(),
-	eslint: new ESLintPlugin({
-		overrideConfigFile: eslintConfigFile
-	})
+	eslint: new ESLintPlugin( {
+		overrideConfigFile: eslintConfigFile,
+	} ),
 };
 
 //=========================================================
@@ -59,35 +58,38 @@ const config = {
 	entry: entries,
 	output: {
 		path: BUILD_DIR,
-		filename: '[name].js'
+		filename: '[name].js',
 	},
 	module: {
-		rules: [ rules.js ]
+		rules: [ rules.js ],
 	},
 	watch: false,
 	watchOptions: {
-		ignored: /node_modules/
+		ignored: /node_modules/,
 	},
 	resolve: {
-		alias: aliases
+		alias: aliases,
 	},
 	optimization: {
-		minimize: true
-	}
+		minimize: true,
+	},
 };
 
 module.exports = ( env, argv ) => {
-
 	if ( 'development' === argv.mode ) {
 		config.devtool = 'source-map';
-		config.module.rules = ( config.module.rules || [] ).concat( [ rules.pre ] );
+		config.module.rules = ( config.module.rules || [] ).concat( [
+			rules.pre,
+		] );
 		config.plugins = [ plugins.eslint ];
 	}
 
 	if ( 'production' === argv.mode ) {
 		console.log( 'Building Prod JS..' );
 
-		config.module.rules = ( config.module.rules || [] ).concat( [ rules.pre ] );
+		config.module.rules = ( config.module.rules || [] ).concat( [
+			rules.pre,
+		] );
 		config.plugins = [ plugins.eslint, plugins.cleanup ];
 	}
 

package/scripts/dev-js.js

@@ -7,7 +7,7 @@ const configPath = path.join( __dirname, './config/webpack.config.js' );
 const args = [
 	`--config=${ configPath }`,
 	'--mode=development',
-	'--watch=true'
+	'--watch=true',
 ];
 
 spawnScript( './node_modules/.bin/webpack', args );

package/scripts/dev-scss.js

@@ -10,11 +10,6 @@ const gulpfilePath = path.join( __dirname, './config/gulpfile.js' );
 
 spawn.sync(
 	'./node_modules/.bin/gulp',
-	[
-		'--gulpfile',
-		gulpfilePath,
-		'--cwd',
-		process.cwd(),
-		... cliArgs
-	], { stdio: 'inherit' }
+	[ '--gulpfile', gulpfilePath, '--cwd', process.cwd(), ...cliArgs ],
+	{ stdio: 'inherit' }
 );

package/scripts/help.js

@@ -16,7 +16,7 @@
  */
 
 // Dependencies.
-const fs = require('fs');
+const fs = require( 'fs' );
 const path = require( 'path' );
 const shell = require( 'shelljs' );
 
@@ -36,19 +36,21 @@ const allowedCommands = [
 // Display a generic help description.
 if ( 2 !== cliArgs.length ) {
 	console.log( 'Usage: npx @penskemediacorp/larval <command> [--help]\n' );
-	console.log( `Where <command> is one of ${allowedCommands.join( ', ' )}.\n` );
+	console.log(
+		`Where <command> is one of ${ allowedCommands.join( ', ' ) }.\n`
+	);
 	return;
 }
 
 // Check for invalid commands.
-const command = cliArgs[1];
+const command = cliArgs[ 1 ];
 if ( ! allowedCommands.includes( command ) ) {
-	console.log( `Invalid command '${command}'.\n` );
+	console.log( `Invalid command '${ command }'.\n` );
 	return;
 }
 
 // Display the docblock for a given command.
-const pathToFile = path.resolve( __dirname, `${command}.js` );
+const pathToFile = path.resolve( __dirname, `${ command }.js` );
 try {
 	if ( fs.existsSync( pathToFile ) ) {
 		fs.readFile( pathToFile, 'utf8', ( error, data ) => {
@@ -57,9 +59,9 @@ try {
 				return;
 			}
 			const fileParts = data.split( '*/', 1 );
-			console.log( fileParts[0] + '*/' );
+			console.log( fileParts[ 0 ] + '*/' );
 		} );
 	}
-} catch( error ) {
+} catch ( error ) {
 	console.error( error );
 }

package/scripts/init.js

@@ -8,7 +8,9 @@ const copyTo = process.cwd();
 copySync( copyFrom, copyTo );
 
 console.log(
-	chalk.green( 'Copied folder structure. Now, add the following scripts to package.json:' )
+	chalk.green(
+		'Copied folder structure. Now, add the following scripts to package.json:'
+	)
 );
 
 console.log( `
@@ -18,4 +20,4 @@ console.log( `
 "parser": "./node_modules/.bin/twig-to-php-parser",
 "update-larva": "npm install @penskemediacorp/larva@latest",
 "write-json": "larva write-json"
-` );
+` );

package/scripts/larva/larva.config.js

@@ -1,3 +1,3 @@
 module.exports = {
-	brand: ''
+	brand: '',
 };

package/scripts/link-all.js

@@ -26,8 +26,8 @@ const cliArgs = getArgsFromCli();
 
 // Handle help command.
 if ( cliArgs.includes( '--help' ) ) {
-    shell.exec( `npx @penskemediacorp/larva help link-all` );
-    return;
+	shell.exec( `npx @penskemediacorp/larva help link-all` );
+	return;
 }
 
 shell.exec( 'npm link @penskemediacorp/larva' );

package/scripts/lint-js.js

@@ -3,9 +3,6 @@ const spawnScript = require( '../lib/utils/spawnScript' );
 
 const { configFile } = getAppConfiguration( 'eslint' );
 
-const args = [
-	'--c',
-	configFile
-];
+const args = [ '--c', configFile ];
 
 spawnScript( './node_modules/.bin/eslint', args );

package/scripts/lint-scss.js

@@ -1,13 +1,11 @@
 const path = require( 'path' );
 
-const stylelintConfigPath = path.join( __dirname, './config/stylelint.config.js' );
+const stylelintConfigPath = path.join(
+	__dirname,
+	'./config/stylelint.config.js'
+);
 const spawnScript = require( '../lib/utils/spawnScript' );
 
-const args = [
-	'files',
-	'./src/scss',
-	'--config',
-	stylelintConfigPath
-];
+const args = [ 'files', './src/scss', '--config', stylelintConfigPath ];
 
 spawnScript( './node_modules/.bin/stylelint', args );

package/scripts/lint.js

@@ -50,8 +50,8 @@ const cliArgs = getArgsFromCli();
 
 // Handle help command.
 if ( cliArgs.includes( '--help' ) ) {
-    shell.exec( `npx @penskemediacorp/larva help lint` );
-    return;
+	shell.exec( `npx @penskemediacorp/larva help lint` );
+	return;
 }
 
 // Trigger linting when a specific flag is present, or when neither flag is
@@ -64,10 +64,10 @@ const fix = cliArgs.includes( '--fix' ) ? ' fix' : '';
 
 if ( lintCSS ) {
 	console.log( 'Linting CSS assets\n\n\n' );
-	shell.exec( `${binPath} lint-scss${fix}` );
+	shell.exec( `${ binPath } lint-scss${ fix }` );
 }
 
 if ( lintJS ) {
 	console.log( 'Linting JavaScript assets\n\n\n' );
-	shell.exec( `${binPath} lint-js ${workingDirectory}${fix}` );
+	shell.exec( `${ binPath } lint-js ${ workingDirectory }${ fix }` );
 }

package/scripts/prod-js.js

@@ -4,9 +4,6 @@ const spawnScript = require( '../lib/utils/spawnScript' );
 
 const configPath = path.join( __dirname, './config/webpack.config.js' );
 
-const args = [
-	`--config=${ configPath }`,
-	'--mode=production'
-];
+const args = [ `--config=${ configPath }`, '--mode=production' ];
 
 spawnScript( './node_modules/.bin/webpack', args );

package/scripts/prod-scss.js

@@ -6,7 +6,8 @@ const spawnScript = require( '../lib/utils/spawnScript' );
 const gulpfilePath = path.join( __dirname, './config/gulpfile.js' );
 
 const cliArgs = getArgsFromCli();
-const generateImportantVariants = '--generate-important-variants' === cliArgs[1];
+const generateImportantVariants =
+	'--generate-important-variants' === cliArgs[ 1 ];
 
 // Remove our arg so Gulp doesn't complain about an undefined task.
 if ( generateImportantVariants ) {
@@ -14,7 +15,9 @@ if ( generateImportantVariants ) {
 }
 
 const args = [
-	generateImportantVariants ? 'prod-scss-with-important-variants' : 'prod-scss',
+	generateImportantVariants
+		? 'prod-scss-with-important-variants'
+		: 'prod-scss',
 	'--gulpfile',
 	gulpfilePath,
 	'--cwd',

package/scripts/prod.js

@@ -64,9 +64,9 @@ if ( cliArgs.includes( '--help' ) ) {
 
 // Run the Twig-to-PHP parser.
 if (
-	1 === cliArgs.length
-	|| cliArgs.includes( '--parser' )
-	|| cliArgs.includes( '--parse' )
+	1 === cliArgs.length ||
+	cliArgs.includes( '--parser' ) ||
+	cliArgs.includes( '--parse' )
 ) {
 	console.log( 'Parsing Twig templates\n\n' );
 	shell.exec( `npx @penskemediacorp/twig-to-php-parser` );
@@ -76,47 +76,41 @@ if (
 
 // Run the write-json script.
 if (
-	1 === cliArgs.length
-	|| cliArgs.includes( '--json' )
-	|| cliArgs.includes( '--write-json' )
+	1 === cliArgs.length ||
+	cliArgs.includes( '--json' ) ||
+	cliArgs.includes( '--write-json' )
 ) {
 	console.log( 'Building JSON assets\n\n' );
-	shell.exec( `${binPath} write-json` );
+	shell.exec( `${ binPath } write-json` );
 } else {
 	console.log( 'Skipping write-json\n' );
 }
 
 // Build CSS/SCSS.
 if (
-	1 === cliArgs.length
-	|| cliArgs.includes( '--css' )
-	|| cliArgs.includes( '--scss' )
+	1 === cliArgs.length ||
+	cliArgs.includes( '--css' ) ||
+	cliArgs.includes( '--scss' )
 ) {
 	console.log( 'Building CSS assets\n\n' );
-	shell.exec( `${binPath} prod-scss` );
+	shell.exec( `${ binPath } prod-scss` );
 } else {
 	console.log( 'Skipping building CSS\n' );
 }
 
 // Build JS.
-if (
-	1 === cliArgs.length
-	|| cliArgs.includes( '--js' )
-) {
+if ( 1 === cliArgs.length || cliArgs.includes( '--js' ) ) {
 	console.log( 'Building JavaScript assets\n\n' );
-	shell.exec( `${binPath} prod-js` );
+	shell.exec( `${ binPath } prod-js` );
 } else {
 	console.log( 'Skipping building JavaScript\n' );
 }
 
 // Build SVG.
-if (
-	1 === cliArgs.length
-	|| cliArgs.includes( '--svg' )
-) {
+if ( 1 === cliArgs.length || cliArgs.includes( '--svg' ) ) {
 	console.log( 'Building SVG assets\n\n' );
-	shell.exec( `${binPath} build-icons` );
-	shell.exec( "npx svgo -f src/svg -o build/svg" );
+	shell.exec( `${ binPath } build-icons` );
+	shell.exec( 'npx svgo -f src/svg -o build/svg' );
 } else {
 	console.log( 'Skipping building the SVGs\n' );
 }

package/scripts/server.js

@@ -4,8 +4,6 @@ const spawnScript = require( '../lib/utils/spawnScript' );
 
 const scriptLocation = path.join( __dirname, '../lib/start.js' );
 
-const args = [
-	scriptLocation
-];
+const args = [ scriptLocation ];
 
 spawnScript( './node_modules/.bin/nodemon', args );

package/scripts/start.js

@@ -25,12 +25,12 @@ const cliArgs = getArgsFromCli();
 
 // Handle help command.
 if ( cliArgs.includes( '--help' ) ) {
-    shell.exec( `npx @penskemediacorp/larva help start` );
-    return;
+	shell.exec( `npx @penskemediacorp/larva help start` );
+	return;
 }
 
 // Construct some paths to point our scripts at.
 const binPath = path.resolve( __dirname, '../bin/larva.js' ); // For sibling scripts.
 const patternsPath = path.resolve( process.cwd(), './src/patterns' ); // Relative path to the patterns.
 
-shell.exec( `${binPath} server --watch ${patternsPath} -e twig,html,js` );
+shell.exec( `${ binPath } server --watch ${ patternsPath } -e twig,html,js` );

package/scripts/upgrade.js

@@ -57,8 +57,7 @@ if ( cliArgs.includes( '--help' ) ) {
 
 // Parse the --version flag. Defaults to 'latest'.
 const getVersionArg = () => {
-
-    // Loop through our args, looking for `--version=`.
+	// Loop through our args, looking for `--version=`.
 	const versionFlag = cliArgs.find( ( cliArg ) => {
 		if ( ! cliArg.includes( '--version=' ) ) {
 			return false;
@@ -66,34 +65,31 @@ const getVersionArg = () => {
 		return true;
 	} );
 
-    // Did not find it.
+	// Did not find it.
 	if ( ! versionFlag ) {
 		return 'latest';
 	}
 
-    // Trip the value down to just the version.
+	// Trip the value down to just the version.
 	const version = versionFlag.replace( '--version=', '' );
 	return version ? version : 'latest';
 };
 
 // Update Larva version installed.
-console.log( `Installing Larva@${getVersionArg()}\n\n` );
-shell.exec( `npm install @penskemediacorp/larva@${getVersionArg()}` );
+console.log( `Installing Larva@${ getVersionArg() }\n\n` );
+shell.exec( `npm install @penskemediacorp/larva@${ getVersionArg() }` );
 
 // Build CSS.
 if (
-	! cliArgs.includes( '--skip-css' )
-	|| cliArgs.includes( '--skip-build' )
+	! cliArgs.includes( '--skip-css' ) ||
+	cliArgs.includes( '--skip-build' )
 ) {
 	console.log( 'Building CSS assets\n\n' );
-	shell.exec( `${binPath} prod-scss` );
+	shell.exec( `${ binPath } prod-scss` );
 }
 
 // Build JavaScript.
-if (
-	! cliArgs.includes( '--skip-js' )
-	|| cliArgs.includes( '--skip-build' )
-) {
+if ( ! cliArgs.includes( '--skip-js' ) || cliArgs.includes( '--skip-build' ) ) {
 	console.log( 'Building JavaScript assets\n\n' );
-	shell.exec( `${binPath} prod-js` );
+	shell.exec( `${ binPath } prod-js` );
 }