How can I add an animation to an item when it is selected in a LazyRow or Column in Jetpack Conpose?

Question

I am trying to make it so that the item in a LazyRow clips to the center of the screen, and if it is in the center is becomes larger while the items next to it return to the original size. Below is an example

LazyRow with Infinite scrolling and snapper

@OptIn(ExperimentalSnapperApi::class)
@Composable

fun CircularList(
    data: List<SingleBox>,
    modifier: Modifier = Modifier,
    isEndless: Boolean = true
) {
    val listState = rememberLazyListState(
        if (isEndless) Int.MAX_VALUE / 2 else 0
    )

    val configuration = LocalConfiguration.current
    val itemDimensions = ItemDimensions()
    val screenWidth = configuration.screenWidthDp.dp
    val contentPadding = PaddingValues(start = screenWidth/2 - (itemDimensions.itemWidth/2)) //Start item in center

    BoxWithConstraints {
        LazyRow(
            state = listState,
            modifier = modifier,
            contentPadding = contentPadding,
            flingBehavior = rememberSnapperFlingBehavior(listState, SnapOffsets.Start, snapIndex = { _, startIndex, targetIndex ->
                targetIndex.coerceIn(startIndex - 7, startIndex + 7) //snaps item into the center of the screen
            }),

        ) {
            items(
                count = if (isEndless) Int.MAX_VALUE else data.size,
                itemContent = {
                    val index = it % data.size
                    CustomItem(data[index])    // item composable

                },

            )
        }

    }
}