From e6b5fb9b4e016ab5e6f4fa01aa0ec811fa7babc8 Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Wed, 13 May 2026 18:23:09 -0700
Subject: [PATCH 01/19] Implement multi-button swipeActions for Android

Replace the View.swipeActions(...) unavailable stub with a working
implementation backed by AnchoredDraggable-style horizontal drag in
Compose. Buttons declared inside swipeActions(content:) are extracted
via ComposeBuilder.Evaluate, rendered as Material reveal cells pinned
to the swiped edge, and tinted by ButtonRole (.destructive uses
MaterialTheme.colorScheme.error).

Adds SwipeActionsModifier (RenderModifier) under Commands/, mirrors
the EditActionsModifier collector pattern, and wires combined(for:)
into RenderEditableItem so user-provided .swipeActions takes precedence
over the implicit onDelete trash-swipe. Falling back to the existing
SwipeToDismissBox when only onDelete is set keeps the prior behavior.

Supports leading + trailing edges, allowsFullSwipe (full-swipe fires
the first declared action), and per-button tap.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 .../SkipUI/SkipUI/Commands/SwipeActions.swift |  55 ++++++
 Sources/SkipUI/SkipUI/Containers/List.swift   | 179 ++++++++++++++++--
 2 files changed, 221 insertions(+), 13 deletions(-)
 create mode 100644 Sources/SkipUI/SkipUI/Commands/SwipeActions.swift

diff --git a/Sources/SkipUI/SkipUI/Commands/SwipeActions.swift b/Sources/SkipUI/SkipUI/Commands/SwipeActions.swift
new file mode 100644
index 00000000..1b5e3929
--- /dev/null
+++ b/Sources/SkipUI/SkipUI/Commands/SwipeActions.swift
@@ -0,0 +1,55 @@
+// Copyright 2023–2026 Skip
+// SPDX-License-Identifier: MPL-2.0
+#if !SKIP_BRIDGE
+import Foundation
+
+extension View {
+    public func swipeActions(edge: HorizontalEdge = .trailing, allowsFullSwipe: Bool = true, @ViewBuilder content: () -> any View) -> some View {
+        #if SKIP
+        return ModifiedContent(content: self, modifier: SwipeActionsModifier(edge: edge, allowsFullSwipe: allowsFullSwipe, content: ComposeBuilder.from(content)))
+        #else
+        return self
+        #endif
+    }
+}
+
+#if SKIP
+/// Holds a single edge's swipe action configuration.
+struct SwipeActionsConfig {
+    let allowsFullSwipe: Bool
+    let content: ComposeBuilder
+}
+
+final class SwipeActionsModifier: RenderModifier {
+    let edge: HorizontalEdge
+    let allowsFullSwipe: Bool
+    let content: ComposeBuilder
+
+    init(edge: HorizontalEdge, allowsFullSwipe: Bool, content: ComposeBuilder) {
+        self.edge = edge
+        self.allowsFullSwipe = allowsFullSwipe
+        self.content = content
+        super.init()
+    }
+
+    /// Walk the modifier chain and collect leading + trailing swipe configs.
+    /// Innermost modifier on a given edge wins (matches SwiftUI semantics).
+    static func combined(for renderable: Renderable) -> (leading: SwipeActionsConfig?, trailing: SwipeActionsConfig?) {
+        var leading: SwipeActionsConfig? = nil
+        var trailing: SwipeActionsConfig? = nil
+        renderable.forEachModifier {
+            if let mod = $0 as? SwipeActionsModifier {
+                let config = SwipeActionsConfig(allowsFullSwipe: mod.allowsFullSwipe, content: mod.content)
+                if mod.edge == .leading {
+                    leading = leading ?? config
+                } else {
+                    trailing = trailing ?? config
+                }
+            }
+            return nil
+        }
+        return (leading: leading, trailing: trailing)
+    }
+}
+#endif
+#endif
diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index c7714f87..3612180c 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -4,12 +4,18 @@
 import Foundation
 #if SKIP
 import androidx.compose.animation.core.animateDpAsState
+import androidx.compose.animation.core.Animatable
 import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
+import androidx.compose.foundation.gestures.Orientation
+import androidx.compose.foundation.gestures.draggable
+import androidx.compose.foundation.gestures.rememberDraggableState
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.BoxWithConstraints
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
@@ -17,6 +23,7 @@ import androidx.compose.foundation.layout.heightIn
 import androidx.compose.foundation.layout.offset
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.requiredHeightIn
+import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.foundation.shape.GenericShape
@@ -26,6 +33,7 @@ import androidx.compose.material.pullrefresh.PullRefreshState
 import androidx.compose.material.pullrefresh.pullRefresh
 import androidx.compose.material.pullrefresh.rememberPullRefreshState
 import androidx.compose.material3.Icon
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.SwipeToDismissBox
 import androidx.compose.material3.SwipeToDismissBoxValue
 import androidx.compose.material3.SwipeToDismissBoxDefaults
@@ -49,6 +57,7 @@ import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.zIndex
 import androidx.compose.ui.unit.Density
 import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.IntOffset
 import androidx.compose.ui.unit.dp
 import kotlinx.coroutines.delay
 import kotlinx.coroutines.launch
@@ -475,14 +484,35 @@ public final class List : View, Renderable {
             return
         }
         let editActionsModifier = EditActionsModifier.combined(for: content)
+        let swipeConfigs = SwipeActionsModifier.combined(for: content)
+        let leadingSwipe = swipeConfigs.leading
+        let trailingSwipe = swipeConfigs.trailing
+        let hasUserSwipe = leadingSwipe != nil || trailingSwipe != nil
         let isDeleteEnabled = (editActions.contains(.delete) || onDelete != nil) && editActionsModifier.isDeleteDisabled != true
         let isMoveEnabled = (editActions.contains(.move) || onMove != nil) && editActionsModifier.isMoveDisabled != true
