From 484cd777b8c1a8ad71c225165a9300690180d819 Mon Sep 17 00:00:00 2001 From: Sebastiano Poggi Date: Mon, 1 Jul 2024 11:27:54 +0200 Subject: [PATCH] Fix default button focus outline & chip colors * The default button was missing spacing between its bg and the focus outline. Outlined buttons are unaffected. * The chips were drawing a double-outline when focused and selected. Now they only draw the selected outline if they are both focused and selected. * The chips didn't clearly signal the pressed and selected states. The background now reflects these states better (standalone only). There are no specs so we're going with a bit more freedom in the standalone version, as the Swing impl is quite lacking in polish still --- .../jewel/bridge/theme/BridgeGlobalMetrics.kt | 13 ++------ .../jewel/bridge/theme/IntUiBridge.kt | 7 ++++- .../api/int-ui-standalone.api | 16 +++++----- .../standalone/styling/IntUiButtonStyling.kt | 27 ++++++++++------- .../standalone/styling/IntUiChipStyling.kt | 28 ++++++++--------- ui/api/ui.api | 10 ++++--- .../kotlin/org/jetbrains/jewel/ui/Outline.kt | 6 ++-- .../jetbrains/jewel/ui/component/Button.kt | 15 ++++++---- .../org/jetbrains/jewel/ui/component/Chip.kt | 3 +- .../ui/component/styling/ButtonStyling.kt | 30 ++++++++++++++----- 10 files changed, 92 insertions(+), 63 deletions(-) diff --git a/ide-laf-bridge/src/main/kotlin/org/jetbrains/jewel/bridge/theme/BridgeGlobalMetrics.kt b/ide-laf-bridge/src/main/kotlin/org/jetbrains/jewel/bridge/theme/BridgeGlobalMetrics.kt index 3e8bd0d77..c81235388 100644 --- a/ide-laf-bridge/src/main/kotlin/org/jetbrains/jewel/bridge/theme/BridgeGlobalMetrics.kt +++ b/ide-laf-bridge/src/main/kotlin/org/jetbrains/jewel/bridge/theme/BridgeGlobalMetrics.kt @@ -4,18 +4,11 @@ import androidx.compose.ui.unit.dp import com.intellij.ide.ui.laf.darcula.DarculaUIUtil import com.intellij.ui.scale.JBUIScale import com.intellij.util.ui.JBUI -import com.intellij.util.ui.UIUtil import org.jetbrains.jewel.foundation.GlobalMetrics -public fun GlobalMetrics.Companion.readFromLaF(): GlobalMetrics { - // Copied from DarculaUIUtil.doPaint(java.awt.Graphics2D, int, int, float, float, boolean) - // except that scaling is all moved into the .dp operation below - val f = if (UIUtil.isRetina()) 0.5f else 1.0f - val lw = if (UIUtil.isUnderDefaultMacTheme()) f else DarculaUIUtil.LW.unscaled - - return GlobalMetrics( - outlineWidth = (DarculaUIUtil.BW.unscaled + lw).dp, +public fun GlobalMetrics.Companion.readFromLaF(): GlobalMetrics = + GlobalMetrics( + outlineWidth = DarculaUIUtil.BW.unscaled.dp, // The rowHeight() function returns a scaled value, but we need the base value rowHeight = (JBUI.CurrentTheme.List.rowHeight() / JBUIScale.scale(1f)).dp, ) -} diff --git a/ide-laf-bridge/src/main/kotlin/org/jetbrains/jewel/bridge/theme/IntUiBridge.kt b/ide-laf-bridge/src/main/kotlin/org/jetbrains/jewel/bridge/theme/IntUiBridge.kt index ccb4bfd3c..869b78156 100644 --- a/ide-laf-bridge/src/main/kotlin/org/jetbrains/jewel/bridge/theme/IntUiBridge.kt +++ b/ide-laf-bridge/src/main/kotlin/org/jetbrains/jewel/bridge/theme/IntUiBridge.kt @@ -46,6 +46,7 @@ import org.jetbrains.jewel.bridge.toDpSize import org.jetbrains.jewel.bridge.toPaddingValues import org.jetbrains.jewel.foundation.GlobalColors import org.jetbrains.jewel.foundation.GlobalMetrics +import org.jetbrains.jewel.foundation.Stroke import org.jetbrains.jewel.foundation.theme.ThemeColorPalette import org.jetbrains.jewel.foundation.theme.ThemeDefinition import org.jetbrains.jewel.foundation.theme.ThemeIconData @@ -282,8 +283,10 @@ private fun readDefaultButtonStyle(): ButtonStyle { cornerSize = retrieveArcAsCornerSizeWithFallbacks("Button.default.arc", "Button.arc"), padding = PaddingValues(horizontal = 14.dp), // see DarculaButtonUI.HORIZONTAL_PADDING minSize = DpSize(minimumSize.width, minimumSize.height), - borderWidth = DarculaUIUtil.LW.dp, + borderWidth = 1.dp, + focusOutlineExpand = 1.5.dp, // From DarculaButtonPainter.getBorderInsets ), + focusOutlineAlignment = Stroke.Alignment.Center, ) } @@ -330,7 +333,9 @@ private fun readOutlinedButtonStyle(): ButtonStyle { padding = PaddingValues(horizontal = 14.dp), // see DarculaButtonUI.HORIZONTAL_PADDING minSize = DpSize(minimumSize.width, minimumSize.height), borderWidth = DarculaUIUtil.LW.dp, + focusOutlineExpand = Dp.Unspecified, ), + focusOutlineAlignment = Stroke.Alignment.Center, ) } diff --git a/int-ui/int-ui-standalone/api/int-ui-standalone.api b/int-ui/int-ui-standalone/api/int-ui-standalone.api index bc32ffa9d..f3870f959 100644 --- a/int-ui/int-ui-standalone/api/int-ui-standalone.api +++ b/int-ui/int-ui-standalone/api/int-ui-standalone.api @@ -39,14 +39,14 @@ public final class org/jetbrains/jewel/intui/standalone/StandalonePainterHintsPr } public final class org/jetbrains/jewel/intui/standalone/styling/IntUiButtonStylingKt { - public static final fun default-H1KY9o8 (Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics$Companion;Landroidx/compose/foundation/shape/CornerSize;Landroidx/compose/foundation/layout/PaddingValues;JF)Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics; - public static synthetic fun default-H1KY9o8$default (Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics$Companion;Landroidx/compose/foundation/shape/CornerSize;Landroidx/compose/foundation/layout/PaddingValues;JFILjava/lang/Object;)Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics; + public static final fun default-Kzyhx1A (Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics$Companion;Landroidx/compose/foundation/shape/CornerSize;Landroidx/compose/foundation/layout/PaddingValues;JFF)Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics; + public static synthetic fun default-Kzyhx1A$default (Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics$Companion;Landroidx/compose/foundation/shape/CornerSize;Landroidx/compose/foundation/layout/PaddingValues;JFFILjava/lang/Object;)Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics; public static final fun getDefault (Lorg/jetbrains/jewel/ui/component/styling/ButtonColors$Companion;)Lorg/jetbrains/jewel/intui/standalone/styling/IntUiDefaultButtonColorFactory; public static final fun getDefault (Lorg/jetbrains/jewel/ui/component/styling/ButtonStyle$Companion;)Lorg/jetbrains/jewel/intui/standalone/styling/IntUiDefaultButtonStyleFactory; public static final fun getOutlined (Lorg/jetbrains/jewel/ui/component/styling/ButtonColors$Companion;)Lorg/jetbrains/jewel/intui/standalone/styling/IntUiOutlinedButtonColorFactory; public static final fun getOutlined (Lorg/jetbrains/jewel/ui/component/styling/ButtonStyle$Companion;)Lorg/jetbrains/jewel/intui/standalone/styling/IntUiOutlinedButtonStyleFactory; - public static final fun outlined-H1KY9o8 (Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics$Companion;Landroidx/compose/foundation/shape/CornerSize;Landroidx/compose/foundation/layout/PaddingValues;JF)Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics; - public static synthetic fun outlined-H1KY9o8$default (Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics$Companion;Landroidx/compose/foundation/shape/CornerSize;Landroidx/compose/foundation/layout/PaddingValues;JFILjava/lang/Object;)Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics; + public static final fun outlined-Kzyhx1A (Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics$Companion;Landroidx/compose/foundation/shape/CornerSize;Landroidx/compose/foundation/layout/PaddingValues;JFF)Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics; + public static synthetic fun outlined-Kzyhx1A$default (Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics$Companion;Landroidx/compose/foundation/shape/CornerSize;Landroidx/compose/foundation/layout/PaddingValues;JFFILjava/lang/Object;)Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics; } public final class org/jetbrains/jewel/intui/standalone/styling/IntUiCheckboxStylingKt { @@ -86,8 +86,8 @@ public final class org/jetbrains/jewel/intui/standalone/styling/IntUiDefaultButt public final class org/jetbrains/jewel/intui/standalone/styling/IntUiDefaultButtonStyleFactory { public static final field $stable I public static final field INSTANCE Lorg/jetbrains/jewel/intui/standalone/styling/IntUiDefaultButtonStyleFactory; - public final fun dark (Lorg/jetbrains/jewel/ui/component/styling/ButtonColors;Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics;Landroidx/compose/runtime/Composer;II)Lorg/jetbrains/jewel/ui/component/styling/ButtonStyle; - public final fun light (Lorg/jetbrains/jewel/ui/component/styling/ButtonColors;Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics;Landroidx/compose/runtime/Composer;II)Lorg/jetbrains/jewel/ui/component/styling/ButtonStyle; + public final fun dark (Lorg/jetbrains/jewel/ui/component/styling/ButtonColors;Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics;Lorg/jetbrains/jewel/foundation/Stroke$Alignment;Landroidx/compose/runtime/Composer;II)Lorg/jetbrains/jewel/ui/component/styling/ButtonStyle; + public final fun light (Lorg/jetbrains/jewel/ui/component/styling/ButtonColors;Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics;Lorg/jetbrains/jewel/foundation/Stroke$Alignment;Landroidx/compose/runtime/Composer;II)Lorg/jetbrains/jewel/ui/component/styling/ButtonStyle; } public final class org/jetbrains/jewel/intui/standalone/styling/IntUiDefaultDropdownColorsFactory { @@ -232,8 +232,8 @@ public final class org/jetbrains/jewel/intui/standalone/styling/IntUiOutlinedBut public final class org/jetbrains/jewel/intui/standalone/styling/IntUiOutlinedButtonStyleFactory { public static final field $stable I public static final field INSTANCE Lorg/jetbrains/jewel/intui/standalone/styling/IntUiOutlinedButtonStyleFactory; - public final fun dark (Lorg/jetbrains/jewel/ui/component/styling/ButtonColors;Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics;Landroidx/compose/runtime/Composer;II)Lorg/jetbrains/jewel/ui/component/styling/ButtonStyle; - public final fun light (Lorg/jetbrains/jewel/ui/component/styling/ButtonColors;Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics;Landroidx/compose/runtime/Composer;II)Lorg/jetbrains/jewel/ui/component/styling/ButtonStyle; + public final fun dark (Lorg/jetbrains/jewel/ui/component/styling/ButtonColors;Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics;Lorg/jetbrains/jewel/foundation/Stroke$Alignment;Landroidx/compose/runtime/Composer;II)Lorg/jetbrains/jewel/ui/component/styling/ButtonStyle; + public final fun light (Lorg/jetbrains/jewel/ui/component/styling/ButtonColors;Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics;Lorg/jetbrains/jewel/foundation/Stroke$Alignment;Landroidx/compose/runtime/Composer;II)Lorg/jetbrains/jewel/ui/component/styling/ButtonStyle; } public final class org/jetbrains/jewel/intui/standalone/styling/IntUiRadioButtonStylingKt { diff --git a/int-ui/int-ui-standalone/src/main/kotlin/org/jetbrains/jewel/intui/standalone/styling/IntUiButtonStyling.kt b/int-ui/int-ui-standalone/src/main/kotlin/org/jetbrains/jewel/intui/standalone/styling/IntUiButtonStyling.kt index c18e2770b..a5495b69e 100644 --- a/int-ui/int-ui-standalone/src/main/kotlin/org/jetbrains/jewel/intui/standalone/styling/IntUiButtonStyling.kt +++ b/int-ui/int-ui-standalone/src/main/kotlin/org/jetbrains/jewel/intui/standalone/styling/IntUiButtonStyling.kt @@ -9,6 +9,7 @@ import androidx.compose.ui.graphics.SolidColor import androidx.compose.ui.unit.Dp import androidx.compose.ui.unit.DpSize import androidx.compose.ui.unit.dp +import org.jetbrains.jewel.foundation.Stroke import org.jetbrains.jewel.intui.core.theme.IntUiDarkTheme import org.jetbrains.jewel.intui.core.theme.IntUiLightTheme import org.jetbrains.jewel.ui.component.styling.ButtonColors @@ -23,13 +24,15 @@ public object IntUiDefaultButtonStyleFactory { public fun light( colors: ButtonColors = ButtonColors.Default.light(), metrics: ButtonMetrics = ButtonMetrics.default(), - ): ButtonStyle = ButtonStyle(colors, metrics) + focusOutlineAlignment: Stroke.Alignment = Stroke.Alignment.Center, + ): ButtonStyle = ButtonStyle(colors, metrics, focusOutlineAlignment) @Composable public fun dark( colors: ButtonColors = ButtonColors.Default.dark(), metrics: ButtonMetrics = ButtonMetrics.default(), - ): ButtonStyle = ButtonStyle(colors, metrics) + focusOutlineAlignment: Stroke.Alignment = Stroke.Alignment.Center, + ): ButtonStyle = ButtonStyle(colors, metrics, focusOutlineAlignment) } public val ButtonStyle.Companion.Outlined: IntUiOutlinedButtonStyleFactory @@ -40,13 +43,15 @@ public object IntUiOutlinedButtonStyleFactory { public fun light( colors: ButtonColors = ButtonColors.Outlined.light(), metrics: ButtonMetrics = ButtonMetrics.outlined(), - ): ButtonStyle = ButtonStyle(colors, metrics) + focusOutlineAlignment: Stroke.Alignment = Stroke.Alignment.Center, + ): ButtonStyle = ButtonStyle(colors, metrics, focusOutlineAlignment) @Composable public fun dark( colors: ButtonColors = ButtonColors.Outlined.dark(), metrics: ButtonMetrics = ButtonMetrics.outlined(), - ): ButtonStyle = ButtonStyle(colors, metrics) + focusOutlineAlignment: Stroke.Alignment = Stroke.Alignment.Center, + ): ButtonStyle = ButtonStyle(colors, metrics, focusOutlineAlignment) } public val ButtonColors.Companion.Default: IntUiDefaultButtonColorFactory @@ -67,8 +72,8 @@ public object IntUiDefaultButtonColorFactory { contentHovered: Color = IntUiLightTheme.colors.grey(14), border: Brush = SolidColor(IntUiLightTheme.colors.blue(4)), borderDisabled: Brush = SolidColor(IntUiLightTheme.colors.grey(12)), - borderFocused: Brush = SolidColor(IntUiLightTheme.colors.blue(4)), - borderPressed: Brush = border, + borderFocused: Brush = SolidColor(IntUiLightTheme.colors.grey(14)), + borderPressed: Brush = borderFocused, borderHovered: Brush = border, ): ButtonColors = ButtonColors( @@ -104,7 +109,7 @@ public object IntUiDefaultButtonColorFactory { border: Brush = SolidColor(IntUiDarkTheme.colors.blue(6)), borderDisabled: Brush = SolidColor(IntUiDarkTheme.colors.grey(5)), borderFocused: Brush = SolidColor(IntUiDarkTheme.colors.grey(1)), - borderPressed: Brush = border, + borderPressed: Brush = borderFocused, borderHovered: Brush = border, ): ButtonColors = ButtonColors( @@ -207,12 +212,14 @@ public fun ButtonMetrics.Companion.default( cornerSize: CornerSize = CornerSize(4.dp), padding: PaddingValues = PaddingValues(horizontal = 12.dp, vertical = 6.dp), minSize: DpSize = DpSize(72.dp, 28.dp), - borderWidth: Dp = 0.dp, -): ButtonMetrics = ButtonMetrics(cornerSize, padding, minSize, borderWidth) + borderWidth: Dp = 1.dp, + focusOutlineExpand: Dp = 1.5.dp, +): ButtonMetrics = ButtonMetrics(cornerSize, padding, minSize, borderWidth, focusOutlineExpand) public fun ButtonMetrics.Companion.outlined( cornerSize: CornerSize = CornerSize(4.dp), padding: PaddingValues = PaddingValues(horizontal = 12.dp, vertical = 6.dp), minSize: DpSize = DpSize(72.dp, 28.dp), borderWidth: Dp = 1.dp, -): ButtonMetrics = ButtonMetrics(cornerSize, padding, minSize, borderWidth) + focusOutlineExpand: Dp = Dp.Unspecified, +): ButtonMetrics = ButtonMetrics(cornerSize, padding, minSize, borderWidth, focusOutlineExpand) diff --git a/int-ui/int-ui-standalone/src/main/kotlin/org/jetbrains/jewel/intui/standalone/styling/IntUiChipStyling.kt b/int-ui/int-ui-standalone/src/main/kotlin/org/jetbrains/jewel/intui/standalone/styling/IntUiChipStyling.kt index 9bef42bfc..a2da9c8f6 100644 --- a/int-ui/int-ui-standalone/src/main/kotlin/org/jetbrains/jewel/intui/standalone/styling/IntUiChipStyling.kt +++ b/int-ui/int-ui-standalone/src/main/kotlin/org/jetbrains/jewel/intui/standalone/styling/IntUiChipStyling.kt @@ -31,13 +31,13 @@ public fun ChipColors.Companion.light( background: Brush = SolidColor(IntUiLightTheme.colors.grey(14)), backgroundDisabled: Brush = SolidColor(IntUiLightTheme.colors.grey(12)), backgroundFocused: Brush = background, - backgroundPressed: Brush = SolidColor(IntUiLightTheme.colors.grey(13)), + backgroundPressed: Brush = SolidColor(IntUiLightTheme.colors.grey(11)), backgroundHovered: Brush = background, - backgroundSelected: Brush = background, + backgroundSelected: Brush = SolidColor(IntUiLightTheme.colors.grey(13)), backgroundSelectedDisabled: Brush = backgroundDisabled, - backgroundSelectedFocused: Brush = background, - backgroundSelectedPressed: Brush = background, - backgroundSelectedHovered: Brush = background, + backgroundSelectedFocused: Brush = backgroundSelected, + backgroundSelectedPressed: Brush = backgroundPressed, + backgroundSelectedHovered: Brush = backgroundSelected, content: Color = IntUiLightTheme.colors.grey(1), contentDisabled: Color = IntUiLightTheme.colors.grey(8), contentFocused: Color = content, @@ -49,12 +49,12 @@ public fun ChipColors.Companion.light( contentSelectedPressed: Color = content, contentSelectedHovered: Color = content, border: Color = IntUiLightTheme.colors.grey(9), - borderDisabled: Color = IntUiLightTheme.colors.grey(6), + borderDisabled: Color = IntUiLightTheme.colors.grey(11), borderFocused: Color = IntUiLightTheme.colors.blue(4), borderPressed: Color = IntUiLightTheme.colors.grey(7), borderHovered: Color = IntUiLightTheme.colors.grey(8), borderSelected: Color = IntUiLightTheme.colors.blue(4), - borderSelectedDisabled: Color = borderSelected, + borderSelectedDisabled: Color = borderDisabled, borderSelectedFocused: Color = borderSelected, borderSelectedPressed: Color = borderSelected, borderSelectedHovered: Color = borderSelected, @@ -95,15 +95,15 @@ public fun ChipColors.Companion.light( @Composable public fun ChipColors.Companion.dark( background: Brush = SolidColor(IntUiDarkTheme.colors.grey(2)), - backgroundDisabled: Brush = SolidColor(IntUiDarkTheme.colors.grey(5)), + backgroundDisabled: Brush = SolidColor(IntUiDarkTheme.colors.grey(4)), backgroundFocused: Brush = background, - backgroundPressed: Brush = background, + backgroundPressed: Brush = SolidColor(IntUiDarkTheme.colors.grey(5)), backgroundHovered: Brush = background, - backgroundSelected: Brush = background, + backgroundSelected: Brush = SolidColor(IntUiDarkTheme.colors.grey(3)), backgroundSelectedDisabled: Brush = backgroundDisabled, - backgroundSelectedFocused: Brush = background, - backgroundSelectedPressed: Brush = background, - backgroundSelectedHovered: Brush = background, + backgroundSelectedFocused: Brush = backgroundSelected, + backgroundSelectedPressed: Brush = backgroundPressed, + backgroundSelectedHovered: Brush = backgroundSelected, content: Color = IntUiDarkTheme.colors.grey(12), contentDisabled: Color = IntUiDarkTheme.colors.grey(8), contentFocused: Color = content, @@ -120,7 +120,7 @@ public fun ChipColors.Companion.dark( borderPressed: Color = IntUiDarkTheme.colors.grey(7), borderHovered: Color = borderPressed, borderSelected: Color = IntUiDarkTheme.colors.blue(6), - borderSelectedDisabled: Color = borderSelected, + borderSelectedDisabled: Color = borderDisabled, borderSelectedFocused: Color = borderSelected, borderSelectedPressed: Color = borderSelected, borderSelectedHovered: Color = borderSelected, diff --git a/ui/api/ui.api b/ui/api/ui.api index 96cbb28ea..24e7ee26a 100644 --- a/ui/api/ui.api +++ b/ui/api/ui.api @@ -91,8 +91,8 @@ public final class org/jetbrains/jewel/ui/Outline$Companion { } public final class org/jetbrains/jewel/ui/OutlineKt { - public static final fun focusOutline-FJfuzF0 (Landroidx/compose/ui/Modifier;Lorg/jetbrains/jewel/foundation/state/FocusableComponentState;Landroidx/compose/ui/graphics/Shape;Lorg/jetbrains/jewel/foundation/Stroke$Alignment;FLandroidx/compose/runtime/Composer;II)Landroidx/compose/ui/Modifier; - public static final fun focusOutline-FJfuzF0 (Landroidx/compose/ui/Modifier;ZLandroidx/compose/ui/graphics/Shape;Lorg/jetbrains/jewel/foundation/Stroke$Alignment;FLandroidx/compose/runtime/Composer;II)Landroidx/compose/ui/Modifier; + public static final fun focusOutline-AGcomas (Landroidx/compose/ui/Modifier;Lorg/jetbrains/jewel/foundation/state/FocusableComponentState;Landroidx/compose/ui/graphics/Shape;Lorg/jetbrains/jewel/foundation/Stroke$Alignment;FFLandroidx/compose/runtime/Composer;II)Landroidx/compose/ui/Modifier; + public static final fun focusOutline-AGcomas (Landroidx/compose/ui/Modifier;ZLandroidx/compose/ui/graphics/Shape;Lorg/jetbrains/jewel/foundation/Stroke$Alignment;FFLandroidx/compose/runtime/Composer;II)Landroidx/compose/ui/Modifier; public static final fun outline-HYR8e34 (Landroidx/compose/ui/Modifier;Lorg/jetbrains/jewel/foundation/state/FocusableComponentState;Lorg/jetbrains/jewel/ui/Outline;Landroidx/compose/ui/graphics/Shape;Lorg/jetbrains/jewel/foundation/Stroke$Alignment;FLandroidx/compose/runtime/Composer;II)Landroidx/compose/ui/Modifier; } @@ -796,10 +796,11 @@ public final class org/jetbrains/jewel/ui/component/styling/ButtonColors$Compani public final class org/jetbrains/jewel/ui/component/styling/ButtonMetrics { public static final field $stable I public static final field Companion Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics$Companion; - public synthetic fun (Landroidx/compose/foundation/shape/CornerSize;Landroidx/compose/foundation/layout/PaddingValues;JFLkotlin/jvm/internal/DefaultConstructorMarker;)V + public synthetic fun (Landroidx/compose/foundation/shape/CornerSize;Landroidx/compose/foundation/layout/PaddingValues;JFFLkotlin/jvm/internal/DefaultConstructorMarker;)V public fun equals (Ljava/lang/Object;)Z public final fun getBorderWidth-D9Ej5fM ()F public final fun getCornerSize ()Landroidx/compose/foundation/shape/CornerSize; + public final fun getFocusOutlineExpand-D9Ej5fM ()F public final fun getMinSize-MYxV2XQ ()J public final fun getPadding ()Landroidx/compose/foundation/layout/PaddingValues; public fun hashCode ()I @@ -812,9 +813,10 @@ public final class org/jetbrains/jewel/ui/component/styling/ButtonMetrics$Compan public final class org/jetbrains/jewel/ui/component/styling/ButtonStyle { public static final field $stable I public static final field Companion Lorg/jetbrains/jewel/ui/component/styling/ButtonStyle$Companion; - public fun (Lorg/jetbrains/jewel/ui/component/styling/ButtonColors;Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics;)V + public fun (Lorg/jetbrains/jewel/ui/component/styling/ButtonColors;Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics;Lorg/jetbrains/jewel/foundation/Stroke$Alignment;)V public fun equals (Ljava/lang/Object;)Z public final fun getColors ()Lorg/jetbrains/jewel/ui/component/styling/ButtonColors; + public final fun getFocusOutlineAlignment ()Lorg/jetbrains/jewel/foundation/Stroke$Alignment; public final fun getMetrics ()Lorg/jetbrains/jewel/ui/component/styling/ButtonMetrics; public fun hashCode ()I public fun toString ()Ljava/lang/String; diff --git a/ui/src/main/kotlin/org/jetbrains/jewel/ui/Outline.kt b/ui/src/main/kotlin/org/jetbrains/jewel/ui/Outline.kt index eb20dacb2..8111cfdf7 100644 --- a/ui/src/main/kotlin/org/jetbrains/jewel/ui/Outline.kt +++ b/ui/src/main/kotlin/org/jetbrains/jewel/ui/Outline.kt @@ -35,7 +35,8 @@ public fun Modifier.focusOutline( outlineShape: Shape, alignment: Stroke.Alignment = Stroke.Alignment.Outside, outlineWidth: Dp = JewelTheme.globalMetrics.outlineWidth, -): Modifier = focusOutline(state.isFocused, outlineShape, alignment, outlineWidth) + expand: Dp = Dp.Unspecified, +): Modifier = focusOutline(state.isFocused, outlineShape, alignment, outlineWidth, expand) @Composable public fun Modifier.focusOutline( @@ -43,12 +44,13 @@ public fun Modifier.focusOutline( outlineShape: Shape, alignment: Stroke.Alignment = Stroke.Alignment.Outside, outlineWidth: Dp = JewelTheme.globalMetrics.outlineWidth, + expand: Dp = Dp.Unspecified, ): Modifier { val outlineColors = JewelTheme.globalColors.outlines return thenIf(showOutline) { val outlineColor = outlineColors.focused - border(alignment, outlineWidth, outlineColor, outlineShape) + border(alignment, outlineWidth, outlineColor, outlineShape, expand) } } diff --git a/ui/src/main/kotlin/org/jetbrains/jewel/ui/component/Button.kt b/ui/src/main/kotlin/org/jetbrains/jewel/ui/component/Button.kt index 30a6628ab..53b0460cc 100644 --- a/ui/src/main/kotlin/org/jetbrains/jewel/ui/component/Button.kt +++ b/ui/src/main/kotlin/org/jetbrains/jewel/ui/component/Button.kt @@ -58,8 +58,8 @@ public fun DefaultButton( enabled = enabled, interactionSource = interactionSource, style = style, - content = content, textStyle = textStyle, + content = content, ) } @@ -79,8 +79,8 @@ public fun OutlinedButton( enabled = enabled, interactionSource = interactionSource, style = style, - content = content, textStyle = textStyle, + content = content, ) } @@ -92,7 +92,7 @@ private fun ButtonImpl( interactionSource: MutableInteractionSource, style: ButtonStyle, textStyle: TextStyle, - content: @Composable RowScope.() -> Unit, + content: @Composable (RowScope.() -> Unit), ) { var buttonState by remember(interactionSource) { mutableStateOf(ButtonState.of(enabled = enabled)) @@ -130,8 +130,13 @@ private fun ButtonImpl( indication = null, ) .background(colors.backgroundFor(buttonState).value, shape) - .border(Stroke.Alignment.Center, style.metrics.borderWidth, borderColor, shape) - .focusOutline(buttonState, shape), + .focusOutline( + state = buttonState, + outlineShape = shape, + alignment = style.focusOutlineAlignment, + expand = style.metrics.focusOutlineExpand, + ) + .border(Stroke.Alignment.Center, style.metrics.borderWidth, borderColor, shape), propagateMinConstraints = true, ) { val contentColor by colors.contentFor(buttonState) diff --git a/ui/src/main/kotlin/org/jetbrains/jewel/ui/component/Chip.kt b/ui/src/main/kotlin/org/jetbrains/jewel/ui/component/Chip.kt index f11959750..564929ffa 100644 --- a/ui/src/main/kotlin/org/jetbrains/jewel/ui/component/Chip.kt +++ b/ui/src/main/kotlin/org/jetbrains/jewel/ui/component/Chip.kt @@ -39,6 +39,7 @@ import org.jetbrains.jewel.foundation.theme.LocalContentColor import org.jetbrains.jewel.ui.component.styling.ChipStyle import org.jetbrains.jewel.ui.focusOutline import org.jetbrains.jewel.ui.theme.chipStyle +import org.jetbrains.jewel.ui.util.thenIf @Composable public fun Chip( @@ -166,7 +167,7 @@ private fun ChipImpl( modifier = modifier .background(colors.backgroundFor(chipState).value, shape) - .border(Stroke.Alignment.Center, borderWidth, borderColor, shape) + .thenIf(!chipState.isFocused) { border(Stroke.Alignment.Center, borderWidth, borderColor, shape) } .focusOutline(chipState, shape) .padding(style.metrics.padding), verticalAlignment = Alignment.CenterVertically, diff --git a/ui/src/main/kotlin/org/jetbrains/jewel/ui/component/styling/ButtonStyling.kt b/ui/src/main/kotlin/org/jetbrains/jewel/ui/component/styling/ButtonStyling.kt index 297263f45..b4f562e12 100644 --- a/ui/src/main/kotlin/org/jetbrains/jewel/ui/component/styling/ButtonStyling.kt +++ b/ui/src/main/kotlin/org/jetbrains/jewel/ui/component/styling/ButtonStyling.kt @@ -14,6 +14,8 @@ import androidx.compose.ui.graphics.Color import androidx.compose.ui.unit.Dp import androidx.compose.ui.unit.DpSize import org.jetbrains.jewel.foundation.GenerateDataFunctions +import org.jetbrains.jewel.foundation.Stroke +import org.jetbrains.jewel.foundation.theme.JewelTheme import org.jetbrains.jewel.ui.component.ButtonState @Stable @@ -21,6 +23,7 @@ import org.jetbrains.jewel.ui.component.ButtonState public class ButtonStyle( public val colors: ButtonColors, public val metrics: ButtonMetrics, + public val focusOutlineAlignment: Stroke.Alignment, ) { public companion object } @@ -73,14 +76,24 @@ public class ButtonColors( @Composable public fun borderFor(state: ButtonState): State = rememberUpdatedState( - state.chooseValue( - normal = border, - disabled = borderDisabled, - focused = borderFocused, - pressed = borderPressed, - hovered = borderHovered, - active = border, - ), + if (JewelTheme.isSwingCompatMode) { + state.chooseValue( + normal = border, + disabled = borderDisabled, + focused = borderFocused, + pressed = borderPressed, + hovered = borderHovered, + active = border, + ) + } else { + when { + !state.isEnabled -> borderDisabled + state.isFocused -> borderFocused + state.isPressed -> borderPressed + state.isHovered -> borderHovered + else -> border + } + }, ) public companion object @@ -93,6 +106,7 @@ public class ButtonMetrics( public val padding: PaddingValues, public val minSize: DpSize, public val borderWidth: Dp, + public val focusOutlineExpand: Dp, ) { public companion object }