export function relationshipHealthForm(form: FormTs) {
// B2B Relationship Health Check - Comprehensive partnership assessment
// Demonstrates: NPS Scale, MatrixQuestion, StarRating, ThumbRating, EmojiRating, conditional logic, dynamic styling
// ============================================
// HEADER
// ============================================
form.addRow(row => {
row.addTextPanel('header', {
label: 'Relationship Health Check',
computedValue: () => 'Help us strengthen our partnership by sharing your honest feedback.',
customStyles: {
backgroundColor: '#0f766e',
color: 'white',
padding: '28px',
borderRadius: '12px',
textAlign: 'center'
}
});
});
// ============================================
// SECTION 1: Partnership Overview
// ============================================
const overviewSection = form.addSubform('overview', {
title: 'Partnership Overview'
});
overviewSection.addRow(row => {
row.addTextbox('companyName', {
label: 'Your Company Name',
placeholder: 'Enter company name...',
isRequired: true
}, '1fr');
row.addDropdown('partnershipDuration', {
label: 'Partnership Duration',
options: [
{ id: 'less-6m', name: 'Less than 6 months' },
{ id: '6m-1y', name: '6 months - 1 year' },
{ id: '1y-2y', name: '1-2 years' },
{ id: '2y-5y', name: '2-5 years' },
{ id: 'more-5y', name: 'More than 5 years' }
],
isRequired: true
}, '1fr');
});
overviewSection.addRow(row => {
row.addDropdown('yourRole', {
label: 'Your Role',
options: [
{ id: 'executive', name: 'Executive/C-Suite' },
{ id: 'director', name: 'Director/VP' },
{ id: 'manager', name: 'Manager' },
{ id: 'individual', name: 'Individual Contributor' },
{ id: 'other', name: 'Other' }
],
isRequired: true
}, '1fr');
row.addDropdown('interactionFreq', {
label: 'How often do you interact with us?',
options: [
{ id: 'daily', name: 'Daily' },
{ id: 'weekly', name: 'Weekly' },
{ id: 'monthly', name: 'Monthly' },
{ id: 'quarterly', name: 'Quarterly' },
{ id: 'rarely', name: 'Rarely' }
],
isRequired: true
}, '1fr');
});
// ============================================
// SECTION 2: Relationship NPS
// ============================================
const npsSection = form.addSubform('npsSection', {
title: 'Overall Partnership Health',
customStyles: () => {
const category = npsSection.ratingScale('relationshipNps')?.npsCategory();
if (category === 'promoter') return { backgroundColor: '#d1fae5', padding: '20px', borderRadius: '8px' };
if (category === 'passive') return { backgroundColor: '#fef3c7', padding: '20px', borderRadius: '8px' };
if (category === 'detractor') return { backgroundColor: '#fee2e2', padding: '20px', borderRadius: '8px' };
return { padding: '20px', borderRadius: '8px', border: '1px dashed #cbd5e1' };
}
});
npsSection.addRow(row => {
row.addRatingScale('relationshipNps', {
preset: 'nps',
label: 'How likely are you to recommend our partnership to a colleague?',
showCategoryLabel: true,
showSegmentColors: true,
showConfettiOnPromoter: true,
isRequired: true
});
});
npsSection.addSpacer({ height: '15px' });
npsSection.addRow(row => {
row.addTextarea('npsReason', {
label: () => {
const category = npsSection.ratingScale('relationshipNps')?.npsCategory();
if (category === 'promoter') return "We're thrilled! What makes our partnership stand out?";
if (category === 'passive') return 'What would make our partnership exceptional?';
if (category === 'detractor') return 'We want to improve. What are the main challenges?';
return 'Please share your thoughts on the partnership';
},
placeholder: 'Your detailed feedback helps us improve...',
rows: 3,
autoExpand: true,
isVisible: () => npsSection.ratingScale('relationshipNps')?.value() !== null
});
});
// ============================================
// SECTION 3: Relationship Dimensions Matrix
// ============================================
const dimensionsSection = form.addSubform('dimensions', {
title: 'Relationship Dimensions',
isVisible: () => npsSection.ratingScale('relationshipNps')?.value() !== null
});
dimensionsSection.addRow(row => {
row.addTextPanel('matrixIntro', {
computedValue: () => 'Rate each aspect of our partnership on a scale from Poor to Excellent.',
customStyles: {
color: '#64748b',
fontSize: '14px',
marginBottom: '16px'
}
});
});
dimensionsSection.addRow(row => {
row.addMatrixQuestion('partnershipDimensions', {
label: 'How would you rate us on each dimension?',
rows: [
{ id: 'communication', label: 'Communication Quality', description: 'Clarity, timeliness, proactiveness', isRequired: true },
{ id: 'responsiveness', label: 'Responsiveness', description: 'Speed of response to requests and issues', isRequired: true },
{ id: 'expertise', label: 'Expertise & Knowledge', description: 'Technical skills and domain knowledge', isRequired: true },
{ id: 'reliability', label: 'Reliability', description: 'Delivering on promises and commitments', isRequired: true },
{ id: 'value', label: 'Value Delivered', description: 'ROI and business impact', isRequired: true },
{ id: 'innovation', label: 'Innovation', description: 'Bringing new ideas and solutions', isRequired: false },
{ id: 'alignment', label: 'Strategic Alignment', description: 'Understanding and supporting your goals', isRequired: true }
],
columns: [
{ id: '1', label: 'Poor' },
{ id: '2', label: 'Fair' },
{ id: '3', label: 'Good' },
{ id: '4', label: 'Very Good' },
{ id: '5', label: 'Excellent' }
],
fullWidth: true,
striped: true
});
});
// ============================================
// SECTION 4: Quick Pulse Check
// ============================================
const pulseSection = form.addSubform('pulse', {
title: 'Quick Pulse Check',
isVisible: () => npsSection.ratingScale('relationshipNps')?.value() !== null
});
pulseSection.addRow(row => {
row.addEmojiRating('overallFeeling', {
label: 'How do you feel about our partnership overall?',
preset: 'satisfaction',
size: 'lg',
alignment: 'center'
});
});
pulseSection.addRow(row => {
row.addThumbRating('futurePartnership', {
label: 'Would you expand the partnership scope?',
showLabels: true,
upLabel: 'Yes, definitely',
downLabel: 'No, unlikely',
alignment: 'center'
});
});
// ============================================
// SECTION 5: Priority Areas
// ============================================
const prioritySection = form.addSubform('priorities', {
title: 'Priority Focus Areas',
isVisible: () => npsSection.ratingScale('relationshipNps')?.value() !== null
});
prioritySection.addRow(row => {
row.addCheckboxList('improvementPriorities', {
label: 'Which areas should we prioritize for improvement? (Select up to 3)',
options: [
{ id: 'response-time', name: 'Faster response times' },
{ id: 'proactive', name: 'More proactive communication' },
{ id: 'account-mgmt', name: 'Better account management' },
{ id: 'technical', name: 'Enhanced technical support' },
{ id: 'pricing', name: 'More competitive pricing' },
{ id: 'innovation', name: 'More innovative solutions' },
{ id: 'reporting', name: 'Better reporting and insights' },
{ id: 'training', name: 'More training and enablement' }
],
orientation: 'vertical',
max: 3
});
});
prioritySection.addSpacer({ height: '15px' });
prioritySection.addRow(row => {
row.addTextarea('topPriority', {
label: 'What single change would most improve our partnership?',
placeholder: 'Please be specific...',
rows: 3,
autoExpand: true
});
});
// ============================================
// SECTION 6: Competitor Comparison
// ============================================
const comparisonSection = form.addSubform('comparison', {
title: 'Competitive Standing',
isVisible: () => npsSection.ratingScale('relationshipNps')?.value() !== null
});
comparisonSection.addRow(row => {
row.addRadioButton('competitivePosition', {
label: 'Compared to alternatives, how do we rank?',
options: [
{ id: 'best', name: 'Best option available' },
{ id: 'above', name: 'Above average' },
{ id: 'average', name: 'About average' },
{ id: 'below', name: 'Below average' },
{ id: 'worst', name: 'Worst option' }
],
orientation: 'vertical'
});
});
comparisonSection.addRow(row => {
row.addTextarea('competitiveEdge', {
label: () => {
const position = comparisonSection.radioButton('competitivePosition')?.value();
if (position === 'best' || position === 'above') return 'What gives us our competitive edge?';
if (position === 'below' || position === 'worst') return 'What do competitors do better?';
return 'What would help us stand out from competitors?';
},
placeholder: 'Share your perspective...',
rows: 2,
autoExpand: true,
isVisible: () => comparisonSection.radioButton('competitivePosition')?.value() !== null
});
});
// ============================================
// SECTION 7: Risk Indicators (for Passives/Detractors)
// ============================================
const riskSection = form.addSubform('risk', {
title: 'Risk Assessment',
isVisible: () => {
const score = npsSection.ratingScale('relationshipNps')?.value();
return score !== null && score !== undefined && score <= 7;
},
customStyles: { backgroundColor: '#fef2f2', padding: '20px', borderRadius: '8px', borderLeft: '4px solid #ef4444' }
});
riskSection.addRow(row => {
row.addTextPanel('riskWarning', {
computedValue: () => 'We noticed some concerns. Help us understand better so we can address them.',
customStyles: {
color: '#991b1b',
fontSize: '14px',
marginBottom: '12px'
}
});
});
riskSection.addRow(row => {
row.addRadioButton('churnRisk', {
label: 'How likely are you to continue the partnership next year?',
options: [
{ id: 'definitely', name: 'Definitely will continue' },
{ id: 'likely', name: 'Likely will continue' },
{ id: 'uncertain', name: 'Uncertain' },
{ id: 'unlikely', name: 'Unlikely to continue' },
{ id: 'ending', name: 'Planning to end partnership' }
],
orientation: 'vertical',
isRequired: true
});
});
riskSection.addRow(row => {
row.addTextarea('escalationNeeded', {
label: 'Is there anything that needs immediate attention from leadership?',
placeholder: 'Describe any urgent issues or concerns...',
rows: 3,
autoExpand: true
});
});
// ============================================
// SECTION 8: Additional Feedback
// ============================================
const feedbackSection = form.addSubform('feedback', {
title: 'Additional Feedback',
isVisible: () => npsSection.ratingScale('relationshipNps')?.value() !== null
});
feedbackSection.addRow(row => {
row.addStarRating('accountManager', {
label: 'Rate your primary account contact',
maxStars: 5,
size: 'lg',
alignment: 'left',
showCounter: true
}, '1fr');
row.addStarRating('supportTeam', {
label: 'Rate the overall support team',
maxStars: 5,
size: 'lg',
alignment: 'left',
showCounter: true
}, '1fr');
});
feedbackSection.addSpacer({ height: '15px' });
feedbackSection.addRow(row => {
row.addTextarea('additionalComments', {
label: 'Any other feedback or suggestions?',
placeholder: 'Share anything else on your mind...',
rows: 4,
autoExpand: true
});
});
// ============================================
// SECTION 9: Summary
// ============================================
const summarySection = form.addSubform('summary', {
title: 'Partnership Health Summary',
isVisible: () => npsSection.ratingScale('relationshipNps')?.value() !== null
});
summarySection.addRow(row => {
row.addTextPanel('summaryContent', {
computedValue: () => {
const npsScore = npsSection.ratingScale('relationshipNps')?.value();
const category = npsSection.ratingScale('relationshipNps')?.npsCategory();
const duration = overviewSection.dropdown('partnershipDuration')?.value();
const feeling = pulseSection.emojiRating('overallFeeling')?.value();
const expand = pulseSection.thumbRating('futurePartnership')?.value();
const priorities = prioritySection.checkboxList('improvementPriorities')?.value() || [];
if (npsScore === null || npsScore === undefined) return '';
const durationLabels: Record<string, string> = {
'less-6m': 'Less than 6 months',
'6m-1y': '6 months - 1 year',
'1y-2y': '1-2 years',
'2y-5y': '2-5 years',
'more-5y': 'More than 5 years'
};
const feelingLabels: Record<string, string> = {
'very-bad': 'Very Dissatisfied',
'bad': 'Dissatisfied',
'neutral': 'Neutral',
'good': 'Satisfied',
'excellent': 'Very Satisfied'
};
let healthIcon = '🟡';
if (category === 'promoter') healthIcon = '🟢';
if (category === 'detractor') healthIcon = '🔴';
let summary = `${healthIcon} Partnership Health Assessment\n`;
summary += `${'═'.repeat(32)}\n\n`;
summary += `📊 Relationship NPS: ${npsScore}/10 (${category?.charAt(0).toUpperCase()}${category?.slice(1)})\n`;
if (duration) {
summary += `⏱️ Duration: ${durationLabels[duration] || duration}\n`;
}
if (feeling) {
summary += `😊 Overall Feeling: ${feelingLabels[feeling] || feeling}\n`;
}
if (expand) {
summary += `📈 Expansion Intent: ${expand === 'up' ? 'Yes' : 'No'}\n`;
}
if (priorities.length > 0) {
summary += `\n🎯 Focus Areas: ${priorities.length} selected`;
}
return summary;
},
customStyles: () => {
const category = npsSection.ratingScale('relationshipNps')?.npsCategory();
const baseStyles = {
padding: '20px',
borderRadius: '8px',
whiteSpace: 'pre-wrap',
fontFamily: 'monospace',
fontSize: '14px'
};
if (category === 'promoter') {
return { ...baseStyles, backgroundColor: '#d1fae5', borderLeft: '4px solid #10b981' };
} else if (category === 'passive') {
return { ...baseStyles, backgroundColor: '#fef3c7', borderLeft: '4px solid #f59e0b' };
} else if (category === 'detractor') {
return { ...baseStyles, backgroundColor: '#fee2e2', borderLeft: '4px solid #ef4444' };
}
return baseStyles;
}
});
});
// ============================================
// FORM CONFIGURATION
// ============================================
form.configureSubmitButton({
label: 'Submit Health Check',
isVisible: () => npsSection.ratingScale('relationshipNps')?.value() !== null
});
form.configureCompletionScreen({
type: 'text',
title: 'Thank You for Your Partnership Feedback!',
message: 'Your insights are invaluable in helping us strengthen our relationship. We will review your feedback carefully and follow up on any concerns raised.'
});
}