Hey guys! How do you test your kvision components visually? I mean, how do you preview what you're creating instead of altering your

main

method to include only the said component?

good morning - I'd like to use the Kvision maps module, but I think it needs some work and documentation. I'm keen to do this, and I'm getting started on writing some tests. I feel a bit limited by the plain kotlin-test lib though. Would introducing Kotest be acceptable? (for assertions - the test-engine only works on JS IR, not legacy)

Hi all, anybody interested in a d3 module?

I seem to have an issue with

tabPanel

as it inserts a

div

to contain each of the tab’s contents. My purpose is to have a tabbed UI that matches the browser window size, by using

height = 100.pc

Said

div

seems to break this discipline by allowing the contained element to grow in an unbounded fashion. I believe this would be solvable if, somehow, we would be able to style it. Any help? TIA!

Is there any “data grid”-type component that we can readily use with KVision?

How do I add a Polyline to the Map object? The library supports the

PolylineOptions

class, but there is no apparent method to create a polyline object. Do I need to extend the existing code?

I've marked the kvision-maps PR as ready-for-review :) https://github.com/rjaros/kvision/pull/327 (@João Paulo Figueira ping! In case you want to take a look)

What is the proper way to say, return a userlist page using ktor with Kvision? I've been following along the ktor example but am unsure of how to apply the route.

fun Application.main() {
    install(Compression)
    routing {
        applyRoutes(PingServiceManager)
        get("/userlist") {
            call.respondHtml(HttpStatusCode.OK) {
                // send back my KVision UserPage class
            }
        }
    }
    kvisionInit()
}

I have the same file structure as the example (backendMain, commonMain, frontendMain). I'm simply unsure how to approach this. Should I create an

IUserListService

in

commonMain

with a

getUserListPage()

function, implement it in

backendMain

and then call it from somewhere in

frontendMain

? And add

applyRoutes(UserListServiceManager)

to the ktor configuration? Assume I have a

UserPage : SimplePanel()

class in the front end, also I see from the documentation that KVision Services' cannot return SimplePanel as a type... I'm not sure how I should be doing this...

Having looked through some more examples, am I correct in stating that KVision is used for creating single page applications, and is used with JS-Routing to create the impression of a multi-paged website with the tabPanel and stackPanel?

I have two KVision applications using Tabulator. I have just upgraded both apps to Kvision 5.7.1. The legacy compiler is used. One application works as expected. But, in the other there is a problem with the tabulator rows. When the table is initially displayed the “tabulator-row” is much to high, much higher than the cells in the row. It means that only the first row is visible. If the user scroll the table the row immediately resize correctly and the full table is visible. Any idea what I can to do to fix this?

Hi! I try KVision. It looks like I can build web application and Electron application on single code base. I downloaded

kvision-examples

and tried

template-electron

. If I run task

runApp

it is absolutely OK and the app works. But if I run task

browserRun

the application starts on local port 3000, but app is not working, in browser's console I see error:

require is not defined

. See screenshot. I don't modify code of example, it is my first checkpoint: run web variant and desktop variant of the app. Could you help me?

Is there a gradle task I can use to just generate the kvision rpc classes?

Is it possible to register serializer modules with kvision rpc?

I try to set a filter on a Tabulator table:

fun filterByState(state: EventState) {
    console.log("[ELT.filterByState]")
    console.log(tabulator)
    tabulator.jsTabulator?.setFilter("State", "=", state.name)
}

tabulator looks as expected and it's element jsTabulator seems to be set, but when I try to access or log it, it is null. I'm puzzled (and still at KVision 5.5.1).

I am using client-side routing. When I'm on a page like

<https://host/foo/bar>

Kvision RPCs go to

<https://host/foo/bar/kv/>...

instead of

<https://host/kv/>...

. Is there a way to configure kvision to use

/kv

(absolute) path rather than

kv

(relative)? Setting

<base href="/">

works but feels like overkill.

I try to embed https://github.com/data2viz (a d3 port to kotlin).

Hello! I seem to not be able to find the answer to my question myself so i’ll try here: I would like to use a Popover but with different show/hide timings, is this something that is doable in Kvision? We have the delay but this applies to both show/hide:

button("A button") {
    enablePopover(PopoverOptions(
        title = "This is a <b>rich</b> popover title",
        content = "This is a <b>rich</b> popover content",
        rich = true,
        delay = 1000,   <-------
        placement = Placement.BOTTOM,
        triggers = listOf(Trigger.CLICK)
    ))
}

Or can this be achieved with something like:

onEvent {
  mouseover = {
    self.showPopover()
    <some sort of delay here>
    self.hidePopover()
  }
}

@Robert Jaros Thoughts on making

ServiceException

open so that the client can act based on sub-classes of it?

I have a weird error in forms. When I have a text form field, set the focus in it (click) and then press enter it tries to submit the form and reload the page and url is changed from

<http://localhost:3000/#/myroute>

to

<http://localhost:3000/?#/myroute>

Have you seen it?

Currently if a KVService is deleted, you end up with compile errors because the corresponding generated classes are not removed. Is there a way to have the compiler remove these? Gradle output tracking?

