From 0849652bc07afac4f68ed7fd6e78d10e1b70ddbf Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Tue, 25 Nov 2025 15:53:40 +0000
Subject: [PATCH 01/14] Dropdown triggers should be pulled above by default,
 for example when you have a dropdown very close to a long horizontal
 replicator "plus" button, the dropdown should take precedence.

---
 resources/css/elements/dropdowns.css | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/resources/css/elements/dropdowns.css b/resources/css/elements/dropdowns.css
index ed3d92ea95b..1245df12290 100644
--- a/resources/css/elements/dropdowns.css
+++ b/resources/css/elements/dropdowns.css
@@ -1,3 +1,8 @@
+/* Dropdown triggers should be pulled above by default, for example when you have a dropdown very close to a long horizontal replicator "plus" button, the dropdown should take precedence. */
+[data-ui-dropdown-trigger] {
+    z-index: var(--z-index-above);
+}
+
 .quick-list {
     @apply relative;
 

From 12dadd03a9a2d499932248b6acd2ed0244aa74cf Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Mon, 1 Dec 2025 17:11:48 +0000
Subject: [PATCH 02/14] Change the first replicator to be shorter in width

---
 .../js/components/fieldtypes/replicator/AddSetButton.vue   | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/resources/js/components/fieldtypes/replicator/AddSetButton.vue b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
index 11bf3d6bac5..aac60c1fa73 100644
--- a/resources/js/components/fieldtypes/replicator/AddSetButton.vue
+++ b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
@@ -8,14 +8,17 @@
             <div
                 v-if="variant === 'between'"
                 class="flex justify-center relative group py-3"
-                :class="{ '-mt-3': isFirst }"
+                :class="{ '-mt-5': isFirst }"
             >
                 <div
                     v-if="showConnector"
                     class="absolute group-hover:opacity-0 transition-opacity delay-10 duration-250 inset-y-0 left-3.5 border-l-1 border-gray-400 dark:border-gray-600 border-dashed z-0 dark:bg-gray-850"
                     :class="isFirst ? 'h-[50%] top-[50%] opacity-50' : 'h-full opacity-100'"
                 />
-                <button class="w-full absolute inset-0 h-full opacity-0 group-hover:opacity-100 transition-opacity delay-10 duration-250 cursor-pointer">
+                <button
+                    class="absolute inset-0 h-full opacity-0 group-hover:opacity-100 transition-opacity delay-10 duration-250 cursor-pointer"
+                    :class="isFirst ? 'w-[50%] translate-x-[50%]' : 'w-full'"
+                >
                     <div class="h-full flex flex-col justify-center">
                         <div class="rounded-full bg-gray-200 dark:bg-gray-700 h-2" />
                     </div>

From 62ea630ff7ecf712af90647a4ab480f7999687bd Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Mon, 1 Dec 2025 17:17:31 +0000
Subject: [PATCH 03/14] Get rid of the first connector

---
 .../js/components/fieldtypes/replicator/AddSetButton.vue     | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/resources/js/components/fieldtypes/replicator/AddSetButton.vue b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
index aac60c1fa73..ce10b30982f 100644
--- a/resources/js/components/fieldtypes/replicator/AddSetButton.vue
+++ b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
@@ -11,9 +11,8 @@
                 :class="{ '-mt-5': isFirst }"
             >
                 <div
-                    v-if="showConnector"
-                    class="absolute group-hover:opacity-0 transition-opacity delay-10 duration-250 inset-y-0 left-3.5 border-l-1 border-gray-400 dark:border-gray-600 border-dashed z-0 dark:bg-gray-850"
-                    :class="isFirst ? 'h-[50%] top-[50%] opacity-50' : 'h-full opacity-100'"
+                    v-if="showConnector && !isFirst"
+                    class="absolute group-hover:opacity-0 transition-opacity delay-10 duration-250 inset-y-0 left-3.5 border-l-1 border-gray-400 dark:border-gray-600 border-dashed z-0 dark:bg-gray-850 h-full opacity-100"
                 />
                 <button
                     class="absolute inset-0 h-full opacity-0 group-hover:opacity-100 transition-opacity delay-10 duration-250 cursor-pointer"

From 368f4f5680b170b0a2a02bb4fdb56f86534d64a2 Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Mon, 1 Dec 2025 17:31:18 +0000
Subject: [PATCH 04/14] =?UTF-8?q?Change=20the=20insert=20set=20bar=20to=20?=
 =?UTF-8?q?a=20subtle=20gradient=20to=20compensate=20for=20the=20top=20one?=
 =?UTF-8?q?=20being=20shorter=E2=80=A6=20so=20it=20doesn't=20look=20so=20w?=
 =?UTF-8?q?eird?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 resources/js/components/fieldtypes/replicator/AddSetButton.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/js/components/fieldtypes/replicator/AddSetButton.vue b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
index ce10b30982f..6e4b6daa500 100644
--- a/resources/js/components/fieldtypes/replicator/AddSetButton.vue
+++ b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
@@ -19,7 +19,7 @@
                     :class="isFirst ? 'w-[50%] translate-x-[50%]' : 'w-full'"
                 >
                     <div class="h-full flex flex-col justify-center">
-                        <div class="rounded-full bg-gray-200 dark:bg-gray-700 h-2" />
+                        <div class="rounded-full bg-[linear-gradient(90deg,theme(colors.gray.100)_0%,theme(colors.gray.200)_50%,theme(colors.gray.100)_100%)] h-2" />
                     </div>
                 </button>
                 <Button v-if="enabled" round icon="plus" size="sm" class="-my-4 z-3 opacity-0 group-hover:opacity-100 transition-opacity delay-10 duration-250" />

From 315eb9db06f2946758ce09919f3c5d1cb4d6294f Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Mon, 1 Dec 2025 17:53:07 +0000
Subject: [PATCH 05/14] Prevent invisible horizontal click area for "Add Block"
 button

---
 .../fieldtypes/replicator/AddSetButton.vue      | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/resources/js/components/fieldtypes/replicator/AddSetButton.vue b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
index 6e4b6daa500..30410459bf6 100644
--- a/resources/js/components/fieldtypes/replicator/AddSetButton.vue
+++ b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
@@ -1,12 +1,17 @@
 <template>
-    <set-picker :enabled="enabled" :sets="groups" :align="variant === 'between' ? 'center' : 'start'" @added="addSet">
+    <div class="inline-block" v-if="variant === 'button'">
+        <set-picker :enabled="enabled" :sets="groups" align="start" @added="addSet">
+            <template #trigger>
+                <div class="inline-flex relative pt-2" :class="{ 'pt-6': showConnector }">
+                    <div v-if="showConnector" class="absolute group-hover:opacity-0 transition-opacity delay-25 duration-125 inset-y-0 h-full left-3.5 border-l-1 border-gray-400 dark:border-gray-600 border-dashed z-0 dark:bg-gray-850" />
+                    <Button v-if="enabled" size="sm" :text="label" icon="plus" class="relative z-2" />
+                </div>
+            </template>
+        </set-picker>
+    </div>
+    <set-picker v-else :enabled="enabled" :sets="groups" align="center" @added="addSet">
         <template #trigger>
-            <div class="flex relative pt-2" :class="{ 'pt-6': showConnector }" v-if="variant === 'button'">
-                <div v-if="showConnector" class="absolute group-hover:opacity-0 transition-opacity delay-25 duration-125 inset-y-0 h-full left-3.5 border-l-1 border-gray-400 dark:border-gray-600 border-dashed z-0 dark:bg-gray-850" />
-                <Button v-if="enabled" size="sm" :text="label" icon="plus" class="relative z-2" />
-            </div>
             <div
-                v-if="variant === 'between'"
                 class="flex justify-center relative group py-3"
                 :class="{ '-mt-5': isFirst }"
             >

From 89ec412ad33b2587e382906e21db3f538ee0f3f1 Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Tue, 2 Dec 2025 11:13:40 +0000
Subject: [PATCH 06/14] Make top set button smaller and add condition for
 instructions

---
 .../js/components/fieldtypes/replicator/AddSetButton.vue   | 5 +++--
 .../js/components/fieldtypes/replicator/Replicator.vue     | 7 +++++++
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/resources/js/components/fieldtypes/replicator/AddSetButton.vue b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
index 30410459bf6..461c61f352b 100644
--- a/resources/js/components/fieldtypes/replicator/AddSetButton.vue
+++ b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
@@ -13,7 +13,7 @@
         <template #trigger>
             <div
                 class="flex justify-center relative group py-3"
-                :class="{ '-mt-5': isFirst }"
+                :class="isFirst && !instructionsAbove ? '-mt-5' : (isFirst ? '-mt-3' : '')"
             >
                 <div
                     v-if="showConnector && !isFirst"
@@ -21,7 +21,7 @@
                 />
                 <button
                     class="absolute inset-0 h-full opacity-0 group-hover:opacity-100 transition-opacity delay-10 duration-250 cursor-pointer"
-                    :class="isFirst ? 'w-[50%] translate-x-[50%]' : 'w-full'"
+                    :class="isFirst ? 'w-[20%] left-[40%]' : 'w-full'"
                 >
                     <div class="h-full flex flex-col justify-center">
                         <div class="rounded-full bg-[linear-gradient(90deg,theme(colors.gray.100)_0%,theme(colors.gray.200)_50%,theme(colors.gray.100)_100%)] h-2" />
@@ -49,6 +49,7 @@ const props = defineProps({
     showConnector: { type: Boolean, default: true },
     variant: { type: String, default: 'button' },
     isFirst: { type: Boolean, default: false },
+    instructionsAbove: { type: Boolean, default: false },
 });
 
 const label = computed(() => props.label ? __(props.label) : __('Add Block'));
diff --git a/resources/js/components/fieldtypes/replicator/Replicator.vue b/resources/js/components/fieldtypes/replicator/Replicator.vue
index 97fbb986cd9..4d70875e788 100644
--- a/resources/js/components/fieldtypes/replicator/Replicator.vue
+++ b/resources/js/components/fieldtypes/replicator/Replicator.vue
@@ -60,6 +60,7 @@
                                             :index="index"
                                             :enabled="canAddSet"
                                             :is-first="index === 0"
+                                            :instructions-above="instructionsAbove"
                                             @added="addSet"
                                         />
                                     </template>
@@ -74,6 +75,8 @@
                             :show-connector="value.length > 0"
                             :index="value.length"
                             :label="config.button_label"
+                            :is-first="value.length === 0"
+                            :instructions-above="instructionsAbove"
                             @added="addSet"
                         />
                     </section>
@@ -152,6 +155,10 @@ export default {
             return `${__(this.config.display)}: ${__n(':count set|:count sets', this.value.length)}`;
         },
 
+        instructionsAbove() {
+            return this.config.instructions_position !== 'below';
+        },
+
         internalFieldActions() {
             return [
                 {

From db1509ffea8a42c1444c412aa3eeba5fa21734a9 Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Tue, 2 Dec 2025 11:43:36 +0000
Subject: [PATCH 07/14] Add some more conditions in case the instructions are
 empty

---
 .../js/components/fieldtypes/replicator/AddSetButton.vue     | 5 +++--
 resources/js/components/fieldtypes/replicator/Replicator.vue | 2 ++
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/resources/js/components/fieldtypes/replicator/AddSetButton.vue b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
index 461c61f352b..7311050d1da 100644
--- a/resources/js/components/fieldtypes/replicator/AddSetButton.vue
+++ b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
@@ -13,7 +13,7 @@
         <template #trigger>
             <div
                 class="flex justify-center relative group py-3"
-                :class="isFirst && !instructionsAbove ? '-mt-5' : (isFirst ? '-mt-3' : '')"
+                :class="isFirst && (!instructionsAbove || !instructions) ? '-mt-5.5' : (isFirst ? '-mt-3' : '')"
             >
                 <div
                     v-if="showConnector && !isFirst"
@@ -21,7 +21,7 @@
                 />
                 <button
                     class="absolute inset-0 h-full opacity-0 group-hover:opacity-100 transition-opacity delay-10 duration-250 cursor-pointer"
-                    :class="isFirst ? 'w-[20%] left-[40%]' : 'w-full'"
+                    :class="instructionsAbove && instructions ? 'w-full' : (isFirst) ? 'w-[30%] left-[35%]' : 'w-full'"
                 >
                     <div class="h-full flex flex-col justify-center">
                         <div class="rounded-full bg-[linear-gradient(90deg,theme(colors.gray.100)_0%,theme(colors.gray.200)_50%,theme(colors.gray.100)_100%)] h-2" />
@@ -50,6 +50,7 @@ const props = defineProps({
     variant: { type: String, default: 'button' },
     isFirst: { type: Boolean, default: false },
     instructionsAbove: { type: Boolean, default: false },
+    instructions: { type: String, default: '' },
 });
 
 const label = computed(() => props.label ? __(props.label) : __('Add Block'));
diff --git a/resources/js/components/fieldtypes/replicator/Replicator.vue b/resources/js/components/fieldtypes/replicator/Replicator.vue
index 4d70875e788..4981e72add8 100644
--- a/resources/js/components/fieldtypes/replicator/Replicator.vue
+++ b/resources/js/components/fieldtypes/replicator/Replicator.vue
@@ -61,6 +61,7 @@
                                             :enabled="canAddSet"
                                             :is-first="index === 0"
                                             :instructions-above="instructionsAbove"
+                                            :instructions="config.instructions"
                                             @added="addSet"
                                         />
                                     </template>
@@ -77,6 +78,7 @@
                             :label="config.button_label"
                             :is-first="value.length === 0"
                             :instructions-above="instructionsAbove"
+                            :instructions="config.instructions"
                             @added="addSet"
                         />
                     </section>

From bbecc493865a2d0831742ad9fba7bbc9f600ee00 Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Tue, 2 Dec 2025 15:42:52 +0000
Subject: [PATCH 08/14] Simplify fixes and mostly revert due to issues with
 hover tunnel of the "more actions" dots

---
 .../js/components/fieldtypes/replicator/AddSetButton.vue   | 7 ++-----
 .../js/components/fieldtypes/replicator/Replicator.vue     | 4 ----
 2 files changed, 2 insertions(+), 9 deletions(-)

diff --git a/resources/js/components/fieldtypes/replicator/AddSetButton.vue b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
index 7311050d1da..285aa374129 100644
--- a/resources/js/components/fieldtypes/replicator/AddSetButton.vue
+++ b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
@@ -13,15 +13,14 @@
         <template #trigger>
             <div
                 class="flex justify-center relative group py-3"
-                :class="isFirst && (!instructionsAbove || !instructions) ? '-mt-5.5' : (isFirst ? '-mt-3' : '')"
+                :class="{ '-mt-2': isFirst }"
             >
                 <div
                     v-if="showConnector && !isFirst"
                     class="absolute group-hover:opacity-0 transition-opacity delay-10 duration-250 inset-y-0 left-3.5 border-l-1 border-gray-400 dark:border-gray-600 border-dashed z-0 dark:bg-gray-850 h-full opacity-100"
                 />
                 <button
-                    class="absolute inset-0 h-full opacity-0 group-hover:opacity-100 transition-opacity delay-10 duration-250 cursor-pointer"
-                    :class="instructionsAbove && instructions ? 'w-full' : (isFirst) ? 'w-[30%] left-[35%]' : 'w-full'"
+                    class="absolute inset-0 h-full w-full opacity-0 group-hover:opacity-100 transition-opacity delay-10 duration-250 cursor-pointer"
                 >
                     <div class="h-full flex flex-col justify-center">
                         <div class="rounded-full bg-[linear-gradient(90deg,theme(colors.gray.100)_0%,theme(colors.gray.200)_50%,theme(colors.gray.100)_100%)] h-2" />
@@ -49,8 +48,6 @@ const props = defineProps({
     showConnector: { type: Boolean, default: true },
     variant: { type: String, default: 'button' },
     isFirst: { type: Boolean, default: false },
-    instructionsAbove: { type: Boolean, default: false },
-    instructions: { type: String, default: '' },
 });
 
 const label = computed(() => props.label ? __(props.label) : __('Add Block'));
diff --git a/resources/js/components/fieldtypes/replicator/Replicator.vue b/resources/js/components/fieldtypes/replicator/Replicator.vue
index 4981e72add8..07f168663b9 100644
--- a/resources/js/components/fieldtypes/replicator/Replicator.vue
+++ b/resources/js/components/fieldtypes/replicator/Replicator.vue
@@ -60,8 +60,6 @@
                                             :index="index"
                                             :enabled="canAddSet"
                                             :is-first="index === 0"
-                                            :instructions-above="instructionsAbove"
-                                            :instructions="config.instructions"
                                             @added="addSet"
                                         />
                                     </template>
@@ -77,8 +75,6 @@
                             :index="value.length"
                             :label="config.button_label"
                             :is-first="value.length === 0"
-                            :instructions-above="instructionsAbove"
-                            :instructions="config.instructions"
                             @added="addSet"
                         />
                     </section>

From 5885a04068895bc2d701163c9e39ec0a8949cfe9 Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Tue, 2 Dec 2025 16:02:56 +0000
Subject: [PATCH 09/14] Restore and tweak first connector now that we have more
 space at the top to allow for the "more actions" dots

---
 .../js/components/fieldtypes/replicator/AddSetButton.vue     | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/resources/js/components/fieldtypes/replicator/AddSetButton.vue b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
index 285aa374129..2d6f113daf9 100644
--- a/resources/js/components/fieldtypes/replicator/AddSetButton.vue
+++ b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
@@ -16,8 +16,9 @@
                 :class="{ '-mt-2': isFirst }"
             >
                 <div
-                    v-if="showConnector && !isFirst"
-                    class="absolute group-hover:opacity-0 transition-opacity delay-10 duration-250 inset-y-0 left-3.5 border-l-1 border-gray-400 dark:border-gray-600 border-dashed z-0 dark:bg-gray-850 h-full opacity-100"
+                    v-if="showConnector"
+                    class="absolute group-hover:opacity-0 transition-opacity delay-10 duration-250 inset-y-0 left-3.5 border-l-1 border-gray-400 dark:border-gray-600 border-dashed z-0 dark:bg-gray-850"
+                    :class="isFirst ? 'h-[65%] top-[35%] opacity-50' : 'h-full opacity-100'"
                 />
                 <button
                     class="absolute inset-0 h-full w-full opacity-0 group-hover:opacity-100 transition-opacity delay-10 duration-250 cursor-pointer"

From ad99fc5282fc5d0ebae939a1f90cd515cbe922d8 Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Tue, 2 Dec 2025 21:05:30 +0000
Subject: [PATCH 10/14] Add dark mode

---
 resources/js/components/fieldtypes/replicator/AddSetButton.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/js/components/fieldtypes/replicator/AddSetButton.vue b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
index 2d6f113daf9..3df136b8832 100644
--- a/resources/js/components/fieldtypes/replicator/AddSetButton.vue
+++ b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
@@ -24,7 +24,7 @@
                     class="absolute inset-0 h-full w-full opacity-0 group-hover:opacity-100 transition-opacity delay-10 duration-250 cursor-pointer"
                 >
                     <div class="h-full flex flex-col justify-center">
-                        <div class="rounded-full bg-[linear-gradient(90deg,theme(colors.gray.100)_0%,theme(colors.gray.200)_50%,theme(colors.gray.100)_100%)] h-2" />
+                        <div class="rounded-full bg-[linear-gradient(90deg,theme(colors.gray.100)_0%,theme(colors.gray.200)_50%,theme(colors.gray.100)_100%)] dark:bg-[linear-gradient(90deg,theme(colors.gray.800)_0%,theme(colors.gray.700)_50%,theme(colors.gray.800)_100%)] h-2" />
                     </div>
                 </button>
                 <Button v-if="enabled" round icon="plus" size="sm" class="-my-4 z-3 opacity-0 group-hover:opacity-100 transition-opacity delay-10 duration-250" />

From eadc836f8d827fc8b66170fc0b7519fd350ad57b Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Thu, 4 Dec 2025 09:59:20 +0000
Subject: [PATCH 11/14] Pull up field actions a touch to compensate for the
 adding a new replicator set at the top

---
 resources/js/components/field-actions/FieldActions.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/js/components/field-actions/FieldActions.vue b/resources/js/components/field-actions/FieldActions.vue
index 6cf836bda85..75070ecc678 100644
--- a/resources/js/components/field-actions/FieldActions.vue
+++ b/resources/js/components/field-actions/FieldActions.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="flex relative items-center gap-1 -top-0.5">
+    <div class="flex relative items-center gap-1 -top-1">
         <Dropdown v-if="hasNonQuickActions">
             <template #trigger>
                 <Button icon="dots" variant="ghost" size="xs" :aria-label="__('Open dropdown menu')" />

From 85a19f5d2c0de3d8f26b60d9ee52a7d1fbd8816e Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Thu, 4 Dec 2025 10:08:13 +0000
Subject: [PATCH 12/14] Nudge replicator spacing to account for quick actions

---
 .../js/components/fieldtypes/replicator/AddSetButton.vue      | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/resources/js/components/fieldtypes/replicator/AddSetButton.vue b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
index 3df136b8832..df2dbb032c0 100644
--- a/resources/js/components/fieldtypes/replicator/AddSetButton.vue
+++ b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
@@ -13,12 +13,12 @@
         <template #trigger>
             <div
                 class="flex justify-center relative group py-3"
-                :class="{ '-mt-2': isFirst }"
+                :class="{ 'py-3.5 -mt-2': isFirst }"
             >
                 <div
                     v-if="showConnector"
                     class="absolute group-hover:opacity-0 transition-opacity delay-10 duration-250 inset-y-0 left-3.5 border-l-1 border-gray-400 dark:border-gray-600 border-dashed z-0 dark:bg-gray-850"
-                    :class="isFirst ? 'h-[65%] top-[35%] opacity-50' : 'h-full opacity-100'"
+                    :class="isFirst ? 'h-[65%] top-[35%] opacity-60' : 'h-full opacity-100'"
                 />
                 <button
                     class="absolute inset-0 h-full w-full opacity-0 group-hover:opacity-100 transition-opacity delay-10 duration-250 cursor-pointer"

From 649db7de7bb5937d59426f0d7a7a9cd9767f4e30 Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Thu, 4 Dec 2025 10:20:40 +0000
Subject: [PATCH 13/14] Nudge the top "add set" button down so it's vertically
 the same as the others

---
 .../js/components/fieldtypes/replicator/AddSetButton.vue      | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/resources/js/components/fieldtypes/replicator/AddSetButton.vue b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
index df2dbb032c0..75f9d0f8594 100644
--- a/resources/js/components/fieldtypes/replicator/AddSetButton.vue
+++ b/resources/js/components/fieldtypes/replicator/AddSetButton.vue
@@ -13,12 +13,12 @@
         <template #trigger>
             <div
                 class="flex justify-center relative group py-3"
-                :class="{ 'py-3.5 -mt-2': isFirst }"
+                :class="{ 'py-3.5 -mt-2 top-0.5': isFirst }"
             >
                 <div
                     v-if="showConnector"
                     class="absolute group-hover:opacity-0 transition-opacity delay-10 duration-250 inset-y-0 left-3.5 border-l-1 border-gray-400 dark:border-gray-600 border-dashed z-0 dark:bg-gray-850"
-                    :class="isFirst ? 'h-[65%] top-[35%] opacity-60' : 'h-full opacity-100'"
+                    :class="isFirst ? 'h-[65%] top-[30%] opacity-60' : 'h-full opacity-100'"
                 />
                 <button
                     class="absolute inset-0 h-full w-full opacity-0 group-hover:opacity-100 transition-opacity delay-10 duration-250 cursor-pointer"

From 49e10f2264040cde214472fc569a1e8b7b967683 Mon Sep 17 00:00:00 2001
From: Jason Varga <jason@pixelfear.com>
Date: Mon, 8 Dec 2025 14:41:56 -0500
Subject: [PATCH 14/14] unused

---
 resources/js/components/fieldtypes/replicator/Replicator.vue | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/resources/js/components/fieldtypes/replicator/Replicator.vue b/resources/js/components/fieldtypes/replicator/Replicator.vue
index 134b2114999..f9ee88045ab 100644
--- a/resources/js/components/fieldtypes/replicator/Replicator.vue
+++ b/resources/js/components/fieldtypes/replicator/Replicator.vue
@@ -154,10 +154,6 @@ export default {
             return `${__(this.config.display)}: ${__n(':count set|:count sets', this.value.length)}`;
         },
 
-        instructionsAbove() {
-            return this.config.instructions_position !== 'below';
-        },
-
         internalFieldActions() {
             return [
                 {