feat:add auto grow text box
This commit is contained in:
@@ -0,0 +1,64 @@
|
|||||||
|
@props([
|
||||||
|
'uuid' => md5(rand()),
|
||||||
|
'label' => '',
|
||||||
|
'hint' => '',
|
||||||
|
'errorField' => '',
|
||||||
|
'rows' => 4
|
||||||
|
])
|
||||||
|
|
||||||
|
<div class="mt-1">
|
||||||
|
<!-- STANDARD LABEL -->
|
||||||
|
@if($label)
|
||||||
|
<label for="{{ $uuid }}" class="pt-0 label label-text font-semibold">
|
||||||
|
<span>
|
||||||
|
{{ $label }}
|
||||||
|
|
||||||
|
@if($attributes->get('required'))
|
||||||
|
<span class="text-error">*</span>
|
||||||
|
@endif
|
||||||
|
</span>
|
||||||
|
</label>
|
||||||
|
@endif
|
||||||
|
|
||||||
|
<textarea {{ $attributes
|
||||||
|
->merge([
|
||||||
|
'id' => $uuid
|
||||||
|
])
|
||||||
|
->class([
|
||||||
|
'textarea textarea-primary w-full peer',
|
||||||
|
'border border-dashed' => $attributes->has('readonly') && $attributes->get('readonly') == true,
|
||||||
|
'textarea-error' => $errors->has($errorField)
|
||||||
|
])
|
||||||
|
}}
|
||||||
|
x-data="{
|
||||||
|
resize (rows) {
|
||||||
|
if (rows) {
|
||||||
|
$el.style.height = (rows * 32) + 'px'
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
$el.style.height = '0px';
|
||||||
|
$el.style.height = $el.scrollHeight + 'px'
|
||||||
|
}
|
||||||
|
}"
|
||||||
|
x-init="resize({{$rows}})"
|
||||||
|
@input="resize()"
|
||||||
|
type="text"
|
||||||
|
placeholder = "{{ $attributes->whereStartsWith('placeholder')->first() }}"
|
||||||
|
>{{ $slot }}</textarea>
|
||||||
|
|
||||||
|
@if($errors->has($errorField))
|
||||||
|
@foreach($errors->get($errorField) as $message)
|
||||||
|
@foreach(Arr::wrap($message) as $line)
|
||||||
|
<div class="{{ $errorClass }}" x-classes="text-red-500 label-text-alt p-1">{{ $line }}</div>
|
||||||
|
@break($firstErrorOnly)
|
||||||
|
@endforeach
|
||||||
|
@break($firstErrorOnly)
|
||||||
|
@endforeach
|
||||||
|
@endif
|
||||||
|
|
||||||
|
<!-- HINT -->
|
||||||
|
@if($hint)
|
||||||
|
<div x-classes="label-text-alt text-gray-400 py-1 pb-0">{{ $hint }}</div>
|
||||||
|
@endif
|
||||||
|
</div>
|
||||||
|
|
||||||
@@ -38,7 +38,7 @@ new class extends Component {
|
|||||||
public function update()
|
public function update()
|
||||||
{
|
{
|
||||||
$this->authorize('fullAccess', $this->portfolio);
|
$this->authorize('fullAccess', $this->portfolio);
|
||||||
|
|
||||||
$this->portfolio->update($this->validate());
|
$this->portfolio->update($this->validate());
|
||||||
$this->portfolio->save();
|
$this->portfolio->save();
|
||||||
|
|
||||||
@@ -70,7 +70,7 @@ new class extends Component {
|
|||||||
<x-ib-form wire:submit="{{ $portfolio ? 'update' : 'save' }}" class="col-span-3">
|
<x-ib-form wire:submit="{{ $portfolio ? 'update' : 'save' }}" class="col-span-3">
|
||||||
<x-input label="{{ __('Title') }}" wire:model="title" required />
|
<x-input label="{{ __('Title') }}" wire:model="title" required />
|
||||||
|
|
||||||
<x-textarea label="{{ __('Notes') }}" wire:model="notes" rows="4" />
|
<x-ib-textarea label="{{ __('Notes') }}" wire:model="notes" rows="4" />
|
||||||
|
|
||||||
@livewire('share-portfolio-form', ['portfolio' => $portfolio])
|
@livewire('share-portfolio-form', ['portfolio' => $portfolio])
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user