Skip to content

feat(figma): integrate selected platform references with matching data - #215

Draft
marissahuysentruyt wants to merge 5 commits into
mainfrom
figma-platforms
Draft

feat(figma): integrate selected platform references with matching data#215
marissahuysentruyt wants to merge 5 commits into
mainfrom
figma-platforms

Conversation

@marissahuysentruyt

@marissahuysentruyt marissahuysentruyt commented Nov 9, 2026 •
edited
Loading

Copy link
Copy Markdown
Collaborator

Description

Stack layer 4 of 6. Base: discover-figma.

Integrate source-qualified Figma discovery with canonical component resolution, explicit design selection, generated status data, Design pills, and See in Figma actions. Reject invalid or ambiguous selections rather than choosing an arbitrary library. Keep iOS and Android designs in their own platform cells, preserve native canonical slices, and keep the combined status table web-only without inventing native code availability or falling back to web designs.

Pair the consumer migration with the 198-row Figma roster, reviewed aliases/selections/exclusions, and required regenerated outputs. The index contains 135 components at this layer. The RSP catalog remains the 122-entry S2-only snapshot; its refresh is deferred to layer 6. See deps/figma/README.md and deps/docs/DATA-CONTRACT.md.

Screenshots (if applicable)

Type of change

  • Bug fix
  • New feature / block
  • Refactor
  • Docs / content
  • Chore (deps, config, tooling)

Related issue(s)

  • Relates to SPDOCS-517 and SPDOCS-579.

Validation steps

  • This PR has visual elements, so it was reviewed by a designer.
  • This PR has code changes, and our linters still pass.
  • This PR affects production code, so it was browser tested (see below).
  • This PR affects existing pages, so automated E2E tests were run (see below).
  • This PR has new code, so new tests were added or updated, and they pass.
  • This PR has copy changes, so copy was proofread and approved.
  • The content of this PR requires documentation, so a detailed description of the component's purpose, requirements, quirks, and instructions for use by designers and developers was added, along with accessibility information if pertinent.

Recorded during stack validation: npm test passed (1,153 browser, 670 extraction, 144 indexer, and 21 link-unit tests); npm run lint:js passed. Manual keyboard, screen reader, device, authenticated Figma access, and full-site E2E results are not recorded here.

To Validate

URL for testing:
https://figma-platforms--spectrum-hub--adobe.aem.live/

  • Make sure all PR Checks have passed
  • Pull down the branch locally or visit the branch preview
  • Run npm test and confirm all tests pass
  • Run npm run lint and confirm no linting errors
  • Verified in browser with aem up
  • Run node deps/build-status-index.js; expect no changes to the committed generated outputs.
  • Run node --test test/extractions/figma-resolution.node.test.js; confirm explicit source/node selection, rejected ambiguity, and platform-specific resolution.
  • With local aem up, open /test/a11y/fixtures/component-status.html?component=message-sources and verify the SWC pattern docs and AI Toolkit design destinations. Open the fixture with ?platform=ios and ?platform=android; expect only each platform's Design link.
  • Confirm native-only entries do not appear in the web status table and an absent native reference never falls back to S2 Web.

Accessibility testing checklist

  • Keyboard
  1. Start npx aem up --port 3001 --no-open and open the iOS status fixture, then repeat with platform=android.
  2. Tab to Design and activate it with Enter; also check the web fixture with component=message-sources.
  3. Expect visible focus and a platform-correct Figma destination. Native fixtures must expose no Code link; the web fixture retains its available Code and Design links.
  • Screen reader
  1. Open the same native and web fixtures with VoiceOver or NVDA.
  2. Navigate to Component status and inspect the available links.
  3. Expect native fixtures to announce only Design availability and Figma/new-tab behavior. The web AI fixture must announce the SWC documentation and Figma links without duplicate status groups.

Device review

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

Checklist:

  • I have signed the Adobe Open Source CLA.
  • My code follows the code style of this project.
  • My change requires a change to the documentation.
  • I have updated the documentation accordingly.
  • I have read the CONTRIBUTING document.
  • I have added tests to cover my changes.
  • All new and existing tests passed.

@aem-code-sync

aem-code-sync Bot commented Nov 9, 2026 •
edited
Loading

Copy link
Copy Markdown

Hello, I'm the AEM Code Sync Bot and I will run some actions to deploy your branch and validate page speed.
In case there are problems, just click a checkbox below to rerun the respective action.

  • Re-run all PSI checks
  • Re-run failed PSI checks
  • Re-sync branch
Commits

@aem-code-sync

aem-code-sync Bot commented Nov 9, 2026 •
edited
Loading

Copy link
Copy Markdown
Page Scores Audits Google
📱 / PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI
🖥️ / PERFORMANCE A11Y SEO BEST PRACTICES SI FCP LCP TBT CLS PSI

Base automatically changed from discover-figma to main November 10, 2026 17:56
marissahuysentruyt
marissahuysentruyt commented Nov 11, 2026
View reviewed changes
Comment thread docs/DEPS.md

Spectrum Hub combines implementation data from React Spectrum S2 (RSP),
Spectrum Web Components (SWC), and Figma:
Spectrum Hub combines implementation data from React Spectrum S2 and AI Toolkit

@marissahuysentruyt marissahuysentruyt Nov 11, 2026

Copy link
Copy Markdown
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ai toolkit isn't rsp specific. this needs to be reworded.

Comment thread deps/component-aliases.json Resolved
@marissahuysentruyt
marissahuysentruyt force-pushed the figma-platforms branch 2 times, most recently from e7bb16e to fcc88f3 Compare November 11, 2026 22:34
marissahuysentruyt and others added 5 commits November 12, 2026 16:45
@marissahuysentruyt
feat(figma): integrate selected platform references with matching data
b8ac375 
- Keep discovery, resolution, status slices, and browser links consistent.
- Migrate the Figma roster and its derived outputs with the new consumers.
- Retain the S2-only RSP catalog until the final refresh.

Source-commit: fe220cb0
Source-commit: faf8d9e3
Source-commit: 6f6005f5
Source-commit: b4430da7
Source-commit: 96a06566
Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
@marissahuysentruyt
chore(figma): regenerate new figma status data
7ed1636
@marissahuysentruyt
fix(figma): remove some components from status table
eec0fd5
@marissahuysentruyt
fix(status-table): filter out ios and android figma from web status t…
8f9fb10 
…able
@marissahuysentruyt
chore(figma): refine more statuses
8892928

This branch was successfully deployed

1 active deployment
figma-platforms — 88929280 Deployed Nov 12, 2026 by aem-code-sync[bot]
View deployment
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

1 participant

@marissahuysentruyt