@chakra-v2/styled-system/dist/esm/config/transform.mjs

Style function for css-in-js building component libraries

import { t } from '../utils/index.mjs';
import { transformFunctions } from '../utils/transform-functions.mjs';

const transform = {
  clipPath: true,
  transform: t.propT("transform", transformFunctions.transform),
  transformOrigin: true,
  translateX: t.spaceT((theme) => `--${theme.config.cssVarPrefix}-translate-x`),
  translateY: t.spaceT((theme) => `--${theme.config.cssVarPrefix}-translate-y`),
  skewX: t.degreeT((theme) => `--${theme.config.cssVarPrefix}-skew-x`),
  skewY: t.degreeT((theme) => `--${theme.config.cssVarPrefix}-skew-y`),
  scaleX: t.prop((theme) => `--${theme.config.cssVarPrefix}-scale-x`),
  scaleY: t.prop((theme) => `--${theme.config.cssVarPrefix}-scale-y`),
  scale: t.prop((theme) => [
    `--${theme.config.cssVarPrefix}-scale-x`,
    `--${theme.config.cssVarPrefix}-scale-y`
  ]),
  rotate: t.degreeT((theme) => `--${theme.config.cssVarPrefix}-rotate`)
};

export { transform };