tokens-studio / sd-transforms

Custom transforms for Style-Dictionary, to work with Design Tokens that are exported from Tokens Studio
MIT License
194 stars 28 forks source link

[Feature]: RegisterTransforms with different options on each execution #188

Closed Todberg closed 1 year ago

Todberg commented 1 year ago

What feature would you like?

The registerTransforms function accepts the imported StyleDictionary object as well as preprocessing options for expanding compositions, typography, shadows, etc.

registerTransforms(StyleDictionary, { expand: { typography: true }});

As part of my build process, I want to be able to run Style Dictionary multiple times with different options. How can this be done with the current API? I tried creating a factory function and passing in an instance of SD from extend, but then the expand won't work.

import StyleDictionary, { type Core, type Config } from 'style-dictionary';

/**
 * Creates an instance of Style Dictionary that is configured to work with
 * Tokens Studio.
 * @param config The Style Dictionary configuration.
 * @param options The transformation options.
 */
export function createStyleDictionary(
  config: Config,
  options?: Parameters<typeof registerTransforms>[1],
): Core {
  const instance = StyleDictionary.extend(config);
  registerTransforms(instance, options);

  return instance;
}

The use-case is that I want both expanded typography/composition/shadows and shorthands created through transformers. For example having heading-01 (font shorthand) and heading-01-font-weight, heading-01-font-family, etc.

Todberg commented 1 year ago

The problem was on my end.