diff --git a/CHANGELOG.md b/CHANGELOG.md index b1c1edd..35e8e63 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,12 @@ # Changelog +## 0.1.9 + +* `Artile` elements become supported +* `Iconnav` elements become supported +* `Leader` elements become supported +* `Grid` support improvements + ## 0.1.8 * `Compose`: `1.2.0-alpha01-dev731` diff --git a/gradle.properties b/gradle.properties index deb4cc0..8ca52bf 100644 --- a/gradle.properties +++ b/gradle.properties @@ -9,4 +9,4 @@ android.enableJetifier=true # Project data group=dev.inmo -version=0.1.8 +version=0.1.9 diff --git a/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Article.kt b/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Article.kt new file mode 100644 index 0000000..8b861f6 --- /dev/null +++ b/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Article.kt @@ -0,0 +1,57 @@ +package dev.inmo.jsuikit.elements + +import androidx.compose.runtime.Composable +import dev.inmo.jsuikit.modifiers.UIKitArticle +import dev.inmo.jsuikit.modifiers.include +import dev.inmo.jsuikit.utils.Attrs +import dev.inmo.jsuikit.utils.optionallyDraw +import org.jetbrains.compose.web.dom.* +import org.jetbrains.compose.web.dom.Text +import org.w3c.dom.* + +@Composable +fun UIKitArticleElement ( + headerBuilder: ContentBuilder, + headerAttrs: Attrs = Attrs.empty(), + metaBuilder: ContentBuilder? = null, + metaAttrs: Attrs? = null, + otherContentBuilder: ContentBuilder +) = Article( + { + include(UIKitArticle) + } +) { + H1( + { + include(UIKitArticle.Title) + headerAttrs.builder(this) + }, + headerBuilder + ) + optionallyDraw(metaAttrs, metaBuilder) { + P( + { + include(UIKitArticle.Meta) + metaAttrs ?.builder ?.invoke(this) + }, + metaBuilder ?: {} + ) + } + + otherContentBuilder() +} + +@Composable +fun UIKitArticleElement ( + header: String, + meta: String? = null, + otherContentBuilder: ContentBuilder +) = UIKitArticleElement( + { Text(header) }, + metaBuilder = meta ?.let { + { + Text(meta) + } + }, + otherContentBuilder = otherContentBuilder +) diff --git a/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Grid.kt b/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Grid.kt index bc31bce..ad47d32 100644 --- a/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Grid.kt +++ b/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Grid.kt @@ -1,8 +1,8 @@ package dev.inmo.jsuikit.elements import androidx.compose.runtime.Composable -import dev.inmo.jsuikit.modifiers.UIKitModifier -import dev.inmo.jsuikit.modifiers.include +import dev.inmo.jsuikit.modifiers.* +import dev.inmo.jsuikit.utils.buildAttribute import org.jetbrains.compose.web.dom.* import org.w3c.dom.HTMLDivElement @@ -26,23 +26,18 @@ fun GridColumn( fun Grid( vararg modifiers: UIKitModifier, masonry: Boolean = false, - parallax: Int? = null, - marginClass: String? = null, + parallax: UInt? = null, + marginClass: UIKitMargin? = null, firstColumnClass: String? = null, attributesCustomizer: AttrBuilderContext = {}, - builder: @Composable ElementScope.() -> Unit = {} + builder: ContentBuilder = {} ) { - val attrs = listOfNotNull( - if (masonry) "masonry" to "true" else null, - parallax ?.let { "parallax" to it.toString() }, - marginClass ?.let { "margin" to it }, - firstColumnClass ?.let { "first-column" to it }, - ) Div( { - attr("uk-grid", attrs.joinToString(";") { (k, v) -> "$k: $v" }) - classes("uk-grid") - include(*modifiers) + include( + UIKitGrid.invoke(marginClass, firstColumnClass, masonry, parallax), + *modifiers + ) attributesCustomizer() } ) { diff --git a/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Iconnav.kt b/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Iconnav.kt new file mode 100644 index 0000000..50d3043 --- /dev/null +++ b/src/jsMain/kotlin/dev/inmo/jsuikit/elements/Iconnav.kt @@ -0,0 +1,33 @@ +package dev.inmo.jsuikit.elements + +import androidx.compose.runtime.Composable +import dev.inmo.jsuikit.modifiers.UIKitIconnav +import dev.inmo.jsuikit.modifiers.include +import dev.inmo.jsuikit.utils.Attrs +import org.jetbrains.compose.web.attributes.AttrsScope +import org.jetbrains.compose.web.dom.* +import org.w3c.dom.HTMLLIElement +import org.w3c.dom.HTMLUListElement + +@Composable +fun Iconnav( + data: Iterable, + listAttrs: Attrs = Attrs.empty(), + elementAttrsBuilder: AttrsScope.(T) -> Unit = {}, + elementBuilder: @Composable ElementScope.(T) -> Unit +) { + Ul( + { + include(UIKitIconnav) + listAttrs.builder(this) + } + ) { + data.forEach { + Li( + { + elementAttrsBuilder.invoke(this, it) + } + ) { elementBuilder(this, it) } + } + } +} diff --git a/src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitArticle.kt b/src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitArticle.kt new file mode 100644 index 0000000..56ec3f5 --- /dev/null +++ b/src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitArticle.kt @@ -0,0 +1,12 @@ +package dev.inmo.jsuikit.modifiers + +sealed class UIKitArticle( + override val classes: Array +) : UIKitModifier { + + object Title : UIKitArticle(arrayOf("uk-article-title")) + object Meta : UIKitArticle(arrayOf("uk-article-meta")) + + companion object : UIKitArticle(arrayOf("uk-article")) + +} diff --git a/src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitGrid.kt b/src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitGrid.kt index b97b769..1de9752 100644 --- a/src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitGrid.kt +++ b/src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitGrid.kt @@ -19,7 +19,7 @@ sealed class UIKitGrid(vararg classnames: String) : UIKitModifier { object MatchHeight : UIKitGrid("uk-grid-match") object ItemMatchHeight : UIKitGrid("uk-grid-item-match") - class Custom internal constructor(override val otherAttrs: Map) : UIKitGrid() + class Custom internal constructor(override val otherAttrs: Map) : UIKitGrid("uk-grid") companion object : UIKitGrid("uk-grid") { operator fun invoke( diff --git a/src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitIconnav.kt b/src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitIconnav.kt new file mode 100644 index 0000000..93df57a --- /dev/null +++ b/src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitIconnav.kt @@ -0,0 +1,11 @@ +package dev.inmo.jsuikit.modifiers + +sealed class UIKitIconnav( + override val classes: Array +) : UIKitModifier { + + object Vertical : UIKitIconnav(arrayOf("uk-iconnav-vertical")) + + companion object : UIKitIconnav(arrayOf("uk-iconnav")) + +} diff --git a/src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitLeader.kt b/src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitLeader.kt new file mode 100644 index 0000000..2b4905b --- /dev/null +++ b/src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitLeader.kt @@ -0,0 +1,28 @@ +package dev.inmo.jsuikit.modifiers + +import dev.inmo.jsuikit.utils.buildAttribute + +sealed class UIKitLeader( + override val classes: Array, + override val otherAttrs: Map +) : UIKitModifier { + + class Custom( + otherAttrs: Map + ) : UIKitLeader(arrayOf("uk-leader"), otherAttrs) + + companion object : UIKitLeader(arrayOf("uk-leader"), emptyMap()) { + operator fun invoke( + media: String? = null, + fill: String? = null + ) = Custom( + mapOf( + buildAttribute("uk-leader") { + "fill" to fill + "media" to media + } + ) + ) + } + +}