All Versions
117
Latest Version
Avg Release Cycle
41 days
Latest Release
1309 days ago

Changelog History
Page 6

  • v4.0.0-beta.1 Changes

    September 06, 2018

    • 🛠 Fixed an issue where createGlobalStyle was clobbering the very next style to be applied during rehydration in production mode, by @probablyup (see #1976)

    • ✂ Removed some unused code, by @probablyup (see #1976)

    • 💅 Switched createGlobalStyle to be a PureComponent, by @probablyup (see #1976)

  • v4.0.0-beta.0 Changes

    September 04, 2018

    It's still highly recommended to use aliasing via your bundler to dedupe libraries like styled-components and react.

    • 💅 [Breaking change] Refactor keyframes helper, by @fer0x (see #1930).

    Keyframes is now implemented in a "lazy" manner: its styles will be injected with the render phase of components using them.

    keyframes no longer returns an animation name, instead it returns an object which has method .getName() for the purpose of getting the animation name.

    • ➕ Add createGlobalStyle that returns a component which, when mounting, will apply global styles. This is a replacement for the injectGlobal API. It can be updated, replaced, removed, etc like any normal component and the global scope will update accordingly, by @JamieDixon @marionebl, @yjimk, and @imbhargav5 (see #1416)
      const GlobalStyles = createGlobalStyle`
    html {
      color: 'red';
    }
  `;

  // then put it in your React tree somewhere:
  // <GlobalStyles />

    • 🚚 Migrate to use new React.forwardRef API, by @probablyup; note that this removes the innerRef API since it is no longer needed.

    • 💅 Implement styled() wrapper folding. In a nutshell, when you nest styled wrappers (e.g. styled(styled.div)) the components are now folded such that only one is mounted that contains the merged styles of its ancestors. This is conceptually equivalent to the removed "extend" functionality, but without many of the downsides -- and it's automatic, by @probablyup (see #1962)

    • ➕ Added a first-class API for rendering polymorphism via "as" prop. In most cases, this new prop will replace your need to use the .withComponent API. It allows you to control what underlying element or component is rendered at runtime, while not messing with the styles, by @probablyup (see #1962)

      import { Link } from 'react-router'

  const Component = styled.div`
    color: red;
  `

  // Examples
  <Component>Hello world!</Component>
  <Component as="span">Hello world!</Component>
  <Component as={Link} to="home">Hello world!</Component>

  • v3.4.10 Changes

    October 09, 2018
    • ➕ Added a few iframe attributes to the valid attribute list: allow, allowUserMedia, allowPaymentRequest, by @asoltys (see #2083 and #2085)

  • v3.4.9 Changes

    September 18, 2018
    • ✂ Remove the injectGlobal warning; it's not actionable since the replacement API is in v4 only, so why say anything?

  • v3.4.8 Changes

    September 17, 2018
    • 🛠 Fix the injectGlobal warning not being properly guarded for production, by @probablyup

  • v3.4.7 Changes

    September 17, 2018

    • ➕ Add warning for the upcoming removal of the injectGlobal API in v4.0, by @rainboxx (see #1867)

    • 💅 Backport from v4: Beef up the error message that sometimes occurs when multiple versions of styled components are used together and the StyleSheet instance can't be found, by @probablyup (see #2012)

  • v3.4.6 Changes

    September 10, 2018
    • 🛠 Fix an issue when streaming with very large amounts of output where sometimes styles might not make it to the client, by @probablyup (see #1997)

  • v3.4.5 Changes

    August 23, 2018
    • 🗄 Tone down the dev warnings for deprecated APIs (they were console.error, now console.warn), by @probablyup

  • v3.4.4 Changes

    August 21, 2018
    • 🛠 Fix warning function not having a production fallback, by @mitoyarzun (see #1938)

  • v3.4.3 Changes

    August 21, 2018

    • ➕ Add warning for the upcoming removal of the extend API in v4.0, by @probablyup (see #1909)

    • 💅 Throw Error if a React component was mistakenly interpolated within styles, by @imbhargav5 (see #1883)

    • 🛠 Fix the primitives build, by @probablyup (see 24f097)