Skip to content

Commit

Permalink
Extend TabStrip API to support custom behaviours (#276)
Browse files Browse the repository at this point in the history 
* Update TabData for flexible content

* Update ui/src/main/kotlin/org/jetbrains/jewel/ui/component/TabStrip.kt

Co-authored-by: Sebastiano Poggi <[email protected]>

* Update ui/src/main/kotlin/org/jetbrains/jewel/ui/component/TabStrip.kt

Co-authored-by: Sebastiano Poggi <[email protected]>

* review

* review

* Add tab content spacing to the user interface

The user interface has been updated to include tab content spacing. This is established by adding a new parameter, `tabContentSpacing`, in TabMetrics and adjusting and testing its implementation across various files like `IntUiTabStyling.kt`, `IntUiBridge.kt`, and `Tabs.kt`. This modification will ensure more consistency and control over the user interface design. The user interface api file has also been updated to reflect this change.

* lint

* api fix

* Update int-ui-standalone APIs
  • Loading branch information
@fscarponi
fscarponi authored Dec 28, 2023
1 parent 6d208dd commit 2af35dc
Show file tree
Hide file tree
Showing 8 changed files with 180 additions and 97 deletions.
22 changes: 12 additions & 10 deletions ide-laf-bridge/src/main/kotlin/org/jetbrains/jewel/bridge/theme/IntUiBridge.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -807,6 +807,7 @@ private fun readDefaultTabStyle(): TabStyle {
.takeOrElse { 2.dp },
tabPadding = retrieveInsetsAsPaddingValues("TabbedPane.tabInsets"),
closeContentGap = 4.dp,
tabContentSpacing = 4.dp,
tabHeight = retrieveIntAsDpOrUnspecified("TabbedPane.tabHeight").takeOrElse { 24.dp },
),
icons = TabIcons(close = bridgePainterProvider("expui/general/closeSmall.svg")),
Expand All @@ -816,11 +817,11 @@ private fun readDefaultTabStyle(): TabStyle {
iconPressed = 1f,
iconHovered = 1f,
iconSelected = 1f,
labelNormal = 1f,
labelDisabled = 1f,
labelPressed = 1f,
labelHovered = 1f,
labelSelected = 1f,
contentNormal = 1f,
contentDisabled = 1f,
contentPressed = 1f,
contentHovered = 1f,
contentSelected = 1f,
),
)
}
Expand Down Expand Up @@ -856,6 +857,7 @@ private fun readEditorTabStyle(): TabStyle {
.takeOrElse { 2.dp },
tabPadding = retrieveInsetsAsPaddingValues("TabbedPane.tabInsets"),
closeContentGap = 4.dp,
tabContentSpacing = 4.dp,
tabHeight = retrieveIntAsDpOrUnspecified("TabbedPane.tabHeight")
.takeOrElse { 24.dp },
),
Expand All @@ -866,11 +868,11 @@ private fun readEditorTabStyle(): TabStyle {
iconPressed = 1f,
iconHovered = 1f,
iconSelected = 1f,
labelNormal = .7f,
labelDisabled = .7f,
labelPressed = 1f,
labelHovered = 1f,
labelSelected = 1f,
contentNormal = .7f,
contentDisabled = .7f,
contentPressed = 1f,
contentHovered = 1f,
contentSelected = 1f,
),
)
}
Expand Down
4 changes: 2 additions & 2 deletions int-ui/int-ui-standalone/api/int-ui-standalone.api
View file
Original file line number Diff line number Diff line change
Expand Up @@ -267,8 +267,8 @@ public final class org/jetbrains/jewel/intui/standalone/styling/IntUiTabStylingK
public static synthetic fun default$default (Lorg/jetbrains/jewel/ui/component/styling/TabContentAlpha$Companion;FFFFFFFFFFILjava/lang/Object;)Lorg/jetbrains/jewel/ui/component/styling/TabContentAlpha;
public static final fun defaults (Lorg/jetbrains/jewel/ui/component/styling/TabIcons$Companion;Lorg/jetbrains/jewel/ui/painter/PainterProvider;)Lorg/jetbrains/jewel/ui/component/styling/TabIcons;
public static synthetic fun defaults$default (Lorg/jetbrains/jewel/ui/component/styling/TabIcons$Companion;Lorg/jetbrains/jewel/ui/painter/PainterProvider;ILjava/lang/Object;)Lorg/jetbrains/jewel/ui/component/styling/TabIcons;
public static final fun defaults-u_T4Ytw (Lorg/jetbrains/jewel/ui/component/styling/TabMetrics$Companion;FLandroidx/compose/foundation/layout/PaddingValues;FF)Lorg/jetbrains/jewel/ui/component/styling/TabMetrics;
public static synthetic fun defaults-u_T4Ytw$default (Lorg/jetbrains/jewel/ui/component/styling/TabMetrics$Companion;FLandroidx/compose/foundation/layout/PaddingValues;FFILjava/lang/Object;)Lorg/jetbrains/jewel/ui/component/styling/TabMetrics;
public static final fun defaults-t6ZgxxQ (Lorg/jetbrains/jewel/ui/component/styling/TabMetrics$Companion;FLandroidx/compose/foundation/layout/PaddingValues;FFF)Lorg/jetbrains/jewel/ui/component/styling/TabMetrics;
public static synthetic fun defaults-t6ZgxxQ$default (Lorg/jetbrains/jewel/ui/component/styling/TabMetrics$Companion;FLandroidx/compose/foundation/layout/PaddingValues;FFFILjava/lang/Object;)Lorg/jetbrains/jewel/ui/component/styling/TabMetrics;
public static final fun editor (Lorg/jetbrains/jewel/ui/component/styling/TabContentAlpha$Companion;FFFFFFFFFF)Lorg/jetbrains/jewel/ui/component/styling/TabContentAlpha;
public static synthetic fun editor$default (Lorg/jetbrains/jewel/ui/component/styling/TabContentAlpha$Companion;FFFFFFFFFFILjava/lang/Object;)Lorg/jetbrains/jewel/ui/component/styling/TabContentAlpha;
public static final fun getDefault (Lorg/jetbrains/jewel/ui/component/styling/TabColors$Companion;)Lorg/jetbrains/jewel/intui/standalone/styling/IntUiDefaultTabColorsFactory;
Expand Down
43 changes: 22 additions & 21 deletions ...tandalone/src/main/kotlin/org/jetbrains/jewel/intui/standalone/styling/IntUiTabStyling.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -219,33 +219,34 @@ public fun TabMetrics.Companion.defaults(
underlineThickness: Dp = 3.dp,
tabPadding: PaddingValues = PaddingValues(horizontal = 8.dp),
closeContentGap: Dp = 8.dp,
tabContentSpacing: Dp = 4.dp,
tabHeight: Dp = 40.dp,
): TabMetrics =
TabMetrics(underlineThickness, tabPadding, tabHeight, closeContentGap)
TabMetrics(underlineThickness, tabPadding, tabHeight, tabContentSpacing, closeContentGap)

