Extending with variables bug

[Ilya Lesik]

There are two components:

• Base component: PrimaryButton
• Component that extend base component: WhiteButton

Base component (PrimaryButton) got correct styles:

{
    --c8_0: 2px;
    --c8_1: #4ba82e;
}

.___button_1tczc_1 {
    ...
    border-radius: var(--c8_0);
    background-color: var(--c8_1);
}

But extended component (WhiteButton) got incorrect styles:

{
    --c8_0: #000000;
    --c8_1: #ffffff;
}

.___button_17okg_1 {
    border: solid 1px var(--c8_0);
    background-color: var(--c8_1);
}

.___button_1tczc_1 {
    ...
    border-radius: var(--c8_0);  // bug here, should be 2px, but got #000000
    background-color: var(--c8_1);
}

[Anton Kastritskii]

Hi Ilya, thank you for the issue.

We've just released 0.0.1-alpha.66 version. I believe the fixes included in it should cover your case too. I will leave this issue open until you verify that your problem is gone.

[Ilya Lesik]

Cool, thanks. The new version fixes the bug. 🎉