From cca1cf406ecc55a05c925f5c72e67fc9f9869410 Mon Sep 17 00:00:00 2001
From: lazerg <lazerg2@gmail.com>
Date: Sat, 19 Sep 2026 02:19:31 +0500
Subject: [PATCH 1/2] [6.x] Fix field alignment when field actions are visible

---
 .../components/field-actions/FieldActions.vue |  2 +-
 .../tests/browser/FieldActionsLayout.test.js  | 71 +++++++++++++++++++
 2 files changed, 72 insertions(+), 1 deletion(-)
 create mode 100644 resources/js/tests/browser/FieldActionsLayout.test.js

diff --git a/resources/js/components/field-actions/FieldActions.vue b/resources/js/components/field-actions/FieldActions.vue
index 53d7bb35085..b4e37cb10aa 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-1">
+    <div class="flex relative items-center gap-1 -top-1 h-5">
         <Dropdown v-if="hasNonQuickActions">
             <template #trigger>
                 <Button icon="dots" variant="ghost" size="xs" :aria-label="__('Open dropdown menu')" />
diff --git a/resources/js/tests/browser/FieldActionsLayout.test.js b/resources/js/tests/browser/FieldActionsLayout.test.js
new file mode 100644
index 00000000000..30468110bbf
--- /dev/null
+++ b/resources/js/tests/browser/FieldActionsLayout.test.js
@@ -0,0 +1,71 @@
+import { afterEach, expect, test } from 'vitest';
+import { mount } from '@vue/test-utils';
+import { h, nextTick, Teleport } from 'vue';
+import * as Globals from '@/bootstrap/globals';
+import Text from '@/components/fieldtypes/TextFieldtype.vue';
+import ElementContainer from '@/components/ElementContainer.vue';
+import Container from '@/components/ui/Publish/Container.vue';
+import Fields from '@/components/ui/Publish/Fields.vue';
+import { Button } from '@ui';
+import FieldsProvider from '@/components/ui/Publish/FieldsProvider.vue';
+import '../../../css/app.css';
+
+Object.assign(window, Globals);
+window.__ = key => key ?? '';
+const components = {
+    'text-fieldtype': Text,
+};
+window.Statamic = {
+    $app: { component: name => components[name] },
+    $config: { get: key => key === 'sites' ? [{ handle: 'default', direction: 'ltr' }] : undefined },
+    $dirty: { has: () => false, add: () => {}, remove: () => {} },
+    $events: { $emit: () => {} },
+    $fieldActions: {
+        get: () => [{ title: 'Remove', run: () => {}, visible: ({ value }) => !! value }],
+    },
+};
+
+let wrapper;
+let host;
+afterEach(() => {
+    wrapper?.unmount();
+    host?.remove();
+});
+
+const text = (handle) => ({ handle, display: handle, type: 'text', width: 50, actions: true });
+
+async function render(values) {
+    host = document.createElement('div');
+    host.style.cssText = 'container: panel / inline-size; width: 1000px;';
+    document.body.append(host);
+    wrapper = mount(Container, {
+        attachTo: host,
+        props: { blueprint: { tabs: [] }, modelValue: values, meta: {}, site: 'default' },
+        global: {
+            components: {
+                ...components,
+                'ui-button': Button,
+                'element-container': ElementContainer,
+                portal: {
+                    props: ['disabled', 'name', 'provide'],
+                    setup: (props, { slots }) => () => h(Teleport, { to: 'body', disabled: props.disabled }, slots.default()),
+                },
+                'publish-field-fullscreen-header': { template: '<div />' },
+            },
+            directives: { tooltip: () => {} },
+            mocks: { __: window.__ },
+        },
+        slots: { default: () => h(FieldsProvider, { fields: [text('first'), text('second')] }, () => h(Fields)) },
+    });
+    await nextTick();
+    await new Promise(resolve => requestAnimationFrame(resolve));
+}
+
+function rectangle(id) {
+    return document.getElementById(`field_${id}`).getBoundingClientRect();
+}
+
+test('field actions do not push their field below a neighbour without them', async () => {
+    await render({ first: 'One' });
+    expect(Math.abs(rectangle('first').top - rectangle('second').top)).toBeLessThan(1);
+});

