@chakra-v2/styled-system/dist/esm/utils/index.mjs

Style function for css-in-js building component libraries

import { createTransform } from './create-transform.mjs';
import { toConfig, logical } from './prop-config.mjs';
import { transformFunctions } from './transform-functions.mjs';

const t = {
  borderWidths: toConfig("borderWidths"),
  borderStyles: toConfig("borderStyles"),
  colors: toConfig("colors"),
  borders: toConfig("borders"),
  gradients: toConfig("gradients", transformFunctions.gradient),
  radii: toConfig("radii", transformFunctions.px),
  space: toConfig(
    "space",
    (value, theme) => transformFunctions.px(transformFunctions.vh(value, theme))
  ),
  spaceT: toConfig(
    "space",
    (value, theme) => transformFunctions.px(transformFunctions.vh(value, theme))
  ),
  degreeT(property) {
    return { property, transform: transformFunctions.degree };
  },
  prop(property, scale, transform) {
    return {
      property,
      scale,
      ...scale && {
        transform: createTransform({ scale, transform })
      }
    };
  },
  propT(property, transform) {
    return { property, transform };
  },
  sizes: toConfig(
    "sizes",
    (value, theme) => transformFunctions.px(transformFunctions.vh(value, theme))
  ),
  sizesT: toConfig(
    "sizes",
    (value, theme) => transformFunctions.fraction(transformFunctions.vh(value, theme))
  ),
  shadows: toConfig("shadows"),
  logical,
  blur: toConfig("blur", transformFunctions.blur)
};

export { t, transformFunctions as transforms };