Make a table's density the caller's decision

Density was applied to every fine-pointer device with no way out, which
M3 forbids outright: "don't apply density by default; offer an explicit
density opt-in instead, keeping opt-out targets at >= 48x48 CSS px". A
row is now 52px and `dense` is a prop that tightens it to 36. The row
divider also takes outline-variant itself rather than 60% of it, since M3
keeps opacity for state layers and disabled.

Plan step 20, findings IN-16 and IN-30.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
This commit is contained in:
Andreas Reinhold / reini
2026-09-14 06:08:13 +02:00
co-authored by Claude Fable 5.1
parent 5989e9ea92
commit 42d62ed00c
4 changed files with 30 additions and 17 deletions
+5
View File
@@ -13,6 +13,11 @@ it('marks a table for its styles and takes a size', function () {
->and((string) $this->blade('<x-table size="huge" />'))->toContain('data-size="sm"');
});
it('tightens a table only when the caller asks for it', function () {
expect((string) $this->blade('<x-table />'))->not->toContain('data-dense')
->and((string) $this->blade('<x-table dense />'))->toContain('data-dense');
});
it('sorts by its column, ascending first and then flipping', function () {
expect((string) $this->blade('<x-sort-header column="size" :sort-by="[\'column\' => \'name\', \'direction\' => \'asc\']">Size</x-sort-header>'))
->not->toContain('aria-sort')