Styledictionary/4/Hook Api Transform

/icons/calendar.svg

Last update

Oct 7, 2024

This codemod updates registered transforms to be placed inside the hooks.transforms property, instead of transform, with a shift from the singular to the plural form. Additionally, the name of the filter function has been changed from matcher to filter for consistency.

Before

export default {
// register it inline or by SD.registerTransform
transform: {
'color-transform': {
type: 'value',
matcher: (token) => token.type === 'color',
transformer: (token) => token.value,
},
},
platforms: {
css: {
// apply it per platform
transforms: ['color-transform'],
},
},
};

After

export default {
platforms: {
css: {
// apply it per platform
transforms: ['color-transform'],
},
},
hooks: {
transforms: {
'color-transform': {
type: 'value',
filter: (token) => token.type === 'color',
transform: (token) => token.value,
},
},
},
};

Build custom codemods

Use AI-powered codemod studio and automate undifferentiated tasks for yourself, colleagues or the community

background illustrationGet Started Now