custom styled function or decorator

[eviL-ivan]

Hi, linaria is awesome, but i try go from styled components to linaria and have a few troubles.
I don`t totaly undestand bug it or feature, please help me understand.

Do you want to request a feature or report a bug?

Maybe Bug

What is the current behavior?

For theming, so as not to pass theme in most of the components, i wanna decorate styled function, like this:

const myStyled = (Component) => withTheme(styled(Component));

But have a error:
Error: Using the "styled" tag in runtime is not supported. Make sure you have set up the Babel plugin correctly. See https://github.com/callstack/linaria#setup

https://codesandbox.io/embed/hello-world-8bukp

and if i use linaria for style any named component, like this:

const RedButton = styled(Button)

i have error:
import React from "react";

but it normally work if i pass styled component(like styled.h1), or arrow func, like with:

const RedButton = styled(p=><Button {...p}/>)

https://codesandbox.io/embed/hello-world-bu9q8

If the current behavior is a bug, please provide the steps to reproduce and a minimal repository on GitHub that we can yarn install and yarn test.

https://github.com/zeit/next.js/tree/canary/examples/with-linaria

What is the expected behavior?

I can`t use styled in runtime, but i can use any decorators around styled func, for my goals, like auto theme passing.
And i can style any components with linaria, same with styled-components.

[jayu]

In Linaria, you cannot use the styled function without template string after. Without template string, it will not get transpiled by babel and will leave styled code in runtime.

It should work if you change to

const myStyled = (Component) => withTheme(styled(Component)``);

[jayu]

I didn't understand the issue when I was closing it, but it's a duplicate of #447. Take a look on my comment with the solution #447 (comment)