Skip to content

Performance rewrite

Compare
Choose a tag to compare
@jxnblk jxnblk released this 15 Jul 15:06
· 2658 commits to master since this release

This rewrite helps make styled-system smaller, faster, and simplifies the API.

Added

Changed

  • style utility is now responsive by default
  • All built-in style functions now support responsive array values
  • backgroundImage no longer wraps values with url()
  • buttonStyle prop has been renamed to variant
  • The style utility getter argument has beend renamed to transformValue
  • util.get no longer supports a fallback argument

Removed

  • responsiveStyle use style instead
  • complexStyle use variant instead
  • complexStyle (variant) boolean props are no longer supported
  • pseudoStyle
  • hover
  • focus
  • active
  • disabled
  • fontSize and width no longer support shorthand props
  • alias option
  • numberToPx option (pass util.px to the transformValue argument instead)
  • util.media
  • util.neg
  • util.arr
  • util.getWidth
  • util.mq
  • util.fallbackTheme
  • util.breaks
  • util.dec
  • util.getValue

Migrating from v2

  • Replace all deprecated shorthand f props with the fontSize prop
  • Replace all deprecated shorthand w props with the width prop
  • Replace the deprecated buttonStyle prop with the variant prop
  • Ensure backgroundImage props include the CSS url() syntax where needed
  • Replace instances of responsiveStyle with the style utility
  • Replace the numberToPx argument with transformValue: util.px
  • Rename the getter argument with transformValue
  • Replace complexStyle with variant
  • Replace custom alias props with something like recompose's mapProps
  • Ensure boolean props are not used for variant styles, including:
    • buttonStyle
    • textStyle
    • colors
  • If you were using hover, focus, active, disabled, or pseudoStyle, consider adding your own replacement
  • Consider adding replacements for any of the removed utilities listed above