Skip to content

Commit

Permalink
πŸ”— :: v1.1.0
Browse files Browse the repository at this point in the history
πŸ”— :: v1.1.0
  • Loading branch information
Tmdhoon2 authored Jan 26, 2024
2 parents 78db843 + 14c324b commit dc9c9c3
Show file tree
Hide file tree
Showing 5 changed files with 172 additions and 72 deletions.
2 changes: 1 addition & 1 deletion jobisdesignsystemv2/build.gradle.kts
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ afterEvaluate {
from(components["release"])
groupId = "team.return.jobis.android"
artifactId = "design-system-v2"
version = "1.0.1"
version = "1.1.0"
}
}
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@ 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.foundation.shape.CircleShape
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.getValue
Expand All @@ -20,14 +19,11 @@ import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.alpha
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import team.returm.jobisdesignsystemv2.R
import team.returm.jobisdesignsystemv2.button.JobisIconButton
import team.returm.jobisdesignsystemv2.foundation.JobisColor
import team.returm.jobisdesignsystemv2.foundation.JobisIcon
import team.returm.jobisdesignsystemv2.foundation.JobisTheme
import team.returm.jobisdesignsystemv2.foundation.JobisTypography
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ data class ButtonColorSet(

enum class ButtonColor {
Primary,
Secondary,
Default,
}

Expand All @@ -24,6 +25,13 @@ internal object ButtonColors {
text = JobisColor.Light.gray100,
)

@Composable
fun secondary() = ButtonColorSet(
background = JobisColor.Light.primary100,
pressed = JobisColor.Light.gray400,
text = JobisColor.Light.primary200,
)

@Composable
fun default() = ButtonColorSet(
background = JobisColor.Light.gray300,
Expand All @@ -40,6 +48,13 @@ internal object ButtonColors {
text = JobisColor.Dark.gray100,
)

@Composable
fun secondary() = ButtonColorSet(
background = JobisColor.Dark.primary100,
pressed = JobisColor.Dark.gray300,
text = JobisColor.Dark.primary200,
)

@Composable
fun default() = ButtonColorSet(
background = JobisColor.Light.gray300,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -33,91 +33,44 @@ import team.returm.jobisdesignsystemv2.text.JobisText
import team.returm.jobisdesignsystemv2.utils.DURATION_MILLIS
import team.returm.jobisdesignsystemv2.utils.clickable

private val buttonShape = RoundedCornerShape(12.dp)
private val largeButtonShape = RoundedCornerShape(12.dp)
private val smallButtonShape = RoundedCornerShape(8.dp)

@Composable
private fun BasicButton(
modifier: Modifier,
text: String,
backgroundColor: Color,
textColor: Color,
shape: RoundedCornerShape,
enabled: Boolean,
onPressed: (pressed: Boolean) -> Unit,
onClick: () -> Unit,
content: @Composable () -> Unit,
) {
val contentColor by animateColorAsState(
targetValue = if (!enabled) {
JobisTheme.colors.background
} else {
textColor
},
animationSpec = tween(durationMillis = DURATION_MILLIS),
label = "",
)

Surface(
modifier = modifier
.clickable(
enabled = enabled,
onPressed = onPressed,
onClick = onClick,
),
shape = buttonShape,
shape = shape,
color = backgroundColor,
) {
Row(
modifier = Modifier
.padding(
start = 28.dp,
end = 16.dp,
top = 16.dp,
bottom = 16.dp,
),
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.Center,
) {
JobisText(
text = text,
style = JobisTypography.SubHeadLine,
color = contentColor,
)
Spacer(modifier = Modifier.width(4.dp))
Icon(
painter = painterResource(id = JobisIcon.LongArrow),
tint = contentColor,
contentDescription = stringResource(id = R.string.content_description_long_arrow),
)
}
}
content = content,
)
}

@Composable
private fun ColoredButton(
modifier: Modifier,
text: String,
color: ButtonColor,
shape: RoundedCornerShape,
enabled: Boolean,
pressed: () -> Boolean,
onPressed: (pressed: Boolean) -> Unit,
onClick: () -> Unit,
content: @Composable (contentColor: Color) -> Unit,
) {
val themeColor = when (color) {
ButtonColor.Primary -> {
if (isSystemInDarkTheme()) {
ButtonColors.Dark.primary()
} else {
ButtonColors.Light.primary()
}
}

ButtonColor.Default -> {
if (isSystemInDarkTheme()) {
ButtonColors.Dark.default()
} else {
ButtonColors.Light.default()
}
}
}
val themeColor = getThemeColor(color = color)

val background by animateColorAsState(
targetValue = if (!enabled) {
Expand All @@ -130,15 +83,55 @@ private fun ColoredButton(
label = "",
)

val contentColor by animateColorAsState(
targetValue = if (!enabled) {
JobisTheme.colors.background
} else {
themeColor.text
},
animationSpec = tween(durationMillis = DURATION_MILLIS),
label = "",
)

BasicButton(
modifier = modifier,
text = text,
backgroundColor = background,
textColor = themeColor.text,
shape = shape,
enabled = enabled,
onPressed = onPressed,
onClick = onClick,
content = { content(contentColor) },
)
}

@Composable
private fun getThemeColor(color: ButtonColor) = when (color) {
ButtonColor.Primary -> checkDarkTheme(
lightColor = ButtonColors.Light.primary(),
darkColor = ButtonColors.Dark.primary(),
)

ButtonColor.Secondary -> checkDarkTheme(
lightColor = ButtonColors.Light.secondary(),
darkColor = ButtonColors.Dark.secondary(),
)

ButtonColor.Default -> checkDarkTheme(
lightColor = ButtonColors.Light.default(),
darkColor = ButtonColors.Dark.default(),
)
}

@Composable
private fun checkDarkTheme(
lightColor: ButtonColorSet,
darkColor: ButtonColorSet,
): ButtonColorSet {
return if (isSystemInDarkTheme()) {
darkColor
} else {
lightColor
}
}

@Composable
Expand All @@ -154,14 +147,70 @@ private fun LargeButton(
ColoredButton(
modifier = modifier
.fillMaxWidth()
.clip(buttonShape),
text = text,
.clip(largeButtonShape),
color = color,
shape = largeButtonShape,
enabled = enabled,
pressed = { pressed },
onPressed = { pressed = it },
onClick = onClick,
)
) { contentColor ->
Row(
modifier = Modifier
.padding(
start = 28.dp,
end = 16.dp,
top = 16.dp,
bottom = 16.dp,
),
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.Center,
) {
JobisText(
text = text,
style = JobisTypography.SubHeadLine,
color = contentColor,
)
Spacer(modifier = Modifier.width(4.dp))
Icon(
painter = painterResource(id = JobisIcon.LongArrow),
tint = contentColor,
contentDescription = stringResource(id = R.string.content_description_long_arrow),
)
}
}
}

@Composable
private fun SmallButton(
modifier: Modifier,
text: String,
color: ButtonColor,
enabled: Boolean,
onClick: () -> Unit,
) {
var pressed by remember { mutableStateOf(false) }

ColoredButton(
modifier = modifier.clip(smallButtonShape),
color = color,
shape = smallButtonShape,
enabled = enabled,
pressed = { pressed },
onPressed = { pressed = it },
onClick = onClick,
) { contentColor ->
JobisText(
modifier = Modifier
.padding(
horizontal = 8.dp,
vertical = 4.dp,
),
text = text,
style = JobisTypography.SubBody,
color = contentColor,
)
}
}

/**
Expand Down Expand Up @@ -189,3 +238,20 @@ fun JobisButton(
onClick = onClick,
)
}

@Composable
fun JobisSmallButton(
modifier: Modifier = Modifier,
text: String,
color: ButtonColor = ButtonColor.Secondary,
enabled: Boolean = true,
onClick: () -> Unit,
) {
SmallButton(
modifier = modifier,
text = text,
color = color,
enabled = enabled,
onClick = onClick,
)
}
Loading

0 comments on commit dc9c9c3

Please sign in to comment.