Refactoring styled component

Form controls: input, password, checkbox

16 files changed, 503 insertions, 32 deletions

diff --git a/src/main/kotlin/pl/treksoft/kvision/Showcase.kt b/src/main/kotlin/pl/treksoft/kvision/Showcase.kt
index ab88be28..bf0691e1 100644
--- a/src/main/kotlin/pl/treksoft/kvision/Showcase.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/Showcase.kt
@@ -1,18 +1,15 @@
 package pl.treksoft.kvision
 
 import pl.treksoft.kvision.basic.Label
-import pl.treksoft.kvision.core.Container
-import pl.treksoft.kvision.core.Img
-import pl.treksoft.kvision.core.Root
-import pl.treksoft.kvision.css.BGATTACH
-import pl.treksoft.kvision.css.BGREPEAT
-import pl.treksoft.kvision.css.BGSIZE
-import pl.treksoft.kvision.css.BORDERSTYLE
-import pl.treksoft.kvision.css.Background
-import pl.treksoft.kvision.css.Border
-import pl.treksoft.kvision.css.COLOR
+import pl.treksoft.kvision.core.*
 import pl.treksoft.kvision.dropdown.DD.*
 import pl.treksoft.kvision.dropdown.DropDown
+import pl.treksoft.kvision.form.CHECKBOXSTYLE
+import pl.treksoft.kvision.form.CheckBox
+import pl.treksoft.kvision.form.INPUTSIZE
+import pl.treksoft.kvision.form.TEXTINPUTTYPE
+import pl.treksoft.kvision.form.Text
+import pl.treksoft.kvision.form.TextInput
 import pl.treksoft.kvision.html.*
 import pl.treksoft.kvision.html.TAG.DIV
 import pl.treksoft.kvision.html.TAG.H1
