diff --git a/resources/js/tall-datatables.js b/resources/js/tall-datatables.js
index bbaf9d0..4a050d3 100644
--- a/resources/js/tall-datatables.js
+++ b/resources/js/tall-datatables.js
@@ -91,6 +91,29 @@ document.addEventListener('alpine:init', () => {
                     }
                 });
             },
+            searchable(data, search = null) {
+                if (!search) {
+                    return data;
+                }
+
+                // data could be an object or an array, search in both
+                // if its an object we have to return an object
+                if (typeof data === 'object') {
+                    let obj = {};
+                    for (const [key, value] of Object.entries(data)) {
+                        if (JSON.stringify(value).toLowerCase().includes(search.toLowerCase())) {
+                            obj[key] = value;
+                        }
+                    }
+
+                    return obj;
+                }
+
+                // its an array, return all items that include the search string
+                return data.filter(item => {
+                    return JSON.stringify(item).toLowerCase().includes(search.toLowerCase());
+                });
+            },
             loadTableConfig() {
                 $wire.getConfig().then(
                     result => {
diff --git a/resources/views/components/options.blade.php b/resources/views/components/options.blade.php
index 52a21a9..6510d1b 100644
--- a/resources/views/components/options.blade.php
+++ b/resources/views/components/options.blade.php
@@ -1,4 +1,4 @@
-<div class="mt-2" x-init.once="columnsSortable($el.querySelector('.table-cols'))">
+<div class="mt-2" x-data="{searchRelations: null, searchColumns: null, searchAggregatable: null}" x-init.once="columnsSortable($el.querySelector('.table-cols'))">
     @if(auth()->user() && method_exists(auth()->user(), 'datatableUserSettings'))
         <x-dialog z-index="z-40" id="save-filter" :title="__('Save filter')">
             <x-input required :label="__('Filter name')" x-model="filterName" />
@@ -496,8 +496,16 @@ class="w-full"
         @endif
         @if($this->aggregatable)
             <div x-cloak x-show="tab === 'summarize'">
+                <div class="pb-2">
+                    <x-input
+                        type="search"
+                        x-model.debounce.300ms="searchAggregatable"
+                        placeholder="{{ __('Search') }}"
+                        class="w-full"
+                    />
+                </div>
                 <div class="grid grid-cols-1 gap-3">
-                    <template x-for="col in aggregatable">
+                    <template x-for="col in searchable(aggregatable, searchAggregatable)">
                         <div>
                             <x-label>
                                 <span x-text="getLabel(col)">
@@ -573,14 +581,14 @@ class="block text-sm font-medium text-gray-700 dark:text-gray-50"
                 <div class="text-sm font-medium text-gray-700 dark:text-gray-50">
                     <div class="flex overflow-x-auto">
                         <div class="flex gap-1.5 items-center">
-                            <x-button flat primary x-on:click="$wire.$parent.loadSlug()" >
+                            <x-button flat primary x-on:click="searchRelations = null; searchColumns = null; $wire.$parent.loadSlug()" >
                                 <span class="whitespace-nowrap">{{ __('This table') }}</span>
                             </x-button>
                             <x-icon name="chevron-right" class="h-4 w-4"/>
                         </div>
                         <template x-for="segment in $wire.$parent.displayPath">
                             <div class="flex gap-1.5 items-center">
-                                <x-button flat primary x-on:click="$wire.$parent.loadSlug(segment.value)" >
+                                <x-button flat primary x-on:click="searchRelations = null; searchColumns = null; $wire.$parent.loadSlug(segment.value)" >
                                     <span class="whitespace-nowrap" x-text="segment.label"></span>
                                 </x-button>
                                 <x-icon name="chevron-right" class="h-4 w-4"/>
@@ -588,9 +596,17 @@ class="block text-sm font-medium text-gray-700 dark:text-gray-50"
                         </template>
                     </div>
                     <hr class="pb-2.5">
-                    <div class="grid grid-cols-2">
+                    <div class="grid grid-cols-2 gap-1.5">
                         <div>
-                            <template x-for="col in $wire.$parent.selectedCols">
+                            <div class="pb-2">
+                                <x-input
+                                    type="search"
+                                    x-model.debounce.300ms="searchColumns"
+                                    placeholder="{{ __('Search') }}"
+                                    class="w-full"
+                                />
+                            </div>
+                            <template x-for="col in searchable($wire.$parent.selectedCols, searchColumns)">
                                 <div class="flex gap-1.5">
                                     <x-checkbox
                                         x-bind:checked="$wire.$parent.enabledCols.includes(col.attribute)"
@@ -605,8 +621,16 @@ class="block text-sm font-medium text-gray-700 dark:text-gray-50"
                             </template>
                         </div>
                         <div>
-                            <template x-for="relation in $wire.$parent.selectedRelations">
-                                <div class="flex gap-1.5 cursor-pointer items-center" x-on:click="$wire.$parent.loadRelation(relation.model, relation.name)">
+                            <div class="pb-2">
+                                <x-input
+                                    type="search"
+                                    x-model.debounce.300ms="searchRelations"
+                                    placeholder="{{ __('Search') }}"
+                                    class="w-full"
+                                />
+                            </div>
+                            <template x-for="relation in searchable($wire.$parent.selectedRelations, searchRelations)">
+                                <div class="flex gap-1.5 cursor-pointer items-center" x-on:click="searchRelations = null; searchColumns = null; $wire.$parent.loadRelation(relation.model, relation.name);">
                                     <span class="overflow-hidden text-ellipsis whitespace-nowrap" x-text="relation.label"></span>
                                     <x-icon name="chevron-right" class="h-4 w-4"/>
                                 </div>
diff --git a/src/Traits/DataTables/SupportsRelations.php b/src/Traits/DataTables/SupportsRelations.php
index f27fc79..9bd20f4 100644
--- a/src/Traits/DataTables/SupportsRelations.php
+++ b/src/Traits/DataTables/SupportsRelations.php
@@ -365,7 +365,7 @@ protected function getFilterValueList(string $enabledCol, Attribute $attributeIn
             return;
         }
 
-        if ($attributeInfo->type === 'boolean') {
+        if ($attributeInfo->phpType === 'bool' || $attributeInfo->cast === 'boolean') {
             $this->filterValueLists[$enabledCol] = [
                 [
                     'value' => 1,
diff --git a/tailwind.config.js b/tailwind.config.js
index 48346b3..217296e 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -1,5 +1,9 @@
 module.exports = {
-    content: ['./js/**/*.js', './resources/views/**/*.blade.php', './src/**/*.php'],
+    content: [
+        __dirname + '/js/**/*.js',
+        __dirname + '/resources/views/**/*.blade.php',
+        __dirname + '/src/**/*.php'
+    ],
     darkMode: 'class',
     plugins: [require('@tailwindcss/forms')],
 }