export function courseEvaluation(form: FormTs) {
// Course Evaluation Form - Educational feedback with comprehensive assessment
// Demonstrates: MatrixQuestion, RatingScale (likert), NPS, conditional sections, Slider
// ============================================
// HEADER
// ============================================
form.addRow(row => {
row.addTextPanel('header', {
label: 'Course Evaluation',
computedValue: () => 'Your feedback helps us improve the learning experience',
customStyles: {
backgroundColor: '#8b5cf6',
color: 'white',
padding: '24px',
borderRadius: '12px',
textAlign: 'center'
}
});
});
// ============================================
// SECTION 1: Course Information
// ============================================
const courseInfo = form.addSubform('courseInfo', {
title: 'Course Details',
customStyles: { backgroundColor: '#f5f3ff', padding: '16px', borderRadius: '8px' }
});
courseInfo.addRow(row => {
row.addTextbox('courseName', {
label: 'Course Name',
placeholder: 'e.g., Introduction to Data Science',
isRequired: true
}, '2fr');
row.addTextbox('instructorName', {
label: 'Instructor Name',
placeholder: 'e.g., Dr. Jane Smith'
}, '1fr');
});
courseInfo.addRow(row => {
row.addDropdown('courseFormat', {
label: 'Course Format',
options: [
{ id: 'inperson', name: 'In-Person' },
{ id: 'online-live', name: 'Online Live (Synchronous)' },
{ id: 'online-self', name: 'Online Self-Paced' },
{ id: 'hybrid', name: 'Hybrid (Mix of In-Person & Online)' }
],
placeholder: 'Select format'
}, '1fr');
row.addDropdown('completionStatus', {
label: 'Completion Status',
options: [
{ id: 'completed', name: 'Completed the course' },
{ id: 'inprogress', name: 'Still in progress' },
{ id: 'dropped', name: 'Dropped/Withdrew' }
],
placeholder: 'Select status'
}, '1fr');
});
// ============================================
// SECTION 2: Overall Rating
// ============================================
const overallSection = form.addSubform('overallSection', {
title: 'Overall Assessment',
customStyles: { padding: '16px', borderRadius: '8px', border: '1px solid #e2e8f0' }
});
overallSection.addRow(row => {
row.addRatingScale('overallSatisfaction', {
preset: 'satisfaction',
label: 'Overall, how satisfied are you with this course?',
size: 'lg',
alignment: 'center',
isRequired: true
});
});
overallSection.addRow(row => {
row.addStarRating('courseRating', {
label: 'Rate this course',
maxStars: 5,
size: 'xl',
alignment: 'center',
showConfettiOnMax: true
});
});
// ============================================
// SECTION 3: Course Content Evaluation (MatrixQuestion)
// ============================================
const contentSection = form.addSubform('contentSection', {
title: 'Course Content',
isVisible: () => overallSection.ratingScale('overallSatisfaction')?.value() !== null,
customStyles: { padding: '16px', borderRadius: '8px', backgroundColor: '#fafafa' }
});
contentSection.addRow(row => {
row.addMatrixQuestion('contentRatings', {
label: 'Please rate the following aspects of the course content:',
rows: [
{ id: 'relevance', label: 'Content relevance to learning objectives', isRequired: true },
{ id: 'organization', label: 'Course organization and structure', isRequired: true },
{ id: 'difficulty', label: 'Appropriate difficulty level', isRequired: false },
{ id: 'materials', label: 'Quality of learning materials', isRequired: false },
{ id: 'practical', label: 'Practical applicability of content', isRequired: false },
{ id: 'uptodate', label: 'Content is current and up-to-date', isRequired: false }
],
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
});
});
// ============================================
// SECTION 4: Instructor Evaluation
// ============================================
const instructorSection = form.addSubform('instructorSection', {
title: 'Instructor Assessment',
isVisible: () => overallSection.ratingScale('overallSatisfaction')?.value() !== null,
customStyles: { padding: '16px', borderRadius: '8px', border: '1px solid #e2e8f0' }
});
instructorSection.addRow(row => {
row.addMatrixQuestion('instructorRatings', {
label: 'Please rate the instructor on the following:',
rows: [
{ id: 'knowledge', label: 'Subject matter expertise', isRequired: true },
{ id: 'clarity', label: 'Explains concepts clearly', isRequired: true },
{ id: 'engagement', label: 'Keeps students engaged', isRequired: false },
{ id: 'availability', label: 'Available for questions/help', isRequired: false },
{ id: 'feedback', label: 'Provides helpful feedback', isRequired: false },
{ id: 'respect', label: 'Treats students with respect', isRequired: false }
],
columns: [
{ id: '1', label: 'Poor' },
{ id: '2', label: 'Fair' },
{ id: '3', label: 'Good' },
{ id: '4', label: 'Very Good' },
{ id: '5', label: 'Excellent' }
],
striped: true,
fullWidth: true
});
});
instructorSection.addRow(row => {
row.addTextarea('instructorStrengths', {
label: 'What did the instructor do well?',
placeholder: 'Share what you appreciated about the teaching...',
rows: 2,
autoExpand: true
});
});
// ============================================
// SECTION 5: Workload & Difficulty
// ============================================
const workloadSection = form.addSubform('workloadSection', {
title: 'Workload & Difficulty',
isVisible: () => overallSection.ratingScale('overallSatisfaction')?.value() !== null,
customStyles: { padding: '16px', borderRadius: '8px', backgroundColor: '#fef3c7' }
});
workloadSection.addRow(row => {
row.addSlider('workloadLevel', {
label: 'Course Workload',
min: 1,
max: 5,
step: 1,
showValue: true,
defaultValue: 3
});
});
workloadSection.addRow(row => {
row.addTextPanel('workloadLabels', {
computedValue: () => {
const val = workloadSection.slider('workloadLevel')?.value();
if (val === 1) return '1 = Too light, not enough challenge';
if (val === 2) return '2 = Slightly light';
if (val === 3) return '3 = Just right';
if (val === 4) return '4 = Slightly heavy';
if (val === 5) return '5 = Too heavy, overwhelming';
return 'Move slider to rate workload';
},
customStyles: {
textAlign: 'center',
fontSize: '14px',
color: '#666',
fontStyle: 'italic'
}
});
});
workloadSection.addRow(row => {
row.addSlider('difficultyLevel', {
label: 'Course Difficulty',
min: 1,
max: 5,
step: 1,
showValue: true,
defaultValue: 3
});
});
workloadSection.addRow(row => {
row.addInteger('hoursPerWeek', {
label: 'Approximate hours spent per week (outside class)',
min: 0,
max: 40,
placeholder: 'e.g., 5'
});
});
// ============================================
// SECTION 6: Learning Outcomes
// ============================================
const outcomesSection = form.addSubform('outcomesSection', {
title: 'Learning Outcomes',
isVisible: () => overallSection.ratingScale('overallSatisfaction')?.value() !== null,
customStyles: { padding: '16px', borderRadius: '8px', backgroundColor: '#ecfdf5' }
});
outcomesSection.addRow(row => {
row.addRatingScale('learningGain', {
preset: 'likert-5',
label: 'I learned a significant amount in this course',
alignment: 'center',
lowLabel: 'Strongly Disagree',
highLabel: 'Strongly Agree'
});
});
outcomesSection.addRow(row => {
row.addRatingScale('skillsGained', {
preset: 'likert-5',
label: 'I gained practical skills I can apply',
alignment: 'center',
lowLabel: 'Strongly Disagree',
highLabel: 'Strongly Agree'
});
});
outcomesSection.addRow(row => {
row.addSuggestionChips('skillsLearned', {
label: 'What key skills or knowledge did you gain?',
suggestions: [
{ id: 'critical', name: 'Critical Thinking' },
{ id: 'technical', name: 'Technical Skills' },
{ id: 'communication', name: 'Communication' },
{ id: 'problem', name: 'Problem Solving' },
{ id: 'teamwork', name: 'Teamwork' },
{ id: 'research', name: 'Research Skills' },
{ id: 'creativity', name: 'Creativity' },
{ id: 'domain', name: 'Domain Knowledge' }
],
alignment: 'left'
});
});
// ============================================
// SECTION 7: Issues & Suggestions (Conditional)
// ============================================
const issuesSection = form.addSubform('issuesSection', {
title: 'Areas for Improvement',
isVisible: () => {
const rating = overallSection.ratingScale('overallSatisfaction')?.value();
return rating !== null && rating !== undefined && rating <= 3;
},
customStyles: { padding: '16px', borderRadius: '8px', backgroundColor: '#fef2f2', borderLeft: '4px solid #ef4444' }
});
issuesSection.addRow(row => {
row.addCheckboxList('issueAreas', {
label: 'What areas need improvement?',
options: [
{ id: 'content', name: 'Course content quality' },
{ id: 'pace', name: 'Course pace (too fast/slow)' },
{ id: 'materials', name: 'Learning materials' },
{ id: 'assignments', name: 'Assignments and exams' },
{ id: 'communication', name: 'Instructor communication' },
{ id: 'technology', name: 'Technology/platform issues' },
{ id: 'support', name: 'Student support' }
],
orientation: 'vertical'
});
});
issuesSection.addRow(row => {
row.addTextarea('improvementSuggestions', {
label: 'Specific suggestions for improvement',
placeholder: 'How could this course be improved?',
rows: 3,
autoExpand: true
});
});
// ============================================
// SECTION 8: Recommendation
// ============================================
const recommendSection = form.addSubform('recommendSection', {
title: 'Would You Recommend This Course?',
isVisible: () => overallSection.ratingScale('overallSatisfaction')?.value() !== null,
customStyles: () => {
const nps = recommendSection.ratingScale('npsScore')?.npsCategory();
if (nps === 'promoter') return { backgroundColor: '#d1fae5', padding: '16px', borderRadius: '8px' };
if (nps === 'passive') return { backgroundColor: '#fef3c7', padding: '16px', borderRadius: '8px' };
if (nps === 'detractor') return { backgroundColor: '#fee2e2', padding: '16px', borderRadius: '8px' };
return { padding: '16px', borderRadius: '8px', border: '1px dashed #cbd5e1' };
}
});
recommendSection.addRow(row => {
row.addRatingScale('npsScore', {
preset: 'nps',
label: 'How likely are you to recommend this course to other students?',
showCategoryLabel: true,
showSegmentColors: true,
showConfettiOnPromoter: true
});
});
recommendSection.addRow(row => {
row.addCheckbox('takeAgain', {
label: 'I would take another course with this instructor'
});
});
// ============================================
// SECTION 9: Open Feedback
// ============================================
const feedbackSection = form.addSubform('feedbackSection', {
title: 'Additional Comments',
isVisible: () => overallSection.ratingScale('overallSatisfaction')?.value() !== null
});
feedbackSection.addRow(row => {
row.addTextarea('bestPart', {
label: 'What was the best part of this course?',
placeholder: 'Share what you enjoyed most...',
rows: 2,
autoExpand: true
});
});
feedbackSection.addRow(row => {
row.addTextarea('additionalComments', {
label: 'Any other comments or feedback?',
placeholder: 'We value all your thoughts...',
rows: 3,
autoExpand: true
});
});
// ============================================
// FORM CONFIGURATION
// ============================================
form.configureSubmitButton({
label: 'Submit Evaluation',
isVisible: () => overallSection.ratingScale('overallSatisfaction')?.value() !== null
});
form.configureCompletionScreen({
type: 'text',
title: 'Thank You for Your Evaluation!',
message: 'Your feedback is essential for improving our courses and teaching. We appreciate you taking the time to share your experience.'
});
}