From ad3bde26977895b0e90052421f8c298dafc276ba Mon Sep 17 00:00:00 2001
From: Jason Varga <jason@pixelfear.com>
Date: Tue, 22 Sep 2026 16:15:44 -0400
Subject: [PATCH 2/2] Remove test, overkill for this fix

---
 .../tests/browser/FieldActionsLayout.test.js  | 71 -------------------
 1 file changed, 71 deletions(-)
 delete mode 100644 resources/js/tests/browser/FieldActionsLayout.test.js

diff --git a/resources/js/tests/browser/FieldActionsLayout.test.js b/resources/js/tests/browser/FieldActionsLayout.test.js
deleted file mode 100644
index 30468110bbf..00000000000
--- a/resources/js/tests/browser/FieldActionsLayout.test.js
+++ /dev/null
@@ -1,71 +0,0 @@
-import { afterEach, expect, test } from 'vitest';
-import { mount } from '@vue/test-utils';
-import { h, nextTick, Teleport } from 'vue';
-import * as Globals from '@/bootstrap/globals';
-import Text from '@/components/fieldtypes/TextFieldtype.vue';
-import ElementContainer from '@/components/ElementContainer.vue';
-import Container from '@/components/ui/Publish/Container.vue';
-import Fields from '@/components/ui/Publish/Fields.vue';
-import { Button } from '@ui';
-import FieldsProvider from '@/components/ui/Publish/FieldsProvider.vue';
-import '../../../css/app.css';
-
-Object.assign(window, Globals);
-window.__ = key => key ?? '';
-const components = {
-    'text-fieldtype': Text,
-};
-window.Statamic = {
-    $app: { component: name => components[name] },
-    $config: { get: key => key === 'sites' ? [{ handle: 'default', direction: 'ltr' }] : undefined },
-    $dirty: { has: () => false, add: () => {}, remove: () => {} },
-    $events: { $emit: () => {} },
-    $fieldActions: {
-        get: () => [{ title: 'Remove', run: () => {}, visible: ({ value }) => !! value }],
-    },
-};
-
-let wrapper;
-let host;
-afterEach(() => {
-    wrapper?.unmount();
-    host?.remove();
-});
-
-const text = (handle) => ({ handle, display: handle, type: 'text', width: 50, actions: true });
-
-async function render(values) {
-    host = document.createElement('div');
-    host.style.cssText = 'container: panel / inline-size; width: 1000px;';
-    document.body.append(host);
-    wrapper = mount(Container, {
-        attachTo: host,
-        props: { blueprint: { tabs: [] }, modelValue: values, meta: {}, site: 'default' },
-        global: {
-            components: {
-                ...components,
-                'ui-button': Button,
-                'element-container': ElementContainer,
-                portal: {
-                    props: ['disabled', 'name', 'provide'],
-                    setup: (props, { slots }) => () => h(Teleport, { to: 'body', disabled: props.disabled }, slots.default()),
-                },
-                'publish-field-fullscreen-header': { template: '<div />' },
-            },
-            directives: { tooltip: () => {} },
-            mocks: { __: window.__ },
-        },
-        slots: { default: () => h(FieldsProvider, { fields: [text('first'), text('second')] }, () => h(Fields)) },
-    });
-    await nextTick();
-    await new Promise(resolve => requestAnimationFrame(resolve));
-}
-
-function rectangle(id) {
-    return document.getElementById(`field_${id}`).getBoundingClientRect();
-}
-
-test('field actions do not push their field below a neighbour without them', async () => {
-    await render({ first: 'One' });
-    expect(Math.abs(rectangle('first').top - rectangle('second').top)).toBeLessThan(1);
-});