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

Merge pull request #58 from InsanusMokrassar/0.1.3

Browse Source 
0.1.3
This commit is contained in:
InsanusMokrassar 2022-05-19 10:38:33 -04:00 committed by GitHub
commit efd9cb80e1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 210 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
CHANGELOG.md
View File

@ -1,5 +1,10 @@
# Changelog
## 0.1.3
* Add support of sections
* Improve support of navbars
## 0.1.2
* New typealias `AttrsWithContentBuilder`

2
gradle.properties
View File

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

2
src/jsMain/kotlin/dev/inmo/jsuikit/elements/DropArea.kt
View File

@ -10,7 +10,7 @@ import org.w3c.dom.HTMLDivElement
@Composable
fun DropArea(
attrs: Attrs<HTMLDivElement> = Attrs.empty(),
inputAttrs: InputAttrs<String> = Attrs.empty(),
inputAttrs: InputAttrs<String> = InputAttrs.empty(),
contentBuilder: ContentBuilder<HTMLDivElement> = {}
) = Div(
{

59
src/jsMain/kotlin/dev/inmo/jsuikit/elements/Navbar.kt
View File

@ -1,35 +1,76 @@
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.*
import org.jetbrains.compose.web.dom.*
import org.w3c.dom.HTMLDivElement
import org.w3c.dom.HTMLElement
@Composable
fun Navbar(
leftBuilder: NavbarNavBuilder? = null,
attributesCustomizer: AttrBuilderContext<HTMLElement> = {},
contentBuilder: ContentBuilder<HTMLElement>
) {
Nav(
{
include(UIKitNavbar, UIKitNavbar(), UIKitNavbar.Container)
attributesCustomizer()
}
) {
contentBuilder()
}
}
@Deprecated("Will be removed soon. Use the variant with AttrsWithContentBuilders")
@Composable
fun Navbar(
leftBuilder: NavbarNavBuilder?,
centerBuilder: NavbarNavBuilder? = null,
rightBuilder: NavbarNavBuilder? = null,
vararg navModifiers: UIKitModifier,
attributesCustomizer: AttrBuilderContext<HTMLElement> = {},
) {
Nav(
Navbar(
{
attr("uk-navbar", "")
classes("uk-navbar-container", "uk-navbar")
include(*navModifiers)
attributesCustomizer()
}
) {
leftBuilder ?.let {
Div({ classes("uk-navbar-left") }) { it.draw() }
Div({ include(UIKitNavbar.Alignment.Left) }) { it.draw() }
}
centerBuilder ?.let {
Div({ classes("uk-navbar-center") }) { it.draw() }
Div({ include(UIKitNavbar.Alignment.Center) }) { it.draw() }
}
rightBuilder ?.let {
Div({ classes("uk-navbar-right") }) { it.draw() }
Div({ include(UIKitNavbar.Alignment.Right) }) { it.draw() }
}
}
}
@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)
}
}
}

32
src/jsMain/kotlin/dev/inmo/jsuikit/elements/NavbarNavBuilder.kt
View File

