Styled-system: Certain styled-system keys aren't properly stripped out with system-components

[lucastobrazil]

Not sure if it's a bug or I'm doing something wrong, but the clean-tag and/or clean-element functions seem to be having issues with stripping out the props.

Example:

Getting the following error:
Warning: React does not recognize the 'boxShadow' prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase 'boxshadow' instead.

The color ones all seem to just work even without

Here's my setup:

import system from 'system-components';

const TestButton = system(
    {
        boxShadow: 20,
        blacklist: ['iconRight'],
    },
    'color',
    'bg'
);

<TestButton bg="primary" color="white" iconRight={true}>
    View Full Profile
</TestButton>

And my HTML output:

<div bg="primary" color="white" boxshadow="20" class="sc-htpNat fkbLcD">View Full Profile</div>

[lucastobrazil]

I"ve continued looking into this, and it seems that whenever I add something to the blacklist, then it stops stripping the tags out.

const TestButton = system({
    is: 'button',
    bg: 'primary',
    color: 'white',
    boxShadow: 100,
});

<TestButton bg="primary" color="white" />

results in:

// Correct, tags stripped out
<button class="sc-htpNat lhItvd" />

But then, add a blacklist:

const TestButton = system({
    is: 'button',
    bg: 'primary',
    color: 'white',
    boxShadow: 100,
    blacklist: ['iconRight'], <-- // here blacklist added
});

<TestButton bg="primary" color="white" iconRIght={true} />

results in:

// Incorrect, ALL tags in there now
<button class="sc-htpNat lhItvd" bg="primary" color="white" boxshadow="100" />

Seems to me to be a bug with the blacklist processing?

[jt3k]

You want too much from hype technology.

[lucastobrazil]

@jt3k super helpful input, thanks.

[jxnblk]

system-components has been renamed to https://github.com/rebassjs/components – the latest version should allow for custom blacklists, whereas the previous one did not. Feel free to open a new issue on the other repo if needed