export function deiSurveyForm(form: FormTs) {
// DEI Climate Survey - Diversity, Equity & Inclusion
// Demonstrates: Pages, MatrixQuestion (Likert), RatingScale, EmojiRating, confidential design
// ============================================
// HEADER
// ============================================
form.addRow(row => {
row.addTextPanel('header', {
label: 'Diversity, Equity & Inclusion Survey',
computedValue: () => 'Your honest feedback helps us build a more inclusive workplace.',
customStyles: {
backgroundColor: '#7c3aed',
color: 'white',
padding: '24px',
borderRadius: '12px',
textAlign: 'center'
}
});
});
// Confidentiality Notice
form.addRow(row => {
row.addTextPanel('confidentialityNotice', {
computedValue: () => 'This survey is completely anonymous. Your responses cannot be traced back to you. We encourage honest, candid feedback to help us improve.',
customStyles: {
backgroundColor: '#faf5ff',
padding: '16px',
borderRadius: '8px',
borderLeft: '4px solid #7c3aed',
fontStyle: 'italic',
color: '#6b21a8'
}
});
});
// ============================================
// MULTI-PAGE WIZARD
// ============================================
const pages = form.addPages('surveyPages', {
heightMode: 'tallest-page'
});
// ============================================
// PAGE 1: Belonging & Inclusion
// ============================================
const page1 = pages.addPage('belonging');
const belongingSection = page1.addSubform('belongingSection', {
title: 'Sense of Belonging'
});
belongingSection.addRow(row => {
row.addEmojiRating('belongingFeeling', {
label: 'How strongly do you feel you belong at this organization?',
preset: 'custom',
emojis: [
{ id: 'outsider', emoji: '😔', label: 'Like an outsider' },
{ id: 'tolerated', emoji: '😐', label: 'Tolerated' },
{ id: 'accepted', emoji: '🙂', label: 'Accepted' },
{ id: 'valued', emoji: '😊', label: 'Valued' },
{ id: 'celebrated', emoji: '🥳', label: 'Celebrated' }
],
size: 'lg',
alignment: 'center'
});
});
belongingSection.addRow(row => {
row.addMatrixQuestion('belongingMatrix', {
label: 'Please rate your agreement with the following statements:',
rows: [
{ id: 'authentic', label: 'I can be my authentic self at work' },
{ id: 'voice', label: 'My voice and opinions are valued' },
{ id: 'team', label: 'I feel included by my immediate team' },
{ id: 'org', label: 'I feel included by the broader organization' },
{ id: 'events', label: 'Social events are inclusive of everyone' }
],
columns: [
{ id: '1', label: 'Strongly Disagree' },
{ id: '2', label: 'Disagree' },
{ id: '3', label: 'Neutral' },
{ id: '4', label: 'Agree' },
{ id: '5', label: 'Strongly Agree' }
],
striped: true,
fullWidth: true
});
});
// ============================================
// PAGE 2: Equity & Fairness
// ============================================
const page2 = pages.addPage('equity');
const equitySection = page2.addSubform('equitySection', {
title: 'Equity & Fair Treatment'
});
equitySection.addRow(row => {
row.addMatrixQuestion('equityMatrix', {
label: 'Please rate your agreement with the following statements about fairness:',
rows: [
{ id: 'opportunities', label: 'Career opportunities are equally available to all' },
{ id: 'promotions', label: 'Promotions are based on merit, not background' },
{ id: 'compensation', label: 'Compensation is fair regardless of identity' },
{ id: 'assignments', label: 'Work assignments are distributed fairly' },
{ id: 'recognition', label: 'Recognition is given equitably' },
{ id: 'development', label: 'Development opportunities are accessible to all' }
],
columns: [
{ id: '1', label: 'Strongly Disagree' },
{ id: '2', label: 'Disagree' },
{ id: '3', label: 'Neutral' },
{ id: '4', label: 'Agree' },
{ id: '5', label: 'Strongly Agree' }
],
striped: true,
fullWidth: true
});
});
equitySection.addSpacer();
equitySection.addRow(row => {
row.addRatingScale('overallFairness', {
label: 'Overall, how fair is this organization in its treatment of all employees?',
preset: 'likert-7',
lowLabel: 'Very Unfair',
highLabel: 'Very Fair',
alignment: 'center'
});
});
// ============================================
// PAGE 3: Respect & Diversity
// ============================================
const page3 = pages.addPage('respect');
const respectSection = page3.addSubform('respectSection', {
title: 'Respect for Diversity'
});
respectSection.addRow(row => {
row.addMatrixQuestion('respectMatrix', {
label: 'Please rate your agreement with the following:',
rows: [
{ id: 'backgrounds', label: 'People from all backgrounds are respected' },
{ id: 'perspectives', label: 'Diverse perspectives are actively sought out' },
{ id: 'language', label: 'Inclusive language is used in communications' },
{ id: 'holidays', label: 'Cultural and religious differences are accommodated' },
{ id: 'microaggressions', label: 'Microaggressions are addressed when they occur' }
],
columns: [
{ id: '1', label: 'Strongly Disagree' },
{ id: '2', label: 'Disagree' },
{ id: '3', label: 'Neutral' },
{ id: '4', label: 'Agree' },
{ id: '5', label: 'Strongly Agree' }
],
striped: true,
fullWidth: true
});
});
respectSection.addSpacer();
respectSection.addRow(row => {
row.addRadioButton('experiencedBias', {
label: 'In the past 12 months, have you personally experienced discrimination or bias at work?',
options: [
{ id: 'no', name: 'No, never' },
{ id: 'once', name: 'Yes, once' },
{ id: 'occasionally', name: 'Yes, occasionally' },
{ id: 'frequently', name: 'Yes, frequently' },
{ id: 'prefer-not', name: 'Prefer not to answer' }
],
orientation: 'vertical'
});
});
// Conditional: If experienced bias
respectSection.addRow(row => {
row.addCheckboxList('biasTypes', {
label: 'What type(s) of bias or discrimination? (Select all that apply)',
options: [
{ id: 'race', name: 'Race or ethnicity' },
{ id: 'gender', name: 'Gender or gender identity' },
{ id: 'age', name: 'Age' },
{ id: 'disability', name: 'Disability' },
{ id: 'religion', name: 'Religion' },
{ id: 'orientation', name: 'Sexual orientation' },
{ id: 'national', name: 'National origin' },
{ id: 'socioeconomic', name: 'Socioeconomic background' },
{ id: 'other', name: 'Other' }
],
orientation: 'vertical',
isVisible: () => {
const experienced = respectSection.radioButton('experiencedBias')?.value();
return experienced === 'once' || experienced === 'occasionally' || experienced === 'frequently';
}
});
});
// ============================================
// PAGE 4: Leadership & Accountability
// ============================================
const page4 = pages.addPage('leadership');
const leadershipSection = page4.addSubform('leadershipSection', {
title: 'Leadership Commitment'
});
leadershipSection.addRow(row => {
row.addMatrixQuestion('leadershipMatrix', {
label: 'Please rate leadership\'s commitment to DEI:',
rows: [
{ id: 'priority', label: 'DEI is a genuine priority, not just talk' },
{ id: 'model', label: 'Leaders model inclusive behaviors' },
{ id: 'accountability', label: 'Leaders are held accountable for DEI' },
{ id: 'action', label: 'Concerns about bias are addressed promptly' },
{ id: 'resources', label: 'Adequate resources are invested in DEI' }
],
columns: [
{ id: '1', label: 'Strongly Disagree' },
{ id: '2', label: 'Disagree' },
{ id: '3', label: 'Neutral' },
{ id: '4', label: 'Agree' },
{ id: '5', label: 'Strongly Agree' }
],
striped: true,
fullWidth: true
});
});
leadershipSection.addSpacer();
leadershipSection.addRow(row => {
row.addSlider('progressRating', {
label: 'How much progress has the organization made on DEI in the past year?',
min: 0,
max: 10,
step: 1,
showValue: true,
defaultValue: 5
});
});
// ============================================
// PAGE 5: Improvements & Overall
// ============================================
const page5 = pages.addPage('improvements');
const improvementsSection = page5.addSubform('improvementsSection', {
title: 'Improvements Needed'
});
improvementsSection.addRow(row => {
row.addCheckboxList('priorityAreas', {
label: 'Which areas need the most attention? (Select up to 3)',
options: [
{ id: 'hiring', name: 'Diverse hiring practices' },
{ id: 'promotion', name: 'Equitable promotion processes' },
{ id: 'training', name: 'DEI training and education' },
{ id: 'reporting', name: 'Safe reporting of incidents' },
{ id: 'ergs', name: 'Employee Resource Groups support' },
{ id: 'leadership', name: 'Leadership diversity' },
{ id: 'pay', name: 'Pay equity' },
{ id: 'flexibility', name: 'Flexible work arrangements' },
{ id: 'mentorship', name: 'Mentorship programs' }
],
orientation: 'vertical',
max: 3
});
});
improvementsSection.addSpacer();
improvementsSection.addRow(row => {
row.addSuggestionChips('positiveAspects', {
label: 'What is the organization doing well on DEI? (Select up to 4)',
suggestions: [
{ id: 'training', name: 'Training' },
{ id: 'hiring', name: 'Diverse hiring' },
{ id: 'ergs', name: 'ERGs' },
{ id: 'policies', name: 'Policies' },
{ id: 'leadership', name: 'Leadership commitment' },
{ id: 'communication', name: 'Communication' },
{ id: 'events', name: 'Cultural events' },
{ id: 'nothing', name: 'Nothing notable' }
],
max: 4,
alignment: 'left'
});
});
const overallSection = page5.addSubform('overallSection', {
title: 'Overall Assessment'
});
overallSection.addRow(row => {
row.addStarRating('overallInclusion', {
label: 'Overall, how inclusive is this organization?',
maxStars: 5,
size: 'lg',
alignment: 'center',
showConfettiOnMax: true
});
});
overallSection.addRow(row => {
row.addThumbRating('recommend', {
label: 'Would you recommend this as an inclusive place to work?',
showLabels: true,
upLabel: 'Yes',
downLabel: 'No',
size: 'lg',
alignment: 'center'
});
});
overallSection.addSpacer();
overallSection.addRow(row => {
row.addTextarea('additionalComments', {
label: 'Any additional comments or suggestions for improving DEI?',
placeholder: 'Share your thoughts anonymously...',
rows: 4,
autoExpand: true
});
});
// ============================================
// SUMMARY SECTION (Outside pages)
// ============================================
const summarySection = form.addSubform('summarySection', {
title: 'Your DEI Feedback Summary',
isVisible: () => {
const belonging = belongingSection.emojiRating('belongingFeeling')?.value();
return belonging !== null;
}
});
summarySection.addRow(row => {
row.addTextPanel('summaryContent', {
computedValue: () => {
const belonging = belongingSection.emojiRating('belongingFeeling')?.value();
const fairness = equitySection.ratingScale('overallFairness')?.value();
const progress = leadershipSection.slider('progressRating')?.value();
const overall = overallSection.starRating('overallInclusion')?.value();
const recommend = overallSection.thumbRating('recommend')?.value();
const priorities = improvementsSection.checkboxList('priorityAreas')?.value() || [];
const belongingLabels: Record<string, string> = {
'outsider': 'Outsider',
'tolerated': 'Tolerated',
'accepted': 'Accepted',
'valued': 'Valued',
'celebrated': 'Celebrated'
};
let summary = `🌈 DEI Climate Assessment\n`;
summary += `${'═'.repeat(28)}\n\n`;
if (belonging) summary += `💜 Belonging: ${belongingLabels[belonging] || belonging}\n`;
if (fairness) summary += `⚖️ Fairness: ${fairness}/7\n`;
if (progress) summary += `📈 Year Progress: ${progress}/10\n`;
if (overall) summary += `⭐ Overall Inclusion: ${overall}/5 stars\n`;
if (recommend) summary += `👍 Would Recommend: ${recommend === 'up' ? 'Yes' : 'No'}\n`;
if (priorities.length > 0) summary += `\n🎯 Priority Areas: ${priorities.length} selected`;
return summary;
},
customStyles: () => {
const overall = overallSection.starRating('overallInclusion')?.value() ?? 0;
const baseStyles = {
padding: '16px',
borderRadius: '8px',
whiteSpace: 'pre-wrap',
fontFamily: 'monospace',
fontSize: '14px'
};
if (overall >= 4) {
return { ...baseStyles, backgroundColor: '#ede9fe', borderLeft: '4px solid #7c3aed' };
} else if (overall >= 3) {
return { ...baseStyles, backgroundColor: '#fef3c7', borderLeft: '4px solid #f59e0b' };
} else {
return { ...baseStyles, backgroundColor: '#fee2e2', borderLeft: '4px solid #ef4444' };
}
}
});
});
// ============================================
// FORM CONFIGURATION
// ============================================
form.configureSubmitButton({
label: 'Submit Anonymous Feedback'
});
form.configureCompletionScreen({
type: 'text',
title: 'Thank You for Your Voice',
message: 'Your anonymous feedback is essential to creating a more inclusive workplace. Results will be shared organization-wide, and action plans will be developed based on your input.'
});
}