These are chat archives for chandu0101/scalajs-react-components

29th
Oct 2015
Janos Haber
@b0c1
Oct 29 2015 00:00
@elacin ok I removed almost everything... just the injectTap.. grrr
I must be externalize inject tap too
@elacin pushed... now it's 319k, you MUST inject the tap plugin... like react...
Janos Haber
@b0c1
Oct 29 2015 00:06
something wrong..
ok I must find a way to externalize inject tap event plugin, without react...
maybe we will create a copy in our js...
Øyvind Raddum Berg
@oyvindberg
Oct 29 2015 00:10
if the user of all this ends up putting that boilerplate in a <script> tag somewhere, thats not the end of the world i think?
Janos Haber
@b0c1
Oct 29 2015 00:10
yeah, but the tap event plugin is not a js code...
module.exports = function injectTapEventPlugin () {
  require('react/lib/EventPluginHub').injection.injectEventPluginsByName({
    "TapEventPlugin":       require('./TapEventPlugin.js')
  });
};
you can't call by <script> tag :D
Øyvind Raddum Berg
@oyvindberg
Oct 29 2015 00:14
hmm ok
Janos Haber
@b0c1
Oct 29 2015 00:34
and you can't access to EventPluginHub from outside... nice...
Øyvind Raddum Berg
@oyvindberg
Oct 29 2015 00:36
but doesn't that piece of code export injectTapEventPlugin, so you can just require it from the outside?
err, that fails because the tap event plugin is not available?
is it a problem if we just bundle it?
hard for me to see the consequences here
Janos Haber
@b0c1
Oct 29 2015 00:38
if we bundle it, we will bundle the whole react core
Øyvind Raddum Berg
@oyvindberg
Oct 29 2015 00:38
meeeh
right
Janos Haber
@b0c1
Oct 29 2015 00:38
because it's not using the requrie('react').EventPluginHub, it's access to the direct file, which will access to another file, and so on...
Øyvind Raddum Berg
@oyvindberg
Oct 29 2015 00:39
yeah i get you
thats irritating
Janos Haber
@b0c1
Oct 29 2015 00:48
maybe tomorrow...
Janos Haber
@b0c1
Oct 29 2015 08:04
@elacin I can't solve this without react guys
@elacin facebook/react#436
Janos Haber
@b0c1
Oct 29 2015 11:03
Ok guys I made a simple fallback solution while react guys not solve the original
I create da big fat jar with react/react-dom/material-ui and all dependent libraries
it's work like charm :)
here is the js deps
  val jsDependencies = Def.setting(Seq(
    "org.webjars.npm" % "scalajs-react-components-webjar" % "1.0.1" / "assets/react-components.js",
    "org.webjars.npm" % "scalajs-react-components-webjar" % "1.0.1" / "assets/mui.js",
And a sample :D
 val demo = ReactComponentB[Unit]("HelloWorld")
    .renderPC(($, P, C) => {
      <.div()(
        MuiTextField(hintText = "Boo")()
      )
    }).buildU

  @JSExport
  override def main(): Unit = {
    ReactDOM.render(demo(), dom.document.getElementById("container"))
  }
Roberto Leibman
@rleibman
Oct 29 2015 16:11
That's super cool, I"ll have to try it soon.
Øyvind Raddum Berg
@oyvindberg
Oct 29 2015 16:39
Awesome @b0c1 !
Roberto Leibman
@rleibman
Oct 29 2015 17:50
Hey @b0c1 ... do you think you could add react-dom to that webjar?
Janos Haber
@b0c1
Oct 29 2015 17:55
@rleibman it's already in the webjar because material ui depends on it
it's in window.ReactDOM
Roberto Leibman
@rleibman
Oct 29 2015 17:56
ah, ok.
Roberto Leibman
@rleibman
Oct 29 2015 18:31
@b0c1: I'm not sure how the minified version is supposed to work. for the react stuff I had:
```
jsDependencies += "org.webjars.npm" % "react" % "0.14.0" % "test" / "react-with-addons.js" commonJSName "React" minified "react-with-addons.min.js"
(this is from before, I'm using your webjar now)
The output looks pretty small already, so I think it's ok.
Janos Haber
@b0c1
Oct 29 2015 20:33
What layout do you use guys?
it's have like polymer flex layout? or bootstrap?
Otto Chrons
@ochrons
Oct 29 2015 20:55
mainly bootstrap
Janos Haber
@b0c1
Oct 29 2015 21:12
@ochrons and you use bootstrap components too? I mean navbar labels etc, or just the grid system?
Zach Langbert
@zlangbert
Oct 29 2015 21:12
I like http://flexboxgrid.com/ if you just want some layout help
and you don't have to support old browsers
Otto Chrons
@ochrons
Oct 29 2015 21:12
mainly the CSS
but I'm actually looking for a new layout engine that would be better suitable for admin dash boards :)
Janos Haber
@b0c1
Oct 29 2015 21:13
hehe...
and you found something interesting?
Otto Chrons
@ochrons
Oct 29 2015 21:13
semantic ui is one option
but haven't really looked that closely
Janos Haber
@b0c1
Oct 29 2015 21:14
just for layout ?
Otto Chrons
@ochrons
Oct 29 2015 21:14
most dashboard themes are build on top of bootstrap anyway
and BS has a lot of 3rd party components too, so I may end up using it anyway
Janos Haber
@b0c1
Oct 29 2015 21:16
flexboxgrid interesting... maybe I try to find a browser support chart
Janos Haber
@b0c1
Oct 29 2015 21:16
ty.... not bad...
Otto Chrons
@ochrons
Oct 29 2015 21:19
luckily my app is not for public use, so we can freely use bleeding edge features :)
Janos Haber
@b0c1
Oct 29 2015 21:19
me too... but I want a simple solution
which can I use with scalajs react components
flexboxgrid is really bootstrap like
and it's have webjar archive ;)
Zach Langbert
@zlangbert
Oct 29 2015 21:31
imo flexbox is the best thing to happen to web dev in the last 5 years
once you learn it, laying out things the way you want to is orders of magnitude easier