{"action":"created","issue":{"url":"https://api.github.com/repos/javivelasco/react-css-themr/issues/3","repository_url":"https://api.github.com/repos/javivelasco/react-css-themr","labels_url":"https://api.github.com/repos/javivelasco/react-css-themr/issues/3/labels{/name}","comments_url":"https://api.github.com/repos/javivelasco/react-css-themr/issues/3/comments","events_url":"https://api.github.com/repos/javivelasco/react-css-themr/issues/3/events","html_url":"https://github.com/javivelasco/react-css-themr/issues/3","id":161681311,"number":3,"title":"Feature Request: Provide `themeName` prop for components wrapped by `themr`","user":{"login":"SohKai","id":4166642,"avatar_url":"https://avatars.githubusercontent.com/u/4166642?v=3","gravatar_id":"","url":"https://api.github.com/users/SohKai","html_url":"https://github.com/SohKai","followers_url":"https://api.github.com/users/SohKai/followers","following_url":"https://api.github.com/users/SohKai/following{/other_user}","gists_url":"https://api.github.com/users/SohKai/gists{/gist_id}","starred_url":"https://api.github.com/users/SohKai/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/SohKai/subscriptions","organizations_url":"https://api.github.com/users/SohKai/orgs","repos_url":"https://api.github.com/users/SohKai/repos","events_url":"https://api.github.com/users/SohKai/events{/privacy}","received_events_url":"https://api.github.com/users/SohKai/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":5,"created_at":"2016-06-22T13:22:33Z","updated_at":"2016-06-22T16:32:53Z","closed_at":null,"body":"Having to deal with the style object generated by module bundlers is typically unfriendly, for all the reasons outlined in [react-css-modules#whats-the-problem](https://github.com/gajus/react-css-modules#whats-the-problem).\r\n\r\nIt'd be nice if styling was done through a similar approach to what react-css-modules provides by way of a `themeName` prop that gets inspected by the HOC and is automatically injected into that children component's `classNames`. Having a similar API also provides more hints to the user as to which one they should be wrapping their components in: if its styles are meant to be overriden or injected, use `themr`, otherwise use `react-css-modules`. However, it's a little bit awkward in that `themr` could almost be seen as a superset of `react-css-modules`, but I think there's something to be gained by limiting the themeability of a component through `react-css-modules` and I see at least one clear use case where I'd use both together -- inline child components:\r\n\r\n```js\r\nimport React from 'react';\r\nimport CSSModules from 'react-css-modules';\r\nimport { themr } from 'react-css-themr';\r\nimport List from './List';\r\nimport theme from './table.css';\r\n\r\nclass CustomList extends React.Component {\r\n    render () {\r\n        let itemTemplate = CSSModules((name) => (\r\n            <li styleName='item-template'>{name}</li>;\r\n        ), this.props.theme); // or even subset of theme (ie. { 'item-template': this.props.theme['item-template'] })\r\n\r\n        return <List themeName=\"list\" itemTemplate={itemTemplate} />;\r\n    }\r\n}\r\n\r\nexport default themr(\"ListComponent\", theme)(CustomList);\r\n// As an aside, it'd also be nice to expose a normal function operator,\r\n// see https://github.com/gajus/react-css-modules/blob/master/src/index.js#L47\r\n```\r\n\r\nThoughts? Also pulling in @gajus since he might have some thoughts to share.\r\n\r\nI'll probably start working on this soon since I'm finally getting around to using this (awesome work btw, @javivelasco, a lot of this makes a lot of sense and solidified a lot of the ideas I had wanted to implement myself!) but the similarities to `react-css-modules` means I'll likely pull a lot from that repo or generalize it into some generic style utils."},"comment":{"url":"https://api.github.com/repos/javivelasco/react-css-themr/issues/comments/227801010","html_url":"https://github.com/javivelasco/react-css-themr/issues/3#issuecomment-227801010","issue_url":"https://api.github.com/repos/javivelasco/react-css-themr/issues/3","id":227801010,"user":{"login":"gajus","id":973543,"avatar_url":"https://avatars.githubusercontent.com/u/973543?v=3","gravatar_id":"","url":"https://api.github.com/users/gajus","html_url":"https://github.com/gajus","followers_url":"https://api.github.com/users/gajus/followers","following_url":"https://api.github.com/users/gajus/following{/other_user}","gists_url":"https://api.github.com/users/gajus/gists{/gist_id}","starred_url":"https://api.github.com/users/gajus/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/gajus/subscriptions","organizations_url":"https://api.github.com/users/gajus/orgs","repos_url":"https://api.github.com/users/gajus/repos","events_url":"https://api.github.com/users/gajus/events{/privacy}","received_events_url":"https://api.github.com/users/gajus/received_events","type":"User","site_admin":false},"created_at":"2016-06-22T16:32:53Z","updated_at":"2016-06-22T16:32:53Z","body":"> I suppose at the other end of the suggestion spectrum, the ability to theme could also be baked into react-css-modules rather than making react-css-themr's API closer to `react-css-modules. In any case though, I think it'd still be nice to be able to explicitly declare that a component can either be rethemed or not.\r\n\r\nTheme-ing, in one way or another, is super important to `react-css-modules`. However, I think that `react-css-modules` should not provide implementation of theme-ing, it should only provide hooks required to implement theme-ing. Therefore I think that [`resolveStyles`](https://github.com/javivelasco/react-css-themr/issues/3#issuecomment-227769740) is quite an elegant solution.\r\n\r\nIf you'd like to discuss this further, please raise an issue in `react-css-modules` repository."}}
{"actor":{"display_login":"gajus"}}