98ad663011
Add a report-oriented mail workflow that turns completed chat responses into structured, reviewable messages. - Render structural report items with dedicated visual treatment and tests across mail surfaces. - Add report-mode composer fields and route Send as report handoffs from completed chat responses. - Document the mail/chat workflow and publish a Fusion changeset. Files changed: .changeset/fn-8872-structural-mail-ui.md | 7 + docs/dashboard-guide.md | 3 + packages/dashboard/app/App.tsx | 9 + packages/dashboard/app/components/ChatView.tsx | 36 ++-- packages/dashboard/app/components/MailboxModal.tsx | 28 ++- .../app/components/MailboxStructuralItem.css | 73 +++++++ .../app/components/MailboxStructuralItem.tsx | 100 ++++++++++ packages/dashboard/app/components/MailboxView.tsx | 50 ++++- .../dashboard/app/components/MessageComposer.css | 18 ++ .../dashboard/app/components/MessageComposer.tsx | 57 +++++- .../__tests__/ChatMailReportRouting.test.tsx | 144 ++++++++++++++ .../__tests__/ChatView.send-as-report.test.tsx | 96 +++++++++ .../__tests__/MailboxStructuralItem.test.tsx | 90 +++++++++ .../MailboxStructuralMail.surfaces.test.tsx | 217 +++++++++++++++++++++ .../app/components/__tests__/MailboxView.test.tsx | 28 +++ .../__tests__/MessageComposer.report-mode.test.tsx | 106 ++++++++++ .../components/__tests__/chatReportHandoff.test.ts | 26 +++ .../dashboard/app/components/chatReportHandoff.ts | 65 ++++++ .../app/components/dashboard/MainContent.tsx | 4 + .../dashboard/app/components/dashboard/types.ts | 3 + 20 files changed, 1135 insertions(+), 25 deletions(-) Fusion-Task-Id: FN-8872 Fusion-Task-Lineage: 55e4bf5e-e7f3-48a5-8084-4090ab24710a Co-authored-by: Fusion (runfusion.ai) <noreply@runfusion.ai>
74 lines
1.8 KiB
CSS
74 lines
1.8 KiB
CSS
/* FNXC:StructuralMail 2026-08-09-09:09: Reports and approval references need a compact structural treatment without changing ordinary mail. */
|
|
.mailbox-kind-badge {
|
|
border-radius: var(--radius-sm);
|
|
display: inline-flex;
|
|
font-size: var(--font-size-xs);
|
|
font-weight: var(--font-weight-medium);
|
|
margin-inline-start: var(--space-xs);
|
|
padding: var(--space-2xs) var(--space-xs);
|
|
}
|
|
|
|
.mailbox-kind-badge--report {
|
|
background: color-mix(in srgb, var(--color-info) 16%, transparent);
|
|
color: var(--color-info);
|
|
}
|
|
|
|
.mailbox-kind-badge--approval {
|
|
background: color-mix(in srgb, var(--color-warning) 16%, transparent);
|
|
color: var(--color-warning);
|
|
}
|
|
|
|
.mailbox-structural-report,
|
|
.mailbox-structural-approval {
|
|
border: var(--border) solid var(--border-subtle);
|
|
border-radius: var(--radius-md);
|
|
margin-block-start: var(--space-md);
|
|
padding: var(--space-md);
|
|
}
|
|
|
|
.mailbox-structural-report h3,
|
|
.mailbox-report-section h4 {
|
|
margin-block: 0 var(--space-sm);
|
|
}
|
|
|
|
.mailbox-report-section + .mailbox-report-section {
|
|
border-block-start: var(--border) solid var(--border-subtle);
|
|
margin-block-start: var(--space-md);
|
|
padding-block-start: var(--space-md);
|
|
}
|
|
|
|
.mailbox-inline-approval {
|
|
display: grid;
|
|
gap: var(--space-sm);
|
|
}
|
|
|
|
.mailbox-inline-approval-actions {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: var(--space-sm);
|
|
}
|
|
|
|
.mailbox-inline-approval textarea {
|
|
min-height: var(--space-3xl);
|
|
}
|
|
|
|
.mailbox-inline-approval button:focus-visible {
|
|
outline: var(--focus-ring-strong);
|
|
}
|
|
|
|
.mailbox-approval-unresolvable,
|
|
.mailbox-inline-approval-status {
|
|
color: var(--text-muted);
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.mailbox-structural-report,
|
|
.mailbox-structural-approval {
|
|
padding: var(--space-sm);
|
|
}
|
|
|
|
.mailbox-inline-approval-actions .btn {
|
|
min-height: var(--space-2xl);
|
|
}
|
|
}
|