menu
announcement

Spectrum is now read-only. Learn more about the decision in our official announcement.

styled-components

Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress!

Channels
Team
Posts
Members
Info

Random Question about GlobalStyle

is it possible to import a GlobalStyle from another library which has been created using createGlobalStyle and extend with some more styles? cont { GlobalStyle } from "another-library"; const ExtendGlobal = styled(GlobalStyle)select { background-color: #f60; }

message-simple
0
Deleted·63d# Help

Performance issues with STYLED-COMPONENTS and ROLLUP

Hi everybody, I'm new of styled components and I'm developing a components library with Rollup, Styled Components (5.1) and Rect ^16. I'm testing it with Storybook and everything is ok if I test it inside the library. …

message-simple
2

Performance issues with styled components

When doing some React profiling on my Chrome DevTools, I see some styled components taking up to 100ms to run. This is so weird, since they don't have complex code at all. Here you can see a codesandbox with the component Spinner, which is actually running on our app and it…

message-simple
2

Problems with SSR (weird injection locations)

Hi! Been toying around with SSR in a custom NodeJS-server and got some empty styles-tag generated in head while another with the correct contents are injected into body. Here's some code to stare at: The serverside situation: …

message-simple
2

Is there an equivalent to styledComponentId that returns the dynamic class?

I'd like to get a reference to this in my react component so I can target each instance of the same styled component.

message-simple
0

How to automatically add className to all the styled-components?

Hi! I'm looking for a way to automatically add className to all the styled components (e.q. const MyButton = styled.button `` should then have <button class="MyButton" ... ). since we're creating components which are then used also in other projects and we want to enable for…

message-simple
0

[TypeScript] How to extract the prop types of a CSS util/mixin?

Looking for a way to get the prop types not of a component but a CSS util, e.g.: And then the component that uses it (PropType is the thing I'm looking for. React.Component<...> doesn't work here because Mixin is not a component, and TypeScript's native Parameters<...> doesn't…

message-simple
1

TS: Accept `as` prop in a wrapper component to send in to styled-component

I am wondering how I can reuse the as prop TypeScript type in this wrapper component:

message-simple
3

CSS Grid and prefixing?

I'm noticing that I'm not getting any vendor prefixes in IE11 for CSS Grid properties. I believe Styled Components is using autoprefixer under the hood and I think there are some configuration options that can be used with regard to Grid properties and how autoprefixer processes…

message-simple
8

Design System with microrepo architecture

Hi! I'm working on the product that will need to provide few (3-4) CRA projects. There is also a must have priority on themes, because I'll need to cover 100+ themes for different clients for all the apps. I've started to implement the solution with few react libraries: 1.…

message-simple
1