feat: Bisel 3D sutil en botones

- Añadir línea highlight (lighten 15) en borde superior interno
- Añadir línea shadow (darken 15) en borde inferior interno
- Aplicar a buttonRect y buttonStatefulRect
- Deshabilitar bisel en botones disabled
- Solo aplicar si botón tiene al menos 4px de alto/ancho
- Actualizar test para reflejar 2 comandos extra

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
R.Eugenio 2025-12-30 00:11:25 +01:00
parent d2f99419de
commit 8b15d3f80f

View file

@ -105,6 +105,16 @@ pub fn buttonRect(ctx: *Context, bounds: Layout.Rect, text: []const u8, config:
ctx.pushCommand(Command.rectOutline(bounds.x, bounds.y, bounds.w, bounds.h, theme.border));
}
// Bisel 3D sutil: línea clara arriba, línea oscura abajo (inside)
if (bounds.h >= 4 and bounds.w >= 4 and !config.disabled) {
// Línea superior interna (highlight)
const bevel_light = bg_color.lighten(15);
ctx.pushCommand(Command.rect(bounds.x + 1, bounds.y + 1, bounds.w - 2, 1, bevel_light));
// Línea inferior interna (shadow)
const bevel_dark = bg_color.darken(15);
ctx.pushCommand(Command.rect(bounds.x + 1, bounds.y + @as(i32, @intCast(bounds.h)) - 2, bounds.w - 2, 1, bevel_dark));
}
// Draw text centered
const char_width: u32 = 8;
const char_height: u32 = 8;
@ -193,6 +203,16 @@ pub fn buttonStatefulRect(
ctx.pushCommand(Command.rectOutline(bounds.x, bounds.y, bounds.w, bounds.h, theme.border));
}
// Bisel 3D sutil: línea clara arriba, línea oscura abajo (inside)
if (bounds.h >= 4 and bounds.w >= 4 and !config.disabled) {
// Línea superior interna (highlight)
const bevel_light = bg_color.lighten(15);
ctx.pushCommand(Command.rect(bounds.x + 1, bounds.y + 1, bounds.w - 2, 1, bevel_light));
// Línea inferior interna (shadow)
const bevel_dark = bg_color.darken(15);
ctx.pushCommand(Command.rect(bounds.x + 1, bounds.y + @as(i32, @intCast(bounds.h)) - 2, bounds.w - 2, 1, bevel_dark));
}
// Draw text centered
const char_width: u32 = 8;
const char_height: u32 = 8;
@ -237,8 +257,8 @@ test "button generates commands" {
_ = button(&ctx, "Click me");
// Should generate: rect (background) + rect_outline (border) + text
try std.testing.expectEqual(@as(usize, 3), ctx.commands.items.len);
// Should generate: rect (background) + rect_outline (border) + 2 bevel lines + text
try std.testing.expectEqual(@as(usize, 5), ctx.commands.items.len);
ctx.endFrame();
}