This release saw a focus on fixing some issues with Kobweb's backend code, but radial gradients / CSS position support is also a potentially useful feature.

Frontend

• Added support for radial gradients. (See below)
• Added a CSSPosition for providing a Kotlin-idiomatic way for declaring a CSS position data type
  • (This should not be confused with the CSS position property, used for making elements relative, absolute, fixed, etc.)
• Fixed an internal issue that was causing Router.navigateTo to not work with custom open link strategies.

Backend

• Improved error reporting message by including "caused by" chain if your server route crashes in dev mode.
• Stop stripping reflection support from the server jar (this was happening unintentionally by a minimize build step).
  • There are many libraries a user might use in their Kobweb server code which use reflection under the hood, such as database libraries like KMongo.

Gradle

• Fix exception that could get thrown if you included an npm dependency in your JS dependencies block.
  • Previously, code assumed that a runtime dependency would either be a folder or a jar, based on tons of existing Gradle samples out in the wild. However, in JS, dependencies can be JS files apparently, which triggered an exception in Kobweb Gradle code.
• Fixed an issue with Kobweb library resources not being discovered correctly when building on Windows machines.
  • Backslash path issues strike again...

Radial Gradients

The following code demonstrates Kobweb implementations for examples taken from the official docs:

// Example 1: Planet
val darkGray = Color.rgb(0x333333)
val lightGray = Color.rgb(0xeeeeee)
Box(
    Modifier.width(333.px).height(268.px)
        .backgroundImage(
            radialGradient(Circle, CSSPosition(x = 100.percent)) {
                add(darkGray, 0.percent, 50.percent)
                add(lightGray, 75.percent)
                add(darkGray, 75.percent)
            }
        )
)

// Example 2: Overlapping gradients
Box(
    Modifier.width(333.px).height(268.px)
        .background(
            CSSBackground(
                image = BackgroundImage.of(
                    radialGradient(
                        Ellipse,
                        Color.rgb(0xe66465),
                        Colors.Transparent,
                        CSSPosition.Top
                    )
                )
            ),
            CSSBackground(
                image = BackgroundImage.of(
                    radialGradient(
                        Ellipse,
                        Color.rgb(0x4d9f0c),
                        Colors.Transparent,
                        CSSPosition.Bottom
                    )
                )
            ),
        )
)