Show how to create icons in standalone sample (#139)

Also clean up related code
JetBrains · Sep 29, 2023 · 551d824 · 551d824
1 parent 1aa5d1d
commit 551d824
Show file tree

Hide file tree

Showing 8 changed files with 160 additions and 76 deletions.
diff --git a/core/src/main/kotlin/org/jetbrains/jewel/Icon.kt b/core/src/main/kotlin/org/jetbrains/jewel/Icon.kt
@@ -90,22 +90,6 @@ fun Icon(
     )
 }
 
-@Composable
-fun Icon(
-    resource: String,
-    contentDescription: String?,
-    modifier: Modifier = Modifier,
-    resourceLoader: ResourceLoader = LocalResourceLoader.current,
-    tint: Color = Color.Unspecified,
-) {
-    Icon(
-        painter = painterResource(resource, resourceLoader),
-        contentDescription = contentDescription,
-        modifier = modifier,
-        tint = tint,
-    )
-}
-
 /**
  * Icon component that draws a [painter] using [tint], defaulting to
  * [Color.Unspecified]

diff --git a/core/src/main/kotlin/org/jetbrains/jewel/NoIndication.kt b/core/src/main/kotlin/org/jetbrains/jewel/NoIndication.kt
@@ -0,0 +1,21 @@
+package org.jetbrains.jewel
+
+import androidx.compose.foundation.Indication
+import androidx.compose.foundation.IndicationInstance
+import androidx.compose.foundation.interaction.InteractionSource
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.graphics.drawscope.ContentDrawScope
+
+object NoIndication : Indication {
+
+    private object NoIndicationInstance : IndicationInstance {
+
+        override fun ContentDrawScope.drawIndication() {
+            drawContent()
+        }
+    }
+
+    @Composable
+    override fun rememberUpdatedInstance(interactionSource: InteractionSource): IndicationInstance =
+        NoIndicationInstance
+}
diff --git a/core/src/main/kotlin/org/jetbrains/jewel/Tabs.kt b/core/src/main/kotlin/org/jetbrains/jewel/Tabs.kt
@@ -1,13 +1,10 @@
 package org.jetbrains.jewel
 
 import androidx.compose.foundation.Image
-import androidx.compose.foundation.Indication
-import androidx.compose.foundation.IndicationInstance
 import androidx.compose.foundation.LocalIndication
 import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.interaction.HoverInteraction
-import androidx.compose.foundation.interaction.InteractionSource
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.interaction.PressInteraction
 import androidx.compose.foundation.layout.Arrangement
@@ -33,7 +30,6 @@ import androidx.compose.ui.draw.drawBehind
 import androidx.compose.ui.geometry.Offset
 import androidx.compose.ui.graphics.SolidColor
 import androidx.compose.ui.graphics.StrokeCap
-import androidx.compose.ui.graphics.drawscope.ContentDrawScope
 import androidx.compose.ui.input.pointer.PointerEventType
 import androidx.compose.ui.input.pointer.isTertiary
 import androidx.compose.ui.input.pointer.onPointerEvent
@@ -165,21 +161,6 @@ internal fun TabImpl(
     }
 }
 
-private object NoIndication : Indication {
-    private object NoIndicationInstance : IndicationInstance {
-
-        override fun ContentDrawScope.drawIndication() {
-            drawContent()
-        }
-    }
-
-    @Suppress("ExpressionBodySyntax")
-    @Composable
-    override fun rememberUpdatedInstance(interactionSource: InteractionSource): IndicationInstance {
-        return NoIndicationInstance
-    }
-}
-
 @Immutable
 @JvmInline
 value class TabState(val state: ULong) : SelectableComponentState {

diff --git a/int-ui/int-ui-core/src/main/kotlin/org/jetbrains/jewel/intui/core/BaseIntUiTheme.kt b/int-ui/int-ui-core/src/main/kotlin/org/jetbrains/jewel/intui/core/BaseIntUiTheme.kt
@@ -1,15 +1,11 @@
 package org.jetbrains.jewel.intui.core
 
-import androidx.compose.foundation.Indication
-import androidx.compose.foundation.IndicationInstance
 import androidx.compose.foundation.LocalContextMenuRepresentation
 import androidx.compose.foundation.LocalIndication
-import androidx.compose.foundation.interaction.InteractionSource
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.ReadOnlyComposable
 import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.graphics.drawscope.ContentDrawScope
 import androidx.compose.ui.text.TextStyle
 import org.jetbrains.jewel.GlobalColors
 import org.jetbrains.jewel.GlobalMetrics
@@ -19,6 +15,7 @@ import org.jetbrains.jewel.IntelliJTheme
 import org.jetbrains.jewel.IntelliJThemeIconData
 import org.jetbrains.jewel.LocalColorPalette
 import org.jetbrains.jewel.LocalIconData
+import org.jetbrains.jewel.NoIndication
 import org.jetbrains.jewel.styling.ButtonStyle
 import org.jetbrains.jewel.styling.CheckboxStyle
 import org.jetbrains.jewel.styling.ChipStyle
@@ -225,17 +222,3 @@ fun BaseIntUiTheme(
         IntelliJTheme(theme, swingCompatMode, content)
     }
 }
-
-private object NoIndication : Indication {
-
-    private object NoIndicationInstance : IndicationInstance {
-
-        override fun ContentDrawScope.drawIndication() {
-            drawContent()
-        }
-    }
-
-    @Composable
-    override fun rememberUpdatedInstance(interactionSource: InteractionSource): IndicationInstance =
-        NoIndicationInstance
-}
diff --git a/int-ui/int-ui-standalone/src/main/kotlin/org/jetbrains/jewel/intui/standalone/IntUiTheme.kt b/int-ui/int-ui-standalone/src/main/kotlin/org/jetbrains/jewel/intui/standalone/IntUiTheme.kt
@@ -197,21 +197,40 @@ fun IntUiTheme(
     swingCompatMode: Boolean = false,
     content: @Composable () -> Unit,
 ) {
-    val svgLoader by remember(themeDefinition.isDark, themeDefinition.iconData, themeDefinition.colorPalette) {
+    val svgLoader by rememberSvgLoader(
+        isDark = themeDefinition.isDark,
+        iconData = themeDefinition.iconData,
+        colorPalette = themeDefinition.colorPalette,
+    )
+
+    val componentStyling = defaultComponentStyling(themeDefinition, svgLoader)
+    IntUiTheme(themeDefinition, componentStyling, swingCompatMode, content)
+}
+
+/**
+ * Create and remember an instance of [SvgLoader].
+ *
+ * Note that since [SvgLoader] may cache the loaded images, and
+ * that creating it may be somewhat expensive, you should only
+ * create it once at the top level, and pass it around.
+ */
+@Composable
+fun rememberSvgLoader(
+    isDark: Boolean = IntUiTheme.isDark,
+    iconData: IntelliJThemeIconData = IntUiTheme.iconData,
+    colorPalette: IntUiThemeColorPalette = IntUiTheme.colorPalette,
+) =
+    remember(isDark, iconData, colorPalette) {
         val paletteMapper =
             StandalonePaletteMapperFactory.create(
-                themeDefinition.isDark,
-                themeDefinition.iconData,
-                themeDefinition.colorPalette,
+                isDark,
+                iconData,
+                colorPalette,
             )
         val svgPatcher = IntelliJSvgPatcher(paletteMapper)
         mutableStateOf(JewelSvgLoader(svgPatcher))
     }
 
