diff options
Diffstat (limited to 'src/main/kotlin/pl/treksoft/kvision')
54 files changed, 367 insertions, 110 deletions
diff --git a/src/main/kotlin/pl/treksoft/kvision/core/Widget.kt b/src/main/kotlin/pl/treksoft/kvision/core/Widget.kt index 2d2fac29..d077415e 100644 --- a/src/main/kotlin/pl/treksoft/kvision/core/Widget.kt +++ b/src/main/kotlin/pl/treksoft/kvision/core/Widget.kt @@ -38,6 +38,7 @@ import pl.treksoft.kvision.utils.SnOn import pl.treksoft.kvision.utils.emptyOn import pl.treksoft.kvision.utils.hooks import pl.treksoft.kvision.utils.on +import pl.treksoft.kvision.utils.set import pl.treksoft.kvision.utils.snAttrs import pl.treksoft.kvision.utils.snClasses import pl.treksoft.kvision.utils.snOpt @@ -121,10 +122,12 @@ open class Widget(classes: Set<String> = setOf()) : StyledComponent(), Component * A function called after the widget is inserted to the DOM. */ var afterInsertHook: ((VNode) -> Unit)? = null + /** * A function called after the widget is removed from the DOM. */ var afterDestroyHook: (() -> Unit)? = null + /** * A function called after the widget is disposed. */ @@ -756,13 +759,26 @@ open class Widget(classes: Set<String> = setOf()) : StyledComponent(), Component */ protected open fun createLabelWithIcon( label: String, icon: String? = null, - image: ResString? = null + image: ResString? = null, + separator: String? = null ): Array<out Any> { val translatedLabel = translate(label) return if (icon != null) { - arrayOf(KVManager.virtualize("<i class='$icon'></i>"), " $translatedLabel") + if (separator == null) { + arrayOf(KVManager.virtualize("<i class='$icon'></i>"), " $translatedLabel") + } else { + arrayOf(KVManager.virtualize("<i class='$icon'></i>"), KVManager.virtualize(separator), translatedLabel) + } } else if (image != null) { - arrayOf(KVManager.virtualize("<img src='$image' alt='' />"), " $translatedLabel") + if (separator == null) { + arrayOf(KVManager.virtualize("<img src='$image' alt='' />"), " $translatedLabel") + } else { + arrayOf( + KVManager.virtualize("<img src='$image' alt='' />"), + KVManager.virtualize(separator), + translatedLabel + ) + } } else { arrayOf(translatedLabel) } @@ -842,8 +858,12 @@ open class Widget(classes: Set<String> = setOf()) : StyledComponent(), Component * * It takes the same parameters as the constructor of the built component. */ -fun Container.widget(classes: Set<String> = setOf(), init: (Widget.() -> Unit)? = null): Widget { - val widget = Widget(classes).apply { init?.invoke(this) } +fun Container.widget( + classes: Set<String>? = null, + className: String? = null, + init: (Widget.() -> Unit)? = null +): Widget { + val widget = Widget(classes ?: className.set).apply { init?.invoke(this) } this.add(widget) return widget } diff --git a/src/main/kotlin/pl/treksoft/kvision/core/WidgetWrapper.kt b/src/main/kotlin/pl/treksoft/kvision/core/WidgetWrapper.kt index 1d5ada90..aec7c7ab 100644 --- a/src/main/kotlin/pl/treksoft/kvision/core/WidgetWrapper.kt +++ b/src/main/kotlin/pl/treksoft/kvision/core/WidgetWrapper.kt @@ -23,6 +23,7 @@ package pl.treksoft.kvision.core import com.github.snabbdom.VNode import pl.treksoft.kvision.panel.SimplePanel +import pl.treksoft.kvision.utils.set /** * This class allows to wrap a component into separately styled DIV element. @@ -63,10 +64,11 @@ open class WidgetWrapper(internal var wrapped: Component?, classes: Set<String> */ fun Container.widgetWrapper( wrapped: Component?, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (WidgetWrapper.() -> Unit)? = null ): WidgetWrapper { - val widgetWrapper = WidgetWrapper(wrapped, classes).apply { init?.invoke(this) } + val widgetWrapper = WidgetWrapper(wrapped, classes ?: className.set).apply { init?.invoke(this) } this.add(widgetWrapper) return widgetWrapper } diff --git a/src/main/kotlin/pl/treksoft/kvision/form/FieldLabel.kt b/src/main/kotlin/pl/treksoft/kvision/form/FieldLabel.kt index 8413eb3c..e9be793c 100644 --- a/src/main/kotlin/pl/treksoft/kvision/form/FieldLabel.kt +++ b/src/main/kotlin/pl/treksoft/kvision/form/FieldLabel.kt @@ -25,6 +25,7 @@ import pl.treksoft.kvision.core.Container import pl.treksoft.kvision.core.StringPair import pl.treksoft.kvision.html.TAG import pl.treksoft.kvision.html.Tag +import pl.treksoft.kvision.utils.set /** * Helper class for HTML label element. @@ -37,7 +38,7 @@ import pl.treksoft.kvision.html.Tag */ open class FieldLabel( internal val forId: String, content: String? = null, rich: Boolean = false, - classes: Set<String> = setOf("control-label") + classes: Set<String> = setOf() ) : Tag( TAG.LABEL, content, rich, classes = classes @@ -55,9 +56,11 @@ open class FieldLabel( */ fun Container.fieldLabel( forId: String, content: String? = null, rich: Boolean = false, - classes: Set<String> = setOf("control-label"), init: (FieldLabel.() -> Unit)? = null + classes: Set<String>? = null, + className: String? = null, + init: (FieldLabel.() -> Unit)? = null ): FieldLabel { - val fieldLabel = FieldLabel(forId, content, rich, classes).apply { init?.invoke(this) } + val fieldLabel = FieldLabel(forId, content, rich, classes ?: className.set).apply { init?.invoke(this) } this.add(fieldLabel) return fieldLabel } diff --git a/src/main/kotlin/pl/treksoft/kvision/form/FormPanel.kt b/src/main/kotlin/pl/treksoft/kvision/form/FormPanel.kt index 8f918a97..7353179a 100644 --- a/src/main/kotlin/pl/treksoft/kvision/form/FormPanel.kt +++ b/src/main/kotlin/pl/treksoft/kvision/form/FormPanel.kt @@ -33,6 +33,7 @@ import pl.treksoft.kvision.html.Div import pl.treksoft.kvision.panel.FieldsetPanel import pl.treksoft.kvision.panel.SimplePanel import pl.treksoft.kvision.types.KFile +import pl.treksoft.kvision.utils.set import kotlin.js.Date import kotlin.js.Json import kotlin.reflect.KClass @@ -504,11 +505,13 @@ open class FormPanel<K : Any>( inline fun <reified K : Any> Container.formPanel( method: FormMethod? = null, action: String? = null, enctype: FormEnctype? = null, type: FormType? = null, condensed: Boolean = false, - horizRatio: FormHorizontalRatio = FormHorizontalRatio.RATIO_2, classes: Set<String> = setOf(), + horizRatio: FormHorizontalRatio = FormHorizontalRatio.RATIO_2, + classes: Set<String>? = null, className: String? = null, customSerializers: Map<KClass<*>, KSerializer<*>>? = null, noinline init: (FormPanel<K>.() -> Unit)? = null ): FormPanel<K> { - val formPanel = create<K>(method, action, enctype, type, condensed, horizRatio, classes, customSerializers) + val formPanel = + create<K>(method, action, enctype, type, condensed, horizRatio, classes ?: className.set, customSerializers) init?.invoke(formPanel) this.add(formPanel) return formPanel diff --git a/src/main/kotlin/pl/treksoft/kvision/form/check/CheckBoxInput.kt b/src/main/kotlin/pl/treksoft/kvision/form/check/CheckBoxInput.kt index ea8bf7db..5b91d635 100644 --- a/src/main/kotlin/pl/treksoft/kvision/form/check/CheckBoxInput.kt +++ b/src/main/kotlin/pl/treksoft/kvision/form/check/CheckBoxInput.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.form.check import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * The basic input component rendered as HTML *input type="checkbox"*. @@ -42,9 +43,11 @@ open class CheckBoxInput( */ fun Container.checkBoxInput( value: Boolean = false, - classes: Set<String> = setOf(), init: (CheckInput.() -> Unit)? = null + classes: Set<String>? = null, + className: String? = null, + init: (CheckInput.() -> Unit)? = null ): CheckBoxInput { - val checkBoxInput = CheckBoxInput(value, classes).apply { init?.invoke(this) } + val checkBoxInput = CheckBoxInput(value, classes ?: className.set).apply { init?.invoke(this) } this.add(checkBoxInput) return checkBoxInput } diff --git a/src/main/kotlin/pl/treksoft/kvision/form/check/RadioGroup.kt b/src/main/kotlin/pl/treksoft/kvision/form/check/RadioGroup.kt index b162abc8..234f5327 100644 --- a/src/main/kotlin/pl/treksoft/kvision/form/check/RadioGroup.kt +++ b/src/main/kotlin/pl/treksoft/kvision/form/check/RadioGroup.kt @@ -117,7 +117,7 @@ open class RadioGroup( private val idc = "kv_form_radiogroup_$counter" final override val input = RadioInput() - final override val flabel: FieldLabel = FieldLabel(idc, label, rich) + final override val flabel: FieldLabel = FieldLabel(idc, label, rich, setOf("control-label")) final override val invalidFeedback: InvalidFeedback = InvalidFeedback().apply { visible = false } internal val container = SimplePanel(setOf("kv-radiogroup-container")) diff --git a/src/main/kotlin/pl/treksoft/kvision/form/check/RadioInput.kt b/src/main/kotlin/pl/treksoft/kvision/form/check/RadioInput.kt index 72bb4cd0..1f8a3b9d 100644 --- a/src/main/kotlin/pl/treksoft/kvision/form/check/RadioInput.kt +++ b/src/main/kotlin/pl/treksoft/kvision/form/check/RadioInput.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.form.check import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * The basic input component rendered as HTML *input type="radio"*. @@ -42,9 +43,11 @@ open class RadioInput( */ fun Container.radioInput( value: Boolean = false, - classes: Set<String> = setOf(), init: (CheckInput.() -> Unit)? = null + classes: Set<String>? = null, + className: String? = null, + init: (CheckInput.() -> Unit)? = null ): RadioInput { - val checkBoxInput = RadioInput(value, classes).apply { init?.invoke(this) } + val checkBoxInput = RadioInput(value, classes ?: className.set).apply { init?.invoke(this) } this.add(checkBoxInput) return checkBoxInput } diff --git a/src/main/kotlin/pl/treksoft/kvision/form/range/Range.kt b/src/main/kotlin/pl/treksoft/kvision/form/range/Range.kt index a54ccddb..dc8e57a0 100644 --- a/src/main/kotlin/pl/treksoft/kvision/form/range/Range.kt +++ b/src/main/kotlin/pl/treksoft/kvision/form/range/Range.kt @@ -140,7 +140,7 @@ open class Range( this.id = idc this.name = name } - final override val flabel: FieldLabel = FieldLabel(idc, label, rich) + final override val flabel: FieldLabel = FieldLabel(idc, label, rich, setOf("control-label")) final override val invalidFeedback: InvalidFeedback = InvalidFeedback().apply { visible = false } init { diff --git a/src/main/kotlin/pl/treksoft/kvision/form/range/RangeInput.kt b/src/main/kotlin/pl/treksoft/kvision/form/range/RangeInput.kt index dc9ad7d4..4649c654 100644 --- a/src/main/kotlin/pl/treksoft/kvision/form/range/RangeInput.kt +++ b/src/main/kotlin/pl/treksoft/kvision/form/range/RangeInput.kt @@ -30,6 +30,7 @@ import pl.treksoft.kvision.core.Widget import pl.treksoft.kvision.form.FormInput import pl.treksoft.kvision.form.InputSize import pl.treksoft.kvision.form.ValidationStatus +import pl.treksoft.kvision.utils.set internal const val DEFAULT_STEP = 1 @@ -52,6 +53,7 @@ open class RangeInput( * Range input value. */ var value by refreshOnUpdate(value ?: (min as Number?)) { refreshState() } + /** * The value attribute of the generated HTML input element. * @@ -59,38 +61,47 @@ open class RangeInput( * bound to the range input value. */ var startValue by refreshOnUpdate(value) { this.value = it; refresh() } + /** * Minimal value. */ var min by refreshOnUpdate(min) + /** * Maximal value. */ var max by refreshOnUpdate(max) + /** * Step value. */ var step by refreshOnUpdate(step) + /** * The name attribute of the generated HTML input element. */ override var name: String? by refreshOnUpdate() + /** * Determines if the field is disabled. */ override var disabled by refreshOnUpdate(false) + /** * Determines if the range input is automatically focused. */ var autofocus: Boolean? by refreshOnUpdate() + /** * Determines if the range input is read-only. */ var readonly: Boolean? by refreshOnUpdate() + /** * The size of the input. */ override var size: InputSize? by refreshOnUpdate() + /** * The validation status of the input. */ @@ -221,9 +232,11 @@ open class RangeInput( */ fun Container.rangeInput( value: Number? = null, min: Number = 0, max: Number = 100, step: Number = DEFAULT_STEP, - classes: Set<String> = setOf(), init: (RangeInput.() -> Unit)? = null + classes: Set<String>? = null, + className: String? = null, + init: (RangeInput.() -> Unit)? = null ): RangeInput { - val rangeInput = RangeInput(value, min, max, step, classes).apply { init?.invoke(this) } + val rangeInput = RangeInput(value, min, max, step, classes ?: className.set).apply { init?.invoke(this) } this.add(rangeInput) return rangeInput } diff --git a/src/main/kotlin/pl/treksoft/kvision/form/select/SimpleSelect.kt b/src/main/kotlin/pl/treksoft/kvision/form/select/SimpleSelect.kt index 4d47a239..e797e050 100644 --- a/src/main/kotlin/pl/treksoft/kvision/form/select/SimpleSelect.kt +++ b/src/main/kotlin/pl/treksoft/kvision/form/select/SimpleSelect.kt @@ -116,7 +116,7 @@ open class SimpleSelect( this.id = idc this.name = name } - final override val flabel: FieldLabel = FieldLabel(idc, label, rich) + final override val flabel: FieldLabel = FieldLabel(idc, label, rich, setOf("control-label")) final override val invalidFeedback: InvalidFeedback = InvalidFeedback().apply { visible = false } init { diff --git a/src/main/kotlin/pl/treksoft/kvision/form/select/SimpleSelectInput.kt b/src/main/kotlin/pl/treksoft/kvision/form/select/SimpleSelectInput.kt index bc99f514..63eb98b5 100644 --- a/src/main/kotlin/pl/treksoft/kvision/form/select/SimpleSelectInput.kt +++ b/src/main/kotlin/pl/treksoft/kvision/form/select/SimpleSelectInput.kt @@ -31,6 +31,7 @@ import pl.treksoft.kvision.form.ValidationStatus import pl.treksoft.kvision.html.TAG import pl.treksoft.kvision.html.Tag import pl.treksoft.kvision.panel.SimplePanel +import pl.treksoft.kvision.utils.set internal const val KVNULL = "#kvnull" @@ -57,6 +58,7 @@ open class SimpleSelectInput( * Text input value. */ var value by refreshOnUpdate(value) { refreshState() } + /** * The value of the selected child option. * @@ -64,26 +66,32 @@ open class SimpleSelectInput( * bound to the select component. */ var startValue by refreshOnUpdate(value) { this.value = it; selectOption() } + /** * The name attribute of the generated HTML input element. */ override var name: String? by refreshOnUpdate() + /** * Determines if the field is disabled. */ override var disabled by refreshOnUpdate(false) + /** * Determines if the text input is automatically focused. */ var autofocus: Boolean? by refreshOnUpdate() + /** * Determines if an empty option is automatically generated. */ var emptyOption by refreshOnUpdate(emptyOption) { setChildrenFromOptions() } + /** * The size of the input. */ override var size: InputSize? by refreshOnUpdate() + /** * The validation status of the input. */ @@ -208,9 +216,12 @@ open class SimpleSelectInput( */ fun Container.simpleSelectInput( options: List<StringPair>? = null, value: String? = null, emptyOption: Boolean = false, - classes: Set<String> = setOf(), init: (SimpleSelectInput.() -> Unit)? = null + classes: Set<String>? = null, + className: String? = null, + init: (SimpleSelectInput.() -> Unit)? = null ): SimpleSelectInput { - val simpleSelectInput = SimpleSelectInput(options, value, emptyOption, classes).apply { init?.invoke(this) } + val simpleSelectInput = + SimpleSelectInput(options, value, emptyOption, classes ?: className.set).apply { init?.invoke(this) } this.add(simpleSelectInput) return simpleSelectInput } diff --git a/src/main/kotlin/pl/treksoft/kvision/form/text/AbstractText.kt b/src/main/kotlin/pl/treksoft/kvision/form/text/AbstractText.kt index d887e814..8a5acf8b 100644 --- a/src/main/kotlin/pl/treksoft/kvision/form/text/AbstractText.kt +++ b/src/main/kotlin/pl/treksoft/kvision/form/text/AbstractText.kt @@ -113,7 +113,7 @@ abstract class AbstractText(label: String? = null, rich: Boolean = false) : */ protected val idc = "kv_form_text_$counter" abstract override val input: AbstractTextInput - final override val flabel: FieldLabel = FieldLabel(idc, label, rich) + final override val flabel: FieldLabel = FieldLabel(idc, label, rich, setOf("control-label")) final override val invalidFeedback: InvalidFeedback = InvalidFeedback().apply { visible = false } init { diff --git a/src/main/kotlin/pl/treksoft/kvision/form/text/TextAreaInput.kt b/src/main/kotlin/pl/treksoft/kvision/form/text/TextAreaInput.kt index acad7853..9503a0b1 100644 --- a/src/main/kotlin/pl/treksoft/kvision/form/text/TextAreaInput.kt +++ b/src/main/kotlin/pl/treksoft/kvision/form/text/TextAreaInput.kt @@ -24,6 +24,7 @@ package pl.treksoft.kvision.form.text import com.github.snabbdom.VNode import pl.treksoft.kvision.core.Container import pl.treksoft.kvision.core.StringPair +import pl.treksoft.kvision.utils.set /** * Basic textarea component. @@ -41,10 +42,12 @@ open class TextAreaInput(cols: Int? = null, rows: Int? = null, value: String? = * Number of columns. */ var cols by refreshOnUpdate(cols) + /** * Number of rows. */ var rows by refreshOnUpdate(rows) + /** * Determines if hard wrapping is enabled for the textarea element. */ @@ -77,10 +80,12 @@ open class TextAreaInput(cols: Int? = null, rows: Int? = null, value: String? = * It takes the same parameters as the constructor of the built component. */ fun Container.textAreaInput( - cols: Int? = null, rows: Int? = null, value: String? = null, classes: Set<String> = setOf(), + cols: Int? = null, rows: Int? = null, value: String? = null, + classes: Set<String>? = null, + className: String? = null, init: (TextAreaInput.() -> Unit)? = null ): TextAreaInput { - val textAreaInput = TextAreaInput(cols, rows, value, classes).apply { init?.invoke(this) } + val textAreaInput = TextAreaInput(cols, rows, value, classes ?: className.set).apply { init?.invoke(this) } this.add(textAreaInput) return textAreaInput } diff --git a/src/main/kotlin/pl/treksoft/kvision/form/text/TextInput.kt b/src/main/kotlin/pl/treksoft/kvision/form/text/TextInput.kt index d057dcbd..e50e1b30 100644 --- a/src/main/kotlin/pl/treksoft/kvision/form/text/TextInput.kt +++ b/src/main/kotlin/pl/treksoft/kvision/form/text/TextInput.kt @@ -24,6 +24,7 @@ package pl.treksoft.kvision.form.text import com.github.snabbdom.VNode import pl.treksoft.kvision.core.Container import pl.treksoft.kvision.core.StringPair +import pl.treksoft.kvision.utils.set /** * Text input types. @@ -53,6 +54,7 @@ open class TextInput(type: TextInputType = TextInputType.TEXT, value: String? = * Text input type. */ var type by refreshOnUpdate(type) + /** * Determines if autocomplete is enabled for the input element. */ @@ -85,10 +87,12 @@ open class TextInput(type: TextInputType = TextInputType.TEXT, value: String? = * It takes the same parameters as the constructor of the built component. */ fun Container.textInput( - type: TextInputType = TextInputType.TEXT, value: String? = null, classes: Set<String> = setOf(), + type: TextInputType = TextInputType.TEXT, value: String? = null, + classes: Set<String>? = null, + className: String? = null, init: (TextInput.() -> Unit)? = null ): TextInput { - val textInput = TextInput(type, value, classes).apply { init?.invoke(this) } + val textInput = TextInput(type, value, classes ?: className.set).apply { init?.invoke(this) } this.add(textInput) return textInput } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Bold.kt b/src/main/kotlin/pl/treksoft/kvision/html/Bold.kt index 10e8e82f..e21b4f85 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Bold.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Bold.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *b*. @@ -57,10 +58,11 @@ fun Container.bold( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (Bold.() -> Unit)? = null ): Bold { - val bold = Bold(content, rich, align, classes).apply { init?.invoke(this) } + val bold = Bold(content, rich, align, classes ?: className.set).apply { init?.invoke(this) } this.add(bold) return bold } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Button.kt b/src/main/kotlin/pl/treksoft/kvision/html/Button.kt index 44a9a8f3..65527f94 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Button.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Button.kt @@ -28,6 +28,7 @@ import pl.treksoft.kvision.core.ResString import pl.treksoft.kvision.core.StringBoolPair import pl.treksoft.kvision.core.StringPair import pl.treksoft.kvision.core.Widget +import pl.treksoft.kvision.utils.set /** * Button styles. @@ -88,30 +89,37 @@ open class Button( * Button label. */ var text by refreshOnUpdate(text) + /** * Button icon. */ var icon by refreshOnUpdate(icon) + /** * Button style. */ var style by refreshOnUpdate(style) + /** * Button types. */ var type by refreshOnUpdate(type) + /** * Determines if button is disabled. */ var disabled by refreshOnUpdate(disabled) + /** * Button image. */ var image: ResString? by refreshOnUpdate() + /** * Button size. */ var size: ButtonSize? by refreshOnUpdate() + /** * Determines if the button takes all the space horizontally. */ @@ -155,6 +163,7 @@ open class Button( } return this } + /** * Makes the button focused. */ @@ -181,10 +190,11 @@ fun Container.button( style: ButtonStyle = ButtonStyle.PRIMARY, type: ButtonType = ButtonType.BUTTON, disabled: Boolean = false, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (Button.() -> Unit)? = null ): Button { - val button = Button(text, icon, style, type, disabled, classes).apply { init?.invoke(this) } + val button = Button(text, icon, style, type, disabled, classes ?: className.set).apply { init?.invoke(this) } this.add(button) return button } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Canvas.kt b/src/main/kotlin/pl/treksoft/kvision/html/Canvas.kt index 840d5dc7..6d3943ca 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Canvas.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Canvas.kt @@ -27,6 +27,7 @@ import org.w3c.dom.HTMLCanvasElement import pl.treksoft.kvision.core.Container import pl.treksoft.kvision.core.StringPair import pl.treksoft.kvision.core.Widget +import pl.treksoft.kvision.utils.set /** * Canvas component. @@ -43,6 +44,7 @@ open class Canvas( * The width of the canvas. */ var canvasWidth by refreshOnUpdate(canvasWidth) + /** * The height of the canvas. */ @@ -84,11 +86,13 @@ open class Canvas( * It takes the same parameters as the constructor of the built component. */ fun Container.canvas( - canvasWidth: Int? = null, canvasHeight: Int? = null, classes: Set<String> = setOf(), + canvasWidth: Int? = null, canvasHeight: Int? = null, + classes: Set<String>? = null, + className: String? = null, init: (Canvas.() -> Unit)? = null ): Canvas { val canvas = - Canvas(canvasWidth, canvasHeight, classes).apply { init?.invoke(this) } + Canvas(canvasWidth, canvasHeight, classes ?: className.set).apply { init?.invoke(this) } this.add(canvas) return canvas } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/CustomTag.kt b/src/main/kotlin/pl/treksoft/kvision/html/CustomTag.kt index 34910205..f922d0e0 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/CustomTag.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/CustomTag.kt @@ -23,6 +23,7 @@ package pl.treksoft.kvision.html import com.github.snabbdom.VNode import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * HTML custom tag component. @@ -71,11 +72,13 @@ fun Container.customTag( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, attributes: Map<String, String> = mapOf(), init: (CustomTag.() -> Unit)? = null ): CustomTag { - val customTag = CustomTag(elementName, content, rich, align, classes, attributes).apply { init?.invoke(this) } + val customTag = + CustomTag(elementName, content, rich, align, classes ?: className.set, attributes).apply { init?.invoke(this) } this.add(customTag) return customTag } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Div.kt b/src/main/kotlin/pl/treksoft/kvision/html/Div.kt index 2ffabe49..e43043e4 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Div.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Div.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *div*. @@ -57,10 +58,11 @@ fun Container.div( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (Div.() -> Unit)? = null ): Div { - val div = Div(content, rich, align, classes).apply { init?.invoke(this) } + val div = Div(content, rich, align, classes ?: className.set).apply { init?.invoke(this) } this.add(div) return div } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Footer.kt b/src/main/kotlin/pl/treksoft/kvision/html/Footer.kt index c71e346f..87e6e43a 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Footer.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Footer.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *footer*. @@ -57,10 +58,11 @@ fun Container.footer( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (Footer.() -> Unit)? = null ): Footer { - val footer = Footer(content, rich, align, classes).apply { init?.invoke(this) } + val footer = Footer(content, rich, align, classes ?: className.set).apply { init?.invoke(this) } this.add(footer) return footer } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/H1.kt b/src/main/kotlin/pl/treksoft/kvision/html/H1.kt index 6a3ac9cc..dbffb628 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/H1.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/H1.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *h1*. @@ -57,10 +58,11 @@ fun Container.h1( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (H1.() -> Unit)? = null ): H1 { - val h1 = H1(content, rich, align, classes).apply { init?.invoke(this) } + val h1 = H1(content, rich, align, classes ?: className.set).apply { init?.invoke(this) } this.add(h1) return h1 } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/H2.kt b/src/main/kotlin/pl/treksoft/kvision/html/H2.kt index 7bdd3473..ad6fd793 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/H2.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/H2.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *h2*. @@ -57,10 +58,11 @@ fun Container.h2( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (H2.() -> Unit)? = null ): H2 { - val h2 = H2(content, rich, align, classes).apply { init?.invoke(this) } + val h2 = H2(content, rich, align, classes ?: className.set).apply { init?.invoke(this) } this.add(h2) return h2 } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/H3.kt b/src/main/kotlin/pl/treksoft/kvision/html/H3.kt index 1a2efdbb..c21dcb33 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/H3.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/H3.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *h3*. @@ -57,10 +58,11 @@ fun Container.h3( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (H3.() -> Unit)? = null ): H3 { - val h3 = H3(content, rich, align, classes).apply { init?.invoke(this) } + val h3 = H3(content, rich, align, classes ?: className.set).apply { init?.invoke(this) } this.add(h3) return h3 } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/H4.kt b/src/main/kotlin/pl/treksoft/kvision/html/H4.kt index ae00b8a7..903c53ae 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/H4.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/H4.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *h4*. @@ -57,10 +58,11 @@ fun Container.h4( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (H4.() -> Unit)? = null ): H4 { - val h4 = H4(content, rich, align, classes).apply { init?.invoke(this) } + val h4 = H4(content, rich, align, classes ?: className.set).apply { init?.invoke(this) } this.add(h4) return h4 } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/H5.kt b/src/main/kotlin/pl/treksoft/kvision/html/H5.kt index c40a0658..f7f268d3 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/H5.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/H5.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *h5*. @@ -57,10 +58,11 @@ fun Container.h5( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (H5.() -> Unit)? = null ): H5 { - val h5 = H5(content, rich, align, classes).apply { init?.invoke(this) } + val h5 = H5(content, rich, align, classes ?: className.set).apply { init?.invoke(this) } this.add(h5) return h5 } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/H6.kt b/src/main/kotlin/pl/treksoft/kvision/html/H6.kt index 048ab5df..1d9d3429 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/H6.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/H6.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *h6*. @@ -57,10 +58,11 @@ fun Container.h6( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (H6.() -> Unit)? = null ): H6 { - val h6 = H6(content, rich, align, classes).apply { init?.invoke(this) } + val h6 = H6(content, rich, align, classes ?: className.set).apply { init?.invoke(this) } this.add(h6) return h6 } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Header.kt b/src/main/kotlin/pl/treksoft/kvision/html/Header.kt index e62e884e..4f71a669 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Header.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Header.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *header*. @@ -57,10 +58,11 @@ fun Container.header( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (Header.() -> Unit)? = null ): Header { - val header = Header(content, rich, align, classes).apply { init?.invoke(this) } + val header = Header(content, rich, align, classes ?: className.set).apply { init?.invoke(this) } this.add(header) return header } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Iframe.kt b/src/main/kotlin/pl/treksoft/kvision/html/Iframe.kt index dad33ed4..f164f87d 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Iframe.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Iframe.kt @@ -26,6 +26,7 @@ import org.w3c.dom.Window import pl.treksoft.kvision.core.Container import pl.treksoft.kvision.core.StringPair import pl.treksoft.kvision.core.Widget +import pl.treksoft.kvision.utils.set /** * Iframe sandbox options. @@ -59,26 +60,32 @@ open class Iframe( * The iframe document address. */ var src by refreshOnUpdate(src) + /** * The HTML content of the iframe. */ var srcdoc by refreshOnUpdate(srcdoc) + /** * The name of the iframe. */ var name by refreshOnUpdate(name) + /** * The width of the iframe. */ var iframeWidth by refreshOnUpdate(iframeWidth) + /** * The height of the iframe. */ var iframeHeight by refreshOnUpdate(iframeHeight) + /** * A set of Sandbox options. */ var sandbox by refreshOnUpdate(sandbox) + /** * A current location URL of the iframe. */ @@ -141,11 +148,17 @@ open class Iframe( */ fun Container.iframe( src: String? = null, srcdoc: String? = null, name: String? = null, iframeWidth: Int? = null, - iframeHeight: Int? = null, sandbox: Set<Sandbox>? = null, classes: Set<String> = setOf(), + iframeHeight: Int? = null, sandbox: Set<Sandbox>? = null, + classes: Set<String>? = null, + className: String? = null, init: (Iframe.() -> Unit)? = null ): Iframe { val iframe = - Iframe(src, srcdoc, name, iframeWidth, iframeHeight, sandbox, classes).apply { init?.invoke(this) } + Iframe(src, srcdoc, name, iframeWidth, iframeHeight, sandbox, classes ?: className.set).apply { + init?.invoke( + this + ) + } this.add(iframe) return iframe } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Image.kt b/src/main/kotlin/pl/treksoft/kvision/html/Image.kt index 6496b042..f21d515f 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Image.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Image.kt @@ -27,6 +27,7 @@ import pl.treksoft.kvision.core.ResString import pl.treksoft.kvision.core.StringBoolPair import pl.treksoft.kvision.core.StringPair import pl.treksoft.kvision.core.Widget +import pl.treksoft.kvision.utils.set /** * Image shapes. @@ -56,18 +57,22 @@ open class Image( * URL of the image. */ var src by refreshOnUpdate(src) + /** * The alternative text of the image. */ var alt by refreshOnUpdate(alt) + /** * Determines if the image is rendered as responsive. */ var responsive by refreshOnUpdate(responsive) + /** * The shape of the image. */ var shape by refreshOnUpdate(shape) + /** * Determines if the image is rendered as centered. */ @@ -108,9 +113,12 @@ open class Image( */ fun Container.image( src: ResString, alt: String? = null, responsive: Boolean = false, shape: ImageShape? = null, - centered: Boolean = false, classes: Set<String> = setOf(), init: (Image.() -> Unit)? = null + centered: Boolean = false, + classes: Set<String>? = null, + className: String? = null, + init: (Image.() -> Unit)? = null ): Image { - val image = Image(src, alt, responsive, shape, centered, classes).apply { init?.invoke(this) } + val image = Image(src, alt, responsive, shape, centered, classes ?: className.set).apply { init?.invoke(this) } this.add(image) return image } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Li.kt b/src/main/kotlin/pl/treksoft/kvision/html/Li.kt index 75157d60..d9886acd 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Li.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Li.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *li*. @@ -57,10 +58,11 @@ fun Container.li( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (Li.() -> Unit)? = null ): Li { - val li = Li(content, rich, align, classes).apply { init?.invoke(this) } + val li = Li(content, rich, align, classes ?: className.set).apply { init?.invoke(this) } this.add(li) return li } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Link.kt b/src/main/kotlin/pl/treksoft/kvision/html/Link.kt index 2c2f1723..819a8aae 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Link.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Link.kt @@ -27,6 +27,7 @@ import pl.treksoft.kvision.core.Container import pl.treksoft.kvision.core.ResString import pl.treksoft.kvision.core.StringPair import pl.treksoft.kvision.panel.SimplePanel +import pl.treksoft.kvision.utils.set /** * Link component. @@ -36,32 +37,52 @@ import pl.treksoft.kvision.panel.SimplePanel * @param url link URL address * @param icon link icon * @param image link image + * @param separator a separator between label and icon/image (defaults to space) + * @param labelFirst determines if the label is put before children elements (defaults to true) * @param classes a set of CSS class names */ open class Link( label: String, url: String? = null, icon: String? = null, image: ResString? = null, + separator: String? = null, labelFirst: Boolean = true, classes: Set<String> = setOf() ) : SimplePanel(classes) { /** * Link label. */ var label by refreshOnUpdate(label) + /** * Link URL address. */ var url by refreshOnUpdate(url) + /** * Link icon. */ var icon by refreshOnUpdate(icon) + /** * Link image. */ var image by refreshOnUpdate(image) + /** + * A separator between label and icon/image. + */ + var separator by refreshOnUpdate(separator) + + /** + * Determines if the label is put before children elements. + */ + var labelFirst by refreshOnUpdate(labelFirst) + override fun render(): VNode { - val t = createLabelWithIcon(label, icon, image) - return render("a", t + childrenVNodes()) + val t = createLabelWithIcon(label, icon, image, separator) + return if (labelFirst) { + render("a", t + childrenVNodes()) + } else { + render("a", childrenVNodes() + t) + } } override fun getSnAttrs(): List<StringPair> { @@ -92,9 +113,13 @@ open class Link( */ fun Container.link( label: String, url: String? = null, icon: String? = null, image: ResString? = null, - classes: Set<String> = setOf(), init: (Link.() -> Unit)? = null + separator: String? = null, labelFirst: Boolean = true, + classes: Set<String>? = null, + className: String? = null, + init: (Link.() -> Unit)? = null ): Link { - val link = Link(label, url, icon, image, classes).apply { init?.invoke(this) } + val link = + Link(label, url, icon, image, separator, labelFirst, classes ?: className.set).apply { init?.invoke(this) } this.add(link) return link } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/ListTag.kt b/src/main/kotlin/pl/treksoft/kvision/html/ListTag.kt index cdd18cfc..7484a667 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/ListTag.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/ListTag.kt @@ -28,6 +28,7 @@ import pl.treksoft.kvision.core.Component import pl.treksoft.kvision.core.Container import pl.treksoft.kvision.core.StringBoolPair import pl.treksoft.kvision.panel.SimplePanel +import pl.treksoft.kvision.utils.set import pl.treksoft.kvision.utils.snClasses import pl.treksoft.kvision.utils.snOpt @@ -64,10 +65,12 @@ open class ListTag( * List type. */ var type by refreshOnUpdate(type) + /** * List of elements. */ var elements by refreshOnUpdate(elements) + /** * Determines if [elements] can contain HTML code. */ @@ -158,9 +161,11 @@ open class ListTag( */ fun Container.listTag( type: ListType, elements: List<String>? = null, rich: Boolean = false, - classes: Set<String> = setOf(), init: (ListTag.() -> Unit)? = null + classes: Set<String>? = null, + className: String? = null, + init: (ListTag.() -> Unit)? = null ): ListTag { - val listTag = ListTag(type, elements, rich, classes, init) + val listTag = ListTag(type, elements, rich, classes ?: className.set, init) this.add(listTag) return listTag } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Main.kt b/src/main/kotlin/pl/treksoft/kvision/html/Main.kt index 631e58a9..54c214b0 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Main.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Main.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *main*. @@ -57,10 +58,11 @@ fun Container.main( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (Main.() -> Unit)? = null ): Main { - val main = Main(content, rich, align, classes).apply { init?.invoke(this) } + val main = Main(content, rich, align, classes ?: className.set).apply { init?.invoke(this) } this.add(main) return main } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Nav.kt b/src/main/kotlin/pl/treksoft/kvision/html/Nav.kt index 31addd95..5a774cf8 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Nav.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Nav.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *nav*. @@ -57,10 +58,11 @@ fun Container.nav( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (Nav.() -> Unit)? = null ): Nav { - val nav = Nav(content, rich, align, classes).apply { init?.invoke(this) } + val nav = Nav(content, rich, align, classes ?: className.set).apply { init?.invoke(this) } this.add(nav) return nav } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Ol.kt b/src/main/kotlin/pl/treksoft/kvision/html/Ol.kt index 79aa93fb..76370d08 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Ol.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Ol.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *ol*. @@ -51,9 +52,11 @@ open class Ol( */ fun Container.ol( elements: List<String>? = null, rich: Boolean = false, - classes: Set<String> = setOf(), init: (Ol.() -> Unit)? = null + classes: Set<String>? = null, + className: String? = null, + init: (Ol.() -> Unit)? = null ): Ol { - val ol = Ol(elements, rich, classes).apply { init?.invoke(this) } + val ol = Ol(elements, rich, classes ?: className.set).apply { init?.invoke(this) } this.add(ol) return ol } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/P.kt b/src/main/kotlin/pl/treksoft/kvision/html/P.kt index d5bb2c4d..c6daaa98 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/P.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/P.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *p*. @@ -57,10 +58,11 @@ fun Container.p( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (P.() -> Unit)? = null ): P { - val p = P(content, rich, align, classes).apply { init?.invoke(this) } + val p = P(content, rich, align, classes ?: className.set).apply { init?.invoke(this) } this.add(p) return p } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Section.kt b/src/main/kotlin/pl/treksoft/kvision/html/Section.kt index 43dd8fcf..b880e2fe 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Section.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Section.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *section*. @@ -57,10 +58,11 @@ fun Container.section( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (Section.() -> Unit)? = null ): Section { - val section = Section(content, rich, align, classes).apply { init?.invoke(this) } + val section = Section(content, rich, align, classes ?: className.set).apply { init?.invoke(this) } this.add(section) return section } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Span.kt b/src/main/kotlin/pl/treksoft/kvision/html/Span.kt index 862d0b2f..c762824f 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Span.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Span.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *span*. @@ -57,10 +58,11 @@ fun Container.span( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (Span.() -> Unit)? = null ): Span { - val span = Span(content, rich, align, classes).apply { init?.invoke(this) } + val span = Span(content, rich, align, classes ?: className.set).apply { init?.invoke(this) } this.add(span) return span } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Tag.kt b/src/main/kotlin/pl/treksoft/kvision/html/Tag.kt index 95445ece..f133401d 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Tag.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Tag.kt @@ -27,6 +27,7 @@ import pl.treksoft.kvision.core.Container import pl.treksoft.kvision.core.StringBoolPair import pl.treksoft.kvision.i18n.I18n import pl.treksoft.kvision.panel.SimplePanel +import pl.treksoft.kvision.utils.set /** * HTML tags. @@ -131,27 +132,33 @@ open class Tag( * Tag type. */ var type by refreshOnUpdate(type) + /** * Text content of the tag. */ override var content by refreshOnUpdate(content) + /** * Determines if [content] can contain HTML code. */ override var rich by refreshOnUpdate(rich) + /** * Text align. */ var align by refreshOnUpdate(align) + /** * @suppress * Internal property */ override var templateDataObj: Any? = null + /** * Handlebars template. */ override var template: ((Any?) -> String)? by refreshOnUpdate() + /** * Handlebars templates for i18n. */ @@ -207,10 +214,12 @@ open class Tag( */ fun Container.tag( type: TAG, content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), attributes: Map<String, String> = mapOf(), + classes: Set<String>? = null, + className: String? = null, + attributes: Map<String, String> = mapOf(), init: (Tag.() -> Unit)? = null ): Tag { - val tag = Tag(type, content, rich, align, classes, attributes, init) + val tag = Tag(type, content, rich, align, classes ?: className.set, attributes, init) this.add(tag) return tag } diff --git a/src/main/kotlin/pl/treksoft/kvision/html/Ul.kt b/src/main/kotlin/pl/treksoft/kvision/html/Ul.kt index 9673f56d..21e548c8 100644 --- a/src/main/kotlin/pl/treksoft/kvision/html/Ul.kt +++ b/src/main/kotlin/pl/treksoft/kvision/html/Ul.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.html import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * Simple component rendered as *ul*. @@ -51,9 +52,11 @@ open class Ul( */ fun Container.ul( elements: List<String>? = null, rich: Boolean = false, - classes: Set<String> = setOf(), init: (Ul.() -> Unit)? = null + classes: Set<String>? = null, + className: String? = null, + init: (Ul.() -> Unit)? = null ): Ul { - val ul = Ul(elements, rich, classes).apply { init?.invoke(this) } + val ul = Ul(elements, rich, classes ?: className.set).apply { init?.invoke(this) } this.add(ul) return ul } diff --git a/src/main/kotlin/pl/treksoft/kvision/panel/DockPanel.kt b/src/main/kotlin/pl/treksoft/kvision/panel/DockPanel.kt index 59c61637..52239032 100644 --- a/src/main/kotlin/pl/treksoft/kvision/panel/DockPanel.kt +++ b/src/main/kotlin/pl/treksoft/kvision/panel/DockPanel.kt @@ -24,6 +24,7 @@ package pl.treksoft.kvision.panel import pl.treksoft.kvision.core.Component import pl.treksoft.kvision.core.Container import pl.treksoft.kvision.utils.perc +import pl.treksoft.kvision.utils.set /** * Dock layout directions. @@ -50,21 +51,25 @@ open class DockPanel(classes: Set<String> = setOf(), init: (DockPanel.() -> Unit * Internal property. */ protected var leftComponent: Component? = null + /** * @suppress * Internal property. */ protected var centerComponent: Component? = null + /** * @suppress * Internal property. */ protected var rightComponent: Component? = null + /** * @suppress * Internal property. */ protected var upComponent: Component? = null + /** * @suppress * Internal property. @@ -83,6 +88,7 @@ open class DockPanel(classes: Set<String> = setOf(), init: (DockPanel.() -> Unit @Suppress("MagicNumber") height = 100.perc } + /** * @suppress * Internal property. @@ -204,8 +210,12 @@ open class DockPanel(classes: Set<String> = setOf(), init: (DockPanel.() -> Unit * * It takes the same parameters as the constructor of the built component. */ -fun Container.dockPanel(classes: Set<String> = setOf(), init: (DockPanel.() -> Unit)? = null): DockPanel { - val dockPanel = DockPanel(classes, init) +fun Container.dockPanel( + classes: Set<String>? = null, + className: String? = null, + init: (DockPanel.() -> Unit)? = null +): DockPanel { + val dockPanel = DockPanel(classes ?: className.set, init) this.add(dockPanel) return dockPanel } diff --git a/src/main/kotlin/pl/treksoft/kvision/panel/FieldsetPanel.kt b/src/main/kotlin/pl/treksoft/kvision/panel/FieldsetPanel.kt index 14310ffc..b6998556 100644 --- a/src/main/kotlin/pl/treksoft/kvision/panel/FieldsetPanel.kt +++ b/src/main/kotlin/pl/treksoft/kvision/panel/FieldsetPanel.kt @@ -25,6 +25,7 @@ import com.github.snabbdom.VNode import pl.treksoft.kvision.core.Container import pl.treksoft.kvision.html.TAG import pl.treksoft.kvision.html.Tag +import pl.treksoft.kvision.utils.set /** * The HTML fieldset container. @@ -74,10 +75,11 @@ open class FieldsetPanel( */ fun Container.fieldsetPanel( legend: String? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (FieldsetPanel.() -> Unit)? = null ): FieldsetPanel { - val fieldsetPanel = FieldsetPanel(legend, classes, init) + val fieldsetPanel = FieldsetPanel(legend, classes ?: className.set, init) this.add(fieldsetPanel) return fieldsetPanel } diff --git a/src/main/kotlin/pl/treksoft/kvision/panel/FlexPanel.kt b/src/main/kotlin/pl/treksoft/kvision/panel/FlexPanel.kt index 4cdbfa01..13deaeb0 100644 --- a/src/main/kotlin/pl/treksoft/kvision/panel/FlexPanel.kt +++ b/src/main/kotlin/pl/treksoft/kvision/panel/FlexPanel.kt @@ -27,6 +27,7 @@ import pl.treksoft.kvision.core.StringPair import pl.treksoft.kvision.core.Widget import pl.treksoft.kvision.core.WidgetWrapper import pl.treksoft.kvision.utils.px +import pl.treksoft.kvision.utils.set /** * CSS flexbox directions. @@ -237,9 +238,13 @@ open class FlexPanel( fun Container.flexPanel( direction: FlexDir? = null, wrap: FlexWrap? = null, justify: FlexJustify? = null, alignItems: FlexAlignItems? = null, alignContent: FlexAlignContent? = null, - spacing: Int? = null, classes: Set<String> = setOf(), init: (FlexPanel.() -> Unit)? = null + spacing: Int? = null, + classes: Set<String>? = null, + className: String? = null, + init: (FlexPanel.() -> Unit)? = null ): FlexPanel { - val flexPanel = FlexPanel(direction, wrap, justify, alignItems, alignContent, spacing, classes, init) + val flexPanel = + FlexPanel(direction, wrap, justify, alignItems, alignContent, spacing, classes ?: className.set, init) this.add(flexPanel) return flexPanel } diff --git a/src/main/kotlin/pl/treksoft/kvision/panel/GridPanel.kt b/src/main/kotlin/pl/treksoft/kvision/panel/GridPanel.kt index 1598753b..daf5c92b 100644 --- a/src/main/kotlin/pl/treksoft/kvision/panel/GridPanel.kt +++ b/src/main/kotlin/pl/treksoft/kvision/panel/GridPanel.kt @@ -25,6 +25,7 @@ import pl.treksoft.kvision.core.Component import pl.treksoft.kvision.core.Container import pl.treksoft.kvision.core.StringPair import pl.treksoft.kvision.core.WidgetWrapper +import pl.treksoft.kvision.utils.set /** * CSS grid justification options. @@ -113,46 +114,57 @@ open class GridPanel( * CSS grid auto columns. */ var autoColumns by refreshOnUpdate(autoColumns) + /** * CSS grid auto rows. */ var autoRows by refreshOnUpdate(autoRows) + /** * CSS grid auto flow. */ var autoFlow by refreshOnUpdate(autoFlow) + /** * CSS grid columns template. */ var templateColumns by refreshOnUpdate(templateColumns) + /** * CSS grid rows template. */ var templateRows by refreshOnUpdate(templateRows) + /** * CSS grid areas template. */ var templateAreas by refreshOnUpdate(templateAreas) + /** * CSS grid column gap. */ var columnGap by refreshOnUpdate(columnGap) + /** * CSS grid row gap. */ var rowGap by refreshOnUpdate(rowGap) + /** * CSS grid items justification. */ var justifyItems by refreshOnUpdate(justifyItems) + /** * CSS grid items alignment. */ var alignItems by refreshOnUpdate(alignItems) + /** * CSS grid content justification. */ var justifyContent by refreshOnUpdate(justifyContent) + /** * CSS grid content alignment. */ @@ -267,11 +279,14 @@ fun Container.gridPanel( templateColumns: String? = null, templateRows: String? = null, templateAreas: List<String>? = null, columnGap: Int? = null, rowGap: Int? = null, justifyItems: GridJustify? = null, alignItems: GridAlign? = null, justifyContent: GridJustifyContent? = null, - alignContent: GridAlignContent? = null, classes: Set<String> = setOf(), init: (GridPanel.() -> Unit)? = null + alignContent: GridAlignContent? = null, + classes: Set<String>? = null, + className: String? = null, + init: (GridPanel.() -> Unit)? = null ): GridPanel { val gridPanel = GridPanel( autoColumns, autoRows, autoFlow, templateColumns, templateRows, templateAreas, - columnGap, rowGap, justifyItems, alignItems, justifyContent, alignContent, classes, init + columnGap, rowGap, justifyItems, alignItems, justifyContent, alignContent, classes ?: className.set, init ) this.add(gridPanel) return gridPanel diff --git a/src/main/kotlin/pl/treksoft/kvision/panel/HPanel.kt b/src/main/kotlin/pl/treksoft/kvision/panel/HPanel.kt index ccc77b0f..88c95b92 100644 --- a/src/main/kotlin/pl/treksoft/kvision/panel/HPanel.kt +++ b/src/main/kotlin/pl/treksoft/kvision/panel/HPanel.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.panel import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * The container with horizontal layout. @@ -59,10 +60,11 @@ fun Container.hPanel( justify: FlexJustify? = null, alignItems: FlexAlignItems? = null, spacing: Int? = null, - classes: Set<String> = setOf(), + classes: Set<String>? = null, + className: String? = null, init: (HPanel.() -> Unit)? = null ): HPanel { - val hpanel = HPanel(wrap, justify, alignItems, spacing, classes, init) + val hpanel = HPanel(wrap, justify, alignItems, spacing, classes ?: className.set, init) this.add(hpanel) return hpanel } diff --git a/src/main/kotlin/pl/treksoft/kvision/panel/SimplePanel.kt b/src/main/kotlin/pl/treksoft/kvision/panel/SimplePanel.kt index 915fa6a7..f2210550 100644 --- a/src/main/kotlin/pl/treksoft/kvision/panel/SimplePanel.kt +++ b/src/main/kotlin/pl/treksoft/kvision/panel/SimplePanel.kt @@ -25,6 +25,7 @@ import com.github.snabbdom.VNode import pl.treksoft.kvision.core.Component import pl.treksoft.kvision.core.Container import pl.treksoft.kvision.core.Widget +import pl.treksoft.kvision.utils.set /** * Basic container class, rendered as a DIV element with all children directly within. @@ -108,8 +109,12 @@ open class SimplePanel(classes: Set<String> = setOf(), init: (SimplePanel.() -> * * It takes the same parameters as the constructor of the built component. */ -fun Container.simplePanel(classes: Set<String> = setOf(), init: (SimplePanel.() -> Unit)? = null): SimplePanel { - val simplePanel = SimplePanel(classes, init) +fun Container.simplePanel( + classes: Set<String>? = null, + className: String? = null, + init: (SimplePanel.() -> Unit)? = null +): SimplePanel { + val simplePanel = SimplePanel(classes ?: className.set, init) this.add(simplePanel) return simplePanel } diff --git a/src/main/kotlin/pl/treksoft/kvision/panel/SplitPanel.kt b/src/main/kotlin/pl/treksoft/kvision/panel/SplitPanel.kt index c7f4b3ac..f838e85c 100644 --- a/src/main/kotlin/pl/treksoft/kvision/panel/SplitPanel.kt +++ b/src/main/kotlin/pl/treksoft/kvision/panel/SplitPanel.kt @@ -30,6 +30,7 @@ import pl.treksoft.kvision.core.UNIT import pl.treksoft.kvision.html.TAG import pl.treksoft.kvision.html.Tag import pl.treksoft.kvision.utils.obj +import pl.treksoft.kvision.utils.set /** * Split panel direction. @@ -107,9 +108,11 @@ open class SplitPanel( */ fun Container.splitPanel( direction: Direction = Direction.VERTICAL, - classes: Set<String> = setOf(), init: (SplitPanel.() -> Unit)? = null + classes: Set<String>? = null, + className: String? = null, + init: (SplitPanel.() -> Unit)? = null ): SplitPanel { - val splitPanel = SplitPanel(direction, classes, init) + val splitPanel = SplitPanel(direction, classes ?: className.set, init) this.add(splitPanel) return splitPanel } diff --git a/src/main/kotlin/pl/treksoft/kvision/panel/StackPanel.kt b/src/main/kotlin/pl/treksoft/kvision/panel/StackPanel.kt index 84fb6174..02a77b55 100644 --- a/src/main/kotlin/pl/treksoft/kvision/panel/StackPanel.kt +++ b/src/main/kotlin/pl/treksoft/kvision/panel/StackPanel.kt @@ -25,6 +25,7 @@ import com.github.snabbdom.VNode import pl.treksoft.kvision.core.Component import pl.treksoft.kvision.core.Container import pl.treksoft.kvision.routing.routing +import pl.treksoft.kvision.utils.set import kotlin.browser.window /** @@ -130,9 +131,12 @@ open class StackPanel( * It takes the same parameters as the constructor of the built component. */ fun Container.stackPanel( - activateLast: Boolean = true, classes: Set<String> = setOf(), init: (StackPanel.() -> Unit)? = null + activateLast: Boolean = true, + classes: Set<String>? = null, + className: String? = null, + init: (StackPanel.() -> Unit)? = null ): StackPanel { - val stackPanel = StackPanel(activateLast, classes, init) + val stackPanel = StackPanel(activateLast, classes ?: className.set, init) this.add(stackPanel) return stackPanel } diff --git a/src/main/kotlin/pl/treksoft/kvision/panel/VPanel.kt b/src/main/kotlin/pl/treksoft/kvision/panel/VPanel.kt index e5d275d4..42471994 100644 --- a/src/main/kotlin/pl/treksoft/kvision/panel/VPanel.kt +++ b/src/main/kotlin/pl/treksoft/kvision/panel/VPanel.kt @@ -22,6 +22,7 @@ package pl.treksoft.kvision.panel import pl.treksoft.kvision.core.Container +import pl.treksoft.kvision.utils.set /** * The container with vertical layout. @@ -55,9 +56,11 @@ open class VPanel( */ fun Container.vPanel( justify: FlexJustify? = null, alignItems: FlexAlignItems? = null, spacing: Int? = null, - classes: Set<String> = setOf(), init: (VPanel.() -> Unit)? = null + classes: Set<String>? = null, + className: String? = null, + init: (VPanel.() -> Unit)? = null ): VPanel { - val vpanel = VPanel(justify, alignItems, spacing, classes, init) + val vpanel = VPanel(justify, alignItems, spacing, classes ?: className.set, init) this.add(vpanel) return vpanel } diff --git a/src/main/kotlin/pl/treksoft/kvision/table/Cell.kt b/src/main/kotlin/pl/treksoft/kvision/table/Cell.kt index 4cf72f77..467f1d1d 100644 --- a/src/main/kotlin/pl/treksoft/kvision/table/Cell.kt +++ b/src/main/kotlin/pl/treksoft/kvision/table/Cell.kt @@ -24,6 +24,7 @@ package pl.treksoft.kvision.table import pl.treksoft.kvision.html.Align import pl.treksoft.kvision.html.TAG import pl.treksoft.kvision.html.Tag +import pl.treksoft.kvision.utils.set /** * HTML table cell component. @@ -58,9 +59,11 @@ fun Row.cell( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), init: (Cell.() -> Unit)? = null + classes: Set<String>? = null, + className: String? = null, + init: (Cell.() -> Unit)? = null ): Cell { - val cell = Cell(content, rich, align, classes, init) + val cell = Cell(content, rich, align, classes ?: className.set, init) this.add(cell) return cell } @@ -74,9 +77,11 @@ fun Row.thcell( content: String? = null, rich: Boolean = false, align: Align? = null, - classes: Set<String> = setOf(), init: (HeaderCell.() -> Unit)? = null + classes: Set<String>? = null, + className: String? = null, + init: (HeaderCell.() -> Unit)? = null ): HeaderCell { - val headerCell = HeaderCell(content, rich, align, Scope.ROW, classes, init) + val headerCell = HeaderCell(content, rich, align, Scope.ROW, classes ?: className.set, init) this.add(headerCell) return headerCell } diff --git a/src/main/kotlin/pl/treksoft/kvision/table/HeaderCell.kt b/src/main/kotlin/pl/treksoft/kvision/table/HeaderCell.kt index f7f45784..626ab87f 100644 --- a/src/main/kotlin/pl/treksoft/kvision/table/HeaderCell.kt +++ b/src/main/kotlin/pl/treksoft/kvision/table/HeaderCell.kt @@ -24,6 +24,7 @@ package pl.treksoft.kvision.table import pl.treksoft.kvision.html.Align import pl.treksoft.kvision.html.TAG import pl.treksoft.kvision.html.Tag +import pl.treksoft.kvision.utils.set enum class Scope(internal val scope: String) { ROW("row"), @@ -69,9 +70,11 @@ fun Row.headerCell( rich: Boolean = false, align: Align? = null, scope: Scope? = null, - classes: Set<String> = setOf(), init: (HeaderCell.() -> Unit)? = null + classes: Set<String>? = null, + className: String? = null, + init: (HeaderCell.() -> Unit)? = null ): HeaderCell { - val cell = HeaderCell(content, rich, align, scope, classes, init) + val cell = HeaderCell(content, rich, align, scope, classes ?: className.set, init) this.add(cell) return cell } diff --git a/src/main/kotlin/pl/treksoft/kvision/table/Row.kt b/src/main/kotlin/pl/treksoft/kvision/table/Row.kt index 0681953f..a933d38e 100644 --- a/src/main/kotlin/pl/treksoft/kvision/table/Row.kt +++ b/src/main/kotlin/pl/treksoft/kvision/table/Row.kt @@ -23,6 +23,7 @@ package pl.treksoft.kvision.table import pl.treksoft.kvision.html.TAG import pl.treksoft.kvision.html.Tag +import pl.treksoft.kvision.utils.set /** * HTML table row component. @@ -46,9 +47,11 @@ open class Row(classes: Set<String> = setOf(), init: (Row.() -> Unit)? = null) : * It takes the same parameters as the constructor of the built component. */ fun Table.row( - classes: Set<String> = setOf(), init: (Row.() -> Unit)? = null + classes: Set<String>? = null, + className: String? = null, + init: (Row.() -> Unit)? = null ): Row { - val row = Row(classes, init) + val row = Row(classes ?: className.set, init) this.add(row) return row } diff --git a/src/main/kotlin/pl/treksoft/kvision/table/Table.kt b/src/main/kotlin/pl/treksoft/kvision/table/Table.kt index 6c48157d..56d4a811 100644 --- a/src/main/kotlin/pl/treksoft/kvision/table/Table.kt +++ b/src/main/kotlin/pl/treksoft/kvision/table/Table.kt @@ -29,6 +29,7 @@ import pl.treksoft.kvision.core.StringBoolPair import pl.treksoft.kvision.html.TAG import pl.treksoft.kvision.html.Tag import pl.treksoft.kvision.panel.SimplePanel +import pl.treksoft.kvision.utils.set import pl.treksoft.kvision.utils.snClasses import pl.treksoft.kvision.utils.snOpt @@ -85,14 +86,17 @@ open class Table( * Table headers names. */ var headerNames by refreshOnUpdate(headerNames) { refreshHeaders() } + /** * Table types. */ var types by refreshOnUpdate(types) + /** * Table caption. */ var caption by refreshOnUpdate(caption) + /** * Determines if the table is responsive. */ @@ -210,10 +214,13 @@ open class Table( fun Container.table( headerNames: List<String>? = null, types: Set<TableType> = setOf(), caption: String? = null, responsiveType: ResponsiveType? = null, - theadType: TheadType? = null, classes: Set<String> = setOf(), init: (Table.() -> Unit)? = null + theadType: TheadType? = null, + classes: Set<String>? = null, + className: String? = null, + init: (Table.() -> Unit)? = null ): Table { val table = - Table(headerNames, types, caption, responsiveType, theadType, classes, init) + Table(headerNames, types, caption, responsiveType, theadType, classes ?: className.set, init) this.add(table) return table } diff --git a/src/main/kotlin/pl/treksoft/kvision/utils/Utils.kt b/src/main/kotlin/pl/treksoft/kvision/utils/Utils.kt index 5f245fb6..e2833630 100644 --- a/src/main/kotlin/pl/treksoft/kvision/utils/Utils.kt +++ b/src/main/kotlin/pl/treksoft/kvision/utils/Utils.kt @@ -200,3 +200,11 @@ fun <T> MutableList<T>.syncWithList(list: List<T>) { } } } + +/** + * Utility extension property to generate a set of strings to simplify the notation when using classes parameter. + */ +val String?.set: Set<String> + get() { + return this?.split(Regex("\\s+"))?.toSet() ?: setOf() + } |