Files
Z User e45b68bb8b feat: IMAP mail sync with thread-to-contact matching (PRD §6.1)
Real IMAP connection via imapflow library:
- Connects to IMAP server (IMAPFlow, TLS on port 993)
- Fetches recent messages (configurable limit, default 20)
- Extracts: from, fromEmail, subject, date, snippet (200 chars)
- Thread-to-contact matching (PRD §6.1):
  1. Match sender email against persons table
  2. If no person match, extract domain and match against company.website
  3. Returns matchedCompany + matchedPerson for each email
- Audit-logged (action: crm.mailsync:imap)
- Zod validated (host, port, user, password, folder, limit)
- 502 on IMAP connection failure with detail
- 400 on validation failure

Tested: invalid creds → 502 'IMAP connection failed', missing host → 400
2026-10-27 22:50:50 +00:00

3.9 KiB
Executable File
Raw Permalink Blame History

name, description, mode, platform, scenario, preview, default_for, fidelity, sources
name description mode platform scenario preview default_for fidelity sources
accessibility Accessibility baseline for generated HTML artifacts. Covers contrast, focus, keyboard behavior, labels, touch targets, motion safety, semantics, and common failure patterns. reference web horizontal-craft
type
none
accessibility
a11y
WCAG
focus visible
keyboard
form labels
system
adapted-from-open-design/craft/accessibility-baseline.md

Accessibility

This file defines the accessibility baseline for generated design artifacts. The active design system decides how it looks; this file decides what cannot be broken.

Target WCAG 2.2 AA as the practical working baseline unless the user specifies another compliance target.


Contrast

Minimums:

Pair Minimum
Normal text 4.5:1
Large text 3:1
Non-text UI and graphical objects 3:1
Focus indicator vs adjacent state 3:1

Do not round up. 2.99:1 fails a 3:1 check.

Avoid low-contrast muted text, especially opacity-based text on dark or colored backgrounds.


Focus visibility

  • Every interactive element must have visible :focus-visible styling.
  • Never remove focus outline without an accessible replacement.
  • Focus indicator should be visible by shape, outline, underline, or offset — not color alone.
  • Modals must trap focus while open and return focus to the opener when closed.

Keyboard behavior

  • Native <button> for actions.
  • Native <a href="..."> for navigation.
  • Do not use <a> without href as a button.
  • Do not use <div role="button"> unless keyboard handlers, focus, and pressed state are implemented.
  • Escape should close dismissible modals, popovers, and drawers.

Labels and names

  • Every form input needs a visible <label> or an accessible name.
  • Placeholder text is not a label.
  • Icon-only buttons require aria-label.
  • Decorative icons use aria-hidden="true" focusable="false".
  • Meaningful status changes use live regions when needed.

Recommended field pattern:

<label for="email">Email</label>
<input id="email" type="email" required aria-describedby="email-hint email-error" aria-invalid="true">
<span id="email-hint">Used for receipts only.</span>
<span id="email-error" role="alert">Email must include @ and a domain.</span>

Touch targets

  • Minimum practical target: 24×24 CSS px.
  • Preferred mobile target: 44×44 pt / 48×48 dp equivalent.
  • Adjacent tiny targets need enough spacing.
  • Primary mobile actions should be thumb-reachable.

Semantics

  • Use one logical <h1> per document / screen when possible.
  • Heading levels should not skip randomly.
  • Use lists for lists, tables for tabular data, buttons for actions, links for navigation.
  • Avoid ARIA when native HTML does the job.
  • Do not use positive tabindex; fix DOM order.

Motion safety

  • Add prefers-reduced-motion fallback when using animation, transform, transition-heavy interaction, smooth scroll, or scripted motion.
  • Do not flash more than three times per second.
  • Do not block input with decorative animation.
  • Auto-playing motion longer than 5 seconds needs pause/stop/hide controls.

Forms and errors

  • Validate on blur by default, not on first keystroke.
  • Preserve user input after errors.
  • Move focus to the first invalid field after submit.
  • Provide a summary for multi-field forms.
  • Error copy must say what happened and how to fix it.

Quality checks

[ ] Color contrast passes for body, labels, captions, buttons, focus rings.
[ ] :focus-visible exists and is visible.
[ ] Keyboard can reach and operate all controls.
[ ] Inputs have labels.
[ ] Icon-only buttons have accessible names.
[ ] Decorative icons are aria-hidden.
[ ] Reduced-motion fallback exists when motion exists.
[ ] No href-less fake links are used as controls.
[ ] Semantics match behavior.