public fun TabContentAlpha.Companion.default(
iconNormal: Float = 1f,
iconDisabled: Float = iconNormal,
iconPressed: Float = iconNormal,
iconHovered: Float = iconNormal,
iconSelected: Float = iconNormal,
labelNormal: Float = iconNormal,
labelDisabled: Float = iconNormal,
labelPressed: Float = iconNormal,
labelHovered: Float = iconNormal,
labelSelected: Float = iconNormal,
contentNormal: Float = iconNormal,
contentDisabled: Float = iconNormal,
contentPressed: Float = iconNormal,
contentHovered: Float = iconNormal,
contentSelected: Float = iconNormal,
): TabContentAlpha =
TabContentAlpha(
iconNormal = iconNormal,
iconDisabled = iconDisabled,
iconPressed = iconPressed,
iconHovered = iconHovered,
iconSelected = iconSelected,
labelNormal = labelNormal,
labelDisabled = labelDisabled,
labelPressed = labelPressed,
labelHovered = labelHovered,
labelSelected = labelSelected,
contentNormal = contentNormal,
contentDisabled = contentDisabled,
contentPressed = contentPressed,
contentHovered = contentHovered,
contentSelected = contentSelected,
)

public fun TabContentAlpha.Companion.editor(
Expand All @@ -254,23 +255,23 @@ public fun TabContentAlpha.Companion.editor(
iconPressed: Float = 1f,
iconHovered: Float = iconPressed,
iconSelected: Float = iconPressed,
labelNormal: Float = .9f,
labelDisabled: Float = labelNormal,
labelPressed: Float = 1f,
labelHovered: Float = labelPressed,
labelSelected: Float = labelPressed,
contentNormal: Float = .9f,
contentDisabled: Float = contentNormal,
contentPressed: Float = 1f,
contentHovered: Float = contentPressed,
contentSelected: Float = contentPressed,
): TabContentAlpha =
TabContentAlpha(
iconNormal = iconNormal,
iconDisabled = iconDisabled,
iconPressed = iconPressed,
iconHovered = iconHovered,
iconSelected = iconSelected,
labelNormal = labelNormal,
labelDisabled = labelDisabled,
labelPressed = labelPressed,
labelHovered = labelHovered,
labelSelected = labelSelected,
contentNormal = contentNormal,
contentDisabled = contentDisabled,
contentPressed = contentPressed,
contentHovered = contentHovered,
contentSelected = contentSelected,
)

public fun TabIcons.Companion.defaults(
Expand Down
47 changes: 45 additions & 2 deletions .../standalone/src/main/kotlin/org/jetbrains/jewel/samples/standalone/view/component/Tabs.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@

package org.jetbrains.jewel.samples.standalone.view.component

import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
Expand All @@ -14,16 +15,21 @@ import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.drawWithCache
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import org.jetbrains.jewel.foundation.theme.JewelTheme
import org.jetbrains.jewel.samples.standalone.StandaloneSampleIcons
import org.jetbrains.jewel.samples.standalone.viewmodel.View
import org.jetbrains.jewel.ui.component.Icon
import org.jetbrains.jewel.ui.component.IconButton
import org.jetbrains.jewel.ui.component.SimpleTabContent
import org.jetbrains.jewel.ui.component.TabData
import org.jetbrains.jewel.ui.component.TabStrip
import org.jetbrains.jewel.ui.component.Text
import org.jetbrains.jewel.ui.painter.rememberResourcePainterProvider
import org.jetbrains.jewel.ui.theme.defaultTabStyle
import org.jetbrains.jewel.ui.util.thenIf
import kotlin.math.max

@Composable
Expand All @@ -48,7 +54,16 @@ private fun DefaultTabShowcase() {
tabIds.mapIndexed { index, id ->
TabData.Default(
selected = index == selectedTabIndex,
label = "Default tab $id",
content = {
val iconProvider =
rememberResourcePainterProvider("icons/search.svg", StandaloneSampleIcons::class.java)
val icon by iconProvider.getPainter()
SimpleTabContent(
state = it,
title = "Default Tab $id",
icon = icon,
)
},
onClose = {
tabIds = tabIds.toMutableList().apply { removeAt(index) }
if (selectedTabIndex >= index) {
Expand Down Expand Up @@ -83,7 +98,35 @@ private fun EditorTabShowcase() {
tabIds.mapIndexed { index, id ->
TabData.Editor(
selected = index == selectedTabIndex,
label = "Editor tab $id",
content = { tabState ->
Row {
SimpleTabContent(
modifier = Modifier,
state = tabState,
label = { Text("Editor tab $id") },
icon = {
Icon(
resource = "icons/search.svg",
contentDescription = "SearchIcon",
iconClass = StandaloneSampleIcons::class.java,
modifier = Modifier.size(16.dp).tabContentAlpha(state = tabState),
tint = Color.Magenta,
)
},
)
}
Box(
modifier = Modifier
.size(12.dp)
.thenIf(tabState.isHovered) {
drawWithCache {
onDrawBehind {
drawCircle(color = Color.Magenta.copy(alpha = .4f), radius = 6.dp.toPx())
}
}
},
)
},
onClose = {
tabIds = tabIds.toMutableList().apply { removeAt(index) }
if (selectedTabIndex >= index) {
Expand Down
45 changes: 28 additions & 17 deletions ui/api/ui.api
View file
Original file line number Diff line number Diff line change
Expand Up @@ -594,24 +594,30 @@ public final class org/jetbrains/jewel/ui/component/SplitLayoutKt {
public static final fun VerticalSplitLayout-BssWTFQ (Lkotlin/jvm/functions/Function3;Lkotlin/jvm/functions/Function3;Landroidx/compose/ui/Modifier;JFFFFFFLandroidx/compose/runtime/Composer;II)V
}

public abstract interface class org/jetbrains/jewel/ui/component/TabContentScope {
public abstract fun tabContentAlpha-A_ZS63w (Landroidx/compose/ui/Modifier;JLandroidx/compose/runtime/Composer;I)Landroidx/compose/ui/Modifier;
}

public final class org/jetbrains/jewel/ui/component/TabContentScope$DefaultImpls {
public static fun tabContentAlpha-A_ZS63w (Lorg/jetbrains/jewel/ui/component/TabContentScope;Landroidx/compose/ui/Modifier;JLandroidx/compose/runtime/Composer;I)Landroidx/compose/ui/Modifier;
}

public abstract class org/jetbrains/jewel/ui/component/TabData {
public static final field $stable I
public abstract fun getClosable ()Z
public abstract fun getIcon ()Landroidx/compose/ui/graphics/painter/Painter;
public abstract fun getLabel ()Ljava/lang/String;
public abstract fun getContent ()Lkotlin/jvm/functions/Function4;
public abstract fun getOnClick ()Lkotlin/jvm/functions/Function0;
public abstract fun getOnClose ()Lkotlin/jvm/functions/Function0;
public abstract fun getSelected ()Z
}

public final class org/jetbrains/jewel/ui/component/TabData$Default : org/jetbrains/jewel/ui/component/TabData {
public static final field $stable I
public fun <init> (ZLjava/lang/String;Landroidx/compose/ui/graphics/painter/Painter;ZLkotlin/jvm/functions/Function0;Lkotlin/jvm/functions/Function0;)V
public synthetic fun <init> (ZLjava/lang/String;Landroidx/compose/ui/graphics/painter/Painter;ZLkotlin/jvm/functions/Function0;Lkotlin/jvm/functions/Function0;ILkotlin/jvm/internal/DefaultConstructorMarker;)V
public fun <init> (ZLkotlin/jvm/functions/Function4;ZLkotlin/jvm/functions/Function0;Lkotlin/jvm/functions/Function0;)V
public synthetic fun <init> (ZLkotlin/jvm/functions/Function4;ZLkotlin/jvm/functions/Function0;Lkotlin/jvm/functions/Function0;ILkotlin/jvm/internal/DefaultConstructorMarker;)V
public fun equals (Ljava/lang/Object;)Z
public fun getClosable ()Z
public fun getIcon ()Landroidx/compose/ui/graphics/painter/Painter;
public fun getLabel ()Ljava/lang/String;
public fun getContent ()Lkotlin/jvm/functions/Function4;
public fun getOnClick ()Lkotlin/jvm/functions/Function0;
public fun getOnClose ()Lkotlin/jvm/functions/Function0;
public fun getSelected ()Z
Expand All @@ -621,12 +627,11 @@ public final class org/jetbrains/jewel/ui/component/TabData$Default : org/jetbra

public final class org/jetbrains/jewel/ui/component/TabData$Editor : org/jetbrains/jewel/ui/component/TabData {
public static final field $stable I
public fun <init> (ZLjava/lang/String;Landroidx/compose/ui/graphics/painter/Painter;ZLkotlin/jvm/functions/Function0;Lkotlin/jvm/functions/Function0;)V
public synthetic fun <init> (ZLjava/lang/String;Landroidx/compose/ui/graphics/painter/Painter;ZLkotlin/jvm/functions/Function0;Lkotlin/jvm/functions/Function0;ILkotlin/jvm/internal/DefaultConstructorMarker;)V
public fun <init> (ZLkotlin/jvm/functions/Function4;ZLkotlin/jvm/functions/Function0;Lkotlin/jvm/functions/Function0;)V
public synthetic fun <init> (ZLkotlin/jvm/functions/Function4;ZLkotlin/jvm/functions/Function0;Lkotlin/jvm/functions/Function0;ILkotlin/jvm/internal/DefaultConstructorMarker;)V
public fun equals (Ljava/lang/Object;)Z
public fun getClosable ()Z
public fun getIcon ()Landroidx/compose/ui/graphics/painter/Painter;
public fun getLabel ()Ljava/lang/String;
public fun getContent ()Lkotlin/jvm/functions/Function4;
public fun getOnClick ()Lkotlin/jvm/functions/Function0;
public fun getOnClose ()Lkotlin/jvm/functions/Function0;
public fun getSelected ()Z
Expand Down Expand Up @@ -704,6 +709,11 @@ public final class org/jetbrains/jewel/ui/component/TabStripState$Companion {
public static synthetic fun of-zFr0jqg$default (Lorg/jetbrains/jewel/ui/component/TabStripState$Companion;ZZZZZILjava/lang/Object;)J
}

public final class org/jetbrains/jewel/ui/component/TabsKt {
public static final fun SimpleTabContent-A5h6_LM (Lorg/jetbrains/jewel/ui/component/TabContentScope;Landroidx/compose/ui/Modifier;JLkotlin/jvm/functions/Function2;Lkotlin/jvm/functions/Function2;Landroidx/compose/runtime/Composer;II)V
public static final fun SimpleTabContent-A5h6_LM (Lorg/jetbrains/jewel/ui/component/TabContentScope;Ljava/lang/String;JLandroidx/compose/ui/graphics/painter/Painter;Landroidx/compose/ui/Modifier;Landroidx/compose/runtime/Composer;II)V
}

public final class org/jetbrains/jewel/ui/component/TextAreaKt {
public static final fun TextArea (Landroidx/compose/ui/text/input/TextFieldValue;Lkotlin/jvm/functions/Function1;Landroidx/compose/ui/Modifier;ZZLkotlin/jvm/functions/Function2;ZLorg/jetbrains/jewel/ui/Outline;Landroidx/compose/ui/text/input/VisualTransformation;Landroidx/compose/foundation/text/KeyboardOptions;Landroidx/compose/foundation/text/KeyboardActions;ILkotlin/jvm/functions/Function1;Lorg/jetbrains/jewel/ui/component/styling/TextAreaStyle;Landroidx/compose/ui/text/TextStyle;Landroidx/compose/foundation/interaction/MutableInteractionSource;Landroidx/compose/runtime/Composer;III)V
public static final fun TextArea (Ljava/lang/String;Lkotlin/jvm/functions/Function1;Landroidx/compose/ui/Modifier;ZZLorg/jetbrains/jewel/ui/Outline;Lkotlin/jvm/functions/Function2;ZLandroidx/compose/ui/text/input/VisualTransformation;Landroidx/compose/foundation/text/KeyboardOptions;Landroidx/compose/foundation/text/KeyboardActions;ILkotlin/jvm/functions/Function1;Lorg/jetbrains/jewel/ui/component/styling/TextAreaStyle;Landroidx/compose/ui/text/TextStyle;Landroidx/compose/foundation/interaction/MutableInteractionSource;Landroidx/compose/runtime/Composer;III)V
Expand Down Expand Up @@ -1796,20 +1806,20 @@ public final class org/jetbrains/jewel/ui/component/styling/TabContentAlpha {
public static final field $stable I
public static final field Companion Lorg/jetbrains/jewel/ui/component/styling/TabContentAlpha$Companion;
public fun <init> (FFFFFFFFFF)V
public final fun contentFor-UXw_FYk (JLandroidx/compose/runtime/Composer;I)Landroidx/compose/runtime/State;
public fun equals (Ljava/lang/Object;)Z
public final fun getContentDisabled ()F
public final fun getContentHovered ()F
public final fun getContentNormal ()F
public final fun getContentPressed ()F
public final fun getContentSelected ()F
public final fun getIconDisabled ()F
public final fun getIconHovered ()F
public final fun getIconNormal ()F
public final fun getIconPressed ()F
public final fun getIconSelected ()F
public final fun getLabelDisabled ()F
public final fun getLabelHovered ()F
public final fun getLabelNormal ()F
public final fun getLabelPressed ()F
public final fun getLabelSelected ()F
public fun hashCode ()I
public final fun iconFor-UXw_FYk (JLandroidx/compose/runtime/Composer;I)Landroidx/compose/runtime/State;
public final fun labelFor-UXw_FYk (JLandroidx/compose/runtime/Composer;I)Landroidx/compose/runtime/State;
public fun toString ()Ljava/lang/String;
}

Expand All @@ -1832,9 +1842,10 @@ public final class org/jetbrains/jewel/ui/component/styling/TabIcons$Companion {
public final class org/jetbrains/jewel/ui/component/styling/TabMetrics {
public static final field $stable I
public static final field Companion Lorg/jetbrains/jewel/ui/component/styling/TabMetrics$Companion;
public synthetic fun <init> (FLandroidx/compose/foundation/layout/PaddingValues;FFLkotlin/jvm/internal/DefaultConstructorMarker;)V
public synthetic fun <init> (FLandroidx/compose/foundation/layout/PaddingValues;FFFLkotlin/jvm/internal/DefaultConstructorMarker;)V
public fun equals (Ljava/lang/Object;)Z
public final fun getCloseContentGap-D9Ej5fM ()F
public final fun getTabContentSpacing-D9Ej5fM ()F
public final fun getTabHeight-D9Ej5fM ()F
public final fun getTabPadding ()Landroidx/compose/foundation/layout/PaddingValues;
public final fun getUnderlineThickness-D9Ej5fM ()F
Expand Down
Loading

0 comments on commit 2af35dc

Please sign in to comment.