Luca
12/20/2022, 12:52 AMbod
12/20/2022, 10:30 AMLEGACY
and BOTH
are not marked with @Deprecated
on the 1.8 branch. Not a big deal, just wanted to mention it as it could be nicer to have the warning in the IDE when using it 🙂Robert Jaros
12/20/2022, 2:19 PMEdoardo Luppi
12/20/2022, 3:46 PMDerek Ellis
12/20/2022, 8:34 PMVictor Harlan Lacson
07/04/2020, 1:56 AMAnant Kumar Gupta
12/21/2022, 4:38 PMOla Adolfsson
12/22/2022, 7:59 AMExported declaration uses non-exportable parameter type
InteliJ identifies that some types aren’t annotated. Is there a way to use that information to automatically add the missing annotations (jsexport) to the rest of the classes.
Thanks OlaMike Dawson
12/22/2022, 1:09 PMMike Dawson
12/22/2022, 3:25 PM@file:JsModule("react-easy-sort")
@file:JsNonModule
package com.ustadmobile.view.components
import react.PropsWithChildren
import react.ReactNode
external interface SortableListProps: PropsWithChildren {
var onSortEnd: (oldIndex: Int, newIndex: Int) -> Unit
var draggedItemClassName: String?
var lockAxis: String?
var allowDrag: Boolean
}
external val SortableList: react.FC<SortableListProps>
//See <https://betterprogramming.pub/understanding-the-difference-between-named-and-default-exports-in-react-2d253ca9fc22>
external interface ItemProps: PropsWithChildren {
override var children: ReactNode?
}
external val SortableItem: react.FC<ItemProps>
If I use only SortableList or SortableItem, the components seem to be found as expected. When I try to use both together, I get an exception "You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.".
Is there a procedure that can allow making a wrapper for typescript where there is both a default export and named exports?Eugene Maksymenko
12/24/2022, 1:11 AMTaha Louetri
12/24/2022, 8:47 PMAraib
12/27/2022, 2:07 PMAraib
12/27/2022, 2:08 PMimplementation(npm("decentraland", ">3.12.3"))
Araib
12/27/2022, 2:09 PMkotlin("js") version 1.7.21
Cheick Kante
12/28/2022, 6:08 PM@file:JsModule("react-markdown")
@file:JsNonModule
package <http://components.blog|components.blog>
import react.ComponentClass
import react.Props
import react.PropsWithChildren
@JsName("default")
external val ReactMarkdown: ComponentClass<MarkdownProps>
external interface MarkdownProps : PropsWithChildren{
var remarkPlugins : Array<dynamic>
}
and my remark file looks like
@file:JsModule("remark-gfm")
@file:JsNonModule
package <http://components.blog|components.blog>
@JsName("default")
external val RemarkGfm: dynamic
and I hook them up as below, I get the rendered content however remark does not get applied.
ReactMarkdown {
remarkPlugins = arrayOf(RemarkGfm)
+content
}
hfhbd
12/29/2022, 3:25 PMbashor
12/30/2022, 1:18 AMVladas
12/30/2022, 11:38 AMRobert Jaros
12/30/2022, 11:41 AMCLOVIS
12/30/2022, 2:12 PMTypeError: this.templates0__1.create_8m8rgm_k$ is not a function
Has anyone experienced this before?Tim Lavers
12/30/2022, 9:47 PMformData.append("file", fileupload.files[0]);
The problem I have is that the equivalent FormData class in KotlinJS can have a org.w3c.files.Blob attached to it, of which org.w3c.files.File is a subclass, however, the selection event returns a web.file.File object.
How can I turn the web.file.File into an org.w3c.files.File so that I can attach it and post it?
ThanksRobert Jaros
12/30/2022, 10:37 PMkotlinx.coroutines
library.
• Support for returning Result<T>
from fullstack remote methods.
• Add new `Upload`/`UploadInput` components based on browser file input API.
• New `Numeric`/`NumericInput` and `ImaskNumeric`/`ImaskNumericInput` components for handling decimal numbers.
• New kvision-ballast
and kvision-routing-ballast
modules integrating with Ballast state management framework.
For more details about this release see the changelog https://github.com/rjaros/kvision/releases/tag/6.0.0 and the dedicated migration guide https://kvision.gitbook.io/kvision-guide/migration/migration-from-5.x-to-6.x
As always, any feedback is appreciated! 🙂
Posted in #feedSam Gammon
01/01/2023, 2:52 AMnative-image
is supported out of the box.
• 🚀 Trying it out
curl -sSL --tlsv1.2 dl.elide.dev/cli/install.sh | bash -s -
👆 the one liner works on Darwin (amd64/arm64), and Linux (amd64) so far.If you prefer NPX:
npx @elide-dev/elide@alpha shell
K Building Kotlin apps with it
•
Elide can be used as a plain library with a regular Micronaut server, and Ktor support is on the way. There are Maven artifacts in a custom repository which is easy to use during the alpha; you can see a sample here.
• G Gradle plugin
You can easily install the Gradle plugin to build your frontend assets and your Kotlin/JS, and package it into your server binary. It will handle building for SSR and CSR both, so you can easily switch between browser rendering modes. Check it out here. Maven and Bazel support are planned.
• 🖥️ Using the shell
elide shell
drops you into a shell just like Node (see attached screenshot), the difference being the URL
class we're using here is implemented in Kotlin, backed by the road-tested power of Micronaut, KotlinX, Netty, and the Java standard library. It has simply been adapted for use in JavaScript, according to the WhatWG URL Spec.
• js Use Kotlin/JS or regular Node stack
Elide packages and consumes your JS/TS with built-in support for esbuild
, so you can use a standard Node toolchain or the Kotlin/JS stack.
• 💨 Super fast React SSR
Because Elide is basically Kotlin with a super-fast JS runtime attached, it can do JS SSR without leaving the JVM. This can soon be drop-in compatible with many React apps. You can see a live sample here to confirm it is fast and server-rendered. The code for that sample is pasted below to show how simple it is to call back and forth between Kotlin and your React app:
@Page class Index : PageWithProps<YourProps>(YourProps.serializer()) {
// Serve React SSR.
@Get("/") suspend fun indexPage(request: HttpRequest<*>) = ssr(request) { // 1: tell the server we're going to do SSR for this request
head {
title { +"Hello, Elide!" }
stylesheet("/styles/base.css")
stylesheet("/styles/main.css")
script("/scripts/ui.js", defer = true) // <-- 2: serve the CSR bundle so it can hydrate the react SSR response
}
body {
injectSSR(this@Index, request) // <-- 3: execute the JS VM to produce the SSR response, and splice it into the server response
}
}
}
• 🐙 Contributors needed
The future of software is much more polyglot than today's paradigm: developers love to fight about frameworks, but at the end of the day, we're all writing code, and eliminating barriers between languages means easier collaboration and more value for all of us. It shouldn't be a Node vs. The World or a Rust vs. The World argument; we should get to pick and pull the best code we want from anywhere and use it to build our apps, especially from a multi-platform language like Kotlin.
This runtime and framework are designed for that future. *If you agree, join us and make a dent in the universe*; you'll have a chance to be impactful and shape a brave new idea from the ground up.
• 🙏 Thank you
We chose Kotlin because of the fantastic community. 2023 will be a massive year for Kotlin, and we think that betting the farm on it is reasonable and smart. We are super excited about what JetBrains and Kotlin have in store for us with K2, context receivers, value classes... just so much to look forward to.
Cheers and happy new year, Kotlin devs,
K sam
Posted in #feedspierce7
01/02/2023, 1:39 AMJuanoterocas
01/02/2023, 4:51 PMwillyrs
01/02/2023, 6:35 PMShubhasai Mohapatra
01/02/2023, 2:53 PM<div>
<canvas id="ComposeTarget" width="600" height="600"></canvas>
</div>
to full screenAnant Kumar Gupta
01/03/2023, 3:35 AMJoe
01/03/2023, 4:13 PM@JsName
with name "default" for all component declarations?
For example there are two components from `kotlin-mui`: Tab and Button. They both have @JsName("default")
.
Why do we need to mark these declarations with the annotation and the name?