Fix export sets (#3116)

* initial commit to fix export token sets

* optimize getAdjustedTokenName to incorporate ignoreFirstPartForStyles logic

* remove nested ternary expression

* remove debug statement

* update tests on setValuesonNode

* update text style test

* add changeset

.changeset/orange-donkeys-chew.md

@@ -0,0 +1,5 @@
+---
+"@tokens-studio/figma-plugin": minor
+---
+
+Fixes issue where styles are not applied in Figma, when user exports Token Sets as Styles

packages/tokens-studio-for-figma/src/plugin/TokenValueRetriever.ts

@@ -19,10 +19,15 @@ export class TokenValueRetriever {
 
   public createStylesWithVariableReferences;
 
-  private getAdjustedTokenName(tokenName: string): string {
-    const withPrefix = [this.stylePathPrefix, tokenName].filter((n) => n).join('.');
+  private getAdjustedTokenName(tokenName: string): [string, string] {
+    const withIgnoredFirstPart = this.ignoreFirstPartForStyles && tokenName.split('.').length > 1
+      ? tokenName.split('.').slice(1).join('.')
+      : tokenName;
 
-    return withPrefix;
+    const adjustedTokenName = [this.stylePathPrefix, tokenName].filter((n) => n).join('.');
+    const adjustedTokenNameWithIgnoreFirstPart = [this.stylePathPrefix, withIgnoredFirstPart].filter((n) => n).join('.');
+
+    return [adjustedTokenName, adjustedTokenNameWithIgnoreFirstPart];
   }
 
   public initiate({
@@ -53,10 +58,16 @@ export class TokenValueRetriever {
     this.tokens = new Map<string, any>(tokens.map((token) => {
       const variableId = variableReferences?.get(token.name);
       // For styles, we need to ignore the first part of the token name as well as consider theme prefix
-      const adjustedTokenName = this.getAdjustedTokenName(token.name);
-      const styleId = styleReferences?.get(token.name);
+      const [adjustedTokenName, adjustedTokenNameWithIgnoreFirstPart] = this.getAdjustedTokenName(token.name);
+
+      const styleId = styleReferences?.get(adjustedTokenName) || styleReferences?.get(adjustedTokenNameWithIgnoreFirstPart);
+      const finalAdjustedTokenName = styleReferences?.has(adjustedTokenName) ? adjustedTokenName : adjustedTokenNameWithIgnoreFirstPart;
+
       return [token.name, {
-        ...token, variableId, styleId, adjustedTokenName,
+        ...token,
+        variableId,
+        styleId,
+        adjustedTokenName: styleId ? finalAdjustedTokenName : adjustedTokenName,
       }];
     }));
   }

packages/tokens-studio-for-figma/src/plugin/__tests__/setValuesOnNode.test.ts

@@ -333,8 +333,8 @@ describe('Can set values on node', () => {
         },
       },
     );
-    expect(setTextValuesOnTargetSpy).toHaveBeenCalled();
-    expect(textNodeMock).toEqual({ ...textNodeMock });
+    expect(setTextValuesOnTargetSpy).not.toHaveBeenCalled();
+    expect(textNodeMock).toEqual({ ...textNodeMock, textStyleId: '456' });
   });
 
   it('sets effectStyle if matching Style is found', async () => {
@@ -453,8 +453,8 @@ describe('Can set values on node', () => {
         },
       },
     );
-    expect(setEffectValuesOnTargetSpy).toHaveBeenCalled();
-    expect(solidNodeMock).toEqual({ ...solidNodeMock, effectStyleId: '' });
+    expect(setEffectValuesOnTargetSpy).not.toHaveBeenCalled();
+    expect(solidNodeMock).toEqual({ ...solidNodeMock, effectStyleId: '123' });
   });
 
   it('sets fillStyle if matching Style', async () => {