mod-build 4.0.0-alpha.4 → 4.0.0-alpha.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mod-build",
-  "version": "4.0.0-alpha.4",
+  "version": "4.0.0-alpha.6",
   "description": "Share components for S3 sites.",
   "type": "module",
   "scripts": {

package/siteconfig.js

@@ -1,19 +1,3 @@
-export let siteData = {
-	primary_trade: 'Home Warranty',
-	service: 'home_warranty',
-	gtm_container_ID: 'GTM-PZGPJR6',
-	qs_gtm_container_ID: 'GTM-PZGPJR6',
-	email: 'support@bestcompany.com',
-	email_unsub: 'unsubscribe@bestcompany.com',
-	domain: 'bestcompany.com',
-	company_name: 'BestCompany',
-	website_name: 'BestCompany.com',
-	isWhiteLabel: true,
-	isQSPage: true,
-	useAccessibleConfig: true,
-	pathSubdirectory: ''
-};
- 
-export function setSiteData(newSiteData) {
-	siteData = newSiteData;
-} 
+export const siteData = () => {
+	return {};
+};

package/template.js

@@ -3,471 +3,5 @@
  * inside HTML templates using Handlebars
  */
 export const templateData = () => {
-	return {
-		page: {
-			headConfig: {
-				hideTitleCompanyName: true,
-				title: 'Test',
-				description: '',
-				keywords: '',
-				faviconPath: '/favicon.ico',
-				inverseTitle: true,
-				useDynamicGtm: true,
-				useModAnalytics: true,
-				disableOgTags: true,
-				noBsBaseStyles: true,
-				vwoSetup: {
-					vwoPathArray: ['none']
-				}
-			},
-			footAssetsConfig: {
-				disableJquery: true,
-				disableFormJs: true,
-				disableExpandCollapse: true,
-				disableFooter: true
-			}
-		},
-		header: {
-			attributes: {
-				class: 'header--transparent',
-				id: 'test',
-				'data-test': 'test'
-			},
-			logo: {
-				picture: {
-					img: {
-						attributes: {
-							src: 'images/logo.svg',
-							alt: 'Company Name'
-						}
-					}
-				}
-			},
-			callRail: {
-				mobileText: '<span class="hidden visible-sm-up">Call&nbsp;</span>(555) 555-5555',
-				phoneNumber: '5555555555'
-			}
-		},
-		hero: {
-			formTemplateInclude: 'src/templates/_partials/form.html',
-			title: {
-				text: 'Lorem ipsum dolor sit amet.'
-			},
-			callRail: {
-				text: 'or call (555) 555-5555'
-			},
-			background: {},
-			picture: {
-				img: {
-					attributes: {
-						src: '/images/hero.png',
-						alt: ''
-					}
-				}
-			}
-		},
-		progressbar: {
-			attributes: {
-				class: 'text-align-center'
-			},
-			includeStepCount: true
-		},
-		steps: {
-			template: 'src/accessible-components/steps/steps.html',
-			carouselOptions: {
-				attributes: {
-					id: 'swiperForm',
-					class: 'swiper--form swiper--dynamic-step-height',
-					role: 'group',
-					tabindex: '0',
-					aria: {
-						label: 'Multi-Step Form',
-						describedby: 'steps-description'
-					}
-				},
-				description: 'Use the buttons on each slide (Go, Next, or Back) or click Enter to move throughout the form steps. Use tab to navigate between input fields. On the final step, the form information will be submitted. When your results load, you will be redirected  to a new web page.'
-			},
-			items: [
-				{
-					attributes: {
-						data: {
-							'step-name': 'zip'
-						}
-					},
-					stepContent: {
-						title: {
-							text: 'What is your zip code?'
-						},
-						fields: [
-							{
-								attributes: {
-									name: 'zip',
-									class: 'form-input--border-bottom-only'
-								}
-							}
-						],
-						button: {
-							attributes: {
-								class: 'btn--primary'
-							},
-							text: 'Next Step'
-						}
-					}
-				},
-				{
-					attributes: {
-						data: {
-							'step-name': 'OwnHome'
-						}
-					},
-					stepContent: {
-						fields: [
-							{
-								fieldType: 'radio',
-								radioOptionType: 'group',
-								attributes: {
-									id: 'OwnHome'
-								},
-								legend: {
-									text: 'Do you own or rent your home?'
-								},
-								options: [
-									{
-										attributes: {
-											name: 'OwnHome',
-											id: 'YesOwnHome',
-											value: 'Yes',
-											data: {
-												required: 'nonempty'
-											}
-										},
-										text: 'Own'
-									},
-									{
-										attributes: {
-											name: 'OwnHome',
-											id: 'NoRentHome',
-											value: 'No',
-											data: {
-												required: 'nonempty'
-											}
-										},
-										text: 'Rent'
-									}
-								]
-							}
-						],
-						button: {
-							attributes: {
-								class: 'btn--primary'
-							},
-							text: 'Next Step'
-						}
-					}
-				},
-				{
-					attributes: {
-						data: {
-							'step-name': 'ElectricBill'
-						}
-					},
-					stepContent: {
-						title: {
-							text: 'What‘s your monthly electric bill?'
-						},
-						fields: [
-							{
-								fieldType: 'select',
-								attributes: {
-									class: 'select--border-bottom-only',
-									name: 'ElectricBill',
-									id: 'ElectricBill'
-								},
-								options: [
-									{
-										attributes: {
-											value: '',
-											disabled: ''
-										},
-										text: 'Please Select'
-									},
-									{
-										attributes: {
-											value: '$300+'
-										},
-										text: '$300+'
-									},
-									{
-										attributes: {
-											value: '$200 - $300'
-										},
-										text: '$200 - $300'
-									},
-									{
-										attributes: {
-											value: '$100 - $200',
-											selected: ''
-										},
-										text: '$100 - $200'
-									},
-									{
-										attributes: {
-											value: 'Under $100'
-										},
-										text: 'Under $100'
-									}
-								]
-							}
-						],
-						button: {
-							attributes: {
-								class: 'btn--primary'
-							},
-							text: 'Next Step'
-						}
-					}
-				},
-				{
-					attributes: {
-						data: {
-							'step-name': 'UtilityProvider'
-						}
-					},
-					stepContent: {
-						title: {
-							text: 'Who is your current utility provider?'
-						},
-						fields: [
-							{
-								fieldType: 'select',
-								attributes: {
-									class: 'select--border-bottom-only',
-									name: 'UtilityProvider',
-									id: 'UtilityProvider'
-								},
-								options: [
-									{
-										text: 'Other',
-										value: 'Other'
-									}
-								]
-							}
-						],
-						button: {
-							attributes: {
-								class: 'btn--primary'
-							},
-							text: 'Next Step'
-						}
-					}
-				},
-				{
-					attributes: {
-						class: 'step--last',
-						data: {
-							'step-name': 'personalInfo'
-						}
-					},
-					stepContent: {
-						fields: [
-							{
-								formGroup: {
-									attributes: {
-										class: 'form-group--flex-50'
-									}
-								},
-								attributes: {
-									name: 'firstName',
-									class: 'form-input--border-bottom-only'
-								}
-							},
-							{
-								formGroup: {
-									attributes: {
-										class: 'form-group--flex-50'
-									}
-								},
-								attributes: {
-									name: 'lastName',
-									class: 'form-input--border-bottom-only'
-								}
-							},
-							{
-								attributes: {
-									name: 'email',
-									class: 'form-input--border-bottom-only'
-								}
-							},
-							{
-								attributes: {
-									name: 'homePhone',
-									class: 'form-input--border-bottom-only'
-								}
-							},
-							{
-								attributes: {
-									name: 'address',
-									class: 'form-input--border-bottom-only'
-								},
-								labelInInput: 'Street Address'
-							},
-							{
-								formGroup: {
-									attributes: {
-										class: 'form-group--flex-33'
-									}
-								},
-								fieldType: 'input',
-								attributes: {
-									class: 'form-input--border-bottom-only',
-									name: 'visualCity',
-									value: ''
-								},
-								labelInInput: 'City'
-							},
-							{
-								formGroup: {
-									attributes: {
-										class: 'form-group--flex-33'
-									}
-								},
-								fieldType: 'input',
-								attributes: {
-									class: 'form-input--border-bottom-only',
-									name: 'state',
-									disabled: '',
-									value: ''
-								},
-								labelInInput: 'State'
-							},
-							{
-								formGroup: {
-									attributes: {
-										class: 'form-group--flex-33'
-									}
-								},
-								attributes: {
-									name: 'zip',
-									class: 'form-input--border-bottom-only'
-								}
-							},
-							{
-								fieldType: 'input',
-								attributes: {
-									name: 'city',
-									type: 'hidden',
-									value: ''
-								}
-							}
-						],
-						tcpa: {
-							placement: 'below-cta'
-						},
-						button: {
-							attributes: {
-								class: 'btn--primary'
-							},
-							text: 'Get Quote'
-						}
-					}
-				}
-			]
-		},
-		featuredBlock: {
-			title: {
-				attributes: {
-					class: 'text-align-center'
-				},
-				text: 'About [ Company Name ]'
-			},
-			columns: [
-				{
-					attributes: {
-						class: 'hidden visible-lg-up'
-					},
-					picture: {
-						img: {
-							attributes: {
-								src: '/images/logo.svg',
-								alt: '',
-								loading: 'lazy'
-							}
-						}
-					},
-					button: {
-						tag: 'a',
-						attributes: {
-							class: 'btn--secondary',
-							href: 'tel:5555555555'
-						},
-						text: 'Call (555) 555-5555'
-					}
-				},
-				{
-					description: {
-						text: 'Vivamus gravida facilisis arcu, eu vestibulum massa molestie eget. Curabitur sollicitudin justo quis dignissim iaculis. Donec venenatis ullamcorper odio, vel placerat sem porttitor at. Maecenas in enim suscipit, elementum est eget, dignissim ipsum. Nam nec orci id enim congue viverra quis eget dui.'
-					}
-				},
-				{
-					attributes: {
-						class: 'visible-sm-down hidden visible-md'
-					},
-					picture: {
-						img: {
-							attributes: {
-								src: '/images/logo.svg',
-								alt: '',
-								loading: 'lazy'
-							}
-						}
-					},
-					button: {
-						tag: 'a',
-						attributes: {
-							class: 'btn--secondary',
-							href: 'tel:5555555555'
-						},
-						text: 'Call (555) 555-5555'
-					}
-				}
-			]
-		},
-		reviews: {
-			title: {
-				text: 'What People Are Saying'
-			},
-			items: [
-				{
-					starRating: '50',
-					showRatingNextToAuthor: true,
-					reviewText: 'Duis dui odio, eleifend ac mauris cursus, feugiat mollis felis. Praesent sit amet justo pharetra, tristique purus nec, accumsan leo. Donec viverra, nunc in efficitur sagittis, tortor magna venenatis ante, vel vestibulum sem ex sit amet est. Quisque efficitur, purus eget congue porttitor, dui metus egestas erat, eu auctor quam mi ac metus.',
-					excludeQuotes: true,
-					authorName: 'Lorem Ipsum',
-					date: 'Month Day, Year',
-					location: 'City, State'
-				},
-				{
-					starRating: '50',
-					showRatingNextToAuthor: true,
-					reviewText: 'Donec imperdiet vitae arcu vel dictum. Mauris tempus elit nec orci tempus, non egestas odio semper. Duis laoreet venenatis neque eget euismod. Duis dapibus et orci ac facilisis.',
-					excludeQuotes: true,
-					authorName: 'Lorem Ipsum',
-					date: 'Month Day, Year',
-					location: 'City, State'
-				},
-				{
-					starRating: '50',
-					showRatingNextToAuthor: true,
-					reviewText: 'Suspendisse dapibus felis ut diam egestas, ac tristique sapien laoreet. Maecenas pellentesque vel odio vitae egestas. Vestibulum posuere viverra luctus. Ut ornare ut ligula non accumsan. Etiam hendrerit ex sit amet turpis pretium rhoncus sit amet non est.',
-					excludeQuotes: true,
-					authorName: 'Lorem Ipsum',
-					date: 'Month Day, Year',
-					location: 'City, State'
-				}
-			]
-		},
-		siteData: {
-			useAccessibleConfig: true
-		}
-	};
+	return {};
 };

package/vite.config.js

@@ -9,7 +9,9 @@ import { handlebarsHelpers } from './src/scripts/utils.js'
 import gulpHandlebarsFileInclude from 'gulp-handlebars-file-include'
 import eslint from 'vite-plugin-eslint'
 
-export default defineConfig(() => ({
+const themeSettings = { ...siteData(), ...templateData() }
+
+export default defineConfig((config = themeSettings) => ({
 	build: {
 		outDir: `${defaultSettings.distFolder}`,
 		emptyOutDir: false
@@ -19,14 +21,14 @@ export default defineConfig(() => ({
 		handlebars({
 			data: ['src/**/*.json'],
 			formats: ['json', 'html', 'hbs'],
-			globals: templateData(),
+			globals: config,
 			partials: {
 				directory: 'src/templates/',
 			}
 		}),
 		gulpHandlebarsFileInclude({}, { handlebarsHelpers }),
 		{
-			...gulpServe(siteData),
+			...gulpServe(config),
 			apply: 'serve'
 		},
 		{