From 3ef71f681eeb1a832bbd0f95d01958617529bae7 Mon Sep 17 00:00:00 2001
From: Robert Jaros <rjaros@finn.pl>
Date: Thu, 19 Oct 2017 12:04:37 +0200
Subject: Refactoring styled component Form controls: input, password, checkbox

---
 src/main/kotlin/pl/treksoft/kvision/Showcase.kt    |  50 +++-
 src/main/kotlin/pl/treksoft/kvision/core/Css.kt    | 290 ++++++++++++++++++++
 .../kotlin/pl/treksoft/kvision/core/KVManager.kt   |   1 +
 .../pl/treksoft/kvision/core/StyledComponent.kt    |   5 -
 src/main/kotlin/pl/treksoft/kvision/css/Css.kt     | 291 ---------------------
 .../pl/treksoft/kvision/dropdown/DropDown.kt       |  10 +-
 .../kotlin/pl/treksoft/kvision/form/CheckBox.kt    | 110 ++++++++
 .../pl/treksoft/kvision/form/CheckBoxInput.kt      |  78 ++++++
 .../kotlin/pl/treksoft/kvision/form/FieldLabel.kt  |  14 +
 .../kotlin/pl/treksoft/kvision/form/FormField.kt   |  27 ++
 .../kotlin/pl/treksoft/kvision/form/Password.kt    |   6 +
 src/main/kotlin/pl/treksoft/kvision/form/Text.kt   |  75 ++++++
 .../kotlin/pl/treksoft/kvision/form/TextInput.kt   | 136 ++++++++++
 src/main/kotlin/pl/treksoft/kvision/html/Button.kt |  13 +-
 src/main/kotlin/pl/treksoft/kvision/html/Tag.kt    |   1 +
 .../kotlin/pl/treksoft/kvision/panel/SplitPanel.kt |   2 +-
 src/main/kotlin/pl/treksoft/kvision/utils/Utils.kt |   4 +-
 17 files changed, 792 insertions(+), 321 deletions(-)
 create mode 100644 src/main/kotlin/pl/treksoft/kvision/core/Css.kt
 delete mode 100644 src/main/kotlin/pl/treksoft/kvision/css/Css.kt
 create mode 100644 src/main/kotlin/pl/treksoft/kvision/form/CheckBox.kt
 create mode 100644 src/main/kotlin/pl/treksoft/kvision/form/CheckBoxInput.kt
 create mode 100644 src/main/kotlin/pl/treksoft/kvision/form/FieldLabel.kt
 create mode 100644 src/main/kotlin/pl/treksoft/kvision/form/FormField.kt
 create mode 100644 src/main/kotlin/pl/treksoft/kvision/form/Password.kt
 create mode 100644 src/main/kotlin/pl/treksoft/kvision/form/Text.kt
 create mode 100644 src/main/kotlin/pl/treksoft/kvision/form/TextInput.kt

