style-dictionary-tailwindcss-transformer icon indicating copy to clipboard operation
style-dictionary-tailwindcss-transformer copied to clipboard

feat: upgrade to style dictionary v4

Open BJJLangedijk opened this issue 1 year ago • 1 comments

Hello, I was upgrading to v4 style dictionary in my project and this dependency broke during that.

I'm not entirely sure how this should be released as it is a breaking change.

I thought about making it backward compatible but then I had issues with the types not matching V4.

For now I just changed it in my project which does work but is not ideal going forward so this will need to be merged at some point.


// Make it StyleDictionary v4 compatible
const StyleDictionaryTailwind = new StyleDictionary({
	...TailwindConfig,
	hooks: {
		formats: TailwindConfig.format,
	},
});```

BJJLangedijk avatar Jul 29 '24 10:07 BJJLangedijk

Thanks @BJJLangedijk I got response with

import StyleDictionary from "style-dictionary";
import { makeSdTailwindConfig } from "sd-tailwindcss-transformer";

const types = ["colors"];
for (const type of types) {
  const tailwindConfig = makeSdTailwindConfig({ type });
  tailwindConfig.platforms = {
    "tailwind/colors": {
      ...tailwindConfig.platforms["tailwind/colors"],
      // Overriding 'name/cti/kebab' to "name/kebab"
      transforms: ["attribute/cti", "name/kebab"],
    },
  };

  const styleDictionaryTailwind = new StyleDictionary({
    ...tailwindConfig,
    hooks: {
      formats: {
        tailwindFormat: ({ dictionary }) => {
          const formated = tailwindConfig.format.tailwindFormat({
            dictionary: {
              ...dictionary,
              allTokens: dictionary.allTokens.map((token) => ({
                ...token,
                value: token["$value"],
              })),
            },
          });
          return formated;
        },
      },
    },
  });

  await styleDictionaryTailwind.hasInitialized;

  await styleDictionaryTailwind.buildAllPlatforms();
}

mrajaeim avatar Sep 09 '24 08:09 mrajaeim

Thank you for contribution! I'm sorry, but this time we're going to merge this pull request. We have released v2.0.0, please check it out!

nado1001 avatar Sep 23 '24 11:09 nado1001