Skip to content
This repository was archived by the owner on Jan 2, 2024. It is now read-only.

Commit 1578e71

Browse files
authored
Tailwind Forms simple views (#75)
1 parent 1a113fd commit 1578e71

13 files changed

+204
-35
lines changed

.github/workflows/run-tests.yml

Lines changed: 33 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -3,41 +3,41 @@ name: run-tests
33
on: [push, pull_request]
44

55
jobs:
6-
test:
7-
runs-on: ubuntu-latest
8-
strategy:
9-
fail-fast: true
10-
matrix:
11-
php: [8.1, 8.0, 7.4]
12-
laravel: [8.*]
13-
framework: [tailwind, tailwind-2, bootstrap-4, bootstrap-5]
14-
dependency-version: [prefer-lowest, prefer-stable]
15-
include:
16-
- laravel: 8.*
17-
testbench: 6.*
18-
exclude:
19-
- laravel: 7.*
20-
php: 8.1
6+
test:
7+
runs-on: ubuntu-latest
8+
strategy:
9+
fail-fast: true
10+
matrix:
11+
php: [8.1, 8.0, 7.4]
12+
laravel: [8.*]
13+
framework: [tailwind, tailwind-2, tailwind-forms-simple, bootstrap-4, bootstrap-5]
14+
dependency-version: [prefer-lowest, prefer-stable]
15+
include:
16+
- laravel: 8.*
17+
testbench: 6.*
18+
exclude:
19+
- laravel: 7.*
20+
php: 8.1
2121

22-
name: P${{ matrix.php }} - Laravel ${{ matrix.laravel }} - ${{ matrix.dependency-version }} - Front-end Framework ${{ matrix.framework }}
22+
name: P${{ matrix.php }} - Laravel ${{ matrix.laravel }} - ${{ matrix.dependency-version }} - Front-end Framework ${{ matrix.framework }}
2323

24-
steps:
25-
- name: Checkout code
26-
uses: actions/checkout@v2
24+
steps:
25+
- name: Checkout code
26+
uses: actions/checkout@v2
2727

28-
- name: Setup PHP
29-
uses: shivammathur/setup-php@v2
30-
with:
31-
php-version: ${{ matrix.php }}
32-
extensions: dom, curl, libxml, mbstring, zip, pcntl, pdo, sqlite, pdo_sqlite, bcmath, soap, intl, gd, exif, iconv, imagick, mysql, mysqli, pdo_mysql
33-
coverage: none
28+
- name: Setup PHP
29+
uses: shivammathur/setup-php@v2
30+
with:
31+
php-version: ${{ matrix.php }}
32+
extensions: dom, curl, libxml, mbstring, zip, pcntl, pdo, sqlite, pdo_sqlite, bcmath, soap, intl, gd, exif, iconv, imagick, mysql, mysqli, pdo_mysql
33+
coverage: none
3434

35-
- name: Install dependencies
36-
run: |
37-
composer require "laravel/framework:${{ matrix.laravel }}" "orchestra/testbench:${{ matrix.testbench }}" --no-interaction --no-update
38-
composer update --${{ matrix.dependency-version }} --prefer-dist --no-interaction --no-suggest
35+
- name: Install dependencies
36+
run: |
37+
composer require "laravel/framework:${{ matrix.laravel }}" "orchestra/testbench:${{ matrix.testbench }}" --no-interaction --no-update
38+
composer update --${{ matrix.dependency-version }} --prefer-dist --no-interaction --no-suggest
3939
40-
- name: Execute tests
41-
env:
42-
FORM_COMPONENTS_FRAMEWORK: ${{ matrix.framework }}
43-
run: vendor/bin/phpunit
40+
- name: Execute tests
41+
env:
42+
FORM_COMPONENTS_FRAMEWORK: ${{ matrix.framework }}
43+
run: vendor/bin/phpunit

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,7 @@ The `action` attribute is optional, but you can pass a hard-coded, primitive val
102102

103103
## Configuration
104104

105-
You can switch frameworks by updating the `framework` setting in the `form-components.php` configuration file. Check out the [customization section](#customize-the-blade-views) on publishing the configuration and view files.
105+
You can switch frameworks by updating the `framework` setting in the `form-components.php` configuration file. Check out the [customization section](#customize-the-blade-views) on publishing the configuration and view files. If you're using the [Livewire Stack with Laravel Jetstream](https://jetstream.laravel.com/2.x/stacks/livewire.html), you probably want to set the `framework` configuration key to `tailwind-forms-simple`.
106106

107107
```php
108108
return [

config/config.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
return [
66
'prefix' => '',
77

8-
/** tailwind | tailwind-2 | bootstrap-4 | bootstrap-5 */
8+
/** tailwind | tailwind-2 | tailwind-forms-simple | bootstrap-4 | bootstrap-5 */
99
'framework' => 'tailwind',
1010

1111
'use_eloquent_date_casting' => false,
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<div class="flex flex-col">
2+
<label class="flex items-center">
3+
<input {!! $attributes->merge(['class' => 'rounded border-gray-300 text-indigo-600 shadow-sm focus:border-indigo-300 focus:ring focus:ring-offset-0 focus:ring-indigo-200 focus:ring-opacity-50']) !!}
4+
type="checkbox"
5+
value="{{ $value }}"
6+
7+
@if($isWired())
8+
wire:model{!! $wireModifier() !!}="{{ $name }}"
9+
@endif
10+
11+
name="{{ $name }}"
12+
13+
@if($checked)
14+
checked="checked"
15+
@endif
16+
/>
17+
18+
<span class="ml-2">{{ $label }}</span>
19+
</label>
20+
21+
@if($hasErrorAndShow($name))
22+
<x-form-errors :name="$name" />
23+
@endif
24+
</div>
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
@error($name, $bag)
2+
<p {!! $attributes->merge(['class' => 'mt-2 text-sm text-red-600']) !!}>
3+
{{ $message }}
4+
</p>
5+
@enderror
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<div {!! $attributes->merge(['class' => 'mt-4']) !!}>
2+
<x-form-label :label="$label" />
3+
4+
<div class="@if($label) mt-2 @endif @if($inline) flex flex-wrap space-x-6 @endif">
5+
{!! $slot !!}
6+
</div>
7+
8+
@if($hasErrorAndShow($name))
9+
<x-form-errors :name="$name" />
10+
@endif
11+
</div>
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<div class="@if($type === 'hidden') hidden @else mt-4 @endif">
2+
<label class="block">
3+
<x-form-label :label="$label" />
4+
5+
<input {!! $attributes->merge([
6+
'class' => 'block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50 ' . ($label ? 'mt-1' : '')
7+
]) !!}
8+
@if($isWired())
9+
wire:model{!! $wireModifier() !!}="{{ $name }}"
10+
@else
11+
value="{{ $value }}"
12+
@endif
13+
14+
name="{{ $name }}"
15+
type="{{ $type }}" />
16+
</label>
17+
18+
@if($hasErrorAndShow($name))
19+
<x-form-errors :name="$name" />
20+
@endif
21+
</div>
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
@if($label)
2+
<span {!! $attributes->merge(['class' => 'text-gray-700']) !!}>{{ $label }}</span>
3+
@endif
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<div>
2+
<label class="inline-flex items-center">
3+
<input {!! $attributes->merge(['class' => 'rounded-full border-gray-300 text-indigo-600 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50']) !!}
4+
type="radio"
5+
6+
@if($isWired())
7+
wire:model{!! $wireModifier() !!}="{{ $name }}"
8+
@endif
9+
10+
name="{{ $name }}"
11+
value="{{ $value }}"
12+
13+
@if($checked)
14+
checked="checked"
15+
@endif
16+
/>
17+
18+
<span class="ml-2">{{ $label }}</span>
19+
</label>
20+
21+
@if($hasErrorAndShow($name))
22+
<x-form-errors :name="$name" />
23+
@endif
24+
</div>
Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
<div class="mt-4">
2+
<label class="block">
3+
<x-form-label :label="$label" />
4+
5+
<select
6+
@if($isWired())
7+
wire:model{!! $wireModifier() !!}="{{ $name }}"
8+
@endif
9+
10+
name="{{ $name }}"
11+
12+
@if($multiple)
13+
multiple
14+
@endif
15+
16+
@if($placeholder)
17+
placeholder="{{ $placeholder }}"
18+
@endif
19+
20+
{!! $attributes->merge([
21+
'class' => ($label ? 'mt-1 ' : '') . 'block w-full mt-1 rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50'
22+
]) !!}>
23+
24+
@if($placeholder)
25+
<option value="" disabled @if($nothingSelected()) selected="selected" @endif>
26+
{{ $placeholder }}
27+
</option>
28+
@endif
29+
30+
@forelse($options as $key => $option)
31+
<option value="{{ $key }}" @if($isSelected($key)) selected="selected" @endif>
32+
{{ $option }}
33+
</option>
34+
@empty
35+
{!! $slot !!}
36+
@endforelse
37+
</select>
38+
</label>
39+
40+
@if($hasErrorAndShow($name))
41+
<x-form-errors :name="$name" />
42+
@endif
43+
</div>
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<div class="mt-6 flex items-center justify-between">
2+
<button {!! $attributes->merge([
3+
'class' => 'inline-flex items-center px-4 py-2 bg-gray-800 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-gray-700 active:bg-gray-900 focus:outline-none focus:border-gray-900 focus:ring focus:ring-gray-300 disabled:opacity-25 transition',
4+
'type' => 'submit'
5+
]) !!}>
6+
{!! trim($slot) ?: __('Submit') !!}
7+
</button>
8+
</div>
Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<div class="mt-4">
2+
<label class="block">
3+
<x-form-label :label="$label" />
4+
5+
<textarea
6+
@if($isWired())
7+
wire:model{!! $wireModifier() !!}="{{ $name }}"
8+
@endif
9+
10+
name="{{ $name }}"
11+
12+
{!! $attributes->merge(['class' => 'block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50' . ($label ? ' mt-1' : '')]) !!}
13+
>@unless($isWired()){!! $value !!}@endunless</textarea>
14+
</label>
15+
16+
@if($hasErrorAndShow($name))
17+
<x-form-errors :name="$name" />
18+
@endif
19+
</div>
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<form method="{{ $spoofMethod ? 'POST' : $method }}" {!! $attributes !!}>
2+
@unless(in_array($method, ['HEAD', 'GET', 'OPTIONS']))
3+
@csrf
4+
@endunless
5+
6+
@if($spoofMethod)
7+
@method($method)
8+
@endif
9+
10+
{!! $slot !!}
11+
</form>

0 commit comments

Comments
 (0)