adds responsive option to DataTableComponent

Author: fabio-ivona

resources/views/bootstrap-4/components/table/table.blade.php

@@ -1,4 +1,4 @@
-<div class="table-responsive">
+<div class="{{$this->responsive ? 'table-responsive' : ''}}">
     <table {{ $attributes->except('wire:sortable') }} class="table table-striped">
         <thead>
             <tr>

resources/views/bootstrap-5/components/table/table.blade.php

@@ -1,4 +1,4 @@
-<div class="table-responsive">
+<div class="{{$this->responsive ? 'table-responsive' : ''}}">
     <table {{ $attributes->except('wire:sortable') }} class="table table-striped">
         <thead>
             <tr>

resources/views/tailwind/components/table/cell.blade.php

@@ -1,5 +1,5 @@
 @props(['customAttributes' => []])
 
-<td {{ $attributes->merge(array_merge(['class' => 'px-3 py-2 md:px-6 md:py-4 whitespace-nowrap text-sm leading-5 text-gray-900'], $customAttributes)) }}>
+<td {{ $attributes->merge(['class' => 'px-3 py-2 md:px-6 md:py-4 text-sm leading-5 text-gray-900'])->merge(['class' => $this->responsive ? 'whitespace-nowrap' : ''])->merge($customAttributes) }}>
     {{ $slot }}
 </td>

src/DataTableComponent.php

@@ -68,6 +68,13 @@ abstract class DataTableComponent extends Component
      */
     public string $emptyMessage = 'No items found. Try to broaden your search.';
 
+    /**
+     * Wheter or not to display a responsive table
+     *
+     * @var bool
+     */
+    public bool $responsive = true;
+
     /**
      * Name of the page parameter for pagination
      * Good to change the default if you have more than one datatable on a page.