gajus / babel-plugin-react-css-modules

Transforms styleName to className using compile time CSS module resolution.
Other
2.05k stars 162 forks source link

Plugin doesn't resolve classnames in function #226

Open shrihari-balasubramani opened 5 years ago

shrihari-balasubramani commented 5 years ago

Plugin doesn't resolve the styles in the following scenario.

import styles from './TYTextButton.css'
import classnames from 'classnames'

const renderText = (text, textClassName) => <Typography className={classnames(styles.text, textClassName)}>{text}</Typography>

I tried work arounds and came out with this approach https://github.com/shrihari-balasubramani/babel-plugin-react-css-modules/commit/a6e5849fee18c0376eb704ea012d7a0892ce0bfb

Please let me know if any better approach exists for this. Else I can raise a PR here .

AlbertLucianto commented 5 years ago

@shrihari-balasubramani maybe you're looking for named reference?

Something like

import classnames from 'classnames';
import foo from './foo1.css';

// Imports "a" CSS module from ./foo1.css.
<div styleName={classnames('foo.a')}></div>;
shrihari-balasubramani commented 5 years ago

@AlbertLucianto no. I also need to pass the style object to the child component as a prop.