From 662b9391d8013ae3a49e2e47a80f5406b8d54959 Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Fri, 23 Oct 2026 12:03:58 +0100
Subject: [PATCH 1/2] Keep wrapped combobox chips evenly spaced

- Each chip had its own mt-2 on top of the row's gap-2, so wrapped rows sat 16px apart while chips side by side were 8px apart
- The space above the chips now goes on the row, once, and only when something's selected
- It's 10px rather than 8px, to clear the input's shadow
---
 resources/js/components/ui/Combobox/Combobox.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/resources/js/components/ui/Combobox/Combobox.vue b/resources/js/components/ui/Combobox/Combobox.vue
index b9ce2d9686a..5f030d19379 100644
--- a/resources/js/components/ui/Combobox/Combobox.vue
+++ b/resources/js/components/ui/Combobox/Combobox.vue
@@ -608,11 +608,11 @@ defineExpose({
                 :model-value="modelValue"
                 @update:modelValue="updateModelValue"
             >
-                <div class="flex flex-wrap gap-2">
+                <div class="flex flex-wrap gap-2" :class="{ 'mt-2.5': selectedOptions.length }">
                     <div
                         v-for="option in selectedOptions"
                         :key="getOptionValue(option)"
-                        class="sortable-item mt-2 cursor-grab active:cursor-grabbing"
+                        class="sortable-item cursor-grab active:cursor-grabbing"
                     >
                         <Badge pill size="lg" class="[&>*]:st-text-trim-ex-alphabetic">
                             <Icon v-if="option.icon" :name="option.icon" />

From 258673d04f2337482fa65ddc3fe3fcf1a43fe813 Mon Sep 17 00:00:00 2001
From: Jay George <contact@jaygeorge.co.uk>
Date: Fri, 23 Oct 2026 12:05:12 +0100
Subject: [PATCH 2/2] Space wrapped validation rule chips the same way

- The validation rules builder uses the same chip row as the combobox, so it had the same 16px gap between wrapped rows
---
 resources/js/components/field-validation/Builder.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/resources/js/components/field-validation/Builder.vue b/resources/js/components/field-validation/Builder.vue
index 2f6eaa6ad88..faa5472b0b8 100644
--- a/resources/js/components/field-validation/Builder.vue
+++ b/resources/js/components/field-validation/Builder.vue
@@ -68,11 +68,11 @@
                 :mirror="false"
                 v-model="rules"
             >
-                <div class="flex flex-wrap gap-2">
+                <div class="flex flex-wrap gap-2" :class="{ 'mt-2.5': rules.length }">
                     <div
                         v-for="rule in rules"
                         :key="rule"
-                        class="sortable-item mt-2"
+                        class="sortable-item"
                     >
                         <Badge pill size="lg">
                             {{ rule }}