(limited to 'src/main/kotlin/pl')

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/core/Css.kt b/src/main/kotlin/pl/treksoft/kvision/core/Css.kt
new file mode 100644
index 00000000..eba7782a
--- /dev/null
+++ b/src/main/kotlin/pl/treksoft/kvision/core/Css.kt
@@ -0,0 +1,290 @@
+package pl.treksoft.kvision.core
+
+import pl.treksoft.kvision.utils.Utils
+
+@Suppress("EnumNaming", "EnumEntryName")
+enum class UNIT(val unit: String) {
+    px("px"),
+    pt("pt"),
+    em("em"),
+    cm("cm"),
+    mm("mm"),
+    `in`("in"),
+    pc("pc"),
+    ch("ch"),
+    rem("rem"),
+    vw("vw"),
+    vh("vh"),
+    vmin("vmin"),
+    vmax("vmax"),
+    perc("%")
+}
+
+typealias CssSize = Pair<Int, UNIT>
+
+enum class BORDERSTYLE(val borderStyle: String) {
+    NONE("none"),
+    HIDDEN("hidden"),
+    DOTTED("dotted"),
+    DASHED("dashed"),
+    SOLID("solid"),
+    DOUBLE("double"),
+    GROOVE("groove"),
+    RIDGE("ridge"),
+    INSET("inset"),
+    OUTSET("outset"),
+    INITIAL("initial"),
+    INHERIT("inherit")
+}
+
+enum class COLOR(val color: String) {
+    ALICEBLUE("aliceblue"),
+    ANTIQUEWHITE("antiquewhite"),
+    AQUA("aqua"),
+    AQUAMARINE("aquamarine"),
+    AZURE("azure"),
+    BEIGE("beige"),
+    BISQUE("bisque"),
+    BLACK("black"),
+    BLANCHEDALMOND("blanchedalmond"),
+    BLUE("blue"),
+    BLUEVIOLET("blueviolet"),
+    BROWN("brown"),
+    BURLYWOOD("burlywood"),
+    CADETBLUE("cadetblue"),
+    CHARTREUSE("chartreuse"),
+    CHOCOLATE("chocolate"),
+    CORAL("coral"),
+    CORNFLOWERBLUE("cornflowerblue"),
+    CORNSILK("cornsilk"),
+    CRIMSON("crimson"),
+    CYAN("cyan"),
+    DARKBLUE("darkblue"),
+    DARKCYAN("darkcyan"),
+    DARKGOLDENROD("darkgoldenrod"),
+    DARKGRAY("darkgray"),
+    DARKGREEN("darkgreen"),
+    DARKKHAKI("darkkhaki"),
+    DARKMAGENTA("darkmagenta"),
+    DARKOLIVEGREEN("darkolivegreen"),
+    DARKORANGE("darkorange"),
+    DARKORCHID("darkorchid"),
+    DARKRED("darkred"),
+    DARKSALMON("darksalmon"),
+    DARKSEAGREEN("darkseagreen"),
+    DARKSLATEBLUE("darkslateblue"),
+    DARKSLATEGRAY("darkslategray"),
+    DARKTURQUOISE("darkturquoise"),
+    DARKVIOLET("darkviolet"),
+    DEEPPINK("deeppink"),
+    DEEPSKYBLUE("deepskyblue"),
+    DIMGRAY("dimgray"),
+    DODGERBLUE("dodgerblue"),
+    FIREBRICK("firebrick"),
+    FLORALWHITE("floralwhite"),
+    FORESTGREEN("forestgreen"),
+    FUCHSIA("fuchsia"),
+    GAINSBORO("gainsboro"),
+    GHOSTWHITE("ghostwhite"),
+    GOLD("gold"),
+    GOLDENROD("goldenrod"),
+    GRAY("gray"),
+    GREEN("green"),
+    GREENYELLOW("greenyellow"),
+    HONEYDEW("honeydew"),
+    HOTPINK("hotpink"),
+    INDIANRED("indianred"),
+    INDIGO("indigo"),
+    IVORY("ivory"),
+    KHAKI("khaki"),
+    LAVENDER("lavender"),
+    LAVENDERBLUSH("lavenderblush"),
+    LAWNGREEN("lawngreen"),
+    LEMONCHIFFON("lemonchiffon"),
+    LIGHTBLUE("lightblue"),
+    LIGHTCORAL("lightcoral"),
+    LIGHTCYAN("lightcyan"),
+    LIGHTGOLDENRODYELLOW("lightgoldenrodyellow"),
+    LIGHTGRAY("lightgray"),
+    LIGHTGREEN("lightgreen"),
+    LIGHTPINK("lightpink"),
+    LIGHTSALMON("lightsalmon"),
+    LIGHTSEAGREEN("lightseagreen"),
+    LIGHTSKYBLUE("lightskyblue"),
+    LIGHTSLATEGRAY("lightslategray"),
+    LIGHTSTEELBLUE("lightsteelblue"),
+    LIGHTYELLOW("lightyellow"),
+    LIME("lime"),
+    LIMEGREEN("limegreen"),
+    LINEN("linen"),
+    MAGENTA("magenta"),
+    MAROON("maroon"),
+    MEDIUMAQUAMARINE("mediumaquamarine"),
+    MEDIUMBLUE("mediumblue"),
+    MEDIUMORCHID("mediumorchid"),
+    MEDIUMPURPLE("mediumpurple"),
+    MEDIUMSEAGREEN("mediumseagreen"),
+    MEDIUMSLATEBLUE("mediumslateblue"),
+    MEDIUMSPRINGGREEN("mediumspringgreen"),
+    MEDIUMTURQUOISE("mediumturquoise"),
+    MEDIUMVIOLETRED("mediumvioletred"),
+    MIDNIGHTBLUE("midnightblue"),
+    MINTCREAM("mintcream"),
+    MISTYROSE("mistyrose"),
+    MOCCASIN("moccasin"),
+    NAVAJOWHITE("navajowhite"),
+    NAVY("navy"),
+    OLDLACE("oldlace"),
+    OLIVE("olive"),
+    OLIVEDRAB("olivedrab"),
+    ORANGE("orange"),
+    ORANGERED("orangered"),
+    ORCHID("orchid"),
+    PALEGOLDENROD("palegoldenrod"),
+    PALEGREEN("palegreen"),
+    PALETURQUOISE("paleturquoise"),
+    PALEVIOLETRED("palevioletred"),
+    PAPAYAWHIP("papayawhip"),
+    PEACHPUFF("peachpuff"),
+    PERU("peru"),
+    PINK("pink"),
+    PLUM("plum"),
+    POWDERBLUE("powderblue"),
+    PURPLE("purple"),
+    REBECCAPURPLE("rebeccapurple"),
+    RED("red"),
+    ROSYBROWN("rosybrown"),
+    ROYALBLUE("royalblue"),
+    SADDLEBROWN("saddlebrown"),
+    SALMON("salmon"),
+    SANDYBROWN("sandybrown"),
+    SEAGREEN("seagreen"),
+    SEASHELL("seashell"),
+    SIENNA("sienna"),
+    SILVER("silver"),
+    SKYBLUE("skyblue"),
+    SLATEBLUE("slateblue"),
+    SLATEGRAY("slategray"),
+    SNOW("snow"),
+    SPRINGGREEN("springgreen"),
+    STEELBLUE("steelblue"),
+    TAN("tan"),
+    TEAL("teal"),
+    THISTLE("thistle"),
+    TOMATO("tomato"),
+    TURQUOISE("turquoise"),
+    VIOLET("violet"),
+    WHEAT("wheat"),
+    WHITE("white"),
+    WHITESMOKE("whitesmoke"),
+    YELLOW("yellow"),
+    YELLOWGREEN("yellowgreen")
+}
+
+enum class BGSIZE(val size: String) {
+    COVER("cover"),
+    CONTAIN("contain")
+}
+
+enum class BGREPEAT(val repeat: String) {
+    REPEAT("repeat"),
+    REPEATX("repeat-x"),
+    REPEATY("repeat-y"),
+    NOREPEAT("no-repeat")
+}
+
+enum class BGATTACH(val attachment: String) {
+    SCROLL("scroll"),
+    FIXED("fixed"),
+    LOCAL("local")
+}
+
+enum class BGORIGIN(val origin: String) {
+    PADDING("padding-box"),
+    BORDER("border-box"),
+    CONTENT("content-box")
+}
+
+enum class BGCLIP(val clip: String) {
+    PADDING("padding-box"),
+    BORDER("border-box"),
+    CONTENT("content-box")
+}
+
+class Border private constructor(private val width: CssSize? = null, private val style: BORDERSTYLE? = null,
+                                 private val color: String? = null) {
+    constructor(width: CssSize? = null, style: BORDERSTYLE? = null) : this(width, style, null)
+    constructor(width: CssSize? = null, style: BORDERSTYLE? = null, color: Int) : this(width, style,
+            "#" + Utils.intToHexString(color))
+
+    constructor(width: CssSize? = null, style: BORDERSTYLE? = null, color: COLOR) : this(width, style, color.color)
+
+    fun asString(): String {
+        val w = width?.let {
+            it.first.toString() + it.second.unit
+        }
+        return w.orEmpty() + " " + (style?.borderStyle).orEmpty() + " " + color.orEmpty()
+    }
+}
+
+class Color private constructor(private val color: String? = null) {
+    constructor(color: Int) : this("#" + Utils.intToHexString(color))
+    constructor(color: COLOR) : this(color.color)
+
+    fun asString(): String {
+        return color.orEmpty()
+    }
+}
+
+class Background private constructor(private val color: String? = null, private val image: ResString? = null,
+                                     private val positionX: CssSize? = null, private val positionY: CssSize? = null,
+                                     private val sizeX: CssSize? = null, private val sizeY: CssSize? = null,
+                                     private val size: BGSIZE? = null, private val repeat: BGREPEAT? = null,
+                                     private val origin: BGORIGIN? = null, private val clip: BGCLIP? = null,
+                                     private val attachment: BGATTACH? = null) {
+    constructor(image: ResString? = null, positionX: CssSize? = null, positionY: CssSize? = null,
+                sizeX: CssSize? = null, sizeY: CssSize? = null, size: BGSIZE? = null,
+                repeat: BGREPEAT? = null, origin: BGORIGIN? = null, clip: BGCLIP? = null,
+                attachment: BGATTACH? = null) : this(null,
+            image, positionX, positionY, sizeX, sizeY, size, repeat, origin, clip, attachment)
+
+    constructor(color: Int, image: ResString? = null, positionX: CssSize? = null,
+                positionY: CssSize? = null,
+                sizeX: CssSize? = null, sizeY: CssSize? = null, size: BGSIZE? = null,
+                repeat: BGREPEAT? = null, origin: BGORIGIN? = null, clip: BGCLIP? = null,
+                attachment: BGATTACH? = null) : this("#" +
+            Utils.intToHexString(color), image, positionX, positionY, sizeX, sizeY, size, repeat, origin, clip,
+            attachment)
+
+    constructor(color: COLOR, image: ResString? = null, positionX: CssSize? = null,
+                positionY: CssSize? = null, sizeX: CssSize? = null, sizeY: CssSize? = null,
+                size: BGSIZE? = null, repeat: BGREPEAT? = null, origin: BGORIGIN? = null, clip: BGCLIP? = null,
+                attachment: BGATTACH? = null) : this(color.color, image,
+            positionX, positionY, sizeX, sizeY, size, repeat, origin, clip, attachment)
+
+    fun asString(): String {
+        val img = image?.let {
+            "url($image)"
+        }
+        val posX = positionX?.let {
+            it.first.toString() + it.second.unit
+        }
+        val posY = positionY?.let {
+            it.first.toString() + it.second.unit
+        }
+        val sX = sizeX?.let {
+            it.first.toString() + it.second.unit
+        }
+        val sY = sizeY?.let {
+            it.first.toString() + it.second.unit
+        }
+        return color.orEmpty() + " " + img.orEmpty() + " " + posX.orEmpty() + " " + posY.orEmpty() +
+                if (sX != null || sY != null || size != null) {
+                    (if (posX != null || posY != null) " / " else " 0px 0px / ") +
+                            sX.orEmpty() + " " + sY.orEmpty() + " " + (size?.size).orEmpty()
+                } else {
+                    ""
+                } + " " + (repeat?.repeat).orEmpty() + " " + (origin?.origin).orEmpty() + " " +
+                (clip?.clip).orEmpty() + " " + (attachment?.attachment).orEmpty()
+    }
+}
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/css/Css.kt b/src/main/kotlin/pl/treksoft/kvision/css/Css.kt
deleted file mode 100644
index e2a4122b..00000000
--- a/src/main/kotlin/pl/treksoft/kvision/css/Css.kt
+++ /dev/null
@@ -1,291 +0,0 @@
-package pl.treksoft.kvision.css
-
-import pl.treksoft.kvision.core.ResString
-import pl.treksoft.kvision.utils.Utils
-
-@Suppress("EnumNaming", "EnumEntryName")
-enum class UNIT(val unit: String) {
-    px("px"),
-    pt("pt"),
-    em("em"),
-    cm("cm"),
-    mm("mm"),
-    `in`("in"),
-    pc("pc"),
-    ch("ch"),
-    rem("rem"),
-    vw("vw"),
-    vh("vh"),
-    vmin("vmin"),
-    vmax("vmax"),
-    perc("%")
-}
-
-typealias CssSize = Pair<Int, UNIT>
-
-enum class BORDERSTYLE(val borderStyle: String) {
-    NONE("none"),
-    HIDDEN("hidden"),
-    DOTTED("dotted"),
-    DASHED("dashed"),
-    SOLID("solid"),
-    DOUBLE("double"),
-    GROOVE("groove"),
-    RIDGE("ridge"),
-    INSET("inset"),
-    OUTSET("outset"),
-    INITIAL("initial"),
-    INHERIT("inherit")
-}
-
-enum class COLOR(val color: String) {
-    ALICEBLUE("aliceblue"),
-    ANTIQUEWHITE("antiquewhite"),
-    AQUA("aqua"),
-    AQUAMARINE("aquamarine"),
-    AZURE("azure"),
-    BEIGE("beige"),
-    BISQUE("bisque"),
-    BLACK("black"),
-    BLANCHEDALMOND("blanchedalmond"),
-    BLUE("blue"),
-    BLUEVIOLET("blueviolet"),
-    BROWN("brown"),
-    BURLYWOOD("burlywood"),
-    CADETBLUE("cadetblue"),
-    CHARTREUSE("chartreuse"),
-    CHOCOLATE("chocolate"),
-    CORAL("coral"),
-    CORNFLOWERBLUE("cornflowerblue"),
-    CORNSILK("cornsilk"),
-    CRIMSON("crimson"),
-    CYAN("cyan"),
-    DARKBLUE("darkblue"),
-    DARKCYAN("darkcyan"),
-    DARKGOLDENROD("darkgoldenrod"),
-    DARKGRAY("darkgray"),
-    DARKGREEN("darkgreen"),
-    DARKKHAKI("darkkhaki"),
-    DARKMAGENTA("darkmagenta"),
-    DARKOLIVEGREEN("darkolivegreen"),
-    DARKORANGE("darkorange"),
-    DARKORCHID("darkorchid"),
-    DARKRED("darkred"),
-    DARKSALMON("darksalmon"),
-    DARKSEAGREEN("darkseagreen"),
-    DARKSLATEBLUE("darkslateblue"),
-    DARKSLATEGRAY("darkslategray"),
-    DARKTURQUOISE("darkturquoise"),
-    DARKVIOLET("darkviolet"),
-    DEEPPINK("deeppink"),
-    DEEPSKYBLUE("deepskyblue"),
-    DIMGRAY("dimgray"),
-    DODGERBLUE("dodgerblue"),
-    FIREBRICK("firebrick"),
-    FLORALWHITE("floralwhite"),
-    FORESTGREEN("forestgreen"),
-    FUCHSIA("fuchsia"),
-    GAINSBORO("gainsboro"),
-    GHOSTWHITE("ghostwhite"),
-    GOLD("gold"),
-    GOLDENROD("goldenrod"),
-    GRAY("gray"),
-    GREEN("green"),
-    GREENYELLOW("greenyellow"),
-    HONEYDEW("honeydew"),
-    HOTPINK("hotpink"),
-    INDIANRED("indianred"),
-    INDIGO("indigo"),
-    IVORY("ivory"),
-    KHAKI("khaki"),
-    LAVENDER("lavender"),
-    LAVENDERBLUSH("lavenderblush"),
-    LAWNGREEN("lawngreen"),
-    LEMONCHIFFON("lemonchiffon"),
-    LIGHTBLUE("lightblue"),
-    LIGHTCORAL("lightcoral"),
-    LIGHTCYAN("lightcyan"),
-    LIGHTGOLDENRODYELLOW("lightgoldenrodyellow"),
-    LIGHTGRAY("lightgray"),
-    LIGHTGREEN("lightgreen"),
-    LIGHTPINK("lightpink"),
-    LIGHTSALMON("lightsalmon"),
-    LIGHTSEAGREEN("lightseagreen"),
-    LIGHTSKYBLUE("lightskyblue"),
-    LIGHTSLATEGRAY("lightslategray"),
-    LIGHTSTEELBLUE("lightsteelblue"),
-    LIGHTYELLOW("lightyellow"),
-    LIME("lime"),
-    LIMEGREEN("limegreen"),
-    LINEN("linen"),
-    MAGENTA("magenta"),
-    MAROON("maroon"),
-    MEDIUMAQUAMARINE("mediumaquamarine"),
-    MEDIUMBLUE("mediumblue"),
-    MEDIUMORCHID("mediumorchid"),
-    MEDIUMPURPLE("mediumpurple"),
-    MEDIUMSEAGREEN("mediumseagreen"),
-    MEDIUMSLATEBLUE("mediumslateblue"),
-    MEDIUMSPRINGGREEN("mediumspringgreen"),
-    MEDIUMTURQUOISE("mediumturquoise"),
-    MEDIUMVIOLETRED("mediumvioletred"),
-    MIDNIGHTBLUE("midnightblue"),
-    MINTCREAM("mintcream"),
-    MISTYROSE("mistyrose"),
-    MOCCASIN("moccasin"),
-    NAVAJOWHITE("navajowhite"),
-    NAVY("navy"),
-    OLDLACE("oldlace"),
-    OLIVE("olive"),
-    OLIVEDRAB("olivedrab"),
-    ORANGE("orange"),
-    ORANGERED("orangered"),
-    ORCHID("orchid"),
-    PALEGOLDENROD("palegoldenrod"),
-    PALEGREEN("palegreen"),
-    PALETURQUOISE("paleturquoise"),
-    PALEVIOLETRED("palevioletred"),
-    PAPAYAWHIP("papayawhip"),
-    PEACHPUFF("peachpuff"),
-    PERU("peru"),
-    PINK("pink"),
-    PLUM("plum"),
-    POWDERBLUE("powderblue"),
-    PURPLE("purple"),
-    REBECCAPURPLE("rebeccapurple"),
-    RED("red"),
-    ROSYBROWN("rosybrown"),
-    ROYALBLUE("royalblue"),
-    SADDLEBROWN("saddlebrown"),
-    SALMON("salmon"),
-    SANDYBROWN("sandybrown"),
-    SEAGREEN("seagreen"),
-    SEASHELL("seashell"),
-    SIENNA("sienna"),
-    SILVER("silver"),
-    SKYBLUE("skyblue"),
-    SLATEBLUE("slateblue"),
-    SLATEGRAY("slategray"),
-    SNOW("snow"),
-    SPRINGGREEN("springgreen"),
-    STEELBLUE("steelblue"),
-    TAN("tan"),
-    TEAL("teal"),
-    THISTLE("thistle"),
-    TOMATO("tomato"),
-    TURQUOISE("turquoise"),
-    VIOLET("violet"),
-    WHEAT("wheat"),
-    WHITE("white"),
-    WHITESMOKE("whitesmoke"),
-    YELLOW("yellow"),
-    YELLOWGREEN("yellowgreen")
-}
-
-enum class BGSIZE(val size: String) {
-    COVER("cover"),
-    CONTAIN("contain")
-}
-
-enum class BGREPEAT(val repeat: String) {
-    REPEAT("repeat"),
-    REPEATX("repeat-x"),
-    REPEATY("repeat-y"),
-    NOREPEAT("no-repeat")
-}
-
-enum class BGATTACH(val attachment: String) {
-    SCROLL("scroll"),
-    FIXED("fixed"),
-    LOCAL("local")
-}
-
-enum class BGORIGIN(val origin: String) {
-    PADDING("padding-box"),
-    BORDER("border-box"),
-    CONTENT("content-box")
-}
-
-enum class BGCLIP(val clip: String) {
-    PADDING("padding-box"),
-    BORDER("border-box"),
-    CONTENT("content-box")
-}
-
-class Border private constructor(private val width: CssSize? = null, private val style: BORDERSTYLE? = null,
-                                 private val color: String? = null) {
-    constructor(width: CssSize? = null, style: BORDERSTYLE? = null) : this(width, style, null)
-    constructor(width: CssSize? = null, style: BORDERSTYLE? = null, color: Int) : this(width, style,
-            "#" + Utils.intToHexString(color))
-
-    constructor(width: CssSize? = null, style: BORDERSTYLE? = null, color: COLOR) : this(width, style, color.color)
-
-    fun asString(): String {
-        val w = width?.let {
-            it.first.toString() + it.second.unit
-        }
-        return w.orEmpty() + " " + (style?.borderStyle).orEmpty() + " " + color.orEmpty()
-    }
-}
-
-class Color private constructor(private val color: String? = null) {
-    constructor(color: Int) : this("#" + Utils.intToHexString(color))
-    constructor(color: COLOR) : this(color.color)
-
-    fun asString(): String {
-        return color.orEmpty()
-    }
-}
-
-class Background private constructor(private val color: String? = null, private val image: ResString? = null,
-                                     private val positionX: CssSize? = null, private val positionY: CssSize? = null,
-                                     private val sizeX: CssSize? = null, private val sizeY: CssSize? = null,
-                                     private val size: BGSIZE? = null, private val repeat: BGREPEAT? = null,
-                                     private val origin: BGORIGIN? = null, private val clip: BGCLIP? = null,
-                                     private val attachment: BGATTACH? = null) {
-    constructor(image: ResString? = null, positionX: CssSize? = null, positionY: CssSize? = null,
-                sizeX: CssSize? = null, sizeY: CssSize? = null, size: BGSIZE? = null,
-                repeat: BGREPEAT? = null, origin: BGORIGIN? = null, clip: BGCLIP? = null,
-                attachment: BGATTACH? = null) : this(null,
-            image, positionX, positionY, sizeX, sizeY, size, repeat, origin, clip, attachment)
-
-    constructor(color: Int, image: ResString? = null, positionX: CssSize? = null,
-                positionY: CssSize? = null,
-                sizeX: CssSize? = null, sizeY: CssSize? = null, size: BGSIZE? = null,
-                repeat: BGREPEAT? = null, origin: BGORIGIN? = null, clip: BGCLIP? = null,
-                attachment: BGATTACH? = null) : this("#" +
-            Utils.intToHexString(color), image, positionX, positionY, sizeX, sizeY, size, repeat, origin, clip,
-            attachment)
-
-    constructor(color: COLOR, image: ResString? = null, positionX: CssSize? = null,
-                positionY: CssSize? = null, sizeX: CssSize? = null, sizeY: CssSize? = null,
-                size: BGSIZE? = null, repeat: BGREPEAT? = null, origin: BGORIGIN? = null, clip: BGCLIP? = null,
-                attachment: BGATTACH? = null) : this(color.color, image,
-            positionX, positionY, sizeX, sizeY, size, repeat, origin, clip, attachment)
-
-    fun asString(): String {
-        val img = image?.let {
-            "url($image)"
-        }
-        val posX = positionX?.let {
-            it.first.toString() + it.second.unit
-        }
-        val posY = positionY?.let {
-            it.first.toString() + it.second.unit
-        }
-        val sX = sizeX?.let {
-            it.first.toString() + it.second.unit
-        }
-        val sY = sizeY?.let {
-            it.first.toString() + it.second.unit
-        }
-        return color.orEmpty() + " " + img.orEmpty() + " " + posX.orEmpty() + " " + posY.orEmpty() +
-                if (sX != null || sY != null || size != null) {
-                    (if (posX != null || posY != null) " / " else " 0px 0px / ") +
-                            sX.orEmpty() + " " + sY.orEmpty() + " " + (size?.size).orEmpty()
-                } else {
-                    ""
-                } + " " + (repeat?.repeat).orEmpty() + " " + (origin?.origin).orEmpty() + " " +
-                (clip?.clip).orEmpty() + " " + (attachment?.attachment).orEmpty()
-    }
-}
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)
-- 
cgit