export function onboardingMonth3Survey(form: FormTs) {
// 90-Day Onboarding Review - Comprehensive new hire assessment
// Demonstrates: Pages (multi-page), MatrixQuestion x2, StarRating x6, RatingScale (NPS/Likert),
// EmojiRating, Slider x3, CheckboxList, RadioButton, dynamic styling, conditional visibility
// ============================================
// HEADER
// ============================================
form.addRow(row => {
row.addTextPanel('header', {
label: '90-Day Onboarding Review',
computedValue: () => 'Congratulations on completing your first 90 days! Let\'s reflect on your journey and set you up for continued success.',
customStyles: {
background: 'linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%)',
color: 'white',
padding: '28px',
borderRadius: '12px',
textAlign: 'center'
}
});
});
// ============================================
// MULTI-PAGE WIZARD
// ============================================
const pages = form.addPages('reviewPages', { heightMode: 'tallest-page' });
// ============================================
// PAGE 1: Overall Engagement & Satisfaction
// ============================================
const page1 = pages.addPage('engagement');
const engagementSection = page1.addSubform('engagementSection', {
title: 'Overall Engagement'
});
engagementSection.addRow(row => {
row.addRatingScale('enps', {
preset: 'nps',
label: 'How likely are you to recommend our company as a great place to work?',
showCategoryLabel: true,
showSegmentColors: true,
showConfettiOnPromoter: true,
isRequired: true
});
});
engagementSection.addRow(row => {
row.addTextPanel('enpsMessage', {
computedValue: () => {
const category = engagementSection.ratingScale('enps')?.npsCategory();
if (category === 'promoter') return '🎉 Fantastic! We\'re thrilled you\'re enjoying your journey with us!';
if (category === 'passive') return '🤔 Thanks for your honest feedback. We want to make this even better for you.';
if (category === 'detractor') return '😟 We appreciate your honesty. Let\'s work together to improve your experience.';
return '';
},
customStyles: () => {
const category = engagementSection.ratingScale('enps')?.npsCategory();
const base = { textAlign: 'center', padding: '12px', borderRadius: '8px', marginTop: '8px', fontWeight: '500' };
if (category === 'promoter') return { ...base, backgroundColor: '#d1fae5', color: '#065f46' };
if (category === 'passive') return { ...base, backgroundColor: '#fef3c7', color: '#92400e' };
if (category === 'detractor') return { ...base, backgroundColor: '#fee2e2', color: '#991b1b' };
return { display: 'none' };
},
isVisible: () => engagementSection.ratingScale('enps')?.value() !== null
});
});
const satisfactionSection = page1.addSubform('satisfactionSection', {
title: 'Job Satisfaction',
isVisible: () => engagementSection.ratingScale('enps')?.value() !== null
});
satisfactionSection.addRow(row => {
row.addStarRating('overallSatisfaction', {
label: 'Overall job satisfaction',
maxStars: 5,
size: 'lg',
alignment: 'center'
}, '1fr');
row.addStarRating('workLifeBalance', {
label: 'Work-life balance',
maxStars: 5,
size: 'lg',
alignment: 'center'
}, '1fr');
});
satisfactionSection.addRow(row => {
row.addEmojiRating('dailyMood', {
label: 'How do you generally feel coming to work each day?',
preset: 'mood',
size: 'lg',
showLabels: true,
alignment: 'center'
});
});
// Navigation button for page 1
page1.addRow(row => {
row.addButton('nextPage1', {
label: 'Next: Role & Performance →',
onClick: () => pages.goToPage('rolePerformance'),
isDisabled: () => engagementSection.ratingScale('enps')?.value() === null
});
});
// ============================================
// PAGE 2: Role Mastery & Performance
// ============================================
const page2 = pages.addPage('rolePerformance');
const roleMasterySection = page2.addSubform('roleMasterySection', {
title: 'Role Mastery Self-Assessment'
});
roleMasterySection.addRow(row => {
row.addMatrixQuestion('skillsAssessment', {
label: 'Rate your current proficiency in key job areas:',
rows: [
{ id: 'core-tasks', label: 'Core job responsibilities', isRequired: true },
{ id: 'tools', label: 'Required tools & software', isRequired: true },
{ id: 'processes', label: 'Company processes & procedures' },
{ id: 'domain', label: 'Industry/domain knowledge' },
{ id: 'collaboration', label: 'Cross-team collaboration' },
{ id: 'problem-solving', label: 'Independent problem-solving' }
],
columns: [
{ id: 'novice', label: 'Novice' },
{ id: 'developing', label: 'Developing' },
{ id: 'proficient', label: 'Proficient' },
{ id: 'expert', label: 'Expert' }
],
striped: true,
fullWidth: true
});
});
const performanceSection = page2.addSubform('performanceSection', {
title: 'Performance & Productivity'
});
performanceSection.addRow(row => {
row.addSlider('productivityLevel', {
label: 'How productive do you feel compared to your full potential?',
min: 0,
max: 100,
step: 10,
showValue: true,
unit: '%',
defaultValue: 70
});
});
performanceSection.addRow(row => {
row.addRatingScale('goalsClarity', {
preset: 'likert-5',
label: 'I have clear goals and know what\'s expected of me',
lowLabel: 'Strongly Disagree',
highLabel: 'Strongly Agree'
});
});
performanceSection.addRow(row => {
row.addCheckboxList('productivityBlockers', {
label: 'What prevents you from being more productive? (Select all that apply)',
options: [
{ id: 'unclear-priorities', name: 'Unclear priorities' },
{ id: 'missing-info', name: 'Missing information or access' },
{ id: 'too-many-meetings', name: 'Too many meetings' },
{ id: 'interruptions', name: 'Frequent interruptions' },
{ id: 'tools-issues', name: 'Technical/tool issues' },
{ id: 'training-gaps', name: 'Need more training' },
{ id: 'no-blockers', name: 'No significant blockers' }
],
orientation: 'vertical'
});
});
// Navigation buttons for page 2
page2.addRow(row => {
row.addButton('prevPage2', {
label: '← Back',
onClick: () => pages.goToPage('engagement')
});
row.addButton('nextPage2', {
label: 'Next: Team & Culture →',
onClick: () => pages.goToPage('teamCulture')
});
});
// ============================================
// PAGE 3: Team Integration & Culture
// ============================================
const page3 = pages.addPage('teamCulture');
const teamSection = page3.addSubform('teamSection', {
title: 'Team Dynamics'
});
teamSection.addRow(row => {
row.addStarRating('teamCollaboration', {
label: 'Team collaboration and support',
maxStars: 5,
size: 'lg',
alignment: 'center'
}, '1fr');
row.addStarRating('communicationQuality', {
label: 'Team communication quality',
maxStars: 5,
size: 'lg',
alignment: 'center'
}, '1fr');
});
teamSection.addRow(row => {
row.addRatingScale('belonging', {
preset: 'likert-5',
label: 'I feel like a valued member of my team',
lowLabel: 'Strongly Disagree',
highLabel: 'Strongly Agree'
});
});
const cultureSection = page3.addSubform('cultureSection', {
title: 'Company Culture'
});
cultureSection.addRow(row => {
row.addMatrixQuestion('cultureAlignment', {
label: 'How well do you experience these company values?',
rows: [
{ id: 'transparency', label: 'Transparency & openness' },
{ id: 'innovation', label: 'Innovation & creativity' },
{ id: 'respect', label: 'Respect & inclusion' },
{ id: 'growth', label: 'Learning & growth mindset' },
{ id: 'accountability', label: 'Accountability & ownership' }
],
columns: [
{ id: 'never', label: 'Rarely' },
{ id: 'sometimes', label: 'Sometimes' },
{ id: 'often', label: 'Often' },
{ id: 'always', label: 'Always' }
],
striped: true,
fullWidth: true
});
});
cultureSection.addRow(row => {
row.addRadioButton('cultureFit', {
label: 'Overall, do you feel you fit well with the company culture?',
options: [
{ id: 'perfect-fit', name: 'Perfect fit - I feel right at home' },
{ id: 'good-fit', name: 'Good fit - Minor adjustments needed' },
{ id: 'adjusting', name: 'Still adjusting - Give me more time' },
{ id: 'concerned', name: 'Concerned - May not be the right fit' }
],
orientation: 'vertical'
});
});
// Navigation buttons for page 3
page3.addRow(row => {
row.addButton('prevPage3', {
label: '← Back',
onClick: () => pages.goToPage('rolePerformance')
});
row.addButton('nextPage3', {
label: 'Next: Manager & Development →',
onClick: () => pages.goToPage('development')
});
});
// ============================================
// PAGE 4: Manager Support & Development
// ============================================
const page4 = pages.addPage('development');
const managerSection = page4.addSubform('managerSection', {
title: 'Manager Relationship'
});
managerSection.addRow(row => {
row.addStarRating('managerSupport', {
label: 'Manager provides adequate support and guidance',
maxStars: 5,
size: 'lg',
alignment: 'center'
}, '1fr');
row.addStarRating('feedbackQuality', {
label: 'Quality and frequency of feedback received',
maxStars: 5,
size: 'lg',
alignment: 'center'
}, '1fr');
});
managerSection.addRow(row => {
row.addSlider('feedbackFrequency', {
label: 'How often do you receive meaningful feedback?',
min: 1,
max: 5,
step: 1,
showValue: true,
defaultValue: 3
});
});
managerSection.addRow(row => {
row.addTextPanel('frequencyLabel', {
computedValue: () => {
const freq = managerSection.slider('feedbackFrequency')?.value();
const labels: Record<number, string> = {
1: 'Rarely or never',
2: 'Monthly',
3: 'Bi-weekly',
4: 'Weekly',
5: 'Multiple times per week'
};
return freq ? labels[freq] || '' : '';
},
customStyles: {
textAlign: 'center',
color: '#64748b',
fontSize: '14px',
marginTop: '-8px'
}
});
});
const developmentSection = page4.addSubform('developmentSection', {
title: 'Career Development'
});
developmentSection.addRow(row => {
row.addRatingScale('careerPath', {
preset: 'likert-5',
label: 'I understand my career growth path at this company',
lowLabel: 'Strongly Disagree',
highLabel: 'Strongly Agree'
});
});
developmentSection.addRow(row => {
row.addCheckboxList('developmentNeeds', {
label: 'What would help your professional growth? (Select top 3)',
options: [
{ id: 'mentorship', name: 'Mentorship program' },
{ id: 'training', name: 'Technical training' },
{ id: 'leadership', name: 'Leadership development' },
{ id: 'cross-functional', name: 'Cross-functional projects' },
{ id: 'certifications', name: 'Professional certifications' },
{ id: 'conferences', name: 'Conferences & networking' },
{ id: 'stretch-projects', name: 'Stretch assignments' }
],
orientation: 'vertical',
max: 3
});
});
// Navigation buttons for page 4
page4.addRow(row => {
row.addButton('prevPage4', {
label: '← Back',
onClick: () => pages.goToPage('teamCulture')
});
row.addButton('nextPage4', {
label: 'Next: Final Review →',
onClick: () => pages.goToPage('final')
});
});
// ============================================
// PAGE 5: Final Review & Goals
// ============================================
const page5 = pages.addPage('final');
const goalsSection = page5.addSubform('goalsSection', {
title: 'Looking Ahead'
});
goalsSection.addRow(row => {
row.addTextarea('shortTermGoals', {
label: 'What are your top priorities for the next 90 days?',
placeholder: 'List 2-3 key goals you want to achieve...',
rows: 3
});
});
goalsSection.addRow(row => {
row.addTextarea('supportNeeded', {
label: 'What support do you need to achieve these goals?',
placeholder: 'Resources, training, mentorship, etc...',
rows: 2
});
});
const feedbackSection = page5.addSubform('feedbackSection', {
title: 'Additional Feedback'
});
feedbackSection.addRow(row => {
row.addTextarea('bestExperience', {
label: 'What has been the best part of your first 90 days?',
placeholder: 'Share a highlight or achievement...',
rows: 2
});
});
feedbackSection.addSpacer();
feedbackSection.addRow(row => {
row.addTextarea('improvements', {
label: 'What could we improve about the onboarding experience?',
placeholder: 'Your suggestions help future new hires...',
rows: 2
});
});
// Summary section
const summarySection = page5.addSubform('summary', {
title: 'Your 90-Day Review Summary',
customStyles: () => {
const category = engagementSection.ratingScale('enps')?.npsCategory();
if (category === 'promoter') return { backgroundColor: '#ecfdf5', padding: '16px', borderRadius: '8px' };
if (category === 'passive') return { backgroundColor: '#fffbeb', padding: '16px', borderRadius: '8px' };
if (category === 'detractor') return { backgroundColor: '#fef2f2', padding: '16px', borderRadius: '8px' };
return { backgroundColor: '#f8fafc', padding: '16px', borderRadius: '8px' };
}
});
summarySection.addRow(row => {
row.addTextPanel('summaryContent', {
computedValue: () => {
const enps = engagementSection.ratingScale('enps')?.value();
const category = engagementSection.ratingScale('enps')?.npsCategory();
const satisfaction = satisfactionSection.starRating('overallSatisfaction')?.value();
const productivity = performanceSection.slider('productivityLevel')?.value();
const teamCollab = teamSection.starRating('teamCollaboration')?.value();
const managerRating = managerSection.starRating('managerSupport')?.value();
const cultureFit = cultureSection.radioButton('cultureFit')?.value();
if (!enps) return 'Complete the review to see your summary.';
let emoji = category === 'promoter' ? '🎉' : category === 'passive' ? '📊' : '⚠️';
let summary = `${emoji} 90-Day Review Summary\n`;
summary += `${'═'.repeat(35)}\n\n`;
summary += `📊 eNPS Score: ${enps}/10 (${category?.charAt(0).toUpperCase()}${category?.slice(1)})\n`;
if (satisfaction) summary += `⭐ Job Satisfaction: ${satisfaction}/5\n`;
if (productivity) summary += `📈 Self-Rated Productivity: ${productivity}%\n`;
if (teamCollab) summary += `🤝 Team Collaboration: ${teamCollab}/5\n`;
if (managerRating) summary += `👔 Manager Support: ${managerRating}/5\n`;
if (cultureFit) {
const fitLabels: Record<string, string> = {
'perfect-fit': '🏠 Perfect cultural fit',
'good-fit': '👍 Good cultural fit',
'adjusting': '🔄 Still adjusting',
'concerned': '⚠️ Cultural fit concerns'
};
summary += `\n${fitLabels[cultureFit] || cultureFit}`;
}
return summary;
},
customStyles: {
padding: '16px',
borderRadius: '8px',
whiteSpace: 'pre-wrap',
fontFamily: 'monospace',
fontSize: '14px',
backgroundColor: 'white',
border: '1px solid #e2e8f0'
}
});
});
// Back button for page 5
page5.addRow(row => {
row.addButton('prevPage5', {
label: '← Back',
onClick: () => pages.goToPage('development')
});
});
// ============================================
// FORM CONFIGURATION
// ============================================
form.configureSubmitButton({
label: 'Submit 90-Day Review',
isVisible: () => engagementSection.ratingScale('enps')?.value() !== null
});
form.configureCompletionScreen({
type: 'text',
title: 'Thank you for completing your 90-day review!',
message: 'Your feedback is incredibly valuable as we continue to improve our onboarding process. Your manager will review your responses and schedule a follow-up conversation. Here\'s to your continued success and growth with us!'
});
}