// RISK OPPORTUNITY COMPONENTS — 25 modules + 5 group hubs
(function () {
const { useState, useMemo } = React;
const T = window.ArbiterTokens;
const rk = window.rk;
const fmtMoney = (n) => n == null ? '—' : '$' + (n >= 1e6 ? (n / 1e6).toFixed(1) + 'M' : n >= 1e3 ? (n / 1e3).toFixed(0) + 'K' : String(n));
const pct = (a, b) => b === 0 ? 0 : Math.round((a / b) * 100);
const statusColor = (s) => {
const m = { within: '#1B7A4A', 'at-limit': '#D97706', breach: '#C23030', effective: '#1B7A4A', partial: '#D97706', ineffective: '#C23030', active: '#1B7A4A', tracking: '#3B82F6', analysis: '#D97706', complied: '#6E7D9E', closed: '#6E7D9E' };
return m[s] || T.color.text.secondary;
};
// Shared sub-tabs segmented control
function RkSubTabs({ tabs, active, onChange }) {
return (
{tabs.map(t => {
const isActive = active === t.id;
return (
onChange(t.id)} style={{
padding: '8px 14px', border: 'none', background: 'none', cursor: 'pointer',
fontSize: '12px', fontWeight: isActive ? 600 : 500,
color: isActive ? rk.crimson : T.color.text.tertiary,
borderBottom: `2px solid ${isActive ? rk.crimson : 'transparent'}`,
marginBottom: '-1px', fontFamily: T.font.family,
}}>
{t.label}
{typeof t.count === 'number' && {t.count} }
);
})}
);
}
window.RkSubTabs = RkSubTabs;
// Card primitive
const Card = ({ title, right, children }) => (
{title} {right}
{children}
);
const TH = ({ children, width }) => (
{children}
);
const TD = ({ children, mono, align, color }) => (
{children}
);
const Pill = ({ children, color }) => (
{children}
);
// ═══════════════════════════════════════════════════════════════
// 1. RISK APPETITE THRESHOLDS
// ═══════════════════════════════════════════════════════════════
function RkAppetite() {
const s = window.useRiskStore(['risk.updated', 'appetite.checked']);
return (
Category Target Tolerance Current Max Loss Status
{s.appetiteThresholds.map(a => (
{a.category}
{a.target}
{a.tolerance}
a.tolerance ? '#C23030' : T.color.text.primary}>{a.currentAvg}
{fmtMoney(a.maxLoss)}
{a.status}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 2. CONTROL EFFECTIVENESS (test results)
// ═══════════════════════════════════════════════════════════════
function RkControls() {
const s = window.useRiskStore(['control.tested']);
return (
ID Control Risk Last Result Owner
{s.controlTests.map(c => (
{c.id}
{c.control}
{c.riskId}
{c.lastTested}
{c.result} {c.owner}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 3. TREATMENT DECISIONS LOG
// ═══════════════════════════════════════════════════════════════
function RkTreatments() {
const s = window.useRiskStore(['treatment.recorded']);
const strategyColor = (s) => ({ mitigate: '#3B82F6', transfer: '#7C3AED', accept: '#6E7D9E', avoid: '#C23030' }[s] || T.color.text.secondary);
return (
ID Risk Strategy Date Cost Residual Rationale
{s.treatmentDecisions.map(t => (
{t.id}
{t.riskId}
{t.strategy} {t.date}
{fmtMoney(t.cost)}
{t.residualScore}
{t.rationale}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 4. INSURANCE COVERAGE MAPPER
// ═══════════════════════════════════════════════════════════════
function RkInsurance() {
const s = window.useRiskStore(['insurance.noticed']);
const totalLimit = s.insurancePolicies.reduce((sum, p) => sum + (p.limit || 0), 0);
return (
Carrier Type Limit Retention Premium Expires Risks
{s.insurancePolicies.map(p => (
{p.carrier}
{p.type}
{fmtMoney(p.limit)}
{fmtMoney(p.retention)}
{fmtMoney(p.annualPremium)}
{p.expires}
{(p.coveredRisks || []).join(', ') || '—'}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 5. KRI DASHBOARD
// ═══════════════════════════════════════════════════════════════
function RkKRI() {
const s = window.useRiskStore(['kri.checked', 'risk.updated']);
return (
{s.kriIndicators.map(k => {
const breached = k.current > k.threshold;
return (
{k.name}
{k.current}
/ {k.threshold}
{k.trend === 'rising' ? '↑' : k.trend === 'declining' ? '↓' : '→'}
{k.window}{k.related.length ? ` · ${k.related.join(', ')}` : ''}
);
})}
);
}
// ═══════════════════════════════════════════════════════════════
// 6. EARLY WARNING TRIGGER RULES
// ═══════════════════════════════════════════════════════════════
function RkTriggers() {
const s = window.useRiskStore(['trigger.fired']);
return (
ID Name Condition Action Enabled Fired
{s.triggerRules.map(t => (
{t.id}
{t.name}
{t.condition}
{t.action}
{t.enabled ? 'on' : 'off'} {t.triggered}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 7. REGULATORY HORIZON
// ═══════════════════════════════════════════════════════════════
function RkRegWatch() {
const s = window.useRiskStore();
return (
Rule Effective Jurisdiction Impact Area Status
{s.regulatoryWatch.map(r => (
{r.rule}
{r.effective}
{r.jurisdiction}
{r.impact} {r.area}
{r.status}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 8. INCIDENTS / NEAR-MISS
// ═══════════════════════════════════════════════════════════════
function RkIncidents() {
const s = window.useRiskStore(['incident.logged']);
return (
ID Date Type Severity Description Lessons
{s.incidents.map(i => (
{i.id}
{i.date}
{i.type} {i.severity} {i.description}
{i.lessons}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 9. CYBER REGISTER
// ═══════════════════════════════════════════════════════════════
function RkCyber() {
const s = window.useRiskStore();
return (
Asset Classification Vendor Last Pen-Test Exposure Score
{s.cyberRegister.map(c => (
{c.asset}
{c.classification} {c.vendor}
{c.lastPenTest}
{c.exposure} {c.breachScore}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 10. PORTFOLIO / CLIENT AGGREGATION
// ═══════════════════════════════════════════════════════════════
function RkPortfolio() {
const s = window.useRiskStore(['risk.updated']);
return (
Client Matters Active Risks Agg Score Expected Loss Concentration
{s.clientPortfolios.map(c => (
{c.client}
{c.matters}
{c.activeRisks}
60 ? '#C23030' : T.color.text.primary}>{c.aggregateScore}
{fmtMoney(c.expectedLoss)}
{c.concentration}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 11. RISK COMMITTEE
// ═══════════════════════════════════════════════════════════════
function RkCommittee() {
const s = window.useRiskStore(['committee.closed']);
return (
Date Chair Attendees Agenda Decisions
{s.riskCommittee.map(m => (
{m.date}
{m.chair}
{m.attendees.join(', ')}
{m.agenda.join(' · ')}
{m.decisions.length ? m.decisions.join('; ') : 'pending'}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 12. BOARD / CLIENT REPORTER
// ═══════════════════════════════════════════════════════════════
function RkReporter() {
const s = window.useRiskStore();
return (
Template Audience Cadence Sections Last Used
{s.reportTemplates.map(r => (
{r.name}
{r.audience} {r.cadence}
{r.sections.join(' · ')}
{r.lastUsed}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 13. ERM MATURITY
// ═══════════════════════════════════════════════════════════════
function RkMaturity() {
const s = window.useRiskStore();
return (
{s.ermMaturity.map(d => {
const gap = d.target - d.current;
return (
{d.dimension}
{d.framework}
{[1, 2, 3, 4, 5].map(n => (
))}
0 ? '#D97706' : '#1B7A4A', width: '40px', textAlign: 'right' }}>{d.current}/{d.target}
{d.gap &&
{d.gap}
}
);
})}
);
}
// ═══════════════════════════════════════════════════════════════
// 14. ETHICAL WALLS
// ═══════════════════════════════════════════════════════════════
function RkEthicalWalls() {
const s = window.useRiskStore();
return (
Name Matter Screened Reason Status Last Audit
{s.ethicalWalls.map(w => (
{w.name}
{w.matter}
{w.screenedAttorneys.join(', ')}
{w.reason}
{w.status} {w.lastAudit}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 15. VENDOR / PANEL MANAGEMENT
// ═══════════════════════════════════════════════════════════════
function RkVendors() {
const s = window.useRiskStore();
return (
Name Type Specialty Rating Engagements Flags
{s.vendorPanel.map(v => (
{v.name}
{v.type}
{v.specialty}
{v.rating}
{v.engagements}
{v.risks.join(', ') || '—'}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 16. CLIENT RATING / AML
// ═══════════════════════════════════════════════════════════════
function RkClientRatings() {
const s = window.useRiskStore();
return (
Client Payment Disputes Concentration AML Composite Flags
{s.clientRatings.map(c => (
{c.client}
{c.payment}
{c.disputes}
{c.concentration}
{c.aml}
{c.composite} {c.flags.join(', ') || '—'}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 17. ATTORNEY PROFESSIONAL RISK
// ═══════════════════════════════════════════════════════════════
function RkAttorneyProfiles() {
const s = window.useRiskStore();
return (
Name Role Util % Real % Win % CLE Cyber Tng
{s.attorneyProfiles.map(a => (
{a.name}
{a.role}
100 ? '#C23030' : a.utilization > 95 ? '#D97706' : T.color.text.primary}>{a.utilization}
{a.realization}
{a.winRate ?? '—'}
{a.cleSuffiencies ? 'current' : 'lapsed'} {a.cyberTraining}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 18. SETTLEMENT DECISION TREE
// ═══════════════════════════════════════════════════════════════
function RkSettlementTree() {
const s = window.useRiskStore();
const tree = s.settlementTrees[0];
if (!tree) return No trees configured.
Expected Value (reject)
{fmtMoney(tree.ev)}
Recommendation: {tree.recommendation}
Branch Label Value Probability EV
{tree.nodes.filter(n => n.type === 'outcome').map(n => (
{n.parent}
{n.label || n.choice}
{fmtMoney(n.value)}
{(n.probability * 100).toFixed(0)}%
= 0 ? '#1B7A4A' : '#C23030'}>{fmtMoney(n.ev)}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 19. TORNADO CHART (sensitivity)
// ═══════════════════════════════════════════════════════════════
function RkTornado() {
const s = window.useRiskStore();
const sorted = s.sensitivityFactors.slice().sort((a, b) => b.range - a.range);
const max = Math.max(...sorted.map(f => f.range)) || 1;
return (
{sorted.map(f => {
const width = (f.range / max) * 100;
return (
{f.factor}
{fmtMoney(f.low)} – {fmtMoney(f.high)}
);
})}
);
}
// ═══════════════════════════════════════════════════════════════
// 20. VaR / CVaR
// ═══════════════════════════════════════════════════════════════
function RkVaR() {
const s = window.useRiskStore();
const v = s.varResults || {};
return (
{[
{ label: 'VaR 95%', v: v.var95 },
{ label: 'CVaR 95%', v: v.cvar95 },
{ label: 'Expected Loss', v: v.ead },
].map(item => (
{item.label}
{fmtMoney(item.v)}
))}
Method: {v.method || '—'} · Last run: {v.lastRun || '—'}
);
}
// ═══════════════════════════════════════════════════════════════
// 21. ASC 450 RESERVES
// ═══════════════════════════════════════════════════════════════
function RkReserves() {
const s = window.useRiskStore(['reserve.updated']);
const total = s.reserves.filter(r => r.ascCategory === 'probable').reduce((sum, r) => sum + (r.estimate || 0), 0);
return (
Matter Probability Estimate Range Disclosure Reviewed
{s.reserves.map(r => (
{r.matter}
{r.probability} {fmtMoney(r.estimate)}
{r.range}
{r.disclosure}
{r.lastReviewed}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 22. BOW-TIE
// ═══════════════════════════════════════════════════════════════
function RkBowTie() {
const s = window.useRiskStore();
const [idx, setIdx] = useState(0);
const bt = s.bowTies[idx];
if (!bt) return No bow-ties configured.
{s.bowTies.map((b, i) => (
setIdx(i)} style={{ padding: '2px 8px', fontSize: '10px', border: `1px solid ${T.color.border.light}`, borderRadius: '4px', background: i === idx ? rk.crimson : T.color.bg.card, color: i === idx ? '#fff' : T.color.text.secondary, cursor: 'pointer' }}>{b.id}
))}
}>
Causes (Preventive)
{bt.causes.map((c, i) => (
))}
{bt.event}
Consequences (Reactive)
{bt.consequences.map((c, i) => (
{c.consequence}
→ {c.control}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 23. STRESS TESTING
// ═══════════════════════════════════════════════════════════════
function RkStress() {
const s = window.useRiskStore(['stress.ran']);
return (
ID Scenario Impacted Baseline Stressed ΔLoss Ran
{s.stressTests.map(t => (
{t.id}
{t.scenario}
{t.impactedRisks.join(', ')}
{t.baselineScore}
{t.newScore}
{fmtMoney(t.deltaLoss)}
{t.ran}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 24. RISK-WEIGHTED PRIORITIZATION
// ═══════════════════════════════════════════════════════════════
function RkPriority() {
const s = window.useRiskStore(['risk.updated']);
const queue = window.RiskStore.priorityQueue();
return (
# ID Name Matter Owner Score Days → Review Priority Idx
{queue.slice(0, 15).map((q, i) => (
{i + 1}
{q.id}
{q.name}
{q.matter}
{q.owner}
{q.score}
{q.urgencyDays}
{q.priorityIndex.toFixed(1)}
))}
);
}
// ═══════════════════════════════════════════════════════════════
// 25. MITIGATION EFFECTIVENESS
// ═══════════════════════════════════════════════════════════════
function RkMitigationEffect() {
const s = window.useRiskStore(['mitigation.updated']);
const summary = useMemo(() => {
const byStatus = {};
s.mitigations.forEach(m => { byStatus[m.status] = (byStatus[m.status] || 0) + 1; });
return byStatus;
}, [s.mitigations.length]);
return (
{Object.entries(summary).map(([status, n]) => (
))}
Risk Inherent Residual Reduction
{s.register.filter(r => r.residualScore != null).map(r => {
const red = r.score - r.residualScore;
const reductionPct = r.score > 0 ? pct(red, r.score) : 0;
return (
{r.id} · {r.name}
{r.score}
{r.residualScore}
0 ? '#1B7A4A' : '#6E7D9E'}>{reductionPct}%
);
})}
);
}
// ═══════════════════════════════════════════════════════════════
// GROUP HUBS
// ═══════════════════════════════════════════════════════════════
function RiskQuantHub() {
const [sub, setSub] = useState('tornado');
const tabs = [
{ id: 'tornado', label: 'Tornado' },
{ id: 'var', label: 'VaR / CVaR' },
{ id: 'reserves', label: 'ASC 450' },
{ id: 'bowtie', label: 'Bow-Tie' },
{ id: 'stress', label: 'Stress Tests' },
];
return (
);
}
function RiskTreatmentHub() {
const [sub, setSub] = useState('appetite');
const tabs = [
{ id: 'appetite', label: 'Appetite' },
{ id: 'controls', label: 'Controls' },
{ id: 'treatments', label: 'Treatments' },
{ id: 'insurance', label: 'Insurance' },
{ id: 'effect', label: 'Effectiveness' },
];
return (
);
}
function RiskIndicatorsHub() {
const [sub, setSub] = useState('kri');
const tabs = [
{ id: 'kri', label: 'KRIs' },
{ id: 'triggers', label: 'Triggers' },
{ id: 'regwatch', label: 'Regulatory' },
{ id: 'incidents', label: 'Incidents' },
{ id: 'cyber', label: 'Cyber' },
{ id: 'priority', label: 'Priority Queue' },
];
return (
);
}
function RiskReportingHub() {
const [sub, setSub] = useState('portfolio');
const tabs = [
{ id: 'portfolio', label: 'Portfolio' },
{ id: 'committee', label: 'Committee' },
{ id: 'templates', label: 'Templates' },
{ id: 'maturity', label: 'ERM Maturity' },
];
return (
);
}
function RiskGovernanceHub() {
const [sub, setSub] = useState('walls');
const tabs = [
{ id: 'walls', label: 'Ethical Walls' },
{ id: 'vendors', label: 'Vendors' },
{ id: 'clients', label: 'Client Ratings' },
{ id: 'attorneys', label: 'Attorney Profiles' },
{ id: 'settlement', label: 'Settlement Tree' },
];
return (
);
}
// Window exports
Object.assign(window, {
RkAppetite, RkControls, RkTreatments, RkInsurance, RkKRI, RkTriggers,
RkRegWatch, RkIncidents, RkCyber, RkPortfolio, RkCommittee, RkReporter,
RkMaturity, RkEthicalWalls, RkVendors, RkClientRatings, RkAttorneyProfiles,
RkSettlementTree, RkTornado, RkVaR, RkReserves, RkBowTie, RkStress,
RkPriority, RkMitigationEffect,
RiskQuantHub, RiskTreatmentHub, RiskIndicatorsHub, RiskReportingHub, RiskGovernanceHub,
});
})();