FIX: applies full class to field (#29190)

Prior to this fix the format class was only applied to the child control, but in case of full we also need to ensure the parent wrapping field is also taking 100% width otherwise we are at risk of having a field of the width of its content.

app/assets/javascripts/discourse/app/form-kit/components/fk/control-wrapper.gjs

@@ -1,6 +1,7 @@
 import Component from "@glimmer/component";
 import { concat } from "@ember/helper";
 import { action } from "@ember/object";
+import { eq } from "truth-helpers";
 import FKLabel from "discourse/form-kit/components/fk/label";
 import FKMeta from "discourse/form-kit/components/fk/meta";
 import FKText from "discourse/form-kit/components/fk/text";
@@ -43,6 +44,7 @@ export default class FKControlWrapper extends Component {
         "form-kit__field"
         (concat "form-kit__field-" this.controlType)
         (if this.error "has-error")
+        (if (eq @format "full") "--full")
       }}
       data-disabled={{@field.disabled}}
       data-name={{@field.name}}

app/assets/javascripts/discourse/tests/integration/components/form-kit/field-test.gjs

@@ -147,6 +147,23 @@ module("Integration | Component | FormKit | Field", function (hooks) {
     assert.dom(".form-kit__container-title").doesNotExist();
   });
 
+  test("@format full", async function (assert) {
+    await render(<template>
+      <Form as |form|>
+        <form.Field
+          @name="foo"
+          @title="Foo"
+          @format="full"
+          as |field|
+        ><field.Input /></form.Field>
+      </Form>
+    </template>);
+
+    assert
+      .dom(".form-kit__field.--full")
+      .exists("it applies the --full class to the field");
+  });
+
   test("@onSet", async function (assert) {
     const onSetWasCalled = assert.async();
 

app/assets/stylesheets/common/form-kit/_field.scss

@@ -5,6 +5,10 @@
     width: var(--form-kit-medium-input);
   }
 
+  &.--full {
+    width: 100%;
+  }
+
   &-textarea,
   &-composer,
   &-code,