From 5014d3e5766ce8741f20c210946653d74b1ccf8c Mon Sep 17 00:00:00 2001
From: Andreas Reinhold / reini <reini@kadenpartner.ch>
Date: Tue, 15 Sep 2026 22:23:05 +0200
Subject: [PATCH] Let a select, a password and a file field span its container

<x-input>, <x-textarea> and <x-datepicker> took `full` to drop the 40rem
bound field.css puts on a text field from `medium`; <x-select>,
<x-password> and <x-file> did not, so a field inside a container that
already bounds it stopped short of that container's edge with no way to
say so. The three now take the prop and hand it to <x-field> like the
others. <x-choices> and <x-timepicker> still do not.

Found in SealShare: its share options, its admin settings and its user
settings are cards, and a card is exactly the "other container" M3 names
as the thing that should bound a field on a medium or expanded screen
instead of the 40rem ceiling.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
---
 resources/views/components/file.blade.php     | 5 +++--
 resources/views/components/password.blade.php | 5 +++--
 resources/views/components/select.blade.php   | 5 +++--
 3 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/resources/views/components/file.blade.php b/resources/views/components/file.blade.php
index 7ce3fbe7..4403054c 100644
--- a/resources/views/components/file.blade.php
+++ b/resources/views/components/file.blade.php
@@ -11,12 +11,13 @@
      it cannot be truncated or wrapped, and the caller shows what was chosen anyway, as previews. A
      screen reader still hears it. The errors are the model's and, for a `multiple` input, each
      file's (`photos.*`): a file refused for its size belongs under this field as much as the
-     batch's own count does. `label`, `hint`, `variant`; every other attribute reaches the `<input>`. --}}
+     batch's own count does. `label`, `hint`, `variant`; `full` takes the 40rem bound off a field its container already bounds. Every other attribute reaches the `<input>`. --}}
 
 @props([
     'label' => null,
     'hint' => null,
     'variant' => null,
+    'full' => false,
 ])
 
 @php
@@ -29,7 +30,7 @@
         : [];
 @endphp
 
-<x-livewire-material::field :$id :$label :$hint :$messages :$variant floated :class="$attributes->get('class')" :style="$attributes->get('style')" data-md-file>
+<x-livewire-material::field :$id :$label :$hint :$messages :$variant :$full floated :class="$attributes->get('class')" :style="$attributes->get('style')" data-md-file>
     <input
         {{ $attributes->except(['class', 'style', 'id', 'type']) }}
         type="file"
diff --git a/resources/views/components/password.blade.php b/resources/views/components/password.blade.php
index bd07e82b..822e9304 100644
--- a/resources/views/components/password.blade.php
+++ b/resources/views/components/password.blade.php
@@ -4,7 +4,7 @@
      password manager still sees a password input on load. Its label says what pressing it will do —
      M3's own pattern for an interactive trailing icon ("Show password" / "Hide password") — and it
      carries no `aria-pressed`, which would say the state a second time and the other way round.
-     `label`, `hint`, `icon`, `variant`, `size`; `class` and `style` land on the field's root, every
+     `label`, `hint`, `icon`, `variant`, `size`; `full` takes the 40rem bound off a field its container already bounds. `class` and `style` land on the field's root, every
      other attribute reaches the `<input>`
      (`autocomplete="current-password"`, `wire:model`). The field's root carries
      `data-md-password`; the chrome and the eye's icon button are the field's
@@ -17,6 +17,7 @@
     'icon' => null,
     'size' => 'md',
     'variant' => null,
+    'full' => false,
 ])
 
 @php
@@ -28,7 +29,7 @@
     $fieldIconSize = ['sm' => 20, 'xs' => 16][$size] ?? 24;
 @endphp
 
-<x-livewire-material::field :$id :$label :$hint :hint-class="$hintClass" :$messages :$icon :$size :$variant :class="$attributes->get('class')" :style="$attributes->get('style')" x-data="{ shown: false }" data-md-password>
+<x-livewire-material::field :$id :$label :$hint :hint-class="$hintClass" :$messages :$icon :$size :$variant :$full :class="$attributes->get('class')" :style="$attributes->get('style')" x-data="{ shown: false }" data-md-password>
     <input
         {{ $attributes->except(['class', 'style', 'id', 'type', 'placeholder']) }}
         id="{{ $id }}"
diff --git a/resources/views/components/select.blade.php b/resources/views/components/select.blade.php
index 828d9fbc..c0234b5b 100644
--- a/resources/views/components/select.blade.php
+++ b/resources/views/components/select.blade.php
@@ -10,7 +10,7 @@
      `options` as a list of `['id' => …, 'name' => …]` (`'disabled' => true` greys one out),
      `option-value` and `option-label` to read other keys, and a `placeholder` that becomes the
      first option, valued `placeholder-value` (empty by default). Or pass `<option>`s in the slot.
-     `label`, `hint`, `icon`, `variant`, `size`; `class` and `style` land on the field's root, every
+     `label`, `hint`, `icon`, `variant`, `size`; `full` takes the 40rem bound off a field its container already bounds. `class` and `style` land on the field's root, every
      other attribute on the `<select>`. The field's root carries `data-md-select`; what a
      select changes in the field's chrome is resources/css/components/select.css. --}}
 
@@ -26,6 +26,7 @@
     'placeholderValue' => null,
     'size' => 'md',
     'variant' => null,
+    'full' => false,
 ])
 
 @php
@@ -37,7 +38,7 @@
     $fieldIconSize = ['sm' => 20, 'xs' => 16][$size] ?? 24;
 @endphp
 
-<x-livewire-material::field :$id :$label :$hint :hint-class="$hintClass" :$messages :$icon :$size :$variant floated :class="$attributes->get('class')" :style="$attributes->get('style')" data-md-select>
+<x-livewire-material::field :$id :$label :$hint :hint-class="$hintClass" :$messages :$icon :$size :$variant :$full floated :class="$attributes->get('class')" :style="$attributes->get('style')" data-md-select>
     <select
         {{ $attributes->except(['class', 'style', 'id']) }}
         id="{{ $id }}"