by

Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
  • Aug 09 21:47

    oyvindberg on react-tree-shaking

    Implement stReactEnableTreeShak… (compare)

  • Aug 09 20:59

    oyvindberg on react-tree-shaking

    Implement stReactEnableTreeShak… (compare)

  • Aug 09 20:59

    oyvindberg on master

    fix overflow error in SplitMeth… (compare)

  • Aug 09 20:47

    oyvindberg on react-tree-shaking

    fix overflow error in SplitMeth… Implement stReactEnableTreeShak… (compare)

  • Aug 04 22:13

    oyvindberg on v1.0.0-beta23

    (compare)

  • Aug 04 21:27

    oyvindberg on master

    Tweak bootstrap so the check fo… (compare)

  • Aug 04 18:25

    oyvindberg on react-fixes

    (compare)

  • Aug 04 18:25

    oyvindberg on master

    Tweak component selection heuri… Fix import for nested component… More properly handle MemoExotic… and 1 more (compare)

  • Aug 04 18:22

    oyvindberg on react-fixes

    Tweak component selection heuri… Fix import for nested component… More properly handle MemoExotic… (compare)

  • Aug 04 18:22

    oyvindberg on master

    Tweak logging Tweak CastConversion to ignore … (compare)

  • Aug 03 23:08

    oyvindberg on react-fixes

    Tweak logging Tweak component selection heuri… Nullary apply methods for react… and 2 more (compare)

  • Aug 02 20:48

    oyvindberg on gh-pages

    Deploy website Deploy website … (compare)

  • Aug 02 20:25

    oyvindberg on v1.0.0-beta22

    (compare)

  • Aug 02 20:06

    oyvindberg on use-module-in-package-json

    (compare)

  • Aug 02 20:06

    oyvindberg on master

    CI: Give priority to libraries … Fix #185 by heeding `module` in… intellij wants to update run fi… and 2 more (compare)

  • Aug 02 20:02

    oyvindberg on use-module-in-package-json

    CI: Give priority to libraries … Fix #185 by heeding `module` in… intellij wants to update run fi… and 1 more (compare)

  • Aug 02 19:26

    oyvindberg on react-nested-components

    (compare)

  • Aug 02 19:26

    oyvindberg on master

    Nested react components Merge pull request #187 from Sc… (compare)

  • Aug 02 19:25

    oyvindberg on use-module-in-package-json

    Fix #185 by heeding `module` in… intellij wants to update run fi… Introduce a bootstrap step. - … (compare)

  • Aug 02 14:53

    oyvindberg on react-nested-components

    Nested react components (compare)

