diff --git a/render-compose-html/src/jsMain/kotlin/ink/ui/render/compose/html/HtmlComposeRenderer.kt b/render-compose-html/src/jsMain/kotlin/ink/ui/render/compose/html/HtmlComposeRenderer.kt
index 8faf1d4..ac03606 100644
--- a/render-compose-html/src/jsMain/kotlin/ink/ui/render/compose/html/HtmlComposeRenderer.kt
+++ b/render-compose-html/src/jsMain/kotlin/ink/ui/render/compose/html/HtmlComposeRenderer.kt
@@ -4,7 +4,9 @@ import androidx.compose.runtime.Composable
import ink.ui.render.compose.html.renderer.*
import ink.ui.render.compose.html.renderer.CompositeElementRenderer
import ink.ui.render.web.gridTemplateColumns
+import ink.ui.structures.GroupingStyle.*
import ink.ui.structures.Positioning
+import ink.ui.structures.elements.ElementList
import ink.ui.structures.elements.UiElement
import ink.ui.structures.layouts.*
import ink.ui.structures.render.RenderResult
@@ -81,13 +83,11 @@ class HtmlComposeRenderer(
renderElement(uiLayout.body)
}
}
- is ScrollingListLayout -> Section(
- attrs = {
- classes("item-list")
- }
- ) {
- uiLayout.items.forEach {
- Div {
+ is ScrollingListLayout -> when (uiLayout.groupingStyle) {
+ Unified -> renderElement(ElementList(uiLayout.items, groupingStyle = Unified))
+ Items -> renderElement(ElementList(uiLayout.items, groupingStyle = Items))
+ Sections -> uiLayout.items.forEach {
+ Section {
renderElement(it)
}
}
diff --git a/render-compose/src/commonMain/kotlin/ink/ui/render/compose/ComposeRenderer.kt b/render-compose/src/commonMain/kotlin/ink/ui/render/compose/ComposeRenderer.kt
index 8d89c06..295e3a4 100644
--- a/render-compose/src/commonMain/kotlin/ink/ui/render/compose/ComposeRenderer.kt
+++ b/render-compose/src/commonMain/kotlin/ink/ui/render/compose/ComposeRenderer.kt
@@ -8,6 +8,7 @@ import androidx.compose.foundation.lazy.items
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
import ink.ui.render.compose.renderer.*
import ink.ui.render.compose.renderer.ActivityRenderer
import ink.ui.render.compose.renderer.CompositeElementRenderer
@@ -15,6 +16,8 @@ import ink.ui.render.compose.renderer.EmptyRenderer
import ink.ui.render.compose.renderer.TextRenderer
import ink.ui.render.compose.theme.ComposeRenderTheme
import ink.ui.render.compose.theme.defaultTheme
+import ink.ui.structures.GroupingStyle
+import ink.ui.structures.GroupingStyle.*
import ink.ui.structures.Positioning
import ink.ui.structures.elements.UiElement
import ink.ui.structures.layouts.*
@@ -95,23 +98,30 @@ class ComposeRenderer(
){
renderElement(uiLayout.body)
}
- is ScrollingListLayout -> LazyColumn(
- contentPadding = WindowInsets(
- top = theme.spacing.gutters - theme.spacing.item,
- bottom = theme.spacing.gutters - theme.spacing.item,
- left = theme.spacing.gutters - theme.spacing.item,
- right = theme.spacing.gutters - theme.spacing.item,
- ).add(WindowInsets.safeDrawing).asPaddingValues(),
- modifier = Modifier
- .background(theme.colors.background)
- .fillMaxSize()
- ) {
- items(uiLayout.items) { item ->
- Box(
- modifier = Modifier.padding(theme.spacing.item)
- .fillMaxWidth(),
- ) {
- renderElement(item)
+ is ScrollingListLayout -> {
+ val itemSpacing = when (uiLayout.groupingStyle) {
+ Unified -> 0.dp
+ Items -> theme.spacing.item
+ Sections -> theme.spacing.sectionSpacing
+ }
+ LazyColumn(
+ contentPadding = WindowInsets(
+ top = theme.spacing.gutters - itemSpacing,
+ bottom = theme.spacing.gutters - itemSpacing,
+ left = theme.spacing.gutters - itemSpacing,
+ right = theme.spacing.gutters - itemSpacing,
+ ).add(WindowInsets.safeDrawing).asPaddingValues(),
+ modifier = Modifier
+ .background(theme.colors.background)
+ .fillMaxSize()
+ ) {
+ items(uiLayout.items) { item ->
+ Box(
+ modifier = Modifier.padding(itemSpacing)
+ .fillMaxWidth(),
+ ) {
+ renderElement(item)
+ }
}
}
}
diff --git a/render-static-html/src/jvmMain/kotlin/ink/ui/render/statichtml/HtmlRenderer.kt b/render-static-html/src/jvmMain/kotlin/ink/ui/render/statichtml/HtmlRenderer.kt
index 3508420..2da8192 100644
--- a/render-static-html/src/jvmMain/kotlin/ink/ui/render/statichtml/HtmlRenderer.kt
+++ b/render-static-html/src/jvmMain/kotlin/ink/ui/render/statichtml/HtmlRenderer.kt
@@ -4,6 +4,7 @@ import ink.ui.render.statichtml.renderer.*
import ink.ui.render.statichtml.renderer.CompositeElementRenderer
import ink.ui.render.statichtml.renderer.TextRenderer
import ink.ui.render.web.gridTemplateColumns
+import ink.ui.structures.GroupingStyle.*
import ink.ui.structures.Positioning
import ink.ui.structures.elements.ElementList
import ink.ui.structures.elements.UiElement
@@ -78,12 +79,30 @@ class HtmlRenderer(
renderer = renderer,
)
}
- is ScrollingListLayout -> section {
- renderWith(
- element = ElementList(uiLayout.items),
- consumer = consumer,
- renderer = renderer,
- )
+ is ScrollingListLayout -> when (uiLayout.groupingStyle) {
+ Unified -> section {
+ renderWith(
+ element = ElementList(uiLayout.items, groupingStyle = Unified),
+ consumer = consumer,
+ renderer = renderer,
+ )
+ }
+ Items -> section {
+ renderWith(
+ element = ElementList(uiLayout.items, groupingStyle = Items),
+ consumer = consumer,
+ renderer = renderer,
+ )
+ }
+ Sections -> uiLayout.items.forEach { item ->
+ section {
+ renderWith(
+ element = item,
+ consumer = consumer,
+ renderer = renderer,
+ )
+ }
+ }
}
}
}
diff --git a/render-web-common/build.gradle.kts b/render-web-common/build.gradle.kts
index 4f2adb4..0570f45 100644
--- a/render-web-common/build.gradle.kts
+++ b/render-web-common/build.gradle.kts
@@ -10,6 +10,7 @@ kotlin {
binaries.executable()
}
jvm()
+ jvmToolchain(11)
sourceSets {
commonMain.dependencies {
diff --git a/structures/api/structures.api b/structures/api/structures.api
index f88aee2..81bc386 100644
--- a/structures/api/structures.api
+++ b/structures/api/structures.api
@@ -524,11 +524,14 @@ public final class ink/ui/structures/layouts/PageLayout : ink/ui/structures/layo
}
public final class ink/ui/structures/layouts/ScrollingListLayout : ink/ui/structures/layouts/UiLayout {
- public fun (Ljava/util/List;)V
+ public fun (Ljava/util/List;Link/ui/structures/GroupingStyle;)V
+ public synthetic fun (Ljava/util/List;Link/ui/structures/GroupingStyle;ILkotlin/jvm/internal/DefaultConstructorMarker;)V
public final fun component1 ()Ljava/util/List;
- public final fun copy (Ljava/util/List;)Link/ui/structures/layouts/ScrollingListLayout;
- public static synthetic fun copy$default (Link/ui/structures/layouts/ScrollingListLayout;Ljava/util/List;ILjava/lang/Object;)Link/ui/structures/layouts/ScrollingListLayout;
+ public final fun component2 ()Link/ui/structures/GroupingStyle;
+ public final fun copy (Ljava/util/List;Link/ui/structures/GroupingStyle;)Link/ui/structures/layouts/ScrollingListLayout;
+ public static synthetic fun copy$default (Link/ui/structures/layouts/ScrollingListLayout;Ljava/util/List;Link/ui/structures/GroupingStyle;ILjava/lang/Object;)Link/ui/structures/layouts/ScrollingListLayout;
public fun equals (Ljava/lang/Object;)Z
+ public final fun getGroupingStyle ()Link/ui/structures/GroupingStyle;
public final fun getItems ()Ljava/util/List;
public fun hashCode ()I
public fun toString ()Ljava/lang/String;
diff --git a/structures/src/commonMain/kotlin/ink/ui/structures/layouts/ScrollingListLayout.kt b/structures/src/commonMain/kotlin/ink/ui/structures/layouts/ScrollingListLayout.kt
index dcccb94..c25b84c 100644
--- a/structures/src/commonMain/kotlin/ink/ui/structures/layouts/ScrollingListLayout.kt
+++ b/structures/src/commonMain/kotlin/ink/ui/structures/layouts/ScrollingListLayout.kt
@@ -1,5 +1,6 @@
package ink.ui.structures.layouts
+import ink.ui.structures.GroupingStyle
import ink.ui.structures.elements.UiElement
/**
@@ -10,4 +11,9 @@ data class ScrollingListLayout(
* Elements to be displayed in the scrolling section of the layout.
*/
val items: List,
+
+ /**
+ * Signifiers for indicating how the elements are related to each other.
+ */
+ val groupingStyle: GroupingStyle = GroupingStyle.Items,
): UiLayout