chore(thumbnail): s2 migration full fidelity

[cdransf]

Description

• Migrated thumbnail.css to Spectrum 2 tokens: all 12 sizes, bordered frame (inset box-shadow), fit="cover"|"contain", forced-colors border override
• Sourced from spectrum-css spectrum-two branch + @adobe/spectrum-tokens; dropped layer/background/disabled/focused/selected per the migration plan (consumer-owned styling instead)
• Expanded stories to cover Overview, Anatomy, Sizes, Fit, and a consumer-styled-states example
• Found and fixed 2 pre-existing a11y bugs while reviewing:
  • aria-hidden could get permanently stuck on <swc-thumbnail decorative> once decorative was unset
  • missing-alt DEBUG warning could log twice on first render
• Trimmed a couple of comments that leaned on "replaces 1st-gen's X" framing instead of just stating current behavior

Motivation and context

Closes out Phase 5 (Styling) of the Thumbnail migration so it matches the S2 Figma spec pixel-for-pixel.

Related issue(s)

• fixes SWC-2199

Screenshots (if appropriate)

Add Chromatic/Storybook screenshots here before requesting review — sizes, fit, forced-colors.

Author's checklist

• I have read the CONTRIBUTING and PULL_REQUESTS documents.
• I have reviewed at the Accessibility Practices for this feature, see: Aria Practices
• I have added automated tests to cover my changes.
• I have included a well-written changeset if my change needs to be published.
• I have included updated documentation if my change required it.

Reviewer's checklist

• Includes a Github Issue with appropriate flag or Jira ticket number without a link
• Includes thoughtfully written changenclude patch, minor, or major features
• Automated tests cover all use cases and follow best practices for writing
• Validated on all supported browsers
• All VRTs are approved before the author can update Golden Hash

Manual review test cases

• All 12 sizes render correctly

  1. Go to Thumbnail > Sizes in Storyb
  2. Expect 12 thumbnails, 16px → 64px, each with a visible checkerboard + border

• fit behaves correctly

  1. Go to Thumbnail > Fit in Storyboo
  2. Expect contain to letterbox the image, cover to crop and fill the box

• Decorative toggle no longer gets stuck

  1. In the Playground, add decorative, "` in devtools
  2. Remove decorative
  3. Expect aria-hidden to be gone

Device review

• Did it pass in Desktop?
• Did it pass in (emulated) Mobile?
• Did it pass in (emulated) iPad?

Accessibility testing checklist

• Keyboard (required — document st

  1. Go to Thumbnail > Overview in Storybook
  2. Press Tab from before the
  3. Expect focus to skip the thumbnail entirely — no interactive parts, never a tab stop

• Screen reader (required — document steps below)

  1. Go to Thumbnail > Overview with V
  2. Expect the slotted <img> to announce as an image with its alt text as the name
  3. Toggle decorative in the Playground
  4. Expect the thumbnail to be skipped entirely — not announced at all

[changeset-bot]

⚠️ No Changeset found

Latest commit: 904c0f5

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[github-actions]

📚 Branch Preview Links

• Storybook (Gen2, dev mode)
• Storybook (Gen2, prod mode)
• Documentation Site (Gen1)
• Storybook (Gen1)

🔍 Gen1 Visual Regression Test Results

When a visual regression test fails (or has previously failed while working on this branch), its results can be found in the following URLs:

• Spectrum | Light | Medium | LTR
• Spectrum | Dark | Large | RTL
• Express | Light | Medium | LTR
• Express | Dark | Large | RTL
• Spectrum-two | Light | Medium | LTR
• Spectrum-two | Dark | Large | RTL
• High Contrast Mode | Medium | LTR

Deployed to Azure Blob Storage: pr-6740

If the changes are expected, update the current_golden_images_cache hash in the circleci config to accept the new images. Instructions are included in that file.
If the changes are unexpected, you can investigate the cause of the differences and update the code accordingly.

[5t3ph]

A note that the merge base isn't quite correct so this is showing more than just the "full fidelity" related changes

[coveralls]

Coverage Report for CI Build 34908834099

Warning

No base build found for commit 2d8fece on cdransf/s2-migration-thumbnail-api-a11y.
Coverage changes can't be calculated without a base build.
If a base build is processing, this comment will update automatically when it completes.

Coverage: 96.287%

Details

• Patch coverage: No coverable lines changed in this PR.

Uncovered Changes

No uncovered changes found.

Coverage Regressions

Requires a base build to compare against. How to fix this →

---

Coverage Stats

Relevant Lines:	39827
Covered Lines:	38548
Line Coverage:	96.79%
Relevant Branches:	6555
Covered Branches:	6112
Branch Coverage:	93.24%
Branches in Coverage %:	Yes
Coverage Strength:	460.05 hits per line

---

💛 - Coveralls