-    val componentStyling = defaultComponentStyling(themeDefinition, svgLoader)
-    IntUiTheme(themeDefinition, componentStyling, swingCompatMode, content)
-}
-
 @Composable
 fun IntUiTheme(
     theme: IntUiThemeDefinition,

diff --git a/samples/standalone/src/main/kotlin/org/jetbrains/jewel/samples/standalone/Main.kt b/samples/standalone/src/main/kotlin/org/jetbrains/jewel/samples/standalone/Main.kt
@@ -29,14 +29,17 @@ import androidx.compose.ui.unit.dp
 import androidx.compose.ui.window.singleWindowApplication
 import org.jetbrains.jewel.CheckboxRow
 import org.jetbrains.jewel.Divider
+import org.jetbrains.jewel.JewelSvgLoader
 import org.jetbrains.jewel.LocalResourceLoader
 import org.jetbrains.jewel.VerticalScrollbar
 import org.jetbrains.jewel.intui.standalone.IntUiTheme
+import org.jetbrains.jewel.intui.standalone.rememberSvgLoader
 import org.jetbrains.jewel.samples.standalone.components.Borders
 import org.jetbrains.jewel.samples.standalone.components.Buttons
 import org.jetbrains.jewel.samples.standalone.components.Checkboxes
 import org.jetbrains.jewel.samples.standalone.components.ChipsAndTree
 import org.jetbrains.jewel.samples.standalone.components.Dropdowns
+import org.jetbrains.jewel.samples.standalone.components.Icons
 import org.jetbrains.jewel.samples.standalone.components.Links
 import org.jetbrains.jewel.samples.standalone.components.ProgressBar
 import org.jetbrains.jewel.samples.standalone.components.RadioButtons
@@ -57,6 +60,7 @@ fun main() {
 
         IntUiTheme(theme, swingCompat) {
             val resourceLoader = LocalResourceLoader.current
+            val svgLoader by rememberSvgLoader()
 
             val windowBackground = if (isDark) {
                 IntUiTheme.colorPalette.grey(1)
@@ -76,14 +80,14 @@ fun main() {
 
                 Divider(Modifier.fillMaxWidth())
 
-                ComponentShowcase()
+                ComponentShowcase(svgLoader, resourceLoader)
             }
         }
     }
 }
 
 @Composable
-private fun ComponentShowcase() {
+private fun ComponentShowcase(svgLoader: JewelSvgLoader, resourceLoader: ResourceLoader) {
     val verticalScrollState = rememberScrollState()
 
     Box(Modifier.fillMaxSize()) {
@@ -104,7 +108,8 @@ private fun ComponentShowcase() {
             TextAreas()
             ProgressBar()
             ChipsAndTree()
-            Tabs()
+            Tabs(svgLoader, resourceLoader)
+            Icons(svgLoader, resourceLoader)
         }
 
         VerticalScrollbar(

diff --git a/...les/standalone/src/main/kotlin/org/jetbrains/jewel/samples/standalone/components/Icons.kt b/...les/standalone/src/main/kotlin/org/jetbrains/jewel/samples/standalone/components/Icons.kt
@@ -0,0 +1,39 @@
+package org.jetbrains.jewel.samples.standalone.components
+
+import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.BlendMode
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.res.ResourceLoader
+import androidx.compose.ui.unit.dp
+import org.jetbrains.jewel.GroupHeader
+import org.jetbrains.jewel.Icon
+import org.jetbrains.jewel.SvgLoader
+import org.jetbrains.jewel.styling.ResourcePainterProvider
+
+@Composable
+internal fun Icons(svgLoader: SvgLoader, resourceLoader: ResourceLoader) {
+    GroupHeader("Icons")
+
+    Row(
+        modifier = Modifier.fillMaxWidth().padding(horizontal = 16.dp),
+        horizontalArrangement = Arrangement.spacedBy(16.dp),
+    ) {
+        val jewelLogoProvider = remember { ResourcePainterProvider.stateless("icons/jewel-logo.svg", svgLoader) }
+        val jewelLogo by jewelLogoProvider.getPainter(resourceLoader)
+
+        Icon(jewelLogo, "Jewel Logo", Modifier.size(16.dp))
+        Icon(jewelLogo, "Jewel Logo", Modifier.size(32.dp))
+        Icon(jewelLogo, "Jewel Logo", Modifier.size(64.dp))
+        Icon(jewelLogo, "Jewel Logo", Modifier.size(128.dp))
+        Icon(jewelLogo, "Jewel Logo", ColorFilter.tint(Color.Magenta, BlendMode.Multiply), Modifier.size(128.dp))
+    }
+}