ScalablyTyped/community

https://scalablytyped.org/docs/plugin

peterstorm

@peterstorm:matrix.org

When using reCharts, do I have to make classes for the type of objects in the Arrays you pass to the data attribute to charts?

It's keeping me from making generic components

Øyvind Raddum Berg

@oyvindberg

@edadma Great that you discovered the library plugin :) AFAIR I set it up so you're forced to pick a package other than typings, have you set https://scalablytyped.org/docs/conversion-options#stoutputpackage ? If so that's where you'll find the scala code. Also if you picked SourceGenMode.Manual you need to run the stImport task once

@peterstorm:matrix.org code example? Probably the answer that you dont have to, but it depends

Alexis Hernandez

@AlexITC

@edadma you can follow this as a example: https://github.com/wiringbits/sjs-material-ui-facade

Edward A. Maxedon, Sr.

@edadma

thanks @AlexITC

peterstorm

@peterstorm:matrix.org

[m]

@oyvindberg: I don't know if this will make much sense, but for example here: https://github.com/peterstorm/admin-ui/blob/main/src/main/scala/connect/ui/components/dashboard/Dashboard.scala
From my API I get a List[ReportResult] which itself, is a List[List[String] with headers in one list, and a a list with variying number of elements in the other - think like a database select.

I want to make something where I can just take a ReportResult and just map it into a graph, within having to map it into an intermediate class.

peterstorm

@peterstorm:matrix.org

[m]

Anyone know which version of material-lab is usable?

peterstorm

@peterstorm:matrix.org

[m]

Hmm, I want the DataGridcomponent, but seems it's not possible with the current supported version of MaterialUI?

elkhadirzyad

@elkhadirzyad

Hello @oyvindberg is there a library for pdf viewer in scalajs react ?

vonchav

@voonchav_gitlab

Hi @oyvindberg, any plan to support @material-ui v4.x?

Sören Brunk

@sbrunk

Hi, I have a fun project that’s using Scala 3, mostly for learning. I’d like to use st with it (with the external npm plugin because of snowpack). Out of the box it tries to download scala-compiler/3.0.0-M3 which fails. Is there a way to configure it to use the 2.13 compiler or should I be brave and try the dotty-support branch?

Øyvind Raddum Berg

@oyvindberg

@sbrunk I've had to make some major changes for scala 3, and it's not ready yet. I'll update the issue with more details, but there are small number of challenges left. What might work, meaning I havent tried, is to use the CLI tool to build jars, and add them to your sbt build with dotty compatibility

@voonchav_gitlab I havent had the time to invest into that still, unfortunately. I'll update ScalablyTyped/Converter#208 when that changes

Øyvind Raddum Berg

@oyvindberg

@peterstorm did you use the 3.x version? I can't check now, but there is probably a reason why it doesn't work. maybe it can be easily fixed, and maybe it will only be fixed with the mui 4 effort. you can always stub it ourself though

@peterstorm:matrix.org You can definitely avoid those classes if wanted, all the types extending js.Object are just a description of a Javascript object, and that's a convenient way to create them.

elkhadirzyad

@elkhadirzyad

@oyvindberg for pdf viewer is there a solution

Øyvind Raddum Berg

@oyvindberg

@elkhadirzyad you tell me. I have created a tool which lets you use Typescript libraries in Scala.js, I suggest you go look for Typescript (or Javascript with typings) library for rendering PDFs (ideally integrated with react), try if it works and report back :)

peterstorm

@peterstorm:matrix.org

[m]

I tried to use 3.x yeah, but I got weird errors when Node had to compile. Some of the dependencies weren't correct either, so that was probably why. I gave up :D

Øyvind Raddum Berg

@oyvindberg

@peterstorm:matrix.org aha, that's unfortunate. if you want to spend more time on it someday you can try to add it to the mui demo in the slinky demo repo, I'm fairly sure it has compiled fine at least before

Sören Brunk

@sbrunk

Thanks @oyvindberg. Using the CLI to build the 2.13 jars and then adding them as deps with dotty compat works like a charm. :)

Øyvind Raddum Berg

@oyvindberg

cool @sbrunk - the dotty people have really done a fantastic job at that :)

vonchav

@voonchav_gitlab

Hi @oyvindberg , could you clarify the setting of stReactEnableTreeShaking. The docs say "Enable this ... to prefer react components in long module paths..." and "The difference in bundle size can be remarkable, for instance the Slinky material-ui demo ended up one fifth of the original size." And in code, its default value is Selection.None.

I take that as it's recommended that we do not normally want to enable stReactEnableTreeShaking by setting it to anything other than Selection.None. Is that correct?

Øyvind Raddum Berg

@oyvindberg

@voonchav_gitlab Right, that description is very much written with Javascript developers in mind. So the thing is that often when working with JS libraries you start out just importing the most convenient things (short imports, from the "top" of the library). Then you finish working and want to release your stuff, you check your bundle size and you see that it has grown more than you'd like. At that point you'll make a pass over the codebase and see which imports causes all the bloat, and you'll rewrite those to longer, more specific imports

