feat(ui): add FieldButton component (#2448)

docs/ai/context/ui-components.md

@@ -527,6 +527,23 @@ Tab-like selection using radio buttons with animated indicator.
 
 All Field components wrap a base input with `label`, `description`, and consistent layout. Common slots: `label`, `description`.
 
+### FieldButton
+
+Displays field information on the left and a compact action button on the right.
+
+| Prop | Type | Default | Description |
+|------|------|---------|-------------|
+| `label` | `string` | *(required)* | Field label |
+| `description` | `string?` | — | Helper text |
+| `buttonLabel` | `string` | *(required)* | Action button label |
+| `buttonIcon` | `string?` | — | UnoCSS/Iconify class for the action button |
+| `disabled` | `boolean?` | — | Prevents the action |
+| `loading` | `boolean?` | — | Shows a spinner and prevents the action |
+
+**Slots**: `label`, `description`
+
+**Emits**: `click(event: MouseEvent)`
+
 ### FieldInput
 
 | Prop | Type | Default | Description |

packages/ui/src/components/form/field/field-button.vue

@@ -0,0 +1,42 @@
+<script setup lang="ts">
+import { Button } from '../../misc'
+
+const props = defineProps<{
+  label: string
+  description?: string
+  buttonLabel: string
+  buttonIcon?: string
+  disabled?: boolean
+  loading?: boolean
+}>()
+
+const emit = defineEmits<{
+  click: [event: MouseEvent]
+}>()
+</script>
+
+<template>
+  <div :class="['flex items-center gap-4']">
+    <div :class="['min-w-0 flex-1']">
+      <div :class="['flex items-center gap-1 text-sm font-medium']">
+        <slot name="label">
+          {{ props.label }}
+        </slot>
+      </div>
+      <div :class="['text-xs opacity-60']">
+        <slot name="description">
+          {{ props.description }}
+        </slot>
+      </div>
+    </div>
+    <Button
+      :label="props.buttonLabel"
+      :icon="props.buttonIcon"
+      :disabled="props.disabled"
+      :loading="props.loading"
+      size="sm"
+      variant="secondary"
+      @click="emit('click', $event)"
+    />
+  </div>
+</template>

packages/ui/src/components/form/field/index.ts

@@ -1,3 +1,4 @@
+export { default as FieldButton } from './field-button.vue'
 export { default as FieldCheckbox } from './field-checkbox.vue'
 export { default as FieldCombobox } from './field-combobox-select.vue'
 export { default as FieldInputFile } from './field-input-file.vue'