Connected
A headless vertically connected list-item layout (Structure layer).
Each item fills the full available width. Outline edges and corner radii are computed automatically from each item's index: the first item rounds only its top corners, the last item rounds only its bottom corners, and middle items have square corners with shared horizontal outlines. The actual rendering is delegated to the listItem lambda, which receives the pre-computed connection geometry.
This component makes no visual or interactive decisions — no colors, elevation, or animation. It is the headless backbone that the Stylish Finish counterpart StylishConnectedListItemColumn consumes by supplying a styled listItem. Supply your own listItem to render a custom skin over the same connected geometry.
Parameters
The list of StylishConnectedListItem data objects describing each item.
The vertical gap between adjacent items. Defaults to StylishTheme.dimensions.connectedSpacing (3 dp).
The radius applied to the outer corners. Defaults to StylishTheme.dimensions.connectedCornerRadius (12 dp).
A composable lambda that renders a single item. Receives the item data, a modifier (fill-max-width), the connected Shape, the outline ConnectedEdges, and the outline ConnectedCorners.