improve AttrsWithContentBuilder functions

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

@@ -2,7 +2,9 @@ package dev.inmo.jsuikit.elements
 
 import androidx.compose.runtime.Composable
 import dev.inmo.jsuikit.modifiers.*
+import dev.inmo.jsuikit.utils.*
 import org.jetbrains.compose.web.dom.*
+import org.w3c.dom.HTMLDivElement
 import org.w3c.dom.HTMLElement
 
 @Composable
@@ -20,9 +22,10 @@ fun Navbar(
     }
 }
 
+@Deprecated("Will be removed soon. Use the variant with AttrsWithContentBuilders")
 @Composable
 fun Navbar(
-    leftBuilder: NavbarNavBuilder? = null,
+    leftBuilder: NavbarNavBuilder?,
     centerBuilder: NavbarNavBuilder? = null,
     rightBuilder: NavbarNavBuilder? = null,
     vararg navModifiers: UIKitModifier,
@@ -45,3 +48,29 @@ fun Navbar(
         }
     }
 }
+
+@Composable
+fun Navbar(
+    leftBuilder: AttrsWithContentBuilder<HTMLDivElement>? = null,
+    centerBuilder: AttrsWithContentBuilder<HTMLDivElement>? = null,
+    rightBuilder: AttrsWithContentBuilder<HTMLDivElement>? = null,
+    vararg navModifiers: UIKitModifier,
+    attributesCustomizer: AttrBuilderContext<HTMLElement> = {},
+) {
+    Navbar(
+        attributesCustomizer = {
+            include(*navModifiers)
+            attributesCustomizer()
+        }
+    ) {
+        leftBuilder ?.let {
+            Div({ include(UIKitNavbar.Alignment.Left);leftBuilder.attributesBuilderContext(this) }, leftBuilder.builder)
+        }
+        centerBuilder ?.let {
+            Div({ include(UIKitNavbar.Alignment.Center);centerBuilder.attributesBuilderContext(this) }, centerBuilder.builder)
+        }
+        rightBuilder ?.let {
+            Div({ include(UIKitNavbar.Alignment.Right);rightBuilder.attributesBuilderContext(this) }, rightBuilder.builder)
+        }
+    }
+}

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

@@ -2,11 +2,36 @@ package dev.inmo.jsuikit.elements
 
 import androidx.compose.runtime.Composable
 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
 
+@Composable
+fun NavbarNav(
+    elements: List<AttrsWithContentBuilder<HTMLLIElement>>,
+    attrs: Attrs<HTMLUListElement> = Attrs.empty()
+) {
+    Ul(
+        {
+            include(UIKitNavbar.Nav)
+            attrs.builder(this)
+        }
+    ) {
+        elements.forEach { element ->
+            Li(element.attributesBuilderContext, element.builder)
+        }
+    }
+}
+
+@Composable
+fun NavbarNav(
+    vararg elements: AttrsWithContentBuilder<HTMLLIElement>,
+    attrs: Attrs<HTMLUListElement> = Attrs.empty()
+) = NavbarNav(elements.toList(), attrs)
+
+@Deprecated("Will be removed soon. Use NavbarNavPart with AttrsWithContentBuilder instead")
 interface NavbarNavElement {
     fun AttrsScope<HTMLLIElement>.setup() {}
     @Composable
@@ -27,6 +52,7 @@ interface NavbarNavElement {
     }
 }
 
+@Deprecated("Will be removed soon. Use NavbarNavPart with AttrsWithContentBuilder instead")
 class NavbarNavBuilder(
     private val modifiers: Array<UIKitModifier>,
     private val elements: List<NavbarNavElement>,

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

@@ -14,6 +14,8 @@ sealed class UIKitNav(classname: String) : UIKitModifier {
 
     object Center : UIKitNav("uk-nav-center")
 
+    object Sub : UIKitNav("uk-nav-sub")
+
     companion object : UIKitNav("uk-nav") {
         val SubNav = UIKitSubNav
     }

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

@@ -44,7 +44,7 @@ sealed class UIKitNavbar(vararg classes: String) : UIKitModifier {
         val Logo = UIKitUtility.Logo
 
         operator fun invoke(
-            align: String? = null,
+            align: String?,
             mode: String? = null,
             delayShow: Milliseconds? = null,
             delayHide: Milliseconds? = null,

src/jsMain/kotlin/dev/inmo/jsuikit/utils/AttrsWithContentBuilder.kt

@@ -8,8 +8,12 @@ import org.w3c.dom.Element
 typealias AttrsWithContentBuilder<T> = Pair<Attrs<T>, ContentBuilder<T>>
 
 @Suppress("NOTHING_TO_INLINE")
-inline fun <T : Element> AttrsWithContentBuilder(noinline builder: ContentBuilder<T>) = AttrsWithContentBuilder(
-    Attrs.empty(),
+inline fun <T : Element> AttrsWithContentBuilder(
+    vararg modifiers: UIKitModifier?,
+    noinline attrs: AttrsScope<T>.() -> Unit = {},
+    noinline builder: ContentBuilder<T>
+) = AttrsWithContentBuilder(
+    Attrs(*modifiers, attrs = attrs),
     builder
 )
 
@@ -18,15 +22,6 @@ inline fun <T : Element> AttrsWithContentBuilder(attrs: Attrs<T>) = AttrsWithCon
     attrs
 ) {}
 
-@Suppress("NOTHING_TO_INLINE")
-inline fun <T : Element> AttrsWithContentBuilder(
-    modifier: UIKitModifier?,
-    vararg modifiers: UIKitModifier?,
-    noinline attrs: AttrsScope<T>.() -> Unit = {}
-) = AttrsWithContentBuilder(
-    Attrs(modifier, *modifiers, attrs = attrs)
-)
-
 inline val <T : Element> AttrsWithContentBuilder<T>.attrs
     get() = first