export function exitQuickSurvey(form: FormTs) {
// Quick Exit Survey - Streamlined 2-minute departure feedback
// Demonstrates: StarRating, RadioButton, ThumbRating, EmojiRating, conditional visibility, dynamic labels
// ============================================
// HEADER
// ============================================
form.addRow(row => {
row.addTextPanel('header', {
label: 'Quick Exit Survey',
computedValue: () => "We're sorry to see you go. Your honest feedback helps us improve for current and future team members.",
customStyles: {
backgroundColor: '#7c3aed',
color: 'white',
padding: '24px',
borderRadius: '12px',
textAlign: 'center'
}
});
});
// ============================================
// SECTION 1: Primary Departure Reason
// ============================================
const reasonSection = form.addSubform('reasonSection', {
title: 'Reason for Leaving'
});
reasonSection.addRow(row => {
row.addRadioButton('primaryReason', {
label: 'What is your primary reason for leaving?',
options: [
{ id: 'new-opportunity', name: 'Better opportunity elsewhere' },
{ id: 'compensation', name: 'Compensation & benefits' },
{ id: 'growth', name: 'Lack of career growth' },
{ id: 'management', name: 'Management/leadership issues' },
{ id: 'culture', name: 'Company culture' },
{ id: 'workload', name: 'Workload/burnout' },
{ id: 'relocation', name: 'Personal/relocation reasons' },
{ id: 'other', name: 'Other' }
],
isRequired: true,
orientation: 'vertical'
});
});
// Other reason text field (conditional)
reasonSection.addSpacer();
reasonSection.addRow(row => {
row.addTextarea('otherReason', {
label: 'Please specify:',
placeholder: 'Tell us more about your reason...',
rows: 2,
isVisible: () => reasonSection.radioButton('primaryReason')?.value() === 'other',
isRequired: () => reasonSection.radioButton('primaryReason')?.value() === 'other'
});
});
// ============================================
// SECTION 2: Experience Ratings
// ============================================
const ratingsSection = form.addSubform('ratingsSection', {
title: 'Your Experience',
customStyles: () => {
const rating = ratingsSection.starRating('overallRating')?.value();
if (rating && rating >= 4) return { backgroundColor: '#d1fae5', padding: '16px', borderRadius: '8px' };
if (rating && rating <= 2) return { backgroundColor: '#fee2e2', padding: '16px', borderRadius: '8px' };
return { backgroundColor: '#f8fafc', padding: '16px', borderRadius: '8px' };
}
});
ratingsSection.addRow(row => {
row.addStarRating('overallRating', {
label: 'How would you rate your overall experience working here?',
maxStars: 5,
size: 'lg',
alignment: 'center',
showConfettiOnMax: true
});
});
ratingsSection.addSpacer({ height: '20px' });
ratingsSection.addRow(row => {
row.addThumbRating('wouldRecommend', {
label: 'Would you recommend this company as a place to work?',
showLabels: true,
upLabel: 'Yes',
downLabel: 'No',
size: 'lg',
alignment: 'center'
});
});
// ============================================
// SECTION 3: Emotional Check-in
// ============================================
const emotionSection = form.addSubform('emotionSection', {
title: 'How Do You Feel?',
customStyles: { backgroundColor: '#faf5ff', padding: '16px', borderRadius: '8px' }
});
emotionSection.addRow(row => {
row.addEmojiRating('leavingMood', {
label: () => {
const wouldRecommend = ratingsSection.thumbRating('wouldRecommend')?.value();
if (wouldRecommend === 'up') return 'How are you feeling about moving on?';
if (wouldRecommend === 'down') return "We understand it's been tough. How are you feeling?";
return 'How are you feeling about your departure?';
},
preset: 'mood',
size: 'lg',
showLabels: true,
alignment: 'center'
});
});
// ============================================
// SECTION 4: What Could Have Made You Stay?
// ============================================
const staySection = form.addSubform('staySection', {
title: 'What Could Have Changed?',
isVisible: () => {
const rating = ratingsSection.starRating('overallRating')?.value();
return rating !== null && rating !== undefined;
}
});
staySection.addRow(row => {
row.addRatingScale('stayLikelihood', {
label: () => {
const reason = reasonSection.radioButton('primaryReason')?.value();
if (reason === 'compensation') return 'If compensation had been higher, how likely would you have stayed?';
if (reason === 'growth') return 'If growth opportunities had been better, how likely would you have stayed?';
if (reason === 'management') return 'If management issues had been addressed, how likely would you have stayed?';
return 'If things had been different, how likely would you have stayed?';
},
preset: 'likert-5',
lowLabel: 'Very unlikely',
highLabel: 'Very likely',
size: 'md',
alignment: 'center'
});
});
staySection.addSpacer();
staySection.addRow(row => {
row.addTextarea('improvementSuggestion', {
label: 'What one thing would you improve about working here?',
placeholder: 'Your honest feedback helps us get better...',
rows: 3,
autoExpand: true
});
});
// ============================================
// SECTION 5: Best Part (for positive experiences)
// ============================================
const bestPartSection = form.addSubform('bestPartSection', {
title: 'The Good Parts',
isVisible: () => {
const rating = ratingsSection.starRating('overallRating')?.value();
return rating !== null && rating !== undefined && rating >= 3;
},
customStyles: { backgroundColor: '#ecfdf5', padding: '16px', borderRadius: '8px' }
});
bestPartSection.addRow(row => {
row.addSuggestionChips('bestAspects', {
label: 'What will you miss most? (Select up to 3)',
suggestions: [
{ id: 'colleagues', name: 'Colleagues' },
{ id: 'culture', name: 'Culture' },
{ id: 'flexibility', name: 'Flexibility' },
{ id: 'learning', name: 'Learning opportunities' },
{ id: 'benefits', name: 'Benefits' },
{ id: 'work', name: 'The work itself' },
{ id: 'leadership', name: 'Leadership' },
{ id: 'location', name: 'Location/office' }
],
max: 3,
alignment: 'center'
});
});
// ============================================
// SECTION 6: Contact Permission
// ============================================
const contactSection = form.addSubform('contactSection', {
title: 'Stay Connected',
isVisible: () => ratingsSection.starRating('overallRating')?.value() !== null
});
contactSection.addRow(row => {
row.addCheckbox('allowFollowUp', {
label: 'HR may contact me for additional feedback'
});
});
contactSection.addRow(row => {
row.addEmail('personalEmail', {
label: 'Personal email (optional)',
placeholder: 'your.personal@email.com',
isVisible: () => contactSection.checkbox('allowFollowUp')?.value() === true
});
});
// ============================================
// SECTION 7: Summary
// ============================================
const summarySection = form.addSubform('summarySection', {
title: 'Your Feedback Summary',
isVisible: () => {
const reason = reasonSection.radioButton('primaryReason')?.value();
const rating = ratingsSection.starRating('overallRating')?.value();
return reason !== null && rating !== null;
}
});
summarySection.addRow(row => {
row.addTextPanel('summary', {
computedValue: () => {
const reason = reasonSection.radioButton('primaryReason')?.value();
const rating = ratingsSection.starRating('overallRating')?.value();
const wouldRecommend = ratingsSection.thumbRating('wouldRecommend')?.value();
const mood = emotionSection.emojiRating('leavingMood')?.value();
const bestAspects = bestPartSection.suggestionChips('bestAspects')?.value() || [];
if (!reason || !rating) return '';
const reasonLabels: Record<string, string> = {
'new-opportunity': 'Better opportunity elsewhere',
'compensation': 'Compensation & benefits',
'growth': 'Lack of career growth',
'management': 'Management issues',
'culture': 'Company culture',
'workload': 'Workload/burnout',
'relocation': 'Personal/relocation',
'other': 'Other reason'
};
const moodLabels: Record<string, string> = {
'sad': 'Sad',
'down': 'Down',
'neutral': 'Neutral',
'happy': 'Happy',
'excited': 'Excited'
};
let summary = `Exit Survey Summary\n`;
summary += `${'═'.repeat(25)}\n\n`;
summary += `Primary Reason: ${reasonLabels[reason] || reason}\n`;
summary += `Overall Rating: ${'★'.repeat(rating)}${'☆'.repeat(5 - rating)} (${rating}/5)\n`;
if (wouldRecommend) {
summary += `Would Recommend: ${wouldRecommend === 'up' ? '👍 Yes' : '👎 No'}\n`;
}
if (mood) {
summary += `Departure Mood: ${moodLabels[mood] || mood}\n`;
}
if (bestAspects.length > 0) {
summary += `\nWill Miss: ${bestAspects.join(', ')}`;
}
return summary;
},
customStyles: () => {
const rating = ratingsSection.starRating('overallRating')?.value();
const baseStyles = {
padding: '16px',
borderRadius: '8px',
whiteSpace: 'pre-wrap',
fontFamily: 'monospace',
fontSize: '14px'
};
if (rating && rating >= 4) {
return { ...baseStyles, backgroundColor: '#d1fae5', borderLeft: '4px solid #10b981' };
} else if (rating && rating <= 2) {
return { ...baseStyles, backgroundColor: '#fee2e2', borderLeft: '4px solid #ef4444' };
}
return { ...baseStyles, backgroundColor: '#fef3c7', borderLeft: '4px solid #f59e0b' };
}
});
});
// ============================================
// FORM CONFIGURATION
// ============================================
form.configureSubmitButton({
label: () => {
const reason = reasonSection.radioButton('primaryReason')?.value();
if (!reason) return 'Please complete required fields';
return 'Submit Feedback';
},
isVisible: () => {
const reason = reasonSection.radioButton('primaryReason')?.value();
const rating = ratingsSection.starRating('overallRating')?.value();
return reason !== null && rating !== null;
}
});
form.configureCompletionScreen({
type: 'text',
title: 'Thank You and Best Wishes!',
message: "We appreciate you taking the time to share your feedback. Your insights help us create a better workplace. We wish you all the best in your future endeavors!"
});
}