export function dataBreachReport(form: FormTs) {
// Data Breach Incident Report Form
// Demonstrates: Pages (multi-page wizard), Datepicker, Timepicker, MatrixQuestion, Slider, Integer, conditional flows
// ============================================
// HEADER - Critical Alert Style
// ============================================
form.addRow(row => {
row.addTextPanel('header', {
label: 'Data Breach Incident Report',
computedValue: () => 'CRITICAL: Document all details immediately. Time-sensitive for compliance.',
customStyles: {
backgroundColor: '#dc2626',
color: 'white',
padding: '24px',
borderRadius: '12px',
textAlign: 'center'
}
});
});
// ============================================
// MULTI-PAGE WIZARD
// ============================================
const pages = form.addPages('incidentPages', { heightMode: 'current-page' });
// ==========================================
// PAGE 1: Discovery & Timeline
// ==========================================
const page1 = pages.addPage('discovery');
page1.setTitle(() => 'Step 1: Discovery & Timeline');
const discoverySection = page1.addSubform('discoverySection', {
title: 'When Was the Breach Discovered?',
customStyles: { backgroundColor: '#fef2f2', padding: '20px', borderRadius: '10px' }
});
discoverySection.addRow(row => {
row.addDatepicker('discoveryDate', {
label: 'Date Breach Was Discovered',
isRequired: true
}, '1fr');
row.addTimepicker('discoveryTime', {
label: 'Approximate Time',
isRequired: true
}, '1fr');
});
discoverySection.addRow(row => {
row.addDropdown('discoveryMethod', {
label: 'How Was the Breach Discovered?',
options: [
{ id: 'monitoring', name: 'Security Monitoring/Alerts' },
{ id: 'employee', name: 'Employee Report' },
{ id: 'customer', name: 'Customer Complaint' },
{ id: 'third-party', name: 'Third Party Notification' },
{ id: 'audit', name: 'Audit/Review' },
{ id: 'law-enforcement', name: 'Law Enforcement Notification' },
{ id: 'media', name: 'Media Report' },
{ id: 'other', name: 'Other' }
],
isRequired: true
});
});
const reporterSection = page1.addSubform('reporterSection', {
title: 'Reporter Information'
});
reporterSection.addRow(row => {
row.addTextbox('reporterName', {
label: 'Your Name',
isRequired: true
}, '1fr');
row.addDropdown('reporterRole', {
label: 'Your Role',
options: [
{ id: 'it-security', name: 'IT/Security Staff' },
{ id: 'dpo', name: 'Data Protection Officer' },
{ id: 'management', name: 'Management' },
{ id: 'employee', name: 'Employee' },
{ id: 'contractor', name: 'Contractor/Vendor' },
{ id: 'other', name: 'Other' }
],
isRequired: true
}, '1fr');
});
reporterSection.addRow(row => {
row.addEmail('reporterEmail', {
label: 'Contact Email',
isRequired: true
}, '1fr');
row.addTextbox('reporterPhone', {
label: 'Contact Phone',
placeholder: '+1 (555) 123-4567'
}, '1fr');
});
// ==========================================
// PAGE 2: Incident Details
// ==========================================
const page2 = pages.addPage('details');
page2.setTitle(() => 'Step 2: Incident Details');
const incidentTypeSection = page2.addSubform('incidentTypeSection', {
title: 'Type of Incident',
customStyles: { backgroundColor: '#fff7ed', padding: '20px', borderRadius: '10px' }
});
incidentTypeSection.addRow(row => {
row.addDropdown('breachType', {
label: 'Primary Breach Type',
options: [
{ id: 'hacking', name: 'Hacking/Cyber Attack' },
{ id: 'malware', name: 'Malware/Ransomware' },
{ id: 'phishing', name: 'Phishing Attack' },
{ id: 'unauthorized-access', name: 'Unauthorized Access' },
{ id: 'lost-device', name: 'Lost/Stolen Device' },
{ id: 'misdirected-email', name: 'Misdirected Email/Fax' },
{ id: 'improper-disposal', name: 'Improper Disposal' },
{ id: 'insider-threat', name: 'Insider Threat' },
{ id: 'vendor-breach', name: 'Third-Party/Vendor Breach' },
{ id: 'physical', name: 'Physical Break-in' },
{ id: 'unknown', name: 'Unknown/Under Investigation' }
],
isRequired: true
});
});
incidentTypeSection.addRow(row => {
row.addRadioButton('intentional', {
label: 'Was this breach intentional or accidental?',
options: [
{ id: 'intentional', name: 'Intentional (malicious)' },
{ id: 'accidental', name: 'Accidental' },
{ id: 'unknown', name: 'Unknown at this time' }
],
orientation: 'horizontal',
isRequired: true
});
});
const descriptionSection = page2.addSubform('descriptionSection', {
title: 'Incident Description'
});
descriptionSection.addRow(row => {
row.addTextarea('incidentDescription', {
label: 'Describe what happened:',
placeholder: 'Provide a detailed description of the incident, how it was discovered, and any known details about how the breach occurred...',
rows: 5,
autoExpand: true,
isRequired: true
});
});
// ==========================================
// PAGE 3: Affected Data & Systems
// ==========================================
const page3 = pages.addPage('scope');
page3.setTitle(() => 'Step 3: Affected Data & Scope');
const dataTypesSection = page3.addSubform('dataTypesSection', {
title: 'Types of Data Affected',
customStyles: { backgroundColor: '#fef3c7', padding: '20px', borderRadius: '10px' }
});
dataTypesSection.addRow(row => {
row.addMatrixQuestion('dataMatrix', {
label: 'What types of data were potentially exposed?',
rows: [
{ id: 'names', label: 'Names', description: 'Full names of individuals', isRequired: false },
{ id: 'contact', label: 'Contact Information', description: 'Email, phone, address', isRequired: false },
{ id: 'financial', label: 'Financial Data', description: 'Bank accounts, credit cards', isRequired: false },
{ id: 'health', label: 'Health Information', description: 'Medical records, health data', isRequired: false },
{ id: 'ssn', label: 'Government IDs', description: 'SSN, passport, driver license', isRequired: false },
{ id: 'credentials', label: 'Login Credentials', description: 'Usernames, passwords', isRequired: false },
{ id: 'proprietary', label: 'Proprietary Data', description: 'Trade secrets, IP', isRequired: false }
],
columns: [
{ id: 'not-affected', label: 'Not Affected' },
{ id: 'possibly', label: 'Possibly' },
{ id: 'confirmed', label: 'Confirmed' }
],
striped: true,
fullWidth: true
});
});
const scopeSection = page3.addSubform('scopeSection', {
title: 'Scope Assessment'
});
scopeSection.addRow(row => {
row.addInteger('estimatedRecords', {
label: 'Estimated Number of Records Affected',
min: 0,
placeholder: 'Enter estimated count (or 0 if unknown)',
isRequired: true
}, '1fr');
row.addDropdown('recordConfidence', {
label: 'Confidence Level in Estimate',
options: [
{ id: 'confirmed', name: 'Confirmed/Exact' },
{ id: 'high', name: 'High Confidence' },
{ id: 'medium', name: 'Medium Confidence' },
{ id: 'low', name: 'Low Confidence/Best Guess' },
{ id: 'unknown', name: 'Unknown - Investigation Ongoing' }
],
isRequired: true
}, '1fr');
});
scopeSection.addRow(row => {
row.addCheckboxList('systemsAffected', {
label: 'Which systems were affected?',
options: [
{ id: 'database', name: 'Database Server' },
{ id: 'web-server', name: 'Web Server' },
{ id: 'email', name: 'Email System' },
{ id: 'file-storage', name: 'File Storage/Cloud' },
{ id: 'crm', name: 'CRM System' },
{ id: 'hr-system', name: 'HR/Payroll System' },
{ id: 'backup', name: 'Backup Systems' },
{ id: 'endpoint', name: 'Employee Devices' },
{ id: 'third-party', name: 'Third-Party Service' },
{ id: 'physical', name: 'Physical Records' }
],
orientation: 'vertical'
});
});
// ==========================================
// PAGE 4: Severity & Response
// ==========================================
const page4 = pages.addPage('response');
page4.setTitle(() => 'Step 4: Severity & Response');
const severitySection = page4.addSubform('severitySection', {
title: 'Severity Assessment',
customStyles: () => {
const severity = severitySection.slider('severityLevel')?.value();
if (severity !== null && severity !== undefined) {
if (severity >= 8) return { backgroundColor: '#fee2e2', padding: '20px', borderRadius: '10px' };
if (severity >= 5) return { backgroundColor: '#fef3c7', padding: '20px', borderRadius: '10px' };
return { backgroundColor: '#d1fae5', padding: '20px', borderRadius: '10px' };
}
return { backgroundColor: '#f8fafc', padding: '20px', borderRadius: '10px' };
}
});
severitySection.addRow(row => {
row.addSlider('severityLevel', {
label: () => {
const severity = severitySection.slider('severityLevel')?.value();
if (severity !== null && severity !== undefined) {
if (severity >= 8) return 'Severity Level: CRITICAL';
if (severity >= 5) return 'Severity Level: HIGH';
if (severity >= 3) return 'Severity Level: MEDIUM';
return 'Severity Level: LOW';
}
return 'Severity Level (1-10)';
},
min: 1,
max: 10,
step: 1,
showValue: true,
defaultValue: 5
});
});
severitySection.addRow(row => {
row.addCheckboxList('riskFactors', {
label: 'Risk Factors Present (select all that apply):',
options: [
{ id: 'sensitive-data', name: 'Highly sensitive personal data involved' },
{ id: 'large-scale', name: 'Large number of individuals affected' },
{ id: 'high-risk-group', name: 'Vulnerable individuals affected (children, patients)' },
{ id: 'no-encryption', name: 'Data was not encrypted' },
{ id: 'ongoing', name: 'Breach may still be ongoing' },
{ id: 'malicious', name: 'Confirmed malicious intent' },
{ id: 'public', name: 'Data may be public or sold' },
{ id: 'regulatory', name: 'Regulatory notification required' }
],
orientation: 'vertical'
});
});
const responseSection = page4.addSubform('responseSection', {
title: 'Immediate Response Actions'
});
responseSection.addRow(row => {
row.addCheckboxList('actionsTaken', {
label: 'Actions Already Taken:',
options: [
{ id: 'contained', name: 'Breach has been contained' },
{ id: 'systems-secured', name: 'Affected systems secured/isolated' },
{ id: 'passwords-reset', name: 'Passwords reset' },
{ id: 'evidence-preserved', name: 'Evidence preserved for investigation' },
{ id: 'it-notified', name: 'IT/Security team notified' },
{ id: 'management-notified', name: 'Management notified' },
{ id: 'dpo-notified', name: 'Data Protection Officer notified' },
{ id: 'legal-notified', name: 'Legal counsel engaged' }
],
orientation: 'vertical'
});
});
responseSection.addSpacer({ height: '15px' });
responseSection.addRow(row => {
row.addTextarea('nextSteps', {
label: 'Planned Next Steps:',
placeholder: 'Describe the immediate next steps planned for investigation and remediation...',
rows: 4,
autoExpand: true
});
});
// ============================================
// SUMMARY SECTION (after pages)
// ============================================
const summarySection = form.addSubform('summarySection', {
title: 'Incident Report Summary',
isVisible: () => {
const severity = severitySection.slider('severityLevel')?.value();
return severity !== null && severity !== undefined;
}
});
summarySection.addRow(row => {
row.addTextPanel('summaryContent', {
computedValue: () => {
const discoveryDate = discoverySection.datepicker('discoveryDate')?.value();
const breachType = incidentTypeSection.dropdown('breachType')?.value();
const estimatedRecords = scopeSection.integer('estimatedRecords')?.value();
const severity = severitySection.slider('severityLevel')?.value();
const actions = responseSection.checkboxList('actionsTaken')?.value() || [];
if (!severity) return '';
const breachTypeLabels: Record<string, string> = {
'hacking': 'Cyber Attack', 'malware': 'Malware/Ransomware', 'phishing': 'Phishing',
'unauthorized-access': 'Unauthorized Access', 'lost-device': 'Lost Device',
'misdirected-email': 'Misdirected Email', 'improper-disposal': 'Improper Disposal',
'insider-threat': 'Insider Threat', 'vendor-breach': 'Vendor Breach',
'physical': 'Physical Break-in', 'unknown': 'Under Investigation'
};
let severityEmoji = '🔴';
let severityText = 'CRITICAL';
if (severity < 8) { severityEmoji = '🟠'; severityText = 'HIGH'; }
if (severity < 5) { severityEmoji = '🟡'; severityText = 'MEDIUM'; }
if (severity < 3) { severityEmoji = '🟢'; severityText = 'LOW'; }
let summary = `${severityEmoji} DATA BREACH INCIDENT REPORT\n`;
summary += `${'═'.repeat(35)}\n\n`;
summary += `⚠️ Severity: ${severityText} (${severity}/10)\n\n`;
if (discoveryDate) summary += `📅 Discovered: ${discoveryDate}\n`;
if (breachType) summary += `🔓 Type: ${breachTypeLabels[breachType] || breachType}\n`;
if (estimatedRecords !== null && estimatedRecords !== undefined) {
summary += `📊 Est. Records: ${estimatedRecords.toLocaleString()}\n`;
}
summary += `\n✅ Actions Taken: ${actions.length} items\n`;
const containedAction = actions.includes('contained');
summary += `\n${containedAction ? '🔒 Breach CONTAINED' : '⚠️ Breach may be ONGOING'}`;
return summary;
},
customStyles: () => {
const severity = severitySection.slider('severityLevel')?.value() ?? 5;
const baseStyles = {
padding: '20px',
borderRadius: '10px',
whiteSpace: 'pre-wrap',
fontFamily: 'monospace',
fontSize: '14px'
};
if (severity >= 8) {
return { ...baseStyles, backgroundColor: '#fee2e2', borderLeft: '4px solid #dc2626' };
} else if (severity >= 5) {
return { ...baseStyles, backgroundColor: '#fef3c7', borderLeft: '4px solid #f59e0b' };
}
return { ...baseStyles, backgroundColor: '#d1fae5', borderLeft: '4px solid #059669' };
}
});
});
// ============================================
// FORM CONFIGURATION
// ============================================
form.configureSubmitButton({
label: () => {
const severity = severitySection.slider('severityLevel')?.value() ?? 5;
if (severity >= 8) return 'Submit CRITICAL Incident Report';
return 'Submit Incident Report';
},
isVisible: () => {
const severity = severitySection.slider('severityLevel')?.value();
return severity !== null && severity !== undefined;
}
});
form.configureCompletionScreen({
type: 'text',
title: 'Incident Report Submitted',
message: 'Your report has been logged and the appropriate teams have been notified. Please remain available for follow-up questions. Remember: under GDPR, reportable breaches must be notified to authorities within 72 hours of discovery.'
});
}