Skip to content

feat: add Figma icons export pipeline and workflows - #3396

Merged
mariohamann merged 8 commits into
mainfrom
icon-flow
Oct 19, 2026
Merged

mariohamann merged 8 commits into
mainfrom
icon-flow

Conversation

@mariohamann

Copy link
Copy Markdown
Contributor

Description:

Adds a Figma-based icons export pipeline to keep bundled component/status icons and theme-specific CELUM icons aligned with the Theming Icon Asset Library.

  • Export and optimize icons with figma-export-assets and SVGO, using explicit Figma-to-code mappings, an internal icons allowlist, and reproducible output.
  • Add Update Bundled Icons, a manual workflow that validates bundled exports and opens a draft update PR with a patch changeset.
  • Add Download CELUM Icons (ZIP), a separate manual workflow producing VB, BB and SP icons plus an export report without changing repository source. CELUM upload remains manual.
  • Refresh bundled internal/status icons and add a components patch changeset.
  • Document icon ownership, library selection, local exports, and delivery workflows; add exporter and icon browser test coverage.

Validation

  • Passed: pnpm --filter @solid-design-system/components test:figma (4 tests).
  • Tests ran on Node 22.22.3; the repository requires Node 24.14.1.
  • Full pnpm verify, icon browser tests, and authenticated Figma workflow runs were not run during PR preparation. Review bundled icons in light/dark themes and component contexts.

Setup

Configure the FIGMA_TOKEN Actions secret and allow Actions to create pull requests. Bot-created update PRs may require checks to be triggered separately.

Definition of Reviewable:

  • Documentation is created/updated
  • E2E tests (features, a11y, bug fixes) are created/updated

- Introduced new scripts for fetching and optimizing icons from Figma.
- Added configuration for Figma asset exports, including theme and category mappings.
- Implemented workflows for downloading CELUM icons and updating bundled icons.
- Created tests for the new icon fetching and exporting functionality.
- Updated pnpm-lock.yaml with new dependencies for Figma export assets.
- Added .env.example for Figma token configuration.
- Created a changeset for the updated bundled component and status icons.
Comment thread packages/components/scripts/figma/fetch-icons.test.js Dismissed
Comment thread packages/components/scripts/figma/fetch-icons.test.js Dismissed
@changeset-bot

changeset-bot Bot commented Oct 8, 2026 •

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: cfaec05

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 4 packages
Name Type
@solid-design-system/components Patch
@solid-design-system/mcp Patch
@solid-design-system/styles Patch
@solid-design-system/tokens Patch

Not sure what this means? Click here to learn what changesets are.

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

@github-actions

github-actions Bot commented Oct 8, 2026

Copy link
Copy Markdown
Contributor

🚀 Storybook has been deployed for branch icon-flow

Status icon sm frames in Figma were 12.057px wide, which exported as
viewBox 0 0 13 12 and shrank the glyphs. Frames are now 12x12.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Comment thread CONTRIBUTING.md
@mariohamann mariohamann moved this from 📋 Backlog to 👀 In review in Solid Design System Project Board Oct 16, 2026

@auroraVasconcelos auroraVasconcelos left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

LGTM

@mariohamann
mariohamann merged commit fb8b6e6 into main Oct 19, 2026
20 checks passed
@mariohamann
mariohamann deleted the icon-flow branch October 19, 2026 14:01
@github-project-automation github-project-automation Bot moved this from 👀 In review to ✅ Done in Solid Design System Project Board Oct 19, 2026

This branch was successfully deployed

1 active deployment
github-pages — cfaec056 Deployed Oct 15, 2026 by mariohamann via deploy #5620
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: ✅ Done

Development

Successfully merging this pull request may close these issues.

5 participants