Øyvind Raddum Berg
@oyvindberg
@an-tex true, I havent ported generation of scalajs-react components yet
I'm pretty sure there is some design work to be done there first
trepidacious
@trepidacious
@oyvindberg That makes sense, I'm still surprised by how much odd stuff you can do in Typescript, and that definitely counts as odd stuff for me :) In general the Victory stuff works really well so far, the builder interface is definitely a substantial improvement.
Øyvind Raddum Berg
@oyvindberg
Definitely! They're mapping all of css to handle functions, it's honestly pretty mind-blowing
and that's great to hear, it was definitely my experience that it helped a lot as well
trepidacious
@trepidacious
At this point the biggest problem for some libraries is the lack of typescript definitions - I was hoping to use react-vis, but the definitions seem to be incomplete or old, it's a shame to see good projects not making the jump to types
They don't even seem to run react-docgen, so I can't fall back to generating code from that
Øyvind Raddum Berg
@oyvindberg
It's a good indicator of project health I think, I wouldn't adopt a library without types now
Check out the nivo demo I added to the slinky demos yesterday, that library looks really really good
Andreas Gabor
@an-tex
Ok cool, let me know if I can be of any help. Those parameter popups drive me nuts haha
trepidacious
@trepidacious
@oyvindberg Ah nice, I'll have a look at that, I did consider nivo, and it certainly looks attractive, but it's missing some weirdly basic features like zooming :(
I basically need "scientific" graphs, so a lot of the graphing libraries are coming at things from a different angle
trepidacious
@trepidacious
Just been playing with Nivo, yes that is a very very nice looking graph library, to the extent I'm thinking it would be worth trying to work out how to add zooming to it :)
Robert Walker
@olofwalker

Hi, I just ran into an issue with setter/getters that maybe someone else has seen.

The following typescript code:

public get minEmitBox(): Vector3 {
        if ((<BoxParticleEmitter>this.particleEmitterType).minEmitBox) {
            return (<BoxParticleEmitter>this.particleEmitterType).minEmitBox;
        }

        return Vector3.Zero();
    }

    public set minEmitBox(value: Vector3) {
        if ((<BoxParticleEmitter>this.particleEmitterType).minEmitBox) {
            (<BoxParticleEmitter>this.particleEmitterType).minEmitBox = value;
        }
    }

gets converted into

  def minEmitBox: Vector3 = js.native
    def minEmitBox(value: Vector3): js.Any = js.native

Should not the signature of a setter be def minEmitBox_=(value: Vector3): Unit ?

When calling the setter method, I get particleSystem.minEmitBox is not a function..

Øyvind Raddum Berg
@oyvindberg
@an-tex there is actually, I need someone to sketch a design for a scalajs-react builder, much like https://github.com/ScalablyTyped/SlinkyTyped/blob/master/r/react/src/main/scala/typingsSlinky/StBuildingComponent.scala . I'll create an issue to track it soon
@trepidacious I'm not so familiar with graphing libraries, but there are many, I would be quite surprised if there wasn't a good library with types. Did you get anywhere with hacking on it?
@olofwalker that's a bug I'm sure. When I worked on it all setters and getters were gone from the generated .d.ts files after typescript compilation. I guess that has changed lately
Robert Walker
@olofwalker
@oyvindberg cool, Also noted that beta18 generates no arguments allowed for nullary method for apply methods that have default values for all parameters when you try to create an object and supply a named value, ex. val r = typings.babylonjs.anon.RadiusX(subdivisions = 10) , beta17 does not, not sure why.
@oyvindberg Is that a bug with the plugin or somewhere else? if it is for the plugin, I can create an issue to track it...
Øyvind Raddum Berg
@oyvindberg
The syntax for creating objects have changed in beta18, I'll try to write some better docs but check the release notes. You probably want RadiusX().setSubdivisions() now
Robert Walker
@olofwalker
@oyvindberg Thanks!!
trepidacious
@trepidacious
@oyvindberg I did actually, with some tweaks to clipping Nivo seems to do zooming by changing scale pretty well, and overlays look like they could do the display part of drawing a box, so I just need to have a look at mouse events and tie it together.
@oyvindberg so far it’s been nice to work with, and the code seems well organised.
Roberto Leibman
@rleibman
How would you use this library with scalajs-react? https://joshwcomeau.com/react/announcing-use-sound-react-hook/
Øyvind Raddum Berg
@oyvindberg
@rleibman I haven't used scalajs-react since before hooks, so I'm not sure. It should be easy though, as long as you're in a functional component you just call the function
Roberto Leibman
@rleibman
Right, but the function doesn't return callback... I guess I can just wrap it in a callback.
Øyvind Raddum Berg
@oyvindberg
Well yeah, that's going to be manual. As far as I know there isn't a way to recognize a function as being a hook, so there isn't really any codegen we can do for it
Roberto Leibman
@rleibman
I ended up using ReactSound instead ,that's working so far.
Roberto Leibman
@rleibman

Mhh.. ReactSound is forcing a render of things I don't want rendered as it changes... (siblings) these re-renders cause traffic between client and server which I don't want. So I tried using the use-sound react hook this way:

    def playSound(soundUrlOpt: Option[String]): Callback = {
      soundUrlOpt.fold(Callback.empty) { url =>
        Callback { typings.useSound.mod.default(url) }
      }
}

But I get a react error:
Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component.

Øyvind Raddum Berg
@oyvindberg
read the hooks docs, you cant use them conditionally. this is what you get when js developers make things... convenient. also remember to use a functional component
Roberto Leibman
@rleibman
If I can figure it out (which I don't know exactly what you mean by either conditionally, or functional component), I'm gathering that I'll end up in the same problem that I have with the re-render. Let me move the question to the scalajs-react channel, since it's really not directly related to ScalablyTyped.
Roberto Leibman
@rleibman
Though of course, I welcome your answer.
Øyvind Raddum Berg
@oyvindberg
@rleibman functional component as in ScalaFnComponent in scalajs-react, and not conditional as in you only run it in one branch of the fold
Øyvind Raddum Berg
@oyvindberg
builders are finally coming to scalajs-react ScalablyTyped/Converter#177 :D
Roberto Leibman
@rleibman
Thank you! I know they'll make a lot of work for me :)
Andreas Gabor
@an-tex
yey!!
Andreas Gabor
@an-tex
i'll give it a shot in my reference project later on
Øyvind Raddum Berg
@oyvindberg
ported most of the demos as well, https://github.com/ScalablyTyped/ScalaJsReactDemos
some rough edges still, but it mostly works
Andreas Gabor
@an-tex
looks really neat! odd i'm getting that stImport errors. i'll try it in a different project
Andreas Gabor
@an-tex
yea same issue there
Øyvind Raddum Berg
@oyvindberg
if anybody else is tired of working with DOM elements in scalajs-react and slinky I'm now adding builders for react intrinsics (a, div and so on) as well :star: ScalablyTyped/Converter#179
Andreas Gabor
@an-tex
so sth like <.div.onClick(...).id(...).onFocus(...) ?
couldnt quite figure it out through the huge diff :o
Øyvind Raddum Berg
@oyvindberg
Yep, like this:
  import typings.react.{components => react}

  case class State(selectedIdx: Option[Int])

  val SlickTest =
    ScalaFnComponent[Seq[String]] { images =>
      val js.Tuple2(state, setState) = useState(State(None))

      def myOnClick(idx: Int) =
        Callback.info(s"clicked image $idx") >> Callback(setState(State(Some(idx))))

      val renderedImages: Seq[VdomElement] =
        images.zipWithIndex.map {
          case (source, idx) => react.img.withKey(idx).src(source).onClick(_ => myOnClick(idx))
        }

      val square = CSSProperties().setPosition(PositionProperty.relative).setLeft("200px").setWidth(500).setHeight(500)

      react.div.style(square)(
        react.label.style(CSSProperties().setColor("blue"))(
          s"Selected image index: ${state.selectedIdx.fold("none")(_.toString)}"
        ),
        ReactSlick
          .onInit(Callback.info("slick init"))
          .dots(true)
          .autoplay(true)
          .autoplaySpeed(1000)
          .slidesToShow(2)(renderedImages: _*)
      )
    }
not an implicit in sight, perfect IDE help, no weird symbols, all strongly typed, minimal generated javascript. I think it's really a big improvement
Øyvind Raddum Berg
@oyvindberg
ported the react-native demo to scalajs-react https://github.com/ScalablyTyped/ScalaJsReactDemos/tree/master/react-native/src/main/scala/hello/world - I think the experience of working with that is now just as good as for slinky
Roberto Leibman
@rleibman
Thank you!
elkhadirzyad
@elkhadirzyad
image.png