mirror of
https://github.com/filamentphp/filament.git
synced 2026-10-24 01:58:00 +08:00
Move to "model-first" field implementation for simpler API
This commit is contained in:
@@ -9,7 +9,7 @@
|
||||
x-on:livewire-upload-progress="progress = $event.detail.progress"
|
||||
class="flex items-center space-x-4">
|
||||
<div class="flex-shrink-0 relative">
|
||||
<label for="{{ $id ?? $name }}" class="cursor-pointer rounded-full shadow flex overflow-hidden">
|
||||
<label for="{{ $id ?? $model }}" class="cursor-pointer rounded-full shadow flex overflow-hidden">
|
||||
@if ($avatar)
|
||||
<img src="{{ $avatar->temporaryUrl() }}" alt="{{ $user->name }}" class="h-full object-cover" width="{{ $size }}" height="{{ $size }}" loading="lazy">
|
||||
@else
|
||||
@@ -26,18 +26,15 @@
|
||||
@endif
|
||||
</div>
|
||||
<div class="flex-grow relative">
|
||||
<label class="btn" for="{{ $id ?? $name }}">{{ __('Change') }}</label>
|
||||
<label class="btn" for="{{ $id ?? $model }}">{{ __('Change') }}</label>
|
||||
<input type="file"
|
||||
{{ $modelDirective }}="{{ $model }}"
|
||||
value="{{ $value }}"
|
||||
class="sr-only"
|
||||
id="{{ $id ?? $name }}"
|
||||
@if ($extraAttributes)
|
||||
@foreach ($extraAttributes as $attribute => $value)
|
||||
{{ $attribute }}="{{ $value }}"
|
||||
@endforeach
|
||||
@endif
|
||||
@if ($model)
|
||||
{{ $modelDirective }}="{{ $model }}"
|
||||
@endif
|
||||
id="{{ $id ?? $model }}"
|
||||
@foreach ($extraAttributes as $attribute => $value)
|
||||
{{ $attribute }}="{{ $value }}"
|
||||
@endforeach
|
||||
/>
|
||||
<div x-show="isUploading" :aria-hidden="!isUploading" class="absolute bottom-0 -mb-3 w-48 max-w-full">
|
||||
<x-filament::progress progress="progress" />
|
||||
|
||||
@@ -2,18 +2,12 @@
|
||||
<x-filament::label>
|
||||
<span class="inline-flex items-center space-x-2">
|
||||
<input type="{{ $type }}"
|
||||
@if ($model)
|
||||
{{ $modelDirective }}="{{ $model }}"
|
||||
@endif
|
||||
@isset($checked)
|
||||
checked
|
||||
@endisset
|
||||
@if ($extraAttributes)
|
||||
@foreach ($extraAttributes as $attribute => $value)
|
||||
{{ $attribute }}="{{ $value }}"
|
||||
@endforeach
|
||||
@endif
|
||||
class="rounded text-blue-700 shadow-sm focus:border-blue-700 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 @error($model ?? $name) border-red-600 @else border-gray-300 @enderror" />
|
||||
{{ $modelDirective }}="{{ $model }}"
|
||||
value="{{ $value }}"
|
||||
@foreach ($extraAttributes as $attribute => $value)
|
||||
{{ $attribute }}="{{ $value }}"
|
||||
@endforeach
|
||||
class="rounded text-blue-700 shadow-sm focus:border-blue-700 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 @error($model) border-red-600 @else border-gray-300 @enderror" />
|
||||
<span class="inline-flex items-baseline space-x-4">
|
||||
@if ($label)
|
||||
<span>{{ $label }}</span>
|
||||
@@ -26,7 +20,7 @@
|
||||
</span>
|
||||
</span>
|
||||
</x-filament::label>
|
||||
<x-filament::error :field="$model ?? $name" />
|
||||
<x-filament::error :field="$model" />
|
||||
@if ($help)
|
||||
<x-filament::help>
|
||||
@markdown($help)
|
||||
|
||||
@@ -2,16 +2,12 @@
|
||||
|
||||
@section('field')
|
||||
<input type="{{ $type }}"
|
||||
id="{{ $id ?? $name }}"
|
||||
value="{{ $value ?? '' }}"
|
||||
@if ($model)
|
||||
{{ $modelDirective }}="{{ $model }}"
|
||||
@endif
|
||||
@if ($extraAttributes)
|
||||
@foreach ($extraAttributes as $attribute => $value)
|
||||
{{ $attribute }}="{{ $value }}"
|
||||
@endforeach
|
||||
@endif
|
||||
class="block w-full rounded shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 @error($model ?? $name) border-red-600 motion-safe:animate-shake @else border-gray-300 @enderror"
|
||||
{{ $modelDirective }}="{{ $model }}"
|
||||
value="{{ $value }}"
|
||||
id="{{ $id ?? $model }}"
|
||||
@foreach ($extraAttributes as $attribute => $value)
|
||||
{{ $attribute }}="{{ $value }}"
|
||||
@endforeach
|
||||
class="block w-full rounded shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 @error($model) border-red-600 motion-safe:animate-shake @else border-gray-300 @enderror"
|
||||
/>
|
||||
@overwrite
|
||||
@@ -2,16 +2,12 @@
|
||||
|
||||
@section('field')
|
||||
<textarea
|
||||
id="{{ $id ?? $name }}"
|
||||
@if ($model)
|
||||
{{ $modelDirective }}="{{ $model }}"
|
||||
@endif
|
||||
@if ($extraAttributes)
|
||||
@foreach ($extraAttributes as $attribute => $value)
|
||||
{{ $attribute }}="{{ $value }}"
|
||||
@endforeach
|
||||
@endif
|
||||
class="block w-full rounded shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 @error($model ?? $name) border-red-600 motion-safe:animate-shake @else border-gray-300 @enderror">
|
||||
{{ $value ?? '' }}
|
||||
id="{{ $id ?? $model }}"
|
||||
{{ $modelDirective }}="{{ $model }}"
|
||||
@foreach ($extraAttributes as $attribute => $value)
|
||||
{{ $attribute }}="{{ $value }}"
|
||||
@endforeach
|
||||
class="block w-full rounded shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 @error($model) border-red-600 motion-safe:animate-shake @else border-gray-300 @enderror">
|
||||
{{ $value }}
|
||||
</textarea>
|
||||
@overwrite
|
||||
@@ -9,15 +9,22 @@
|
||||
@endpushonce
|
||||
|
||||
@section('field')
|
||||
<div x-data="{ content: @entangle($model ?? $name).defer }">
|
||||
<input type="hidden" id="value-{{ $id ?? $name }}" value="{{ $value ?? '' }}" />
|
||||
<div x-data="{ content: @entangle($model).defer }">
|
||||
<input
|
||||
type="hidden"
|
||||
value="{{ $value }}"
|
||||
id="value-{{ $id ?? $model }}"
|
||||
@foreach ($extraAttributes as $attribute => $value)
|
||||
{{ $attribute }}="{{ $value }}"
|
||||
@endforeach
|
||||
/>
|
||||
|
||||
<div
|
||||
wire:ignore
|
||||
@trix-change="content = $event.target.value"
|
||||
@trix-file-accept="$event.preventDefault()"
|
||||
>
|
||||
<trix-toolbar id="toolbar-{{ $id ?? $name }}">
|
||||
<trix-toolbar id="toolbar-{{ $id ?? $model }}">
|
||||
<div class="trix-button-row">
|
||||
<span class="trix-button-group trix-button-group--text-tools" data-trix-button-group="text-tools">
|
||||
<button type="button" class="trix-button trix-button--icon trix-button--icon-bold" data-trix-attribute="bold" data-trix-key="b" title="Bold" tabindex="-1">Bold</button>
|
||||
@@ -58,15 +65,10 @@
|
||||
</trix-toolbar>
|
||||
|
||||
<trix-editor
|
||||
id="{{ $id ?? $name }}"
|
||||
toolbar="toolbar-{{ $id ?? $name }}"
|
||||
input="value-{{ $id ?? $name }}"
|
||||
id="{{ $id ?? $model }}"
|
||||
toolbar="toolbar-{{ $id ?? $model }}"
|
||||
input="value-{{ $id ?? $model }}"
|
||||
class="block w-full rounded shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 border-gray-300 prose max-w-none"
|
||||
@if ($extraAttributes)
|
||||
@foreach ($extraAttributes as $attribute => $value)
|
||||
{{ $attribute }}="{{ $value }}"
|
||||
@endforeach
|
||||
@endif
|
||||
></trix-editor>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<div class="space-y-2">
|
||||
<div class="flex items-center justify-between space-x-2">
|
||||
@if ($label)
|
||||
<x-filament::label :for="$id ?? $name">
|
||||
<x-filament::label :for="$id ?? $model">
|
||||
{{ __($label) }}
|
||||
</x-filament::label>
|
||||
@endif
|
||||
@@ -12,7 +12,7 @@
|
||||
@endif
|
||||
</div>
|
||||
@yield('field')
|
||||
<x-filament::error :field="$model ?? $name" />
|
||||
<x-filament::error :field="$model" />
|
||||
@if ($help)
|
||||
<x-filament::help>
|
||||
@markdown($help)
|
||||
|
||||
+16
-11
@@ -5,21 +5,27 @@ namespace Filament\Fields;
|
||||
use Illuminate\Support\Str;
|
||||
|
||||
class Field extends BaseField {
|
||||
public $name;
|
||||
public $label;
|
||||
public $model;
|
||||
public $modelDirective;
|
||||
public $extraAttributes;
|
||||
public $value;
|
||||
public $label;
|
||||
public $modelDirective = 'wire:model.defer';
|
||||
public $extraAttributes = [];
|
||||
protected $view;
|
||||
|
||||
public function __construct($name)
|
||||
public function __construct($model)
|
||||
{
|
||||
$this->name = $name;
|
||||
$this->model = $model;
|
||||
}
|
||||
|
||||
public static function make($name)
|
||||
public static function make($model)
|
||||
{
|
||||
return new static($name);
|
||||
return new static($model);
|
||||
}
|
||||
|
||||
public function value($value)
|
||||
{
|
||||
$this->value = $value;
|
||||
return $this;
|
||||
}
|
||||
|
||||
public function label($label)
|
||||
@@ -28,10 +34,9 @@ class Field extends BaseField {
|
||||
return $this;
|
||||
}
|
||||
|
||||
public function model($model, $directive = 'wire:model.defer')
|
||||
public function modelDirective($modelDirective)
|
||||
{
|
||||
$this->model = $model;
|
||||
$this->modelDirective = $directive;
|
||||
$this->modelDirective = $modelDirective;
|
||||
return $this;
|
||||
}
|
||||
|
||||
|
||||
@@ -33,7 +33,6 @@ class ForgotPassword extends Component
|
||||
Text::make('email')
|
||||
->type('email')
|
||||
->label('E-Mail Address')
|
||||
->model('email')
|
||||
->extraAttributes([
|
||||
'required' => 'true',
|
||||
'autofocus' => 'true',
|
||||
|
||||
@@ -44,7 +44,6 @@ class Login extends Component
|
||||
Text::make('email')
|
||||
->type('email')
|
||||
->label('E-Mail Address')
|
||||
->model('email')
|
||||
->extraAttributes([
|
||||
'required' => 'true',
|
||||
'autocomplete' => 'email',
|
||||
@@ -57,15 +56,13 @@ class Login extends Component
|
||||
Text::make('password')
|
||||
->type('password')
|
||||
->label('Password')
|
||||
->model('password')
|
||||
->extraAttributes([
|
||||
'required' => 'true',
|
||||
'autocomplete' => 'current-password',
|
||||
])
|
||||
->hint('['.__('Forgot Your Password?').']('.route('filament.password.forgot').')'),
|
||||
Checkbox::make('remember')
|
||||
->label('Remember me')
|
||||
->model('remember'),
|
||||
->label('Remember me'),
|
||||
];
|
||||
}
|
||||
|
||||
|
||||
@@ -33,7 +33,6 @@ class Register extends Component
|
||||
return [
|
||||
Text::make('name')
|
||||
->label('Name')
|
||||
->model('name')
|
||||
->extraAttributes([
|
||||
'required' => 'true',
|
||||
'autofocus' => 'true',
|
||||
@@ -42,7 +41,7 @@ class Register extends Component
|
||||
Text::make('email')
|
||||
->type('email')
|
||||
->label('E-Mail Address')
|
||||
->model('email', 'wire:model.lazy')
|
||||
->modelDirective('wire:model.lazy')
|
||||
->extraAttributes([
|
||||
'required' => 'true',
|
||||
'autocomplete' => 'email',
|
||||
@@ -50,7 +49,6 @@ class Register extends Component
|
||||
Text::make('password')
|
||||
->type('password')
|
||||
->label('Password')
|
||||
->model('password',)
|
||||
->extraAttributes([
|
||||
'required' => 'true',
|
||||
'autocomplete' => 'new-password',
|
||||
@@ -58,7 +56,6 @@ class Register extends Component
|
||||
Text::make('password_confirmation')
|
||||
->type('password')
|
||||
->label('Confirm New Password')
|
||||
->model('password_confirmation',)
|
||||
->extraAttributes([
|
||||
'required' => 'true',
|
||||
'autocomplete' => 'new-password',
|
||||
|
||||
@@ -61,7 +61,7 @@ class ResetPassword extends Component
|
||||
Text::make('email')
|
||||
->type('email')
|
||||
->label('E-Mail Address')
|
||||
->model('email', 'wire:model.lazy')
|
||||
->modelDirective('wire:model.lazy')
|
||||
->extraAttributes([
|
||||
'required' => 'true',
|
||||
'autocomplete' => 'email',
|
||||
@@ -69,7 +69,6 @@ class ResetPassword extends Component
|
||||
Text::make('password')
|
||||
->type('password')
|
||||
->label('Password')
|
||||
->model('password',)
|
||||
->extraAttributes([
|
||||
'required' => 'true',
|
||||
'autofocus' => 'true',
|
||||
@@ -78,7 +77,6 @@ class ResetPassword extends Component
|
||||
Text::make('password_confirmation')
|
||||
->type('password')
|
||||
->label('Confirm New Password')
|
||||
->model('password_confirmation',)
|
||||
->extraAttributes([
|
||||
'required' => 'true',
|
||||
'autocomplete' => 'new-password',
|
||||
|
||||
@@ -82,23 +82,21 @@ class Profile extends Component
|
||||
return [
|
||||
Tabs::label('Profile')
|
||||
->tab('Account', [
|
||||
Text::make('name')
|
||||
Text::make('user.name')
|
||||
->label('Name')
|
||||
->model('user.name')
|
||||
->extraAttributes([
|
||||
'required' => 'true',
|
||||
]),
|
||||
Text::make('email')
|
||||
Text::make('user.email')
|
||||
->type('email')
|
||||
->label('E-Mail Address')
|
||||
->model('user.email', 'wire:model.lazy')
|
||||
->modelDirective('wire:model.lazy')
|
||||
->extraAttributes([
|
||||
'required' => 'true',
|
||||
'autocomplete' => 'email',
|
||||
]),
|
||||
Avatar::make('avatar')
|
||||
->label('User Photo')
|
||||
->model('avatar')
|
||||
->avatar($this->avatar)
|
||||
->user($this->user)
|
||||
->delete('deleteAvatar')
|
||||
@@ -108,7 +106,6 @@ class Profile extends Component
|
||||
Text::make('password')
|
||||
->type('password')
|
||||
->label('Password')
|
||||
->model('password',)
|
||||
->extraAttributes([
|
||||
'autocomplete' => 'new-password',
|
||||
])
|
||||
@@ -117,7 +114,6 @@ class Profile extends Component
|
||||
Text::make('password_confirmation')
|
||||
->type('password')
|
||||
->label('Confirm New Password')
|
||||
->model('password_confirmation',)
|
||||
->extraAttributes([
|
||||
'autocomplete' => 'new-password',
|
||||
])
|
||||
|
||||
Reference in New Issue
Block a user