diff --git a/docs/columns/available-methods.md b/docs/columns/available-methods.md
index ebd7fa051..23797087d 100644
--- a/docs/columns/available-methods.md
+++ b/docs/columns/available-methods.md
@@ -153,7 +153,15 @@ The component has the ability to collapse certain columns at different screen si
![Collapsing](https://imgur.com/z1rWHzP.png)
-You have 2 options when it comes to collapsing.
+You have 3 options when it comes to collapsing.
+
+Collapse Always:
+
+```php
+Column::make('Name')
+ ->collapseAlways(),
+```
+The columns will always be collapsed
Collapse on tablet:
diff --git a/resources/views/components/table/row-contents.blade.php b/resources/views/components/table/row-contents.blade.php
index d3602c9a7..1e4aea9a5 100644
--- a/resources/views/components/table/row-contents.blade.php
+++ b/resources/views/components/table/row-contents.blade.php
@@ -6,6 +6,10 @@
$colspan = $component->getColspanCount();
$columns = collect();
+ if($component->shouldCollapseAlways())
+ {
+ $columns->push($component->getCollapsedAlwaysColumns());
+ }
if ($component->shouldCollapseOnMobile() && $component->shouldCollapseOnTablet()) {
$columns->push($component->getCollapsedMobileColumns());
$columns->push($component->getCollapsedTabletColumns());
@@ -26,8 +30,8 @@
wire:loading.class.delay="opacity-50 dark:bg-gray-900 dark:opacity-60"
@class([
- 'hidden md:hidden bg-white dark:bg-gray-700 dark:text-white' => $component->isTailwind(),
- 'd-none d-md-none' => $component->isBootstrap()
+ 'hidden bg-white dark:bg-gray-700 dark:text-white' => $component->isTailwind(),
+ 'd-none' => $component->isBootstrap()
])
>
columnSelectIsEnabled() && ! $this->columnSelectIsEnabledForColumn($column))
$component->isTailwind() && $column->shouldCollapseOnMobile(),
- 'block mb-2 md:hidden' => $component->isTailwind() && $column->shouldCollapseOnTablet(),
- 'd-block mb-2 d-sm-none' => $component->isBootstrap() && $column->shouldCollapseOnMobile(),
- 'd-block mb-2 d-md-none' => $component->isBootstrap() && $column->shouldCollapseOnTablet(),
+ 'block mb-2' => $component->isTailwind() && $column->shouldCollapseAlways(),
+ 'block mb-2 sm:hidden' => $component->isTailwind() && !$column->shouldCollapseAlways() && !$column->shouldCollapseOnTablet() && !$column->shouldCollapseOnMobile(),
+ 'block mb-2 md:hidden' => $component->isTailwind() && !$column->shouldCollapseAlways() && !$column->shouldCollapseOnTablet() && $column->shouldCollapseOnMobile(),
+ 'block mb-2 lg:hidden' => $component->isTailwind() && !$column->shouldCollapseAlways() && ($column->shouldCollapseOnTablet() || $column->shouldCollapseOnMobile()),
+
+ 'd-block mb-2' => $component->isBootstrap() && $column->shouldCollapseAlways(),
+ 'd-block mb-2 d-sm-none' => $component->isBootstrap() && !$column->shouldCollapseAlways() && !$column->shouldCollapseOnTablet() && !$column->shouldCollapseOnMobile(),
+ 'd-block mb-2 d-md-none' => $component->isBootstrap() && !$column->shouldCollapseAlways() && !$column->shouldCollapseOnTablet() && $column->shouldCollapseOnMobile(),
+ 'd-block mb-2 d-lg-none' => $component->isBootstrap() && !$column->shouldCollapseAlways() && ($column->shouldCollapseOnTablet() || $column->shouldCollapseOnMobile()),
+
])
>
{{ $column->getTitle() }}: {{ $column->renderContents($row) }}
diff --git a/resources/views/components/table/td.blade.php b/resources/views/components/table/td.blade.php
index 3ff531c81..2201356d2 100644
--- a/resources/views/components/table/td.blade.php
+++ b/resources/views/components/table/td.blade.php
@@ -14,6 +14,7 @@
{{
$attributes->merge($customAttributes)
->class(['px-6 py-4 whitespace-nowrap text-sm font-medium dark:text-white' => $customAttributes['default'] ?? true])
+ ->class(['hidden' => $column && $column->shouldCollapseAlways()])
->class(['hidden sm:table-cell' => $column && $column->shouldCollapseOnMobile()])
->class(['hidden md:table-cell' => $column && $column->shouldCollapseOnTablet()])
->except('default')
@@ -31,6 +32,7 @@
{{
$attributes->merge($customAttributes)
->class(['' => $customAttributes['default'] ?? true])
+ ->class(['d-none' => $column && $column->shouldCollapseAlways()])
->class(['d-none d-sm-table-cell' => $column && $column->shouldCollapseOnMobile()])
->class(['d-none d-md-table-cell' => $column && $column->shouldCollapseOnTablet()])
->except('default')
diff --git a/resources/views/components/table/td/plain.blade.php b/resources/views/components/table/td/plain.blade.php
index 3da291073..1135cf0f5 100644
--- a/resources/views/components/table/td/plain.blade.php
+++ b/resources/views/components/table/td/plain.blade.php
@@ -5,6 +5,7 @@
| merge($customAttributes)
->class(['px-6 py-4 whitespace-nowrap text-sm font-medium dark:text-white' => $customAttributes['default'] ?? true])
+ ->class(['hidden' => $column && $column->shouldCollapseAlways()])
->class(['hidden sm:table-cell' => $column && $column->shouldCollapseOnMobile()])
->class(['hidden md:table-cell' => $column && $column->shouldCollapseOnTablet()])
->except('default')
@@ -15,6 +16,7 @@
| merge($customAttributes)
->class(['' => $customAttributes['default'] ?? true])
+ ->class(['d-none' => $column && $column->shouldCollapseAlways()])
->class(['d-none d-sm-table-cell' => $column && $column->shouldCollapseOnMobile()])
->class(['d-none d-md-table-cell' => $column && $column->shouldCollapseOnTablet()])
->except('default')
diff --git a/resources/views/components/table/td/row-contents.blade.php b/resources/views/components/table/td/row-contents.blade.php
index d74bb4eb0..017664f74 100644
--- a/resources/views/components/table/td/row-contents.blade.php
+++ b/resources/views/components/table/td/row-contents.blade.php
@@ -3,24 +3,20 @@
@if ($component->collapsingColumnsAreEnabled() && $component->hasCollapsedColumns())
@if ($component->isTailwind())
- | merge(['class' => 'p-3 table-cell text-center'])
- ->class([
- 'md:hidden' =>
- (($component->shouldCollapseOnMobile() && $component->shouldCollapseOnTablet()) ||
- ($component->shouldCollapseOnTablet() && ! $component->shouldCollapseOnMobile()))
- ])
- ->class(['sm:hidden' => $component->shouldCollapseOnMobile() && ! $component->shouldCollapseOnTablet()])
+ ->merge(['class' => 'p-3 table-cell text-center '])
+ ->class(['sm:hidden' => !$component->shouldCollapseAlways() && !$component->shouldCollapseOnTablet()])
+ ->class(['md:hidden' => !$component->shouldCollapseAlways() && !$component->shouldCollapseOnTablet() && $component->shouldCollapseOnMobile()])
+ ->class(['lg:hidden' => !$component->shouldCollapseAlways() && ($component->shouldCollapseOnTablet() || $component->shouldCollapseOnMobile())])
}}
:class="currentlyReorderingStatus ? 'laravel-livewire-tables-reorderingMinimised' : ''"
>
@if (! $hidden)
|
@elseif ($component->isBootstrap())
- class([
- 'd-md-none' =>
- (($component->shouldCollapseOnMobile() && $component->shouldCollapseOnTablet()) ||
- ($component->shouldCollapseOnTablet() && ! $component->shouldCollapseOnMobile()))
- ])
- ->class(['d-sm-none' => $component->shouldCollapseOnMobile() && ! $component->shouldCollapseOnTablet()])
+ ->class(['d-sm-none' => !$component->shouldCollapseAlways() && !$component->shouldCollapseOnTablet()])
+ ->class(['d-md-none' => !$component->shouldCollapseAlways() && !$component->shouldCollapseOnTablet() && $component->shouldCollapseOnMobile()])
+ ->class(['d-lg-none' => !$component->shouldCollapseAlways() && ($component->shouldCollapseOnTablet() || $component->shouldCollapseOnMobile())])
}}
+ :class="currentlyReorderingStatus ? 'laravel-livewire-tables-reorderingMinimised' : ''"
>
@if (! $hidden)
|