PillGroupItem

import androidx.compose.foundation.isSystemInDarkTheme
import androidx.compose.foundation.layout.*
import androidx.compose.runtime.*
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.tooling.preview.Preview
import net.ikea.skapa.R
import net.ikea.skapa.foundation.*
import net.ikea.skapa.ui.components.Button
import net.ikea.skapa.ui.components.PillGroup
import net.ikea.skapa.ui.components.PillGroupItem
import net.ikea.skapa.ui.components.PillGroupState
import net.ikea.skapa.ui.components.PillLeadingItem.Icon
import net.ikea.skapa.ui.components.PillLeadingItem.Thumbnail

fun main() { 
   //sampleStart 
   SkapaTheme2(isSystemInDarkTheme()) {
    val items = listOf(
        PillGroupItem(null, "Functionality", true),
        PillGroupItem(
            key = null,
            label = "John Doe",
            selected = true,
            leadingItem = Thumbnail(painterResource(R.drawable.ic_image_fallback_image))
        ),
        PillGroupItem(key = null, label = "Pet-friendly", trailingIconId = R.drawable.ic_image_fallback_image),
        PillGroupItem(null, "Accessibility"),
        PillGroupItem(key = null, label = "Design", leadingItem = Icon(R.drawable.ic_image_fallback_image))
    ).toMutableStateList()

    var pillGroupState by remember { mutableStateOf(PillGroupState.Collapsed) }
    val maxVisibleItems = 3

    Column {
        PillGroup(
            items = items,
            maxVisibleItems = maxVisibleItems,
            // Provide localized text for the show more button
            expandedButtonLabel = "${items.size - maxVisibleItems} more...",
            state = pillGroupState,
            onStateChanged = { newState ->
                // Do something when state change
                pillGroupState = newState
            },
            onClickItem = { index, item ->
                // Do something Item Click
                items[index] = item.deepCopy(selected = !item.selected)
            }
        )
        // Offer a way back to the collapsed state
        if (pillGroupState == PillGroupState.Expanded) {
            Button(label = "Collapse") { pillGroupState = PillGroupState.Collapsed }
        }
    }
} 
   //sampleEnd
}