griffel-codemod-shorthands

This codemod helps you to convert your existing Griffel code to use the new one that supports CSS shorthand syntax.

Usage

npx griffel-codemod-shorthands [pattern]
npx griffel-codemod-shorthands **/*.styles.ts

Example

// Before
const useStyles = makeStyles({
  root: {
    display: "flex",
    ...shortcuts.padding("10px"),
  },
});

⬇️⬇️⬇️

// After
const useStyles = makeStyles({
  root: {
    display: "flex",
    padding: "10px",
  },
});