feature: FloconSection (#139)

Co-authored-by: TEYSSANDIER Raphael <rteyssandier@sephora.fr>
This commit is contained in:
Raphael Teyssandier 2025-08-22 14:54:27 +02:00 committed by GitHub
parent 39d623e3ae
commit c1a55b72fd
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 271 additions and 372 deletions

View file

@ -0,0 +1,80 @@
package io.github.openflocon.library.designsystem.components
import androidx.compose.animation.AnimatedVisibility
import androidx.compose.animation.core.animateFloatAsState
import androidx.compose.animation.expandVertically
import androidx.compose.animation.fadeIn
import androidx.compose.animation.fadeOut
import androidx.compose.animation.shrinkVertically
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.RowScope
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.outlined.ExpandMore
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.graphicsLayer
import androidx.compose.ui.unit.dp
import io.github.openflocon.library.designsystem.FloconTheme
@Composable
fun FloconSection(
title: String,
modifier: Modifier = Modifier,
initialValue: Boolean = false,
expandable: Boolean = true,
actions: @Composable (RowScope.() -> Unit)? = null,
content: @Composable () -> Unit
) {
var expanded by remember { mutableStateOf(initialValue) }
val rotate by animateFloatAsState(
targetValue = if (expanded) 180f else 0f,
label = "rotate",
)
Column(
modifier = modifier
) {
Row(
modifier = Modifier
.fillMaxWidth()
.padding(bottom = 4.dp),
horizontalArrangement = Arrangement.spacedBy(4.dp),
verticalAlignment = Alignment.CenterVertically,
) {
if (expandable) {
FloconIconButton(
onClick = { expanded = !expanded },
) {
FloconIcon(
imageVector = Icons.Outlined.ExpandMore,
modifier = Modifier.graphicsLayer { rotationZ = rotate }
)
}
}
Text(
text = title,
style = FloconTheme.typography.titleMedium,
color = FloconTheme.colorPalette.onBackground,
modifier = Modifier.weight(1f)
)
actions?.invoke(this)
}
AnimatedVisibility(
visible = expanded,
enter = fadeIn() + expandVertically(),
exit = fadeOut() + shrinkVertically(),
) {
content()
}
}
}

View file

@ -1,25 +0,0 @@
package io.github.openflocon.library.designsystem.components
import androidx.compose.animation.AnimatedVisibility
import androidx.compose.animation.expandVertically
import androidx.compose.animation.fadeIn
import androidx.compose.animation.fadeOut
import androidx.compose.animation.shrinkVertically
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
@Composable
fun FloconSectionExpandable(
expanded: Boolean,
modifier: Modifier = Modifier,
content: @Composable () -> Unit
) {
AnimatedVisibility(
visible = expanded,
enter = fadeIn() + expandVertically(),
exit = fadeOut() + shrinkVertically(),
modifier = modifier
) {
content()
}
}