export function partyEventFeedbackForm(form: FormTs) {
// Party & Celebration Feedback - Fun and casual event feedback
// Demonstrates: EmojiRating, StarRating, SuggestionChips, ThumbRating, Slider, dynamic styling
// ============================================
// HEADER
// ============================================
form.addRow(row => {
row.addTextPanel('header', {
label: 'How Was the Party?',
computedValue: () => 'Thanks for celebrating with us! Your feedback helps us throw even better parties.',
customStyles: {
background: 'linear-gradient(135deg, #f472b6 0%, #c084fc 50%, #60a5fa 100%)',
color: 'white',
padding: '32px',
borderRadius: '16px',
textAlign: 'center'
}
});
});
// ============================================
// SECTION 1: Overall Vibe
// ============================================
const vibeSection = form.addSubform('overallVibe', {
title: 'The Vibe Check'
});
vibeSection.addRow(row => {
row.addEmojiRating('funLevel', {
label: 'How much fun did you have?',
preset: 'mood',
size: 'lg',
showLabels: true,
alignment: 'center'
});
});
vibeSection.addSpacer();
vibeSection.addRow(row => {
row.addSlider('partyEnergy', {
label: 'Party energy level',
min: 0,
max: 100,
step: 10,
defaultValue: 50,
showValue: true,
unit: '% lit'
});
});
vibeSection.addRow(row => {
row.addTextPanel('energyComment', {
computedValue: () => {
const energy = vibeSection.slider('partyEnergy')?.value() ?? 50;
if (energy >= 80) return 'Absolute banger! The party was on fire!';
if (energy >= 60) return 'Great vibes! Definitely a good time.';
if (energy >= 40) return 'Solid party, had its moments.';
if (energy >= 20) return 'A bit mellow, but still nice.';
return 'Pretty quiet... maybe next time!';
},
customStyles: () => {
const energy = vibeSection.slider('partyEnergy')?.value() ?? 50;
return {
textAlign: 'center',
fontStyle: 'italic',
color: energy >= 60 ? '#c084fc' : '#6b7280',
marginTop: '8px'
};
}
});
});
// ============================================
// SECTION 2: Venue & Atmosphere
// ============================================
const venueSection = form.addSubform('venue', {
title: 'The Place',
isVisible: () => vibeSection.emojiRating('funLevel')?.value() !== null,
customStyles: { backgroundColor: '#fdf4ff', padding: '16px', borderRadius: '12px' }
});
venueSection.addRow(row => {
row.addStarRating('venueRating', {
label: 'Venue/Location',
maxStars: 5,
size: 'lg',
alignment: 'center',
showCounter: true
}, '50%');
row.addStarRating('decorRating', {
label: 'Decorations & Setup',
maxStars: 5,
size: 'lg',
alignment: 'center',
showCounter: true
}, '50%');
});
venueSection.addRow(row => {
row.addSuggestionChips('venueHighlights', {
label: 'What stood out about the venue?',
suggestions: [
{ id: 'space', name: 'Great space' },
{ id: 'lighting', name: 'Amazing lighting' },
{ id: 'photo-spots', name: 'Photo spots' },
{ id: 'cozy', name: 'Cozy atmosphere' },
{ id: 'outdoor', name: 'Outdoor area' },
{ id: 'unique', name: 'Unique vibe' }
],
max: 3,
alignment: 'center'
});
});
// ============================================
// SECTION 3: Food & Drinks
// ============================================
const foodSection = form.addSubform('foodDrinks', {
title: 'Food & Drinks',
isVisible: () => venueSection.starRating('venueRating')?.value() !== null
});
foodSection.addRow(row => {
row.addStarRating('foodRating', {
label: 'Food quality',
maxStars: 5,
size: 'lg',
alignment: 'center',
showCounter: true
}, '50%');
row.addStarRating('drinksRating', {
label: 'Drinks selection',
maxStars: 5,
size: 'lg',
alignment: 'center',
showCounter: true
}, '50%');
});
foodSection.addRow(row => {
row.addCheckboxList('foodFaves', {
label: 'What was your favorite?',
options: [
{ id: 'appetizers', name: 'Appetizers' },
{ id: 'main-course', name: 'Main course' },
{ id: 'desserts', name: 'Desserts' },
{ id: 'cake', name: 'The cake!' },
{ id: 'cocktails', name: 'Signature drinks' },
{ id: 'snacks', name: 'Snacks' }
],
orientation: 'horizontal'
});
});
foodSection.addRow(row => {
row.addThumbRating('enoughFood', {
label: 'Was there enough food?',
showLabels: true,
upLabel: 'Plenty!',
downLabel: 'Could use more',
alignment: 'center'
});
});
// ============================================
// SECTION 4: Entertainment & Music
// ============================================
const entertainmentSection = form.addSubform('entertainment', {
title: 'Entertainment & Music',
isVisible: () => foodSection.starRating('foodRating')?.value() !== null,
customStyles: { backgroundColor: '#f0f9ff', padding: '16px', borderRadius: '12px' }
});
entertainmentSection.addRow(row => {
row.addStarRating('musicRating', {
label: 'Music & DJ',
maxStars: 5,
size: 'lg',
alignment: 'center',
showCounter: true,
showConfettiOnMax: true
});
});
entertainmentSection.addRow(row => {
row.addRadioButton('danceFloor', {
label: 'Did you hit the dance floor?',
options: [
{ id: 'all-night', name: 'All night long!' },
{ id: 'few-songs', name: 'For a few songs' },
{ id: 'watched', name: 'Watched from the sidelines' },
{ id: 'no-dancing', name: 'Not my thing' }
],
orientation: 'horizontal'
});
});
entertainmentSection.addRow(row => {
row.addSuggestionChips('entertainmentHighlights', {
label: 'Best entertainment moments?',
suggestions: [
{ id: 'live-music', name: 'Live music' },
{ id: 'dj-set', name: 'DJ set' },
{ id: 'photo-booth', name: 'Photo booth' },
{ id: 'games', name: 'Games & activities' },
{ id: 'speeches', name: 'Speeches' },
{ id: 'surprise', name: 'Special surprise' }
],
max: 3,
alignment: 'center'
});
});
// ============================================
// SECTION 5: People & Connections
// ============================================
const peopleSection = form.addSubform('people', {
title: 'The People',
isVisible: () => entertainmentSection.starRating('musicRating')?.value() !== null
});
peopleSection.addRow(row => {
row.addRadioButton('newConnections', {
label: 'Did you meet new people?',
options: [
{ id: 'many', name: 'Made lots of new friends!' },
{ id: 'few', name: 'Met a few cool people' },
{ id: 'existing', name: 'Hung out with people I knew' },
{ id: 'solo', name: 'Kept to myself' }
],
orientation: 'vertical'
});
});
peopleSection.addRow(row => {
row.addThumbRating('goodCrowd', {
label: 'Was it a good crowd?',
showLabels: true,
upLabel: 'Great crowd!',
downLabel: 'Not my vibe',
alignment: 'center'
});
});
// ============================================
// SECTION 6: Overall & Suggestions
// ============================================
const overallSection = form.addSubform('overall', {
title: 'Final Thoughts',
isVisible: () => peopleSection.thumbRating('goodCrowd')?.value() !== null
});
overallSection.addRow(row => {
row.addRatingScale('recommendParty', {
label: 'Would you recommend our parties to friends?',
preset: 'nps',
showCategoryLabel: true,
showSegmentColors: true,
showConfettiOnPromoter: true
});
});
overallSection.addSpacer();
overallSection.addRow(row => {
row.addTextarea('bestMoment', {
label: () => {
const category = overallSection.ratingScale('recommendParty')?.npsCategory();
if (category === 'promoter') return 'What was your absolute favorite moment?';
if (category === 'passive') return 'What would have made it even better?';
return 'What could we improve for next time?';
},
placeholder: 'Share the highlights or suggestions...',
rows: 3,
autoExpand: true
});
});
overallSection.addRow(row => {
row.addCheckboxList('nextPartyIdeas', {
label: 'What would you love to see at the next party?',
options: [
{ id: 'theme', name: 'Theme party' },
{ id: 'live-band', name: 'Live band' },
{ id: 'more-games', name: 'More games' },
{ id: 'outdoor', name: 'Outdoor venue' },
{ id: 'karaoke', name: 'Karaoke' },
{ id: 'surprise-guest', name: 'Surprise guest' }
],
orientation: 'horizontal'
});
});
// ============================================
// SECTION 7: Summary
// ============================================
const summarySection = form.addSubform('summary', {
title: 'Party Report Card',
isVisible: () => overallSection.ratingScale('recommendParty')?.value() !== null
});
summarySection.addRow(row => {
row.addTextPanel('summaryContent', {
computedValue: () => {
const fun = vibeSection.emojiRating('funLevel')?.value();
const energy = vibeSection.slider('partyEnergy')?.value();
const venue = venueSection.starRating('venueRating')?.value();
const decor = venueSection.starRating('decorRating')?.value();
const food = foodSection.starRating('foodRating')?.value();
const drinks = foodSection.starRating('drinksRating')?.value();
const music = entertainmentSection.starRating('musicRating')?.value();
const nps = overallSection.ratingScale('recommendParty')?.value();
const category = overallSection.ratingScale('recommendParty')?.npsCategory();
if (!fun) return '';
const funLabels: Record<string, string> = {
'sad': 'Not great',
'down': 'Meh',
'neutral': 'It was okay',
'happy': 'Had fun!',
'excited': 'AMAZING!'
};
let summary = 'Party Report Card\n';
summary += `${'═'.repeat(25)}\n\n`;
summary += `Fun Level: ${funLabels[fun] || fun}\n`;
summary += `Energy: ${energy ?? 50}% lit\n\n`;
if (venue) summary += `Venue: ${'★'.repeat(venue)}${'☆'.repeat(5 - venue)}\n`;
if (decor) summary += `Decor: ${'★'.repeat(decor)}${'☆'.repeat(5 - decor)}\n`;
if (food) summary += `Food: ${'★'.repeat(food)}${'☆'.repeat(5 - food)}\n`;
if (drinks) summary += `Drinks: ${'★'.repeat(drinks)}${'☆'.repeat(5 - drinks)}\n`;
if (music) summary += `Music: ${'★'.repeat(music)}${'☆'.repeat(5 - music)}\n`;
if (nps !== null && nps !== undefined) {
summary += `\nRecommend: ${nps}/10`;
if (category === 'promoter') summary += ' (Superfan!)';
else if (category === 'passive') summary += ' (Satisfied)';
else summary += ' (Needs work)';
}
return summary;
},
customStyles: () => {
const category = overallSection.ratingScale('recommendParty')?.npsCategory();
const baseStyles = {
padding: '20px',
borderRadius: '12px',
whiteSpace: 'pre-wrap',
fontFamily: 'monospace',
fontSize: '14px'
};
if (category === 'promoter') {
return { ...baseStyles, background: 'linear-gradient(135deg, #d1fae5 0%, #a7f3d0 100%)', borderLeft: '4px solid #10b981' };
} else if (category === 'passive') {
return { ...baseStyles, background: 'linear-gradient(135deg, #fef3c7 0%, #fde68a 100%)', borderLeft: '4px solid #f59e0b' };
} else if (category === 'detractor') {
return { ...baseStyles, background: 'linear-gradient(135deg, #fee2e2 0%, #fecaca 100%)', borderLeft: '4px solid #ef4444' };
}
return { ...baseStyles, backgroundColor: '#fdf4ff', borderLeft: '4px solid #c084fc' };
}
});
});
// ============================================
// FORM CONFIGURATION
// ============================================
form.configureSubmitButton({
label: 'Submit Feedback',
isVisible: () => overallSection.ratingScale('recommendParty')?.value() !== null
});
form.configureCompletionScreen({
type: 'text',
title: 'Thanks for the Feedback!',
message: 'Your input helps us plan even more amazing parties. Can\'t wait to see you at the next one!'
});
}