@@ -44,6 +41,37 @@ class Showcase : ApplicationBase() {
         link.add(Tag(TAG.P, "Cośtam"))
         root.add(link)
 
+        val textField = TextInput(placeholder = "Wprowadź hasło ...", value = "abc")
+        root.add(textField)
+        textField.setEventListener<TextInput> {
+            input = { e ->
+                println("i" + self.value)
+            }
+            change = { e ->
+                println("c" + self.value)
+            }
+        }
+        val passwordField = TextInput(TEXTINPUTTYPE.PASSWORD)
+        root.add(passwordField)
+
+        val textField2 = TextInput(placeholder = "Disabled")
+        textField2.disabled = true
+        textField2.size = INPUTSIZE.LARGE
+        root.add(textField2)
+
+        val checkbox = CheckBox(true, label = "Kliknij aby <b>przetestować</b>", rich = true, circled = true,
+                style = CHECKBOXSTYLE.DANGER)
+        root.add(checkbox)
+        checkbox.setEventListener<CheckBox> {
+            click = { e ->
+                println("click" + self.value)
+            }
+            change = { e -> println("change" + self.value) }
+        }
+
+        val text = Text(placeholder = "Pole formularza", maxlength = 5, label = "To jest pole")
+        root.add(text)
+
         val dd = DropDown("Dropdown", listOf("abc" to "#!/x", "def" to "#!/y"), "flag")
         root.add(dd)
         dd.setEventListener<DropDown> {
@@ -206,6 +234,8 @@ class Showcase : ApplicationBase() {
         button.setEventListener<Button> {
             click = { _ ->
                 println(self.text)
+                println(textField.value)
+                println(checkbox.value)
                 grid4.colorHex = 0xff0000
                 dd3.text = "Zmiana"
                 dd3.style = BUTTONSTYLE.WARNING
diff --git a/src/main/kotlin/pl/treksoft/kvision/css/Css.kt b/src/main/kotlin/pl/treksoft/kvision/core/Css.kt
index e2a4122b..eba7782a 100644
--- a/src/main/kotlin/pl/treksoft/kvision/css/Css.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/core/Css.kt
@@ -1,6 +1,5 @@
-package pl.treksoft.kvision.css
+package pl.treksoft.kvision.core
 
-import pl.treksoft.kvision.core.ResString
 import pl.treksoft.kvision.utils.Utils
 
 @Suppress("EnumNaming", "EnumEntryName")
diff --git a/src/main/kotlin/pl/treksoft/kvision/core/KVManager.kt b/src/main/kotlin/pl/treksoft/kvision/core/KVManager.kt
index aa7d7a4a..e394db73 100644
--- a/src/main/kotlin/pl/treksoft/kvision/core/KVManager.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/core/KVManager.kt
@@ -18,6 +18,7 @@ object KVManager {
     private val bootstrapWebpack = require("bootstrap-webpack")
     private val fontAwesomeWebpack = require("font-awesome-webpack")
     private val resizable = require("jquery-resizable-dom")
+    private val awesomeBootstrapCheckbox = require("awesome-bootstrap-checkbox")
 
     private val sdPatch = Snabbdom.init(arrayOf(classModule, attributesModule, propsModule, styleModule,
             eventListenersModule, datasetModule))
diff --git a/src/main/kotlin/pl/treksoft/kvision/core/StyledComponent.kt b/src/main/kotlin/pl/treksoft/kvision/core/StyledComponent.kt
index 414e4561..8b883d82 100644
--- a/src/main/kotlin/pl/treksoft/kvision/core/StyledComponent.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/core/StyledComponent.kt
@@ -1,10 +1,5 @@
 package pl.treksoft.kvision.core
 
-import pl.treksoft.kvision.css.Background
-import pl.treksoft.kvision.css.Border
-import pl.treksoft.kvision.css.COLOR
-import pl.treksoft.kvision.css.Color
-import pl.treksoft.kvision.css.CssSize
 import pl.treksoft.kvision.snabbdom.StringPair
 
 abstract class StyledComponent : KVObject {
diff --git a/src/main/kotlin/pl/treksoft/kvision/dropdown/DropDown.kt b/src/main/kotlin/pl/treksoft/kvision/dropdown/DropDown.kt
index b145f721..92f06591 100644
--- a/src/main/kotlin/pl/treksoft/kvision/dropdown/DropDown.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/dropdown/DropDown.kt
@@ -4,7 +4,6 @@ import com.github.snabbdom.VNode
 import pl.treksoft.kvision.core.Container
 import pl.treksoft.kvision.core.ResString
 import pl.treksoft.kvision.core.Widget
-import pl.treksoft.kvision.html.BUTTONSIZE
 import pl.treksoft.kvision.html.BUTTONSTYLE
 import pl.treksoft.kvision.html.Button
 import pl.treksoft.kvision.html.LIST
@@ -23,8 +22,7 @@ enum class DD(val type: String) {
 }
 
 open class DropDown(text: String, elements: List<StringPair>? = null, icon: String? = null,
-                    style: BUTTONSTYLE = BUTTONSTYLE.DEFAULT, size: BUTTONSIZE? = null,
-                    block: Boolean = false, disabled: Boolean = false, image: ResString? = null,
+                    style: BUTTONSTYLE = BUTTONSTYLE.DEFAULT, disabled: Boolean = false, image: ResString? = null,
                     dropup: Boolean = false, classes: Set<String> = setOf()) : Container(classes) {
     var text
         get() = button.text
@@ -73,7 +71,7 @@ open class DropDown(text: String, elements: List<StringPair>? = null, icon: Stri
         }
 
     private val idc = "kv_dropdown_" + counter
-    internal val button: DropDownButton = DropDownButton(idc, text, icon, style, size, block,
+    internal val button: DropDownButton = DropDownButton(idc, text, icon, style,
             disabled, image, setOf("dropdown"))
     internal val list: DropDownListTag = DropDownListTag(idc, setOf("dropdown-menu"))
 
@@ -165,9 +163,9 @@ open class DropDown(text: String, elements: List<StringPair>? = null, icon: Stri
 }
 
 open class DropDownButton(id: String, text: String, icon: String? = null, style: BUTTONSTYLE = BUTTONSTYLE.DEFAULT,
-                          size: BUTTONSIZE? = null, block: Boolean = false, disabled: Boolean = false,
+                          disabled: Boolean = false,
                           image: ResString? = null, classes: Set<String> = setOf()) :
-        Button(text, icon, style, size, block, disabled, image, classes) {
+        Button(text, icon, style, disabled, image, classes) {
 
     init {
         this.id = id
diff --git a/src/main/kotlin/pl/treksoft/kvision/form/CheckBox.kt b/src/main/kotlin/pl/treksoft/kvision/form/CheckBox.kt
new file mode 100644
index 00000000..2d7b3276
--- /dev/null
+++ b/src/main/kotlin/pl/treksoft/kvision/form/CheckBox.kt
@@ -0,0 +1,110 @@
+package pl.treksoft.kvision.form
+
+import pl.treksoft.kvision.core.Container
+import pl.treksoft.kvision.core.Widget
+import pl.treksoft.kvision.snabbdom.SnOn
+import pl.treksoft.kvision.snabbdom.StringBoolPair
+
+enum class CHECKBOXSTYLE(val className: String) {
+    DEFAULT("checkbox-default"),
+    PRIMARY("checkbox-primary"),
+    SUCCESS("checkbox-success"),
+    INFO("checkbox-info"),
+    WARNING("checkbox-warning"),
+    DANGER("checkbox-danger"),
+}
+
+open class CheckBox(value: Boolean = false, name: String? = null, style: CHECKBOXSTYLE? = null,
+                    circled: Boolean = false, inline: Boolean = false, disabled: Boolean = false,
+                    label: String? = null, rich: Boolean = false) : Container(setOf("checkbox")), BoolFormField {
+
+    override var value
+        get() = input.value
+        set(value) {
+            input.value = value
+        }
+    var startValue
+        get() = input.startValue
+        set(value) {
+            input.startValue = value
+        }
+    var name
+        get() = input.name
+        set(value) {
+            input.name = value
+        }
+    override var disabled
+        get() = input.disabled
+        set(value) {
+            input.disabled = value
+        }
+    var label
+        get() = flabel.text
+        set(value) {
+            flabel.text = value
+        }
+    var rich
+        get() = flabel.rich
+        set(value) {
+            flabel.rich = value
+        }
+    var style = style
+        set(value) {
+            field = value
+            refresh()
+        }
+    var circled = circled
+        set(value) {
+            field = value
+            refresh()
+        }
+    var inline = inline
+        set(value) {
+            field = value
+            refresh()
+        }
+    override var size
+        get() = input.size
+        set(value) {
+            input.size = value
+        }
+
+    private val idc = "kv_form_checkbox_" + counter
+    val input: CheckBoxInput = CheckBoxInput(value, name, disabled, idc, setOf("styled"))
+    val flabel: FieldLabel = FieldLabel(idc, label, rich)
+
+    init {
+        this.addInternal(input)
+        this.addInternal(flabel)
+        counter++
+    }
+
+    companion object {
+        var counter = 0
+    }
+
+    @Suppress("UNCHECKED_CAST")
+    override fun <T : Widget> setEventListener(block: SnOn<T>.() -> Unit): Widget {
+        input.setEventListener<T>(block)
+        return this
+    }
+
+    override fun setEventListener(block: SnOn<Widget>.() -> Unit): Widget {
+        input.setEventListener(block)
+        return this
+    }
+
+    override fun getSnClass(): List<StringBoolPair> {
+        val cl = super.getSnClass().toMutableList()
+        style?.let {
+            cl.add(it.className to true)
+        }
+        if (circled) {
+            cl.add("checkbox-circle" to true)
+        }
+        if (inline) {
+            cl.add("checkbox-inline" to true)
+        }
+        return cl
+    }
+}
diff --git a/src/main/kotlin/pl/treksoft/kvision/form/CheckBoxInput.kt b/src/main/kotlin/pl/treksoft/kvision/form/CheckBoxInput.kt
new file mode 100644
index 00000000..1893668b
--- /dev/null
+++ b/src/main/kotlin/pl/treksoft/kvision/form/CheckBoxInput.kt
@@ -0,0 +1,78 @@
+package pl.treksoft.kvision.form
+
+import com.github.snabbdom.VNode
+import pl.treksoft.kvision.core.Widget
+import pl.treksoft.kvision.snabbdom.StringBoolPair
+import pl.treksoft.kvision.snabbdom.StringPair
+
+open class CheckBoxInput(override var value: Boolean = false,
+                         name: String? = null, disabled: Boolean = false, id: String? = null,
+                         classes: Set<String> = setOf()) : Widget(classes), BoolFormField {
+
+    init {
+        this.id = id
+    }
+
+    @Suppress("LeakingThis")
+    var startValue: Boolean = value
+        set(value) {
+            field = value
+            this.value = value
+            refresh()
+        }
+    var name: String? = name
+        set(value) {
+            field = value
+            refresh()
+        }
+    override var disabled: Boolean = disabled
+        set(value) {
+            field = value
+            refresh()
+        }
+    override var size: INPUTSIZE? = null
+        set(value) {
+            field = value
+            refresh()
+        }
+
+    override fun render(): VNode {
+        return kvh("input")
+    }
+
+    override fun getSnClass(): List<StringBoolPair> {
+        val cl = super.getSnClass().toMutableList()
+        size?.let {
+            cl.add(it.className to true)
+        }
+        return cl
+    }
+
+    override fun getSnAttrs(): List<StringPair> {
+        val sn = super.getSnAttrs().toMutableList()
+        sn.add("type" to "checkbox")
+        if (startValue) {
+            sn.add("checked" to "checked")
+        }
+        name?.let {
+            sn.add("name" to it)
+        }
+        if (disabled) {
+            sn.add("disabled" to "disabled")
+        }
+        return sn
+    }
+
+    override fun afterInsert(node: VNode) {
+        this.getElementJQuery()?.on("change", { _, _ ->
+            val v = getElementJQuery()?.prop("checked") as Boolean?
+            value = (v == true)
+            true
+        })
+        this.getElementJQuery()?.on("click", { _, _ ->
+            val v = getElementJQuery()?.prop("checked") as Boolean?
+            value = (v == true)
+            true
+        })
+    }
+}
diff --git a/src/main/kotlin/pl/treksoft/kvision/form/FieldLabel.kt b/src/main/kotlin/pl/treksoft/kvision/form/FieldLabel.kt
new file mode 100644
index 00000000..92b014d4
--- /dev/null
+++ b/src/main/kotlin/pl/treksoft/kvision/form/FieldLabel.kt
@@ -0,0 +1,14 @@
+package pl.treksoft.kvision.form
+
+import pl.treksoft.kvision.html.TAG
+import pl.treksoft.kvision.html.Tag
+import pl.treksoft.kvision.snabbdom.StringPair
+
+open class FieldLabel(private val forId: String, text: String? = null, rich: Boolean = false) : Tag(TAG.LABEL,
+        text, rich) {
+
+    override fun getSnAttrs(): List<StringPair> {
+        return super.getSnAttrs() + ("for" to forId)
+    }
+
+}
diff --git a/src/main/kotlin/pl/treksoft/kvision/form/FormField.kt b/src/main/kotlin/pl/treksoft/kvision/form/FormField.kt
new file mode 100644
index 00000000..dd7ae745
--- /dev/null
+++ b/src/main/kotlin/pl/treksoft/kvision/form/FormField.kt
@@ -0,0 +1,27 @@
+package pl.treksoft.kvision.form
+
+enum class INPUTSIZE(val className: String) {
+    LARGE("input-lg"),
+    SMALL("input-sm")
+}
+
+interface FormField {
+    var disabled: Boolean
+    var size: INPUTSIZE?
+    fun getValueAsString(): String?
+}
+
+interface StringFormField : FormField {
+    var value: String?
+    override fun getValueAsString(): String? = value
+}
+
+interface NumberFormField : FormField {
+    var value: Number?
+    override fun getValueAsString(): String? = value?.toString()
+}
+
+interface BoolFormField : FormField {
+    var value: Boolean
+    override fun getValueAsString(): String? = value.toString()
+}
diff --git a/src/main/kotlin/pl/treksoft/kvision/form/Password.kt b/src/main/kotlin/pl/treksoft/kvision/form/Password.kt
new file mode 100644
index 00000000..86a862cd
--- /dev/null
+++ b/src/main/kotlin/pl/treksoft/kvision/form/Password.kt
@@ -0,0 +1,6 @@
+package pl.treksoft.kvision.form
+
+open class Password(placeholder: String? = null, value: String? = null,
+                    name: String? = null, maxlength: Int? = null, label: String? = null, rich: Boolean = false,
+                    disabled: Boolean = false) : Text(TEXTINPUTTYPE.PASSWORD, placeholder, value, name, maxlength,
+        label, rich, disabled)
diff --git a/src/main/kotlin/pl/treksoft/kvision/form/Text.kt b/src/main/kotlin/pl/treksoft/kvision/form/Text.kt
new file mode 100644
index 00000000..0980099f
--- /dev/null
+++ b/src/main/kotlin/pl/treksoft/kvision/form/Text.kt
@@ -0,0 +1,75 @@
+package pl.treksoft.kvision.form
+
+import pl.treksoft.kvision.core.Container
+
+
+open class Text(type: TEXTINPUTTYPE = TEXTINPUTTYPE.TEXT, placeholder: String? = null, value: String? = null,
+                name: String? = null, maxlength: Int? = null, label: String? = null, rich: Boolean = false,
+                disabled: Boolean = false) : Container(setOf("form-group")), StringFormField {
+
+    override var value
+        get() = input.value
+        set(value) {
+            input.value = value
+        }
+    var startValue
+        get() = input.startValue
+        set(value) {
+            input.startValue = value
+        }
+    var type
+        get() = input.type
+        set(value) {
+            input.type = value
+        }
+    var placeholder
+        get() = input.placeholder
+        set(value) {
+            input.placeholder = value
+        }
+    var name
+        get() = input.name
+        set(value) {
+            input.name = value
+        }
+    var maxlength
+        get() = input.maxlength
+        set(value) {
+            input.maxlength = value
+        }
+    override var disabled
+        get() = input.disabled
+        set(value) {
+            input.disabled = value
+        }
+    var label
+        get() = flabel.text
+        set(value) {
+            flabel.text = value
+        }
+    var rich
+        get() = flabel.rich
+        set(value) {
+            flabel.rich = value
+        }
+    override var size
+        get() = input.size
+        set(value) {
+            input.size = value
+        }
+
+    private val idc = "kv_form_text_" + counter
+    internal val input: TextInput = TextInput(type, placeholder, value, name, maxlength, disabled, idc)
+    internal val flabel: FieldLabel = FieldLabel(idc, label, rich)
+
+    init {
+        this.addInternal(flabel)
+        this.addInternal(input)
+        counter++
+    }
+
+    companion object {
+        var counter = 0
+    }
+
+}
diff --git a/src/main/kotlin/pl/treksoft/kvision/form/TextInput.kt b/src/main/kotlin/pl/treksoft/kvision/form/TextInput.kt
new file mode 100644
index 00000000..a87cb164
--- /dev/null
+++ b/src/main/kotlin/pl/treksoft/kvision/form/TextInput.kt
@@ -0,0 +1,136 @@
+package pl.treksoft.kvision.form
+
+import com.github.snabbdom.VNode
+import pl.treksoft.kvision.core.Widget
+import pl.treksoft.kvision.snabbdom.StringBoolPair
+import pl.treksoft.kvision.snabbdom.StringPair
+
+enum class TEXTINPUTTYPE(val type: String) {
+    TEXT("text"),
+    PASSWORD("password")
+}
+
+class TextInput(type: TEXTINPUTTYPE = TEXTINPUTTYPE.TEXT, placeholder: String? = null,
+                override var value: String? = null, name: String? = null, maxlength: Int? = null,
+                disabled: Boolean = false, id: String? = null,
+                classes: Set<String> = setOf()) : Widget(classes + "form-control"), StringFormField {
+    init {
+        this.id = id
+    }
+
+    @Suppress("LeakingThis")
+    var startValue: String? = value
+        set(value) {
+            field = value
+            this.value = value
+            refresh()
+        }
+    var type: TEXTINPUTTYPE = type
+        set(value) {
+            field = value
+            refresh()
+        }
+    var placeholder: String? = placeholder
+        set(value) {
+            field = value
+            refresh()
+        }
+    var name: String? = name
+        set(value) {
+            field = value
+            refresh()
+        }
+    var maxlength: Int? = maxlength
+        set(value) {
+            field = value
+            refresh()
+        }
+    override var disabled: Boolean = disabled
+        set(value) {
+            field = value
+            refresh()
+        }
+
+    var autocomplete: Boolean? = null
+        set(value) {
+            field = value
+            refresh()
+        }
+    var autofocus: Boolean? = null
+        set(value) {
+            field = value
+            refresh()
+        }
+    var readonly: Boolean? = null
+        set(value) {
+            field = value
+            refresh()
+        }
+    override var size: INPUTSIZE? = null
+        set(value) {
+            field = value
+            refresh()
+        }
+
+    override fun render(): VNode {
+        return kvh("input")
+    }
+
+    override fun getSnClass(): List<StringBoolPair> {
+        val cl = super.getSnClass().toMutableList()
+        size?.let {
+            cl.add(it.className to true)
+        }
+        return cl
+    }
+
+    @Suppress("ComplexMethod")
+    override fun getSnAttrs(): List<StringPair> {
+        val sn = super.getSnAttrs().toMutableList()
+        sn.add("type" to type.type)
+        placeholder?.let {
+            sn.add("placeholder" to it)
+        }
+        startValue?.let {
+            sn.add("value" to it)
+        }
+        name?.let {
+            sn.add("name" to it)
+        }
+        autocomplete?.let {
+            if (it) {
+                sn.add("autocomplete" to "on")
+            } else {
+                sn.add("autocomplete" to "off")
+            }
+        }
+        autofocus?.let {
+            if (it) {
+                sn.add("autofocus" to "autofocus")
+            }
+        }
+        maxlength?.let {
+            sn.add("maxlength" to ("" + it))
+        }
+        readonly?.let {
+            if (it) {
+                sn.add("readonly" to "readonly")
+            }
+        }
+        if (disabled) {
+            sn.add("disabled" to "disabled")
+        }
+        return sn
+    }
+
+    override fun afterInsert(node: VNode) {
+        this.getElementJQuery()?.on("input", { _, _ ->
+            val v = getElementJQuery()?.`val`() as String?
+            if (v != null && v.isNotEmpty()) {
+                value = v
+            } else {
+                value = null
+            }
+        })
+    }
+}
diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Button.kt b/src/main/kotlin/pl/treksoft/kvision/html/Button.kt
index d10cb8cd..f0cb91f7 100644
--- a/src/main/kotlin/pl/treksoft/kvision/html/Button.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/html/Button.kt
@@ -23,8 +23,8 @@ enum class BUTTONSIZE(val className: String) {
 }
 
 open class Button(text: String, icon: String? = null, style: BUTTONSTYLE = BUTTONSTYLE.DEFAULT,
-                  size: BUTTONSIZE? = null, block: Boolean = false, disabled: Boolean = false,
-                  image: ResString? = null, classes: Set<String> = setOf()) : Widget(classes) {
+                  disabled: Boolean = false, image: ResString? = null,
+                  classes: Set<String> = setOf()) : Widget(classes) {
     var text = text
         set(value) {
             field = value
@@ -40,22 +40,23 @@ open class Button(text: String, icon: String? = null, style: BUTTONSTYLE = BUTTO
             field = value
             refresh()
         }
-    var size = size
+    var disabled = disabled
         set(value) {
             field = value
             refresh()
         }
-    var block = block
+    var image = image
         set(value) {
             field = value
             refresh()
         }
-    var disabled = disabled
+
+    var size: BUTTONSIZE? = null
         set(value) {
             field = value
             refresh()
         }
-    var image = image
+    var block = false
         set(value) {
             field = value
             refresh()
diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Tag.kt b/src/main/kotlin/pl/treksoft/kvision/html/Tag.kt
index da964f6e..70725d97 100644
--- a/src/main/kotlin/pl/treksoft/kvision/html/Tag.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/html/Tag.kt
@@ -22,6 +22,7 @@ enum class TAG(val tagName: String) {
     UL("ul"),
     OL("ol"),
     DIV("div"),
+    LABEL("label"),
 
     MARK("mark"),
     DEL("del"),
diff --git a/src/main/kotlin/pl/treksoft/kvision/panel/SplitPanel.kt b/src/main/kotlin/pl/treksoft/kvision/panel/SplitPanel.kt
index 9084742a..06f9be59 100644
--- a/src/main/kotlin/pl/treksoft/kvision/panel/SplitPanel.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/panel/SplitPanel.kt
@@ -4,7 +4,7 @@ import com.github.snabbdom.VNode
 import pl.treksoft.jquery.JQuery
 import pl.treksoft.jquery.JQueryEventObject
 import pl.treksoft.kvision.core.Container
-import pl.treksoft.kvision.css.UNIT
+import pl.treksoft.kvision.core.UNIT
 import pl.treksoft.kvision.html.TAG
 import pl.treksoft.kvision.html.Tag
 import pl.treksoft.kvision.snabbdom.obj
diff --git a/src/main/kotlin/pl/treksoft/kvision/utils/Utils.kt b/src/main/kotlin/pl/treksoft/kvision/utils/Utils.kt
index 5a9bf5a6..9c88326b 100644
--- a/src/main/kotlin/pl/treksoft/kvision/utils/Utils.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/utils/Utils.kt
@@ -1,8 +1,8 @@
 @file:Suppress("TooManyFunctions")
 package pl.treksoft.kvision.utils
 
-import pl.treksoft.kvision.css.CssSize
-import pl.treksoft.kvision.css.UNIT
+import pl.treksoft.kvision.core.CssSize
+import pl.treksoft.kvision.core.UNIT
 
 fun Int.px(): CssSize = Pair(this, UNIT.px)
 fun Int.em(): CssSize = Pair(this, UNIT.em)