Actions

SwipeActions

Buttons revealed by swiping a list row.

iOSSwiftUI swipeActionsAndroidAnchored drag (kara)Renders in a Screen or an Island

iOSSwiftUI swipeActions

AndroidAnchored drag (kara)

Import

import {SwipeActions} from '@hzblj/kara-ui'

Props

A list row with buttons behind it, uncovered by a swipe — SwiftUI's swipeActions on iOS, and on Android, where Compose has none, kara's own: the row slides on an anchored drag and the buttons show in the strip it leaves. One row is open at a time on both; a tap on an open row closes it. A native organism — it belongs inside a List.

Prop	Type	Default	Description
children*	ReactNode	—	The row.
allowsFullSwipe	boolean	iOS true	iOS: a swipe all the way across performs the edge's first action, as in Mail. Android has no full swipe. `true` by default, as in SwiftUI.
leading	SwipeAction[]	[]	The buttons at the leading edge, uncovered by a swipe toward the trailing one. The first sits outermost.
testID	string	—	Test identifier. iOS: on the row. Android: the row is a Compose node, reach it by its content.
trailing	SwipeAction[]	[]	The buttons at the trailing edge, uncovered by a swipe toward the leading one. The first sits outermost.

children*

ReactNode

The row.

allowsFullSwipeiOS true

boolean

iOS: a swipe all the way across performs the edge's first action, as in Mail. Android has no full swipe. true by default, as in SwiftUI.

leading[]

SwipeAction[]

The buttons at the leading edge, uncovered by a swipe toward the trailing one. The first sits outermost.

testID

string

Test identifier. iOS: on the row. Android: the row is a Compose node, reach it by its content.

trailing[]

SwipeAction[]

The buttons at the trailing edge, uncovered by a swipe toward the leading one. The first sits outermost.

SwipeAction

One button a swiped row uncovers.

Prop	Type	Description
icon*	IconName	One of the app's icons, on the button — a round one on iOS 26, as in Mail, a filled stadium on Android.
label*	string	The action's name, written under the button — before iOS 26 a row of the usual height shows the icon alone and keeps the label for VoiceOver. Actions are keyed by it, so keep labels unique within one row.
onPress*	() => void	Called when the button is pressed. The row closes by itself.
destructive	boolean	Fills the button with `fill.destructive.primary` unless `tint` says otherwise.
tint	ColorToken	The button's fill — `fill.destructive.primary` for a destructive action, `fill.accent.primary` otherwise. The icon on it is white, so pick a fill that holds white in both appearances.

icon*

IconName

One of the app's icons, on the button — a round one on iOS 26, as in Mail, a filled stadium on Android.

label*

string

The action's name, written under the button — before iOS 26 a row of the usual height shows the icon alone and keeps the label for VoiceOver. Actions are keyed by it, so keep labels unique within one row.

onPress*

() => void

Called when the button is pressed. The row closes by itself.

destructive

boolean

Fills the button with fill.destructive.primary unless tint says otherwise.

tint

ColorToken

The button's fill — fill.destructive.primary for a destructive action, fill.accent.primary otherwise. The icon on it is white, so pick a fill that holds white in both appearances.

Platform notes

A row of a List: SwiftUI only offers swipe actions there.
iOS 26 draws each action as a round button in its tint with the label under it, the way Mail does. Compose has no swipe actions, so Android has kara’s own: the row slides on an anchored drag, and filled icon buttons with their labels under them show in the strip it leaves.
One row is open at a time, and a tap on an open row closes it. A press closes the row before the action runs.
allowsFullSwipe (on by default) runs the edge’s first action on a swipe all the way across — iOS only.