mod-build 4.0.1 → 4.0.3

package/CHANGELOG.md

@@ -1,3 +1,7 @@
+## 4.0.3
+
+- Add global preventRageClick function
+
 ## 4.0.1
 
 - Add footAssetsConfig to additionalAssets

package/package.json

@@ -1,26 +1,22 @@
 {
   "name": "mod-build",
-  "version": "4.0.1",
+  "version": "4.0.3",
   "description": "Share components for S3 sites.",
   "type": "module",
   "scripts": {
     "dev": "export NODE_ENV=qa.modernize.com IS_LOCAL=true && vite",
     "build": "export NODE_ENV=modernize.com && vite build",
-    "preview": "export NODE_ENV=modernize.com && vite preview"
+    "preview": "export NODE_ENV=modernize.com && vite build && vite preview"
   },
   "dependencies": {
-    "@rollup/plugin-inject": "^5.0.5",
     "@vituum/vite-plugin-handlebars": "^1.1.0",
     "axios": "^1.6.2",
-    "del": "^7.1.0",
-    "eslint": "^8.55.0",
     "glob": "^10.3.10",
     "gulp": "^4.0.2",
     "gulp-handlebars-file-include": "^1.0.0",
     "gulp-hash": "^4.2.2",
     "gulp-replace": "^1.1.4",
     "gulp-tap": "^2.0.0",
-    "husky": "^8.0.3",
     "lodash.merge": "^4.6.2",
     "lodash.mergewith": "^4.6.2",
     "sass": "^1.69.5",

package/src/scripts/default/rage-clicking.js

@@ -0,0 +1,47 @@
+export const preventRageClicks = (steps = '.step', swiperEl = '.swiper') => {
+	const $allButtons = document.querySelectorAll('button');
+	const $steps = document.querySelectorAll(steps);
+	const swiper = document.querySelector(swiperEl).swiper;
+
+	if ($allButtons && swiper && $steps) {
+		let isTransitionStart = false;
+		let clickHandler = (e) => {
+			e.preventDefault();
+			e.stopPropagation();
+		};
+
+		swiper.on('slideChange', () => {
+			isTransitionStart = true;
+
+			$allButtons.forEach((button) => {
+				button.addEventListener('click', clickHandler);
+				button.disabled = true;
+			});
+		});
+
+		swiper.on('slideChangeTransitionEnd', () => {
+			if (isTransitionStart) {
+				isTransitionStart = false;
+
+				$allButtons.forEach((button) => {
+					button.disabled = false;
+					button.removeEventListener('click', clickHandler);
+				});
+
+				$steps.forEach((step) => {
+					step.classList.remove(window.modForm.opts.stepActiveCls);
+				});
+
+				document
+					.querySelector(`${steps}.swiper-slide-active`)
+					.classList.add(window.modForm.opts.stepActiveCls);
+
+				document
+					.querySelector(`${steps}.step[aria-hidden="false"]`)
+					.focus();
+
+				swiper.update();
+			}
+		});
+	}
+};

package/src/scripts/globals.js

@@ -1,6 +1,7 @@
 import { useDynamicGtm } from './default/use-dynamic-gtm.js';
 import { loadAdditionalAssets } from './default/additional-assets.js';
 import { updateFooterLinkPaths } from './default/update-link-paths.js';
+import { preventRageClicks } from './default/rage-clicking.js';
 
 function globalFunctions(config) {
 	useDynamicGtm(config);
@@ -8,4 +9,4 @@ function globalFunctions(config) {
 	updateFooterLinkPaths();
 }
 
-export { globalFunctions };
+export { globalFunctions, preventRageClicks };

package/src/scripts/plugins.js

@@ -1,5 +1,4 @@
 import fs from "node:fs";
-import mergeWith from "lodash.mergewith";
 import merge from "lodash.merge";
 import gulpHandlebarsFileInclude from "gulp-handlebars-file-include";
 import { defaultSettings } from "../data/config.js";
@@ -33,21 +32,10 @@ export const STATIC_COPY_TARGETS = [
 	},
 ];
 
-// eslint-disable-next-line no-unused-vars
-let tempConfigExists;
-
-const customizer = (objValue, srcValue) => {
-	// If the key exists in parsedConfig but not in mergedConfig, drop it from the merged result
-	if (srcValue === undefined) {
-		return undefined;
-	}
-
-	// Otherwise, use the default merging behavior
-	return merge(objValue, srcValue); // or you can return merge(objValue, srcValue) to merge nested objects
-};
-
-const checkForTempConfig = (config) => {
+export const updateConfig = async (config) => {
 	const { isLocal, nodeEnv, buildPath } = defaultSettings;
+	// eslint-disable-next-line no-unused-vars
+	let tempConfigExists;
 
 	let mergedConfig = { 
 		...config,
@@ -55,23 +43,23 @@ const checkForTempConfig = (config) => {
 		...{ isLocal, nodeEnv, buildPath }
 	};
 
-	return new Promise((resolve) => {
-		tempConfigExists = fs.existsSync(`src/.tmp/config.json`);
-		if (tempConfigExists) {
+	const checkForTempConfig = () => {
+		return new Promise((resolve) => {
+			tempConfigExists = fs.existsSync(`src/.tmp/config.json`);
+	
 			const configData = fs.readFileSync('src/.tmp/config.json', 'utf8');
 			const parsedConfig = JSON.parse(configData);
-			mergedConfig = mergeWith(parsedConfig, mergedConfig, customizer);
-		}
-		resolve(mergedConfig);
-	});
-};
+			mergedConfig = merge(parsedConfig, mergedConfig);
 
-export const updateConfig = async (config) => {
-	const mergedConfig = await checkForTempConfig(config);
+			resolve();
+		});
+	};
 
 	return {
 		name: 'update-config',
 		async configResolved({ configFileDependencies }) {
+			await checkForTempConfig();
+
 			configFileDependencies.forEach((file) => {
 				if (file.endsWith('siteconfig.js') || file.endsWith('template.js')) {
 					console.log('siteconfig or template changed');
@@ -94,11 +82,46 @@ export const updateConfig = async (config) => {
 }
 
 export const updateHandlebarsOnWatch = async (config) => {
-	const mergedConfig = await checkForTempConfig(config);
+	const { isLocal, nodeEnv, buildPath } = defaultSettings;
+	// eslint-disable-next-line no-unused-vars
+	let tempConfigExists;
+
+	let mergedConfig = { 
+		...config,
+		...footer(config),
+		...{ isLocal, nodeEnv, buildPath }
+	};
+
+	const checkForTempConfig = () => {
+		return new Promise((resolve) => {
+			tempConfigExists = fs.existsSync(`src/.tmp/config.json`);
+	
+			const configData = fs.readFileSync('src/.tmp/config.json', 'utf8');
+			const parsedConfig = JSON.parse(configData);
+			mergedConfig = merge(parsedConfig, mergedConfig);
+
+			resolve();
+		});
+	};
 
 	return {
 		name: 'update-handlebars-reload',
 		enforce: 'pre',
+		async configResolved({ configFileDependencies }) {
+			await checkForTempConfig();
+
+			configFileDependencies.forEach((file) => {
+				if (file.endsWith('siteconfig.js') || file.endsWith('template.js')) {
+					console.log('siteconfig or template changed');
+					try {
+						// overwrite the config file with new data
+						fs.writeFileSync('src/.tmp/config.json', JSON.stringify(mergedConfig, null, 2));
+					} catch (error) {
+						console.error(`Error reading config file: ${error}`);
+					}
+				}
+			});
+		},
 		async handleHotUpdate({ server, file }) {
 			if (file.endsWith('.hbs') || file.endsWith('.html')) {
 				server.ws.send({