Im trying to use the ScrollableTabRow with Tab from Material Compose, but a shadow comes under the unselected tabs. how to remove this..?

Attaching Preview screenshot and code for reference.​

Preview Screenshot

@Composable
fun ScrollableTabView(currentSelectedTabIndex: Int, titles: List<String>, onClick: (Int) -> Unit) {
    ScrollableTabRow(
        selectedTabIndex = currentSelectedTabIndex,
        backgroundColor = MyColors.TabColor,
        contentColor = MaterialTheme.colors.primary,
        edgePadding = 0.dp
    ) {
        titles.forEachIndexed { index, title ->
            Tab(text = {
                Text(
                    title,
                    style = MyTypography.tabStyle,
                    fontWeight = if (currentSelectedTabIndex == index) FontWeight.Bold else FontWeight.Normal
                )
            },
                selected = currentSelectedTabIndex == index,
                selectedContentColor = MaterialTheme.colors.primary,
                unselectedContentColor = MyColors.lightText,
                onClick = {
                    onClick(index)
                })
        }
    }
}


@Preview
@Composable
fun ScrollableTabView() {
    MaterialTheme {
        ScrollableTabView(currentSelectedTabIndex = 0, titles = listOf("Tab 1","Tab 2","Tab 3")) {}
    }
}

Material Compose version : 1.3.1 (Latest)

CodePudding user response：

set divider param of ScrollableTabRow as divider={}. Default one is

divider: @Composable @UiComposable () -> Unit = @Composable { TabRowDefaults.Divider() },