So stReactEnableTreeShaking is actually an amazing feature which does that whole pass for all ST react dependencies you use!

the downside is that it doesnt always work, and it's not possible to make it always work. That's why it's disabled by default

So I would recommend the same workflow when working with ST - you complete developing something and then try to flip the flag. For most libraries it should just work

note that you can actually do this manual pass in Scala.js as well, including with ST react components (they have a withComponent method or whatever I called it where you can supply an implementation imported from a more specific import)

vonchav

@voonchav_gitlab

Thanks Oyvind for the clarification. I didn't realize, by "short imports", it meant "wider" (less specific) imports. Now I get it - tree-shaking is important in cutting down the bundle size. I'll dig into the jars that ST generates and look for those withComponent imports. If you can give me an example import (for withComponent), that'd be great.

Øyvind Raddum Berg

@oyvindberg

Ah yeah, I'm not sure what the popular terms for this are, but more specific and more general may be better than short/long imports

I can dig up some code to to it manually and try to expand the documentation a bit, but do try stReactEnableTreeShaking first

vonchav

@voonchav_gitlab

Thanks again, Ovyind!

Jason Pickens

@steinybot

How should something like:

export interface SourceMapConsumerConstructor {
    prototype: SourceMapConsumer;

    new (rawSourceMap: RawSourceMap, sourceMapUrl?: SourceMapUrl): Promise<BasicSourceMapConsumer>;
    new (rawSourceMap: RawIndexMap, sourceMapUrl?: SourceMapUrl): Promise<IndexedSourceMapConsumer>;
    new (rawSourceMap: RawSourceMap | RawIndexMap | string, sourceMapUrl?: SourceMapUrl): Promise<BasicSourceMapConsumer | IndexedSourceMapConsumer>;
}

export const SourceMapConsumer: SourceMapConsumerConstructor;

be converted? It is being converted to:

@js.native
trait SourceMapConsumerConstructor
  extends Instantiable1[
      (/* rawSourceMap */ RawIndexMap) | (/* rawSourceMap */ RawSourceMap) | (/* rawSourceMap */ String), 
      js.Promise[BasicSourceMapConsumer | IndexedSourceMapConsumer]
    ]
     with Instantiable2[
      (/* rawSourceMap */ RawIndexMap) | (/* rawSourceMap */ RawSourceMap) | (/* rawSourceMap */ String), 
      /* sourceMapUrl */ SourceMapUrl, 
      js.Promise[BasicSourceMapConsumer | IndexedSourceMapConsumer]
    ] {
}

@JSImport("source-map", "SourceMapConsumer")
@js.native
object SourceMapConsumer extends TopLevel[SourceMapConsumerConstructor]

In TypeScript I could do:

new SourceMapConsumer(sourceMap)

Jason Pickens

@steinybot

Oh RTFM… SourceMapConsumer.newInstance1(json) should do it right?

Hmm too many implicit conversions needed. I have to help out a bit by doing: (SourceMapConsumer: SourceMapConsumerConstructor).newInstance1(json)

Øyvind Raddum Berg

@oyvindberg

yeah, or TopLevel has a .get or something on it instead of the type nudge

there might be a SourceMapConsumerCls next to it in the library

Jason Pickens

@steinybot

Oh yeah your right, there is SourceMapConsumerCls

Øyvind Raddum Berg

@oyvindberg

it's not so easy to discover unfortunately, should probably leave a comment on that object as well

it currently only has one constructor I think, when I finish beta30 it will have all - there's quite a few nice things coming

Jason Pickens

@steinybot

To be fair it is in the docs. I did just read it but didn’t go back to actually see if it was there.

Jason Pickens

@steinybot

I’ve probably asked this before and forgotten but is there a convenient way to go from Double | Null to Option[Double]?

Jason Pickens

@steinybot

Something like this:

  implicit def maybeNullToOption[A](maybeNull: A | Null): Option[A] = {
    Option(maybeNull).map(_.asInstanceOf)
  }

Why is there typings.std.Promise? Couldn’t it just use scala.scalajs.js.Promise?

Øyvind Raddum Berg

@oyvindberg

@steinybot yes, that's unfortunately the best we have for now. I have been waiting to see how Scala 3 ends up improving the situation (or not) before coming up with something better. I did start a draft attempt a long while ago which I could resurrect if Scala 3 doesnt make it much better ScalablyTyped/Runtime#1

@steinybot Does it cause any problems? I've had a lot of questions about that exact type

It's there because it's defined in Typescript std lib just like everything else available in TS

so newer versions of the converter will translate most (99%+) references to js.Promise, as long as they don't form part of inheritance (because that opens up a lot of problems for reliably generating code). There is also an edge case where references to std.Promise in overloaded methods won't be translated, because it might cause compilation to fail because different methods might end up with same erasure

Øyvind Raddum Berg

@oyvindberg

It's actually fairly complicated territory, with a lot of third party Promise types which may show up

Where communities thrive

People

Repo info

Activity