Skip to content

Theemo / @theemo/style-dictionary / valueResolveConstraintTransform

Variable: valueResolveConstraintTransform

ts
const valueResolveConstraintTransform: Transform;

Defined in: transforms/value-resolve-constraint.ts:97

Resolves the token value based on the provided constraints to make it processable by Style Dictionary.

Examples

Usage:

js
import StyleDictionary from 'style-dictionary';
import { valueResolveConstraintTransform } from '@theemo/style-dictionary';

StyleDictionary.registerTransform(valueResolveConstraintTransform);

export default {
  source: ['tokens/**/*.json'],
  platforms: {
    css: {
      constraints: {
        features: {
          'color-scheme': 'light'
        }
      },
      transforms: ['value/resolve-constraint']
    }
  }
};

Turning this:

json
{
  "$value": [
    {
      "value": "#12544a",
      "features": {
        "color-scheme": "light"
      }
    },
    {
      "value": "#80e5d6",
      "features": {
        "color-scheme": "dark"
      }
    }
  ],
  "$type": "color"
}

Into:

json
{
  "$value": "#12544a",
  "$type": "color"
}