Description
For our use case, we use Figma variables with two layers of aliases. With my settings, I get an output like this (some parts omitted for brevity):
{
"base": {
"dimension": {
"12": {
"type": "dimension",
"value": 12
}
}
},
"semantic": {
"spacing": {
"75": {
"type": "dimension",
"value": "{base.dimension.12}"
}
}
},
"component": {
"chip": {
"100": {
"padding-x": {
"type": "color"
"value": "{semantic.spacing.75}"
}
}
}
}
}
As you can see, on the second layer of aliases, the output contains an incorrect value for type
. This happens consistently; every double alias gets a type
of "color"
, no matter what the actual type of the aliased value is.
I have no experience with Figma's API whatsoever, but I looked through the code a bit, and I believe the issue is that in the
function extractVariable
, in getVariables.ts
, the code tries to deduce the category from the value of the variable, but if that value is itself an alias, it fails and falls back to "color"
.
const extractVariable = (variable, value) => {
let category: tokenCategoryType = 'color'
let values = {}
if (value.type === 'VARIABLE_ALIAS') {
const resolvedAlias = figma.variables.getVariableById(value.id)
const collection = figma.variables.getVariableCollectionById(resolvedAlias.variableCollectionId)
return {
name: variable.name,
description: variable.description || undefined,
exportKey: tokenTypes.variables.key as tokenExportKeyType,
category: getVariableTypeByValue(Object.values(resolvedAlias.valuesByMode)[0]),
values: `{${collection.name.toLowerCase()}.${changeNotation(resolvedAlias.name, '/', '.')}}`,
// this is being stored so we can properly update the design tokens later to account for all
// modes when using aliases
aliasCollectionName: collection.name.toLowerCase(),
aliasModes: collection.modes
}
}
Without knowing any better, I would have just used variable.resolvedType
here, but I assume there is a reason why that wasn't done.
I don't feel confident enough in my understanding of the problem yet to submit a PR, but maybe you could give me some pointers. In either case, it would be nice to see this issue fixed.
Thank you :)