{"action":"created","issue":{"url":"https://api.github.com/repos/FormidableLabs/radium/issues/397","labels_url":"https://api.github.com/repos/FormidableLabs/radium/issues/397/labels{/name}","comments_url":"https://api.github.com/repos/FormidableLabs/radium/issues/397/comments","events_url":"https://api.github.com/repos/FormidableLabs/radium/issues/397/events","html_url":"https://github.com/FormidableLabs/radium/issues/397","id":113289391,"number":397,"title":"Configuring Radium","user":{"login":"ianobermiller","id":897931,"avatar_url":"https://avatars.githubusercontent.com/u/897931?v=3","gravatar_id":"","url":"https://api.github.com/users/ianobermiller","html_url":"https://github.com/ianobermiller","followers_url":"https://api.github.com/users/ianobermiller/followers","following_url":"https://api.github.com/users/ianobermiller/following{/other_user}","gists_url":"https://api.github.com/users/ianobermiller/gists{/gist_id}","starred_url":"https://api.github.com/users/ianobermiller/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ianobermiller/subscriptions","organizations_url":"https://api.github.com/users/ianobermiller/orgs","repos_url":"https://api.github.com/users/ianobermiller/repos","events_url":"https://api.github.com/users/ianobermiller/events{/privacy}","received_events_url":"https://api.github.com/users/ianobermiller/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":5,"created_at":"2015-10-26T05:46:55Z","updated_at":"2015-11-11T23:13:34Z","closed_at":null,"body":"Little history first: originally, Radium had no configuration. Then we introduced a global setter for the `matchMedia` function. Not liking the global state, I changed `matchMedia` to be configured via an options hash passed to `Radium({..})`, and proposed wrapping the result in a module (see the docs). After actually trying this same thing (but with userAgent instead), I realized this approach doesn't really work for things you only set once (`matchMedia`), and doesn't work at all for things you need to set on every request, like `userAgent`. For example:\r\n\r\n```js\r\nlet myMatchMedia = window.matchMedia;\r\nfunction setMatchMedia(newMatchMedia) {\r\n  myMatchMedia = newMatchMedia;\r\n}\r\n\r\nfunction ConfiguredRadium(component) {\r\n  return Radium({\r\n    matchMedia: myMatchMedia,\r\n  })(component);\r\n}\r\n```\r\n\r\nLooks fine on the surface, right? Wrong. The `Radium` function, or `ConfiguredRadium` in this case, is only called **once** per component, when the module is loaded. So they only way to make `setMatchMedia` work is to call it before any of your components that use `Radium` are loaded. Ugh. \r\n\r\nTurns out there are three ways you might want to configure Radium, split into groups by when and how often they are configured:\r\n\r\n1) Static configuration, e.g. changing the default plugins for all components\r\n2) Static configuration per component, e.g. adding a single plugin or tweaking a single setting for an individual component\r\n3) Dynamic configuration that changes (say per request when rendered server side), e.g. userAgent\r\n\r\nThe existing configuration mechanism works fine for 1 and 2, but completely fails at 3. In fact, it isn't even possible, since Radium is only configured once per component!\r\n\r\nI'm open to suggestions for solving this, but here is my idea so far:\r\n\r\n- Keep the existing mechanism for static configuration, except move it to `Radium.configure()` so it is more explicit. We also need to make sure the configured object that is returned has all the statics you expect on Radium, so you don't need to import `ConfiguredRadium` and `Radium`; you should just be able to replace Radium. I'm not set on the rename, but we definitely need the statics copied.\r\n- Create `Radium.Container` that passes dynamic config down the tree via context. `Container` would be optional, only needed if you have dynamic config. Could even be named `Radium.DynamicConfigContainer` or something crazy. Context would allow us to pass configuration down at `render`-time as opposed to module load time.\r\n\r\nThoughts?"},"comment":{"url":"https://api.github.com/repos/FormidableLabs/radium/issues/comments/155939176","html_url":"https://github.com/FormidableLabs/radium/issues/397#issuecomment-155939176","issue_url":"https://api.github.com/repos/FormidableLabs/radium/issues/397","id":155939176,"user":{"login":"ianobermiller","id":897931,"avatar_url":"https://avatars.githubusercontent.com/u/897931?v=3","gravatar_id":"","url":"https://api.github.com/users/ianobermiller","html_url":"https://github.com/ianobermiller","followers_url":"https://api.github.com/users/ianobermiller/followers","following_url":"https://api.github.com/users/ianobermiller/following{/other_user}","gists_url":"https://api.github.com/users/ianobermiller/gists{/gist_id}","starred_url":"https://api.github.com/users/ianobermiller/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ianobermiller/subscriptions","organizations_url":"https://api.github.com/users/ianobermiller/orgs","repos_url":"https://api.github.com/users/ianobermiller/repos","events_url":"https://api.github.com/users/ianobermiller/events{/privacy}","received_events_url":"https://api.github.com/users/ianobermiller/received_events","type":"User","site_admin":false},"created_at":"2015-11-11T23:13:34Z","updated_at":"2015-11-11T23:13:34Z","body":"I've landed the changes for this, but haven't yet fixed keyframes. I'm happy to do an interim release, though."}}