Move to external RingUI implementation. wrappers-bom

build.gradle.kts

@@ -1,14 +1,14 @@
 plugins {
     id("ru.mipt.npm.gradle.project")
-    kotlin("multiplatform") apply false
+
-    kotlin("jvm") apply false
+    //Override kotlin version
-    kotlin("js") apply false
+//    val kotlinVersion = "1.5.20-RC"
-    kotlin("jupyter.api") apply false
+//    kotlin("multiplatform") version(kotlinVersion) apply false
-    id("ru.mipt.npm.gradle.js") apply false
+//    kotlin("jvm") version(kotlinVersion) apply false
+//    kotlin("js") version(kotlinVersion) apply false
 }
 
-val dataforgeVersion by extra("0.4.2")
+val dataforgeVersion by extra("0.4.3")
-val kotlinWrappersVersion by extra("pre.206-kotlin-1.5.10")
 val fxVersion by extra("11")
 
 allprojects {
@@ -17,10 +17,11 @@ allprojects {
         jcenter()
         maven("https://repo.kotlin.link")
         maven("https://maven.jzy3d.org/releases")
+        maven("https://maven.pkg.jetbrains.space/mipt-npm/p/mipt-npm/maven")
     }
 
     group = "space.kscience"
-    version = "0.2.0-dev-19"
+    version = "0.2.0-dev-20"
 }
 
 subprojects {

demo/gdml/build.gradle.kts

@@ -38,7 +38,6 @@ kotlin {
         }
         jsMain {
             dependencies {
-                implementation(project(":ui:bootstrap"))
                 implementation(project(":ui:ring"))
                 implementation(project(":visionforge-threejs"))
                 implementation(npm("react-file-drop", "3.0.6"))

demo/gdml/webpack.config.d/02.boostrap.js

@@ -1,7 +0,0 @@
-config.module.rules.push({
-    test: /\.css$/,
-    include: [
-        require.resolve('bootstrap/dist/css/bootstrap.min.css')
-    ],
-    use: ['style-loader', 'css-loader']
-});

demo/solid-showcase/build.gradle.kts

@@ -13,15 +13,11 @@ kscience {
     application()
 }
 
-val kotlinWrappersVersion: String by rootProject.extra
-
 kotlin {
 
     jvm {
-        afterEvaluate {
         withJava()
     }
-    }
 
     sourceSets {
         commonMain {

gradle.properties

@@ -1,10 +1,7 @@
 kotlin.code.style=official
-
 kotlin.mpp.enableGranularSourceSetsMetadata=true
 kotlin.mpp.stability.nowarn=true
-
 kotlin.native.enableDependencyPropagation=false
-kotlin.parallel.tasks.in.project=true
 
 org.gradle.jvmargs=-XX:MaxMetaspaceSize=1G
 org.gradle.parallel=true

jupyter/visionforge-gdml-jupyter/build.gradle.kts

@@ -1,6 +1,5 @@
 plugins {
     id("ru.mipt.npm.gradle.mpp")
-    kotlin("jupyter.api")
 }
 
 description = "Jupyter api artifact for GDML rendering"
@@ -41,7 +40,6 @@ kotlin{
         jvmMain{
             dependencies {
                 implementation(project(":visionforge-gdml"))
-                implementation(kotlin("script-runtime"))
             }
         }
         jsMain {
@@ -54,6 +52,10 @@ kotlin{
     }
 }
 
+kscience{
+    useJupyter()
+}
+
 readme{
     maturity = ru.mipt.npm.gradle.Maturity.EXPERIMENTAL
 }

settings.gradle.kts

@@ -1,6 +1,6 @@
 pluginManagement {
-    val kotlinVersion = "1.5.10"
+
-    val toolsVersion = "0.9.10"
+    val toolsVersion = "0.10.0"
 
     repositories {
         maven("https://repo.kotlin.link")
@@ -13,10 +13,6 @@ pluginManagement {
         id("ru.mipt.npm.gradle.mpp") version toolsVersion
         id("ru.mipt.npm.gradle.jvm") version toolsVersion
         id("ru.mipt.npm.gradle.js") version toolsVersion
-        kotlin("multiplatform") version kotlinVersion
-        kotlin("jvm") version kotlinVersion
-        kotlin("js") version kotlinVersion
-        kotlin("jupyter.api") version "0.9.1-20"
     }
 }
 

ui/react/build.gradle.kts

@@ -2,12 +2,10 @@ plugins {
     id("ru.mipt.npm.gradle.js")
 }
 
-val kotlinWrappersVersion: String by rootProject.extra
-
 dependencies{
     api(project(":visionforge-solid"))
-    api("org.jetbrains.kotlin-wrappers:kotlin-styled:5.3.0-$kotlinWrappersVersion")
+    api("org.jetbrains.kotlin-wrappers:kotlin-styled")
-    api("org.jetbrains.kotlin-wrappers:kotlin-react-dom:17.0.2-$kotlinWrappersVersion")
+    api("org.jetbrains.kotlin-wrappers:kotlin-react-dom")
 //    implementation(npm("react-select","4.3.0"))
     implementation(project(":visionforge-threejs"))
 }

ui/react/src/main/kotlin/space/kscience/visionforge/react/MetaViewer.kt

@@ -145,7 +145,8 @@ private fun RBuilder.metaViewerItem(props: MetaViewerProps) {
 }
 
 @JsExport
-public val MetaViewer:FunctionalComponent<MetaViewerProps>  = functionalComponent<MetaViewerProps>("MetaViewer") { props ->
+public val MetaViewer: FunctionalComponent<MetaViewerProps> =
+    functionalComponent<MetaViewerProps>("MetaViewer") { props ->
         child(MetaViewerItem) {
             attrs {
                 this.key = ""

ui/react/src/main/kotlin/space/kscience/visionforge/react/PropertyEditor.kt

@@ -87,13 +87,15 @@ private fun RBuilder.propertyEditorItem(props: PropertyEditorProps) {
     }
 
     if (props.updateFlow != null) {
-        useEffectWithCleanup(listOf(props.ownProperties, props.updateFlow)) {
+        useEffect(props.ownProperties, props.updateFlow) {
             val updateJob = props.updateFlow!!.onEach { updatedName ->
                 if (updatedName == props.name) {
                     update()
                 }
             }.launchIn(props.scope ?: GlobalScope)
-            return@useEffectWithCleanup { updateJob.cancel() }
+            cleanup {
+                updateJob.cancel()
+            }
         }
     }
 

ui/react/src/main/kotlin/space/kscience/visionforge/react/ThreeCanvasComponent.kt

@@ -27,22 +27,22 @@ public val ThreeCanvasComponent: FunctionalComponent<ThreeCanvasProps> = functio
     val elementRef = useRef<Element>(null)
     var canvas by useState<ThreeCanvas?>(null)
 
-    val three: ThreePlugin = useMemo({ props.context.fetch(ThreePlugin) }, arrayOf(props.context))
+    val three: ThreePlugin = useMemo(props.context){ props.context.fetch(ThreePlugin) }
 
-    useEffect(listOf(props.solid, props.options, elementRef)) {
+    useEffect(props.solid, props.options, elementRef) {
         if (canvas == null) {
             val element = elementRef.current as? HTMLElement ?: error("Canvas element not found")
             canvas = ThreeCanvas(three, element, props.options ?: Canvas3DOptions())
         }
     }
 
-    useEffect(listOf(canvas, props.solid)) {
+    useEffect(canvas, props.solid) {
         props.solid?.let { obj ->
             canvas?.render(obj)
         }
     }
 
-    useEffect(listOf(canvas, props.selected)) {
+    useEffect(canvas, props.selected) {
         canvas?.select(props.selected)
     }
 

ui/ring/build.gradle.kts

@@ -17,6 +17,8 @@ kotlin{
 
 dependencies{
     api(project(":ui:react"))
+    //TODO replace by kotlin-wrappers
+    api("ru.mipt.npm:ring-ui:0.1.0")
 
     implementation(npm("@jetbrains/icons", "3.14.1"))
     implementation(npm("@jetbrains/ring-ui", "4.0.7"))

ui/ring/src/main/kotlin/ringui/Alert.kt

@@ -1,41 +0,0 @@
-package ringui
-
-import react.RBuilder
-import react.RClass
-import react.RHandler
-import react.dom.WithClassName
-
-// https://github.com/JetBrains/ring-ui/blob/master/components/alert/alert.js
-public external interface AlertProps : WithClassName {
-    public var timeout: Number
-    public var onCloseRequest: () -> Unit
-    public var onClose: () -> Unit
-    public var isShaking: Boolean
-    public var isClosing: Boolean
-    public var inline: Boolean
-    public var showWithAnimation: Boolean
-    public var closeable: Boolean
-    public var type: AlertType
-}
-
-public typealias AlertType = String
-
-public object AlertTypes {
-    public var ERROR: String = "error"
-    public var MESSAGE: String = "message"
-    public var SUCCESS: String = "success"
-    public var WARNING: String = "warning"
-    public var LOADING: String = "loading"
-}
-
-@JsModule("@jetbrains/ring-ui/components/alert/alert")
-internal external object AlertModule {
-    @JsName("default")
-    val Alert: RClass<AlertProps>
-}
-
-public fun RBuilder.ringAlert(handler: RHandler<AlertProps>) {
-    AlertModule.Alert {
-        handler()
-    }
-}

ui/ring/src/main/kotlin/ringui/Button.kt

@@ -1,43 +0,0 @@
-package ringui
-
-import org.w3c.dom.events.MouseEvent
-import react.RBuilder
-import react.RClass
-import react.RHandler
-import react.dom.WithClassName
-
-// https://github.com/JetBrains/ring-ui/blob/master/components/button/button.js
-public external interface ButtonProps : WithClassName {
-    public var theme: String
-    public var active: Boolean
-    public var danger: Boolean
-    public var delayed: Boolean
-    public var loader: Boolean
-    public var primary: Boolean
-
-    public var short: Boolean
-    public var text: Boolean
-    public var inline: Boolean
-    public var dropdown: Boolean
-
-    public var href: String
-
-    public var icon: dynamic /* string | func */
-    public var iconSize: Number
-    public var iconClassName: String
-
-    public var onMouseDown: (MouseEvent) -> Unit
-}
-
-@JsModule("@jetbrains/ring-ui/components/button/button")
-internal external object ButtonModule {
-    @JsName("default")
-    val Button: RClass<ButtonProps>
-}
-
-
-public fun RBuilder.ringButton(handler: RHandler<ButtonProps>) {
-    ButtonModule.Button {
-        handler()
-    }
-}

ui/ring/src/main/kotlin/ringui/Dialog.kt

@@ -1,35 +0,0 @@
-package ringui
-
-import react.RBuilder
-import react.RClass
-import react.RHandler
-import react.dom.WithClassName
-
-// https://github.com/JetBrains/ring-ui/blob/master/components/dialog/dialog.js
-public external interface DialogProps : WithClassName {
-    public var contentClassName: String
-    public var show: Boolean
-    public var showCloseButton: Boolean
-    public var onOverlayClick: () -> Unit
-    public var onEscPress: () -> Unit
-    public var onCloseClick: () -> Unit
-    // onCloseAttempt is a common callback for ESC pressing and overlay clicking.
-    // Use it if you don't need different behaviors for this cases.
-    public var onCloseAttempt: () -> Unit
-    // focusTrap may break popups inside dialog, so use it carefully
-    public var trapFocus: Boolean
-    public var autoFocusFirst: Boolean
-}
-
-@JsModule("@jetbrains/ring-ui/components/dialog/dialog")
-internal external object DialogModule {
-    @JsName("default")
-    val Dialog: RClass<DialogProps>
-}
-
-public fun RBuilder.ringDialog(show: Boolean, handler: RHandler<DialogProps>) {
-    DialogModule.Dialog {
-        attrs.show = show
-        handler()
-    }
-}

ui/ring/src/main/kotlin/ringui/Dropdown.kt

@@ -1,46 +0,0 @@
-package ringui
-
-import org.w3c.dom.events.Event
-import react.RBuilder
-import react.RClass
-import react.RHandler
-import react.ReactElement
-import react.dom.WithClassName
-
-public external interface AnchorProps : WithClassName
-
-public external interface DropdownProps : WithClassName {
-    /**
-     * Can be string, React element, or a function accepting an object with {active, pinned} properties and returning a React element
-     * React element should render some interactive HTML element like `button` or `a`
-     */
-    public var anchor: dynamic //: PropTypes.oneOfType([PropTypes.node, PropTypes.func]).isRequired,
-    public var initShown: Boolean
-    public var activeClassName: String
-    public var clickMode: Boolean
-    public var hoverMode: Boolean
-    public var hoverShowTimeOut: Number
-    public var hoverHideTimeOut: Number
-    public var onShow: () -> Unit
-    public var onHide: () -> Unit
-    public var onMouseEnter: (Event) -> Unit
-    public var onMouseLeave: (Event) -> Unit
-    //'data-test': PropTypes.string
-}
-
-@JsModule("@jetbrains/ring-ui/components/dropdown/dropdown")
-public external object DropdownModule {
-    public val Anchor: RClass<AnchorProps>
-
-    @JsName("default")
-    public val Dropdown: RClass<DropdownProps>
-}
-
-
-public fun RBuilder.ringDropdown(anchor: dynamic, handler: RHandler<DropdownProps>): ReactElement =
-    DropdownModule.Dropdown {
-        attrs {
-            this.anchor = anchor
-        }
-        handler()
-    }

ui/ring/src/main/kotlin/ringui/Icon.kt

@@ -1,28 +0,0 @@
-package ringui
-
-import react.RBuilder
-import react.RClass
-import react.RHandler
-import react.dom.WithClassName
-
-// https://github.com/JetBrains/ring-ui/blob/master/components/icon/icon.js
-public external interface IconProps : WithClassName {
-    public var color: String
-    public var glyph: dynamic /* string | func */
-    public var height: Number
-    public var size: Number
-    public var width: Number
-    public var loading: Boolean
-}
-
-@JsModule("@jetbrains/ring-ui/components/icon/icon")
-internal external object IconModule {
-    @JsName("default")
-    val Icon: RClass<IconProps>
-}
-
-public fun RBuilder.ringIcon(handler: RHandler<IconProps>) {
-    IconModule.Icon {
-        handler()
-    }
-}

ui/ring/src/main/kotlin/ringui/Link.kt

@@ -1,31 +0,0 @@
-package ringui
-
-import org.w3c.dom.events.MouseEvent
-import react.RBuilder
-import react.RClass
-import react.RHandler
-import react.dom.WithClassName
-
-// https://github.com/JetBrains/ring-ui/blob/master/components/link/link.js
-public external interface LinkProps : WithClassName {
-    public var innerClassName: String
-    public var active: Boolean
-    public var inherit: Boolean
-    public var pseudo: Boolean
-    public var hover: Boolean
-    public var href: String
-    public var onPlainLeftClick: (MouseEvent) -> Unit
-    public var onClick: (MouseEvent) -> Unit
-}
-
-@JsModule("@jetbrains/ring-ui/components/link/link")
-internal external object LinkModule {
-    @JsName("default")
-    val Link: RClass<LinkProps>
-}
-
-public fun RBuilder.ringLink(handler: RHandler<LinkProps>) {
-    LinkModule.Link {
-        handler()
-    }
-}

ui/ring/src/main/kotlin/ringui/UserCard.kt

@@ -1,38 +0,0 @@
-package ringui
-
-import react.RBuilder
-import react.RClass
-import react.RHandler
-import react.RProps
-
-@JsModule("@jetbrains/ring-ui/components/user-card/user-card")
-private external object UserCardModule {
-    val UserCard: RClass<UserCardProps>
-}
-
-// https://github.com/JetBrains/ring-ui/blob/master/components/user-card/card.js
-public external interface UserCardProps : RProps {
-    public var user: UserCardModel
-    public var wording: UserCardWording
-}
-
-public data class UserCardModel(
-    val name: String,
-    val login: String,
-    val avatarUrl: String,
-    val email: String? = null,
-    val href: String? = null
-)
-
-public data class UserCardWording(
-    val banned: String,
-    val online: String,
-    val offline: String
-)
-
-public fun RBuilder.ringUserCard(user: UserCardModel, handler: RHandler<UserCardProps> = {}) {
-    UserCardModule.UserCard {
-        attrs.user = user
-        handler()
-    }
-}

ui/ring/src/main/kotlin/ringui/grid/Col.kt

@@ -1,23 +0,0 @@
-package ringui.grid
-
-import react.RBuilder
-import react.RHandler
-import react.dom.WithClassName
-
-public external interface ColProps : WithClassName {
-    public var xs: dynamic // number or boolean
-    public var sm: dynamic // number or boolean
-    public var md: dynamic // number or boolean
-    public var lg: dynamic // number or boolean
-    public var xsOffset: Number
-    public var smOffset: Number
-    public var mdOffset: Number
-    public var lgOffset: Number
-    public var reverse: Boolean
-}
-
-public fun RBuilder.ringCol(handler: RHandler<ColProps>){
-    GridModule.Col {
-        handler()
-    }
-}

ui/ring/src/main/kotlin/ringui/grid/Grid.kt

@@ -1,20 +0,0 @@
-package ringui.grid
-
-import react.RBuilder
-import react.RClass
-import react.RHandler
-import react.RProps
-
-@JsModule("@jetbrains/ring-ui/components/grid/grid")
-internal external object GridModule {
-    val Grid: RClass<RProps>
-    val Row: RClass<RowProps>
-    val Col: RClass<dynamic>
-}
-
-
-public fun RBuilder.ringGrid(handler: RHandler<RProps>) {
-    GridModule.Grid {
-        handler()
-    }
-}

ui/ring/src/main/kotlin/ringui/grid/Row.kt

@@ -1,33 +0,0 @@
-package ringui.grid
-
-import react.RBuilder
-import react.RHandler
-import react.dom.WithClassName
-
-public enum class RowPosition {
-    xs,
-    sm,
-    md,
-    lg
-}
-
-public external interface RowProps : WithClassName {
-    public var reverse: Boolean
-    public var start: RowPosition
-    public var center: RowPosition
-    public var end: RowPosition
-    public var top: RowPosition
-    public var middle: RowPosition
-    public var baseline: RowPosition
-    public var bottom: RowPosition
-    public var around: RowPosition
-    public var between: RowPosition
-    public var first: RowPosition
-    public var last: RowPosition
-}
-
-public fun RBuilder.ringRow(handler: RHandler<RowProps>){
-    GridModule.Row {
-        handler()
-    }
-}

ui/ring/src/main/kotlin/ringui/header/Header.kt

@@ -1,33 +0,0 @@
-package ringui.header
-
-import react.RBuilder
-import react.RClass
-import react.RHandler
-import react.dom.WithClassName
-
-@JsModule("@jetbrains/ring-ui/components/header/header")
-internal external object HeaderModule {
-    @JsName("default")
-    val Header: RClass<HeaderProps>
-    val RerenderableHeader: RClass<HeaderProps>
-    val Logo: RClass<HeaderLogoProps>
-    val Tray: RClass<HeaderTrayProps>
-    val TrayIcon: RClass<WithClassName>
-    val Profile: RClass<WithClassName>
-    val SmartProfile: RClass<WithClassName>
-    val Services: RClass<WithClassName>
-    val SmartServices: RClass<WithClassName>
-}
-
-// https://github.com/JetBrains/ring-ui/blob/master/components/header/header.js
-public external interface HeaderProps : WithClassName {
-    public var spaced: Boolean
-    public var theme: String
-}
-
-
-public fun RBuilder.ringHeader(handler: RHandler<HeaderProps>) {
-    HeaderModule.Header {
-        handler()
-    }
-}

ui/ring/src/main/kotlin/ringui/header/Logo.kt

@@ -1,21 +0,0 @@
-package ringui.header
-
-import kotlinx.html.A
-import react.RElementBuilder
-import react.RHandler
-import ringui.IconProps
-import styled.StyledDOMBuilder
-
-public external interface HeaderLogoProps : IconProps
-
-public fun StyledDOMBuilder<A>.ringLogo(handler: RHandler<HeaderLogoProps>) {
-    HeaderModule.Logo {
-        handler()
-    }
-}
-
-public fun RElementBuilder<HeaderProps>.ringLogo(handler: RHandler<HeaderLogoProps>) {
-    HeaderModule.Logo {
-        handler()
-    }
-}

ui/ring/src/main/kotlin/ringui/header/Tray.kt

@@ -1,26 +0,0 @@
-package ringui.header
-
-import react.RElementBuilder
-import react.RHandler
-import react.dom.WithClassName
-import ringui.ButtonProps
-
-// https://github.com/JetBrains/ring-ui/blob/master/components/header/tray.js
-public external interface HeaderTrayProps : WithClassName
-
-// https://github.com/JetBrains/ring-ui/blob/master/components/header/tray-icon.js
-public external interface HeaderTrayIconProps : ButtonProps {
-    public var rotatable: Boolean
-}
-
-public fun RElementBuilder<HeaderProps>.ringTray(handler: RHandler<HeaderTrayProps>) {
-    HeaderModule.Tray {
-        handler()
-    }
-}
-
-public fun RElementBuilder<HeaderTrayProps>.ringTrayIcon(handler: RHandler<WithClassName>) {
-    HeaderModule.TrayIcon {
-        handler()
-    }
-}

ui/ring/src/main/kotlin/ringui/island/Content.kt

@@ -1,20 +0,0 @@
-package ringui.island
-
-import react.RElementBuilder
-import react.RHandler
-import react.dom.WithClassName
-
-// https://github.com/JetBrains/ring-ui/blob/master/components/island/content.js
-public external interface IslandContentProps : WithClassName {
-    public var scrollableWrapperClassName: String
-    public var fade: Boolean
-    public var bottomBorder: Boolean
-    public var onScroll: () -> Unit
-    public var onScrollToBottom: () -> Unit
-}
-
-public fun RElementBuilder<IslandProps>.ringIslandContent(handler: RHandler<IslandContentProps>) {
-    IslandModule.Content {
-        handler()
-    }
-}

ui/ring/src/main/kotlin/ringui/island/Header.kt

@@ -1,18 +0,0 @@
-package ringui.island
-
-import react.RElementBuilder
-import react.RHandler
-import react.dom.WithClassName
-
-// https://github.com/JetBrains/ring-ui/blob/master/components/island/header.js
-public external interface IslandHeaderProps : WithClassName {
-    public var border: Boolean
-    public var wrapWithTitle: Boolean
-    public var phase: Number
-}
-
-public fun RElementBuilder<IslandProps>.ringIslandHeader(handler: RHandler<IslandHeaderProps>) {
-    IslandModule.Header {
-        handler()
-    }
-}

ui/ring/src/main/kotlin/ringui/island/Island.kt

@@ -1,45 +0,0 @@
-package ringui.island
-
-import react.RBuilder
-import react.RClass
-import react.RHandler
-import react.dom.WithClassName
-
-@JsModule("@jetbrains/ring-ui/components/island/island")
-internal external object IslandModule {
-    val default: RClass<IslandProps>
-    val Content: RClass<IslandContentProps>
-    val Header: RClass<IslandHeaderProps>
-    val AdaptiveIsland: RClass<IslandProps>
-}
-
-// https://github.com/JetBrains/ring-ui/blob/master/components/island/island.js
-public external interface IslandProps : WithClassName {
-    public val narrow: Boolean
-    public val withoutPaddings: Boolean
-}
-
-public fun RBuilder.ringIsland(handler: RHandler<IslandProps>) {
-    IslandModule.default {
-        handler()
-    }
-}
-
-public fun RBuilder.ringIsland(header: String, handler: RHandler<IslandContentProps>) {
-    ringIsland {
-        ringIslandHeader {
-            attrs{
-                border = true
-            }
-            +header
-        }
-        ringIslandContent(handler)
-    }
-}
-
-
-public fun RBuilder.ringAdaptiveIsland(handler: RHandler<IslandProps>) {
-    IslandModule.AdaptiveIsland {
-        handler()
-    }
-}

ui/ring/src/main/kotlin/ringui/tabs/SmartTabs.kt

@@ -1,21 +0,0 @@
-package ringui.tabs
-
-import react.RBuilder
-import react.RHandler
-import react.dom.WithClassName
-
-public external interface SmartTabsProps : WithClassName {
-    public var initSelected: String
-}
-
-
-public fun RBuilder.ringSmartTabs(active: String? = null, handler: RHandler<SmartTabsProps>) {
-    TabsModule.SmartTabs {
-        active?.let {
-            attrs {
-                initSelected = active
-            }
-        }
-        handler()
-    }
-}

ui/ring/src/main/kotlin/ringui/tabs/Tabs.kt

@@ -1,51 +0,0 @@
-package ringui.tabs
-
-import react.RBuilder
-import react.RClass
-import react.RHandler
-import react.dom.WithClassName
-
-@JsModule("@jetbrains/ring-ui/components/tabs/tabs")
-internal external object TabsModule {
-    val Tabs: RClass<TabsProps>
-    val Tab: RClass<TabProps>
-    val SmartTabs: RClass<SmartTabsProps>
-    //val CustomItem: RClass<CustomItemProps>
-}
-
-//https://github.com/JetBrains/ring-ui/blob/master/components/tabs/tabs.js
-public external interface TabsProps : WithClassName {
-    public var theme: String
-    public var selected: String
-    public var onSelect: (String) -> Unit
-    public var href: String
-    public var autoCollapse: Boolean
-}
-
-public external interface CustomItemProps : WithClassName
-
-public external interface TabProps : WithClassName {
-    public var title: dynamic // PropTypes.oneOfType([PropTypes.node, PropTypes.func]).isRequired,
-    public var id: String
-}
-
-public fun RBuilder.ringTabs(active: String? = null, handler: RHandler<TabsProps>) {
-    TabsModule.Tabs {
-        active?.let{
-            attrs {
-                selected = active
-            }
-        }
-        handler()
-    }
-}
-
-public fun RBuilder.ringTab(title: dynamic, id: String = title.toString(), handler: RHandler<TabProps>) {
-    TabsModule.Tab {
-        attrs {
-            this.title = title
-            this.id = id
-        }
-        handler()
-    }
-}

ui/ring/src/main/kotlin/space.kscience.visionforge.ring/ThreeViewWithControls.kt

@@ -4,7 +4,7 @@ import kotlinx.css.*
 import react.*
 import react.dom.div
 import react.dom.span
-import ringui.ringLink
+import ringui.Link
 import space.kscience.dataforge.context.Context
 import space.kscience.dataforge.names.Name
 import space.kscience.dataforge.names.NameToken
@@ -36,7 +36,7 @@ public fun ThreeCanvasWithControlsProps.tab(title: String, block: RBuilder.() ->
 
 public fun RBuilder.nameCrumbs(name: Name?, link: (Name) -> Unit): ReactElement = styledDiv {
     div {
-        ringLink {
+        Link {
             attrs {
                 onClick = {
                     link(Name.EMPTY)
@@ -51,7 +51,7 @@ public fun RBuilder.nameCrumbs(name: Name?, link: (Name) -> Unit): ReactElement
                 tokens.add(token)
                 val fullName = Name(tokens.toList())
                 span { +"/" }
-                ringLink {
+                Link {
                     +token.toString()
                     attrs {
                         onClick = {

ui/ring/src/main/kotlin/space.kscience.visionforge.ring/ringPropertyEditor.kt

@@ -4,11 +4,9 @@ import org.w3c.dom.Element
 import react.RBuilder
 import react.dom.p
 import react.dom.render
-import ringui.island.ringIsland
+import ringui.Island
-import ringui.island.ringIslandContent
+import ringui.SmartTabs
-import ringui.island.ringIslandHeader
+import ringui.Tab
-import ringui.tabs.ringSmartTabs
-import ringui.tabs.ringTab
 import space.kscience.dataforge.meta.descriptors.NodeDescriptor
 import space.kscience.visionforge.*
 import space.kscience.visionforge.react.flexColumn
@@ -28,7 +26,7 @@ public fun RBuilder.ringPropertyEditor(
     }
 
     flexColumn {
-        ringIsland("Properties") {
+        Island("Properties") {
             propertyEditor(
                 ownProperties = vision.ownProperties,
                 allProperties = vision.allProperties(),
@@ -39,14 +37,7 @@ public fun RBuilder.ringPropertyEditor(
         }
 
         if (styles.isNotEmpty()) {
-            ringIsland {
+            Island("Styles") {
-                ringIslandHeader {
-                    attrs {
-                        border = true
-                    }
-                    +"Styles"
-                }
-                ringIslandContent {
                 if (styles.size == 1) {
                     val styleName = styles.first()
                     p {
@@ -54,16 +45,16 @@ public fun RBuilder.ringPropertyEditor(
                     }
                     val style = vision.getStyle(styleName)
                     if (style != null) {
-                            ringTab(styleName, id = styleName) {
+                        Tab(styleName, id = styleName) {
                             metaViewer(style)
                         }
                     }
                 } else {
-                        ringSmartTabs {
+                    SmartTabs {
                         styles.forEach { styleName ->
                             val style = vision.getStyle(styleName)
                             if (style != null) {
-                                    ringTab(styleName, id = styleName) {
+                                Tab(styleName, id = styleName) {
                                     metaViewer(style)
                                 }
                             }
@@ -74,7 +65,7 @@ public fun RBuilder.ringPropertyEditor(
         }
     }
 }
-}
+
 
 public fun Element.ringPropertyEditor(
     item: Vision,

ui/ring/src/main/kotlin/space.kscience.visionforge.ring/ringThreeControls.kt

@@ -9,9 +9,9 @@ import org.w3c.files.BlobPropertyBag
 import react.*
 import react.dom.attrs
 import react.dom.button
-import ringui.island.ringIsland
+import ringui.Island
-import ringui.tabs.ringSmartTabs
+import ringui.SmartTabs
-import ringui.tabs.ringTab
+import ringui.Tab
 import space.kscience.dataforge.meta.withDefault
 import space.kscience.dataforge.names.Name
 import space.kscience.visionforge.Vision
@@ -90,27 +90,27 @@ public external interface ThreeControlsProps : RProps {
 
 @JsExport
 public val ThreeControls: FunctionalComponent<ThreeControlsProps> = functionalComponent { props ->
-    ringSmartTabs("Tree") {
+    SmartTabs("Tree") {
         props.vision?.let {
-            ringTab("Tree") {
+            Tab("Tree") {
                 styledDiv {
                     css {
                         height = 100.pct
                         overflowY = Overflow.auto
                     }
-                    ringIsland("Vision tree") {
+                    Island("Vision tree") {
                         visionTree(it, props.selected, props.onSelect)
                     }
                 }
             }
         }
-        ringTab("Settings") {
+        Tab("Settings") {
-            ringIsland("Canvas configuration") {
+            Island("Canvas configuration") {
                 canvasControls(props.canvasOptions, props.vision)
             }
         }
         props.additionalTabs.forEach { (name, handler) ->
-            ringTab(name){
+            Tab(name) {
                 handler()
             }
         }

visionforge-core/build.gradle.kts

@@ -3,7 +3,6 @@ plugins {
 }
 
 val dataforgeVersion: String by rootProject.extra
-val kotlinWrappersVersion: String by rootProject.extra
 
 kscience{
     useSerialization()
@@ -15,12 +14,12 @@ kotlin {
             dependencies {
                 api("space.kscience:dataforge-context:$dataforgeVersion")
                 api("org.jetbrains.kotlinx:kotlinx-html:${ru.mipt.npm.gradle.KScienceVersions.htmlVersion}")
-                api("org.jetbrains.kotlin-wrappers:kotlin-css:1.0.0-$kotlinWrappersVersion")
+                api("org.jetbrains.kotlin-wrappers:kotlin-css")
             }
         }
         jsMain {
             dependencies {
-                api("org.jetbrains.kotlin-wrappers:kotlin-extensions:1.0.1-$kotlinWrappersVersion")
+                api("org.jetbrains.kotlin-wrappers:kotlin-extensions")
             }
         }
     }

visionforge-fx/build.gradle.kts

@@ -3,8 +3,6 @@ plugins {
 }
 
 val dataforgeVersion: String by rootProject.extra
-val kotlinWrappersVersion: String by rootProject.extra
-val htmlVersion: String by rootProject.extra
 val fxVersion: String by rootProject.extra
 
 kscience{

visionforge-solid/src/commonMain/kotlin/space/kscience/visionforge/solid/SolidReference.kt

@@ -99,17 +99,17 @@ public class SolidReferenceGroup(
         //TODO replace by properties
         override var position: Point3D?
             get() = prototype.position
-            set(value) {
+            set(_) {
                 error("Can't set position of reference")
             }
         override var rotation: Point3D?
             get() = prototype.rotation
-            set(value) {
+            set(_) {
                 error("Can't set position of reference")
             }
         override var scale: Point3D?
             get() = prototype.scale
-            set(value) {
+            set(_) {
                 error("Can't set position of reference")
             }
         override val prototype: Solid get() = prototypeFor(childName)

visionforge-threejs/build.gradle.kts

@@ -2,13 +2,6 @@ plugins {
     id("ru.mipt.npm.gradle.js")
 }
 
-kotlin{
-    explicitApi = null
-    js{
-        binaries.library()
-    }
-}
-
 dependencies {
     api(project(":visionforge-solid"))
     implementation(npm("three", "0.124.0"))