@ -1,13 +1,37 @@
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.*
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
@ -28,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>,
@ -46,8 +71,7 @@ class NavbarNavBuilder(
fun draw() {
Ul(
{
classes("uk-navbar-nav")
include(*modifiers)
include(UIKitNavbar.Nav, *modifiers)
attributesCustomizer()
}
) {

2
src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitNav.kt
View File

@ -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
}

81
src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitNavbar.kt
View File

@ -1,17 +1,86 @@
package dev.inmo.jsuikit.modifiers
sealed class UIKitNavbar(suffix: String) : UIKitModifier {
override val classes: Array<String> = arrayOf("uk-navbar-$suffix")
import dev.inmo.jsuikit.types.Dropdown
import dev.inmo.jsuikit.utils.*
object Transparent : UIKitNavbar("transparent")
sealed class Dropdown(suffix: String?) : UIKitNavbar("dropdown${suffix ?.let { "-$it" } ?: ""}") {
sealed class UIKitNavbar(vararg classes: String) : UIKitModifier {
override val classes: Array<String> = classes as Array<String>
object Transparent : UIKitNavbar("uk-navbar-transparent")
object Container : UIKitNavbar("uk-navbar-container")
sealed class Dropdown(suffix: String?) : UIKitNavbar("uk-navbar-dropdown${suffix ?.let { "-$it" } ?: ""}") {
object Nav : Dropdown("nav")
sealed class Width(suffix: String) : Dropdown(suffix) {
object Two : Width("width-2")
object Three : Width("width-3")
object Four : Width("width-4")
object Five : Width("width-5")
}
companion object : Dropdown(null)
}
object Item : UIKitNavbar("item")
sealed class Alignment(val suffix: String) : UIKitNavbar("uk-navbar-$suffix") {
object Left : Alignment("left")
sealed class Center(suffix: String) : Alignment(suffix) {
object Left : Center("center-left")
object Right : Center("center-right")
companion object {
companion object : Center("center")
}
object Right : Alignment("right")
}
object Item : UIKitNavbar("uk-navbar-item")
object Nav : UIKitNavbar("uk-navbar-nav")
object Subtitle : UIKitNavbar("uk-navbar-subtitle")
object Toggle : UIKitNavbar("uk-navbar-toggle")
object Sticky : UIKitNavbar("uk-navbar-sticky")
class Component internal constructor(
override val otherAttrs: Map<String, String>
) : UIKitNavbar(*UIKitNavbar.classes)
companion object : UIKitNavbar("uk-navbar") {
val Logo = UIKitUtility.Logo
operator fun invoke(
align: String?,
mode: String? = null,
delayShow: Milliseconds? = null,
delayHide: Milliseconds? = null,
boundary: String? = null,
boundaryAlign: Boolean? = null,
offset: Pixels? = null,
dropbar: Boolean? = null,
duration: Milliseconds? = null
): Component {
return Component(
mapOf(
buildAttribute(UIKitNavbar.classes.first()) {
"align" to align
"mode" to mode
"delay-show" to delayShow
"delay-hide" to delayHide
"boundary" to boundary
"boundary-align" to boundaryAlign
"offset" to offset
"dropbar" to dropbar
"duration" to duration
}
)
)
}
operator fun invoke(
align: Alignment? = null,
mode: UIKitDropdown.Mode? = null,
delayShow: Milliseconds? = null,
delayHide: Milliseconds? = null,
boundary: String? = null,
boundaryAlign: Boolean? = null,
offset: Pixels? = null,
dropbar: Boolean? = null,
duration: Milliseconds? = null
): Component = invoke(align ?.suffix, mode ?.name, delayShow, delayHide, boundary, boundaryAlign, offset, dropbar, duration)
}
}

23
src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitSection.kt Normal file
View File

@ -0,0 +1,23 @@
package dev.inmo.jsuikit.modifiers
sealed class UIKitSection(vararg classes: String) : UIKitModifier {
override val classes: Array<String> = classes as Array<String>
sealed class Style(suffix: String) : UIKitSection("uk-section-$suffix") {
object Default : Style("default")
object Muted : Style("muted")
object Primary : Style("primary")
object Secondary : Style("secondary")
}
sealed class Size(suffix: String) : UIKitSection("uk-section-$suffix") {
object XSmall : Size("xsmall")
object Small : Size("small")
object Large : Size("large")
object XLarge : Size("xlarge")
}
object Overlap : UIKitSection("uk-section-overlap")
companion object : UIKitSection("uk-section")
}

9
src/jsMain/kotlin/dev/inmo/jsuikit/modifiers/UIKitUtility.kt
View File

@ -38,7 +38,10 @@ sealed class UIKitUtility(classname: String) : UIKitModifier {
object Width : Responsive("width")
object Height : Responsive("height")
}
object PreserveWidth : UIKitUtility("uk-preserve-width")
sealed class Preserve(suffix: String) : UIKitUtility("uk-preserve-$suffix") {
object Width : Preserve("width")
object Color : Preserve("color")
}
sealed class Border(suffix: String) : UIKitUtility("uk-border-$suffix") {
object Rounded : Border("rounded")
@ -112,4 +115,8 @@ sealed class UIKitUtility(classname: String) : UIKitModifier {
object Open : UIKitUtility("uk-open")
object Link : UIKitUtility("uk-link")
companion object {
val PreserveWidth = Preserve.Width
}
}

17
src/jsMain/kotlin/dev/inmo/jsuikit/utils/AttrsWithContentBuilder.kt
View File

@ -1,10 +1,27 @@
package dev.inmo.jsuikit.utils
import dev.inmo.jsuikit.modifiers.UIKitModifier
import org.jetbrains.compose.web.attributes.AttrsScope
import org.jetbrains.compose.web.dom.ContentBuilder
import org.w3c.dom.Element
typealias AttrsWithContentBuilder<T> = Pair<Attrs<T>, ContentBuilder<T>>
@Suppress("NOTHING_TO_INLINE")
inline fun <T : Element> AttrsWithContentBuilder(
vararg modifiers: UIKitModifier?,
noinline attrs: AttrsScope<T>.() -> Unit = {},
noinline builder: ContentBuilder<T>
) = AttrsWithContentBuilder(
Attrs(*modifiers, attrs = attrs),
builder
)
@Suppress("NOTHING_TO_INLINE")
inline fun <T : Element> AttrsWithContentBuilder(attrs: Attrs<T>) = AttrsWithContentBuilder(
attrs
) {}
inline val <T : Element> AttrsWithContentBuilder<T>.attrs
get() = first