Merge branch 'worktree-agent-a6769a5cd2c4b070e'

resources/views/showcase/sections/carousel.blade.php

@@ -55,8 +55,8 @@
                 @endforeach
             </x-carousel>
             BLADE,
-        'Full-screen' => <<<'BLADE'
-            <x-carousel layout="full-screen" label="Wallpapers" height="240" :controls="true">
+        'Full-screen: one item at a time, scrolled down' => <<<'BLADE'
+            <x-carousel layout="full-screen" label="Wallpapers" height="320" :controls="true">
                 @foreach ([
                     ['Morning', 'very-sunny', 'bg-linear-to-br from-primary-container to-tertiary-container text-on-primary-container'],
                     ['Noon', 'clam-shell', 'bg-linear-to-br from-secondary-container to-primary-container text-on-secondary-container'],
@@ -78,7 +78,7 @@
 
     <p class="max-w-3xl type-body-md text-on-surface-variant">
         <code>&lt;x-carousel&gt;</code> and <code>&lt;x-carousel-item&gt;</code>: items that change size between M3's keylines as they scroll.
-        Swipe, scroll with Shift and the wheel, or focus a row and use the arrow keys.
+        Swipe, scroll with Shift and the wheel, or tab to an item and use the arrow keys.
     </p>
 
     @foreach ($examples as $title => $code)

resources/views/showcase/sections/containment.blade.php

@@ -26,6 +26,15 @@
                 </x-slot:actions>
             </x-card>
             BLADE,
+        'A directly actionable card: the card is the tab stop' => <<<'BLADE'
+            <x-card variant="elevated" actionable role="link" title="contract.pdf" class="w-full max-w-sm">
+                <a href="#containment" data-list-open tabindex="-1" class="type-title-md">contract.pdf</a>
+                <p class="mt-1 text-on-surface-variant">1.2 MB · downloaded twice</p>
+                <x-slot:actions>
+                    <x-button label="Copy link" icon="content_copy" x-on:click="materialToast('Link copied', { type: 'success' })" />
+                </x-slot:actions>
+            </x-card>
+            BLADE,
         'Lists' => <<<'BLADE'
             <div class="grid w-full gap-6 medium:grid-cols-2">
                 <x-list dividers label="Files">
@@ -40,9 +49,17 @@
                     <x-list-item title="Chiara Rossi" avatar="CR">
                         <x-slot:end><x-button icon="more_vert" tooltip="More" /></x-slot:end>
                     </x-list-item>
+                    <x-list-item title="Dan Fischer" description="Invitation withdrawn" avatar="DF" link="#containment" disabled />
                 </x-list>
             </div>
             BLADE,
+        'A list to choose from' => <<<'BLADE'
+            <x-list selectable label="Expiry" class="w-full max-w-sm">
+                <x-list-item title="One hour" :selected="false" />
+                <x-list-item title="Three days" :selected="true" />
+                <x-list-item title="Thirty days" :selected="false" />
+            </x-list>
+            BLADE,
         'Dividers and collapse' => <<<'BLADE'
             <div class="w-full space-y-4">
                 <x-collapse title="How long do links last?" icon="schedule" open>
@@ -70,7 +87,7 @@
         'Dialogs' => <<<'BLADE'
             <div x-data="{ open: false }">
                 <x-button label="Basic dialog" variant="tonal" x-on:click="open = true" />
-                <x-modal title="Delete this share?" subtitle="Recipients lose access at once. This cannot be undone.">
+                <x-modal title="Delete this share?" subtitle="Recipients lose access at once. This cannot be undone." alert>
                     <x-slot:actions>
                         <x-button label="Cancel" x-on:click="close()" />
                         <x-button label="Delete" danger x-on:click="close()" />