fix(jetbrains): refine session padding

This commit is contained in:
kirillk
2026-07-07 13:19:40 -04:00
parent 76e4eb8a16
commit e70b4fa9b9
9 changed files with 65 additions and 15 deletions
+5
View File
@@ -0,0 +1,5 @@
---
"@kilocode/kilo-jetbrains": patch
---
Improve JetBrains session and code block padding alignment.
@@ -0,0 +1,5 @@
---
"@kilocode/kilo-jetbrains": patch
---
Balance JetBrains prompt input text padding.
@@ -172,7 +172,12 @@ class PromptPanel(
style.applyTranscriptToEditor(ed)
ed.setBorder(JBUI.Borders.empty())
ed.scrollPane.border = JBUI.Borders.empty()
ed.scrollPane.viewportBorder = JBUI.Borders.empty()
ed.scrollPane.viewportBorder = JBUI.Borders.empty(
0,
JBUI.scale(SessionUiStyle.View.Prompt.SHELL_VERTICAL_PADDING),
0,
JBUI.scale(SessionUiStyle.View.Prompt.SHELL_VERTICAL_PADDING),
)
ed.backgroundColor = style.editorScheme.defaultBackground
ed.scrollPane.background = style.editorScheme.defaultBackground
ed.scrollPane.viewport.background = style.editorScheme.defaultBackground
@@ -16,8 +16,13 @@ object SessionUiStyle {
/** Geometry for the transcript list and its scroll behavior. */
object SessionLayout {
const val GAP = 3
val InnerInsets = Insets(UiStyle.Gap.md(), UiStyle.Gap.md(), UiStyle.Gap.sm(), UiStyle.Gap.sm())
const val TRANSCRIPT_SCROLLBAR_PADDING = 10
val InnerInsets = Insets(
UiStyle.Gap.md(),
UiStyle.Gap.sm() + TRANSCRIPT_SCROLLBAR_PADDING,
UiStyle.Gap.sm(),
UiStyle.Gap.sm(),
)
const val USER_PROMPT_INDENT = 100
const val SCROLL_INCREMENT = 48
}
@@ -144,12 +149,12 @@ object SessionUiStyle {
const val MIN_ROWS = 1
const val BORDER_WIDTH = 1
const val VIEWPORT_TOP_PADDING = 6
const val VIEWPORT_HORIZONTAL_PADDING = 8
const val VIEWPORT_HORIZONTAL_PADDING = Layout.HORIZONTAL_PADDING
const val VIEWPORT_BOTTOM_PADDING = 6
const val SCROLLBAR_HEIGHT = 12
const val WIDTH_PADDING = 16
fun topPadding(): Int = VIEWPORT_TOP_PADDING
fun topPadding(): Int = VIEWPORT_TOP_PADDING + UiStyle.Gap.lg()
}
/** Permission session-view command preview limits. */
@@ -305,7 +305,7 @@ class ShellBody(
private fun styleShell() {
val root = md.component as? JPanel ?: return
root.components.filterIsInstance<JBHtmlPane>().forEach {
it.border = JBUI.Borders.emptyLeft(JBUI.scale(SessionUiStyle.View.Code.VIEWPORT_HORIZONTAL_PADDING))
it.border = JBUI.Borders.emptyLeft(SessionUiStyle.View.Code.VIEWPORT_HORIZONTAL_PADDING)
}
}
@@ -175,6 +175,18 @@ class PromptPanelTest : BasePlatformTestCase() {
assertSame(editor, applied)
}
fun `test prompt editor horizontal insets match top padding`() {
val panel = PromptPanel(project = project, onSend = { _, _ -> }, onAbort = {}, onEnhance = { _, _ -> })
realize(panel, 260, 400)
val editor = (panel.defaultFocusedComponent as EditorTextField).getEditor(false)!!
val ins = editor.scrollPane.viewportBorder.getBorderInsets(editor.scrollPane)
val pad = JBUI.scale(SessionUiStyle.View.Prompt.SHELL_VERTICAL_PADDING)
assertEquals(pad, ins.left)
assertEquals(pad, ins.right)
}
fun `test prompt focus outline follows editor focus`() {
val panel = PromptPanel(project = project, onSend = { _, _ -> }, onAbort = {}, onEnhance = { _, _ -> })
realize(panel, 260, 400)
@@ -19,6 +19,7 @@ import ai.kilocode.client.session.views.question.QuestionView
import ai.kilocode.client.session.views.MessageToolbar
import ai.kilocode.client.session.views.MessageView
import ai.kilocode.client.session.views.TextView
import ai.kilocode.client.session.views.TurnView
import ai.kilocode.client.session.views.base.PartView
import ai.kilocode.client.session.views.tool.TaskToolView
import ai.kilocode.client.session.views.tool.ToolView
@@ -82,6 +83,18 @@ class SessionMessageListPanelTest : BasePlatformTestCase() {
assertEquals("", panel.dump())
}
fun `test transcript content has symmetric side padding`() {
model.upsertMessage(msg("a1", "assistant"))
panel.setSize(600, 400)
panel.doLayout()
val turn = panel.components.first { it is TurnView }
val left = turn.x
val right = panel.width - turn.x - turn.width
assertEquals(right, left)
}
// ------ TurnAdded ------
fun `test user message creates turn and is findable by message id`() {
@@ -328,7 +328,7 @@ class ShellToolViewTest : BasePlatformTestCase() {
assertEquals(2, panes.size)
labels.forEach {
val label = it.border?.getBorderInsets(it)
assertEquals(JBUI.scale(SessionUiStyle.View.Code.VIEWPORT_HORIZONTAL_PADDING), label?.left ?: 0)
assertEquals(JBUI.scale(SessionUiStyle.View.Layout.HORIZONTAL_PADDING), label?.left ?: 0)
assertEquals(0, label?.right ?: 0)
}
panes.forEach {
@@ -347,8 +347,7 @@ class ShellToolViewTest : BasePlatformTestCase() {
val output = (1..30).joinToString("\n") { "line $it" }
val view = track(ShellToolView(tool().also { it.output = output }))
view.toggle()
val root = view.mdComponent()!!
val pane = root.components.filterIsInstance<JBScrollPane>().single()
val pane = view.mdComponent()!!.components.filterIsInstance<JBScrollPane>().single()
val editor = view.codeEditors().single()
val nested = editor.getEditor(true)!!.scrollPane
val line = editor.getEditor(true)!!.lineHeight
@@ -408,7 +407,7 @@ class ShellToolViewTest : BasePlatformTestCase() {
val editor = field.getEditor(true)!!
val lines = field.text.lines().size
assertEquals(
SessionUiStyle.View.Code.VIEWPORT_TOP_PADDING,
SessionUiStyle.View.Code.topPadding(),
pad.top,
)
assertEquals(SessionUiStyle.View.Code.VIEWPORT_BOTTOM_PADDING, pad.bottom)
@@ -122,25 +122,31 @@ class MdViewHybridTest : BasePlatformTestCase() {
assertTrue(pane.preferredSize.height >= line * 3)
}
fun `test fenced code block has symmetric content padding with horizontal scrollbar`() {
fun `test fenced code block balances content padding with horizontal scrollbar`() {
view.set("```kotlin\n${"x".repeat(500)}\n```")
val pane = scrolls().single()
val pad = pane.viewportBorder.getBorderInsets(pane)
assertEquals(SessionUiStyle.View.Code.VIEWPORT_TOP_PADDING, pad.top)
assertEquals(SessionUiStyle.View.Code.topPadding(), pad.top)
assertEquals(SessionUiStyle.View.Layout.HORIZONTAL_PADDING, pad.left)
assertEquals(SessionUiStyle.View.Code.VIEWPORT_BOTTOM_PADDING, pad.bottom)
assertEquals(pad.top, pad.bottom)
assertEquals(SessionUiStyle.View.Layout.HORIZONTAL_PADDING, pad.right)
assertTrue(pad.top > pad.bottom)
assertTrue(pad.top < pad.bottom + SessionUiStyle.View.Code.SCROLLBAR_HEIGHT)
assertTrue(pane.horizontalScrollBar.preferredSize.height > 0)
}
fun `test short code block keeps symmetric content padding`() {
fun `test short code block keeps balanced content padding`() {
view.set("```text\n[ALICE, ANNA]\n```")
val pane = scrolls().single()
val pad = pane.viewportBorder.getBorderInsets(pane)
assertEquals(SessionUiStyle.View.Code.VIEWPORT_TOP_PADDING, pad.top)
assertEquals(SessionUiStyle.View.Code.topPadding(), pad.top)
assertEquals(SessionUiStyle.View.Layout.HORIZONTAL_PADDING, pad.left)
assertEquals(SessionUiStyle.View.Code.VIEWPORT_BOTTOM_PADDING, pad.bottom)
assertEquals(pad.top, pad.bottom)
assertEquals(SessionUiStyle.View.Layout.HORIZONTAL_PADDING, pad.right)
assertTrue(pad.top > pad.bottom)
assertTrue(pad.top < pad.bottom + SessionUiStyle.View.Code.SCROLLBAR_HEIGHT)
}
fun `test fenced code block height is not capped`() {