Skip to content

🚀 v2.0.0
Compare
Choose a tag to compare
@gregberge gregberge released this 03 Jan 19:37
v2.0.0
91c9c00
This commit was signed with the committer’s verified signature.
gregberge Greg Bergé
GPG key ID: C617C84D74588473
Learn about vigilant mode.

Features

  • TypeScript typings
  • Emotion v11
  • Get rid of forwardedAs (use as instead)
  • Allow configuration of rootFontSize for rpx utilities
  • Introduce a defaultTheme
  • Add state support (motionSafe, motionReduce, first, last, odd, even, visited, checked, focusWithin, hover, focus, focusVisible, active, disabled, placeholder)
  • Support shorthand styles
  • Add gridTemplateColumns and gridTemplateRows support in theme
  • Introduce default value if value is true
  • Support string value as number for pixels and durations
  • Support <Box.{element}> syntax
  • Add transitionProperties and timingFunctions support in theme
  • Add inset support in theme
  • Support arrays for list properties in theme
  • Add getDuration getter
  • Add Preflight: a set of global style to start a project
  • Support default value in th and th.*
  • Allow to create complex style generator using style utility
  • Add aliasColorand generateHexAlphaVariants utilities
  • Add useTh and other hooks to get theme props
  • Add x.extend and createX utilities

New Utilities

  • Add svg utilities: fill, stroke
  • Add space utilties: spaceX, spaceX
  • Add sizing utilities: w, h
  • Add lists utilities: listStyleType, listStyleTypePosition
  • Add borders utilities: outline, divideX, divideY, divideXReverse, divideYReverse, divideStyle, divideColor, ring, ringInset, ringColor
  • Add typography utilities: textDecoration, textOverflow, whiteSpace
  • Add layout utilities: overflowX, overflowY, boxSizing, container, visibility, overscrollBehavior, objectFit
  • Add grid utilities: gap
  • Add tables utilities: tableLayout, borderCollapse
  • Add transitions utilities: transitionProperty, transitionDuration, transitionTimingFunction, transitionDelay
  • Add animations utilities: animation
  • Add interactivity utilities: appearance, cursor, pointerEvents, resize, userSelect
  • Add transforms utilities: transform, transformOrigin, translateX, translateY, rotate, skewX, skewY, scale, scaleX, scaleY
  • Add backgrounds utilities: backgroundAttachment, backgroundClip, gradientFrom, gradientVia, gradientTo

Breaking Changes

  • Emotion v10 is no longer supported
  • Remove default space
  • Remove default breakpoints
  • Rename breakpoints theme section to screens
  • Remove variant utility
  • Remove width and height utility (only aliases remain w and h)
  • Replace gridGap by gap
  • Remove border{direction} and border{direction}Color utilities
  • Reorganize all utilities

Read Upgrade Guide to know more about breaking changes.

Assets 2
Loading