[postcss-linaria] Allow for alias of css in config

[clintandrewhall]

Describe the enhancement

Supply the ability to declare aliases for css and styled when running stylelint analysis for projects that export those methods from linaria with a different name.

Motivation

I'm using atomic styles in a personal project. I recently added stylelint with property-disallowed-list to flag uses of margin and padding, (to prompt using margin-left instead, etc) and it wasn't working... at all.

After a day of digging, it turned out the reason was I had abstracted the use of linaria out to a local import. And since I was needing to apply global styles for a component library, to differentiate css from core and atomic, I had done the following:

// lib/css
export { css as csa, styled } from '@linaria/atomic';
export { css } from '@linaria/core';

and

// some/component.styles.ts

import { csa } from '@lib/css';
...
csa`{
  margin-left: 10px;
}`

Because postcss-linaria looks specifically for css and styled the string literals weren't being flagged.

Possible implementations

Allow the ability to configure the syntax with aliases to each named method:

alias: {
  css: 'csa',
  styled: 'linariaStyled',
}

Related Issues

None I could find.

[DaveSauce]

Is there any reason this syntax won't work for you?

export { css as csa } from '@linaria/core';

[clintandrewhall]

@DaveSauce That's literally what I did, and what surfaced the issue.

Because postcss-linaria looks specifically for css and styled the string literals weren't being flagged.

If the function is renamed, postcss-linaria doesn't see it.