Skip to content
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.

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

Aliases to aliases cause wrong category to be set #284

Open
nicholasroether4308 opened this issue Oct 11, 2023 · 0 comments
Open

Aliases to aliases cause wrong category to be set #284

nicholasroether4308 opened this issue Oct 11, 2023 · 0 comments

Comments

@nicholasroether4308
Copy link

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 :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant