Everything about Slinky -- issues, ideas for features, where it's being used, and more
I don't know if this is a Slinky or ScalablyTyped question but I tried to get React Monaco Editor component to work and yes it works but I have to construct it with "ReactMonacoEditor.withProps(MonacoEditorProps().set("height", "500").set("width", "500"))"
Why? Is there a more normal way to construct it?
I made demo project here https://github.com/PhilAndrew/ReactSlinkyScalablyTyped
With the file of that code here https://github.com/PhilAndrew/ReactSlinkyScalablyTyped/blob/master/react-leaflet/src/main/scala/demo/App.scala
[warn] Note: Unresolved dependencies path:
[error] stack trace is suppressed; run 'last update' for the full output
[error] (update) sbt.librarymanagement.ResolveException: Error downloading me.shadaj:slinky-styled-components_sjs1_2.13:0.1.0
[error] Not found
[error] Not found
[error] not found: C:\Users\phn\.ivy2\local\me.shadaj\slinky-styled-components_sjs1_2.13\0.1.0\ivys\ivy.xml
[error] not found: https://repo1.maven.org/maven2/me/shadaj/slinky-styled-components_sjs1_2.13/0.1.0/slinky-styled-components_sjs1_2.13-0.1.0.pom
[error] Total time: 1 s, completed 07-10-2020 16:58:47
package hello.world
import slinky.core.ExternalComponentWithRefType
import slinky.core.annotations.react
import scala.scalajs.js
import scala.scalajs.js.annotation.JSImport
@js.native
trait RichEditorInstance extends js.Object {
}
@react object RichEditor extends ExternalComponentWithRefType[RichEditorInstance] {
case class Props(style: js.UndefOr[js.Object] = js.undefined)
@js.native
@JSImport("react-native", "RichEditor")
object Component extends js.Object
override val component = Component
}
7 replies
I have
@JSImport("./assets/images/fish.png", JSImport.Default) @js.native object Fish extends js.Object
I am going back to this question by @msinton , since I am currently stuck on the same... In React Native, where do you place a local image in order for it to be found by the @JSImport?
Hi all, I'm sure I'm missing something really obvious here. I'm trying to add a checkbox like so:
input(`type` := "checkbox", id := thing, name := thing),
label(`for` := thing, thing)but of course for does not exist. Perhaps I don't need the label, but I'd like to understand how to define one. Thanks!
module.exports = {
module: {
rules: [
{ test: new RegExp("\\.css$"), use: ["style-loader", "css-loader"] },
{ test: new RegExp("\\.(svg|png|jpg|gif)$"), use: "file-loader" }
]
}
}I'm quite new to JS app dev generally so please feel free to spell out the obvious to me!
small bug in documentation ( https://slinky.dev/docs/the-tag-api/ )?
input(onChange := (event) => {
println("the value of this input element was changed!")
})does not work - this works:
input(onChange := (event => {
println(s"the value of this input element was changed!")
}))Only difference are the parentheses.
onKeyPress working? Looks like it never gets called.https://scalafiddle.io/sf/qJcjX5e/18 (couldn't make it work locally either)
If you change your element to input, it works fine (unless the element has focus, it won't receive any key events):
input(
onClick:= (_ => println(s"MOUSE")),
onKeyPress:= (_ => println(s"KEYBOARD"))
)Also, onKeyPress is deprecated (but works), so you should be using onKeyDown (https://developer.mozilla.org/en-US/docs/Web/API/Document/keypress_event)