fix(transforms): transitive transforms now work without .value in refs (

#808)

* fix(transforms): transitive transforms now work without .value in references

* chore(test): updating tests

__tests__/exportPlatform.test.js

@@ -85,6 +85,44 @@ describe('exportPlatform', () => {
     expect(dictionary.color.button.hover.value).toEqual('#0077CC-darker-darker');
   });
 
+  it('should have transitive transforms applied without .value in references', () => {
+    const dictionary = StyleDictionary.extend({
+      tokens: {
+        one: { value: 'foo' },
+        two: { value: '{one.value}' },
+        three: { value: '{two}' },
+        four: { value: '{one}' },
+        five: { value: '{four.value}' },
+        six: { value: '{one}' },
+        seven: { value: '{six}'},
+        eight: { value: '{one.value}' },
+        nine: { value: '{eight.value}' }
+      },
+      transform: {
+        transitive: {
+          type: 'value',
+          transitive: true,
+          transformer: (token) => `${token.value}-bar`
+        }
+      },
+      platforms: {
+        test: {
+          transforms: ['transitive']
+        }
+      }
+    }).exportPlatform('test');
+
+    expect(dictionary.one.value).toEqual('foo-bar');
+    expect(dictionary.two.value).toEqual('foo-bar-bar');
+    expect(dictionary.three.value).toEqual('foo-bar-bar-bar');
+    expect(dictionary.four.value).toEqual('foo-bar-bar');
+    expect(dictionary.five.value).toEqual('foo-bar-bar-bar');
+    expect(dictionary.six.value).toEqual('foo-bar-bar');
+    expect(dictionary.seven.value).toEqual('foo-bar-bar-bar');
+    expect(dictionary.eight.value).toEqual('foo-bar-bar');
+    expect(dictionary.nine.value).toEqual('foo-bar-bar-bar');
+  });
+
   it('should not have mutated the original properties', () => {
     var dictionary = styleDictionary.exportPlatform('web');
     expect(dictionary.color.font.link.value).not.toEqual(styleDictionary.properties.color.font.link.value);

examples/advanced/transitive-transforms/tokens/color/font.json5

@@ -13,7 +13,8 @@
       },
       tertiary: {
         // transitive transforms allow you to modify a modified reference
-        value: "{color.font.secondary.value}",
+        // You can use references with or without `.value`
+        value: "{color.font.secondary}",
         modify: [{
           // this will brighten the secondary value, which is a brightened version
           // of primary

lib/utils/resolveObject.js

@@ -85,16 +85,20 @@ function compile_value(value, stack) {
   // references can be part of the value such as "1px solid {color.border.light}"
   value.replace(regex, function(match, variable) {
     variable = variable.trim();
-    if (options.ignorePaths.indexOf(variable) !== -1) {
-      return value;
-    }
-
-    stack.push(variable);
 
     // Find what the value is referencing
     const pathName = getPath(variable, options);
     const context = getName(current_context, options);
     const refHasValue = pathName[pathName.length-1] === 'value';
+
+    if (refHasValue && options.ignorePaths.indexOf(variable) !== -1) {
+      return value;
+    } else if (!refHasValue && options.ignorePaths.indexOf(`${variable}.value`) !== -1) {
+      return value;
+    }
+
+    stack.push(variable);
+
     ref = resolveReference(pathName, updated_object);
 
     // If the reference doesn't end in 'value'