Skip to content

Theme: Update Figma plugin to convert additional properties #73407

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
aduth wants to merge 8 commits into from
Closed

Theme: Update Figma plugin to convert additional properties #73407

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
670812a
Remove redundant primitives renaming
aduth Nov 18, 2025
3545a95
Theme: Expand README to explain general token naming scheme
aduth Nov 18, 2025
9dc5ed8
Theme: Update Figma plugin to convert additional properties
aduth Nov 18, 2025
93f30ba
Remove "Semantic" folder in Figma output
aduth Nov 21, 2025
062fd54
Avoid abbreviating Figma output variable names
aduth Nov 21, 2025
de26204
Remove tone from color variable output
aduth Nov 21, 2025
9a5ccab
Simplify property name calculation using property
aduth Nov 21, 2025
e748ace
Update Figma export to retain original structure
aduth Dec 5, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Remove "Semantic" folder in Figma output 
We no longer export primitive tokens, so no point in creating this grouping
  • Loading branch information
@aduth
aduth committed Nov 21, 2025
commit 93f30ba8fd4a9d193e6c86e603d87a712b26c2d6
6 changes: 3 additions & 3 deletions packages/theme/bin/terrazzo-plugin-figma-ds-token-manager/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,14 +31,14 @@ function transformTokenName( { id }: { id: string } ) {
// Capitalize first segment
.replace( /^(\w+)\./g, ( _, g1 ) => `${ titleCase( g1 ) }/` )
// Capitalize
.replace( /semantic\./g, 'Semantic/' )
.replace( /semantic\./g, '' )
// Color-specific transformation for semantic tokens:
// - add extra folder (Background, Foreground, Stroke)
// - swap "tone" folder order, capitalize
// - limit bg-* to 6 characters
// - keep last part of the token name with dots (eg no folders)
.replace(
/(color\/Semantic)\/([\w,\-]+)\.(\w+)\.(.*)/gi,
/(Color)\/([\w,\-]+)\.(\w+)\.(.*)/g,
( _, prefix, element, tone, emphasisAndState ) => {
let extraFolder = '';
let elementName = element;
Expand All @@ -64,7 +64,7 @@ function transformTokenName( { id }: { id: string } ) {
// - limit name to 3 characters after prefix
// - keep last part of the token name with dots (eg no folders)
.replace(
/(Dimension\/Semantic)\/(\w+)\.(\w+)\.(.*)/g,
/(Dimension)\/(\w+)\.(\w+)\.(.*)/g,
( _, prefix, property, target, modifier ) => {
let extraFolder = '';
let propertyName = property;
Expand Down
Loading