search

facebook / jsx

The JSX specification is a XML-like syntax extension to ECMAScript.
http://facebook.github.io/jsx/
1.96k stars 133 forks source link

[Feature Request]: Provision for style/external styles #73

Closed ashokkumarsand closed 7 years ago

ashokkumarsand commented 7 years ago

In JSX we can only apply styles in JSON object. There is some provision required, So user can also apply classes with attribute selector and other selectors `static style() {

}`

borela commented 7 years ago

Use CSS modules.

ashokkumarsand commented 7 years ago

@borela CSS module doesn't support the attribute selector

borela commented 7 years ago

Yes it does, CSS modules are just normal CSS classes. For everything else just use the :global switch.

ashokkumarsand commented 7 years ago

@borela But If we get in built react then there is no need to add third party api or library. currently we are using css module. but for large application that is bad pattern.

ashokkumarsand commented 7 years ago

For example i want to apply style with nth selector then what happen.

borela commented 7 years ago

With the global switch you can do that. As for the bad pattern, I disagree, my components has their CSS module in the same directory, for example:

login
   index.js
   style.mcss
list-of-users
  index.js
  style.mcss

I use mscss extension to identify css modules in webpack. That way I can have easily 1000+ components without major headaches.

ashokkumarsand commented 7 years ago

@borela The issue which i facing is different. I am doing this with china-logic. But if we have attribute selector then that is very helpful. Thanks for you assistance

ashokkumarsand commented 7 years ago

I Think is that meaning of JSX is taken by JavaScript + Styles + XHTML then it make complete meaning of it

sebmarkbage commented 7 years ago

This JSX repo is a spec for the syntax definition of JSX and not for an implementation of React or any other library that might want to utilize this syntax.

The syntax that you describe is already covered by the JSX syntax specification, but not by React. You can open it up on React if you're interested in discussing any compatibility issues. Although what you're describing is also supported by React, you just have to make sure it gets rendered into a tree. If that tree is a shadow DOM it is also local to that subtree.

sebmarkbage commented 7 years ago

Actually I think what you're really asking for is a dupe of https://github.com/facebook/jsx/issues/74

ashokkumarsand commented 7 years ago

@sebmarkbage The JSX syntax also having some provision for STYLE because without style Web development is in complete. IF JSX syntax having provision for Javascript with HTML/XHTML then it also have same tags for STYLE also, and from my perspective its incomplete.