diff --git a/CHANGELOG.md b/CHANGELOG.md index be69bd7..19bd296 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,9 @@ ## 0.2.2 +* Add support of `Drop` component +* Improve support of `Navbar`s + ## 0.2.1 * `Tab` elements become supported diff --git a/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Drop.kt b/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Drop.kt new file mode 100644 index 0000000..abbfd04 --- /dev/null +++ b/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Drop.kt @@ -0,0 +1,24 @@ +package dev.inmo.jsuikit.elements + +import androidx.compose.runtime.Composable +import dev.inmo.jsuikit.modifiers.UIKitDrop +import dev.inmo.jsuikit.modifiers.attrsBuilder +import dev.inmo.jsuikit.utils.* +import org.jetbrains.compose.web.dom.Div +import org.w3c.dom.HTMLButtonElement +import org.w3c.dom.HTMLDivElement + +@Composable +fun Drop( + buttonBuilder: AttrsWithContentBuilder, + dropBuilder: AttrsWithContentBuilder +) { + DefaultButton( + attributesCustomizer = buttonBuilder.attributesBuilderContext, + contentAllocator = buttonBuilder.builder + ) + Div( + (Attrs(UIKitDrop.Custom()) + dropBuilder.attrs).builder, + dropBuilder.builder + ) +} diff --git a/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Iconnav.kt b/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Iconnav.kt index 50d3043..9f3cf20 100644 --- a/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Iconnav.kt +++ b/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Iconnav.kt @@ -10,7 +10,7 @@ import org.w3c.dom.HTMLLIElement import org.w3c.dom.HTMLUListElement @Composable -fun Iconnav( +fun IconNav( data: Iterable, listAttrs: Attrs = Attrs.empty(), elementAttrsBuilder: AttrsScope.(T) -> Unit = {}, @@ -31,3 +31,11 @@ fun Iconnav( } } } + +@Composable +fun Iconnav( + data: Iterable, + listAttrs: Attrs = Attrs.empty(), + elementAttrsBuilder: AttrsScope.(T) -> Unit = {}, + elementBuilder: @Composable ElementScope.(T) -> Unit +) = IconNav(data, listAttrs, elementAttrsBuilder, elementBuilder) diff --git a/src/jsMain/kotlin/dev/inmo/jsuikit/elements/NavbarNavBuilder.kt b/src/jsMain/kotlin/dev/inmo/jsuikit/elements/NavbarNavBuilder.kt index f749d62..c12cefd 100644 --- a/src/jsMain/kotlin/dev/inmo/jsuikit/elements/NavbarNavBuilder.kt +++ b/src/jsMain/kotlin/dev/inmo/jsuikit/elements/NavbarNavBuilder.kt @@ -5,8 +5,7 @@ import dev.inmo.jsuikit.modifiers.* import dev.inmo.jsuikit.utils.* import org.jetbrains.compose.web.attributes.AttrsScope import org.jetbrains.compose.web.dom.* -import org.w3c.dom.HTMLLIElement -import org.w3c.dom.HTMLUListElement +import org.w3c.dom.* @Composable fun NavbarNav( @@ -30,3 +29,17 @@ fun NavbarNav( vararg elements: AttrsWithContentBuilder, attrs: Attrs = Attrs.empty() ) = NavbarNav(elements.toList(), attrs) + +fun NavbarNavBuilder( + elements: List>, + attrs: Attrs = Attrs.empty(), + containerAttrs: Attrs = Attrs.empty() +) = AttrsWithContentBuilder(containerAttrs) { + NavbarNav(elements, attrs) +} + +fun NavbarNavBuilder( + vararg elements: AttrsWithContentBuilder, + attrs: Attrs = Attrs.empty(), + containerAttrs: Attrs = Attrs.empty() +) = NavbarNavBuilder(elements.toList(), attrs, containerAttrs) diff --git a/src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitDrop.kt b/src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitDrop.kt new file mode 100644 index 0000000..b55212b --- /dev/null +++ b/src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitDrop.kt @@ -0,0 +1,122 @@ +package dev.inmo.jsuikit.modifiers + +import dev.inmo.jsuikit.utils.* +import org.jetbrains.compose.web.css.selectors.CSSSelector + +sealed class UIKitDrop( + override val classes: Array = emptyArray(), + override val otherAttrs: Map = emptyMap() +) : UIKitModifier { + sealed class Position(name: String) : AttributeValue(name) { + + sealed class Bottom(name: String) : Position("bottom-$name") { + + object Left : Bottom("left") + object Center : Bottom("center") + object Right : Bottom("right") + object Justify : Bottom("justify") + + } + + sealed class Top(name: String) : Position("top-$name") { + + object Left : Top("left") + object Center : Top("center") + object Right : Top("right") + object Justify : Top("justify") + + } + + sealed class Left(name: String) : Position("left-$name") { + + object Top : Left("top") + object Center : Left("center") + object Bottom : Left("bottom") + + } + + sealed class Right(name: String) : Position("right-$name") { + + object Top : Right("top") + object Center : Right("center") + object Bottom : Right("bottom") + + } + } + + sealed class Stretch(name: String) : AttributeValue(name) { + object True : Stretch("true") + object X : Stretch("x") + object Y : Stretch("y") + } + + sealed class Mode(name: String) : AttributeValue(name) { + + object Click : Mode("click") + object Hover : Mode("hover") + + object None : Mode("") + object HoverAndClick : Mode("$Hover, $Click") + + } + + class Custom internal constructor( + classes: Array = emptyArray(), + otherAttrs: Map = emptyMap() + ) : UIKitDrop(classes, otherAttrs) + + companion object { + operator fun invoke( + toggle: CSSSelector? = null, + position: Position? = null, + stretch: Stretch? = null, + mode: Mode? = null, + delayShow: Milliseconds? = null, + delayHide: Milliseconds? = null, + autoUpdate: Boolean? = null, + boundary: CSSSelector? = null, + boundaryX: CSSSelector? = null, + boundaryY: CSSSelector? = null, + target: CSSSelector? = null, + targetX: CSSSelector? = null, + targetY: CSSSelector? = null, + inset: Boolean? = null, + flip: Boolean? = null, + shift: Boolean? = null, + offset: Pixels? = null, + animation: UIKitAnimation? = null, + animationOut: Boolean? = null, + bgScroll: Boolean? = null, + duration: Milliseconds? = null, + container: Boolean? = null + ) = Custom( + arrayOf("uk-drop"), + mapOf( + buildAttribute("uk-drop") { + "toggle" to toggle + "position" to position + "stretch" to stretch + "mode" to mode + "delay-show" to delayShow + "delay-hide" to delayHide + "auto-update" to autoUpdate + "boundary" to boundary + "boundary-x" to boundaryX + "boundary-y" to boundaryY + "target" to target + "target-x" to targetX + "target-y" to targetY + "inset" to inset + "flip" to flip + "shift" to shift + "offset" to offset + "animation" to animation + "animation-out" to animationOut + "bg-scroll" to bgScroll + "duration" to duration + "container" to container + } + ) + ) + } +} diff --git a/src/jsMain/kotlin/dev/inmo/jsuikit/utils/ParametersBuilder.kt b/src/jsMain/kotlin/dev/inmo/jsuikit/utils/ParametersBuilder.kt index edde3f3..219c529 100644 --- a/src/jsMain/kotlin/dev/inmo/jsuikit/utils/ParametersBuilder.kt +++ b/src/jsMain/kotlin/dev/inmo/jsuikit/utils/ParametersBuilder.kt @@ -1,13 +1,17 @@ package dev.inmo.jsuikit.utils +import dev.inmo.jsuikit.modifiers.AttributeValue + class ParametersBuilder( val skipNullValues: Boolean = true, private val parameters: MutableMap = mutableMapOf() ) { fun add(k: String, v: Any? = null) { - if (v != null || !skipNullValues) { - parameters[k] = v ?.toString() + when { + v is AttributeValue -> parameters[k] = v.name + v == null && skipNullValues -> return + else -> parameters[k] = v ?.toString() } } infix fun String.to(value: Any?) = add(this, value)