Skip to content

Commit 8d3e19d

Browse files
committed
Added place to put modals in the scope of the component
1 parent 48b9907 commit 8d3e19d

File tree

6 files changed

+111
-87
lines changed

6 files changed

+111
-87
lines changed

CHANGELOG.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ All notable changes to `laravel-livewire-tables` will be documented in this file
99
### Added
1010

1111
- [Actual default sorting](https://github.com/rappasoft/laravel-livewire-tables/pull/313)
12+
- [Added place to put modals in the scope of the component](https://github.com/rappasoft/laravel-livewire-tables/wiki/Working-with-modals)
1213

1314
### Changed
1415

Lines changed: 34 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,42 @@
1-
<div
2-
@if (is_numeric($refresh))
3-
wire:poll.{{ $refresh }}ms
4-
@elseif(is_string($refresh))
5-
@if ($refresh === '.keep-alive' || $refresh === 'keep-alive')
6-
wire:poll.keep-alive
7-
@elseif($refresh === '.visible' || $refresh === 'visible')
8-
wire:poll.visible
9-
@else
10-
wire:poll="{{ $refresh }}"
1+
<div>
2+
<div
3+
@if (is_numeric($refresh))
4+
wire:poll.{{ $refresh }}ms
5+
@elseif(is_string($refresh))
6+
@if ($refresh === '.keep-alive' || $refresh === 'keep-alive')
7+
wire:poll.keep-alive
8+
@elseif($refresh === '.visible' || $refresh === 'visible')
9+
wire:poll.visible
10+
@else
11+
wire:poll="{{ $refresh }}"
12+
@endif
1113
@endif
12-
@endif
13-
class="container-fluid p-0"
14-
>
15-
@include('livewire-tables::bootstrap-4.includes.offline')
16-
@include('livewire-tables::bootstrap-4.includes.sorting-pills')
17-
@include('livewire-tables::bootstrap-4.includes.filter-pills')
14+
class="container-fluid p-0"
15+
>
16+
@include('livewire-tables::bootstrap-4.includes.offline')
17+
@include('livewire-tables::bootstrap-4.includes.sorting-pills')
18+
@include('livewire-tables::bootstrap-4.includes.filter-pills')
1819

19-
<div class="d-md-flex justify-content-between mb-3">
20-
<div class="d-md-flex">
21-
@include('livewire-tables::bootstrap-4.includes.search')
20+
<div class="d-md-flex justify-content-between mb-3">
21+
<div class="d-md-flex">
22+
@include('livewire-tables::bootstrap-4.includes.search')
2223

23-
@if ($showFilterDropdown)
24-
<div class="ml-0 ml-md-3 mb-3 mb-md-0">
25-
@include('livewire-tables::bootstrap-4.includes.filters')
26-
</div>
27-
@endif
28-
</div>
24+
@if ($showFilterDropdown)
25+
<div class="ml-0 ml-md-3 mb-3 mb-md-0">
26+
@include('livewire-tables::bootstrap-4.includes.filters')
27+
</div>
28+
@endif
29+
</div>
2930

30-
<div class="d-md-flex">
31-
@include('livewire-tables::bootstrap-4.includes.bulk-actions')
32-
@include('livewire-tables::bootstrap-4.includes.per-page')
31+
<div class="d-md-flex">
32+
@include('livewire-tables::bootstrap-4.includes.bulk-actions')
33+
@include('livewire-tables::bootstrap-4.includes.per-page')
34+
</div>
3335
</div>
36+
37+
@include('livewire-tables::bootstrap-4.includes.table')
38+
@include('livewire-tables::bootstrap-4.includes.pagination')
3439
</div>
3540

36-
@include('livewire-tables::bootstrap-4.includes.table')
37-
@include('livewire-tables::bootstrap-4.includes.pagination')
41+
@include($modalsView)
3842
</div>
Lines changed: 34 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,42 @@
1-
<div
2-
@if (is_numeric($refresh))
3-
wire:poll.{{ $refresh }}ms
4-
@elseif(is_string($refresh))
5-
@if ($refresh === '.keep-alive' || $refresh === 'keep-alive')
6-
wire:poll.keep-alive
7-
@elseif($refresh === '.visible' || $refresh === 'visible')
8-
wire:poll.visible
9-
@else
10-
wire:poll="{{ $refresh }}"
1+
<div>
2+
<div
3+
@if (is_numeric($refresh))
4+
wire:poll.{{ $refresh }}ms
5+
@elseif(is_string($refresh))
6+
@if ($refresh === '.keep-alive' || $refresh === 'keep-alive')
7+
wire:poll.keep-alive
8+
@elseif($refresh === '.visible' || $refresh === 'visible')
9+
wire:poll.visible
10+
@else
11+
wire:poll="{{ $refresh }}"
12+
@endif
1113
@endif
12-
@endif
13-
class="container-fluid p-0"
14-
>
15-
@include('livewire-tables::bootstrap-5.includes.offline')
16-
@include('livewire-tables::bootstrap-5.includes.sorting-pills')
17-
@include('livewire-tables::bootstrap-5.includes.filter-pills')
14+
class="container-fluid p-0"
15+
>
16+
@include('livewire-tables::bootstrap-5.includes.offline')
17+
@include('livewire-tables::bootstrap-5.includes.sorting-pills')
18+
@include('livewire-tables::bootstrap-5.includes.filter-pills')
1819

19-
<div class="d-md-flex justify-content-between mb-3">
20-
<div class="d-md-flex">
21-
@include('livewire-tables::bootstrap-5.includes.search')
20+
<div class="d-md-flex justify-content-between mb-3">
21+
<div class="d-md-flex">
22+
@include('livewire-tables::bootstrap-5.includes.search')
2223

23-
@if ($showFilterDropdown)
24-
<div class="ms-0 ms-md-3 mb-3 mb-md-0">
25-
@include('livewire-tables::bootstrap-5.includes.filters')
26-
</div>
27-
@endif
28-
</div>
24+
@if ($showFilterDropdown)
25+
<div class="ms-0 ms-md-3 mb-3 mb-md-0">
26+
@include('livewire-tables::bootstrap-5.includes.filters')
27+
</div>
28+
@endif
29+
</div>
2930

30-
<div class="d-md-flex">
31-
@include('livewire-tables::bootstrap-5.includes.bulk-actions')
32-
@include('livewire-tables::bootstrap-5.includes.per-page')
31+
<div class="d-md-flex">
32+
@include('livewire-tables::bootstrap-5.includes.bulk-actions')
33+
@include('livewire-tables::bootstrap-5.includes.per-page')
34+
</div>
3335
</div>
36+
37+
@include('livewire-tables::bootstrap-5.includes.table')
38+
@include('livewire-tables::bootstrap-5.includes.pagination')
3439
</div>
3540

36-
@include('livewire-tables::bootstrap-5.includes.table')
37-
@include('livewire-tables::bootstrap-5.includes.pagination')
41+
@include($modalsView)
3842
</div>

resources/views/stubs/modals.blade.php

Whitespace-only changes.
Lines changed: 31 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,39 @@
1-
<div
2-
@if (is_numeric($refresh))
3-
wire:poll.{{ $refresh }}ms
4-
@elseif(is_string($refresh))
5-
@if ($refresh === '.keep-alive' || $refresh === 'keep-alive')
6-
wire:poll.keep-alive
7-
@elseif($refresh === '.visible' || $refresh === 'visible')
8-
wire:poll.visible
9-
@else
10-
wire:poll="{{ $refresh }}"
1+
<div>
2+
<div
3+
@if (is_numeric($refresh))
4+
wire:poll.{{ $refresh }}ms
5+
@elseif(is_string($refresh))
6+
@if ($refresh === '.keep-alive' || $refresh === 'keep-alive')
7+
wire:poll.keep-alive
8+
@elseif($refresh === '.visible' || $refresh === 'visible')
9+
wire:poll.visible
10+
@else
11+
wire:poll="{{ $refresh }}"
12+
@endif
1113
@endif
12-
@endif
13-
>
14-
@include('livewire-tables::tailwind.includes.offline')
14+
>
15+
@include('livewire-tables::tailwind.includes.offline')
1516

16-
<div class="flex-col space-y-4">
17-
@include('livewire-tables::tailwind.includes.sorting-pills')
18-
@include('livewire-tables::tailwind.includes.filter-pills')
17+
<div class="flex-col space-y-4">
18+
@include('livewire-tables::tailwind.includes.sorting-pills')
19+
@include('livewire-tables::tailwind.includes.filter-pills')
1920

20-
<div class="md:flex md:justify-between p-6 md:p-0">
21-
<div class="w-full mb-4 md:mb-0 md:w-2/4 md:flex space-y-4 md:space-y-0 md:space-x-4">
22-
@include('livewire-tables::tailwind.includes.search')
23-
@include('livewire-tables::tailwind.includes.filters')
24-
</div>
21+
<div class="md:flex md:justify-between p-6 md:p-0">
22+
<div class="w-full mb-4 md:mb-0 md:w-2/4 md:flex space-y-4 md:space-y-0 md:space-x-4">
23+
@include('livewire-tables::tailwind.includes.search')
24+
@include('livewire-tables::tailwind.includes.filters')
25+
</div>
2526

26-
<div class="md:space-x-2 md:flex md:items-center">
27-
@include('livewire-tables::tailwind.includes.bulk-actions')
28-
@include('livewire-tables::tailwind.includes.per-page')
27+
<div class="md:space-x-2 md:flex md:items-center">
28+
@include('livewire-tables::tailwind.includes.bulk-actions')
29+
@include('livewire-tables::tailwind.includes.per-page')
30+
</div>
2931
</div>
30-
</div>
3132

32-
@include('livewire-tables::tailwind.includes.table')
33-
@include('livewire-tables::tailwind.includes.pagination')
33+
@include('livewire-tables::tailwind.includes.table')
34+
@include('livewire-tables::tailwind.includes.pagination')
35+
</div>
3436
</div>
37+
38+
@include($modalsView)
3539
</div>

src/DataTableComponent.php

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -180,6 +180,16 @@ public function rowView(): string
180180
return 'livewire-tables::'.config('livewire-tables.theme').'.components.table.row-columns';
181181
}
182182

183+
/**
184+
* The view to add any modals for the table, could also be used for any non-visible html
185+
*
186+
* @return string
187+
*/
188+
public function modalsView(): string
189+
{
190+
return 'livewire-tables::stubs.modals';
191+
}
192+
183193
/**
184194
* @return mixed
185195
*/
@@ -192,6 +202,7 @@ public function render()
192202
'filtersView' => $this->filtersView(),
193203
'customFilters' => $this->filters(),
194204
'rows' => $this->rows,
205+
'modalsView' => $this->modalsView(),
195206
]);
196207
}
197208

0 commit comments

Comments
 (0)