Releases: styled-components/xstyled
Releases · styled-components/xstyled
v2.1.0
🚀 v2.0.0
Features
- TypeScript typings
- Emotion v11
- Get rid of
forwardedAs
(useas
instead) - Allow configuration of
rootFontSize
forrpx
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
andgridTemplateRows
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
andtimingFunctions
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
andth.*
- Allow to create complex style generator using
style
utility - Add
aliasColor
andgenerateHexAlphaVariants
utilities - Add
useTh
and other hooks to get theme props - Add
x.extend
andcreateX
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 toscreens
- Remove
variant
utility - Remove
width
andheight
utility (only aliases remainw
andh
) - Replace
gridGap
bygap
- Remove
border{direction}
andborder{direction}Color
utilities - Reorganize all utilities
Read Upgrade Guide to know more about breaking changes.