swarm-ui: add required hive dropdown to CreateAgentPage

Closes #3434.

Agent creation had no way to record which hive an agent runs on.
POST /api/agents now requires a hive, so the roster fetched off
GET /api/hives backs a required SelectField here rather than a
free-text field. Single-hive swarms auto-select their only hive;
multi-hive swarms show a disabled placeholder and force an explicit
choice.

Rebuilt on top of the #3448 form kit (merged after this branch was
originally opened): reuses TextField/SelectField/Button instead of
page-scoped input chrome, and SelectField gains an optional disabled
placeholder option (needed for the loading/empty/multi-hive states
here, generalizes cleanly for future callers). Form goes back to a
column layout per mara's earlier visual feedback on this same page
(two fields of different natural width no longer line up in a row).

frontend/packages/swarm-ui/src/ui/select-field/SelectField.tsx

@@ -18,6 +18,8 @@ export function SelectField({
   onChange,
   options,
   required,
+  disabled,
+  placeholder,
 }: {
   id: string;
   label: string;
@@ -25,6 +27,13 @@ export function SelectField({
   onChange: (value: string) => void;
   options: SelectOption[];
   required?: boolean;
+  disabled?: boolean;
+  // Rendered as a disabled, always-first `value=""` option — for a
+  // required select with no default (e.g. a multi-hive roster: no
+  // single right answer to pre-select), so the control shows something
+  // other than silently landing on whatever option happens to be first.
+  // Omit when the field always has a real default (`value` never `''`).
+  placeholder?: string;
 }) {
   return (
     <FormField label={label} htmlFor={id}>
@@ -33,8 +42,14 @@ export function SelectField({
         class="ui-form-control"
         value={value}
         required={required}
+        disabled={disabled}
         onChange={(e) => onChange((e.target as HTMLSelectElement).value)}
       >
+        {placeholder !== undefined && (
+          <option value="" disabled>
+            {placeholder}
+          </option>
+        )}
         {options.map((o) => (
           <option key={o.value} value={o.value}>
             {o.label}