fix(codegen-ts-react): give dispatched form controls an accessible name

The view-kind-dispatched controls (<select>/<textarea>/checkbox/radio) bind via
form.register(...), which does not carry the aria-label that form.input.<field>
attaches — leaving them with no accessible name (a regression for enum fields,
which previously rendered via scalarBlock/form.input with an aria-label). Add
aria-label={<entity>.<field>.label} to each dispatched control (the group name
on the radio <fieldset>), matching the scalar path. Add aria-label assertions +
a non-required-dropdown empty-option test; correct the stale header comment.

Found by the final whole-branch review.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01NGQ7oSuNcjhsMHWwZzhBwr

Author: dmealing

server/typescript/packages/codegen-ts-react/src/templates/form-file.ts

@@ -1,11 +1,15 @@
 // React form template — emits a per-entity Form component that delegates
-// to useEntityForm from @metaobjectsdev/react. The generated file
-// is ~25 lines: wire up the form, render each field's pre-bound input,
-// let the helper carry all metadata-derived attrs.
+// to useEntityForm from @metaobjectsdev/react. Each visible field is
+// dispatched to a control by its declared view kind.
 //
 // What gets emitted:
-//   - A `<EntityName>Form` component that calls useEntityForm and spreads
-//     form.input.<field> onto <input> elements.
+//   - A `<EntityName>Form` component. A plain scalar field (no view kind)
+//     spreads form.input.<field> onto a typed <input> (carries aria-label
+//     via useEntityForm's `.input` accessor). A field with a view kind
+//     (view.textarea/checkbox/radio, or an enum defaulting to a dropdown)
+//     is dispatched by fieldControlFor to a <select>/<textarea>/checkbox
+//     <input>/radio <fieldset>, bound via `{...form.register("<name>")}`
+//     and given a matching explicit `aria-label`.
 //   - Per-entity onSubmit/defaultValues typed against the Row type.
 //
 // Fields excluded from the form by default:
@@ -344,20 +348,20 @@ ${control}
       const options = values.map((v) => `            <option value="${v}">${v}</option>`).join("\n");
       return labelAndError(
         name,
-        `          <select className="metaobjects-field-input" {...form.register("${name}")}>\n${empty}${options}\n          </select>`,
+        `          <select aria-label={${entityName}.${name}.label} className="metaobjects-field-input" {...form.register("${name}")}>\n${empty}${options}\n          </select>`,
       );
     }
     if (kind === VIEW_SUBTYPE_TEXTAREA) {
       // Configurable @rows is deferred (see the spec's Deferred work); default to 4.
       return labelAndError(
         name,
-        `          <textarea className="metaobjects-field-input" rows={4} {...form.register("${name}")} />`,
+        `          <textarea aria-label={${entityName}.${name}.label} className="metaobjects-field-input" rows={4} {...form.register("${name}")} />`,
       );
     }
     if (kind === VIEW_SUBTYPE_CHECKBOX) {
       return labelAndError(
         name,
-        `          <input type="checkbox" className="metaobjects-field-checkbox" {...form.register("${name}")} />`,
+        `          <input aria-label={${entityName}.${name}.label} type="checkbox" className="metaobjects-field-checkbox" {...form.register("${name}")} />`,
       );
     }
     if (kind === VIEW_SUBTYPE_RADIO) {
@@ -368,7 +372,10 @@ ${control}
             `            <label className="metaobjects-field-radio"><input type="radio" value="${v}" {...form.register("${name}")} /> ${v}</label>`,
         )
         .join("\n");
-      return labelAndError(name, `          <fieldset className="metaobjects-field-radios">\n${radios}\n          </fieldset>`);
+      return labelAndError(
+        name,
+        `          <fieldset aria-label={${entityName}.${name}.label} className="metaobjects-field-radios">\n${radios}\n          </fieldset>`,
+      );
     }
     return scalarBlock(name);
   };

server/typescript/packages/codegen-ts-react/test/form-view-dispatch.test.ts

@@ -33,6 +33,8 @@ async function loadModel(): Promise<{ root: MetaRoot; report: MetaObject }> {
                   { "field.boolean": { name: "archived", children: [{ "view.checkbox": {} }] } },
                   // view.radio over enum values -> radio fieldset
                   { "field.enum": { name: "tier", "@values": ["free", "pro"], children: [{ "view.radio": {} }] } },
+                  // non-required enum with an explicit dropdown -> empty option IS emitted
+                  { "field.enum": { name: "priority", "@values": ["low", "high"], children: [{ "view.dropdown": {} }] } },
                   // @formExclude -> absent from the form
                   { "field.string": { name: "internalNote", "@formExclude": true } },
                 ],
@@ -71,6 +73,7 @@ describe("form controls — view-kind dispatch", () => {
     expect(out).toContain('<option value="active">');
     expect(out).toContain('form.register("status")');
     expect(out).not.toMatch(/form\.input\.status/);
+    expect(out).toContain("aria-label={Report.status.label}");
   });
 
   test("view.textarea renders a <textarea> with the default row count", async () => {
@@ -79,13 +82,15 @@ describe("form controls — view-kind dispatch", () => {
     expect(out).toContain("<textarea");
     expect(out).toContain("rows={4}");
     expect(out).toContain('form.register("notes")');
+    expect(out).toContain("aria-label={Report.notes.label}");
   });
 
   test("view.checkbox renders a checkbox input", async () => {
     const { root, report } = await loadModel();
     const out = renderFormFile(report, ctxFor(root));
     expect(out).toContain('type="checkbox"');
     expect(out).toContain('form.register("archived")');
+    expect(out).toContain("aria-label={Report.archived.label}");
   });
 
   test("view.radio renders a radio fieldset over the enum values", async () => {
@@ -95,6 +100,14 @@ describe("form controls — view-kind dispatch", () => {
     expect(out).toContain('type="radio"');
     expect(out).toContain('value="free"');
     expect(out).toContain('value="pro"');
+    expect(out).toContain("aria-label={Report.tier.label}");
+  });
+
+  test("a non-required dropdown emits the empty option", async () => {
+    const { root, report } = await loadModel();
+    const out = renderFormFile(report, ctxFor(root));
+    expect(out).toContain('<option value="">');
+    expect(out).toContain("aria-label={Report.priority.label}");
   });
 
   test("a scalar string with no view keeps the existing bound <input>", async () => {