export function sustainabilityScoreQuiz(form: FormTs) {
form.setTitle(() => '🌱 How Green Is Your Business? Sustainability Score');
// ============ SCORING SYSTEM ============
const scores = form.state<Record<string, number>>({});
const updateScore = (category: string, points: number) => {
scores.update(current => ({ ...current, [category]: points }));
};
const getTotalScore = () => {
const s = scores();
return Object.values(s).reduce((sum, val) => sum + (val || 0), 0);
};
const getMaxScore = () => 100;
const getScorePercentage = () => Math.round((getTotalScore() / getMaxScore()) * 100);
const getSustainabilityLevel = (): 'laggard' | 'beginner' | 'progressing' | 'advanced' | 'leader' => {
const pct = getScorePercentage();
if (pct >= 85) return 'leader';
if (pct >= 70) return 'advanced';
if (pct >= 50) return 'progressing';
if (pct >= 30) return 'beginner';
return 'laggard';
};
const getSustainabilityLabel = () => {
const level = getSustainabilityLevel();
const labels = {
laggard: '🔴 Sustainability Laggard',
beginner: '🟠 Sustainability Beginner',
progressing: '🟡 Making Progress',
advanced: '🟢 Sustainability Advanced',
leader: '🌟 Sustainability Leader'
};
return labels[level];
};
const getSustainabilityColor = () => {
const level = getSustainabilityLevel();
const colors = {
laggard: '#dc2626',
beginner: '#ea580c',
progressing: '#ca8a04',
advanced: '#16a34a',
leader: '#059669'
};
return colors[level];
};
// CO2 estimate based on practices
const getEstimatedCO2Reduction = () => {
const pct = getScorePercentage();
if (pct >= 85) return '40-60%';
if (pct >= 70) return '25-40%';
if (pct >= 50) return '10-25%';
if (pct >= 30) return '5-10%';
return '< 5%';
};
// ============ COMPLETION SCREEN ============
form.configureCompletionScreen({
type: 'text',
title: () => `${getSustainabilityLabel()}`,
message: () => {
const pct = getScorePercentage();
const co2 = getEstimatedCO2Reduction();
return `Your sustainability score is ${pct}%. Based on your practices, your estimated carbon footprint reduction vs. industry average is ${co2}. Download your report for improvement recommendations and ESG reporting insights.`;
}
});
// ============ PAGES SETUP ============
const pages = form.addPages('quiz-pages', {
heightMode: 'current-page'
});
// ============ PAGE 1: Company Profile ============
const page1 = pages.addPage('company-profile', { mobileBreakpoint: 500 });
page1.addRow(row => {
row.addTextPanel('header1', {
label: 'Step 1 of 7: Company Profile',
computedValue: () => 'Tell us about your organization',
customStyles: {
fontSize: '0.9rem',
color: '#6b7280',
marginBottom: '1rem'
}
});
});
page1.addSpacer({ height: '24px' });
page1.addRow(row => {
row.addDropdown('industry', {
label: 'Industry',
isRequired: true,
options: [
{ id: 'manufacturing', name: '🏭 Manufacturing' },
{ id: 'retail', name: '🛒 Retail' },
{ id: 'tech', name: '💻 Technology' },
{ id: 'services', name: '💼 Professional Services' },
{ id: 'hospitality', name: '🏨 Hospitality' },
{ id: 'healthcare', name: '🏥 Healthcare' },
{ id: 'construction', name: '🏗️ Construction' },
{ id: 'other', name: '📦 Other' }
],
placeholder: 'Select industry'
}, '1fr');
row.addDropdown('companySize', {
label: 'Company Size',
isRequired: true,
options: [
{ id: '1-10', name: '1-10 employees' },
{ id: '11-50', name: '11-50 employees' },
{ id: '51-200', name: '51-200 employees' },
{ id: '201-500', name: '201-500 employees' },
{ id: '500+', name: '500+ employees' }
],
placeholder: 'Select size'
}, '1fr');
});
page1.addRow(row => {
row.addRadioButton('sustainabilityStrategy', {
label: 'Do you have a formal sustainability strategy?',
isRequired: true,
orientation: 'vertical',
options: [
{ id: 'comprehensive', name: '📋 Yes, comprehensive with targets and KPIs' },
{ id: 'basic', name: '📝 Yes, basic sustainability goals' },
{ id: 'informal', name: '💭 Informal commitment, no documentation' },
{ id: 'none', name: '❌ No sustainability strategy' }
],
onValueChange: (val) => {
const points = { comprehensive: 10, basic: 6, informal: 3, none: 0 };
updateScore('strategy', points[val as keyof typeof points] || 0);
}
});
});
// ============ PAGE 2: Energy & Emissions ============
const page2 = pages.addPage('energy-emissions', { mobileBreakpoint: 500 });
page2.addRow(row => {
row.addTextPanel('header2', {
label: 'Step 2 of 7: Energy & Emissions',
computedValue: () => 'How do you manage energy consumption and carbon footprint?',
customStyles: {
fontSize: '0.9rem',
color: '#6b7280',
marginBottom: '1rem'
}
});
});
page2.addSpacer({ height: '24px' });
page2.addRow(row => {
row.addSlider('renewableEnergy', {
label: 'What percentage of your energy comes from renewable sources?',
isRequired: true,
min: 0,
max: 100,
step: 10,
unit: '%',
defaultValue: 20,
onValueChange: (val) => {
if (val == null) return;
const points = val >= 80 ? 10 : val >= 50 ? 7 : val >= 25 ? 4 : val >= 10 ? 2 : 0;
updateScore('renewable', points);
}
});
});
page2.addRow(row => {
row.addRadioButton('carbonTracking', {
label: 'Do you measure and track your carbon footprint?',
isRequired: true,
orientation: 'vertical',
options: [
{ id: 'scope123', name: '📊 Yes, Scope 1, 2, and 3 emissions' },
{ id: 'scope12', name: '📈 Yes, Scope 1 and 2 only' },
{ id: 'basic', name: '📋 Basic energy tracking only' },
{ id: 'none', name: '❌ No carbon tracking' }
],
onValueChange: (val) => {
const points = { scope123: 10, scope12: 7, basic: 3, none: 0 };
updateScore('carbonTracking', points[val as keyof typeof points] || 0);
}
});
});
page2.addRow(row => {
row.addSuggestionChips('energyInitiatives', {
label: 'Which energy efficiency initiatives have you implemented?',
suggestions: [
{ id: 'led', name: '💡 LED Lighting' },
{ id: 'hvac', name: '❄️ Efficient HVAC' },
{ id: 'solar', name: '☀️ Solar Panels' },
{ id: 'ev', name: '🚗 EV Charging' },
{ id: 'smart', name: '🤖 Smart Building' },
{ id: 'audit', name: '📋 Energy Audits' }
],
onValueChange: (val) => {
const points = val ? Math.min(val.length * 1.5, 8) : 0;
updateScore('energyInitiatives', points);
}
});
});
// ============ PAGE 3: Waste & Circular Economy ============
const page3 = pages.addPage('waste', { mobileBreakpoint: 500 });
page3.addRow(row => {
row.addTextPanel('header3', {
label: 'Step 3 of 7: Waste & Circular Economy',
computedValue: () => 'How do you manage waste and promote circularity?',
customStyles: {
fontSize: '0.9rem',
color: '#6b7280',
marginBottom: '1rem'
}
});
});
page3.addSpacer({ height: '24px' });
page3.addRow(row => {
row.addSlider('recyclingRate', {
label: 'What is your waste recycling/diversion rate?',
tooltip: 'Percentage of waste diverted from landfill',
isRequired: true,
min: 0,
max: 100,
step: 10,
unit: '%',
defaultValue: 30,
onValueChange: (val) => {
if (val == null) return;
const points = val >= 80 ? 8 : val >= 60 ? 6 : val >= 40 ? 4 : val >= 20 ? 2 : 0;
updateScore('recycling', points);
}
});
});
page3.addRow(row => {
row.addRadioButton('singleUsePlastic', {
label: 'What is your approach to single-use plastics?',
isRequired: true,
orientation: 'vertical',
options: [
{ id: 'eliminated', name: '🚫 Completely eliminated' },
{ id: 'reducing', name: '📉 Actively reducing (50%+ gone)' },
{ id: 'started', name: '🌱 Starting to reduce' },
{ id: 'none', name: '❌ No specific policy' }
],
onValueChange: (val) => {
const points = { eliminated: 7, reducing: 5, started: 2, none: 0 };
updateScore('plastic', points[val as keyof typeof points] || 0);
}
});
});
page3.addRow(row => {
row.addRadioButton('circularPractices', {
label: 'Do you implement circular economy practices?',
tooltip: 'Product take-back, refurbishment, recycled materials',
isRequired: true,
orientation: 'vertical',
options: [
{ id: 'advanced', name: '♻️ Yes, integrated into business model' },
{ id: 'some', name: '🔄 Some circular initiatives' },
{ id: 'planning', name: '📋 Planning to implement' },
{ id: 'none', name: '❌ No circular practices' }
],
onValueChange: (val) => {
const points = { advanced: 7, some: 4, planning: 2, none: 0 };
updateScore('circular', points[val as keyof typeof points] || 0);
}
});
});
// ============ PAGE 4: Supply Chain ============
const page4 = pages.addPage('supply-chain', { mobileBreakpoint: 500 });
page4.addRow(row => {
row.addTextPanel('header4', {
label: 'Step 4 of 7: Sustainable Supply Chain',
computedValue: () => 'How sustainable is your supply chain?',
customStyles: {
fontSize: '0.9rem',
color: '#6b7280',
marginBottom: '1rem'
}
});
});
page4.addSpacer({ height: '24px' });
page4.addRow(row => {
row.addRadioButton('supplierAssessment', {
label: 'Do you assess suppliers on sustainability criteria?',
isRequired: true,
orientation: 'vertical',
options: [
{ id: 'mandatory', name: '📋 Yes, mandatory sustainability requirements' },
{ id: 'preferred', name: '⭐ Sustainability is a selection factor' },
{ id: 'informal', name: '💭 Informal consideration' },
{ id: 'none', name: '❌ Not assessed' }
],
onValueChange: (val) => {
const points = { mandatory: 8, preferred: 5, informal: 2, none: 0 };
updateScore('supplierAssessment', points[val as keyof typeof points] || 0);
}
});
});
page4.addRow(row => {
row.addRadioButton('localSourcing', {
label: 'What percentage of supplies are locally sourced?',
tooltip: 'Within 500 miles/800 km',
isRequired: true,
orientation: 'vertical',
options: [
{ id: 'most', name: '📍 Most (70%+)' },
{ id: 'significant', name: '🗺️ Significant (40-70%)' },
{ id: 'some', name: '🌍 Some (10-40%)' },
{ id: 'minimal', name: '✈️ Minimal (<10%)' }
],
onValueChange: (val) => {
const points = { most: 7, significant: 5, some: 3, minimal: 0 };
updateScore('localSourcing', points[val as keyof typeof points] || 0);
}
});
});
// ============ PAGE 5: Social & Governance ============
const page5 = pages.addPage('social-governance', { mobileBreakpoint: 500 });
page5.addRow(row => {
row.addTextPanel('header5', {
label: 'Step 5 of 7: Social & Governance',
computedValue: () => 'The "S" and "G" in ESG',
customStyles: {
fontSize: '0.9rem',
color: '#6b7280',
marginBottom: '1rem'
}
});
});
page5.addSpacer({ height: '24px' });
page5.addRow(row => {
row.addSuggestionChips('socialInitiatives', {
label: 'Which social responsibility initiatives do you have?',
isRequired: true,
suggestions: [
{ id: 'dei', name: '🌈 DEI Programs' },
{ id: 'fair-wage', name: '💰 Living Wage' },
{ id: 'volunteer', name: '🤝 Volunteer Programs' },
{ id: 'community', name: '🏘️ Community Investment' },
{ id: 'health', name: '💚 Employee Wellness' },
{ id: 'training', name: '📚 Skills Training' }
],
min: 1,
onValueChange: (val) => {
const points = val ? Math.min(val.length * 1.5, 8) : 0;
updateScore('social', points);
}
});
});
page5.addRow(row => {
row.addRadioButton('esgReporting', {
label: 'Do you publish sustainability/ESG reports?',
isRequired: true,
orientation: 'vertical',
options: [
{ id: 'external', name: '📊 Yes, externally audited (GRI, SASB)' },
{ id: 'internal', name: '📋 Yes, internal reports' },
{ id: 'planning', name: '📝 Planning to start' },
{ id: 'none', name: '❌ No ESG reporting' }
],
onValueChange: (val) => {
const points = { external: 7, internal: 4, planning: 2, none: 0 };
updateScore('reporting', points[val as keyof typeof points] || 0);
}
});
});
// ============ PAGE 6: Results ============
const page6 = pages.addPage('results', { mobileBreakpoint: 500 });
page6.addRow(row => {
row.addTextPanel('header6', {
label: 'Step 6 of 7: Your Results',
computedValue: () => 'Your business sustainability assessment',
customStyles: {
fontSize: '0.9rem',
color: '#6b7280',
marginBottom: '1rem'
}
});
});
page6.addSpacer({ height: '24px' });
page6.addRow(row => {
row.addTextPanel('finalScoreLabel', {
label: '🌱 Sustainability Score Results',
computedValue: () => '',
customStyles: {
fontSize: '1.2rem',
fontWeight: '700',
textAlign: 'center'
}
});
});
page6.addRow(row => {
row.addTextPanel('finalSustainabilityLevel', {
computedValue: () => getSustainabilityLabel(),
customStyles: () => ({
fontSize: '1.5rem',
fontWeight: '800',
textAlign: 'center',
color: getSustainabilityColor(),
padding: '15px',
background: '#f0fdf4',
borderRadius: '12px',
border: `3px solid ${getSustainabilityColor()}`
})
});
});
page6.addRow(row => {
row.addTextPanel('scoreBreakdown', {
computedValue: () => {
const total = getTotalScore();
const pct = getScorePercentage();
return `Sustainability Score: ${total}/${getMaxScore()} (${pct}%)`;
},
customStyles: {
fontSize: '1.1rem',
fontWeight: '600',
textAlign: 'center',
color: '#374151',
marginTop: '10px'
}
});
});
page6.addRow(row => {
row.addTextPanel('co2Impact', {
computedValue: () => `🌍 Est. Carbon Reduction vs Industry: ${getEstimatedCO2Reduction()}`,
customStyles: {
fontSize: '1rem',
fontWeight: '600',
color: '#059669',
textAlign: 'center',
padding: '10px',
background: '#ecfdf5',
borderRadius: '8px',
marginTop: '10px'
}
});
});
const detailsSection = page6.addSubform('detailsBreakdown', {
title: '📊 Detailed Score Breakdown (click to expand)',
isCollapsible: true,
customStyles: {
marginTop: '1rem',
background: '#f9fafb',
borderRadius: '8px'
}
});
detailsSection.addRow(row => {
row.addTextPanel('strategyDetail', {
label: '📋 Strategy',
computedValue: () => `${scores()['strategy'] || 0}/10 points`,
customStyles: {
fontSize: '0.9rem',
padding: '8px 12px',
background: '#d1fae5',
borderRadius: '6px'
}
}, '1fr');
row.addTextPanel('energyDetail', {
label: '⚡ Energy',
computedValue: () => {
const s = scores();
const score = (s['renewable'] || 0) + (s['carbonTracking'] || 0) + (s['energyInitiatives'] || 0);
return `${score}/28 points`;
},
customStyles: {
fontSize: '0.9rem',
padding: '8px 12px',
background: '#d1fae5',
borderRadius: '6px'
}
}, '1fr');
});
detailsSection.addRow(row => {
row.addTextPanel('wasteDetail', {
label: '♻️ Waste',
computedValue: () => {
const s = scores();
const score = (s['recycling'] || 0) + (s['plastic'] || 0) + (s['circular'] || 0);
return `${score}/22 points`;
},
customStyles: {
fontSize: '0.9rem',
padding: '8px 12px',
background: '#d1fae5',
borderRadius: '6px'
}
}, '1fr');
row.addTextPanel('supplyChainDetail', {
label: '🔗 Supply Chain',
computedValue: () => {
const s = scores();
const score = (s['supplierAssessment'] || 0) + (s['localSourcing'] || 0);
return `${score}/15 points`;
},
customStyles: {
fontSize: '0.9rem',
padding: '8px 12px',
background: '#d1fae5',
borderRadius: '6px'
}
}, '1fr');
});
detailsSection.addRow(row => {
row.addTextPanel('socialDetail', {
label: '🤝 Social & Governance',
computedValue: () => {
const s = scores();
const score = (s['social'] || 0) + (s['reporting'] || 0);
return `${score}/15 points`;
},
customStyles: {
fontSize: '0.9rem',
padding: '8px 12px',
background: '#d1fae5',
borderRadius: '6px'
}
}, '1fr');
row.addEmpty('1fr');
});
// ============ PAGE 7: Lead Capture ============
const page7 = pages.addPage('lead-capture', { mobileBreakpoint: 500 });
page7.addRow(row => {
row.addTextPanel('header7', {
label: 'Step 7 of 7: Get Your Report',
computedValue: () => 'Enter your details to receive your sustainability report',
customStyles: {
fontSize: '0.9rem',
color: '#6b7280',
marginBottom: '1rem'
}
});
});
page7.addSpacer({ height: '24px' });
page7.addRow(row => {
row.addTextbox('name', {
label: 'Your Name',
isRequired: true,
placeholder: 'Taylor Green'
}, '1fr');
row.addEmail('email', {
label: 'Work Email',
isRequired: true,
placeholder: 'taylor@company.com'
}, '1fr');
});
page7.addRow(row => {
row.addTextbox('company', {
label: 'Company Name',
placeholder: 'EcoTech Inc.'
}, '1fr');
row.addDropdown('role', {
label: 'Your Role',
options: [
{ id: 'sustainability', name: 'Sustainability Officer' },
{ id: 'ceo', name: 'CEO / Owner' },
{ id: 'operations', name: 'Operations Manager' },
{ id: 'facilities', name: 'Facilities Manager' },
{ id: 'other', name: 'Other' }
],
placeholder: 'Select role'
}, '1fr');
});
page7.addRow(row => {
row.addCheckboxList('consent', {
options: [
{ id: 'report', name: '📄 Send me the detailed sustainability report', isRequired: true },
{ id: 'tips', name: '💡 Send me monthly sustainability tips' },
{ id: 'consultation', name: '📞 I\'d like a free ESG consultation' }
],
defaultValue: ['report'],
orientation: 'vertical'
});
});
// ============ PDF REPORT ============
form.configurePdf('sustainability-report', pdf => {
pdf.configure({
filename: 'business-sustainability-report.pdf',
pageSize: 'A4',
allowUserDownload: true,
downloadButtonLabel: '📄 Download Sustainability Report',
header: {
title: 'Business Sustainability Assessment',
subtitle: 'ESG Performance Report'
},
footer: {
text: 'Generated by FormTs Sustainability Assessment',
showPageNumbers: true
}
});
pdf.addSection('Executive Summary', section => {
section.addRow(row => {
row.addField('Sustainability Level', getSustainabilityLabel());
row.addField('Overall Score', `${getScorePercentage()}%`);
});
section.addRow(row => {
row.addField('Est. Carbon Reduction', getEstimatedCO2Reduction());
row.addField('Assessment Date', new Date().toLocaleDateString());
});
});
pdf.addSection('Category Breakdown', section => {
const s = scores();
section.addTable(
['Category', 'Score', 'Max', 'Status'],
[
['Strategy', `${s['strategy'] || 0}`, '10', (s['strategy'] || 0) >= 7 ? '✅ Strong' : '⚠️ Improve'],
['Energy & Emissions', `${(s['renewable'] || 0) + (s['carbonTracking'] || 0) + (s['energyInitiatives'] || 0)}`, '28', (s['renewable'] || 0) >= 5 ? '✅ Strong' : '⚠️ Improve'],
['Waste & Circular', `${(s['recycling'] || 0) + (s['plastic'] || 0) + (s['circular'] || 0)}`, '22', (s['recycling'] || 0) >= 5 ? '✅ Strong' : '⚠️ Improve'],
['Supply Chain', `${(s['supplierAssessment'] || 0) + (s['localSourcing'] || 0)}`, '15', (s['supplierAssessment'] || 0) >= 5 ? '✅ Strong' : '⚠️ Improve'],
['Social & Governance', `${(s['social'] || 0) + (s['reporting'] || 0)}`, '15', (s['social'] || 0) >= 5 ? '✅ Strong' : '⚠️ Improve']
]
);
});
pdf.addPageBreak();
pdf.addSection('Quick Wins (Next 90 Days)', section => {
const s = scores();
if ((s['renewable'] || 0) < 5) {
section.addText('✅ Switch to renewable energy supplier');
}
if ((s['recycling'] || 0) < 5) {
section.addText('✅ Implement comprehensive recycling program');
}
if ((s['plastic'] || 0) < 5) {
section.addText('✅ Eliminate single-use plastics in office');
}
if ((s['carbonTracking'] || 0) < 5) {
section.addText('✅ Start measuring carbon footprint (Scope 1 & 2)');
}
});
pdf.addSection('Recommended Certifications', section => {
section.addText('• B Corp Certification - Comprehensive ESG standard');
section.addText('• ISO 14001 - Environmental Management System');
section.addText('• Carbon Neutral Certification');
section.addText('• Science Based Targets initiative (SBTi)');
});
});
// ============ SUBMIT BUTTON ============
form.configureSubmitButton({
label: () => `🌱 Get My Report (Score: ${getScorePercentage()}%)`
});
form.configureSubmitBehavior({
sendToServer: true
});
}