Skip to content

Instantly share code, notes, and snippets.

@dbanksdesign
Created July 27, 2020 17:07
Show Gist options
  • Save dbanksdesign/2203c67a8606c3b6fd76692f78fc09fd to your computer and use it in GitHub Desktop.
Save dbanksdesign/2203c67a8606c3b6fd76692f78fc09fd to your computer and use it in GitHub Desktop.
const StyleDictionary = require('style-dictionary');
// Creating a function that takes a token value
// and returns an object of the transformed value for
// the platforms defined in the config
const sdValue = (value) => {
const styleDictionary = StyleDictionary.extend({
// You can directly set the 'properties' aka tokens
// of the dictionary by giving it an object
properties: {
myValue: {
value,
// you would need to know what type of token it is,
// a color, font size, etc. For prototyping purposes
// assuming it is a color.
attributes: {
category: 'color'
}
}
},
platforms: {
css: {
transformGroup: 'css'
},
iOS: {
transformGroup: 'ios'
},
android: {
transformGroup: 'android'
}
}
});
const output = {}
Object.keys(styleDictionary.platforms).forEach(platform => {
output[platform] = styleDictionary
// .exportPlatform generates the full dictionary object,
// but if we just want to use it for a single token
// we can grab that token by its name
.exportPlatform(platform).myValue.value
});
return output;
}
console.log( sdValue('#ff0000') );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment