Is there a way to use `styled()` from mui (<https:...
# react
m
Is there a way to use
styled()
from mui (https://mui.com/system/styled) using kotlin-wrappers? I tried this but it does not seem to work (I guess because the imported styled is
emotion.styled.styled
).
Copy code
val MyBox = Box.styled { props, _ ->
    <http://props.sx|props.sx> {
        display = responsive(
            <http://Breakpoint.sm|Breakpoint.sm> to Display.none,
            Breakpoint.md to Display.flex,
        )
        flexGrow = responsive(
            Breakpoint.md to number(1.0),
            Breakpoint.lg to number(3.0),
        )
    }
}
t
Copy code
val MyBox = Box.styled { _, _ ->
        display = responsive(
            <http://Breakpoint.sm|Breakpoint.sm> to Display.none,
            Breakpoint.md to Display.flex,
        )
        flexGrow = responsive(
            Breakpoint.md to number(1.0),
            Breakpoint.lg to number(3.0),
        )
}
?
m
It compiles, but nothing is set once the page is rendered. If I remove responsive() it works this way, but then I lose responsiveness.
t
Do you have TS example with responsiveness?