Ease a collapse open, which its own comment already promised

Plan step 19, containment.md C-24. `interpolate-size: allow-keywords`
was set and nothing transitioned, so the content snapped open. A new
resources/css/components/collapse.css transitions `block-size` on
`::details-content` over the fast spatial spring, with
`content-visibility` `allow-discrete` beside it so the section stays
rendered while it closes. The `<details>` carries `data-collapse` for
the rule to find.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
This commit is contained in:
Andreas Reinhold / reini
2026-09-14 06:09:23 +02:00
co-authored by Claude Opus 5
parent 73937c3726
commit a237d33426
4 changed files with 38 additions and 3 deletions
+4 -2
View File
@@ -11,6 +11,8 @@ it('discloses on the native details element, kept open through a morph', functio
->toContain('wire:ignore.self')
->toContain(' open ')
->toContain('rounded-corner-lg bg-surface-container')
->toContain('data-collapse')
->toContain('[interpolate-size:allow-keywords]')
->toContain('How long do links last?')
->toContain('Until the expiry.')
->toContain('group-open/collapse:rotate-180');
@@ -20,12 +22,12 @@ it('has no Alpine on it without a binding', function () {
$html = (string) $this->blade('<x-collapse title="Advanced" open>Body</x-collapse>');
expect($html)
->toMatch('/<details\s+wire:ignore.self\s+open\s+class="group\/collapse/')
->toMatch('/<details\s+wire:ignore.self\s+data-collapse\s+open\s+class="group\/collapse/')
->not->toContain('x-data')
->not->toContain('x-modelable')
->not->toContain('x-on:toggle')
->and((string) $this->blade('<x-collapse title="Advanced">Body</x-collapse>'))
->toMatch('/<details\s+wire:ignore.self\s+class="group\/collapse/');
->toMatch('/<details\s+wire:ignore.self\s+data-collapse\s+class="group\/collapse/');
});
it('binds its open state through x-model, drawing the open prop until Alpine starts', function () {