-        guard isDeleteEnabled || isMoveEnabled else {
+        guard isDeleteEnabled || isMoveEnabled || hasUserSwipe else {
             RenderItem(content: content, level: level, context: context, modifier: modifier, styling: styling)
             return
         }
 
-        if isDeleteEnabled {
+        // Build the inner swipe + content composable. User-provided .swipeActions
+        // wins over the implicit onDelete trash. If neither swipe path applies
+        // we just render the row (caller still handles reorder wrapping).
+        let itemContent: @Composable (Modifier) -> Void
+        if hasUserSwipe {
+            // Pass-through onDelete so an explicit destructive button can still
+            // remove the row by calling the same action the trash swipe would.
+            let rememberedOnDelete = rememberUpdatedState({
+                if let onDelete {
+                    withAnimation { onDelete(IndexSet(integer: index)) }
+                } else if let objectsBinding, objectsBinding.wrappedValue.count > index {
+                    withAnimation { (objectsBinding.wrappedValue as? RangeReplaceableCollection<Any>)?.remove(at: index) }
+                }
+            })
+            itemContent = { rowModifier in
+                RenderSwipeableItem(content: content, level: level, context: context, modifier: rowModifier, styling: styling, leadingConfig: leadingSwipe, trailingConfig: trailingSwipe)
+            }
+        } else if isDeleteEnabled {
             let rememberedOnDelete = rememberUpdatedState({
                 if let onDelete {
                     withAnimation { onDelete(IndexSet(integer: index)) }
@@ -501,7 +531,7 @@ public final class List : View, Renderable {
                 return false
             }, positionalThreshold = SwipeToDismissBoxDefaults.positionalThreshold)
 
-            let itemContent: @Composable (Modifier) -> Void = {
+            itemContent = {
                 SwipeToDismissBox(state: dismissState, enableDismissFromEndToStart: true, enableDismissFromStartToEnd: false, modifier: $0, backgroundContent: {
                     let trashVector = Image.composeImageVector(named: "trash")!
                     Box(modifier: Modifier.background(androidx.compose.ui.graphics.Color.Red).fillMaxSize(), contentAlignment: androidx.compose.ui.Alignment.CenterEnd) {
@@ -511,18 +541,145 @@ public final class List : View, Renderable {
                     RenderItem(content: content, level: level, context: context, styling: styling)
                 })
             }
-            if isMoveEnabled {
-                RenderReorderableItem(reorderableState: reorderableState, key: key, modifier: modifier, content: itemContent)
-            } else {
-                itemContent(modifier)
+        } else {
+            itemContent = { rowModifier in
+                RenderItem(content: content, level: level, context: context, modifier: rowModifier, styling: styling)
             }
+        }
+
+        if isMoveEnabled {
+            RenderReorderableItem(reorderableState: reorderableState, key: key, modifier: modifier, content: itemContent)
         } else {
-            RenderReorderableItem(reorderableState: reorderableState, key: key, modifier: modifier) {
-                RenderItem(content: content, level: level, context: context, modifier: $0, styling: styling)
+            itemContent(modifier)
+        }
+    }
+
+    /// Render a row wrapped in a horizontal-drag swipe container that reveals
+    /// user-provided action Buttons on the leading and/or trailing edge.
+    @Composable private func RenderSwipeableItem(content: Renderable, level: Int, context: ComposeContext, modifier: Modifier, styling: ListStyling, leadingConfig: SwipeActionsConfig?, trailingConfig: SwipeActionsConfig?) {
+        let coroutineScope = rememberCoroutineScope()
+
+        let trailingButtons: kotlin.collections.List<Button> = (trailingConfig?.content.Evaluate(context: context, options: 0) ?? listOf()).mapNotNull {
+            $0.strip() as? Button
+        }
+        let leadingButtons: kotlin.collections.List<Button> = (leadingConfig?.content.Evaluate(context: context, options: 0) ?? listOf()).mapNotNull {
+            $0.strip() as? Button
+        }
+        let allowsTrailingFullSwipe = trailingConfig?.allowsFullSwipe == true && trailingButtons.size > 0
+        let allowsLeadingFullSwipe = leadingConfig?.allowsFullSwipe == true && leadingButtons.size > 0
+
+        let buttonWidthDp = 80.dp
+        let density = LocalDensity.current
+        let buttonWidthPx = with(density) { buttonWidthDp.toPx() }
+        let trailingOpenPx = -Float(trailingButtons.size) * buttonWidthPx
+        let leadingOpenPx = Float(leadingButtons.size) * buttonWidthPx
+
+        let offsetState = remember { Animatable(Float(0)) }
+
+        BoxWithConstraints(modifier: modifier) {
+            let rowWidthPx = with(density) { maxWidth.toPx() }
+            let trailingFullPx = -rowWidthPx
+            let leadingFullPx = rowWidthPx
+            let minOffsetPx = trailingButtons.size > 0 ? trailingFullPx : Float(0)
+            let maxOffsetPx = leadingButtons.size > 0 ? leadingFullPx : Float(0)
+
+            // Reveal area sits beneath the row content and shows the buttons
+            // pinned to whichever edge is being swiped open.
+            Box(modifier: Modifier.matchParentSize()) {
+                if leadingButtons.size > 0 {
+                    Row(modifier: Modifier.fillMaxSize(), horizontalArrangement: Arrangement.Start) {
+                        for button in leadingButtons {
+                            RenderSwipeRevealButton(button: button, widthDp: buttonWidthDp, context: context, onTap: {
+                                button.action()
+                                coroutineScope.launch { offsetState.animateTo(Float(0)) }
+                            })
+                        }
+                    }
+                }
+                if trailingButtons.size > 0 {
+                    Row(modifier: Modifier.fillMaxSize(), horizontalArrangement: Arrangement.End) {
+                        for button in trailingButtons {
+                            RenderSwipeRevealButton(button: button, widthDp: buttonWidthDp, context: context, onTap: {
+                                button.action()
+                                coroutineScope.launch { offsetState.animateTo(Float(0)) }
+                            })
+                        }
+                    }
+                }
+            }
+
+            // Foreground row content, offset by drag.
+            let dragState = rememberDraggableState { delta in
+                let target = (offsetState.value + delta).coerceIn(minOffsetPx, maxOffsetPx)
+                coroutineScope.launch { offsetState.snapTo(target) }
+            }
+            Box(modifier: Modifier
+                .matchParentSize()
+                .offset { IntOffset(offsetState.value.toInt(), 0) }
+                .draggable(state: dragState, orientation: Orientation.Horizontal, onDragStopped: { _ in
+                    let cur = offsetState.value
+                    var target: Float = Float(0)
+                    var fullSwipeAction: (() -> Void)? = nil
+                    if cur < Float(0) {
+                        let absCur = -cur
+                        if allowsTrailingFullSwipe && absCur > rowWidthPx * Float(0.5) {
+                            target = trailingFullPx
+                            fullSwipeAction = trailingButtons.firstOrNull()?.action
+                        } else if trailingButtons.size > 0 && absCur > -trailingOpenPx * Float(0.5) {
+                            target = trailingOpenPx
+                        }
+                    } else if cur > Float(0) {
+                        if allowsLeadingFullSwipe && cur > rowWidthPx * Float(0.5) {
+                            target = leadingFullPx
+                            fullSwipeAction = leadingButtons.firstOrNull()?.action
+                        } else if leadingButtons.size > 0 && cur > leadingOpenPx * Float(0.5) {
+                            target = leadingOpenPx
+                        }
+                    }
+                    if let fullSwipeAction {
+                        offsetState.animateTo(target)
+                        fullSwipeAction()
+                        offsetState.snapTo(Float(0))
+                    } else {
+                        offsetState.animateTo(target)
+                    }
+                })
+            ) {
+                RenderItem(content: content, level: level, context: context, modifier: Modifier.fillMaxSize(), styling: styling)
             }
         }
     }
 
+    /// Render a single action button inside the swipe reveal area.
+    @Composable private func RenderSwipeRevealButton(button: Button, widthDp: Dp, context: ComposeContext, onTap: () -> Void) {
+        let backgroundColor: androidx.compose.ui.graphics.Color
+        let contentColor: androidx.compose.ui.graphics.Color
+        if button.role == ButtonRole.destructive {
+            backgroundColor = MaterialTheme.colorScheme.error
+            contentColor = MaterialTheme.colorScheme.onError
+        } else {
+            let tint = EnvironmentValues.shared._tint?.colorImpl()
+            if let tint {
+                backgroundColor = tint
+                contentColor = androidx.compose.ui.graphics.Color.White
+            } else {
+                backgroundColor = MaterialTheme.colorScheme.secondaryContainer
+                contentColor = MaterialTheme.colorScheme.onSecondaryContainer
+            }
+        }
+        let labelText = button.label.Evaluate(context: context, options: 0).mapNotNull {
+            $0.strip() as? Text
+        }.firstOrNull()
+        Box(modifier: Modifier
+            .fillMaxHeight()
+            .width(widthDp)
+            .background(backgroundColor)
+            .clickable(onClick: onTap),
+            contentAlignment: androidx.compose.ui.Alignment.Center) {
+            androidx.compose.material3.Text(text: labelText?.localizedTextString() ?? "", color: contentColor, style: Font.callout.fontImpl(), maxLines: 1)
+        }
+    }
+
     @Composable private func RenderReorderableItem(reorderableState: ReorderableLazyListState, key: String, modifier: Modifier, content: @Composable (Modifier) -> Void) {
         ReorderableItem(state: reorderableState, key: key, defaultDraggingModifier: modifier) { dragging in
             var itemModifier = Modifier.detectReorderAfterLongPress(reorderableState)
@@ -873,10 +1030,6 @@ extension View {
         return self
     }
 
-    @available(*, unavailable)
-    public func swipeActions(edge: HorizontalEdge = .trailing, allowsFullSwipe: Bool = true, @ViewBuilder content: () -> any View) -> some View {
-        return self
-    }
 }
 
 #if SKIP

From 085fcd53452b82c0981e5096a8573ce14262d307 Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Wed, 13 May 2026 18:39:46 -0700
Subject: [PATCH 02/19] swipeActions: add SKIP @bridge variant + return any
 View

Aligns with how alert(), deleteDisabled() etc. expose themselves
across the Skip Fuse JNI bridge: a public @ViewBuilder-taking entry
point that returns any View, plus a bridged twin that takes a
pre-built any View and an Int rawValue for HorizontalEdge (the enum
itself is gated behind #if !SKIP_BRIDGE so it can't cross the bridge
directly).

Required so SkipFuseUI's SkipSwiftUI.View can call into SkipUI's
swipeActions from the SKIP_BRIDGE-mode Android Swift compilation.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 Sources/SkipUI/SkipUI/Commands/SwipeActions.swift | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/Sources/SkipUI/SkipUI/Commands/SwipeActions.swift b/Sources/SkipUI/SkipUI/Commands/SwipeActions.swift
index 1b5e3929..03e6668f 100644
--- a/Sources/SkipUI/SkipUI/Commands/SwipeActions.swift
+++ b/Sources/SkipUI/SkipUI/Commands/SwipeActions.swift
@@ -4,13 +4,19 @@
 import Foundation
 
 extension View {
-    public func swipeActions(edge: HorizontalEdge = .trailing, allowsFullSwipe: Bool = true, @ViewBuilder content: () -> any View) -> some View {
+    public func swipeActions(edge: HorizontalEdge = .trailing, allowsFullSwipe: Bool = true, @ViewBuilder content: () -> any View) -> any View {
         #if SKIP
         return ModifiedContent(content: self, modifier: SwipeActionsModifier(edge: edge, allowsFullSwipe: allowsFullSwipe, content: ComposeBuilder.from(content)))
         #else
         return self
         #endif
     }
+
+    // SKIP @bridge
+    public func swipeActions(bridgedEdge: Int, allowsFullSwipe: Bool, bridgedActions: any View) -> any View {
+        let edge = HorizontalEdge(rawValue: bridgedEdge) ?? .trailing
+        return swipeActions(edge: edge, allowsFullSwipe: allowsFullSwipe, content: { bridgedActions })
+    }
 }
 
 #if SKIP

From f86590e170c4bbeafff7062170c0df847a4c85ac Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Wed, 13 May 2026 18:52:06 -0700
Subject: [PATCH 03/19] Fix RenderSwipeableItem unbounded-height crash inside
 LazyColumn
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Two bugs that cause "Vertically scrollable component was measured
with an infinity maximum height constraints" when a swipeable row
is placed inside List's LazyColumn:

1. RenderItem was being called with Modifier.fillMaxSize(), which
   tells the inner Column to fill height — but a LazyColumn item
   is measured with Constraints(maxHeight = Infinity), so this
   propagates an infinite request upward and crashes. Drop the
   modifier so the row sizes itself to its content (matching the
   existing onDelete SwipeToDismissBox path one branch over).

2. BoxWithConstraints + matchParentSize for backgrounds combined
   with Modifier.fillMaxSize() on the foreground formed a circular
   sizing constraint with no concrete child. Replace with a regular
   Box that captures its width via onSizeChanged for the full-swipe
   anchor. Foreground is fillMaxWidth (no height fill); background
   reveal Rows use matchParentSize() so they adopt the foreground's
   measured size without forcing the parent to grow.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 Sources/SkipUI/SkipUI/Containers/List.swift | 55 +++++++++++----------
 1 file changed, 30 insertions(+), 25 deletions(-)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index 3612180c..c3d76969 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -12,7 +12,6 @@ import androidx.compose.foundation.gestures.draggable
 import androidx.compose.foundation.gestures.rememberDraggableState
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
-import androidx.compose.foundation.layout.BoxWithConstraints
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxHeight
@@ -41,6 +40,7 @@ import androidx.compose.material3.rememberSwipeToDismissBoxState
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.Stable
+import androidx.compose.runtime.mutableFloatStateOf
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.rememberCoroutineScope
@@ -48,6 +48,7 @@ import androidx.compose.runtime.rememberUpdatedState
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.draw.shadow
+import androidx.compose.ui.layout.onSizeChanged
 import androidx.compose.ui.geometry.CornerRadius
 import androidx.compose.ui.geometry.Rect
 import androidx.compose.ui.geometry.RoundRect
@@ -556,6 +557,9 @@ public final class List : View, Renderable {
 
     /// Render a row wrapped in a horizontal-drag swipe container that reveals
     /// user-provided action Buttons on the leading and/or trailing edge.
+    /// The foreground row determines the cell's height; reveal buttons match it
+    /// via `Modifier.matchParentSize()` so we never propagate unbounded height
+    /// constraints up into the surrounding LazyColumn.
     @Composable private func RenderSwipeableItem(content: Renderable, level: Int, context: ComposeContext, modifier: Modifier, styling: ListStyling, leadingConfig: SwipeActionsConfig?, trailingConfig: SwipeActionsConfig?) {
         let coroutineScope = rememberCoroutineScope()
 
@@ -575,46 +579,47 @@ public final class List : View, Renderable {
         let leadingOpenPx = Float(leadingButtons.size) * buttonWidthPx
 
         let offsetState = remember { Animatable(Float(0)) }
+        let rowWidthPxState = remember { mutableFloatStateOf(Float(0)) }
 
-        BoxWithConstraints(modifier: modifier) {
-            let rowWidthPx = with(density) { maxWidth.toPx() }
+        Box(modifier: modifier.onSizeChanged { rowWidthPxState.value = Float($0.width) }) {
+            let rowWidthPx = rowWidthPxState.value
             let trailingFullPx = -rowWidthPx
             let leadingFullPx = rowWidthPx
             let minOffsetPx = trailingButtons.size > 0 ? trailingFullPx : Float(0)
             let maxOffsetPx = leadingButtons.size > 0 ? leadingFullPx : Float(0)
 
-            // Reveal area sits beneath the row content and shows the buttons
-            // pinned to whichever edge is being swiped open.
-            Box(modifier: Modifier.matchParentSize()) {
-                if leadingButtons.size > 0 {
-                    Row(modifier: Modifier.fillMaxSize(), horizontalArrangement: Arrangement.Start) {
-                        for button in leadingButtons {
-                            RenderSwipeRevealButton(button: button, widthDp: buttonWidthDp, context: context, onTap: {
-                                button.action()
-                                coroutineScope.launch { offsetState.animateTo(Float(0)) }
-                            })
-                        }
+            // Reveal area sits beneath the row content. matchParentSize adopts
+            // the foreground's size without forcing the parent Box to grow.
+            if leadingButtons.size > 0 {
+                Row(modifier: Modifier.matchParentSize(), horizontalArrangement: Arrangement.Start) {
+                    for button in leadingButtons {
+                        RenderSwipeRevealButton(button: button, widthDp: buttonWidthDp, context: context, onTap: {
+                            button.action()
+                            coroutineScope.launch { offsetState.animateTo(Float(0)) }
+                        })
                     }
                 }
-                if trailingButtons.size > 0 {
-                    Row(modifier: Modifier.fillMaxSize(), horizontalArrangement: Arrangement.End) {
-                        for button in trailingButtons {
-                            RenderSwipeRevealButton(button: button, widthDp: buttonWidthDp, context: context, onTap: {
-                                button.action()
-                                coroutineScope.launch { offsetState.animateTo(Float(0)) }
-                            })
-                        }
+            }
+            if trailingButtons.size > 0 {
+                Row(modifier: Modifier.matchParentSize(), horizontalArrangement: Arrangement.End) {
+                    for button in trailingButtons {
+                        RenderSwipeRevealButton(button: button, widthDp: buttonWidthDp, context: context, onTap: {
+                            button.action()
+                            coroutineScope.launch { offsetState.animateTo(Float(0)) }
+                        })
                     }
                 }
             }
 
-            // Foreground row content, offset by drag.
+            // Foreground row content sizes itself naturally (no fillMaxSize)
+            // so the parent Box adopts its height and the LazyColumn item is
+            // measurable.
             let dragState = rememberDraggableState { delta in
                 let target = (offsetState.value + delta).coerceIn(minOffsetPx, maxOffsetPx)
                 coroutineScope.launch { offsetState.snapTo(target) }
             }
             Box(modifier: Modifier
-                .matchParentSize()
+                .fillMaxWidth()
                 .offset { IntOffset(offsetState.value.toInt(), 0) }
                 .draggable(state: dragState, orientation: Orientation.Horizontal, onDragStopped: { _ in
                     let cur = offsetState.value
@@ -645,7 +650,7 @@ public final class List : View, Renderable {
                     }
                 })
             ) {
-                RenderItem(content: content, level: level, context: context, modifier: Modifier.fillMaxSize(), styling: styling)
+                RenderItem(content: content, level: level, context: context, styling: styling)
             }
         }
     }

From fe30985c8df71f25852a6a04603c95b342944be4 Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Wed, 13 May 2026 19:33:25 -0700
Subject: [PATCH 04/19] swipeActions: low-friction snap and velocity-aware
 fling
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Tighten the gesture so any meaningful swipe carries the row to the
open anchor instead of demanding the user drag past 50% of the
buttons-row width. New thresholds:

- 15% of buttons-row width snaps open (was 50%)
- 50% of full row width fires the destructive full-swipe action
- A flick past 600 dp/s opens regardless of position
- A flick past 1200 dp/s triggers the full-swipe action
- onDragStopped's velocity is forwarded to Animatable.animateTo's
  initialVelocity so the snap animation continues the gesture's
  momentum instead of starting from rest

Matches iOS feel: small intentional swipe → opens; tiny accidental
wiggle → snaps back; fast flick across the row → destructive action.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 Sources/SkipUI/SkipUI/Containers/List.swift | 30 ++++++++++++++-------
 1 file changed, 21 insertions(+), 9 deletions(-)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index c3d76969..d2409f21 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -614,6 +614,13 @@ public final class List : View, Renderable {
             // Foreground row content sizes itself naturally (no fillMaxSize)
             // so the parent Box adopts its height and the LazyColumn item is
             // measurable.
+            // Velocity-aware snap: any meaningful swipe carries the row to the
+            // open anchor; a fast flick goes to the full-swipe anchor and fires
+            // the destructive action. Tiny wiggles still snap back to closed.
+            let flingVelocityThreshold = with(density) { 600.dp.toPx() } // px/sec
+            let openThresholdFraction: Float = Float(0.15) // of buttons-row width
+            let fullSwipeFraction: Float = Float(0.5) // of full row width
+
             let dragState = rememberDraggableState { delta in
                 let target = (offsetState.value + delta).coerceIn(minOffsetPx, maxOffsetPx)
                 coroutineScope.launch { offsetState.snapTo(target) }
@@ -621,32 +628,37 @@ public final class List : View, Renderable {
             Box(modifier: Modifier
                 .fillMaxWidth()
                 .offset { IntOffset(offsetState.value.toInt(), 0) }
-                .draggable(state: dragState, orientation: Orientation.Horizontal, onDragStopped: { _ in
+                .draggable(state: dragState, orientation: Orientation.Horizontal, onDragStopped: { velocity in
                     let cur = offsetState.value
                     var target: Float = Float(0)
                     var fullSwipeAction: (() -> Void)? = nil
-                    if cur < Float(0) {
+                    let trailingFlick = velocity < -flingVelocityThreshold
+                    let leadingFlick = velocity > flingVelocityThreshold
+
+                    if cur < Float(0) || trailingFlick {
                         let absCur = -cur
-                        if allowsTrailingFullSwipe && absCur > rowWidthPx * Float(0.5) {
+                        let openThresholdPx = -trailingOpenPx * openThresholdFraction
+                        if allowsTrailingFullSwipe && (absCur > rowWidthPx * fullSwipeFraction || velocity < -flingVelocityThreshold * Float(2)) {
                             target = trailingFullPx
                             fullSwipeAction = trailingButtons.firstOrNull()?.action
-                        } else if trailingButtons.size > 0 && absCur > -trailingOpenPx * Float(0.5) {
+                        } else if trailingButtons.size > 0 && (absCur > openThresholdPx || trailingFlick) {
                             target = trailingOpenPx
                         }
-                    } else if cur > Float(0) {
-                        if allowsLeadingFullSwipe && cur > rowWidthPx * Float(0.5) {
+                    } else if cur > Float(0) || leadingFlick {
+                        let openThresholdPx = leadingOpenPx * openThresholdFraction
+                        if allowsLeadingFullSwipe && (cur > rowWidthPx * fullSwipeFraction || velocity > flingVelocityThreshold * Float(2)) {
                             target = leadingFullPx
                             fullSwipeAction = leadingButtons.firstOrNull()?.action
-                        } else if leadingButtons.size > 0 && cur > leadingOpenPx * Float(0.5) {
+                        } else if leadingButtons.size > 0 && (cur > openThresholdPx || leadingFlick) {
                             target = leadingOpenPx
                         }
                     }
                     if let fullSwipeAction {
-                        offsetState.animateTo(target)
+                        offsetState.animateTo(target, initialVelocity: velocity)
                         fullSwipeAction()
                         offsetState.snapTo(Float(0))
                     } else {
-                        offsetState.animateTo(target)
+                        offsetState.animateTo(target, initialVelocity: velocity)
                     }
                 })
             ) {

From 4955923d10098d7f496852c1ddcedf01392da6b0 Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Wed, 13 May 2026 19:45:04 -0700
Subject: [PATCH 05/19] swipeActions: snap to nearest anchor with velocity
 projection
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Replace the directional ("if cur < 0 then snap to trailing-open")
release logic with a generic nearest-anchor solver:

  let projected = cur + velocity * 0.15s
  target = anchors.minBy { abs(it - projected) }

This guarantees the row always lands on a defined anchor (closed,
trailing-open, leading-open, or full-swipe) and never stops mid-track.
It also fixes the open→close direction: dragging back from the open
anchor projects past 0 with the closing velocity and snaps shut, even
if the finger lifted while the row was still half-open. The previous
logic kept saying "still in trailing region, snap to trailing-open"
and the row would re-open.

Full-swipe escalation only kicks in when the projected position has
crossed half the row width past the open anchor — preserves the
destructive-action gesture.

abs() inlined as a ternary because Skip's transpilation didn't
resolve abs(Float) against any of skip.lib / kotlin.math overloads.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 Sources/SkipUI/SkipUI/Containers/List.swift | 70 +++++++++++++--------
 1 file changed, 43 insertions(+), 27 deletions(-)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index d2409f21..b3c96e58 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -614,12 +614,15 @@ public final class List : View, Renderable {
             // Foreground row content sizes itself naturally (no fillMaxSize)
             // so the parent Box adopts its height and the LazyColumn item is
             // measurable.
-            // Velocity-aware snap: any meaningful swipe carries the row to the
-            // open anchor; a fast flick goes to the full-swipe anchor and fires
-            // the destructive action. Tiny wiggles still snap back to closed.
-            let flingVelocityThreshold = with(density) { 600.dp.toPx() } // px/sec
-            let openThresholdFraction: Float = Float(0.15) // of buttons-row width
-            let fullSwipeFraction: Float = Float(0.5) // of full row width
+            // On release, project the current position forward by the gesture's
+            // velocity and snap to whichever anchor (closed / leading-open /
+            // trailing-open / full-swipe) the projected position is closest to.
+            // This guarantees the row always lands on a defined state — never
+            // stops mid-track — and naturally handles reversing direction:
+            // dragging back from open toward closed projects past closed and
+            // snaps shut, even if the finger lifted while still partially open.
+            let velocityProjectionSeconds: Float = Float(0.15)
+            let fullSwipeFraction: Float = Float(0.5)
 
             let dragState = rememberDraggableState { delta in
                 let target = (offsetState.value + delta).coerceIn(minOffsetPx, maxOffsetPx)
@@ -630,29 +633,42 @@ public final class List : View, Renderable {
                 .offset { IntOffset(offsetState.value.toInt(), 0) }
                 .draggable(state: dragState, orientation: Orientation.Horizontal, onDragStopped: { velocity in
                     let cur = offsetState.value
-                    var target: Float = Float(0)
-                    var fullSwipeAction: (() -> Void)? = nil
-                    let trailingFlick = velocity < -flingVelocityThreshold
-                    let leadingFlick = velocity > flingVelocityThreshold
-
-                    if cur < Float(0) || trailingFlick {
-                        let absCur = -cur
-                        let openThresholdPx = -trailingOpenPx * openThresholdFraction
-                        if allowsTrailingFullSwipe && (absCur > rowWidthPx * fullSwipeFraction || velocity < -flingVelocityThreshold * Float(2)) {
-                            target = trailingFullPx
-                            fullSwipeAction = trailingButtons.firstOrNull()?.action
-                        } else if trailingButtons.size > 0 && (absCur > openThresholdPx || trailingFlick) {
-                            target = trailingOpenPx
-                        }
-                    } else if cur > Float(0) || leadingFlick {
-                        let openThresholdPx = leadingOpenPx * openThresholdFraction
-                        if allowsLeadingFullSwipe && (cur > rowWidthPx * fullSwipeFraction || velocity > flingVelocityThreshold * Float(2)) {
-                            target = leadingFullPx
-                            fullSwipeAction = leadingButtons.firstOrNull()?.action
-                        } else if leadingButtons.size > 0 && (cur > openThresholdPx || leadingFlick) {
-                            target = leadingOpenPx
+                    let projected = (cur + velocity * velocityProjectionSeconds).coerceIn(minOffsetPx, maxOffsetPx)
+
+                    // Build the candidate anchor set: always closed; add open
+                    // anchors only on edges that have buttons.
+                    let anchors: kotlin.collections.MutableList<Float> = mutableListOf(Float(0))
+                    if trailingButtons.size > 0 {
+                        anchors.add(trailingOpenPx)
+                    }
+                    if leadingButtons.size > 0 {
+                        anchors.add(leadingOpenPx)
+                    }
+
+                    var target: Float = anchors[0]
+                    let firstDelta = anchors[0] - projected
+                    var minDist: Float = firstDelta < Float(0) ? -firstDelta : firstDelta
+                    for anchor in anchors {
+                        let delta = anchor - projected
+                        let dist: Float = delta < Float(0) ? -delta : delta
+                        if dist < minDist {
+                            minDist = dist
+                            target = anchor
                         }
                     }
+
+                    // Escalate to the full-swipe anchor if the projected
+                    // position has crossed half the row width past its open
+                    // anchor — this is what fires the destructive action.
+                    var fullSwipeAction: (() -> Void)? = nil
+                    if allowsTrailingFullSwipe && target == trailingOpenPx && -projected > rowWidthPx * fullSwipeFraction {
+                        target = trailingFullPx
+                        fullSwipeAction = trailingButtons.firstOrNull()?.action
+                    } else if allowsLeadingFullSwipe && target == leadingOpenPx && projected > rowWidthPx * fullSwipeFraction {
+                        target = leadingFullPx
+                        fullSwipeAction = leadingButtons.firstOrNull()?.action
+                    }
+
                     if let fullSwipeAction {
                         offsetState.animateTo(target, initialVelocity: velocity)
                         fullSwipeAction()

From 652ef111b27e368f0312f316500b8905d4d91f30 Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Wed, 13 May 2026 20:07:52 -0700
Subject: [PATCH 06/19] swipeActions: drop shared Animatable to fix midway-hang
 on release

Root cause of the snap animation freezing partway: the drag callback
was launching coroutineScope { offsetState.snapTo(target) } per delta,
and onDragStopped was calling offsetState.animateTo(target) on the
same Animatable. The launched snapTo coroutines run on Dispatchers.Main
but not necessarily synchronously with the suspend onDragStopped, so
one final queued snapTo would land *after* animateTo started, cancel
it (snapTo always cancels the current animation), and leave the row
frozen at whatever offset the snap landed on.

Fix: split the two responsibilities.

- Drag-time tracking uses a plain mutableFloatStateOf, updated
  synchronously inside the drag callback. No coroutines, no race.
- Snap-back uses Compose's top-level animate(initialValue, targetValue,
  initialVelocity) suspend, called directly inside onDragStopped's
  own suspend coroutine. The trailing block writes each frame's value
  back to the mutableFloatStateOf. There is no shared Animatable for
  pending snapTo calls to step on. If the user starts a new gesture
  mid-snap, Compose cancels the onDragStopped coroutine cleanly and
  the next drag picks up wherever the offset state currently is.

Tap-to-fire on a revealed action button now uses the same animate(...)
suspend instead of Animatable.animateTo, so dismissing via tap is also
guaranteed to complete.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 Sources/SkipUI/SkipUI/Containers/List.swift | 39 +++++++++++++++------
 1 file changed, 29 insertions(+), 10 deletions(-)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index b3c96e58..fef23084 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -4,7 +4,7 @@
 import Foundation
 #if SKIP
 import androidx.compose.animation.core.animateDpAsState
-import androidx.compose.animation.core.Animatable
+import androidx.compose.animation.core.animate
 import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.gestures.Orientation
@@ -578,7 +578,10 @@ public final class List : View, Renderable {
         let trailingOpenPx = -Float(trailingButtons.size) * buttonWidthPx
         let leadingOpenPx = Float(leadingButtons.size) * buttonWidthPx
 
-        let offsetState = remember { Animatable(Float(0)) }
+        // Single source of truth for the foreground row's horizontal offset.
+        // Updated synchronously in the drag callback (no coroutine race) and
+        // driven by the top-level `animate(...)` suspend during the snap-back.
+        let offsetState = remember { mutableFloatStateOf(Float(0)) }
         let rowWidthPxState = remember { mutableFloatStateOf(Float(0)) }
 
         Box(modifier: modifier.onSizeChanged { rowWidthPxState.value = Float($0.width) }) {
@@ -595,7 +598,12 @@ public final class List : View, Renderable {
                     for button in leadingButtons {
                         RenderSwipeRevealButton(button: button, widthDp: buttonWidthDp, context: context, onTap: {
                             button.action()
-                            coroutineScope.launch { offsetState.animateTo(Float(0)) }
+                            let from = offsetState.value
+                            coroutineScope.launch {
+                                animate(initialValue: from, targetValue: Float(0)) { value, _ in
+                                    offsetState.value = value
+                                }
+                            }
                         })
                     }
                 }
@@ -605,7 +613,12 @@ public final class List : View, Renderable {
                     for button in trailingButtons {
                         RenderSwipeRevealButton(button: button, widthDp: buttonWidthDp, context: context, onTap: {
                             button.action()
-                            coroutineScope.launch { offsetState.animateTo(Float(0)) }
+                            let from = offsetState.value
+                            coroutineScope.launch {
+                                animate(initialValue: from, targetValue: Float(0)) { value, _ in
+                                    offsetState.value = value
+                                }
+                            }
                         })
                     }
                 }
@@ -625,8 +638,7 @@ public final class List : View, Renderable {
             let fullSwipeFraction: Float = Float(0.5)
 
             let dragState = rememberDraggableState { delta in
-                let target = (offsetState.value + delta).coerceIn(minOffsetPx, maxOffsetPx)
-                coroutineScope.launch { offsetState.snapTo(target) }
+                offsetState.value = (offsetState.value + delta).coerceIn(minOffsetPx, maxOffsetPx)
             }
             Box(modifier: Modifier
                 .fillMaxWidth()
@@ -669,12 +681,19 @@ public final class List : View, Renderable {
                         fullSwipeAction = leadingButtons.firstOrNull()?.action
                     }
 
+                    // animate(...) is a top-level Compose suspend that drives
+                    // the value through the AnimationSpec frame by frame and
+                    // hands us each value via the trailing block. Running it
+                    // here — inside onDragStopped's own suspend coroutine —
+                    // means the next gesture (which cancels this coroutine)
+                    // simply interrupts the animation cleanly. There is no
+                    // shared Animatable for stale snapTo calls to step on.
+                    animate(initialValue: cur, targetValue: target, initialVelocity: velocity) { value, _ in
+                        offsetState.value = value
+                    }
                     if let fullSwipeAction {
-                        offsetState.animateTo(target, initialVelocity: velocity)
                         fullSwipeAction()
-                        offsetState.snapTo(Float(0))
-                    } else {
-                        offsetState.animateTo(target, initialVelocity: velocity)
+                        offsetState.value = Float(0)
                     }
                 })
             ) {

From 8067e5ceb29d61aecf843e7eb608164de9cce7ba Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Wed, 13 May 2026 20:34:50 -0700
Subject: [PATCH 07/19] swipeActions: stricter full-swipe trigger

Velocity alone could fire the destructive full-swipe action because
the threshold was checked against the velocity-projected position. A
quick flick that ended at, say, -200px on a 1080px row would project
to roughly -650px and cross the 50% mark, triggering the destructive
action even though the user had only dragged a fifth of the way.

Two changes:

- Check the full-swipe threshold against the *actual* drag position
  (cur), not the projected position. Velocity still influences which
  open/closed anchor we snap to via the projection, but it can no
  longer single-handedly fire the destructive action.
- Raise the threshold from 50% of row width to 75%. The user has to
  physically commit to a long swipe.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 Sources/SkipUI/SkipUI/Containers/List.swift | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index fef23084..78310902 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -635,7 +635,11 @@ public final class List : View, Renderable {
             // dragging back from open toward closed projects past closed and
             // snaps shut, even if the finger lifted while still partially open.
             let velocityProjectionSeconds: Float = Float(0.15)
-            let fullSwipeFraction: Float = Float(0.5)
+            // Full-swipe is checked against ACTUAL drag distance (not the
+            // velocity-projected position) so a fast flick alone can't trigger
+            // the destructive action — the user has to physically drag the row
+            // past this fraction of its width.
+            let fullSwipeFraction: Float = Float(0.75)
 
             let dragState = rememberDraggableState { delta in
                 offsetState.value = (offsetState.value + delta).coerceIn(minOffsetPx, maxOffsetPx)
@@ -673,10 +677,10 @@ public final class List : View, Renderable {
                     // position has crossed half the row width past its open
                     // anchor — this is what fires the destructive action.
                     var fullSwipeAction: (() -> Void)? = nil
-                    if allowsTrailingFullSwipe && target == trailingOpenPx && -projected > rowWidthPx * fullSwipeFraction {
+                    if allowsTrailingFullSwipe && target == trailingOpenPx && -cur > rowWidthPx * fullSwipeFraction {
                         target = trailingFullPx
                         fullSwipeAction = trailingButtons.firstOrNull()?.action
-                    } else if allowsLeadingFullSwipe && target == leadingOpenPx && projected > rowWidthPx * fullSwipeFraction {
+                    } else if allowsLeadingFullSwipe && target == leadingOpenPx && cur > rowWidthPx * fullSwipeFraction {
                         target = leadingFullPx
                         fullSwipeAction = leadingButtons.firstOrNull()?.action
                     }

From 0f9bec566a69e276923ed8f32e4fb9248fcb3033 Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Wed, 13 May 2026 20:48:11 -0700
Subject: [PATCH 08/19] swipeActions: only one row's actions visible at a time
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Match iOS list behavior — opening another row's swipe actions closes
the previously-open one.

Implementation: a List-scoped MutableState<String?> (activeSwipeKey)
remembered alongside the LazyColumn captures whichever row currently
has its swipe panel revealed. RenderEditableItem threads it through
to RenderSwipeableItem, which:

- Sets activeSwipeKey.value = rowKey when its drag commits to an
  open anchor; clears it when the row settles back to closed or
  fires a full-swipe destructive action.
- Observes activeSwipeKey via LaunchedEffect; if the active row
  becomes anyone other than this row and this row is still open,
  it animates closed in parallel.

Tap-to-fire on a revealed action also clears the key so the next
row to be swiped doesn't see this one as the contender.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 Sources/SkipUI/SkipUI/Containers/List.swift | 50 ++++++++++++++++++---
 1 file changed, 44 insertions(+), 6 deletions(-)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index 78310902..69a96986 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -39,6 +39,7 @@ import androidx.compose.material3.SwipeToDismissBoxDefaults
 import androidx.compose.material3.rememberSwipeToDismissBoxState
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.MutableState
 import androidx.compose.runtime.Stable
 import androidx.compose.runtime.mutableFloatStateOf
 import androidx.compose.runtime.mutableStateOf
@@ -252,6 +253,10 @@ public final class List : View, Renderable {
         }
 
         let itemContext = context.content()
+        // Tracks which row currently has its swipe actions revealed. When one
+        // opens, all others observe this state and animate closed. Matches
+        // iOS list behavior of "only one row's swipe actions visible at once".
+        let activeSwipeKey = remember { mutableStateOf<String?>(nil) }
         // Combine contentPadding with contentMargins additively
         var contentPadding = EnvironmentValues.shared._contentPadding.asPaddingValues()
         if let contentMargins = EnvironmentValues.shared._contentMargins?.asComposePaddingValues(for: .automatic) {
@@ -287,7 +292,7 @@ public final class List : View, Renderable {
                         let index = itemCollector.value.remapIndex(index, from: offset)
                         let itemModifier: Modifier = shouldAnimateItems() ? Modifier.animateItem() : Modifier
                         let renderable = factory(index + range.start, itemContext)
-                        RenderEditableItem(content: renderable, level: level, context: itemContext, modifier: itemModifier, styling: styling, key: keyValue, index: index, onDelete: onDelete, onMove: onMove, reorderableState: reorderableState)
+                        RenderEditableItem(content: renderable, level: level, context: itemContext, modifier: itemModifier, styling: styling, key: keyValue, index: index, onDelete: onDelete, onMove: onMove, reorderableState: reorderableState, activeSwipeKey: activeSwipeKey)
                     }
                 },
                 objectItems: { objects, identifier, offset, onDelete, onMove, level, factory in
@@ -297,7 +302,7 @@ public final class List : View, Renderable {
                         let index = itemCollector.value.remapIndex(index, from: offset)
                         let itemModifier: Modifier = shouldAnimateItems() ? Modifier.animateItem() : Modifier
                         let renderable = factory(objects[index], itemContext)
-                        RenderEditableItem(content: renderable, level: level, context: itemContext, modifier: itemModifier, styling: styling, key: keyValue, index: index, onDelete: onDelete, onMove: onMove, reorderableState: reorderableState)
+                        RenderEditableItem(content: renderable, level: level, context: itemContext, modifier: itemModifier, styling: styling, key: keyValue, index: index, onDelete: onDelete, onMove: onMove, reorderableState: reorderableState, activeSwipeKey: activeSwipeKey)
                     }
                 },
                 objectBindingItems: { objectsBinding, identifier, offset, editActions, onDelete, onMove, level, factory in
@@ -307,7 +312,7 @@ public final class List : View, Renderable {
                         let index = itemCollector.value.remapIndex(index, from: offset)
                         let itemModifier: Modifier = shouldAnimateItems() ? Modifier.animateItem() : Modifier
                         let renderable = factory(objectsBinding, index, itemContext)
-                        RenderEditableItem(content: renderable, level: level, context: itemContext, modifier: itemModifier, styling: styling, objectsBinding: objectsBinding, key: keyValue, index: index, editActions: editActions, onDelete: onDelete, onMove: onMove, reorderableState: reorderableState)
+                        RenderEditableItem(content: renderable, level: level, context: itemContext, modifier: itemModifier, styling: styling, objectsBinding: objectsBinding, key: keyValue, index: index, editActions: editActions, onDelete: onDelete, onMove: onMove, reorderableState: reorderableState, activeSwipeKey: activeSwipeKey)
                     }
                 },
                 sectionHeader: { content in
@@ -476,7 +481,7 @@ public final class List : View, Renderable {
         }
     }
 
-    @Composable private func RenderEditableItem(content: Renderable, level: Int, context: ComposeContext, modifier: Modifier, styling: ListStyling, objectsBinding: Binding<RandomAccessCollection<Any>>? = nil, key: String?, index: Int, editActions: EditActions = [], onDelete: ((IndexSet) -> Void)?, onMove: ((IndexSet, Int) -> Void)?, reorderableState: ReorderableLazyListState) {
+    @Composable private func RenderEditableItem(content: Renderable, level: Int, context: ComposeContext, modifier: Modifier, styling: ListStyling, objectsBinding: Binding<RandomAccessCollection<Any>>? = nil, key: String?, index: Int, editActions: EditActions = [], onDelete: ((IndexSet) -> Void)?, onMove: ((IndexSet, Int) -> Void)?, reorderableState: ReorderableLazyListState, activeSwipeKey: MutableState<String?>) {
         guard !content.isSwiftUIEmptyView else {
             return
         }
@@ -511,7 +516,7 @@ public final class List : View, Renderable {
                 }
             })
             itemContent = { rowModifier in
-                RenderSwipeableItem(content: content, level: level, context: context, modifier: rowModifier, styling: styling, leadingConfig: leadingSwipe, trailingConfig: trailingSwipe)
+                RenderSwipeableItem(content: content, level: level, context: context, modifier: rowModifier, styling: styling, leadingConfig: leadingSwipe, trailingConfig: trailingSwipe, rowKey: key, activeSwipeKey: activeSwipeKey)
             }
         } else if isDeleteEnabled {
             let rememberedOnDelete = rememberUpdatedState({
@@ -560,7 +565,7 @@ public final class List : View, Renderable {
     /// The foreground row determines the cell's height; reveal buttons match it
     /// via `Modifier.matchParentSize()` so we never propagate unbounded height
     /// constraints up into the surrounding LazyColumn.
-    @Composable private func RenderSwipeableItem(content: Renderable, level: Int, context: ComposeContext, modifier: Modifier, styling: ListStyling, leadingConfig: SwipeActionsConfig?, trailingConfig: SwipeActionsConfig?) {
+    @Composable private func RenderSwipeableItem(content: Renderable, level: Int, context: ComposeContext, modifier: Modifier, styling: ListStyling, leadingConfig: SwipeActionsConfig?, trailingConfig: SwipeActionsConfig?, rowKey: String, activeSwipeKey: MutableState<String?>) {
         let coroutineScope = rememberCoroutineScope()
 
         let trailingButtons: kotlin.collections.List<Button> = (trailingConfig?.content.Evaluate(context: context, options: 0) ?? listOf()).mapNotNull {
@@ -584,6 +589,19 @@ public final class List : View, Renderable {
         let offsetState = remember { mutableFloatStateOf(Float(0)) }
         let rowWidthPxState = remember { mutableFloatStateOf(Float(0)) }
 
+        // When a *different* row's swipe opens, this LaunchedEffect observes
+        // the shared activeSwipeKey and animates this row closed. Matches
+        // iOS list behavior of one open swipe at a time.
+        let currentlyOpen = activeSwipeKey.value
+        LaunchedEffect(currentlyOpen) {
+            if currentlyOpen != rowKey && offsetState.value != Float(0) {
+                let from = offsetState.value
+                animate(initialValue: from, targetValue: Float(0)) { value, _ in
+                    offsetState.value = value
+                }
+            }
+        }
+
         Box(modifier: modifier.onSizeChanged { rowWidthPxState.value = Float($0.width) }) {
             let rowWidthPx = rowWidthPxState.value
             let trailingFullPx = -rowWidthPx
@@ -599,6 +617,9 @@ public final class List : View, Renderable {
                         RenderSwipeRevealButton(button: button, widthDp: buttonWidthDp, context: context, onTap: {
                             button.action()
                             let from = offsetState.value
+                            if activeSwipeKey.value == rowKey {
+                                activeSwipeKey.value = nil
+                            }
                             coroutineScope.launch {
                                 animate(initialValue: from, targetValue: Float(0)) { value, _ in
                                     offsetState.value = value
@@ -614,6 +635,9 @@ public final class List : View, Renderable {
                         RenderSwipeRevealButton(button: button, widthDp: buttonWidthDp, context: context, onTap: {
                             button.action()
                             let from = offsetState.value
+                            if activeSwipeKey.value == rowKey {
+                                activeSwipeKey.value = nil
+                            }
                             coroutineScope.launch {
                                 animate(initialValue: from, targetValue: Float(0)) { value, _ in
                                     offsetState.value = value
@@ -685,6 +709,17 @@ public final class List : View, Renderable {
                         fullSwipeAction = leadingButtons.firstOrNull()?.action
                     }
 
+                    // Update the shared "active swipe" key BEFORE animating —
+                    // sibling rows observe the change immediately and start
+                    // their own close animation in parallel.
+                    if target == Float(0) {
+                        if activeSwipeKey.value == rowKey {
+                            activeSwipeKey.value = nil
+                        }
+                    } else {
+                        activeSwipeKey.value = rowKey
+                    }
+
                     // animate(...) is a top-level Compose suspend that drives
                     // the value through the AnimationSpec frame by frame and
                     // hands us each value via the trailing block. Running it
@@ -698,6 +733,9 @@ public final class List : View, Renderable {
                     if let fullSwipeAction {
                         fullSwipeAction()
                         offsetState.value = Float(0)
+                        if activeSwipeKey.value == rowKey {
+                            activeSwipeKey.value = nil
+                        }
                     }
                 })
             ) {

From 88335c734e51927d7b2394c21bd38fe0cb846443 Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Wed, 13 May 2026 20:58:21 -0700
Subject: [PATCH 09/19] swipeActions: hide opposite-edge reveal during a full
 swipe

When a row had buttons on both edges, a full swipe in one direction
moved the foreground entirely off-screen and uncovered the opposite
edge's button cluster (clustered there by Arrangement.Start /
Arrangement.End). Visually it looked like the wrong action was
about to be triggered.

Gate each reveal Row on the current offset's sign: leading buttons
only render while offset >= 0 (the swipe hasn't gone trailing-ward),
trailing only while offset <= 0. At rest both render but neither is
visible because the foreground covers them.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 Sources/SkipUI/SkipUI/Containers/List.swift | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index 69a96986..aba9fd5c 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -611,7 +611,13 @@ public final class List : View, Renderable {
 
             // Reveal area sits beneath the row content. matchParentSize adopts
             // the foreground's size without forcing the parent Box to grow.
-            if leadingButtons.size > 0 {
+            // Each edge's buttons are clustered at that edge via Arrangement.
+            // Without the direction guard below, a full-swipe in one direction
+            // moves the foreground entirely off-screen and the opposite-edge
+            // buttons would otherwise become visible — guard so only the edge
+            // matching the current drag direction can ever render.
+            let curOffsetForReveal = offsetState.value
+            if leadingButtons.size > 0 && curOffsetForReveal >= Float(0) {
                 Row(modifier: Modifier.matchParentSize(), horizontalArrangement: Arrangement.Start) {
                     for button in leadingButtons {
                         RenderSwipeRevealButton(button: button, widthDp: buttonWidthDp, context: context, onTap: {
@@ -629,7 +635,7 @@ public final class List : View, Renderable {
                     }
                 }
             }
-            if trailingButtons.size > 0 {
+            if trailingButtons.size > 0 && curOffsetForReveal <= Float(0) {
                 Row(modifier: Modifier.matchParentSize(), horizontalArrangement: Arrangement.End) {
                     for button in trailingButtons {
                         RenderSwipeRevealButton(button: button, widthDp: buttonWidthDp, context: context, onTap: {

From bb61f846c5fe3f9c011dca29bbfcbb37de5fba3b Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Wed, 13 May 2026 21:04:15 -0700
Subject: [PATCH 10/19] swipeActions: clip to row bounds and add fade-to-gray
 scrim

Two visual touch-ups:

1. Clip the swipeable container to its bounds via Modifier.clipToBounds()
   so the foreground row can't visually escape the cell rectangle while
   sliding. Previously a hard swipe (especially full-swipe in either
   direction) could draw the row past its original border and bleed
   into the next cell or list edge.

2. Stack a light-gray scrim Box on top of the foreground content with
   alpha proportional to swipe progress (offset distance / open-anchor
   distance), capped at 0.18. The cell appears to "recede" as the
   actions emerge, with no scrim at rest.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 Sources/SkipUI/SkipUI/Containers/List.swift | 21 ++++++++++++++++++++-
 1 file changed, 20 insertions(+), 1 deletion(-)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index aba9fd5c..c398cc42 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -48,6 +48,7 @@ import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.runtime.rememberUpdatedState
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
+import androidx.compose.ui.draw.clipToBounds
 import androidx.compose.ui.draw.shadow
 import androidx.compose.ui.layout.onSizeChanged
 import androidx.compose.ui.geometry.CornerRadius
@@ -602,7 +603,7 @@ public final class List : View, Renderable {
             }
         }
 
-        Box(modifier: modifier.onSizeChanged { rowWidthPxState.value = Float($0.width) }) {
+        Box(modifier: modifier.onSizeChanged { rowWidthPxState.value = Float($0.width) }.clipToBounds()) {
             let rowWidthPx = rowWidthPxState.value
             let trailingFullPx = -rowWidthPx
             let leadingFullPx = rowWidthPx
@@ -746,6 +747,24 @@ public final class List : View, Renderable {
                 })
             ) {
                 RenderItem(content: content, level: level, context: context, styling: styling)
+                // Subtle scrim that intensifies with swipe progress so the row
+                // visually recedes as actions appear. Capped at a low alpha
+                // because the row is still tappable and shouldn't look disabled.
+                let curAbs = offsetState.value < Float(0) ? -offsetState.value : offsetState.value
+                let openMag: Float
+                if offsetState.value < Float(0) {
+                    openMag = -trailingOpenPx
+                } else if offsetState.value > Float(0) {
+                    openMag = leadingOpenPx
+                } else {
+                    openMag = Float(1) // unused; progress stays 0
+                }
+                let progressRaw = openMag > Float(0) ? curAbs / openMag : Float(0)
+                let progress: Float = progressRaw > Float(1) ? Float(1) : progressRaw
+                if progress > Float(0) {
+                    let scrimAlpha = progress * Float(0.18)
+                    Box(modifier: Modifier.matchParentSize().background(androidx.compose.ui.graphics.Color.LightGray.copy(alpha: scrimAlpha)))
+                }
             }
         }
     }

From 58446479c6beb27231c5e1c224fb08aaa441d7dc Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Wed, 13 May 2026 21:12:23 -0700
Subject: [PATCH 11/19] swipeActions: constrain reverse-swipe to closing only
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

If a row was already open with trailing actions visible, a continuous
right-ward drag past zero would carry the row into leading territory
and reveal the leading actions instead of just closing. Same in the
mirror direction.

Capture the offset at onDragStarted; while the gesture is in flight,
clamp the allowable range:

- Started open trailing (start < 0)  → drag bounded [trailingFullPx, 0]
- Started open leading  (start > 0)  → drag bounded [0, leadingFullPx]
- Started closed       (start == 0) → full range, can swipe either way

The release-time nearest-anchor logic doesn't need changes; with the
offset clamped, the projected position can only land between closed
and the same-side open anchor.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 Sources/SkipUI/SkipUI/Containers/List.swift | 25 +++++++++++++++++++--
 1 file changed, 23 insertions(+), 2 deletions(-)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index c398cc42..d6f64a3b 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -672,13 +672,34 @@ public final class List : View, Renderable {
             // past this fraction of its width.
             let fullSwipeFraction: Float = Float(0.75)
 
+            // Captures the offset at the moment a new drag begins. If the row
+            // is already open in one direction, we constrain the gesture to
+            // that direction's range so swiping back past zero closes the row
+            // without opening the opposite-edge actions.
+            let dragStartOffset = remember { mutableFloatStateOf(Float(0)) }
+
             let dragState = rememberDraggableState { delta in
-                offsetState.value = (offsetState.value + delta).coerceIn(minOffsetPx, maxOffsetPx)
+                let start = dragStartOffset.value
+                let dragMin: Float
+                let dragMax: Float
+                if start < Float(0) {
+                    dragMin = minOffsetPx
+                    dragMax = Float(0)
+                } else if start > Float(0) {
+                    dragMin = Float(0)
+                    dragMax = maxOffsetPx
+                } else {
+                    dragMin = minOffsetPx
+                    dragMax = maxOffsetPx
+                }
+                offsetState.value = (offsetState.value + delta).coerceIn(dragMin, dragMax)
             }
             Box(modifier: Modifier
                 .fillMaxWidth()
                 .offset { IntOffset(offsetState.value.toInt(), 0) }
-                .draggable(state: dragState, orientation: Orientation.Horizontal, onDragStopped: { velocity in
+                .draggable(state: dragState, orientation: Orientation.Horizontal, onDragStarted: { _ in
+                    dragStartOffset.value = offsetState.value
+                }, onDragStopped: { velocity in
                     let cur = offsetState.value
                     let projected = (cur + velocity * velocityProjectionSeconds).coerceIn(minOffsetPx, maxOffsetPx)
 

From 396195c70e6f45502fbc1e64927010525bd3b47b Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Wed, 13 May 2026 21:19:00 -0700
Subject: [PATCH 12/19] swipeActions: also constrain release-time projection by
 start-side
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The drag-time clamp prevented the offset from crossing zero into the
opposite-edge range, but the release-time projection still used the
full [minOffsetPx, maxOffsetPx]. A hard rightward flick from an open
trailing state would produce cur=0 (clamped), velocity>0, projected =
positive number coerced into the leading half — and the nearest-anchor
solver picked leadingOpenPx.

Apply the same start-side constraint to the projection range, and
filter the candidate anchor set to exclude the opposite-side open
anchor entirely. A reverse-direction flick now snaps to closed even
when it would have projected into the opposite half.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 Sources/SkipUI/SkipUI/Containers/List.swift | 27 +++++++++++++++++----
 1 file changed, 22 insertions(+), 5 deletions(-)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index d6f64a3b..7f781978 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -701,15 +701,32 @@ public final class List : View, Renderable {
                     dragStartOffset.value = offsetState.value
                 }, onDragStopped: { velocity in
                     let cur = offsetState.value
-                    let projected = (cur + velocity * velocityProjectionSeconds).coerceIn(minOffsetPx, maxOffsetPx)
+                    // Apply the same direction constraint as the drag callback
+                    // so a hard flick past zero from an open state can't
+                    // project into the opposite-edge anchor — it snaps closed.
+                    let start = dragStartOffset.value
+                    let projMin: Float
+                    let projMax: Float
+                    if start < Float(0) {
+                        projMin = minOffsetPx
+                        projMax = Float(0)
+                    } else if start > Float(0) {
+                        projMin = Float(0)
+                        projMax = maxOffsetPx
+                    } else {
+                        projMin = minOffsetPx
+                        projMax = maxOffsetPx
+                    }
+                    let projected = (cur + velocity * velocityProjectionSeconds).coerceIn(projMin, projMax)
 
-                    // Build the candidate anchor set: always closed; add open
-                    // anchors only on edges that have buttons.
+                    // Build the candidate anchor set: always closed; add the
+                    // same-side open anchor only if the gesture didn't start
+                    // on the opposite side.
                     let anchors: kotlin.collections.MutableList<Float> = mutableListOf(Float(0))
-                    if trailingButtons.size > 0 {
+                    if trailingButtons.size > 0 && start <= Float(0) {
                         anchors.add(trailingOpenPx)
                     }
-                    if leadingButtons.size > 0 {
+                    if leadingButtons.size > 0 && start >= Float(0) {
                         anchors.add(leadingOpenPx)
                     }
 

From 45d460bb50f869b9ed4ed785af7f3365d4026ff5 Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Wed, 13 May 2026 21:39:23 -0700
Subject: [PATCH 13/19] swipeActions: promote destructive to edge + auto-delete
 on full swipe
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Two iOS-parity behaviors:

1. Destructive button moves to the swipe-from edge regardless of the
   order it was declared in the @ViewBuilder. Trailing-edge: pushed
   to the rightmost position (last in the laid-out Row). Leading-edge:
   pushed to the leftmost position (first in the Row). The full-swipe
   gesture also targets the destructive button, not the first declared.

2. When a destructive full-swipe fires AND the List has either an
   onDelete handler or a deletable objectsBinding wired up, we
   invoke that deletion. LazyColumn's animateItem then collapses the
   row visually — matching the "destructive full-swipe deletes the
   row" feel from iOS. If no deletion plumbing exists, the row just
   bounces back as before; the user's destructive Button is still
   responsible for any side effects (toast, undo, etc.).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 Sources/SkipUI/SkipUI/Containers/List.swift | 61 +++++++++++++++++----
 1 file changed, 51 insertions(+), 10 deletions(-)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index 7f781978..d4c36977 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -507,17 +507,23 @@ public final class List : View, Renderable {
         // we just render the row (caller still handles reorder wrapping).
         let itemContent: @Composable (Modifier) -> Void
         if hasUserSwipe {
-            // Pass-through onDelete so an explicit destructive button can still
-            // remove the row by calling the same action the trash swipe would.
-            let rememberedOnDelete = rememberUpdatedState({
+            // Mirror iOS: a destructive button's full-swipe both fires the
+            // user's action AND removes the row from the underlying data, so
+            // the row visibly disappears via LazyColumn's animateItem. We pass
+            // an `onDestructiveDelete` closure to RenderSwipeableItem; it is
+            // only invoked when (a) the destructive full-swipe fires AND
+            // (b) the List has either an onDelete handler or a deletable
+            // objectsBinding to remove from.
+            let canAutoDelete = isDeleteEnabled
+            let onDestructiveDelete: (() -> Void)? = canAutoDelete ? {
                 if let onDelete {
                     withAnimation { onDelete(IndexSet(integer: index)) }
                 } else if let objectsBinding, objectsBinding.wrappedValue.count > index {
                     withAnimation { (objectsBinding.wrappedValue as? RangeReplaceableCollection<Any>)?.remove(at: index) }
                 }
-            })
+            } : nil
             itemContent = { rowModifier in
-                RenderSwipeableItem(content: content, level: level, context: context, modifier: rowModifier, styling: styling, leadingConfig: leadingSwipe, trailingConfig: trailingSwipe, rowKey: key, activeSwipeKey: activeSwipeKey)
+                RenderSwipeableItem(content: content, level: level, context: context, modifier: rowModifier, styling: styling, leadingConfig: leadingSwipe, trailingConfig: trailingSwipe, rowKey: key, activeSwipeKey: activeSwipeKey, onDestructiveDelete: onDestructiveDelete)
             }
         } else if isDeleteEnabled {
             let rememberedOnDelete = rememberUpdatedState({
@@ -566,15 +572,40 @@ public final class List : View, Renderable {
     /// The foreground row determines the cell's height; reveal buttons match it
     /// via `Modifier.matchParentSize()` so we never propagate unbounded height
     /// constraints up into the surrounding LazyColumn.
-    @Composable private func RenderSwipeableItem(content: Renderable, level: Int, context: ComposeContext, modifier: Modifier, styling: ListStyling, leadingConfig: SwipeActionsConfig?, trailingConfig: SwipeActionsConfig?, rowKey: String, activeSwipeKey: MutableState<String?>) {
+    @Composable private func RenderSwipeableItem(content: Renderable, level: Int, context: ComposeContext, modifier: Modifier, styling: ListStyling, leadingConfig: SwipeActionsConfig?, trailingConfig: SwipeActionsConfig?, rowKey: String, activeSwipeKey: MutableState<String?>, onDestructiveDelete: (() -> Void)? = nil) {
         let coroutineScope = rememberCoroutineScope()
 
-        let trailingButtons: kotlin.collections.List<Button> = (trailingConfig?.content.Evaluate(context: context, options: 0) ?? listOf()).mapNotNull {
+        let trailingButtonsRaw: kotlin.collections.List<Button> = (trailingConfig?.content.Evaluate(context: context, options: 0) ?? listOf()).mapNotNull {
             $0.strip() as? Button
         }
-        let leadingButtons: kotlin.collections.List<Button> = (leadingConfig?.content.Evaluate(context: context, options: 0) ?? listOf()).mapNotNull {
+        let leadingButtonsRaw: kotlin.collections.List<Button> = (leadingConfig?.content.Evaluate(context: context, options: 0) ?? listOf()).mapNotNull {
             $0.strip() as? Button
         }
+        // iOS reorders .destructive Buttons to the swipe-from edge regardless
+        // of the order they were declared in. For trailing swipes that means
+        // pinned to the right (last in the Row laid out with Arrangement.End);
+        // for leading, pinned to the left (first with Arrangement.Start). The
+        // destructive button also becomes the full-swipe target.
+        let trailingDestructive = trailingButtonsRaw.firstOrNull { $0.role == ButtonRole.destructive }
+        let trailingNonDestructive = trailingButtonsRaw.filter { $0.role != ButtonRole.destructive }
+        let trailingButtons: kotlin.collections.List<Button>
+        if let trailingDestructive {
+            trailingButtons = (trailingNonDestructive + listOf(trailingDestructive)) as kotlin.collections.List<Button>
+        } else {
+            trailingButtons = trailingButtonsRaw
+        }
+        let leadingDestructive = leadingButtonsRaw.firstOrNull { $0.role == ButtonRole.destructive }
+        let leadingNonDestructive = leadingButtonsRaw.filter { $0.role != ButtonRole.destructive }
+        let leadingButtons: kotlin.collections.List<Button>
+        if let leadingDestructive {
+            leadingButtons = (listOf(leadingDestructive) + leadingNonDestructive) as kotlin.collections.List<Button>
+        } else {
+            leadingButtons = leadingButtonsRaw
+        }
+        // The full-swipe gesture should fire the destructive action when one
+        // exists, otherwise the edge-most action.
+        let trailingFullSwipeTarget = trailingDestructive ?? trailingButtons.lastOrNull()
+        let leadingFullSwipeTarget = leadingDestructive ?? leadingButtons.firstOrNull()
         let allowsTrailingFullSwipe = trailingConfig?.allowsFullSwipe == true && trailingButtons.size > 0
         let allowsLeadingFullSwipe = leadingConfig?.allowsFullSwipe == true && leadingButtons.size > 0
 
@@ -746,12 +777,15 @@ public final class List : View, Renderable {
                     // position has crossed half the row width past its open
                     // anchor — this is what fires the destructive action.
                     var fullSwipeAction: (() -> Void)? = nil
+                    var firedDestructive = false
                     if allowsTrailingFullSwipe && target == trailingOpenPx && -cur > rowWidthPx * fullSwipeFraction {
                         target = trailingFullPx
-                        fullSwipeAction = trailingButtons.firstOrNull()?.action
+                        fullSwipeAction = trailingFullSwipeTarget?.action
+                        firedDestructive = trailingFullSwipeTarget?.role == ButtonRole.destructive
                     } else if allowsLeadingFullSwipe && target == leadingOpenPx && cur > rowWidthPx * fullSwipeFraction {
                         target = leadingFullPx
-                        fullSwipeAction = leadingButtons.firstOrNull()?.action
+                        fullSwipeAction = leadingFullSwipeTarget?.action
+                        firedDestructive = leadingFullSwipeTarget?.role == ButtonRole.destructive
                     }
 
                     // Update the shared "active swipe" key BEFORE animating —
@@ -777,6 +811,13 @@ public final class List : View, Renderable {
                     }
                     if let fullSwipeAction {
                         fullSwipeAction()
+                        // For a destructive full-swipe also remove the row
+                        // from the underlying data so LazyColumn collapses
+                        // it visually (matches iOS). Skipped for non-
+                        // destructive full-swipes — those just bounce back.
+                        if firedDestructive, let onDestructiveDelete {
+                            onDestructiveDelete()
+                        }
                         offsetState.value = Float(0)
                         if activeSwipeKey.value == rowKey {
                             activeSwipeKey.value = nil

From 8dfa6e941b66a2355e9bd6a9800869d52585c641 Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Wed, 13 May 2026 22:07:57 -0700
Subject: [PATCH 14/19] swipeActions: tap on destructive button also
 auto-deletes the row
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Full-swipe through a destructive action already routed through
onDestructiveDelete, but a *tap* on the destructive button only ran
the user's Button.action and animated closed — leaving the row in
place even when the surrounding ForEach had an .onDelete handler.

Have the per-button onTap closures consult button.role and invoke
the captured onDestructiveDelete?() right after the user's action,
matching iOS behavior where tapping a .destructive list-row action
removes the row.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 Sources/SkipUI/SkipUI/Containers/List.swift | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index d4c36977..0137a3c4 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -654,6 +654,13 @@ public final class List : View, Renderable {
                     for button in leadingButtons {
                         RenderSwipeRevealButton(button: button, widthDp: buttonWidthDp, context: context, onTap: {
                             button.action()
+                            // Mirror the destructive full-swipe path: a tap on
+                            // a destructive action also removes the row from
+                            // the underlying data when an onDelete handler or
+                            // deletable objectsBinding is wired up.
+                            if button.role == ButtonRole.destructive, let onDestructiveDelete {
+                                onDestructiveDelete()
+                            }
                             let from = offsetState.value
                             if activeSwipeKey.value == rowKey {
                                 activeSwipeKey.value = nil
@@ -672,6 +679,13 @@ public final class List : View, Renderable {
                     for button in trailingButtons {
                         RenderSwipeRevealButton(button: button, widthDp: buttonWidthDp, context: context, onTap: {
                             button.action()
+                            // Mirror the destructive full-swipe path: a tap on
+                            // a destructive action also removes the row from
+                            // the underlying data when an onDelete handler or
+                            // deletable objectsBinding is wired up.
+                            if button.role == ButtonRole.destructive, let onDestructiveDelete {
+                                onDestructiveDelete()
+                            }
                             let from = offsetState.value
                             if activeSwipeKey.value == rowKey {
                                 activeSwipeKey.value = nil

From c45a41bd28e34a258ca9568b3c248c004393ad79 Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Wed, 13 May 2026 23:25:08 -0700
Subject: [PATCH 15/19] swipeActions: dynamic button width, font/padding, edge
 color match
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Pull together several reveal-button rendering improvements:

- Use Color.Red / Color.White for destructive buttons so the bright
  red matches the implicit onDelete trash-swipe a few lines above
  in this same file (was MaterialTheme.colorScheme.error, a deeper
  theme-driven shade that looked mismatched in the same list).
- Lay out the label inside a centered Row instead of a Box so multi-
  view labels (Image + Text, Label, etc.) flow horizontally instead
  of stacking on top of each other at the Box center.
- Compose the user's label view directly via .Compose(context:),
  routing the font through .font(Font.subheadline) view modifier
  (Skip's transpilation doesn't expose EnvironmentValues.font as
  a Kotlin setter, so the env-set form fails to compile).
- Add interior padding (12dp horizontal, 8dp vertical) around the
  label so icons/text don't touch the cell edges.
- Make button width dynamic: widthIn(min: 96.dp) + content sizing
  so labels (Pin, Delete, longer custom strings) fit on a single
  line. 96dp is Material's comfortable touch target with breathing
  room — closes the gap that appeared when text content was narrow.
- Capture the actual buttons-row width per edge via Modifier.
  onSizeChanged on a wrapping Box(matchParentSize, contentAlignment:
  CenterStart/CenterEnd) → Row(wrapContent), and use that measured
  width for the open-anchor distance. The row now opens to exactly
  the space the buttons need, regardless of how many buttons or how
  wide each one is.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 Sources/SkipUI/SkipUI/Containers/List.swift | 141 ++++++++++++--------
 1 file changed, 85 insertions(+), 56 deletions(-)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index 0137a3c4..08680fc0 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -23,6 +23,8 @@ import androidx.compose.foundation.layout.offset
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.requiredHeightIn
 import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.layout.widthIn
+import androidx.compose.foundation.layout.wrapContentWidth
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.foundation.shape.GenericShape
@@ -609,17 +611,24 @@ public final class List : View, Renderable {
         let allowsTrailingFullSwipe = trailingConfig?.allowsFullSwipe == true && trailingButtons.size > 0
         let allowsLeadingFullSwipe = leadingConfig?.allowsFullSwipe == true && leadingButtons.size > 0
 
-        let buttonWidthDp = 80.dp
+        // Each reveal button is at least this wide but grows to fit its
+        // content (long text, icon + text, etc.). 96dp matches Material's
+        // comfortable touch target with horizontal breathing room around
+        // the label and visually closes the gap that used to appear when
+        // text content was narrow. The actual buttons-row width is captured
+        // per edge via onSizeChanged below; that measured width drives the
+        // open-anchor distance so the row always opens to exactly the space
+        // the buttons need.
+        let minButtonWidthDp = 80.dp
         let density = LocalDensity.current
-        let buttonWidthPx = with(density) { buttonWidthDp.toPx() }
-        let trailingOpenPx = -Float(trailingButtons.size) * buttonWidthPx
-        let leadingOpenPx = Float(leadingButtons.size) * buttonWidthPx
 
         // Single source of truth for the foreground row's horizontal offset.
         // Updated synchronously in the drag callback (no coroutine race) and
         // driven by the top-level `animate(...)` suspend during the snap-back.
         let offsetState = remember { mutableFloatStateOf(Float(0)) }
         let rowWidthPxState = remember { mutableFloatStateOf(Float(0)) }
+        let trailingButtonsWidthPxState = remember { mutableFloatStateOf(Float(0)) }
+        let leadingButtonsWidthPxState = remember { mutableFloatStateOf(Float(0)) }
 
         // When a *different* row's swipe opens, this LaunchedEffect observes
         // the shared activeSwipeKey and animates this row closed. Matches
@@ -636,6 +645,8 @@ public final class List : View, Renderable {
 
         Box(modifier: modifier.onSizeChanged { rowWidthPxState.value = Float($0.width) }.clipToBounds()) {
             let rowWidthPx = rowWidthPxState.value
+            let trailingOpenPx = -trailingButtonsWidthPxState.value
+            let leadingOpenPx = leadingButtonsWidthPxState.value
             let trailingFullPx = -rowWidthPx
             let leadingFullPx = rowWidthPx
             let minOffsetPx = trailingButtons.size > 0 ? trailingFullPx : Float(0)
@@ -650,52 +661,48 @@ public final class List : View, Renderable {
             // matching the current drag direction can ever render.
             let curOffsetForReveal = offsetState.value
             if leadingButtons.size > 0 && curOffsetForReveal >= Float(0) {
-                Row(modifier: Modifier.matchParentSize(), horizontalArrangement: Arrangement.Start) {
-                    for button in leadingButtons {
-                        RenderSwipeRevealButton(button: button, widthDp: buttonWidthDp, context: context, onTap: {
-                            button.action()
-                            // Mirror the destructive full-swipe path: a tap on
-                            // a destructive action also removes the row from
-                            // the underlying data when an onDelete handler or
-                            // deletable objectsBinding is wired up.
-                            if button.role == ButtonRole.destructive, let onDestructiveDelete {
-                                onDestructiveDelete()
-                            }
-                            let from = offsetState.value
-                            if activeSwipeKey.value == rowKey {
-                                activeSwipeKey.value = nil
-                            }
-                            coroutineScope.launch {
-                                animate(initialValue: from, targetValue: Float(0)) { value, _ in
-                                    offsetState.value = value
+                Box(modifier: Modifier.matchParentSize(), contentAlignment: androidx.compose.ui.Alignment.CenterStart) {
+                    Row(modifier: Modifier.fillMaxHeight().wrapContentWidth().onSizeChanged { leadingButtonsWidthPxState.value = Float($0.width) }) {
+                        for button in leadingButtons {
+                            RenderSwipeRevealButton(button: button, minWidthDp: minButtonWidthDp, context: context, onTap: {
+                                button.action()
+                                if button.role == ButtonRole.destructive, let onDestructiveDelete {
+                                    onDestructiveDelete()
                                 }
-                            }
-                        })
+                                let from = offsetState.value
+                                if activeSwipeKey.value == rowKey {
+                                    activeSwipeKey.value = nil
+                                }
+                                coroutineScope.launch {
+                                    animate(initialValue: from, targetValue: Float(0)) { value, _ in
+                                        offsetState.value = value
+                                    }
+                                }
+                            })
+                        }
                     }
                 }
             }
             if trailingButtons.size > 0 && curOffsetForReveal <= Float(0) {
-                Row(modifier: Modifier.matchParentSize(), horizontalArrangement: Arrangement.End) {
-                    for button in trailingButtons {
-                        RenderSwipeRevealButton(button: button, widthDp: buttonWidthDp, context: context, onTap: {
-                            button.action()
-                            // Mirror the destructive full-swipe path: a tap on
-                            // a destructive action also removes the row from
-                            // the underlying data when an onDelete handler or
-                            // deletable objectsBinding is wired up.
-                            if button.role == ButtonRole.destructive, let onDestructiveDelete {
-                                onDestructiveDelete()
-                            }
-                            let from = offsetState.value
-                            if activeSwipeKey.value == rowKey {
-                                activeSwipeKey.value = nil
-                            }
-                            coroutineScope.launch {
-                                animate(initialValue: from, targetValue: Float(0)) { value, _ in
-                                    offsetState.value = value
+                Box(modifier: Modifier.matchParentSize(), contentAlignment: androidx.compose.ui.Alignment.CenterEnd) {
+                    Row(modifier: Modifier.fillMaxHeight().wrapContentWidth().onSizeChanged { trailingButtonsWidthPxState.value = Float($0.width) }) {
+                        for button in trailingButtons {
+                            RenderSwipeRevealButton(button: button, minWidthDp: minButtonWidthDp, context: context, onTap: {
+                                button.action()
+                                if button.role == ButtonRole.destructive, let onDestructiveDelete {
+                                    onDestructiveDelete()
                                 }
-                            }
-                        })
+                                let from = offsetState.value
+                                if activeSwipeKey.value == rowKey {
+                                    activeSwipeKey.value = nil
+                                }
+                                coroutineScope.launch {
+                                    animate(initialValue: from, targetValue: Float(0)) { value, _ in
+                                        offsetState.value = value
+                                    }
+                                }
+                            })
+                        }
                     }
                 }
             }
@@ -715,7 +722,7 @@ public final class List : View, Renderable {
             // velocity-projected position) so a fast flick alone can't trigger
             // the destructive action — the user has to physically drag the row
             // past this fraction of its width.
-            let fullSwipeFraction: Float = Float(0.75)
+            let fullSwipeFraction: Float = Float(0.65)
 
             // Captures the offset at the moment a new drag begins. If the row
             // is already open in one direction, we constrain the gesture to
@@ -863,12 +870,19 @@ public final class List : View, Renderable {
     }
 
     /// Render a single action button inside the swipe reveal area.
-    @Composable private func RenderSwipeRevealButton(button: Button, widthDp: Dp, context: ComposeContext, onTap: () -> Void) {
+    /// Width is dynamic — at least `minWidthDp` but grows to fit content
+    /// on a single line. Padding around the label keeps icon/text from
+    /// touching the cell edges.
+    @Composable private func RenderSwipeRevealButton(button: Button, minWidthDp: Dp, context: ComposeContext, onTap: () -> Void) {
         let backgroundColor: androidx.compose.ui.graphics.Color
         let contentColor: androidx.compose.ui.graphics.Color
         if button.role == ButtonRole.destructive {
-            backgroundColor = MaterialTheme.colorScheme.error
-            contentColor = MaterialTheme.colorScheme.onError
+            // Match the red used by the implicit onDelete trash swipe
+            // (line ~550 above) so destructive actions look consistent
+            // whether they come from .onDelete or an explicit
+            // .swipeActions { Button(role: .destructive) { ... } }.
+            backgroundColor = androidx.compose.ui.graphics.Color.Red
+            contentColor = androidx.compose.ui.graphics.Color.White
         } else {
             let tint = EnvironmentValues.shared._tint?.colorImpl()
             if let tint {
@@ -879,16 +893,31 @@ public final class List : View, Renderable {
                 contentColor = MaterialTheme.colorScheme.onSecondaryContainer
             }
         }
-        let labelText = button.label.Evaluate(context: context, options: 0).mapNotNull {
-            $0.strip() as? Text
-        }.firstOrNull()
-        Box(modifier: Modifier
+        // Render the user's label view (Text, Image, Label, or any custom
+        // composition) by composing it directly. Use a centered Row (not a
+        // Box) so multi-view labels — e.g. Image + Text, or Label by itself
+        // which is icon+text — flow horizontally instead of stacking on
+        // top of each other at the Box center. Set foregroundStyle in the
+        // environment so child Text/Image inherit the contentColor.
+        Row(modifier: Modifier
             .fillMaxHeight()
-            .width(widthDp)
+            .widthIn(min: minWidthDp)
             .background(backgroundColor)
-            .clickable(onClick: onTap),
-            contentAlignment: androidx.compose.ui.Alignment.Center) {
-            androidx.compose.material3.Text(text: labelText?.localizedTextString() ?? "", color: contentColor, style: Font.callout.fontImpl(), maxLines: 1)
+            .clickable(onClick: onTap)
+            .padding(horizontal: 12.dp, vertical: 8.dp),
+            horizontalArrangement: Arrangement.Center,
+            verticalAlignment: androidx.compose.ui.Alignment.CenterVertically) {
+            let contentSwiftColor = Color(colorImpl: { contentColor })
+            EnvironmentValues.shared.setValues({
+                $0.set_foregroundStyle(contentSwiftColor)
+                return ComposeResult.ok
+            }) {
+                // Apply the font via the .font() View modifier which routes
+                // through environment(\.font, ...). Setting the font property
+                // on EnvironmentValues directly isn't exposed as a Kotlin
+                // setter by Skip's transpilation.
+                button.label.font(Font.footnote).Compose(context: context.content())
+            }
         }
     }
 

From 02ef09875d784d890183395ef0c3eef55b3d47bb Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Thu, 14 May 2026 09:47:07 -0700
Subject: [PATCH 16/19] swipeActions: cleanup code and comments

---
 Sources/SkipUI/SkipUI/Containers/List.swift | 220 ++++++++++----------
 1 file changed, 109 insertions(+), 111 deletions(-)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index 08680fc0..d8d4a1ef 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -256,9 +256,9 @@ public final class List : View, Renderable {
         }
 
         let itemContext = context.content()
-        // Tracks which row currently has its swipe actions revealed. When one
-        // opens, all others observe this state and animate closed. Matches
-        // iOS list behavior of "only one row's swipe actions visible at once".
+        /* Tracks which row currently has its swipe actions revealed. When one
+           opens, all others observe this state and animate closed. Matches
+           iOS list behavior of "only one row's swipe actions visible at once". */
         let activeSwipeKey = remember { mutableStateOf<String?>(nil) }
         // Combine contentPadding with contentMargins additively
         var contentPadding = EnvironmentValues.shared._contentPadding.asPaddingValues()
@@ -377,6 +377,15 @@ public final class List : View, Renderable {
     private static let horizontalItemInset = 16.0
     private static let verticalItemInset = 8.0
     private static let levelInset = 24.0
+    
+    /// Seconds of velocity-based projection used when picking the snap anchor.
+    private static let swipeVelocityProjectionSeconds: Float = Float(0.15)
+    /// Fraction of the row width past which a full swipe fires the destructive action.
+    private static let swipeFullSwipeFraction: Float = Float(0.65)
+    /// Cap on the gray scrim alpha applied to the foreground during a swipe.
+    private static let swipeScrimMaxAlpha: Float = Float(0.18)
+    /// Minimum width for a single reveal button; grows to fit longer labels.
+    private static let swipeButtonMinWidth: Dp = 80.dp
 
     static func contentModifier(level: Int) -> Modifier {
         return Modifier.padding(start: (horizontalItemInset + level * levelInset).dp, end: horizontalItemInset.dp, top: verticalItemInset.dp, bottom: verticalItemInset.dp).fillMaxWidth().requiredHeightIn(min: minimumItemHeight.dp)
@@ -504,18 +513,18 @@ public final class List : View, Renderable {
             return
         }
 
-        // Build the inner swipe + content composable. User-provided .swipeActions
-        // wins over the implicit onDelete trash. If neither swipe path applies
-        // we just render the row (caller still handles reorder wrapping).
+        /* Build the inner swipe + content composable. User-provided .swipeActions
+           wins over the implicit onDelete trash. If neither swipe path applies
+           we just render the row (caller still handles reorder wrapping). */
         let itemContent: @Composable (Modifier) -> Void
         if hasUserSwipe {
-            // Mirror iOS: a destructive button's full-swipe both fires the
-            // user's action AND removes the row from the underlying data, so
-            // the row visibly disappears via LazyColumn's animateItem. We pass
-            // an `onDestructiveDelete` closure to RenderSwipeableItem; it is
-            // only invoked when (a) the destructive full-swipe fires AND
-            // (b) the List has either an onDelete handler or a deletable
-            // objectsBinding to remove from.
+            /* Mirror iOS: a destructive button's full-swipe both fires the
+               user's action AND removes the row from the underlying data, so
+               the row visibly disappears via LazyColumn's animateItem. We pass
+               an `onDestructiveDelete` closure to RenderSwipeableItem; it is
+               only invoked when (a) the destructive full-swipe fires AND
+               (b) the List has either an onDelete handler or a deletable
+               objectsBinding to remove from. */
             let canAutoDelete = isDeleteEnabled
             let onDestructiveDelete: (() -> Void)? = canAutoDelete ? {
                 if let onDelete {
@@ -548,9 +557,12 @@ public final class List : View, Renderable {
 
             itemContent = {
                 SwipeToDismissBox(state: dismissState, enableDismissFromEndToStart: true, enableDismissFromStartToEnd: false, modifier: $0, backgroundContent: {
-                    let trashVector = Image.composeImageVector(named: "trash")!
+                    /* Red background unconditional (destructive cue); icon only
+                       if the trash vector resolves — force-unwrapping inside a LazyColumn item would crash measurement. */
                     Box(modifier: Modifier.background(androidx.compose.ui.graphics.Color.Red).fillMaxSize(), contentAlignment: androidx.compose.ui.Alignment.CenterEnd) {
-                        Icon(imageVector: trashVector, contentDescription: "Delete", modifier = Modifier.padding(end: 24.dp), tint: androidx.compose.ui.graphics.Color.White)
+                        if let trashVector = Image.composeImageVector(named: "trash") {
+                            Icon(imageVector: trashVector, contentDescription: "Delete", modifier = Modifier.padding(end: 24.dp), tint: androidx.compose.ui.graphics.Color.White)
+                        }
                     }
                 }, content: {
                     RenderItem(content: content, level: level, context: context, styling: styling)
@@ -583,16 +595,16 @@ public final class List : View, Renderable {
         let leadingButtonsRaw: kotlin.collections.List<Button> = (leadingConfig?.content.Evaluate(context: context, options: 0) ?? listOf()).mapNotNull {
             $0.strip() as? Button
         }
-        // iOS reorders .destructive Buttons to the swipe-from edge regardless
-        // of the order they were declared in. For trailing swipes that means
-        // pinned to the right (last in the Row laid out with Arrangement.End);
-        // for leading, pinned to the left (first with Arrangement.Start). The
-        // destructive button also becomes the full-swipe target.
+        /* iOS reorders .destructive Buttons to the swipe-from edge regardless
+           of the order they were declared in. For trailing swipes that means
+           pinned to the right (last in the Row laid out with Arrangement.End);
+           for leading, pinned to the left (first with Arrangement.Start). The
+           destructive button also becomes the full-swipe target. */
         let trailingDestructive = trailingButtonsRaw.firstOrNull { $0.role == ButtonRole.destructive }
         let trailingNonDestructive = trailingButtonsRaw.filter { $0.role != ButtonRole.destructive }
         let trailingButtons: kotlin.collections.List<Button>
         if let trailingDestructive {
-            trailingButtons = (trailingNonDestructive + listOf(trailingDestructive)) as kotlin.collections.List<Button>
+            trailingButtons = (trailingNonDestructive + listOf(trailingDestructive))
         } else {
             trailingButtons = trailingButtonsRaw
         }
@@ -600,39 +612,33 @@ public final class List : View, Renderable {
         let leadingNonDestructive = leadingButtonsRaw.filter { $0.role != ButtonRole.destructive }
         let leadingButtons: kotlin.collections.List<Button>
         if let leadingDestructive {
-            leadingButtons = (listOf(leadingDestructive) + leadingNonDestructive) as kotlin.collections.List<Button>
+            leadingButtons = (listOf(leadingDestructive) + leadingNonDestructive)
         } else {
             leadingButtons = leadingButtonsRaw
         }
-        // The full-swipe gesture should fire the destructive action when one
-        // exists, otherwise the edge-most action.
+        /* The full-swipe gesture should fire the destructive action when one
+           exists, otherwise the edge-most action. */
         let trailingFullSwipeTarget = trailingDestructive ?? trailingButtons.lastOrNull()
         let leadingFullSwipeTarget = leadingDestructive ?? leadingButtons.firstOrNull()
         let allowsTrailingFullSwipe = trailingConfig?.allowsFullSwipe == true && trailingButtons.size > 0
         let allowsLeadingFullSwipe = leadingConfig?.allowsFullSwipe == true && leadingButtons.size > 0
 
-        // Each reveal button is at least this wide but grows to fit its
-        // content (long text, icon + text, etc.). 96dp matches Material's
-        // comfortable touch target with horizontal breathing room around
-        // the label and visually closes the gap that used to appear when
-        // text content was narrow. The actual buttons-row width is captured
-        // per edge via onSizeChanged below; that measured width drives the
-        // open-anchor distance so the row always opens to exactly the space
-        // the buttons need.
-        let minButtonWidthDp = 80.dp
+        /* Measured buttons-row width per edge drives the open-anchor distance.
+           swipeButtonMinWidth is the floor. */
+        let minButtonWidthDp = swipeButtonMinWidth
         let density = LocalDensity.current
 
-        // Single source of truth for the foreground row's horizontal offset.
-        // Updated synchronously in the drag callback (no coroutine race) and
-        // driven by the top-level `animate(...)` suspend during the snap-back.
+        /* Single source of truth for the foreground row's horizontal offset.
+           Updated synchronously in the drag callback (no coroutine race) and
+           driven by the top-level `animate(...)` suspend during the snap-back. */
         let offsetState = remember { mutableFloatStateOf(Float(0)) }
         let rowWidthPxState = remember { mutableFloatStateOf(Float(0)) }
         let trailingButtonsWidthPxState = remember { mutableFloatStateOf(Float(0)) }
         let leadingButtonsWidthPxState = remember { mutableFloatStateOf(Float(0)) }
 
-        // When a *different* row's swipe opens, this LaunchedEffect observes
-        // the shared activeSwipeKey and animates this row closed. Matches
-        // iOS list behavior of one open swipe at a time.
+        /* When a *different* row's swipe opens, this LaunchedEffect observes
+           the shared activeSwipeKey and animates this row closed. Matches
+           iOS list behavior of one open swipe at a time. */
         let currentlyOpen = activeSwipeKey.value
         LaunchedEffect(currentlyOpen) {
             if currentlyOpen != rowKey && offsetState.value != Float(0) {
@@ -652,13 +658,13 @@ public final class List : View, Renderable {
             let minOffsetPx = trailingButtons.size > 0 ? trailingFullPx : Float(0)
             let maxOffsetPx = leadingButtons.size > 0 ? leadingFullPx : Float(0)
 
-            // Reveal area sits beneath the row content. matchParentSize adopts
-            // the foreground's size without forcing the parent Box to grow.
-            // Each edge's buttons are clustered at that edge via Arrangement.
-            // Without the direction guard below, a full-swipe in one direction
-            // moves the foreground entirely off-screen and the opposite-edge
-            // buttons would otherwise become visible — guard so only the edge
-            // matching the current drag direction can ever render.
+            /* Reveal area sits beneath the row content. matchParentSize adopts
+               the foreground's size without forcing the parent Box to grow.
+               Each edge's buttons are clustered at that edge via Arrangement.
+               Without the direction guard below, a full-swipe in one direction
+               moves the foreground entirely off-screen and the opposite-edge
+               buttons would otherwise become visible — guard so only the edge
+               matching the current drag direction can ever render. */
             let curOffsetForReveal = offsetState.value
             if leadingButtons.size > 0 && curOffsetForReveal >= Float(0) {
                 Box(modifier: Modifier.matchParentSize(), contentAlignment: androidx.compose.ui.Alignment.CenterStart) {
@@ -707,27 +713,25 @@ public final class List : View, Renderable {
                 }
             }
 
-            // Foreground row content sizes itself naturally (no fillMaxSize)
-            // so the parent Box adopts its height and the LazyColumn item is
-            // measurable.
-            // On release, project the current position forward by the gesture's
-            // velocity and snap to whichever anchor (closed / leading-open /
-            // trailing-open / full-swipe) the projected position is closest to.
-            // This guarantees the row always lands on a defined state — never
-            // stops mid-track — and naturally handles reversing direction:
-            // dragging back from open toward closed projects past closed and
-            // snaps shut, even if the finger lifted while still partially open.
-            let velocityProjectionSeconds: Float = Float(0.15)
-            // Full-swipe is checked against ACTUAL drag distance (not the
-            // velocity-projected position) so a fast flick alone can't trigger
-            // the destructive action — the user has to physically drag the row
-            // past this fraction of its width.
-            let fullSwipeFraction: Float = Float(0.65)
-
-            // Captures the offset at the moment a new drag begins. If the row
-            // is already open in one direction, we constrain the gesture to
-            // that direction's range so swiping back past zero closes the row
-            // without opening the opposite-edge actions.
+            /*
+             Foreground row content sizes itself naturally (no fillMaxSize)
+             so the parent Box adopts its height and the LazyColumn item is
+             measurable.
+             On release, project the current position forward by the gesture's
+             velocity and snap to whichever anchor (closed / leading-open /
+             trailing-open / full-swipe) the projected position is closest to.
+             This guarantees the row always lands on a defined state — never
+             stops mid-track — and naturally handles reversing direction:
+             dragging back from open toward closed projects past closed and
+             snaps shut, even if the finger lifted while still partially open.
+             Full-swipe checks ACTUAL drag distance, not the projected position,
+             so a fast flick alone can't trigger the destructive action.
+             */
+
+            /* Captures the offset at the moment a new drag begins. If the row
+               is already open in one direction, we constrain the gesture to
+               that direction's range so swiping back past zero closes the row
+               without opening the opposite-edge actions. */
             let dragStartOffset = remember { mutableFloatStateOf(Float(0)) }
 
             let dragState = rememberDraggableState { delta in
@@ -753,9 +757,9 @@ public final class List : View, Renderable {
                     dragStartOffset.value = offsetState.value
                 }, onDragStopped: { velocity in
                     let cur = offsetState.value
-                    // Apply the same direction constraint as the drag callback
-                    // so a hard flick past zero from an open state can't
-                    // project into the opposite-edge anchor — it snaps closed.
+                    /* Apply the same direction constraint as the drag callback
+                       so a hard flick past zero from an open state can't
+                       project into the opposite-edge anchor — it snaps closed. */
                     let start = dragStartOffset.value
                     let projMin: Float
                     let projMax: Float
@@ -769,11 +773,11 @@ public final class List : View, Renderable {
                         projMin = minOffsetPx
                         projMax = maxOffsetPx
                     }
-                    let projected = (cur + velocity * velocityProjectionSeconds).coerceIn(projMin, projMax)
+                    let projected = (cur + velocity * swipeVelocityProjectionSeconds).coerceIn(projMin, projMax)
 
-                    // Build the candidate anchor set: always closed; add the
-                    // same-side open anchor only if the gesture didn't start
-                    // on the opposite side.
+                    /* Build the candidate anchor set: always closed; add the
+                       same-side open anchor only if the gesture didn't start
+                       on the opposite side. */
                     let anchors: kotlin.collections.MutableList<Float> = mutableListOf(Float(0))
                     if trailingButtons.size > 0 && start <= Float(0) {
                         anchors.add(trailingOpenPx)
@@ -794,24 +798,24 @@ public final class List : View, Renderable {
                         }
                     }
 
-                    // Escalate to the full-swipe anchor if the projected
-                    // position has crossed half the row width past its open
-                    // anchor — this is what fires the destructive action.
+                    /* Escalate to the full-swipe anchor if the projected
+                       position has crossed half the row width past its open
+                       anchor — this is what fires the destructive action. */
                     var fullSwipeAction: (() -> Void)? = nil
                     var firedDestructive = false
-                    if allowsTrailingFullSwipe && target == trailingOpenPx && -cur > rowWidthPx * fullSwipeFraction {
+                    if allowsTrailingFullSwipe && target == trailingOpenPx && -cur > rowWidthPx * swipeFullSwipeFraction {
                         target = trailingFullPx
                         fullSwipeAction = trailingFullSwipeTarget?.action
                         firedDestructive = trailingFullSwipeTarget?.role == ButtonRole.destructive
-                    } else if allowsLeadingFullSwipe && target == leadingOpenPx && cur > rowWidthPx * fullSwipeFraction {
+                    } else if allowsLeadingFullSwipe && target == leadingOpenPx && cur > rowWidthPx * swipeFullSwipeFraction {
                         target = leadingFullPx
                         fullSwipeAction = leadingFullSwipeTarget?.action
                         firedDestructive = leadingFullSwipeTarget?.role == ButtonRole.destructive
                     }
 
-                    // Update the shared "active swipe" key BEFORE animating —
-                    // sibling rows observe the change immediately and start
-                    // their own close animation in parallel.
+                    /* Update the shared "active swipe" key BEFORE animating —
+                       sibling rows observe the change immediately and start
+                       their own close animation in parallel. */
                     if target == Float(0) {
                         if activeSwipeKey.value == rowKey {
                             activeSwipeKey.value = nil
@@ -820,22 +824,22 @@ public final class List : View, Renderable {
                         activeSwipeKey.value = rowKey
                     }
 
-                    // animate(...) is a top-level Compose suspend that drives
-                    // the value through the AnimationSpec frame by frame and
-                    // hands us each value via the trailing block. Running it
-                    // here — inside onDragStopped's own suspend coroutine —
-                    // means the next gesture (which cancels this coroutine)
-                    // simply interrupts the animation cleanly. There is no
-                    // shared Animatable for stale snapTo calls to step on.
+                    /* animate(...) is a top-level Compose suspend that drives
+                       the value through the AnimationSpec frame by frame and
+                       hands us each value via the trailing block. Running it
+                       here — inside onDragStopped's own suspend coroutine —
+                       means the next gesture (which cancels this coroutine)
+                       simply interrupts the animation cleanly. There is no
+                       shared Animatable for stale snapTo calls to step on. */
                     animate(initialValue: cur, targetValue: target, initialVelocity: velocity) { value, _ in
                         offsetState.value = value
                     }
                     if let fullSwipeAction {
                         fullSwipeAction()
-                        // For a destructive full-swipe also remove the row
-                        // from the underlying data so LazyColumn collapses
-                        // it visually (matches iOS). Skipped for non-
-                        // destructive full-swipes — those just bounce back.
+                        /* For a destructive full-swipe also remove the row
+                           from the underlying data so LazyColumn collapses
+                           it visually (matches iOS). Skipped for non-
+                           destructive full-swipes — those just bounce back. */
                         if firedDestructive, let onDestructiveDelete {
                             onDestructiveDelete()
                         }
@@ -847,9 +851,8 @@ public final class List : View, Renderable {
                 })
             ) {
                 RenderItem(content: content, level: level, context: context, styling: styling)
-                // Subtle scrim that intensifies with swipe progress so the row
-                // visually recedes as actions appear. Capped at a low alpha
-                // because the row is still tappable and shouldn't look disabled.
+                /* Subtle scrim that intensifies with swipe progress so the row
+                   visually recedes as actions appear.*/
                 let curAbs = offsetState.value < Float(0) ? -offsetState.value : offsetState.value
                 let openMag: Float
                 if offsetState.value < Float(0) {
@@ -862,7 +865,7 @@ public final class List : View, Renderable {
                 let progressRaw = openMag > Float(0) ? curAbs / openMag : Float(0)
                 let progress: Float = progressRaw > Float(1) ? Float(1) : progressRaw
                 if progress > Float(0) {
-                    let scrimAlpha = progress * Float(0.18)
+                    let scrimAlpha = progress * swipeScrimMaxAlpha
                     Box(modifier: Modifier.matchParentSize().background(androidx.compose.ui.graphics.Color.LightGray.copy(alpha: scrimAlpha)))
                 }
             }
@@ -877,10 +880,9 @@ public final class List : View, Renderable {
         let backgroundColor: androidx.compose.ui.graphics.Color
         let contentColor: androidx.compose.ui.graphics.Color
         if button.role == ButtonRole.destructive {
-            // Match the red used by the implicit onDelete trash swipe
-            // (line ~550 above) so destructive actions look consistent
-            // whether they come from .onDelete or an explicit
-            // .swipeActions { Button(role: .destructive) { ... } }.
+            /* Match the red used by the implicit onDelete SwipeToDismissBox so
+               destructive actions look the same whether triggered via .onDelete
+               or an explicit .swipeActions { Button(role: .destructive) }. */
             backgroundColor = androidx.compose.ui.graphics.Color.Red
             contentColor = androidx.compose.ui.graphics.Color.White
         } else {
@@ -893,12 +895,8 @@ public final class List : View, Renderable {
                 contentColor = MaterialTheme.colorScheme.onSecondaryContainer
             }
         }
-        // Render the user's label view (Text, Image, Label, or any custom
-        // composition) by composing it directly. Use a centered Row (not a
-        // Box) so multi-view labels — e.g. Image + Text, or Label by itself
-        // which is icon+text — flow horizontally instead of stacking on
-        // top of each other at the Box center. Set foregroundStyle in the
-        // environment so child Text/Image inherit the contentColor.
+        /* Render the user's label view (Text, Image, Label, or any custom
+           composition) by composing it directly. */
         Row(modifier: Modifier
             .fillMaxHeight()
             .widthIn(min: minWidthDp)
@@ -912,10 +910,10 @@ public final class List : View, Renderable {
                 $0.set_foregroundStyle(contentSwiftColor)
                 return ComposeResult.ok
             }) {
-                // Apply the font via the .font() View modifier which routes
-                // through environment(\.font, ...). Setting the font property
-                // on EnvironmentValues directly isn't exposed as a Kotlin
-                // setter by Skip's transpilation.
+                /* Apply the font via the .font() View modifier which routes
+                   through environment(\.font, ...). Setting the font property
+                   on EnvironmentValues directly isn't exposed as a Kotlin
+                   setter by Skip's transpilation. */
                 button.label.font(Font.footnote).Compose(context: context.content())
             }
         }

From 6b68d4ed705e0a478dd843e19c8be239896058d2 Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Thu, 14 May 2026 10:56:49 -0700
Subject: [PATCH 17/19] swipeActions: stretch reveal to the row edge +
 destructive takeover
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Combine several reveal-rendering improvements:

- Two layout modes for the buttons-row:
  * Natural: revealedPx ≤ naturalRow. Each button uses
    widthIn(min: minButtonWidthDp) and the Row wraps content, so a
    long label like "Add to favorites" stays on a single line. An
    onSizeChanged captures the resulting natural row width.
  * Stretch: revealedPx > naturalRow. Row width is set to revealedPx
    and each button is wrapped in Box(Modifier.weight(w).fillMaxHeight())
    so they share the row's extra space proportionally — buttons
    track the foreground's edge instead of leaving a gap.

- Full-swipe takeover (in stretch mode): when the user drags past
  the trigger fraction (75% of row width), the primary action — the
  destructive button if present, otherwise the edge-most button —
  absorbs all extra width and the others shrink to zero. Weights:
  primary = 1 + (count - 1) × takeoverAnim, others = 1 - takeoverAnim.
  animateFloatAsState smooths the transition; buttons with weight
  below 0.01 are skipped so the runtime never sees Modifier.weight(0).

- Open-anchor magnitudes now use the measured natural width with a
  count × minButtonWidth fallback before the first measurement
  lands. Fixes the first-frame race noted in the prior review where
  the snap solver could pick "closed" on the very first gesture.

- Trash-vector guard: stop force-unwrapping
  Image.composeImageVector(named: "trash") inside the implicit
  onDelete SwipeToDismissBox path; render the red background
  unconditionally and only draw the icon when the vector resolves
  so a missing asset can't crash inside a LazyColumn item composable.

- Centralized tuning knobs (swipeVelocityProjectionSeconds,
  swipeFullSwipeFraction, swipeScrimMaxAlpha, swipeButtonMinWidth)
  as private static let on List so the gesture feel can be tuned
  without spelunking through RenderSwipeableItem.

- Comments converted to /* */ block style for the multi-line
  blocks added on this branch, and the line-number reference in
  the destructive-color comment replaced with a semantic phrasing
  ("the implicit onDelete SwipeToDismissBox") that won't rot.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 Sources/SkipUI/SkipUI/Containers/List.swift | 204 +++++++++++++++-----
 1 file changed, 156 insertions(+), 48 deletions(-)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index 0db722cb..502eff20 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -4,6 +4,7 @@
 import Foundation
 #if SKIP
 import androidx.compose.animation.core.animateDpAsState
+import androidx.compose.animation.core.animateFloatAsState
 import androidx.compose.animation.core.animate
 import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
@@ -627,14 +628,19 @@ public final class List : View, Renderable {
            swipeButtonMinWidth is the floor. */
         let minButtonWidthDp = swipeButtonMinWidth
         let density = LocalDensity.current
+        let minButtonWidthPx = with(density) { minButtonWidthDp.toPx() }
 
         /* Single source of truth for the foreground row's horizontal offset.
            Updated synchronously in the drag callback (no coroutine race) and
            driven by the top-level `animate(...)` suspend during the snap-back. */
         let offsetState = remember { mutableFloatStateOf(Float(0)) }
         let rowWidthPxState = remember { mutableFloatStateOf(Float(0)) }
-        let trailingButtonsWidthPxState = remember { mutableFloatStateOf(Float(0)) }
-        let leadingButtonsWidthPxState = remember { mutableFloatStateOf(Float(0)) }
+        /* Natural (content-sized) buttons-row width per edge, captured via
+           onSizeChanged when the reveal is in natural-layout mode. Defaults
+           to count × minButtonWidth until the first measurement lands; that
+           fallback keeps the open-anchor non-zero on the very first gesture. */
+        let trailingNaturalState = remember { mutableFloatStateOf(Float(0)) }
+        let leadingNaturalState = remember { mutableFloatStateOf(Float(0)) }
 
         /* When a *different* row's swipe opens, this LaunchedEffect observes
            the shared activeSwipeKey and animates this row closed. Matches
@@ -651,63 +657,165 @@ public final class List : View, Renderable {
 
         Box(modifier: modifier.onSizeChanged { rowWidthPxState.value = Float($0.width) }.clipToBounds()) {
             let rowWidthPx = rowWidthPxState.value
-            let trailingOpenPx = -trailingButtonsWidthPxState.value
-            let leadingOpenPx = leadingButtonsWidthPxState.value
+            /* Natural buttons-row width is the measured content width (each
+               button sized to its label), captured below in natural-layout
+               mode. Before the first measurement lands the fallback is
+               count × minButtonWidth so the open anchor is never zero on
+               frame zero. */
+            let trailingNaturalFallback = Float(trailingButtons.size) * minButtonWidthPx
+            let leadingNaturalFallback = Float(leadingButtons.size) * minButtonWidthPx
+            let trailingNaturalPx = trailingNaturalState.value > Float(0) ? trailingNaturalState.value : trailingNaturalFallback
+            let leadingNaturalPx = leadingNaturalState.value > Float(0) ? leadingNaturalState.value : leadingNaturalFallback
+            let trailingOpenPx = -trailingNaturalPx
+            let leadingOpenPx = leadingNaturalPx
             let trailingFullPx = -rowWidthPx
             let leadingFullPx = rowWidthPx
             let minOffsetPx = trailingButtons.size > 0 ? trailingFullPx : Float(0)
             let maxOffsetPx = leadingButtons.size > 0 ? leadingFullPx : Float(0)
 
-            /* Reveal area sits beneath the row content. matchParentSize adopts
-               the foreground's size without forcing the parent Box to grow.
-               Each edge's buttons are clustered at that edge via Arrangement.
-               Without the direction guard below, a full-swipe in one direction
-               moves the foreground entirely off-screen and the opposite-edge
-               buttons would otherwise become visible — guard so only the edge
-               matching the current drag direction can ever render. */
-            let curOffsetForReveal = offsetState.value
-            if leadingButtons.size > 0 && curOffsetForReveal >= Float(0) {
+            /* Current revealed width per edge (positive). When the user drags
+               further than the natural buttons-row width, the reveal area
+               stretches: the row's width follows the foreground so the
+               buttons grow to track the row edge instead of leaving a gap. */
+            let curOffset = offsetState.value
+            let revealedTrailingPx = curOffset < Float(0) ? -curOffset : Float(0)
+            let revealedLeadingPx = curOffset > Float(0) ? curOffset : Float(0)
+
+            /* Past the full-swipe trigger, the destructive (or otherwise
+               edge-most) action takes over and expands to fill the entire
+               revealed width while the other actions shrink to zero. The
+               transition is animated to smooth out the moment of takeover. */
+            let trailingFullSwipeActive = allowsTrailingFullSwipe && revealedTrailingPx > rowWidthPx * swipeFullSwipeFraction
+            let leadingFullSwipeActive = allowsLeadingFullSwipe && revealedLeadingPx > rowWidthPx * swipeFullSwipeFraction
+            let trailingFullSwipeAnim = animateFloatAsState(targetValue: trailingFullSwipeActive ? Float(1) : Float(0)).value
+            let leadingFullSwipeAnim = animateFloatAsState(targetValue: leadingFullSwipeActive ? Float(1) : Float(0)).value
+
+            /* Reveal area sits beneath the row content. Buttons are sized to
+               share the row's current revealed (stretched) width. The primary
+               action (destructive if present, else the edge-most) absorbs all
+               additional width during full-swipe takeover; other buttons
+               proportionally shrink to zero. The direction guards ensure only
+               one edge's reveal renders at any non-zero offset. */
+            /* Two layout modes:
+               - Natural: revealedPx ≤ naturalRow. Each button sizes to its
+                 content (Modifier.widthIn(min:).wrapContentWidth()) so long
+                 labels never wrap. The row's wrapContentWidth captures the
+                 total via onSizeChanged for future use.
+               - Stretch: revealedPx > naturalRow. Row width = revealedPx;
+                 each button is wrapped in a weighted Box so they share the
+                 row's extra width proportionally. Full-swipe takeover pushes
+                 the primary action's weight up while the rest shrink to zero. */
+            let leadingUseStretch = leadingButtons.size > 0 && revealedLeadingPx > leadingNaturalPx + Float(1)
+            let trailingUseStretch = trailingButtons.size > 0 && revealedTrailingPx > trailingNaturalPx + Float(1)
+            let leadingCount = Float(leadingButtons.size)
+            let trailingCount = Float(trailingButtons.size)
+
+            if leadingButtons.size > 0 && curOffset >= Float(0) {
                 Box(modifier: Modifier.matchParentSize(), contentAlignment: androidx.compose.ui.Alignment.CenterStart) {
-                    Row(modifier: Modifier.fillMaxHeight().wrapContentWidth().onSizeChanged { leadingButtonsWidthPxState.value = Float($0.width) }) {
-                        for button in leadingButtons {
-                            RenderSwipeRevealButton(button: button, minWidthDp: minButtonWidthDp, context: context, onTap: {
-                                button.action()
-                                if button.role == ButtonRole.destructive, let onDestructiveDelete {
-                                    onDestructiveDelete()
+                    if leadingUseStretch {
+                        let rowWidthDp = with(density) { revealedLeadingPx.toDp() }
+                        Row(modifier: Modifier.fillMaxHeight().width(rowWidthDp)) {
+                            for button in leadingButtons {
+                                let isPrimary = button === leadingFullSwipeTarget
+                                let primaryWeight = Float(1) + (leadingCount - Float(1)) * leadingFullSwipeAnim
+                                let otherWeight = Float(1) - leadingFullSwipeAnim
+                                let weight = isPrimary ? primaryWeight : otherWeight
+                                if weight <= Float(0.01) {
+                                    continue
                                 }
-                                let from = offsetState.value
-                                if activeSwipeKey.value == rowKey {
-                                    activeSwipeKey.value = nil
+                                Box(modifier: Modifier.weight(weight).fillMaxHeight()) {
+                                    RenderSwipeRevealButton(button: button, sizeModifier: Modifier.fillMaxSize(), context: context, onTap: {
+                                        button.action()
+                                        if button.role == ButtonRole.destructive, let onDestructiveDelete {
+                                            onDestructiveDelete()
+                                        }
+                                        let from = offsetState.value
+                                        if activeSwipeKey.value == rowKey {
+                                            activeSwipeKey.value = nil
+                                        }
+                                        coroutineScope.launch {
+                                            animate(initialValue: from, targetValue: Float(0)) { value, _ in
+                                                offsetState.value = value
+                                            }
+                                        }
+                                    })
                                 }
-                                coroutineScope.launch {
-                                    animate(initialValue: from, targetValue: Float(0)) { value, _ in
-                                        offsetState.value = value
+                            }
+                        }
+                    } else {
+                        Row(modifier: Modifier.fillMaxHeight().wrapContentWidth().onSizeChanged { leadingNaturalState.value = Float($0.width) }) {
+                            for button in leadingButtons {
+                                RenderSwipeRevealButton(button: button, sizeModifier: Modifier.fillMaxHeight().widthIn(min: minButtonWidthDp), context: context, onTap: {
+                                    button.action()
+                                    if button.role == ButtonRole.destructive, let onDestructiveDelete {
+                                        onDestructiveDelete()
                                     }
-                                }
-                            })
+                                    let from = offsetState.value
+                                    if activeSwipeKey.value == rowKey {
+                                        activeSwipeKey.value = nil
+                                    }
+                                    coroutineScope.launch {
+                                        animate(initialValue: from, targetValue: Float(0)) { value, _ in
+                                            offsetState.value = value
+                                        }
+                                    }
+                                })
+                            }
                         }
                     }
                 }
             }
-            if trailingButtons.size > 0 && curOffsetForReveal <= Float(0) {
+            if trailingButtons.size > 0 && curOffset <= Float(0) {
                 Box(modifier: Modifier.matchParentSize(), contentAlignment: androidx.compose.ui.Alignment.CenterEnd) {
-                    Row(modifier: Modifier.fillMaxHeight().wrapContentWidth().onSizeChanged { trailingButtonsWidthPxState.value = Float($0.width) }) {
-                        for button in trailingButtons {
-                            RenderSwipeRevealButton(button: button, minWidthDp: minButtonWidthDp, context: context, onTap: {
-                                button.action()
-                                if button.role == ButtonRole.destructive, let onDestructiveDelete {
-                                    onDestructiveDelete()
+                    if trailingUseStretch {
+                        let rowWidthDp = with(density) { revealedTrailingPx.toDp() }
+                        Row(modifier: Modifier.fillMaxHeight().width(rowWidthDp)) {
+                            for button in trailingButtons {
+                                let isPrimary = button === trailingFullSwipeTarget
+                                let primaryWeight = Float(1) + (trailingCount - Float(1)) * trailingFullSwipeAnim
+                                let otherWeight = Float(1) - trailingFullSwipeAnim
+                                let weight = isPrimary ? primaryWeight : otherWeight
+                                if weight <= Float(0.01) {
+                                    continue
                                 }
-                                let from = offsetState.value
-                                if activeSwipeKey.value == rowKey {
-                                    activeSwipeKey.value = nil
+                                Box(modifier: Modifier.weight(weight).fillMaxHeight()) {
+                                    RenderSwipeRevealButton(button: button, sizeModifier: Modifier.fillMaxSize(), context: context, onTap: {
+                                        button.action()
+                                        if button.role == ButtonRole.destructive, let onDestructiveDelete {
+                                            onDestructiveDelete()
+                                        }
+                                        let from = offsetState.value
+                                        if activeSwipeKey.value == rowKey {
+                                            activeSwipeKey.value = nil
+                                        }
+                                        coroutineScope.launch {
+                                            animate(initialValue: from, targetValue: Float(0)) { value, _ in
+                                                offsetState.value = value
+                                            }
+                                        }
+                                    })
                                 }
-                                coroutineScope.launch {
-                                    animate(initialValue: from, targetValue: Float(0)) { value, _ in
-                                        offsetState.value = value
+                            }
+                        }
+                    } else {
+                        Row(modifier: Modifier.fillMaxHeight().wrapContentWidth().onSizeChanged { trailingNaturalState.value = Float($0.width) }) {
+                            for button in trailingButtons {
+                                RenderSwipeRevealButton(button: button, sizeModifier: Modifier.fillMaxHeight().widthIn(min: minButtonWidthDp), context: context, onTap: {
+                                    button.action()
+                                    if button.role == ButtonRole.destructive, let onDestructiveDelete {
+                                        onDestructiveDelete()
                                     }
-                                }
-                            })
+                                    let from = offsetState.value
+                                    if activeSwipeKey.value == rowKey {
+                                        activeSwipeKey.value = nil
+                                    }
+                                    coroutineScope.launch {
+                                        animate(initialValue: from, targetValue: Float(0)) { value, _ in
+                                            offsetState.value = value
+                                        }
+                                    }
+                                })
+                            }
                         }
                     }
                 }
@@ -873,10 +981,12 @@ public final class List : View, Renderable {
     }
 
     /// Render a single action button inside the swipe reveal area.
-    /// Width is dynamic — at least `minWidthDp` but grows to fit content
-    /// on a single line. Padding around the label keeps icon/text from
+    /// Sizing is supplied by the caller: in natural mode this is
+    /// widthIn(min:).fillMaxHeight() so the button hugs its label; in
+    /// stretch mode it's fillMaxSize() inside a weighted Box so the button
+    /// expands with the row. Padding around the label keeps icon/text from
     /// touching the cell edges.
-    @Composable private func RenderSwipeRevealButton(button: Button, minWidthDp: Dp, context: ComposeContext, onTap: () -> Void) {
+    @Composable private func RenderSwipeRevealButton(button: Button, sizeModifier: Modifier, context: ComposeContext, onTap: () -> Void) {
         let backgroundColor: androidx.compose.ui.graphics.Color
         let contentColor: androidx.compose.ui.graphics.Color
         if button.role == ButtonRole.destructive {
@@ -897,9 +1007,7 @@ public final class List : View, Renderable {
         }
         /* Render the user's label view (Text, Image, Label, or any custom
            composition) by composing it directly. */
-        Row(modifier: Modifier
-            .fillMaxHeight()
-            .widthIn(min: minWidthDp)
+        Row(modifier: sizeModifier
             .background(backgroundColor)
             .clickable(onClick: onTap)
             .padding(horizontal: 12.dp, vertical: 8.dp),

From e0841ee447590ee9139d5545a42b5b655f984578 Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Thu, 14 May 2026 17:15:16 -0700
Subject: [PATCH 18/19] swipeAction: Refactor to use AnchorDraggable

---
 Sources/SkipUI/SkipUI/Containers/List.swift | 305 +++++++++-----------
 1 file changed, 134 insertions(+), 171 deletions(-)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index 502eff20..94a42418 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -8,9 +8,14 @@ import androidx.compose.animation.core.animateFloatAsState
 import androidx.compose.animation.core.animate
 import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
+import androidx.compose.foundation.gestures.AnchoredDraggableState
+import androidx.compose.foundation.gestures.DraggableAnchors
 import androidx.compose.foundation.gestures.Orientation
-import androidx.compose.foundation.gestures.draggable
-import androidx.compose.foundation.gestures.rememberDraggableState
+import androidx.compose.foundation.gestures.anchoredDraggable
+import androidx.compose.foundation.gestures.animateTo
+import androidx.compose.foundation.gestures.snapTo
+import androidx.compose.animation.core.tween
+import androidx.compose.animation.core.exponentialDecay
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
@@ -23,6 +28,8 @@ import androidx.compose.foundation.layout.heightIn
 import androidx.compose.foundation.layout.offset
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.requiredHeightIn
+import androidx.compose.foundation.layout.IntrinsicSize
+import androidx.compose.foundation.layout.requiredWidth
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.layout.widthIn
 import androidx.compose.foundation.layout.wrapContentWidth
@@ -79,6 +86,18 @@ import struct CoreGraphics.CGFloat
 /// Corner radius for list sections.
 let listSectionCornerRadius = 8.0
 
+#if SKIP
+/// Discrete rest positions for a row's swipe gesture. Used as the value
+/// type for the row's AnchoredDraggableState.
+enum SwipeAnchor {
+    case closed
+    case leadingOpen
+    case leadingFull
+    case trailingOpen
+    case trailingFull
+}
+#endif
+
 // SKIP @bridge
 // SKIP INSERT: @Stable // Otherwise Compose recomposes all internal @Composable funcs because 'this' is unstable
 public final class List : View, Renderable {
@@ -630,27 +649,77 @@ public final class List : View, Renderable {
         let density = LocalDensity.current
         let minButtonWidthPx = with(density) { minButtonWidthDp.toPx() }
 
-        /* Single source of truth for the foreground row's horizontal offset.
-           Updated synchronously in the drag callback (no coroutine race) and
-           driven by the top-level `animate(...)` suspend during the snap-back. */
-        let offsetState = remember { mutableFloatStateOf(Float(0)) }
+        /* AnchoredDraggableState owns the horizontal offset and runs both the
+           live drag and the snap-back animation. Anchors are populated below
+           via updateAnchors once the row width has been measured; until then
+           the state has only the .closed anchor at 0f so it behaves as a
+           no-op draggable. */
+        let velocityThresholdPx = with(density) { 125.dp.toPx() }
+        let anchoredState = remember {
+            AnchoredDraggableState<SwipeAnchor>(
+                initialValue: SwipeAnchor.closed,
+                positionalThreshold: { distance in distance * Float(0.5) },
+                velocityThreshold: { velocityThresholdPx },
+                snapAnimationSpec: tween(durationMillis: 300),
+                decayAnimationSpec: exponentialDecay<Float>()
+            )
+        }
         let rowWidthPxState = remember { mutableFloatStateOf(Float(0)) }
         /* Natural (content-sized) buttons-row width per edge, captured via
            onSizeChanged when the reveal is in natural-layout mode. Defaults
-           to count × minButtonWidth until the first measurement lands; that
-           fallback keeps the open-anchor non-zero on the very first gesture. */
+           to count × minButtonWidth until the first measurement lands. */
         let trailingNaturalState = remember { mutableFloatStateOf(Float(0)) }
         let leadingNaturalState = remember { mutableFloatStateOf(Float(0)) }
 
-        /* When a *different* row's swipe opens, this LaunchedEffect observes
-           the shared activeSwipeKey and animates this row closed. Matches
-           iOS list behavior of one open swipe at a time. */
+        /* When a *different* row's swipe opens, animate this row closed.
+           Matches iOS list behavior of one open swipe at a time. */
         let currentlyOpen = activeSwipeKey.value
         LaunchedEffect(currentlyOpen) {
-            if currentlyOpen != rowKey && offsetState.value != Float(0) {
-                let from = offsetState.value
-                animate(initialValue: from, targetValue: Float(0)) { value, _ in
-                    offsetState.value = value
+            if currentlyOpen != rowKey && anchoredState.currentValue != SwipeAnchor.closed {
+                anchoredState.animateTo(SwipeAnchor.closed)
+            }
+        }
+
+        /* Sync activeSwipeKey from this row's currentValue: when the user
+           commits to an open anchor we register ourselves so siblings close;
+           when we settle back to closed we clear the key. */
+        LaunchedEffect(anchoredState.currentValue) {
+            let cur = anchoredState.currentValue
+            if cur == SwipeAnchor.closed {
+                if activeSwipeKey.value == rowKey {
+                    activeSwipeKey.value = nil
+                }
+            } else if cur != SwipeAnchor.trailingFull && cur != SwipeAnchor.leadingFull {
+                activeSwipeKey.value = rowKey
+            }
+        }
+
+        /* When the row actually settles on a full-swipe anchor, fire the
+           primary action (and optional auto-delete for destructive), then
+           snap back to closed. */
+        LaunchedEffect(anchoredState.settledValue) {
+            let settled = anchoredState.settledValue
+            if settled == SwipeAnchor.trailingFull {
+                if let action = trailingFullSwipeTarget?.action {
+                    action()
+                }
+                if trailingFullSwipeTarget?.role == ButtonRole.destructive, let onDestructiveDelete {
+                    onDestructiveDelete()
+                }
+                anchoredState.snapTo(SwipeAnchor.closed)
+                if activeSwipeKey.value == rowKey {
+                    activeSwipeKey.value = nil
+                }
+            } else if settled == SwipeAnchor.leadingFull {
+                if let action = leadingFullSwipeTarget?.action {
+                    action()
+                }
+                if leadingFullSwipeTarget?.role == ButtonRole.destructive, let onDestructiveDelete {
+                    onDestructiveDelete()
+                }
+                anchoredState.snapTo(SwipeAnchor.closed)
+                if activeSwipeKey.value == rowKey {
+                    activeSwipeKey.value = nil
                 }
             }
         }
@@ -668,16 +737,13 @@ public final class List : View, Renderable {
             let leadingNaturalPx = leadingNaturalState.value > Float(0) ? leadingNaturalState.value : leadingNaturalFallback
             let trailingOpenPx = -trailingNaturalPx
             let leadingOpenPx = leadingNaturalPx
-            let trailingFullPx = -rowWidthPx
-            let leadingFullPx = rowWidthPx
-            let minOffsetPx = trailingButtons.size > 0 ? trailingFullPx : Float(0)
-            let maxOffsetPx = leadingButtons.size > 0 ? leadingFullPx : Float(0)
 
             /* Current revealed width per edge (positive). When the user drags
                further than the natural buttons-row width, the reveal area
                stretches: the row's width follows the foreground so the
                buttons grow to track the row edge instead of leaving a gap. */
-            let curOffset = offsetState.value
+            let rawOffset = anchoredState.offset
+            let curOffset: Float = rawOffset.isNaN() ? Float(0) : rawOffset
             let revealedTrailingPx = curOffset < Float(0) ? -curOffset : Float(0)
             let revealedLeadingPx = curOffset > Float(0) ? curOffset : Float(0)
 
@@ -729,14 +795,8 @@ public final class List : View, Renderable {
                                         if button.role == ButtonRole.destructive, let onDestructiveDelete {
                                             onDestructiveDelete()
                                         }
-                                        let from = offsetState.value
-                                        if activeSwipeKey.value == rowKey {
-                                            activeSwipeKey.value = nil
-                                        }
                                         coroutineScope.launch {
-                                            animate(initialValue: from, targetValue: Float(0)) { value, _ in
-                                                offsetState.value = value
-                                            }
+                                            anchoredState.animateTo(SwipeAnchor.closed)
                                         }
                                     })
                                 }
@@ -750,14 +810,8 @@ public final class List : View, Renderable {
                                     if button.role == ButtonRole.destructive, let onDestructiveDelete {
                                         onDestructiveDelete()
                                     }
-                                    let from = offsetState.value
-                                    if activeSwipeKey.value == rowKey {
-                                        activeSwipeKey.value = nil
-                                    }
                                     coroutineScope.launch {
-                                        animate(initialValue: from, targetValue: Float(0)) { value, _ in
-                                            offsetState.value = value
-                                        }
+                                        anchoredState.animateTo(SwipeAnchor.closed)
                                     }
                                 })
                             }
@@ -784,14 +838,8 @@ public final class List : View, Renderable {
                                         if button.role == ButtonRole.destructive, let onDestructiveDelete {
                                             onDestructiveDelete()
                                         }
-                                        let from = offsetState.value
-                                        if activeSwipeKey.value == rowKey {
-                                            activeSwipeKey.value = nil
-                                        }
                                         coroutineScope.launch {
-                                            animate(initialValue: from, targetValue: Float(0)) { value, _ in
-                                                offsetState.value = value
-                                            }
+                                            anchoredState.animateTo(SwipeAnchor.closed)
                                         }
                                     })
                                 }
@@ -805,14 +853,8 @@ public final class List : View, Renderable {
                                     if button.role == ButtonRole.destructive, let onDestructiveDelete {
                                         onDestructiveDelete()
                                     }
-                                    let from = offsetState.value
-                                    if activeSwipeKey.value == rowKey {
-                                        activeSwipeKey.value = nil
-                                    }
                                     coroutineScope.launch {
-                                        animate(initialValue: from, targetValue: Float(0)) { value, _ in
-                                            offsetState.value = value
-                                        }
+                                        anchoredState.animateTo(SwipeAnchor.closed)
                                     }
                                 })
                             }
@@ -836,136 +878,45 @@ public final class List : View, Renderable {
              so a fast flick alone can't trigger the destructive action.
              */
 
-            /* Captures the offset at the moment a new drag begins. If the row
-               is already open in one direction, we constrain the gesture to
-               that direction's range so swiping back past zero closes the row
-               without opening the opposite-edge actions. */
-            let dragStartOffset = remember { mutableFloatStateOf(Float(0)) }
-
-            let dragState = rememberDraggableState { delta in
-                let start = dragStartOffset.value
-                let dragMin: Float
-                let dragMax: Float
-                if start < Float(0) {
-                    dragMin = minOffsetPx
-                    dragMax = Float(0)
-                } else if start > Float(0) {
-                    dragMin = Float(0)
-                    dragMax = maxOffsetPx
-                } else {
-                    dragMin = minOffsetPx
-                    dragMax = maxOffsetPx
-                }
-                offsetState.value = (offsetState.value + delta).coerceIn(dragMin, dragMax)
+            /* Anchor refresh: rebuilt whenever the measured sizes or
+               allowsXxxFullSwipe flags change. Anchors are defined via
+               Compose's DraggableAnchors DSL inside a SKIP INSERT block
+               because Skip's transpiler doesn't model Kotlin lambdas with
+               receiver-type extensions like `T.at(Float)`. */
+            LaunchedEffect(rowWidthPx, trailingNaturalPx, leadingNaturalPx, allowsTrailingFullSwipe, allowsLeadingFullSwipe, trailingButtons.size, leadingButtons.size) {
+                let hasTrailing = trailingButtons.size > 0
+                let hasLeading = leadingButtons.size > 0
+                let trailingOpenPos = -trailingNaturalPx
+                let leadingOpenPos = leadingNaturalPx
+                let trailingFullPos = -rowWidthPx
+                let leadingFullPos = rowWidthPx
+                // SKIP INSERT: val newAnchors = androidx.compose.foundation.gestures.DraggableAnchors<skip.ui.SwipeAnchor> {
+                // SKIP INSERT:     skip.ui.SwipeAnchor.closed at 0f
+                // SKIP INSERT:     if (hasTrailing) skip.ui.SwipeAnchor.trailingOpen at trailingOpenPos
+                // SKIP INSERT:     if (allowsTrailingFullSwipe) skip.ui.SwipeAnchor.trailingFull at trailingFullPos
+                // SKIP INSERT:     if (hasLeading) skip.ui.SwipeAnchor.leadingOpen at leadingOpenPos
+                // SKIP INSERT:     if (allowsLeadingFullSwipe) skip.ui.SwipeAnchor.leadingFull at leadingFullPos
+                // SKIP INSERT: }
+                // SKIP INSERT: anchoredState.updateAnchors(newAnchors)
             }
             Box(modifier: Modifier
                 .fillMaxWidth()
-                .offset { IntOffset(offsetState.value.toInt(), 0) }
-                .draggable(state: dragState, orientation: Orientation.Horizontal, onDragStarted: { _ in
-                    dragStartOffset.value = offsetState.value
-                }, onDragStopped: { velocity in
-                    let cur = offsetState.value
-                    /* Apply the same direction constraint as the drag callback
-                       so a hard flick past zero from an open state can't
-                       project into the opposite-edge anchor — it snaps closed. */
-                    let start = dragStartOffset.value
-                    let projMin: Float
-                    let projMax: Float
-                    if start < Float(0) {
-                        projMin = minOffsetPx
-                        projMax = Float(0)
-                    } else if start > Float(0) {
-                        projMin = Float(0)
-                        projMax = maxOffsetPx
-                    } else {
-                        projMin = minOffsetPx
-                        projMax = maxOffsetPx
-                    }
-                    let projected = (cur + velocity * swipeVelocityProjectionSeconds).coerceIn(projMin, projMax)
-
-                    /* Build the candidate anchor set: always closed; add the
-                       same-side open anchor only if the gesture didn't start
-                       on the opposite side. */
-                    let anchors: kotlin.collections.MutableList<Float> = mutableListOf(Float(0))
-                    if trailingButtons.size > 0 && start <= Float(0) {
-                        anchors.add(trailingOpenPx)
-                    }
-                    if leadingButtons.size > 0 && start >= Float(0) {
-                        anchors.add(leadingOpenPx)
-                    }
-
-                    var target: Float = anchors[0]
-                    let firstDelta = anchors[0] - projected
-                    var minDist: Float = firstDelta < Float(0) ? -firstDelta : firstDelta
-                    for anchor in anchors {
-                        let delta = anchor - projected
-                        let dist: Float = delta < Float(0) ? -delta : delta
-                        if dist < minDist {
-                            minDist = dist
-                            target = anchor
-                        }
-                    }
-
-                    /* Escalate to the full-swipe anchor if the projected
-                       position has crossed half the row width past its open
-                       anchor — this is what fires the destructive action. */
-                    var fullSwipeAction: (() -> Void)? = nil
-                    var firedDestructive = false
-                    if allowsTrailingFullSwipe && target == trailingOpenPx && -cur > rowWidthPx * swipeFullSwipeFraction {
-                        target = trailingFullPx
-                        fullSwipeAction = trailingFullSwipeTarget?.action
-                        firedDestructive = trailingFullSwipeTarget?.role == ButtonRole.destructive
-                    } else if allowsLeadingFullSwipe && target == leadingOpenPx && cur > rowWidthPx * swipeFullSwipeFraction {
-                        target = leadingFullPx
-                        fullSwipeAction = leadingFullSwipeTarget?.action
-                        firedDestructive = leadingFullSwipeTarget?.role == ButtonRole.destructive
-                    }
-
-                    /* Update the shared "active swipe" key BEFORE animating —
-                       sibling rows observe the change immediately and start
-                       their own close animation in parallel. */
-                    if target == Float(0) {
-                        if activeSwipeKey.value == rowKey {
-                            activeSwipeKey.value = nil
-                        }
-                    } else {
-                        activeSwipeKey.value = rowKey
-                    }
-
-                    /* animate(...) is a top-level Compose suspend that drives
-                       the value through the AnimationSpec frame by frame and
-                       hands us each value via the trailing block. Running it
-                       here — inside onDragStopped's own suspend coroutine —
-                       means the next gesture (which cancels this coroutine)
-                       simply interrupts the animation cleanly. There is no
-                       shared Animatable for stale snapTo calls to step on. */
-                    animate(initialValue: cur, targetValue: target, initialVelocity: velocity) { value, _ in
-                        offsetState.value = value
-                    }
-                    if let fullSwipeAction {
-                        fullSwipeAction()
-                        /* For a destructive full-swipe also remove the row
-                           from the underlying data so LazyColumn collapses
-                           it visually (matches iOS). Skipped for non-
-                           destructive full-swipes — those just bounce back. */
-                        if firedDestructive, let onDestructiveDelete {
-                            onDestructiveDelete()
-                        }
-                        offsetState.value = Float(0)
-                        if activeSwipeKey.value == rowKey {
-                            activeSwipeKey.value = nil
-                        }
-                    }
-                })
+                .offset {
+                    let o = anchoredState.offset
+                    IntOffset(o.isNaN() ? 0 : o.toInt(), 0)
+                }
+                .anchoredDraggable(state: anchoredState, orientation: Orientation.Horizontal)
             ) {
                 RenderItem(content: content, level: level, context: context, styling: styling)
                 /* Subtle scrim that intensifies with swipe progress so the row
                    visually recedes as actions appear.*/
-                let curAbs = offsetState.value < Float(0) ? -offsetState.value : offsetState.value
+                let rawScrimOffset = anchoredState.offset
+                let scrimOffset: Float = rawScrimOffset.isNaN() ? Float(0) : rawScrimOffset
+                let curAbs = scrimOffset < Float(0) ? -scrimOffset : scrimOffset
                 let openMag: Float
-                if offsetState.value < Float(0) {
+                if scrimOffset < Float(0) {
                     openMag = -trailingOpenPx
-                } else if offsetState.value > Float(0) {
+                } else if scrimOffset > Float(0) {
                     openMag = leadingOpenPx
                 } else {
                     openMag = Float(1) // unused; progress stays 0
@@ -1006,8 +957,13 @@ public final class List : View, Renderable {
             }
         }
         /* Render the user's label view (Text, Image, Label, or any custom
-           composition) by composing it directly. */
+           composition). clipToBounds on the button means the label can
+           safely use Modifier.width(IntrinsicSize.Max) — Text stays on one
+           line at its intrinsic width and any overflow is clipped instead
+           of wrapping mid-animation when full-swipe takeover squeezes a
+           non-primary button's width below the natural content width. */
         Row(modifier: sizeModifier
+            .clipToBounds()
             .background(backgroundColor)
             .clickable(onClick: onTap)
             .padding(horizontal: 12.dp, vertical: 8.dp),
@@ -1022,7 +978,14 @@ public final class List : View, Renderable {
                    through environment(\.font, ...). Setting the font property
                    on EnvironmentValues directly isn't exposed as a Kotlin
                    setter by Skip's transpilation. */
-                button.label.font(Font.footnote).Compose(context: context.content())
+                /* requiredWidth(IntrinsicSize.Max) overrides parent's max
+                   width constraint so Text always lays out at its one-line
+                   intrinsic width. An extra 8dp horizontal pad gives a tiny
+                   measurement headroom so subpixel rounding can't trigger
+                   a one-line→two-line→one-line flicker during the
+                   takeover animation. The button Row's clipToBounds
+                   clips the resulting overflow visually. */
+                button.label.font(Font.footnote).Compose(context: context.content(modifier: Modifier.requiredWidth(IntrinsicSize.Max).padding(horizontal: 4.dp)))
             }
         }
     }

From 150419bd1cbd849cc4cb55f7a334d9e24a58a848 Mon Sep 17 00:00:00 2001
From: Adedeji Toki <adedeji.toki@outlook.com>
Date: Thu, 14 May 2026 18:29:02 -0700
Subject: [PATCH 19/19] swipeActions: propagate tint color from button config

---
 Sources/SkipUI/SkipUI/Containers/List.swift | 79 ++++++++++++++++-----
 1 file changed, 60 insertions(+), 19 deletions(-)

diff --git a/Sources/SkipUI/SkipUI/Containers/List.swift b/Sources/SkipUI/SkipUI/Containers/List.swift
index 94a42418..6dff6c10 100644
--- a/Sources/SkipUI/SkipUI/Containers/List.swift
+++ b/Sources/SkipUI/SkipUI/Containers/List.swift
@@ -609,12 +609,37 @@ public final class List : View, Renderable {
     @Composable private func RenderSwipeableItem(content: Renderable, level: Int, context: ComposeContext, modifier: Modifier, styling: ListStyling, leadingConfig: SwipeActionsConfig?, trailingConfig: SwipeActionsConfig?, rowKey: String, activeSwipeKey: MutableState<String?>, onDestructiveDelete: (() -> Void)? = nil) {
         let coroutineScope = rememberCoroutineScope()
 
-        let trailingButtonsRaw: kotlin.collections.List<Button> = (trailingConfig?.content.Evaluate(context: context, options: 0) ?? listOf()).mapNotNull {
-            $0.strip() as? Button
+        /* Extract Buttons and per-button .tint(_:) values from each edge's
+           rendered content. .tint() is implemented as an env modifier with
+           affectsEvaluate=false, so it wraps the Button via ModifiedContent
+           but doesn't appear in the EnvironmentValues during Evaluate. We
+           walk each renderable's modifier chain, run any EnvironmentModifier
+           actions in a scoped env, and capture the resulting _tint. The
+           innermost matching modifier wins (matches SwiftUI). */
+        let trailingRenderables = trailingConfig?.content.Evaluate(context: context, options: 0) ?? listOf()
+        let leadingRenderables = leadingConfig?.content.Evaluate(context: context, options: 0) ?? listOf()
+        let trailingTintMap: kotlin.collections.MutableMap<Button, Color> = mutableMapOf()
+        let leadingTintMap: kotlin.collections.MutableMap<Button, Color> = mutableMapOf()
+        let trailingButtonsRawMutable: kotlin.collections.MutableList<Button> = mutableListOf()
+        for renderable in trailingRenderables {
+            if let button = renderable.strip() as? Button {
+                trailingButtonsRawMutable.add(button)
+                if let tint = ExtractEnvironmentTint(from: renderable) {
+                    trailingTintMap[button] = tint
+                }
+            }
         }
-        let leadingButtonsRaw: kotlin.collections.List<Button> = (leadingConfig?.content.Evaluate(context: context, options: 0) ?? listOf()).mapNotNull {
-            $0.strip() as? Button
+        let leadingButtonsRawMutable: kotlin.collections.MutableList<Button> = mutableListOf()
+        for renderable in leadingRenderables {
+            if let button = renderable.strip() as? Button {
+                leadingButtonsRawMutable.add(button)
+                if let tint = ExtractEnvironmentTint(from: renderable) {
+                    leadingTintMap[button] = tint
+                }
+            }
         }
+        let trailingButtonsRaw: kotlin.collections.List<Button> = trailingButtonsRawMutable
+        let leadingButtonsRaw: kotlin.collections.List<Button> = leadingButtonsRawMutable
         /* iOS reorders .destructive Buttons to the swipe-from edge regardless
            of the order they were declared in. For trailing swipes that means
            pinned to the right (last in the Row laid out with Arrangement.End);
@@ -762,15 +787,6 @@ public final class List : View, Renderable {
                additional width during full-swipe takeover; other buttons
                proportionally shrink to zero. The direction guards ensure only
                one edge's reveal renders at any non-zero offset. */
-            /* Two layout modes:
-               - Natural: revealedPx ≤ naturalRow. Each button sizes to its
-                 content (Modifier.widthIn(min:).wrapContentWidth()) so long
-                 labels never wrap. The row's wrapContentWidth captures the
-                 total via onSizeChanged for future use.
-               - Stretch: revealedPx > naturalRow. Row width = revealedPx;
-                 each button is wrapped in a weighted Box so they share the
-                 row's extra width proportionally. Full-swipe takeover pushes
-                 the primary action's weight up while the rest shrink to zero. */
             let leadingUseStretch = leadingButtons.size > 0 && revealedLeadingPx > leadingNaturalPx + Float(1)
             let trailingUseStretch = trailingButtons.size > 0 && revealedTrailingPx > trailingNaturalPx + Float(1)
             let leadingCount = Float(leadingButtons.size)
@@ -790,7 +806,7 @@ public final class List : View, Renderable {
                                     continue
                                 }
                                 Box(modifier: Modifier.weight(weight).fillMaxHeight()) {
-                                    RenderSwipeRevealButton(button: button, sizeModifier: Modifier.fillMaxSize(), context: context, onTap: {
+                                    RenderSwipeRevealButton(button: button, sizeModifier: Modifier.fillMaxSize(), context: context, tintOverride: leadingTintMap[button], onTap: {
                                         button.action()
                                         if button.role == ButtonRole.destructive, let onDestructiveDelete {
                                             onDestructiveDelete()
@@ -805,7 +821,7 @@ public final class List : View, Renderable {
                     } else {
                         Row(modifier: Modifier.fillMaxHeight().wrapContentWidth().onSizeChanged { leadingNaturalState.value = Float($0.width) }) {
                             for button in leadingButtons {
-                                RenderSwipeRevealButton(button: button, sizeModifier: Modifier.fillMaxHeight().widthIn(min: minButtonWidthDp), context: context, onTap: {
+                                RenderSwipeRevealButton(button: button, sizeModifier: Modifier.fillMaxHeight().widthIn(min: minButtonWidthDp), context: context, tintOverride: leadingTintMap[button], onTap: {
                                     button.action()
                                     if button.role == ButtonRole.destructive, let onDestructiveDelete {
                                         onDestructiveDelete()
@@ -833,7 +849,7 @@ public final class List : View, Renderable {
                                     continue
                                 }
                                 Box(modifier: Modifier.weight(weight).fillMaxHeight()) {
-                                    RenderSwipeRevealButton(button: button, sizeModifier: Modifier.fillMaxSize(), context: context, onTap: {
+                                    RenderSwipeRevealButton(button: button, sizeModifier: Modifier.fillMaxSize(), context: context, tintOverride: trailingTintMap[button], onTap: {
                                         button.action()
                                         if button.role == ButtonRole.destructive, let onDestructiveDelete {
                                             onDestructiveDelete()
@@ -848,7 +864,7 @@ public final class List : View, Renderable {
                     } else {
                         Row(modifier: Modifier.fillMaxHeight().wrapContentWidth().onSizeChanged { trailingNaturalState.value = Float($0.width) }) {
                             for button in trailingButtons {
-                                RenderSwipeRevealButton(button: button, sizeModifier: Modifier.fillMaxHeight().widthIn(min: minButtonWidthDp), context: context, onTap: {
+                                RenderSwipeRevealButton(button: button, sizeModifier: Modifier.fillMaxHeight().widthIn(min: minButtonWidthDp), context: context, tintOverride: trailingTintMap[button], onTap: {
                                     button.action()
                                     if button.role == ButtonRole.destructive, let onDestructiveDelete {
                                         onDestructiveDelete()
@@ -931,13 +947,37 @@ public final class List : View, Renderable {
         }
     }
 
+    /// Walk the renderable's ModifiedContent chain, run any
+    /// EnvironmentModifier action in a scoped EnvironmentValues, and
+    /// return whatever ._tint it sets. We walk manually (instead of
+    /// forEachModifier) because the action is @Composable and so is
+    /// setValuesWithReturn — both must be invoked from a @Composable
+    /// scope, which forEachModifier's plain callback isn't. Outermost
+    /// modifier processed first so the innermost wins (matches SwiftUI).
+    @Composable private func ExtractEnvironmentTint(from renderable: Renderable) -> Color? {
+        var captured: Color? = nil
+        var current: Renderable? = renderable
+        while let mod = current as? ModifiedContent {
+            if let envMod = mod.modifier as? EnvironmentModifier, let action = envMod.action {
+                let scoped: Color? = EnvironmentValues.shared.setValuesWithReturn(action) {
+                    return EnvironmentValues.shared._tint
+                }
+                if scoped != nil {
+                    captured = scoped
+                }
+            }
+            current = mod.renderable
+        }
+        return captured
+    }
+
     /// Render a single action button inside the swipe reveal area.
     /// Sizing is supplied by the caller: in natural mode this is
     /// widthIn(min:).fillMaxHeight() so the button hugs its label; in
     /// stretch mode it's fillMaxSize() inside a weighted Box so the button
     /// expands with the row. Padding around the label keeps icon/text from
     /// touching the cell edges.
-    @Composable private func RenderSwipeRevealButton(button: Button, sizeModifier: Modifier, context: ComposeContext, onTap: () -> Void) {
+    @Composable private func RenderSwipeRevealButton(button: Button, sizeModifier: Modifier, context: ComposeContext, tintOverride: Color? = nil, onTap: () -> Void) {
         let backgroundColor: androidx.compose.ui.graphics.Color
         let contentColor: androidx.compose.ui.graphics.Color
         if button.role == ButtonRole.destructive {
@@ -947,7 +987,8 @@ public final class List : View, Renderable {
             backgroundColor = androidx.compose.ui.graphics.Color.Red
             contentColor = androidx.compose.ui.graphics.Color.White
         } else {
-            let tint = EnvironmentValues.shared._tint?.colorImpl()
+            /* Per-button .tint(_:) wins over the surrounding env tint. */
+            let tint = (tintOverride ?? EnvironmentValues.shared._tint)?.colorImpl()
             if let tint {
                 backgroundColor = tint
                 contentColor = androidx.compose.ui.graphics.Color.White