Metadados de variáveis

As variáveis carregam mais do que valores — carregam também a informação de onde podem ser usadas. O variable Jar gerencia três tipos de metadados na grade Master e no painel de detalhes.

Os escopos e as descrições são lidos do Figma na sincronização, e suas edições na web voltam para o painel de variáveis do Figma. As tags existem só na web — nunca tocam o Figma.

Assim como os valores, escopos e descrições podem entrar em conflito. Se os escopos ou a descrição da mesma variável foram alterados de forma diferente no Figma e na web antes de uma sincronização, o banner de conflitos os conta como Escopos também divergiram · N / Descrições também divergiram · N, e você escolhe o lado Figma ou o lado VA linha por linha naquela coluna, do mesmo jeito que num conflito de valor (Escolha por linha na coluna Escopo / Escolha por linha na coluna Descrição). A escolha e a aplicação funcionam como descrito na seção de conflitos de Sincronização com o Figma.

Mostrar as colunas de metadados

Clique no ícone de colunas da barra de ferramentas (dica Exibir — colunas e cor) e ative ou desative as colunas Modos · Descrição · Tag · Escopos na seção Colunas. O menu continua aberto, então você pode alternar várias colunas seguidas.

Com as três ativadas, a grade Master mostra descrição, tag e escopos numa só linha.

É possível fixar comentários nas células de Descrição, Tag e Escopos, assim como nas células de valor. Se a coluna estiver oculta, o comentário é mantido, e ao navegar até ele a coluna oculta volta a aparecer.

Escopos — onde uma variável pode ser usada

Os escopos decidem em quais seletores de propriedade do Figma a variável é oferecida. Restrinja uma variável de cor ao preenchimento de Texto e ela deixa de aparecer quando alguém escolhe a cor de fundo de um frame.

• A célula Escopos resume o estado atual — Todos (todas as propriedades suportadas), Nenhum, os nomes dos escopos escolhidos (por exemplo, “Frame, Texto” — quando a coluna é estreita demais, o resto vira um selo +N), ou “—” para variáveis cujos escopos ainda não foram coletados do Figma. Ao passar o mouse sobre “—”, aparece Ainda não coletado do Figma — é preenchido na próxima sincronização.
• Clique na célula para abrir uma lista com a mesma hierarquia e os mesmos ícones da caixa de escopos do Figma, e alterne vários escopos seguidos. A lista só mostra os escopos válidos para o tipo da variável — cor tem Preenchimento, com Frame · Forma · Texto embaixo, além de Traçado · Efeitos; número vai de Raio do canto até o grupo Tipografia; string tem Conteúdo de texto · Família da fonte · Peso ou estilo da fonte.
• Mostrar em todas as propriedades compatíveis é simplesmente todos os escopos marcados de uma vez — ative e todos os escopos individuais acendem; desmarque qualquer um e a linha de cima é desmarcada enquanto o resto continua ativo. Nas variáveis de cor, Preenchimento funciona do mesmo jeito para os preenchimentos de frame, forma e texto.
• As células de escopo de booleanos são somente leitura — O Figma não permite definir escopos para variáveis booleanas.

Descrição

• Digite direto na coluna Descrição ou edite no painel de detalhes. As descrições fazem ida e volta com a descrição da variável no Figma.
• Apagar uma descrição na web nunca exclui a do Figma — a sincronização não apaga descrições do lado do Figma.

Tags

• Uma Tag é um agrupamento interno escolhido numa paleta de 7 cores (Vermelho · Âmbar · Verde · Azul · Roxo · Magenta · Cinza). Clique numa célula da coluna Tag para alternar cores na paleta; uma variável pode ter várias tags.
• A célula mostra as cores das tags como pontos lado a lado; acima de quatro, o resto vira +N. Sem tag na paleta remove todas.
• As tags existem só na web — nunca são gravadas no Figma e nunca são apagadas pela sincronização.

Editar muitas variáveis de uma vez

Abra o painel de detalhes pelo ícone de detalhes que aparece ao passar o mouse sobre uma linha. Com várias linhas selecionadas, o painel muda para Selecionados: N e edita a seleção inteira.

• A descrição que você digitar vale para todas as variáveis selecionadas.
• Escopos e tags mostram Misto quando a seleção não bate; clicar numa caixa de escopo ou num ponto de cor de tag unifica todas.
• Não é possível editar escopos entre tipos diferentes — selecione variáveis de um mesmo tipo.
• Um único Ctrl(⌘)+Z desfaz o lote inteiro.

Ver o estado em cores — o grafo

Na aba do grafo de tokens, os metadados podem ser pintados sobre a estrutura para você ver tudo num relance.

• Em Colorir por, na barra de ferramentas do grafo, escolha Não está no Figma para destacar as variáveis que ainda não existem no Figma; cada nível de referência mostra um selo Não estão no Figma: N com a contagem. Na grade Master, esse estado aparece sempre que o projeto estiver conectado a um arquivo do Figma — ao passar o mouse sobre o ponto ao lado do nome, aparece Ainda não está no Figma — some quando a próxima sincronização a criar.
• Escolha Escopos e cada nível de referência mostra os selos Com escopo: N · Todos: N · Ocultos: N (sem escopos — a variável não aparece em nenhum seletor) · Não coletados: N, para você identificar tokens inacabados direto na estrutura.
• Os pontos de cor das tags também aparecem ao lado dos tokens no grafo.