From 14e1db578b21c2d477ad2ab4a346b9827aded354 Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Thu, 8 Jan 2026 16:17:59 +0000
Subject: [PATCH 01/12] Fix positioning specificity

---
 resources/js/components/ui/Listing/Presets.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/js/components/ui/Listing/Presets.vue b/resources/js/components/ui/Listing/Presets.vue
index b373a6d1a62..eb4bd08e2ed 100644
--- a/resources/js/components/ui/Listing/Presets.vue
+++ b/resources/js/components/ui/Listing/Presets.vue
@@ -173,7 +173,7 @@ function deletePreset() {
             <template v-if="handle === activePreset">
                 <Dropdown class="w-48!">
                     <template #trigger>
-                        <Button class="absolute top-1.5 -right-4" variant="ghost" size="xs" icon="chevron-down" />
+                        <Button class="absolute! top-1.5 -right-4" variant="ghost" size="xs" icon="chevron-down" />
                     </template>
                     <DropdownMenu>
                         <DropdownItem :text="__('Duplicate')" icon="duplicate" @click="createPreset" />

From 67eb41bece5e6983e5695c4fc2805e44bbd4267a Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Thu, 8 Jan 2026 16:18:08 +0000
Subject: [PATCH 02/12] Fix delete icon color

---
 resources/js/components/ui/Listing/Presets.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/js/components/ui/Listing/Presets.vue b/resources/js/components/ui/Listing/Presets.vue
index eb4bd08e2ed..6393a2d8ae2 100644
--- a/resources/js/components/ui/Listing/Presets.vue
+++ b/resources/js/components/ui/Listing/Presets.vue
@@ -188,7 +188,7 @@ function deletePreset() {
                             v-if="canDeletePreset(handle)"
                             :text="__('Delete')"
                             icon="delete"
-                            variant="warning"
+                            variant="destructive"
                             @click="isConfirmingDeletion = true"
                         />
                     </DropdownMenu>

From 63967279820841cadeee52061182d88439c4c508 Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Tue, 13 Jan 2026 13:15:50 +0000
Subject: [PATCH 03/12] Nudge values around a bit to ensure arrow spacing

---
 resources/js/components/ui/Listing/PresetTrigger.vue | 2 +-
 resources/js/components/ui/Listing/Presets.vue       | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/resources/js/components/ui/Listing/PresetTrigger.vue b/resources/js/components/ui/Listing/PresetTrigger.vue
index 1968719d981..c6cbd03d88a 100644
--- a/resources/js/components/ui/Listing/PresetTrigger.vue
+++ b/resources/js/components/ui/Listing/PresetTrigger.vue
@@ -10,7 +10,7 @@ defineProps({
     <button
         :data-state="active ? 'active' : null"
         :value="name"
-        class="translate-y-px cursor-pointer p-2 focus-visible:rounded-lg pb-1 hover:text-gray-600 data-[state=active]:border-b data-[state=active]:border-gray-800 data-[state=active]:text-gray-900 dark:hover:text-gray-400 dark:data-[state=active]:border-gray-200 dark:data-[state=active]:text-gray-200"
+        class="translate-y-px cursor-pointer px-2 py-1 focus-visible:rounded-lg hover:text-gray-600 data-[state=active]:border-b data-[state=active]:border-gray-800 data-[state=active]:text-gray-900 dark:hover:text-gray-400 dark:data-[state=active]:border-gray-200 dark:data-[state=active]:text-gray-200"
     >
         <slot>{{ text }}</slot>
     </button>
diff --git a/resources/js/components/ui/Listing/Presets.vue b/resources/js/components/ui/Listing/Presets.vue
index 6393a2d8ae2..70083523447 100644
--- a/resources/js/components/ui/Listing/Presets.vue
+++ b/resources/js/components/ui/Listing/Presets.vue
@@ -160,7 +160,7 @@ function deletePreset() {
 
 <template>
     <div
-        class="relative flex shrink-0 space-x-2 px-2 -mt-2 sm:px-0 border-b border-gray-200 text-sm text-gray-500 dark:border-gray-700/50 dark:text-gray-500 starting-style-transition"
+        class="relative flex shrink-0 space-x-2.5 px-2 -mt-2 sm:px-0 border-b border-gray-200 text-sm text-gray-500 dark:border-gray-700/50 dark:text-gray-500 starting-style-transition"
     >
         <PresetTrigger :active="!activePreset" @click="viewAll" :text="__('All')" />
         <PresetTrigger
@@ -173,7 +173,7 @@ function deletePreset() {
             <template v-if="handle === activePreset">
                 <Dropdown class="w-48!">
                     <template #trigger>
-                        <Button class="absolute! top-1.5 -right-4" variant="ghost" size="xs" icon="chevron-down" />
+                        <Button class="absolute! top-0.25 -right-4" variant="ghost" size="xs" icon="chevron-down" />
                     </template>
                     <DropdownMenu>
                         <DropdownItem :text="__('Duplicate')" icon="duplicate" @click="createPreset" />

From 758e3058c5c30576fb0eb13a659179952dcad26c Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Tue, 13 Jan 2026 13:18:55 +0000
Subject: [PATCH 04/12] Preset filters - ensure text doesn't budge

---
 resources/js/components/ui/Listing/PresetTrigger.vue | 2 +-
 resources/js/components/ui/Listing/Presets.vue       | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/resources/js/components/ui/Listing/PresetTrigger.vue b/resources/js/components/ui/Listing/PresetTrigger.vue
index c6cbd03d88a..16b0c541c2d 100644
--- a/resources/js/components/ui/Listing/PresetTrigger.vue
+++ b/resources/js/components/ui/Listing/PresetTrigger.vue
@@ -10,7 +10,7 @@ defineProps({
     <button
         :data-state="active ? 'active' : null"
         :value="name"
-        class="translate-y-px cursor-pointer px-2 py-1 focus-visible:rounded-lg hover:text-gray-600 data-[state=active]:border-b data-[state=active]:border-gray-800 data-[state=active]:text-gray-900 dark:hover:text-gray-400 dark:data-[state=active]:border-gray-200 dark:data-[state=active]:text-gray-200"
+        class="translate-y-px cursor-pointer px-2 py-1 focus-visible:rounded-lg hover:text-gray-600 border-b border-gray-200 dark:border-gray-800 data-[state=active]:border-gray-800 data-[state=active]:text-gray-900 dark:hover:text-gray-400 dark:data-[state=active]:border-gray-200 dark:data-[state=active]:text-gray-200"
     >
         <slot>{{ text }}</slot>
     </button>
diff --git a/resources/js/components/ui/Listing/Presets.vue b/resources/js/components/ui/Listing/Presets.vue
index 70083523447..b5442638168 100644
--- a/resources/js/components/ui/Listing/Presets.vue
+++ b/resources/js/components/ui/Listing/Presets.vue
@@ -160,7 +160,7 @@ function deletePreset() {
 
 <template>
     <div
-        class="relative flex shrink-0 space-x-2.5 px-2 -mt-2 sm:px-0 border-b border-gray-200 text-sm text-gray-500 dark:border-gray-700/50 dark:text-gray-500 starting-style-transition"
+        class="relative flex shrink-0 space-x-2.5 px-2 -mt-2 sm:px-0 border-b border-gray-200 text-sm text-gray-500 dark:border-gray-800 dark:text-gray-500 starting-style-transition"
     >
         <PresetTrigger :active="!activePreset" @click="viewAll" :text="__('All')" />
         <PresetTrigger

From 59a2f3abc7e71f2e21cf9ca8e24956ff107d5a92 Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Tue, 13 Jan 2026 13:30:33 +0000
Subject: [PATCH 05/12] Blueprint tabs - bring over preset changes

---
 resources/js/components/blueprints/Tab.vue  | 11 +++--------
 resources/js/components/ui/Tabs/Trigger.vue |  2 +-
 2 files changed, 4 insertions(+), 9 deletions(-)

diff --git a/resources/js/components/blueprints/Tab.vue b/resources/js/components/blueprints/Tab.vue
index 302a87e57a2..0d6e8ea3aa8 100644
--- a/resources/js/components/blueprints/Tab.vue
+++ b/resources/js/components/blueprints/Tab.vue
@@ -11,12 +11,7 @@
 
         <Dropdown v-if="isActive" placement="left-start" class="me-3">
             <template #trigger>
-                <button
-                    class="hover:text-gray-900 active:text-gray-900 dark:hover:text-gray-400 ms-1"
-                    :aria-label="__('Open Dropdown')"
-                >
-                    <Icon name="chevron-down" />
-                </button>
+                <Button class="absolute! top-0.25 -right-4" variant="ghost" size="xs" icon="chevron-down" />
             </template>
             <DropdownMenu>
                 <DropdownItem :text="__('Edit')" icon="edit" @click="edit" />
@@ -73,10 +68,10 @@
 </template>
 
 <script>
-import { TabTrigger, Dropdown, DropdownMenu, DropdownItem, Icon, Field, Input, Stack, StackClose } from '@/components/ui';
+import { TabTrigger, Dropdown, DropdownMenu, DropdownItem, Button, Icon, Field, Input, Stack, StackClose } from '@/components/ui';
 
 export default {
-    components: { TabTrigger, Dropdown, DropdownMenu, DropdownItem, Icon, Field, Input, Stack, StackClose },
+    components: { TabTrigger, Dropdown, DropdownMenu, DropdownItem, Button, Icon, Field, Input, Stack, StackClose },
 
     props: {
         tab: {
diff --git a/resources/js/components/ui/Tabs/Trigger.vue b/resources/js/components/ui/Tabs/Trigger.vue
index 5ecda195a74..40721cc66a9 100644
--- a/resources/js/components/ui/Tabs/Trigger.vue
+++ b/resources/js/components/ui/Tabs/Trigger.vue
@@ -16,7 +16,7 @@ defineProps({
 <template>
     <TabsTrigger
         :value="name"
-        class="cursor-pointer p-2 pb-1 hover:text-gray-600 data-[state=active]:text-gray-900 dark:hover:text-gray-400 dark:data-[state=active]:text-gray-200"
+        class="translate-y-px cursor-pointer px-2 py-1 focus-visible:rounded-lg hover:text-gray-600 border-b border-gray-200 dark:border-gray-800 data-[state=active]:border-gray-800 data-[state=active]:text-gray-900 dark:hover:text-gray-400 dark:data-[state=active]:border-gray-200 dark:data-[state=active]:text-gray-200"
     >
         <slot v-if="hasSlot" />
         <span v-else>{{ text }}</span>

From 8a6ac241f54238daa830e719ebde63d3a717ab99 Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Tue, 13 Jan 2026 13:40:25 +0000
Subject: [PATCH 06/12] Blueprint tabs - bring over preset changes

---
 resources/js/components/blueprints/Tabs.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/js/components/blueprints/Tabs.vue b/resources/js/components/blueprints/Tabs.vue
index cd84ceeda45..aabcf201a34 100644
--- a/resources/js/components/blueprints/Tabs.vue
+++ b/resources/js/components/blueprints/Tabs.vue
@@ -4,7 +4,7 @@
             <Tabs v-model="currentTab" :unmount-on-hide="false">
                 <div v-if="!singleTab && tabs.length > 0" class="flex items-center justify-between gap-x-2 mb-6">
                     <TabList class="flex-1">
-                        <div ref="tabs" class="flex-1 flex items-center">
+                        <div ref="tabs" class="flex-1 flex items-center gap-x-2.5">
                             <BlueprintTab
                                 ref="tab"
                                 v-for="tab in tabs"

From b385c8d6db06febc4944883839b8db78aa5c9e29 Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Tue, 13 Jan 2026 13:46:31 +0000
Subject: [PATCH 07/12] Re-add aria label

---
 resources/js/components/blueprints/Tab.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/js/components/blueprints/Tab.vue b/resources/js/components/blueprints/Tab.vue
index 0d6e8ea3aa8..e7ea4f21611 100644
--- a/resources/js/components/blueprints/Tab.vue
+++ b/resources/js/components/blueprints/Tab.vue
@@ -11,7 +11,7 @@
 
         <Dropdown v-if="isActive" placement="left-start" class="me-3">
             <template #trigger>
-                <Button class="absolute! top-0.25 -right-4" variant="ghost" size="xs" icon="chevron-down" />
+                <Button class="absolute! top-0.25 -right-4" variant="ghost" size="xs" icon="chevron-down" :aria-label="__('Open Dropdown')" />
             </template>
             <DropdownMenu>
                 <DropdownItem :text="__('Edit')" icon="edit" @click="edit" />

From 4466ff61492246dae904e2582ca8199ba113ee1b Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Tue, 13 Jan 2026 13:51:07 +0000
Subject: [PATCH 08/12] Effectively use Reka "tabs indicator" instead

---
 resources/js/components/ui/Tabs/Trigger.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/js/components/ui/Tabs/Trigger.vue b/resources/js/components/ui/Tabs/Trigger.vue
index 40721cc66a9..9ccc0c9361c 100644
--- a/resources/js/components/ui/Tabs/Trigger.vue
+++ b/resources/js/components/ui/Tabs/Trigger.vue
@@ -16,7 +16,7 @@ defineProps({
 <template>
     <TabsTrigger
         :value="name"
-        class="translate-y-px cursor-pointer px-2 py-1 focus-visible:rounded-lg hover:text-gray-600 border-b border-gray-200 dark:border-gray-800 data-[state=active]:border-gray-800 data-[state=active]:text-gray-900 dark:hover:text-gray-400 dark:data-[state=active]:border-gray-200 dark:data-[state=active]:text-gray-200"
+        class="translate-y-px cursor-pointer px-2 py-1 focus-visible:rounded-lg hover:text-gray-600 data-[state=active]:text-gray-900 dark:hover:text-gray-400 dark:data-[state=active]:text-gray-200"
     >
         <slot v-if="hasSlot" />
         <span v-else>{{ text }}</span>

From 9cb868721f4a797d95c240c7c898da545ab95a0c Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Tue, 13 Jan 2026 13:51:21 +0000
Subject: [PATCH 09/12] Smooth things out

---
 resources/css/core/animation.css           | 4 ++++
 resources/js/components/blueprints/Tab.vue | 2 +-
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/resources/css/core/animation.css b/resources/css/core/animation.css
index 9ca703aeb99..c1bf20d9407 100644
--- a/resources/css/core/animation.css
+++ b/resources/css/core/animation.css
@@ -81,6 +81,10 @@
         transition: opacity calc(var(--starting-style-transition-duration) / 2);
     }
 
+    .starting-style-transition--slow {
+        transition: opacity calc(var(--starting-style-transition-duration) * 3);
+    }
+
     .starting-style-transition--delay {
         transition-delay: calc(var(--starting-style-transition-duration) * 5);
     }
diff --git a/resources/js/components/blueprints/Tab.vue b/resources/js/components/blueprints/Tab.vue
index e7ea4f21611..6a5713d7831 100644
--- a/resources/js/components/blueprints/Tab.vue
+++ b/resources/js/components/blueprints/Tab.vue
@@ -11,7 +11,7 @@
 
         <Dropdown v-if="isActive" placement="left-start" class="me-3">
             <template #trigger>
-                <Button class="absolute! top-0.25 -right-4" variant="ghost" size="xs" icon="chevron-down" :aria-label="__('Open Dropdown')" />
+                <Button class="absolute! top-0.25 -right-4 starting-style-transition starting-style-transition--slow" variant="ghost" size="xs" icon="chevron-down" :aria-label="__('Open Dropdown')" />
             </template>
             <DropdownMenu>
                 <DropdownItem :text="__('Edit')" icon="edit" @click="edit" />

From a4945bdefaa24c84994f622f5150962dabff7577 Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Tue, 13 Jan 2026 14:04:31 +0000
Subject: [PATCH 10/12] Filter presets - use the same reka-ui tab system with
 tab indicators instead of bottom borders, matching the blueprint tabs
 behavior.

---
 .../components/ui/Listing/PresetTrigger.vue   |  18 +--
 .../js/components/ui/Listing/Presets.vue      | 104 ++++++++++--------
 2 files changed, 69 insertions(+), 53 deletions(-)

diff --git a/resources/js/components/ui/Listing/PresetTrigger.vue b/resources/js/components/ui/Listing/PresetTrigger.vue
index 16b0c541c2d..ffe8860106b 100644
--- a/resources/js/components/ui/Listing/PresetTrigger.vue
+++ b/resources/js/components/ui/Listing/PresetTrigger.vue
@@ -1,17 +1,19 @@
 <script setup>
+import { TabTrigger } from '@/components/ui';
+import { useSlots } from 'vue';
+
+const slots = useSlots();
+const hasSlot = !!slots.default;
+
 defineProps({
     text: { type: String, default: null },
     name: { type: String, default: null },
-    active: { type: Boolean, default: false },
 });
 </script>
 
 <template>
-    <button
-        :data-state="active ? 'active' : null"
-        :value="name"
-        class="translate-y-px cursor-pointer px-2 py-1 focus-visible:rounded-lg hover:text-gray-600 border-b border-gray-200 dark:border-gray-800 data-[state=active]:border-gray-800 data-[state=active]:text-gray-900 dark:hover:text-gray-400 dark:data-[state=active]:border-gray-200 dark:data-[state=active]:text-gray-200"
-    >
-        <slot>{{ text }}</slot>
-    </button>
+    <TabTrigger :name="name">
+        <slot v-if="hasSlot" />
+        <span v-else>{{ text }}</span>
+    </TabTrigger>
 </template>
diff --git a/resources/js/components/ui/Listing/Presets.vue b/resources/js/components/ui/Listing/Presets.vue
index b5442638168..0e4f5c6b3b6 100644
--- a/resources/js/components/ui/Listing/Presets.vue
+++ b/resources/js/components/ui/Listing/Presets.vue
@@ -7,6 +7,8 @@ import {
     DropdownItem,
     DropdownMenu,
     DropdownSeparator,
+    Tabs,
+    TabList,
 } from '@ui';
 import { injectListingContext } from '../Listing/Listing.vue';
 import { computed, ref, watch } from 'vue';
@@ -85,6 +87,17 @@ function getPresetFromActiveFilters() {
     }
 }
 
+const currentTab = computed({
+    get: () => activePreset.value || 'all',
+    set: (value) => {
+        if (value === 'all') {
+            viewAll();
+        } else {
+            selectPreset(value);
+        }
+    },
+});
+
 const presetPreferencesPayload = computed(() => {
     let payload = {
         display: savingPresetName.value || activePresetPayload.value.display || '',
@@ -159,52 +172,53 @@ function deletePreset() {
 </script>
 
 <template>
-    <div
-        class="relative flex shrink-0 space-x-2.5 px-2 -mt-2 sm:px-0 border-b border-gray-200 text-sm text-gray-500 dark:border-gray-800 dark:text-gray-500 starting-style-transition"
-    >
-        <PresetTrigger :active="!activePreset" @click="viewAll" :text="__('All')" />
-        <PresetTrigger
-            v-for="(preset, handle) in presets"
-            :key="handle"
-            :active="handle === activePreset"
-            @click="selectPreset(handle)"
-        >
-            {{ preset.display }}
-            <template v-if="handle === activePreset">
-                <Dropdown class="w-48!">
-                    <template #trigger>
-                        <Button class="absolute! top-0.25 -right-4" variant="ghost" size="xs" icon="chevron-down" />
+    <Tabs v-model:modelValue="currentTab">
+        <div class="relative flex shrink-0 items-center space-x-2.5 px-2 -mt-2 sm:px-0 starting-style-transition">
+            <TabList class="flex-1 space-x-2.5 !border-gray-200 !dark:border-gray-800">
+                <PresetTrigger name="all" :text="__('All')" />
+                <PresetTrigger
+                    v-for="(preset, handle) in presets"
+                    :key="handle"
+                    :name="handle"
+                >
+                    {{ preset.display }}
+                    <template v-if="handle === activePreset">
+                        <Dropdown class="w-48!">
+                            <template #trigger>
+                                <Button class="absolute! top-0.25 -right-4" variant="ghost" size="xs" icon="chevron-down" />
+                            </template>
+                            <DropdownMenu>
+                                <DropdownItem :text="__('Duplicate')" icon="duplicate" @click="createPreset" />
+                                <DropdownItem
+                                    v-if="canRenamePreset(handle)"
+                                    :text="__('Rename')"
+                                    icon="rename"
+                                    @click="renamePreset"
+                                />
+                                <DropdownSeparator v-if="canDeletePreset(handle)" />
+                                <DropdownItem
+                                    v-if="canDeletePreset(handle)"
+                                    :text="__('Delete')"
+                                    icon="delete"
+                                    variant="destructive"
+                                    @click="isConfirmingDeletion = true"
+                                />
+                            </DropdownMenu>
+                        </Dropdown>
                     </template>
-                    <DropdownMenu>
-                        <DropdownItem :text="__('Duplicate')" icon="duplicate" @click="createPreset" />
-                        <DropdownItem
-                            v-if="canRenamePreset(handle)"
-                            :text="__('Rename')"
-                            icon="rename"
-                            @click="renamePreset"
-                        />
-                        <DropdownSeparator v-if="canDeletePreset(handle)" />
-                        <DropdownItem
-                            v-if="canDeletePreset(handle)"
-                            :text="__('Delete')"
-                            icon="delete"
-                            variant="destructive"
-                            @click="isConfirmingDeletion = true"
-                        />
-                    </DropdownMenu>
-                </Dropdown>
-            </template>
-        </PresetTrigger>
-        <Button
-            v-if="canSaveNewPreset"
-            @click="createPreset"
-            variant="ghost"
-            size="sm"
-            :text="__('New View')"
-            icon="add-bookmark"
-            class="relative top-0.5 [&_svg]:size-4"
-        />
-    </div>
+                </PresetTrigger>
+            </TabList>
+            <Button
+                v-if="canSaveNewPreset"
+                @click="createPreset"
+                variant="ghost"
+                size="sm"
+                :text="__('New View')"
+                icon="add-bookmark"
+                class="relative top-0.5 [&_svg]:size-4"
+            />
+        </div>
+    </Tabs>
 
     <confirmation-modal
         v-if="isCreating"

From 170c11e8e861d1d0832f374d37d5b6163b10d689 Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Tue, 13 Jan 2026 14:05:16 +0000
Subject: [PATCH 11/12] Smooth things out

---
 resources/js/components/ui/Listing/Presets.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/js/components/ui/Listing/Presets.vue b/resources/js/components/ui/Listing/Presets.vue
index 0e4f5c6b3b6..2a97470b583 100644
--- a/resources/js/components/ui/Listing/Presets.vue
+++ b/resources/js/components/ui/Listing/Presets.vue
@@ -185,7 +185,7 @@ function deletePreset() {
                     <template v-if="handle === activePreset">
                         <Dropdown class="w-48!">
                             <template #trigger>
-                                <Button class="absolute! top-0.25 -right-4" variant="ghost" size="xs" icon="chevron-down" />
+                                <Button class="absolute! top-0.25 -right-4 starting-style-transition starting-style-transition--slow" variant="ghost" size="xs" icon="chevron-down" />
                             </template>
                             <DropdownMenu>
                                 <DropdownItem :text="__('Duplicate')" icon="duplicate" @click="createPreset" />

From ea99234cb284fcb5cc3337536ddd55bd4596f8c8 Mon Sep 17 00:00:00 2001
From: Jason Varga <jason@pixelfear.com>
Date: Tue, 13 Jan 2026 10:12:21 -0500
Subject: [PATCH 12/12] no need to check for slot. you can just put the
 fallback inside the tag pair.

---
 resources/js/components/ui/Listing/PresetTrigger.vue | 7 +------
 1 file changed, 1 insertion(+), 6 deletions(-)

diff --git a/resources/js/components/ui/Listing/PresetTrigger.vue b/resources/js/components/ui/Listing/PresetTrigger.vue
index ffe8860106b..79017895bf2 100644
--- a/resources/js/components/ui/Listing/PresetTrigger.vue
+++ b/resources/js/components/ui/Listing/PresetTrigger.vue
@@ -1,9 +1,5 @@
 <script setup>
 import { TabTrigger } from '@/components/ui';
-import { useSlots } from 'vue';
-
-const slots = useSlots();
-const hasSlot = !!slots.default;
 
 defineProps({
     text: { type: String, default: null },
@@ -13,7 +9,6 @@ defineProps({
 
 <template>
     <TabTrigger :name="name">
-        <slot v-if="hasSlot" />
-        <span v-else>{{ text }}</span>
+        <slot>{{ text }}</slot>
     </TabTrigger>
 </template>