InsanusMokrassar/JSUIKitKBindings
1
0
Fork 0
mirror of https://github.com/InsanusMokrassar/JSUIKitKBindings.git synced 2024-12-22 00:27:25 +00:00
Code Issues Projects Releases Wiki Activity

add attributes customizers lambdas to all elements and temporarily change signatures with modifiers from varargs to arrays

Browse Source
This commit is contained in:
InsanusMokrassar 2022-01-13 11:55:08 +06:00
parent ccf1daa2b5
commit 0beda0b6ef
16 changed files with 110 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
CHANGELOG.md
View File

@ -1,5 +1,7 @@
## 0.0.5
All elements has changed their signatures: they all will accept an additional lambda for attributes configuration
## 0.0.4
__Migrate modifers to modifiers__

14
src/main/kotlin/dev/inmo/jsuikit/elements/Button.kt
View File

@ -7,14 +7,16 @@ import org.jetbrains.compose.web.attributes.InputType
import org.jetbrains.compose.web.attributes.disabled
import org.jetbrains.compose.web.dom.*
import org.w3c.dom.HTMLButtonElement
import org.w3c.dom.HTMLDivElement
import org.w3c.dom.events.Event
@Composable
fun DefaultButton(
vararg modifiers: UIKitModifier,
modifiers: Array<UIKitModifier> = emptyArray(),
disabled: Boolean = false,
buttonType: UIKitButton.Type = UIKitButton.Type.Default,
onClick: ((SyntheticMouseEvent) -> Unit)? = null,
attributesCustomizer: AttrBuilderContext<HTMLButtonElement> = {},
contentAllocator: ContentBuilder<HTMLButtonElement>
) {
Button(
@ -25,6 +27,7 @@ fun DefaultButton(
if (disabled) {
disabled()
}
attributesCustomizer()
}
) {
contentAllocator()
@ -34,13 +37,14 @@ fun DefaultButton(
@Composable
fun DefaultButton(
text: String,
vararg modifiers: UIKitModifier,
modifiers: Array<UIKitModifier> = emptyArray(),
disabled: Boolean = false,
buttonType: UIKitButton.Type = UIKitButton.Type.Default,
preTextContentAllocator: ContentBuilder<HTMLButtonElement>? = null,
afterTextContentAllocator: ContentBuilder<HTMLButtonElement>? = null,
attributesCustomizer: AttrBuilderContext<HTMLButtonElement> = {},
onClick: ((SyntheticMouseEvent) -> Unit)? = null
) = DefaultButton(*modifiers, disabled = disabled, buttonType = buttonType, onClick = onClick) {
) = DefaultButton(modifiers, disabled = disabled, buttonType = buttonType, onClick = onClick, attributesCustomizer = attributesCustomizer) {
preTextContentAllocator ?.apply { preTextContentAllocator() }
Text(text)
afterTextContentAllocator ?.apply { afterTextContentAllocator() }
@ -49,10 +53,11 @@ fun DefaultButton(
@Composable
fun UploadButton(
text: String,
vararg buttonModifiers: UIKitModifier,
buttonModifiers: Array<UIKitModifier> = emptyArray(),
containerModifiers: Array<UIKitModifier> = emptyArray(),
disabled: Boolean = false,
buttonType: UIKitButton.Type = UIKitButton.Type.Default,
attributesCustomizer: AttrBuilderContext<HTMLDivElement> = {},
onChange: (Event) -> Unit
) {
Div(
@ -60,6 +65,7 @@ fun UploadButton(
classes("js-upload", "uk-form-custom")
attr("uk-form-custom", "")
include(*containerModifiers)
attributesCustomizer()
}
) {
Input(InputType.File) { onChange { onChange(it.nativeEvent) } }

7
src/main/kotlin/dev/inmo/jsuikit/elements/Dialog.kt
View File

@ -5,7 +5,8 @@ import androidx.compose.runtime.DisposableEffectResult
import dev.inmo.jsuikit.modifiers.UIKitModifier
import dev.inmo.jsuikit.modifiers.include
import org.jetbrains.compose.web.dom.*
import org.w3c.dom.HTMLElement
import org.jetbrains.compose.web.dom.Text
import org.w3c.dom.*
import org.w3c.dom.events.Event
import kotlin.random.Random
import kotlin.random.nextUInt
@ -25,10 +26,11 @@ private class DialogDisposableEffectResult(
@Composable
fun Dialog(
title: String? = null,
vararg modifiers: UIKitModifier,
modifiers: Array<UIKitModifier> = emptyArray(),
hide: (() -> Unit)? = null,
hidden: (() -> Unit)? = null,
footerBuilder: (@Composable () -> Unit)? = null,
attributesCustomizer: AttrBuilderContext<HTMLDivElement> = {},
bodyBuilder: @Composable () -> Unit
) {
Div(
@ -37,6 +39,7 @@ fun Dialog(
classes("uk-flex-top", "uk-modal")
id("dialog${Random.nextUInt()}")
include(*modifiers)
attributesCustomizer()
}
) {
Div(

7
src/main/kotlin/dev/inmo/jsuikit/elements/Dropdown.kt
View File

@ -4,13 +4,12 @@ import androidx.compose.runtime.Composable
import dev.inmo.jsuikit.buildAndAddAttribute
import dev.inmo.jsuikit.modifiers.*
import dev.inmo.jsuikit.utils.Milliseconds
import org.jetbrains.compose.web.dom.ContentBuilder
import org.jetbrains.compose.web.dom.Div
import org.jetbrains.compose.web.dom.*
import org.w3c.dom.HTMLDivElement
@Composable
fun Dropdown(
vararg modifiers: UIKitModifier,
modifiers: Array<UIKitModifier> = emptyArray(),
toggle: String? = null,
pos: UIKitDropdown.Position? = null,
mode: UIKitDropdown.Mode? = null,
@ -22,6 +21,7 @@ fun Dropdown(
offset: Int? = null,
animation: UIKitAnimation? = null,
duration: Milliseconds? = null,
attributesCustomizer: AttrBuilderContext<HTMLDivElement> = {},
contentBuilder: ContentBuilder<HTMLDivElement>
) {
Div(
@ -41,6 +41,7 @@ fun Dropdown(
}
classes("uk-dropdown")
include(*modifiers)
attributesCustomizer()
},
contentBuilder
)

7
src/main/kotlin/dev/inmo/jsuikit/elements/Flex.kt
View File

@ -3,19 +3,20 @@ package dev.inmo.jsuikit.elements
import androidx.compose.runtime.Composable
import dev.inmo.jsuikit.modifiers.UIKitModifier
import dev.inmo.jsuikit.modifiers.include
import org.jetbrains.compose.web.dom.Div
import org.jetbrains.compose.web.dom.ElementScope
import org.jetbrains.compose.web.dom.*
import org.w3c.dom.HTMLDivElement
@Composable
fun Flex(
vararg modifiers: UIKitModifier,
modifiers: Array<UIKitModifier> = emptyArray(),
attributesCustomizer: AttrBuilderContext<HTMLDivElement> = {},
filler: @Composable ElementScope<HTMLDivElement>.() -> Unit
) {
Div(
{
classes("uk-flex")
include(*modifiers)
attributesCustomizer()
}
) {
filler()

11
src/main/kotlin/dev/inmo/jsuikit/elements/Grid.kt
View File

@ -3,18 +3,19 @@ package dev.inmo.jsuikit.elements
import androidx.compose.runtime.Composable
import dev.inmo.jsuikit.modifiers.UIKitModifier
import dev.inmo.jsuikit.modifiers.include
import org.jetbrains.compose.web.dom.Div
import org.jetbrains.compose.web.dom.ElementScope
import org.jetbrains.compose.web.dom.*
import org.w3c.dom.HTMLDivElement
@Composable
fun GridColumn(
vararg modifiers: UIKitModifier,
modifiers: Array<UIKitModifier> = emptyArray(),
attributesCustomizer: AttrBuilderContext<HTMLDivElement> = {},
builder: @Composable ElementScope<HTMLDivElement>.() -> Unit
) {
Div(
{
include(*modifiers)
attributesCustomizer()
}
) {
builder()
@ -23,11 +24,12 @@ fun GridColumn(
@Composable
fun Grid(
vararg modifiers: UIKitModifier,
modifiers: Array<UIKitModifier> = emptyArray(),
masonry: Boolean = false,
parallax: Int? = null,
marginClass: String? = null,
firstColumnClass: String? = null,
attributesCustomizer: AttrBuilderContext<HTMLDivElement> = {},
builder: @Composable ElementScope<HTMLDivElement>.() -> Unit
) {
val attrs = listOfNotNull(
@ -41,6 +43,7 @@ fun Grid(
attr("uk-grid", attrs.joinToString(";") { (k, v) -> "$k: $v" })
classes("uk-grid")
include(*modifiers)
attributesCustomizer()
}
) {
builder()

48
src/main/kotlin/dev/inmo/jsuikit/elements/Icon.kt
View File

@ -2,8 +2,8 @@ package dev.inmo.jsuikit.elements
import androidx.compose.runtime.Composable
import dev.inmo.jsuikit.modifiers.*
import org.jetbrains.compose.web.dom.Button
import org.jetbrains.compose.web.dom.Span
import org.jetbrains.compose.web.dom.*
import org.w3c.dom.*
import org.w3c.dom.events.Event
sealed class Icon(val name: String) {
@ -204,47 +204,41 @@ sealed class Icon(val name: String) {
@Composable
operator fun invoke(
vararg modifier: UIKitModifier,
modifiers: Array<UIKitModifier> = emptyArray(),
type: UIKitIconType = UIKitIconType.Default,
ratio: Float? = null,
attributesCustomizer: AttrBuilderContext<out HTMLElement> = {},
onClick: ((Event) -> Unit)? = null
) {
val configurer: AttrBuilderContext<out HTMLElement> = {
classes("uk-icon")
include(*modifiers, type)
attr("uk-icon", "icon: $name${if (ratio != null) { "; ratio: $ratio" } else ""}")
onClick ?.let { _ ->
onClick { onClick(it.nativeEvent) }
}
attributesCustomizer()
}
if (type == UIKitIconType.Button) {
Button(
{
classes("uk-icon")
include(*modifier, type)
attr("uk-icon", "icon: $name${if (ratio != null) { "; ratio: $ratio" } else ""}")
onClick ?.let { _ ->
onClick { onClick(it.nativeEvent) }
}
}
)
Button(configurer)
} else {
Span(
{
classes("uk-icon")
include(*modifier, type)
attr("uk-icon", "icon: $name${if (ratio != null) { "; ratio: $ratio" } else ""}")
onClick ?.let { _ ->
onClick { onClick(it.nativeEvent) }
}
}
)
Span(configurer)
}
}
@Composable
fun drawAsButton(
vararg modifier: UIKitModifier,
modifiers: Array<UIKitModifier> = emptyArray(),
ratio: Float? = null,
attributesCustomizer: AttrBuilderContext<out HTMLElement> = {},
onClick: ((Event) -> Unit)? = null
) = invoke(*modifier, type = UIKitIconType.Button, ratio = ratio, onClick = onClick)
) = invoke(modifiers, type = UIKitIconType.Button, ratio = ratio, onClick = onClick, attributesCustomizer = attributesCustomizer)
@Composable
fun drawAsIcon(
vararg modifier: UIKitModifier,
modifiers: Array<UIKitModifier> = emptyArray(),
ratio: Float? = null,
attributesCustomizer: AttrBuilderContext<out HTMLElement> = {},
onClick: ((Event) -> Unit)? = null
) = invoke(*modifier, type = UIKitIconType.Default, ratio = ratio, onClick = onClick)
) = invoke(modifiers, type = UIKitIconType.Default, ratio = ratio, onClick = onClick, attributesCustomizer = attributesCustomizer)
}

8
src/main/kotlin/dev/inmo/jsuikit/elements/Labels.kt
View File

@ -3,8 +3,8 @@ package dev.inmo.jsuikit.elements
import androidx.compose.runtime.Composable
import dev.inmo.jsuikit.modifiers.UIKitModifier
import dev.inmo.jsuikit.modifiers.include
import org.jetbrains.compose.web.dom.Span
import org.jetbrains.compose.web.dom.Text
import org.jetbrains.compose.web.dom.*
import org.w3c.dom.HTMLSpanElement
sealed interface Label {
val suffix: String
@ -12,11 +12,13 @@ sealed interface Label {
@Composable
operator fun invoke(
text: String,
vararg modifiers: UIKitModifier
modifiers: Array<UIKitModifier> = emptyArray(),
attributesCustomizer: AttrBuilderContext<HTMLSpanElement> = {},
) = Span(
{
classes("uk-label", "uk-label-$suffix")
include(*modifiers)
attributesCustomizer()
}
) {
Text(text)

6
src/main/kotlin/dev/inmo/jsuikit/elements/List.kt
View File

@ -5,6 +5,7 @@ import androidx.compose.runtime.snapshots.SnapshotStateList
import dev.inmo.jsuikit.modifiers.UIKitModifier
import dev.inmo.jsuikit.modifiers.include
import org.jetbrains.compose.web.dom.*
import org.w3c.dom.HTMLHeadingElement
import org.w3c.dom.HTMLUListElement
@Composable
@ -12,11 +13,13 @@ fun <T> List(
title: String,
data: SnapshotStateList<T>,
titleModifiers: Array<UIKitModifier> = emptyArray(),
titleCustomizer: AttrBuilderContext<HTMLHeadingElement> = {},
ulModifiers: Array<UIKitModifier> = emptyArray(),
ulCustomizer: AttrBuilderContext<HTMLUListElement> = {},
besidesTitleAndList: (@Composable () -> Unit)? = null,
elementAllocator: @Composable ElementScope<HTMLUListElement>.(T) -> Unit
) {
H4({ include(*titleModifiers) }) {
H4({ include(*titleModifiers); titleCustomizer() }) {
Text(title)
}
besidesTitleAndList ?.invoke()
@ -24,6 +27,7 @@ fun <T> List(
{
classes("uk-list")
include(*ulModifiers)
ulCustomizer()
}
) {
data.forEach {

10
src/main/kotlin/dev/inmo/jsuikit/elements/Nav.kt
View File

@ -10,11 +10,12 @@ import org.w3c.dom.HTMLUListElement
@Composable
fun Nav(
vararg modifiers: UIKitModifier,
modifiers: Array<UIKitModifier> = emptyArray(),
multiple: Boolean? = null,
collapsible: Boolean? = null,
animation: UIKitAnimation? = null,
duration: Milliseconds? = null,
attributesCustomizer: AttrBuilderContext<HTMLUListElement> = {},
dataAllocator: ContentBuilder<HTMLUListElement>
) {
Ul(
@ -27,6 +28,7 @@ fun Nav(
}
classes("uk-nav")
include(*modifiers)
attributesCustomizer()
}
) {
dataAllocator()
@ -35,14 +37,14 @@ fun Nav(
@Composable
fun NavElement(
vararg modifiers: UIKitModifier,
attributesAllocator: (AttrBuilderContext<HTMLLIElement>)? = null,
modifiers: Array<UIKitModifier> = emptyArray(),
attributesCustomizer: AttrBuilderContext<HTMLLIElement> = {},
contentAllocator: ContentBuilder<HTMLLIElement>
) {
Li(
{
attributesAllocator ?.apply { attributesAllocator() }
include(*modifiers)
attributesCustomizer
}
) {
contentAllocator()

8
src/main/kotlin/dev/inmo/jsuikit/elements/Navbar.kt
View File

@ -3,21 +3,23 @@ package dev.inmo.jsuikit.elements
import androidx.compose.runtime.Composable
import dev.inmo.jsuikit.modifiers.UIKitModifier
import dev.inmo.jsuikit.modifiers.include
import org.jetbrains.compose.web.dom.Div
import org.jetbrains.compose.web.dom.Nav
import org.jetbrains.compose.web.dom.*
import org.w3c.dom.HTMLElement
@Composable
fun Navbar(
vararg navModifiers: UIKitModifier,
leftBuilder: NavbarNavBuilder? = null,
centerBuilder: NavbarNavBuilder? = null,
rightBuilder: NavbarNavBuilder? = null,
navModifiers: Array<UIKitModifier> = emptyArray(),
attributesCustomizer: AttrBuilderContext<HTMLElement> = {},
) {
Nav(
{
attr("uk-navbar", "")
classes("uk-navbar-container", "uk-navbar")
include(*navModifiers)
attributesCustomizer()
}
) {
leftBuilder ?.let {

15
src/main/kotlin/dev/inmo/jsuikit/elements/NavbarNavBuilder.kt
View File

@ -6,6 +6,7 @@ import dev.inmo.jsuikit.modifiers.include
import org.jetbrains.compose.web.attributes.AttrsBuilder
import org.jetbrains.compose.web.dom.*
import org.w3c.dom.HTMLLIElement
import org.w3c.dom.HTMLUListElement
interface NavbarNavElement {
fun AttrsBuilder<HTMLLIElement>.setup() {}
@ -29,21 +30,25 @@ interface NavbarNavElement {
class NavbarNavBuilder(
private val modifiers: Array<UIKitModifier>,
private val elements: List<NavbarNavElement>
private val elements: List<NavbarNavElement>,
private val attributesCustomizer: AttrBuilderContext<HTMLUListElement> = {}
) {
constructor(
modifiers: Array<UIKitModifier>,
vararg elements: NavbarNavElement
) : this(modifiers, elements.toList())
vararg elements: NavbarNavElement,
attributesCustomizer: AttrBuilderContext<HTMLUListElement> = {}
) : this(modifiers, elements.toList(), attributesCustomizer)
constructor(
vararg elements: NavbarNavElement
) : this(emptyArray(), elements.toList())
vararg elements: NavbarNavElement,
attributesCustomizer: AttrBuilderContext<HTMLUListElement> = {}
) : this(emptyArray(), elements.toList(), attributesCustomizer)
@Composable
fun draw() {
Ul(
{
classes("uk-navbar-nav")
include(*modifiers)
attributesCustomizer()
}
) {
elements.forEach { element ->

8
src/main/kotlin/dev/inmo/jsuikit/elements/Progress.kt
View File

@ -3,13 +3,16 @@ package dev.inmo.jsuikit.elements
import androidx.compose.runtime.Composable
import dev.inmo.jsuikit.modifiers.UIKitModifier
import dev.inmo.jsuikit.modifiers.include
import org.jetbrains.compose.web.dom.AttrBuilderContext
import org.jetbrains.compose.web.dom.Progress
import org.w3c.dom.HTMLProgressElement
@Composable
fun Progress(
value: Int,
vararg modifiers: UIKitModifier,
max: Int = 100
modifiers: Array<UIKitModifier> = emptyArray(),
max: Int = 100,
attributesCustomizer: AttrBuilderContext<HTMLProgressElement> = {}
) {
Progress(
{
@ -17,6 +20,7 @@ fun Progress(
include(*modifiers)
attr("max", max.toString())
attr("value", value.toString())
attributesCustomizer()
}
)
}

14
src/main/kotlin/dev/inmo/jsuikit/elements/Spinner.kt
View File

@ -2,21 +2,27 @@ package dev.inmo.jsuikit.elements
import androidx.compose.runtime.Composable
import dev.inmo.jsuikit.modifiers.*
import org.jetbrains.compose.web.dom.AttrBuilderContext
import org.jetbrains.compose.web.dom.Div
import org.w3c.dom.HTMLDivElement
@Composable
fun Spinner(
vararg modifier: UIKitModifier,
ratio: Float? = null
modifiers: Array<UIKitModifier> = emptyArray(),
ratio: Float? = null,
attributesCustomizer: AttrBuilderContext<HTMLDivElement> = {}
) {
Div(
{
attr("uk-spinner", ratio ?.let { "ratio: $it" } ?: "")
classes("uk-icon", "uk-spinner")
include(*modifier)
include(*modifiers)
attributesCustomizer()
}
)
}
@Composable
fun DefaultSpinner() = Spinner(UIKitAlign.Center, UIKitMargin.Small, UIKitText.Alignment.Center)
fun DefaultSpinner() = Spinner(
arrayOf(UIKitAlign.Center, UIKitMargin.Small, UIKitText.Alignment.Center)
)

6
src/main/kotlin/dev/inmo/jsuikit/elements/Table.kt
View File

@ -4,12 +4,15 @@ import androidx.compose.runtime.Composable
import androidx.compose.runtime.snapshots.SnapshotStateList
import dev.inmo.jsuikit.modifiers.*
import org.jetbrains.compose.web.dom.*
import org.w3c.dom.HTMLProgressElement
import org.w3c.dom.HTMLTableElement
@Composable
fun <T> DefaultTable(
heading: List<String>,
dataList: SnapshotStateList<T>,
vararg tableModifiers: UIKitModifier,
tableModifiers: Array<UIKitModifier> = emptyArray(),
attributesCustomizer: AttrBuilderContext<HTMLTableElement> = {},
cellFiller: @Composable (i: Int, t: T) -> Unit
) {
val headingIndexes = heading.indices
@ -17,6 +20,7 @@ fun <T> DefaultTable(
{
classes("uk-table")
include(*tableModifiers)
attributesCustomizer()
}
) {
Thead {

6
src/main/kotlin/dev/inmo/jsuikit/elements/TextField.kt
View File

@ -4,7 +4,9 @@ import androidx.compose.runtime.*
import dev.inmo.jsuikit.modifiers.UIKitModifier
import dev.inmo.jsuikit.modifiers.include
import org.jetbrains.compose.web.attributes.*
import org.jetbrains.compose.web.dom.AttrBuilderContext
import org.jetbrains.compose.web.dom.Input
import org.w3c.dom.HTMLInputElement
@Composable
fun <T> TextField(
@ -12,7 +14,8 @@ fun <T> TextField(
state: MutableState<T>,
disabledState: State<Boolean>? = null,
placeholder: String? = null,
vararg modifiers: UIKitModifier
attributesCustomizer: AttrBuilderContext<HTMLInputElement> = {},
modifiers: Array<UIKitModifier> = emptyArray()
) {
Input(type) {
classes("uk-input")
@ -26,5 +29,6 @@ fun <T> TextField(
disabled()
}
}
attributesCustomizer()
}
}