add container support

0.0.44

CHANGELOG.md

@@ -1,5 +1,19 @@
 # Changelog
 
+## 0.0.45
+
+* `Add support of containers in `UIKitContainer` modifiers and `Container` function
+
+## 0.0.44
+
+* `Versions`:
+    * `Compose`: `1.1.0` -> `1.1.1`
+
+## 0.0.43
+
+* Several new extensions for `UIKitModifier` like `UIKitModifier#onSmallScreen`
+* Support of `Tile`
+
 ## 0.0.42
 
 * Migration to compose 1.1.0

gradle.properties

@@ -9,4 +9,4 @@ android.enableJetifier=true
 # Project data
 
 group=dev.inmo
-version=0.0.42
+version=0.0.45

gradle/libs.versions.toml

@@ -1,7 +1,7 @@
 [versions]
 
 kt = "1.6.10"
-jb-compose = "1.1.0"
+jb-compose = "1.1.1"
 jb-dokka = "1.6.10"
 gh-release = "2.2.12"
 

gradle/wrapper/gradle-wrapper.properties

@@ -1,5 +1,5 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-7.3.3-bin.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-7.4.1-bin.zip
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists

src/jsMain/kotlin/dev/inmo/jsuikit/elements/Container.kt

@@ -0,0 +1,21 @@
+package dev.inmo.jsuikit.elements
+
+import androidx.compose.runtime.Composable
+import dev.inmo.jsuikit.modifiers.UIKitContainer
+import dev.inmo.jsuikit.modifiers.include
+import dev.inmo.jsuikit.utils.Attrs
+import org.jetbrains.compose.web.dom.ContentBuilder
+import org.jetbrains.compose.web.dom.Div
+import org.w3c.dom.HTMLDivElement
+
+@Composable
+fun Container(
+    attrs: Attrs<HTMLDivElement> = Attrs.empty(),
+    contentBuilder: ContentBuilder<HTMLDivElement> = {}
+) = Div(
+    {
+        include(UIKitContainer)
+        attrs.builder.invoke(this)
+    },
+    contentBuilder
+)

src/jsMain/kotlin/dev/inmo/jsuikit/elements/Grid.kt

@@ -10,7 +10,7 @@ import org.w3c.dom.HTMLDivElement
 fun GridColumn(
     vararg modifiers: UIKitModifier,
     attributesCustomizer: AttrBuilderContext<HTMLDivElement> = {},
-    builder: @Composable ElementScope<HTMLDivElement>.() -> Unit
+    builder: @Composable ElementScope<HTMLDivElement>.() -> Unit = {}
 ) {
     Div(
         {
@@ -30,7 +30,7 @@ fun Grid(
     marginClass: String? = null,
     firstColumnClass: String? = null,
     attributesCustomizer: AttrBuilderContext<HTMLDivElement> = {},
-    builder: @Composable ElementScope<HTMLDivElement>.() -> Unit
+    builder: @Composable ElementScope<HTMLDivElement>.() -> Unit = {}
 ) {
     val attrs = listOfNotNull(
         if (masonry) "masonry" to "true" else null,

src/jsMain/kotlin/dev/inmo/jsuikit/elements/Tile.kt

@@ -0,0 +1,21 @@
+package dev.inmo.jsuikit.elements
+
+import androidx.compose.runtime.Composable
+import dev.inmo.jsuikit.modifiers.UIKitTile
+import dev.inmo.jsuikit.modifiers.include
+import dev.inmo.jsuikit.utils.Attrs
+import org.jetbrains.compose.web.dom.ContentBuilder
+import org.jetbrains.compose.web.dom.Div
+import org.w3c.dom.HTMLDivElement
+
+@Composable
+fun Tile(
+    attrs: Attrs<HTMLDivElement> = Attrs.empty(),
+    contentBuilder: ContentBuilder<HTMLDivElement>
+) = Div(
+    {
+        include(UIKitTile)
+        attrs.builder(this)
+    },
+    contentBuilder
+)

src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitContainer.kt

@@ -0,0 +1,19 @@
+package dev.inmo.jsuikit.modifiers
+
+sealed class UIKitContainer(
+    override val classes: Array<String> = emptyArray(),
+    override val otherAttrs: Map<String, String> = emptyMap()
+) : UIKitModifier {
+
+    sealed class Size(size: String) : UIKitContainer(arrayOf("uk-container-$size")) {
+        object XSmall : Size("xsmall")
+        object Small : Size("small")
+        object Large : Size("large")
+        object XLarge : Size("xlarge")
+        object Expand : Size("expand")
+    }
+
+    companion object : UIKitContainer(
+        arrayOf("uk-container")
+    )
+}

src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitScreenSizeModifier.kt

@@ -20,3 +20,12 @@ sealed class UIKitScreenSizeModifier(val name: String) {
 }
 
 fun UIKitModifier.applyWhenScreenSizeIs(size: UIKitScreenSizeModifier) = size.modify(this)
+
+val UIKitModifier.onSmallScreens
+    get() = applyWhenScreenSizeIs(UIKitScreenSizeModifier.Small)
+val UIKitModifier.onMediumScreens
+    get() = applyWhenScreenSizeIs(UIKitScreenSizeModifier.Medium)
+val UIKitModifier.onLargeScreens
+    get() = applyWhenScreenSizeIs(UIKitScreenSizeModifier.Large)
+val UIKitModifier.onXLargeScreens
+    get() = applyWhenScreenSizeIs(UIKitScreenSizeModifier.XLarge)

src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitTile.kt

@@ -0,0 +1,15 @@
+package dev.inmo.jsuikit.modifiers
+
+sealed class UIKitTile(
+    override val classes: Array<String> = emptyArray(),
+    override val otherAttrs: Map<String, String> = emptyMap()
+) : UIKitModifier {
+
+    object Default : UIKitTile(arrayOf("uk-tile-default"))
+    object Muted : UIKitTile(arrayOf("uk-tile-muted"))
+    object Primary : UIKitTile(arrayOf("uk-tile-primary"))
+    object Secondary : UIKitTile(arrayOf("uk-tile-secondary"))
+
+    companion object : UIKitTile(arrayOf("uk-tile"))
+
+}