diff --git a/gradle/libs.versions.toml b/gradle/libs.versions.toml index 28231cf9..b68afa04 100644 --- a/gradle/libs.versions.toml +++ b/gradle/libs.versions.toml @@ -23,6 +23,7 @@ android-material-version = '1.9.0' # Compose compose-bom = "2023.08.00" compose-kotlin-compiler = "1.5.2" +showkase = "1.0.0-beta18" # Image glide = "4.16.0" @@ -56,6 +57,8 @@ compose-material-icons-core = { group = "androidx.compose.material", name = "mat compose-material-icons-extended = { group = "androidx.compose.material", name = "material-icons-extended" } compose-material3 = { group = "androidx.compose.material3", name = "material3" } compose-tests-ui = { group = "androidx.compose.ui", name = "ui-test-junit4" } +showkase = { group = "com.airbnb.android", name = "showkase", version.ref = "showkase" } +showkase-ksp = { group = "com.airbnb.android", name = "showkase-processor", version.ref = "showkase" } # Image glide = { group = "com.github.bumptech.glide", name = "glide", version.ref = "glide" } diff --git a/library-compose/build.gradle.kts b/library-compose/build.gradle.kts index 87c48914..e2922e27 100644 --- a/library-compose/build.gradle.kts +++ b/library-compose/build.gradle.kts @@ -1,6 +1,9 @@ +import org.jetbrains.kotlin.gradle.tasks.KotlinCompile + plugins { alias(libs.plugins.android.library) alias(libs.plugins.kotlin.android) + alias(libs.plugins.ksp) id("maven-publish") } @@ -46,6 +49,9 @@ android { publishing { singleVariant("release") } + ksp { + arg("skipPrivatePreviews", "true") + } } dependencies { @@ -60,6 +66,9 @@ dependencies { api(platform(libs.compose.bom)) api(libs.bundles.compose) + implementation(libs.showkase) + ksp(libs.showkase.ksp) + // UI Tests androidTestImplementation(libs.compose.tests.ui) } @@ -77,3 +86,10 @@ afterEvaluate { } } } + +tasks.withType { + kotlinOptions { + freeCompilerArgs += "-opt-in=kotlin.RequiresOptIn" + freeCompilerArgs += "-opt-in=androidx.compose.material3.ExperimentalMaterial3Api" + } +} diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/appbar/GrapesTopAppBar.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/appbar/GrapesTopAppBar.kt index 77d7a63b..c9652b2d 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/appbar/GrapesTopAppBar.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/appbar/GrapesTopAppBar.kt @@ -5,7 +5,6 @@ import androidx.compose.foundation.background import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.RowScope -import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.size import androidx.compose.foundation.rememberScrollState @@ -135,13 +134,13 @@ fun GrapesTopAppBarMoreIcon( } //region previews -@Preview +@Preview("GrapesTopAppBars", group = "TopAppBar") @Composable -fun GrapesSimpleTopAppBarPreview() { +internal fun GrapesSimpleTopAppBarPreview() { GrapesTheme { Column( modifier = Modifier - .fillMaxSize() + .fillMaxWidth() .background(GrapesTheme.colors.mainNeutralLighter) .verticalScroll(rememberScrollState()), verticalArrangement = Arrangement.spacedBy(8.dp) diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/avatar/GrapesEditAvatar.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/avatar/GrapesEditAvatar.kt index 2fcb56d9..ff3a89a5 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/avatar/GrapesEditAvatar.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/avatar/GrapesEditAvatar.kt @@ -126,9 +126,9 @@ object EditAvatarDefaults { val badgeSize = DpSize(24.dp, 24.dp) } -@Preview(showBackground = true) +@Preview(showBackground = true, name = "Avatar", group = "Avatar") @Composable -private fun Preview() { +internal fun Preview() { GrapesTheme { Column( verticalArrangement = Arrangement.spacedBy(12.dp), diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/badge/Badge.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/badge/Badge.kt index 18468341..90e01203 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/badge/Badge.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/badge/Badge.kt @@ -35,9 +35,9 @@ fun GrapesBadge( ) } -@Preview +@Preview(name = "Badges", group = "Badges") @Composable -fun GrapesBadgePreview() { +internal fun GrapesBadgePreview() { GrapesTheme { Column(verticalArrangement = Arrangement.spacedBy(GrapesTheme.dimensions.paddingXSmall)) { GrapesBadge(content = "Message Inline Success", configuration = GrapesConfigurationStatus.SUCCESS) diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/bucket/GrapesBucket.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/bucket/GrapesBucket.kt index c7652b31..78cb3b7c 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/bucket/GrapesBucket.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/bucket/GrapesBucket.kt @@ -69,9 +69,9 @@ internal fun GrapesBucketCore( // endregion internal -@Preview +@Preview(name = "Bucket", group = "Bucket") @Composable -private fun GrapesBucketPreview() { +internal fun GrapesBucketPreview() { GrapesTheme { Column( modifier = Modifier diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/bucket/GrapesBucketContainer.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/bucket/GrapesBucketContainer.kt index 7584f61b..fcfb1996 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/bucket/GrapesBucketContainer.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/bucket/GrapesBucketContainer.kt @@ -40,9 +40,9 @@ fun GrapesBucketContainer( } } -@Preview +@Preview(name = "Bucket container", group = "Bucket") @Composable -private fun GrapesContainerPreview() { +internal fun GrapesContainerPreview() { GrapesTheme { Column( modifier = Modifier diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/bucket/GrapesBucketHeadline.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/bucket/GrapesBucketHeadline.kt index a73254e7..fbe0a281 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/bucket/GrapesBucketHeadline.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/bucket/GrapesBucketHeadline.kt @@ -54,13 +54,13 @@ fun GrapesBucketHeadline( } } -@Preview(showBackground = true) +@Preview(showBackground = true, name = "Bucket headline", group = "Bucket") @Composable -private fun GrapesBucketHeadlinePreview() { +internal fun GrapesBucketHeadlinePreview() { GrapesTheme { Column( modifier = Modifier - .fillMaxSize() + .fillMaxWidth() .background(GrapesTheme.colors.mainNeutralLighter) .verticalScroll(rememberScrollState()), ) { diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/button/GrapesButton.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/button/GrapesButton.kt index 22e8a21a..3ec40cc7 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/button/GrapesButton.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/button/GrapesButton.kt @@ -58,12 +58,12 @@ fun GrapesButton( //region Previews @Preview( name = "Primary", - group = "Default", + group = "Button", widthDp = 372, showBackground = true, ) @Composable -fun ButtonPrimaryPreview() { +internal fun ButtonPrimaryPreview() { GrapesTheme { Column( modifier = Modifier @@ -94,17 +94,17 @@ fun ButtonPrimaryPreview() { @Preview( name = "Primary Small", - group = "Small", + group = "Button", widthDp = 810, showBackground = true, ) @Composable -private fun ButtonPrimarySmallPreview() { +internal fun ButtonPrimarySmallPreview() { GrapesTheme { - Row( + Column( modifier = Modifier.fillMaxWidth(), - verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.SpaceAround + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.SpaceAround ) { GrapesButton( text = "Primary Small Enabled", @@ -128,12 +128,12 @@ private fun ButtonPrimarySmallPreview() { @Preview( name = "Secondary", - group = "Default", + group = "Button", widthDp = 372, showBackground = true, ) @Composable -fun ButtonSecondaryPreview() { +internal fun ButtonSecondaryPreview() { GrapesTheme { Column( modifier = Modifier @@ -164,17 +164,17 @@ fun ButtonSecondaryPreview() { @Preview( name = "Secondary Small", - group = "Small", + group = "Button", widthDp = 850, showBackground = true, ) @Composable -fun ButtonSecondarySmallPreview() { +internal fun ButtonSecondarySmallPreview() { GrapesTheme { - Row( + Column( modifier = Modifier.fillMaxWidth(), - verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.SpaceAround + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.SpaceAround ) { GrapesButton( text = "Secondary Small Enabled", @@ -198,13 +198,13 @@ fun ButtonSecondarySmallPreview() { @Preview( name = "Text", - group = "Default", + group = "Button", widthDp = 372, showBackground = true, backgroundColor = 0xFF421896 // Primary Dark ) @Composable -fun ButtonTextPreview() { +internal fun ButtonTextPreview() { GrapesTheme { Column( modifier = Modifier @@ -235,18 +235,18 @@ fun ButtonTextPreview() { @Preview( name = "Text Small", - group = "Small", + group = "Button", widthDp = 850, showBackground = true, backgroundColor = 0xFF421896 // Primary Dark ) @Composable -fun ButtonTextSmallPreview() { +internal fun ButtonTextSmallPreview() { GrapesTheme { - Row( + Column( modifier = Modifier.fillMaxWidth(), - verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.SpaceAround + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.SpaceAround ) { GrapesButton( text = "Secondary Text Enabled", @@ -270,12 +270,12 @@ fun ButtonTextSmallPreview() { @Preview( name = "Warning", - group = "Default", + group = "Button", widthDp = 372, showBackground = true, ) @Composable -fun ButtonWarningPreview() { +internal fun ButtonWarningPreview() { GrapesTheme { Column( modifier = Modifier @@ -306,12 +306,12 @@ fun ButtonWarningPreview() { @Preview( name = "Alert", - group = "Default", + group = "Button", widthDp = 372, showBackground = true, ) @Composable -fun ButtonAlertPreview() { +internal fun ButtonAlertPreview() { GrapesTheme { Column( modifier = Modifier @@ -342,17 +342,17 @@ fun ButtonAlertPreview() { @Preview( name = "Link Primary", - group = "Small", + group = "Button", widthDp = 850, showBackground = true, ) @Composable -fun ButtonLinkPrimaryPreview() { +internal fun ButtonLinkPrimaryPreview() { GrapesTheme { - Row( + Column( modifier = Modifier.fillMaxWidth(), - verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.SpaceAround + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.SpaceAround ) { GrapesButton( text = "Link Primary Enabled", @@ -376,17 +376,17 @@ fun ButtonLinkPrimaryPreview() { @Preview( name = "Link Secondary", - group = "Small", + group = "Button", widthDp = 1030, showBackground = true, ) @Composable -fun ButtonLinkSecondaryPreview() { +internal fun ButtonLinkSecondaryPreview() { GrapesTheme { - Row( + Column( modifier = Modifier.fillMaxWidth(), - verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.SpaceAround + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.SpaceAround ) { GrapesButton( text = "Link Secondary Enabled", @@ -410,12 +410,12 @@ fun ButtonLinkSecondaryPreview() { @Preview( name = "Alert Outlined", - group = "Default", + group = "Button", widthDp = 372, showBackground = true, ) @Composable -fun ButtonAlertOutlinedPreview() { +internal fun ButtonAlertOutlinedPreview() { GrapesTheme { Column( modifier = Modifier diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/button/GrapesButtonBrand.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/button/GrapesButtonBrand.kt index e477e73e..357e8562 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/button/GrapesButtonBrand.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/button/GrapesButtonBrand.kt @@ -5,7 +5,7 @@ import androidx.compose.foundation.background import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column -import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.size import androidx.compose.foundation.shape.RoundedCornerShape @@ -101,13 +101,13 @@ private fun BrandLeadingIcon(style: GrapesButtonStyle, @DrawableRes iconRes: Int } } -@Preview +@Preview(name = "Brand button", group = "Button") @Composable -private fun GrapesButtonBrandPreview() { +internal fun GrapesButtonBrandPreview() { GrapesTheme { Column( modifier = Modifier - .fillMaxSize() + .fillMaxWidth() .background(GrapesTheme.colors.mainBackground) .padding(GrapesTheme.dimensions.paddingLarge), verticalArrangement = Arrangement.spacedBy(GrapesTheme.dimensions.paddingLarge) diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/button/GrapesButtonIcon.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/button/GrapesButtonIcon.kt index b869cd26..6d2b3859 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/button/GrapesButtonIcon.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/button/GrapesButtonIcon.kt @@ -88,13 +88,13 @@ internal fun GrapesButtonIcon( //region Previews @Preview( - name = "Primary", - group = "Default", + name = "Primary with icon", + group = "Button", widthDp = 372, showBackground = true, ) @Composable -private fun ButtonIconPrimaryPreview() { +internal fun ButtonIconPrimaryPreview() { GrapesTheme { Column( modifier = Modifier @@ -133,18 +133,18 @@ private fun ButtonIconPrimaryPreview() { } @Preview( - name = "Primary Small", - group = "Small", + name = "Primary Small with icon", + group = "Button", widthDp = 710, showBackground = true, ) @Composable -private fun ButtonIconPrimarySmallPreview() { +internal fun ButtonIconPrimarySmallPreview() { GrapesTheme { - Row( + Column( modifier = Modifier.fillMaxWidth(), - verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.SpaceAround + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.SpaceAround ) { GrapesButtonIcon( text = "Button with Icon", @@ -173,13 +173,13 @@ private fun ButtonIconPrimarySmallPreview() { } @Preview( - name = "Secondary", - group = "Default", + name = "Secondary with icon", + group = "Button", widthDp = 372, showBackground = true, ) @Composable -private fun ButtonIconSecondaryPreview() { +internal fun ButtonIconSecondaryPreview() { GrapesTheme { Column( modifier = Modifier @@ -215,18 +215,18 @@ private fun ButtonIconSecondaryPreview() { } @Preview( - name = "Secondary Small", - group = "Small", + name = "Secondary Small with icon", + group = "Button", widthDp = 710, showBackground = true, ) @Composable -private fun ButtonIconSecondarySmallPreview() { +internal fun ButtonIconSecondarySmallPreview() { GrapesTheme { - Row( + Column( modifier = Modifier.fillMaxWidth(), - verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.SpaceAround + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.SpaceAround ) { GrapesButtonIcon( @@ -256,14 +256,14 @@ private fun ButtonIconSecondarySmallPreview() { } @Preview( - name = "Text", - group = "Default", + name = "Text with icon", + group = "Button", widthDp = 372, showBackground = true, backgroundColor = 0xFF421896 // Primary Dark ) @Composable -private fun ButtonIconTextPreview() { +internal fun ButtonIconTextPreview() { GrapesTheme { Column( modifier = Modifier @@ -299,14 +299,14 @@ private fun ButtonIconTextPreview() { } @Preview( - name = "Text Small", - group = "Small", + name = "Text Small with icon", + group = "Button", widthDp = 710, showBackground = true, backgroundColor = 0xFF421896 // Primary Dark ) @Composable -private fun ButtonIconTextSmallPreview() { +internal fun ButtonIconTextSmallPreview() { GrapesTheme { Row( modifier = Modifier.fillMaxWidth(), @@ -340,13 +340,13 @@ private fun ButtonIconTextSmallPreview() { } @Preview( - name = "Warning", - group = "Default", + name = "Warning with icon", + group = "Button", widthDp = 372, showBackground = true, ) @Composable -private fun ButtonIconWarningPreview() { +internal fun ButtonIconWarningPreview() { GrapesTheme { Column( modifier = Modifier @@ -382,13 +382,13 @@ private fun ButtonIconWarningPreview() { } @Preview( - name = "Alert", - group = "Default", + name = "Alert with icon", + group = "Button", widthDp = 372, showBackground = true, ) @Composable -private fun ButtonIconAlertPreview() { +internal fun ButtonIconAlertPreview() { GrapesTheme { Column( modifier = Modifier @@ -424,18 +424,18 @@ private fun ButtonIconAlertPreview() { } @Preview( - name = "Link Primary", - group = "Small", + name = "Link Primary with icon", + group = "Button", widthDp = 710, showBackground = true, ) @Composable -private fun ButtonIconLinkPrimaryPreview() { +internal fun ButtonIconLinkPrimaryPreview() { GrapesTheme { - Row( + Column( modifier = Modifier.fillMaxWidth(), - verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.SpaceAround + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.SpaceAround ) { GrapesButtonIcon( text = "Text with Icon", @@ -464,18 +464,18 @@ private fun ButtonIconLinkPrimaryPreview() { } @Preview( - name = "Link Secondary", - group = "Small", + name = "Link Secondary with icon", + group = "Button", widthDp = 710, showBackground = true, ) @Composable -private fun ButtonIconLinkSecondaryPreview() { +internal fun ButtonIconLinkSecondaryPreview() { GrapesTheme { - Row( + Column( modifier = Modifier.fillMaxWidth(), - verticalAlignment = Alignment.CenterVertically, - horizontalArrangement = Arrangement.SpaceAround + horizontalAlignment = Alignment.CenterHorizontally, + verticalArrangement = Arrangement.SpaceAround ) { GrapesButtonIcon( text = "Button with Icon", diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/calendar/GrapesDatePicker.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/calendar/GrapesDatePicker.kt index d1bef1ff..d6f83894 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/calendar/GrapesDatePicker.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/calendar/GrapesDatePicker.kt @@ -118,9 +118,9 @@ private fun GrapesDatePickerWithMinDatePreview() { } } -@Preview(showBackground = true) +@Preview(showBackground = true, name = "Date picker with max date", group = "Calendar") @Composable -private fun GrapesDatePickerWithMaxDatePreview() { +internal fun GrapesDatePickerWithMaxDatePreview() { val maxDate = Calendar.getInstance().apply { add(Calendar.DAY_OF_WEEK, 2) }.time GrapesTheme { @@ -131,9 +131,9 @@ private fun GrapesDatePickerWithMaxDatePreview() { } } -@Preview(showBackground = true) +@Preview(showBackground = true, name = "Date picker", group = "Calendar") @Composable -private fun GrapesDatePickerPreview() { +internal fun GrapesDatePickerPreview() { GrapesTheme { GrapesDatePicker( onDateSelected = { date -> println("Selected date: $date") } diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/calendar/GrapesTimePicker.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/calendar/GrapesTimePicker.kt index 3c94190a..9819a40a 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/calendar/GrapesTimePicker.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/calendar/GrapesTimePicker.kt @@ -66,9 +66,9 @@ fun GrapesTimePicker( } } -@Preview(showBackground = true) +@Preview(showBackground = true, name = "Time picker", group = "Calendar") @Composable -private fun GrapesTimePickerPreview() { +internal fun GrapesTimePickerPreview() { var itemHour by remember { mutableStateOf(Calendar.getInstance().apply { time = Date() }.get(Calendar.HOUR_OF_DAY)) } var itemMinutes by remember { mutableStateOf(Calendar.getInstance().apply { time = Date() }.get(Calendar.MINUTE)) } diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/card/GrapesInformationCard.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/card/GrapesInformationCard.kt index 7281cf6a..b07b8bad 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/card/GrapesInformationCard.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/card/GrapesInformationCard.kt @@ -75,7 +75,7 @@ object GrapesInformationCardDefaults { @Composable get() = Arrangement.spacedBy(GrapesTheme.dimensions.paddingLarge) } -@Preview +@Preview(group = "Information card") @Composable private fun PreviewDescription( @PreviewParameter(DescriptionParameterProvider::class) texts: Pair, @@ -104,7 +104,7 @@ private class DescriptionParameterProvider : PreviewParameterProvider, ) { diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/listitem/IconAction.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/listitem/IconAction.kt index c7b292be..6d3f18f4 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/listitem/IconAction.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/listitem/IconAction.kt @@ -58,9 +58,9 @@ internal fun IconAction(iconActionConfiguration: ListItemConfiguration.IconActio } } -@Preview +@Preview(name = "Icon action", group = "List item") @Composable -private fun IconActionPreview() { +internal fun IconActionPreview() { val alertConfiguration = ListItemConfiguration.IconAction( title = "Title", icon = R.drawable.ic_success, @@ -84,7 +84,6 @@ private fun IconActionPreview() { GrapesTheme { Column( modifier = Modifier - .fillMaxSize() .verticalScroll(rememberScrollState()), verticalArrangement = Arrangement.spacedBy(16.dp) ) { diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/listitem/SectionItem.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/listitem/SectionItem.kt index ba288cfb..32b0cf93 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/listitem/SectionItem.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/listitem/SectionItem.kt @@ -53,8 +53,8 @@ fun SectionItem( } @Composable -@Preview(showBackground = true) -private fun Preview() { +@Preview(showBackground = true, name = "Section item", group = "List item") +internal fun Preview() { GrapesTheme { SectionItem( title = "Frichti", diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/listitem/TextDivider.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/listitem/TextDivider.kt index 7e8b8ec9..94abb4ba 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/listitem/TextDivider.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/listitem/TextDivider.kt @@ -37,13 +37,12 @@ fun TextDivider( } } -@Preview +@Preview(name = "Text divider", group = "List item") @Composable -private fun TextDividerPreview() { +internal fun TextDividerPreview() { GrapesTheme { Column( modifier = Modifier - .fillMaxSize() .background(GrapesTheme.colors.mainBackground) .padding(GrapesTheme.dimensions.paddingLarge), verticalArrangement = Arrangement.spacedBy(GrapesTheme.dimensions.paddingLarge) diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/message/Message.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/message/Message.kt index 8486f716..aa2760ef 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/message/Message.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/message/Message.kt @@ -72,9 +72,9 @@ fun GrapesMessage( } } -@Preview +@Preview(name="MessageInlineSmallContentPadding", group = "Message") @Composable -private fun MessageInlineSmallContentPadding() { +internal fun MessageInlineSmallContentPadding() { val padding = PaddingValues( horizontal = GrapesTheme.dimensions.paddingSmall, vertical = GrapesTheme.dimensions.paddingXSmall, @@ -110,9 +110,9 @@ private fun MessageInlineSmallContentPadding() { } } -@Preview +@Preview(name="MessageInline", group = "Message") @Composable -private fun MessageInline() { +internal fun MessageInline() { GrapesTheme { Column(verticalArrangement = Arrangement.spacedBy(GrapesTheme.dimensions.paddingXSmall)) { GrapesMessage(title = "Message Inline Success", configuration = GrapesConfigurationStatus.SUCCESS) @@ -124,9 +124,9 @@ private fun MessageInline() { } } -@Preview +@Preview(name="MessageInlineIcon", group = "Message") @Composable -private fun MessageInlineIcon() { +internal fun MessageInlineIcon() { GrapesTheme { Column(verticalArrangement = Arrangement.spacedBy(GrapesTheme.dimensions.paddingXSmall)) { GrapesMessage(title = "Message Inline Success", configuration = GrapesConfigurationStatus.SUCCESS, showIcon = true) @@ -138,9 +138,9 @@ private fun MessageInlineIcon() { } } -@Preview +@Preview(name="MessageInlineIconBlock", group = "Message") @Composable -private fun MessageInlineIconBlock() { +internal fun MessageInlineIconBlock() { GrapesTheme { Column(verticalArrangement = Arrangement.spacedBy(GrapesTheme.dimensions.paddingXSmall)) { GrapesMessage( @@ -177,9 +177,9 @@ private fun MessageInlineIconBlock() { } } -@Preview +@Preview(name="MessageInlineFillingMaxWidth", group = "Message") @Composable -private fun MessageInlineFillingMaxWidth() { +internal fun MessageInlineFillingMaxWidth() { GrapesTheme { Column(modifier = Modifier.width(400.dp)) { GrapesMessage(modifier = Modifier.fillMaxWidth(), title = "aaaa", configuration = GrapesConfigurationStatus.SUCCESS) @@ -187,9 +187,9 @@ private fun MessageInlineFillingMaxWidth() { } } -@Preview +@Preview(name="MessageInlineTextAligned", group = "Message") @Composable -private fun MessageInlineTextAligned() { +internal fun MessageInlineTextAligned() { GrapesTheme { Column(modifier = Modifier.width(400.dp)) { GrapesMessage( @@ -204,9 +204,9 @@ private fun MessageInlineTextAligned() { } } -@Preview +@Preview(name="MessageInlineFillingLongTitleAndDescription", group = "Message") @Composable -private fun MessageInlineFillingLongTitleAndDescription() { +internal fun MessageInlineFillingLongTitleAndDescription() { GrapesTheme { Column(modifier = Modifier.width(100.dp)) { GrapesMessage( diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/message/PasswordValidation.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/message/PasswordValidation.kt index 00e91b76..79b8fcc6 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/message/PasswordValidation.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/message/PasswordValidation.kt @@ -87,9 +87,9 @@ private fun PasswordValidationItem( } } -@Preview +@Preview(name = "Password validation", group = "Password validation") @Composable -private fun PasswordValidationPreview() { +internal fun PasswordValidationPreview() { var items by remember { mutableStateOf( listOf( @@ -104,7 +104,6 @@ private fun PasswordValidationPreview() { GrapesTheme { Column( modifier = Modifier - .fillMaxSize() .background(GrapesTheme.colors.mainBackground) ) { Column( diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/select/GrapesSelect.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/select/GrapesSelect.kt index e51b09a4..c1b78bc4 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/select/GrapesSelect.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/select/GrapesSelect.kt @@ -9,6 +9,7 @@ import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.material.icons.Icons @@ -123,9 +124,9 @@ private fun GrapesSelectIcon(expanded: Boolean, tint: Color) { ) } -@Preview +@Preview("Select", group = "Selectors") @Composable -private fun GrapesSelectorPreview() { +internal fun GrapesSelectorPreview() { val values = List(4) { SelectEntry("$it", "Item $it") } @@ -134,7 +135,7 @@ private fun GrapesSelectorPreview() { } GrapesTheme { - Column(modifier = Modifier.fillMaxSize(), verticalArrangement = Arrangement.Center, horizontalAlignment = Alignment.CenterHorizontally) { + Column(modifier = Modifier.fillMaxWidth(), verticalArrangement = Arrangement.Center, horizontalAlignment = Alignment.CenterHorizontally) { GrapesSelect(selectedValue, values, onItemSelected = { selectedValue = it }, placeHolder = "Select Value") GrapesSelect(selectedValue, values, onItemSelected = { selectedValue = it }, placeHolder = "Select Value", isEnabled = false) } diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/selectors/GrapesCheckbox.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/selectors/GrapesCheckbox.kt index ac7fc11f..ee2ef446 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/selectors/GrapesCheckbox.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/selectors/GrapesCheckbox.kt @@ -44,8 +44,10 @@ fun GrapesCheckbox( @Preview( widthDp = 422, showBackground = true, + name = "Checkbox", + group = "Selectors" ) -private fun GrapesCheckboxPreview() { +internal fun GrapesCheckboxPreview() { GrapesTheme { Column(modifier = Modifier.padding(16.dp)) { Row(verticalAlignment = Alignment.CenterVertically) { diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/selectors/GrapesCheckboxText.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/selectors/GrapesCheckboxText.kt index 5502bdd0..563e9912 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/selectors/GrapesCheckboxText.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/selectors/GrapesCheckboxText.kt @@ -62,8 +62,10 @@ fun GrapesCheckboxText( @Preview( widthDp = 422, showBackground = true, + name = "Checkbox text", + group = "Selectors" ) -private fun GrapesCheckboxTextPreview() { +internal fun GrapesCheckboxTextPreview() { GrapesTheme { Column(modifier = Modifier.padding(16.dp)) { GrapesCheckboxText(text = "Checkbox selected and enabled", isChecked = true, isEnabled = true, onChecked = { Log.i("GrapesCheckboxText", "action checkbox clicked: $it") }) diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/selectors/GrapesRadioButton.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/selectors/GrapesRadioButton.kt index b4414497..5550f546 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/selectors/GrapesRadioButton.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/selectors/GrapesRadioButton.kt @@ -43,8 +43,10 @@ fun GrapesRadioButton( @Preview( widthDp = 422, showBackground = true, + name = "Radio button", + group = "Selectors" ) -private fun GrapesRadioButtonPreview() { +internal fun GrapesRadioButtonPreview() { GrapesTheme { Column(modifier = Modifier.padding(16.dp)) { Row(verticalAlignment = Alignment.CenterVertically) { diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/selectors/GrapesRadioButtonText.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/selectors/GrapesRadioButtonText.kt index 7aaa2ec5..762a0680 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/selectors/GrapesRadioButtonText.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/selectors/GrapesRadioButtonText.kt @@ -56,8 +56,10 @@ fun GrapesRadioButtonText( @Preview( widthDp = 422, showBackground = true, + name = "Radio button text", + group = "Selectors" ) -private fun GrapesRadioButtonTextPreview() { +internal fun GrapesRadioButtonTextPreview() { GrapesTheme { Column(modifier = Modifier.padding(16.dp)) { GrapesRadioButtonText(text = "Radio selected and enabled", isSelected = true, isEnabled = true, onClick = { Log.i("GrapesRadioButton", "action button click") }) diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/template/AskTemplate.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/template/AskTemplate.kt index 32868407..1ad5681b 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/template/AskTemplate.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/template/AskTemplate.kt @@ -86,9 +86,9 @@ fun AskTemplate( ) } -@Preview +@Preview("Ask template", group = "Templates") @Composable -fun Preview() { +internal fun Preview() { val cta = @Composable { Column(verticalArrangement = Arrangement.spacedBy(GrapesTheme.dimensions.paddingMedium)) { GrapesButton( diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/template/error/ErrorTemplate.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/template/error/ErrorTemplate.kt index 2352c77a..82f84742 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/template/error/ErrorTemplate.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/template/error/ErrorTemplate.kt @@ -123,10 +123,9 @@ fun ErrorTemplate( } } -@OptIn(ExperimentalAnimationApi::class) -@Preview(showBackground = true) +@Preview(showBackground = true, name = "Error template", group = "Templates") @Composable -fun ErrorTemplatePreview() { +internal fun ErrorTemplatePreview() { var isError by remember { mutableStateOf(false) } GrapesTheme { Column( @@ -155,4 +154,4 @@ fun ErrorTemplatePreview() { } } -} \ No newline at end of file +} diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/textfield/GrapesPinTextField.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/textfield/GrapesPinTextField.kt index ba86f807..6fddd48f 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/textfield/GrapesPinTextField.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/textfield/GrapesPinTextField.kt @@ -120,9 +120,9 @@ private fun String.trimToMaxSize(maxStringSize: Int): String { } -@Preview +@Preview(name = "Pin text input", group = "EditText") @Composable -fun PinTextInputPreview() { +internal fun PinTextInputPreview() { var content by remember { mutableStateOf("") } diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/textfield/GrapesTextInput.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/textfield/GrapesTextInput.kt index 4c0a3683..0e6b5604 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/textfield/GrapesTextInput.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/textfield/GrapesTextInput.kt @@ -134,8 +134,8 @@ fun GrapesTextInput( @ExperimentalMaterial3Api @Composable -@Preview -fun PreviewGrapesTextField() { +@Preview(name = "GrapesTextInput", group = "EditText") +internal fun PreviewGrapesTextField() { var isEnabled by remember { mutableStateOf(true) } var isReadOnly by remember { mutableStateOf(false) } @@ -174,7 +174,7 @@ fun PreviewGrapesTextField() { ) { Column( modifier = Modifier - .fillMaxSize() + .fillMaxWidth() .background(GrapesTheme.colors.mainBackground) .verticalScroll(rememberScrollState()) .padding(it), diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/textfield/PasswordTextInput.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/textfield/PasswordTextInput.kt index 2724ddc4..a992096e 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/textfield/PasswordTextInput.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/textfield/PasswordTextInput.kt @@ -69,7 +69,7 @@ fun PasswordTextInput( ) } -@Preview +@Preview(name = "Password text input", group = "EditText") @Composable private fun PasswordTextInputPreview() { var passwordContent by remember { @@ -79,7 +79,6 @@ private fun PasswordTextInputPreview() { GrapesTheme { Column( modifier = Modifier - .fillMaxSize() .padding(16.dp), Arrangement.spacedBy(16.dp) ) { PasswordTextInput( diff --git a/library-compose/src/main/java/com/spendesk/grapes/compose/theme/Colors.kt b/library-compose/src/main/java/com/spendesk/grapes/compose/theme/Colors.kt index 55e8f9f7..d9245c46 100644 --- a/library-compose/src/main/java/com/spendesk/grapes/compose/theme/Colors.kt +++ b/library-compose/src/main/java/com/spendesk/grapes/compose/theme/Colors.kt @@ -2,6 +2,7 @@ package com.spendesk.grapes.compose.theme import androidx.compose.runtime.Immutable import androidx.compose.ui.graphics.Color +import com.airbnb.android.showkase.annotation.ShowkaseColor /** * @author : danyboucanova @@ -50,40 +51,97 @@ data class GrapesColors( val google: Color, ) +@ShowkaseColor("PrimaryDark", group = "Light theme") val mainPrimaryDark = Color(0xFF421896) + +@ShowkaseColor("PrimaryNormal", group = "Light theme") val mainPrimaryNormal = Color(0xFF5D21D2) + +@ShowkaseColor("PrimaryLight", group = "Light theme") val mainPrimaryLight = Color(0xFF7542D9) + +@ShowkaseColor("PrimaryLighter", group = "Light theme") val mainPrimaryLighter = Color(0xFFDBD1F4) + +@ShowkaseColor("PrimaryLightest", group = "Light theme") val mainPrimaryLightest = Color(0xFFF4EFFC) + +@ShowkaseColor("White", group = "Light theme") val mainWhite = Color(0xFFFFFFFF) + +@ShowkaseColor("Black", group = "Light theme") val mainBlack = Color(0xFF000000) + +@ShowkaseColor("Complementary", group = "Light theme") val mainComplementary = Color(0xFF17114E) + +@ShowkaseColor("Background", group = "Light theme") val mainBackground = Color(0xFFF7F7F8) + +@ShowkaseColor("NeutralDarkest", group = "Light theme") val mainNeutralDarkest = Color(0xFF48465E) + +@ShowkaseColor("NeutralDarker", group = "Light theme") val mainNeutralDarker = Color(0xFF706F81) + +@ShowkaseColor("NeutralDark", group = "Light theme") val mainNeutralDark = Color(0xFFB4B3BD) + +@ShowkaseColor("NeutralNormal", group = "Light theme") val mainNeutralNormal = Color(0xFFCFCFD5) + +@ShowkaseColor("NeutralLight", group = "Light theme") val mainNeutralLight = Color(0xFFE6E6E9) + +@ShowkaseColor("NeutralLighter", group = "Light theme") val mainNeutralLighter = Color(0xFFF5F5F6) + +@ShowkaseColor("InfoNormal", group = "Light theme") val mainInfoNormal = Color(0xFF01799D) + +@ShowkaseColor("InfoLighter", group = "Light theme") val mainInfoLighter = Color(0xFFB3D7E2) + +@ShowkaseColor("InfoLightest", group = "Light theme") val mainInfoLightest = Color(0xFFE8F8FD) + +@ShowkaseColor("SuccessNormal", group = "Light theme") val mainSuccessNormal = Color(0xFF0B831B) + +@ShowkaseColor("SuccessLighter", group = "Light theme") val mainSuccessLighter = Color(0xFFB6DABB) + +@ShowkaseColor("SuccessLightest", group = "Light theme") val mainSuccessLightest = Color(0xFFDEFCEE) + +@ShowkaseColor("WarningDark", group = "Light theme") val mainWarningDark = Color(0xFF7F4608) + +@ShowkaseColor("WarningNormal", group = "Light theme") val mainWarningNormal = Color(0xFFA85D00) + +@ShowkaseColor("WarningLighter", group = "Light theme") val mainWarningLighter = Color(0xFFE5CEB3) + +@ShowkaseColor("WarningLightest", group = "Light theme") val mainWarningLightest = Color(0xFFFFF3E5) + +@ShowkaseColor("AlertDark", group = "Light theme") val mainAlertDark = Color(0xFF9E2208) + +@ShowkaseColor("AlertNormal", group = "Light theme") val mainAlertNormal = Color(0xFFD12D00) + +@ShowkaseColor("AlertLighter", group = "Light theme") val mainAlertLighter = Color(0xFFF1C0B3) + +@ShowkaseColor("AlertLightest", group = "Light theme") val mainAlertLightest = Color(0xFFFDEDE8) val google = Color(0xFF4285F4) diff --git a/sample/build.gradle.kts b/sample/build.gradle.kts index 557370b8..fd171cc8 100644 --- a/sample/build.gradle.kts +++ b/sample/build.gradle.kts @@ -2,6 +2,7 @@ plugins { alias(libs.plugins.android.application) alias(libs.plugins.kotlin.android) alias(libs.plugins.kotlin.kapt) + alias(libs.plugins.ksp) alias(libs.plugins.kotlin.parcelize) alias(libs.plugins.hilt) alias(libs.plugins.firebase.appdistribution) @@ -104,4 +105,7 @@ dependencies { // REFLECTION implementation(libs.reflection) + + implementation(libs.showkase) + ksp(libs.showkase.ksp) } diff --git a/sample/src/main/java/com/spendesk/grapes/samples/home/HomeActivity.kt b/sample/src/main/java/com/spendesk/grapes/samples/home/HomeActivity.kt index 6cdd37ca..623ed572 100644 --- a/sample/src/main/java/com/spendesk/grapes/samples/home/HomeActivity.kt +++ b/sample/src/main/java/com/spendesk/grapes/samples/home/HomeActivity.kt @@ -7,6 +7,7 @@ import androidx.activity.viewModels import androidx.appcompat.app.AppCompatActivity import androidx.appcompat.app.AppCompatDelegate import androidx.lifecycle.lifecycleScope +import com.airbnb.android.showkase.models.Showkase import com.google.android.material.switchmaterial.SwitchMaterial import com.google.android.material.tabs.TabLayoutMediator import com.spendesk.grapes.samples.R @@ -58,6 +59,13 @@ class HomeActivity : AppCompatActivity() { buttonView.isChecked = isChecked } } + + with(menu.findItem(R.id.menuHomeShowCompose)) { + setOnMenuItemClickListener { + startActivity(Showkase.getBrowserIntent(this@HomeActivity)) + true + } + } return true } diff --git a/sample/src/main/java/com/spendesk/grapes/samples/home/ShowkaseModule.kt b/sample/src/main/java/com/spendesk/grapes/samples/home/ShowkaseModule.kt new file mode 100644 index 00000000..6ba53aa4 --- /dev/null +++ b/sample/src/main/java/com/spendesk/grapes/samples/home/ShowkaseModule.kt @@ -0,0 +1,11 @@ +package com.spendesk.grapes.samples.home + +import com.airbnb.android.showkase.annotation.ShowkaseRoot +import com.airbnb.android.showkase.annotation.ShowkaseRootModule + +/** + * @author Kélian CLERC + * @since 25/08/2023 + */ +@ShowkaseRoot +class GrapesShowkaseModule: ShowkaseRootModule diff --git a/sample/src/main/res/drawable/ic_book.xml b/sample/src/main/res/drawable/ic_book.xml new file mode 100644 index 00000000..6eaf9ac0 --- /dev/null +++ b/sample/src/main/res/drawable/ic_book.xml @@ -0,0 +1,8 @@ + + + + + + diff --git a/sample/src/main/res/menu/menu_home.xml b/sample/src/main/res/menu/menu_home.xml index d10ab65a..44d0c57f 100644 --- a/sample/src/main/res/menu/menu_home.xml +++ b/sample/src/main/res/menu/menu_home.xml @@ -8,4 +8,9 @@ android:title="switch to dark theme" app:actionViewClass="com.google.android.material.switchmaterial.SwitchMaterial" app:showAsAction="always" /> - \ No newline at end of file + +