@gravityforms/design-tokens/scripts/generate-css-properties.js

Design tokens as PostCSS variables, media queries, and mixins for Gravity Forms development.

#!/usr/bin/env node

const fs = require( 'fs/promises' );
const path = require( 'path' );

const [ productName, scope ] = process.argv.slice( 2 );
const fileName = `${ productName }-${ scope.replace( '/', '-' ) }`;
const distPath = path.join( __dirname, '..', productName, 'dist' );

const customProperties = require( `../${ productName }/custom-properties/${ scope }` );
const customMedia = require( `../${ productName }/custom-media/${ scope }` );

const createContent = () => {
	let content = `:root {\n`;

	for ( const [ key, value ] of Object.entries( customProperties ) ) {
		content += `    ${ key }: ${ value.replace( '\\\\', '\\' ) };\n`;
	}

	for ( const [ key, value ] of Object.entries( customMedia ) ) {
		content += `    ${ key }: ${ value.replace( '\\\\', '\\' ) };\n`;
	}

	content += `}\n`;
	return content;
};

const writeToFile = async () => {
	const filePath = path.join( distPath, `${ fileName }-custom-properties.pcss` );
	const content = createContent();

	try {
		await fs.mkdir( path.dirname( filePath ), { recursive: true } );
		await fs.writeFile( filePath, content );
		console.log( `${ fileName }-custom-properties.pcss written to ${ distPath }` );
	} catch ( err ) {
		console.error( `Problem writing ${ fileName }-custom-properties.pcss to ${ distPath }` );
	}
};

writeToFile().then( () => process.exit( 0 ) );