Enhance ImageField (#152)

[pglevy]

Addresses the 3 sub-issues of #152:

Changes

#113 — Custom background color for avatar fallback

• backgroundColor now accepts SAIL color tokens (ACCENT, TEAL_200, etc.) in addition to hex strings
• Initials text automatically flips to white/black based on WCAG contrast ratio
• Added shared getContrastColor and resolveColorToHex utilities to colorResolver.ts

#121 — WebImage support

• New WebImageProps interface with source prop for external URLs
• No imageType discriminator needed — detected by presence of source vs document

#126 — Shape/borderRadius prop

• New shape prop: SQUARED, SEMI_ROUNDED, ROUNDED, CIRCLE
• CIRCLE forces 1:1 aspect ratio + rounded-full
• Added CIRCLE to shared SAILShape type and shapeMap

Testing

• TypeScript: clean
• ESLint: clean (no new warnings)
• Build: passes
• Storybook: new stories for all features

Closes #113, closes #121, closes #126

[pglevy]

Findings

1. High: shared shape change breaks existing StampField typing
   src/types/sail.ts:9 adds "CIRCLE" to SAILShape, but src/components/Stamp/StampField.tsx:85 still declares const shapeMap: Record<SAILShape, string> with only SQUARED, SEMI_ROUNDED, and ROUNDED. With full TypeScript checking, this is an incomplete Record and will fail. It also means shape="CIRCLE" now type-checks for StampField but resolves to undefined at runtime. Add a CIRCLE entry there or narrow StampField shape type.

2. Medium: linked WebImages are not clickable when the overlay is rendered
   src/components/Image/ImageField.tsx:248 attaches onClick to the <img>, but src/components/Image/ImageField.tsx:253 renders an absolute inset-0 overlay above it for linked images. Since the overlay has default pointer events and no click handler, a WebImageProps item with link will show the hover overlay but clicks target the overlay instead of the image. Move the click handler to the wrapper/overlay or make the overlay pointer-events-none.

3. Low: shorthand hex colors produce the wrong initials contrast
   src/utils/colorResolver.ts:77 treats any string starting with # as a hex color, but getContrastColor at src/utils/colorResolver.ts:87 assumes #RRGGBB. For backgroundColor="#000" or "#333", b parses as NaN, the comparison falls through to black text, and initials can become unreadable on dark backgrounds. Normalize #RGB/#RGBA before calculating contrast or only calculate contrast for validated 6/8-digit hex values.

Verification

npm run build could not run locally because vite is not installed in this workspace (sh: 1: vite: not found).