Random question and not a request to deliver. The choice of DI was Guice, Is there a reason why this was chosen over other DI frameworks, such as something more Kotlin first like Kodein-DI? I have found Guice to be a steep learning curve and requires way more boilerplate for the same goals. I can use Kodein via JSR-330 support with limitations (plus I don't want to kill the kittens the docs warns about), but I believe may prevent its use anyway.

Are the current API doc generated via Gradle, or via the Dokka fat jar? I am seeing a lot of

ERROR CLASS

items in unexpected places. Primary examples is under the JS

KVRemoteAgent

class parameters For

KVServiceMgr<T>

parameter, and for

RequestInit

under the

(RequestInit.() -> Unit)?

parameter Both area pretty unexpected, given one comes from the common source of the same module, then the other from stdlib I initially suspected https://github.com/Kotlin/dokka/issues/503 But I am not entirely sure it fits

HI! I want to display a sort indicator icon next to the table header’s column name. Is there a documented way to do this?

Hi. I got a strange problem related to Tabulator 5 (I think). When I display a tabulator table using the dev server everything works as expected. But, if I build a distribution and make the files available through my own web server only the tabulator header is shown. Then I get the following error in the console:

main.bundle.js:2 Uncaught TypeError: Cannot read properties of undefined (reading 'length')
    at sa (main.bundle.js:2:1720204)
    at new ii (main.bundle.js:2:2579880)
    at hx (main.bundle.js:2:2370990)
    at Rx.toKotlinObj_t5tk2r$ (main.bundle.js:2:2399627)
    at tn.toKotlinObjTabulator_e9s2f4$ (main.bundle.js:2:2554636)
    at tn.fixData_giv383$ (main.bundle.js:2:2554164)
    at Fe.<anonymous> (main.bundle.js:2:2543681)
    at main.bundle.js:2:1366879
    at Array.forEach (<anonymous>)
    at Te._dispatch (main.bundle.js:2:1366854)
sa @ main.bundle.js:2
ii @ main.bundle.js:2
hx @ main.bundle.js:2
Rx.toKotlinObj_t5tk2r$ @ main.bundle.js:2
tn.toKotlinObjTabulator_e9s2f4$ @ main.bundle.js:2
tn.fixData_giv383$ @ main.bundle.js:2
(anonymous) @ main.bundle.js:2
(anonymous) @ main.bundle.js:2
_dispatch @ main.bundle.js:2
dispatchExternal @ main.bundle.js:2
load @ main.bundle.js:2
_loadInitialData @ main.bundle.js:2
_create @ main.bundle.js:2
(anonymous) @ main.bundle.js:2
setTimeout (async)
Re @ main.bundle.js:2
Fe @ main.bundle.js:2
hx @ main.bundle.js:2
tn.createJsTabulator @ main.bundle.js:2
tn.afterInsert_77isfd$ @ main.bundle.js:2
(anonymous) @ main.bundle.js:2
(anonymous) @ main.bundle.js:2
Le.patch_6ju63b$ @ main.bundle.js:2
Tw.reRender_8be2vx$ @ main.bundle.js:2
Tw.singleRender_klfg04$ @ main.bundle.js:2
(anonymous) @ main.bundle.js:2
setTimeout (async)
Tw.singleRenderAsync_o14v8n$ @ main.bundle.js:2
kp.singleRenderAsync_o14v8n$ @ main.bundle.js:2
(anonymous) @ main.bundle.js:2
(anonymous) @ main.bundle.js:2
(anonymous) @ main.bundle.js:2
(anonymous) @ main.bundle.js:2
(anonymous) @ main.bundle.js:2
g.dispatch_dtrwrh$ @ main.bundle.js:2
an.domdbLoadingComplete @ main.bundle.js:2
Gn @ main.bundle.js:2
o.onload @ main.bundle.js:2
load (async)
en @ main.bundle.js:2
Kn @ main.bundle.js:2
an.initialize @ main.bundle.js:2
Kt.start @ main.bundle.js:2
Te.start_x7u0o8$ @ main.bundle.js:2
a @ main.bundle.js:2
(anonymous) @ main.bundle.js:2
main.bundle.js:2 redraw failed - table not yet initialized. Please wait for the `tableBuilt` event before calling this function.
redraw @ main.bundle.js:2
(anonymous) @ main.bundle.js:2

redraw failed - table not yet initialized. Please wait for the `tableBuilt` event before calling this function.
redraw @ main.bundle.js:2
(anonymous) @ main.bundle.js:2

I guess it can be related to https://github.com/olifolkerd/tabulator/issues/3407, but I do not use setData() in my code. Still using the legacy compiler. Any ideas?

I’m looking for a frontend component that allows message-passing between modules but in a decoupled fashion (pub/sub model). Does KVision implement this? If not, are there known alternatives (before I roll my own)? Thanks!

My gradle build is fine, but in intellij what is defined in sourceSets["main"].dependencies {} does not show up under External Libraries. Is there a recommended way to sync?

Can I pass a multiline string to js()?

@Jörg Rade I don't really understand your question in https://github.com/rjaros/kvision/issues/358

Hi! Is there any supported pattern (like MVVM) for kvision?