Releases: styled-components/xstyled
Releases · styled-components/xstyled
v2.1.0
🚀 v2.0.0
Features
- TypeScript typings
- Emotion v11
- Get rid of
forwardedAs(useasinstead) - Allow configuration of
rootFontSizeforrpxutilities - 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
gridTemplateColumnsandgridTemplateRowssupport in theme - Introduce default value if value is
true - Support string value as number for pixels and durations
- Support
<Box.{element}>syntax - Add
transitionPropertiesandtimingFunctionssupport in theme - Add
insetsupport in theme - Support arrays for list properties in theme
- Add
getDurationgetter - Add
Preflight: a set of global style to start a project - Support default value in
thandth.* - Allow to create complex style generator using
styleutility - Add
aliasColorandgenerateHexAlphaVariantsutilities - Add
useThand other hooks to get theme props - Add
x.extendandcreateXutilities
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
breakpointstheme section toscreens - Remove
variantutility - Remove
widthandheightutility (only aliases remainwandh) - Replace
gridGapbygap - Remove
border{direction}andborder{direction}Colorutilities - Reorganize all utilities
Read Upgrade Guide to know more about breaking changes.