narbase / kunafa Goto Github PK

Hello, it seems to be a lot of fun to use kunafa, but I can’t run following get started, or even cloning kunafa-todo… please make sure the step is right or kunafa-todo will run successfully

Given

        horizontalLayout {
            style {
                height = 400.px
                width = 400.px
                justifyContent = JustifyContent.Center
            }

            verticalLayout {
                style {
                    width = matchParent
                    maxWidth = 280.px
                    height = 200.px
                    backgroundColor = Color.red
                }
            }
        }

The expected behavior is for the child view to be centered vertically inside the parent view. However, matchParent sets alignSelf to stretch and as such, the view will not be centered.
The current work around is to set width to 100.percent instead of matchParent.

Content tags are string tags. When the rules are turned into strings, they are not properly wrapped. This can be worked around by doing something like RuleSet.content = "'Content'". Otherwise, the css sent will look like content=Content, which is a badly formed rule and will be dropped.

There is no licence given. It would be nice if a licence is chosen for this project.

Hi. I'm currently trying to implement this framework by following your Hello Kunafa tutorial. I think I've been able to sync the gradle properly and build the project. But I don't see anything when I open the index.html file.
I've followed the instructions and modified the build.gradle and created index and app.kt. The build shows successful but I can't see anything when I open the html file.(I'm using gradle build, also tried gradle assembleWeb and gradle compileK2J). Is there anything else in the 'Hello Kunafa' tutorial that I need to do?

Is a bit shameful that modern framework writtern in high level language like Kotlin doesn't support compilation directly to wasm like C# Blazor does.

Please fix this misapprehension.

Is it possible with 0.2.4 to add a in button text? I'm trying to create animated buttons and this is required, but I cannot figure out how to do it.

Route does not work if it is directly inside page.

page {
        route("/") {
            verticalLayout {
                textView { text = "Root" }
            }
        }
    }

As a work around, you can wrap the route inside a view (or verticalLayout/horizontalLayout).

A solution might be to check if kunafa style is mounted or call it lazily otherwise.

If you have an /path/<some id>/ and I need it to redirect to /path/<some id>/dashboard , the redirect function redirects to /path/:id/dashboard instead of the actual id.

Expected behavior:

The redirect function should redirect to /path/<some id>/dashboard

I had trouble integrating kunafa into a build.gradle.kts (kotlin based) build using the examples in the docs, but managed to come up with the following:

plugins {
    id("kotlin2js")
}

dependencies {
    implementation(kotlin("stdlib-js"))
    implementation("com.narbase:kunafa:0.2.0-beta")

    testImplementation(kotlin("stdlib-js"))
}

tasks {
    compileKotlin2Js {
        kotlinOptions {
            outputFile = "${sourceSets.main.get().output.resourcesDir}/output.js"
            sourceMap = true
            // moduleKind = "plain"
        }
    }

    fun copyJar(outputDir: File, pattern: String) {
        val jar = configurations.compileClasspath.get().single {
            it.name.matches(Regex(pattern))
        }
        copy {
            includeEmptyDirs = false
            from(zipTree(jar))
            into(outputDir)
            include("**/*.js")
            exclude("META-INF/**")
        }
    }

    val unpackKotlinJsStdlib by registering {
        group = "build"
        description = "Unpack the Kotlin JavaScript standard library"
        val outputDir = file("$buildDir/$name")
        inputs.property("compileClasspath", configurations.compileClasspath.get())
        outputs.dir(outputDir)
        doLast {
            copyJar(outputDir, "kotlin-stdlib-js-.+\\.jar")
        }
    }

    val unpackKunafaLib by registering {
        group = "build"
        description = "Unpack the kunafa library"
        val outputDir = file("$buildDir/$name")
        inputs.property("compileClasspath", configurations.compileClasspath.get())
        outputs.dir(outputDir)
        doLast {
            copyJar(outputDir, "kunafa-.+\\.jar")
        }
    }

    val assembleWeb by registering(Copy::class) {
        group = "build"
        description = "Assemble the web application"
        includeEmptyDirs = false
        from(unpackKotlinJsStdlib)
        from(unpackKunafaLib)
        from(sourceSets.main.get().output) {
            exclude("**/*.kjsm")
        }
        into("$buildDir/web")
    }

    assemble {
        dependsOn(assembleWeb)
    }
}

Is it production ready? and is it still actively developed?

The latest release on maven central is 0.1.4 upload on the 24th while the latest release on GitHub is 0.1.3 upload on the 21st.

To observe a component lifecycle, currently you need to use its rootView

component.rootView?.bind(lifecycleObserver)

This however does not work if the root view is not yet created.
A better way is to allow the component to have a lifecycle observers that it can then pass to the root view when created.

I've just started using Kunafa, and struggling to find some concrete examples of usage.

The closest is the information in https://medium.com/the-kotlin-chronicle/kunafa-easy-to-use-high-level-framework-in-kotlin-for-front-end-web-development-ee5237aea5b but it doesn't link Component classes to a main, so I'm struggling to put them together. I'm sure it's obvious but I'm just missing it

I'd just like something fairly simple, so far I've created a simple Component class, as this:

class AppView: Component() {
    override fun View?.getView(): View {
        return horizontalLayout {
            textView {
                text = "Some text"
            }
        }
    }
}

but how do I use it?
So far this is all I've managed:

fun main(args: Array<String>) {
    page {
        AppView().addToParent(this)
    }
}

which feels less than optimal.

I'd also ask, where are the tests? This is a large-ish code base for what it does but I don't see any tests anywhere. They were the first things I looked for in trying to work out how to get this going.