Support for # id selectors

[gregnb]

Working on a recent project I needed support for # id selectors. I see that they are being passed in but there was no transformation for them. Only classes. Using the JSX attribute 'styleId' this will override the "id" attribute and fill it with the namespaced style using either string literal/JSX expressions

Usage:

Demo.css

#simpleEl {
   background-color: #FF0000;
}

Demo.js

import React from 'react';
import './demo.css';

export default () => {
  return (
    <div>
      <div styleId='simpleEl'>
      </div>
      <div styleId={'simpleEl'}>
      </div>
  ); 
};

[tyler-dot-earth]

What you're requesting is a change to CSS modules concept itself, I think. Feels outside the scope of babel-plugin-react-css-modules to me.

[gregnb]

Ah, ok no problem. I understand. Thanks @tsniemam - Just seeing those id computed styles still coming through css-loader figured things would be ok.

[gajus]

Working on a recent project I needed support for # id selectors. I see that they are being passed in but there was no transformation for them.

There is just no use for them in css-modules.

You can simply convert CSS to use classes and still assign the element an ID for whatever JS manipulation.